﻿@import url('form.css');
@import url('menu.css');
@import url('page.css');

@font-face
{
font-family:UTMPenumbra;
src: url('../Style/UTMPenumbra.ttf'); /* IE9 */
}
body
{
    font-family:Arial;
    font-size:12px; 
    width:100%;
    height:100%;   
    margin:0;     
    background:#ededed;      
}
h1
{
    font-size:inherit; 
    font-weight:bold; 
    padding:0;
    line-height:inherit;
    margin:0;
}
html
{
    height:100%;       
}
#aspNetFrom
{
    width:100%;
    height:100%;      
}

img{border:none}
a{text-decoration:none}
.row{margin:0}
.tb{width:100%}
table tr td{
    vertical-align:top;
}

#container
{     
    width:1004px;
    margin:auto;    
    padding-bottom:20px;    
}
#container #col_left
{         
    padding:0;        
}
.wrap_content
{     
    background:#ffffff;        
    box-shadow: 0 0 5px #cccccc;
    margin-bottom:20px;
}
.wrap_content .title
{     
    line-height:30px;    
    background:#007ffe;
    color:#ffffff;
    font-size:16px;
    font-weight:bold;
    text-align:left;    
    padding:0 0 0 20px;
}
.wrap_content .title span
{     
    float:right;
    color:#ffffff;
    background:red;
    padding:0 10px;        
    font-size:11px;
}
#container #col_right
{         
    padding:0 0 0 20px;    
}
.wrap_content2
{         
    background:#ffffff;    
    box-shadow: 0 0 5px #cccccc;
    margin-bottom:27px;
    border-bottom:3px solid #cccccc;
}
.wrap_content2 a
{         
    color:#0072bc;
    font-size:12px;
    font-weight:bold;
}
.wrap_content2 a:hover
{         
    color:#ff0000;    
}
.wrap_content2 .title
{     
    line-height:30px;    
    background:#007ffe;
    color:#ffffff;
    font-size:16px;
    font-weight:bold;
    text-align:left;    
    padding:0 0 0 20px;
    margin-bottom:15px;
}
.wrap_content2 a .viewall
{     
    line-height:25px;    
    background:#cccccc;
    color:#ffffff;
    font-size:12px;
    font-weight:bold;
    text-align:center;            
}
.wrap_content2 a:hover .viewall
{        
    background:#ff0000;    
}
.line
{    
    background:url(../images/line.jpg) repeat-x;
    margin-top:7px;
    padding-bottom:7px;
}
.item_other
{
    background:url(../images/bullet.png) 15px 7px no-repeat;
    padding-left:30px;
}

.text_body
{
    line-height:24px;
    font-size:14px;
    color:#454545;
    text-align:left;
    padding:15px;
}

.txt_other a
{
    color:#454545;
    padding-left:20px;
    font-size:14px;
    background:url(../images/bullet.png) left center no-repeat;
}
.txt_other a:hover
{
    color:#ff0000;
}
.text_link
{
    color:#005799;
    font-weight:bold;
    font-size:16px;
}
a.text_link
{
    color:#005799;
    font-weight:bold;
    font-size:16px;
}
.menu_left
{
    margin-bottom:25px;
}
.menu_left a div
{
    padding:5px 15px;
    border-bottom:4px solid #cccccc;
    color:#0072bc;
    font-size:14px;
    font-weight:bold;
    background:#ffffff;
    margin-bottom:5px;
    box-shadow:0 0 5px #dddddd;

}
.menu_left a:hover div, .menu_left a.active div
{
    background:#007ffe;
    color:#ffffff;
    border-bottom:4px solid #ff0000;
}
/* HEADER */

header
{                                 
    width:1004px;    
    padding-top:10px;            
    margin:auto;
    box-shadow:0 0 5px #cccccc;      
    margin-bottom:20px;
    background:#ffffff;
}
.logo
{
    float:left;    
    padding-bottom:10px;
}



#search
{
    margin-left:15px;
}
#search .search
{
    background:#f3f3f3 url(../images/btn_search.png) 155px center no-repeat;
    border:none;
    height:25px;
    width:180px;
    padding:0 30px 0 10px;
}
#search .btn_search
{    
    background:transparent;
    color:#ffffff;      
    border:none;
    height:23px;
    margin-top:1px;
    width:25px;   
    position:absolute;
    cursor:pointer;    
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin-left:-25px;    
    font-size:11px;
    font-weight:bold;    
}
.cart_total
{
    background:red;
    color:#ffffff;
    width:14px;
    height:14px;
    font-size:9px;
    float:none;    
    padding:0px 4px;
    text-align:center;
    border-radius:7px;
    line-height:14px;
    font-weight:bold;
    box-shadow: 0 0 2px #000000;
    margin-left:5px;
    margin-top:6px;

}
.hotline
{
    background:url(../images/bg_hotline.png) no-repeat;
    line-height:44px;
    width:208px;
    padding-left:55px;
    height:50px;    
    float:right;
    margin-top:20px;
    color:#ffffff;
    font-size:18px;
    font-weight:bold;
}
.item_hotline
{
    background:url(../images/bg_hotline2.png) no-repeat;
    line-height:27px;
    width:127px;
    padding-left:17px;
    height:31px;            
    color:#ffffff;
    font-size:12px;
    font-weight:bold;
}
.item_hotline .name
{
    
}
.link_online
{
    color:#0072bc;
    font-size:12px;
    font-weight:bold;
    margin-bottom:10px;
    margin-top:5px;
}

.slide_likebox {
float:right;
width:273px;
height:397px;
background: url('../images/facebook_slide.png') no-repeat !important;
display:block;
color:#FFFFFF ;
right:-205px;
padding:0;
position:fixed;
top: 170px;
z-index:1002;
}

.cart_head
{
    margin-left:10px;
    padding-left:25px;
    background: url('../images/icon_cart_on.png') left center no-repeat;
    color:#d01f6f;
    font-size:13px;
    font-weight:bold;
    line-height:25px;
}
/* HEADER */

/* PRODUCT */
#container_pro
{
    width:1034px;
    margin:auto;
}
.item_pro_home
{
    box-shadow:0 0 5px #cccccc;
    background:#ffffff;
    padding:10px;
    text-align:center;
    margin-bottom:30px;
    -webkit-transition: box-shadow 0.4s ease-in-out;
          transition: box-shadow 0.4s ease-in-out;
}
.item_pro_home:hover
{
    box-shadow:0 0 5px #727070;   
}
.item_pro_home .price
{
    color:#ff0000;
    font-weight:bold;
    padding:10px 0;
}
.item_pro_home:hover a div
{
    color:#ff0000;
}
.item_pro_home img
{
    width:100%;
    height:180px;
}
.item_pro_home a div
{
    color:#0072bc;
    font-size:14px;
    line-height:20px;
    height:40px;
    overflow:hidden;
    margin-top:10px;
}
.item_pro_home .viewdetail
{   
    background:#0072bc;
    padding:0px 10px;
    text-align:center;    
    width:70px;
    height:25px;
    margin:auto;
    color:#ffffff;
    font-size:12px;
    line-height:25px;
}
.item_pro_home:hover .viewdetail
{   
    background:#ff0000;   
    color:#ffffff;    
}
.pro_detail
{

}
.pro_detail .title_tech
{
    color:#005799;
    padding-bottom:5px;
    font-weight:bold;
    font-size:16px;
    margin-top:20px;
    border-bottom:1px solid #cccccc;
}
.pro_detail .price
{
    color:#454545;
    font-size:16px;
    font-weight:bold;
} 
.pro_detail .price span
{
    color:#ff0000;    
}
.pro_detail .btn_cart
{
    color:#ffffff;
    font-size:12px;
    font-weight:bold;
    background:#0072bc;
    width:90px;
    height:30px;
    line-height:28px;
    text-align:center;
    border-bottom:3px solid red;
    margin-top:20px;
}
.title_pro
{
    color:#0072bc;
    font-weight:bold;
    font-size:16px;
}

/* PRODUCT */

/**/
.wrap_news
{

}
.wrap_news img
{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;    
    box-shadow:0 0 5px #dddddd;
}

.item_result
{
    box-shadow:0 0 5px #dddddd;
    background:#f1f1f1;
    padding:10px;
    margin-bottom:30px;
}
/**/
/* FOOTER */
#footer
{    
    padding:17px 0 10px 0;
    background:#007ffe url(../images/bg_shadown.png) no-repeat;
    border-top:3px solid #ff0000;
    box-shadow:0 0 5px #dddddd;
    opacity:0.9;
    text-align:center;
    width:1004px;         
    margin:auto;
    margin-top:15px;
}
#footer .footer_info
{
    padding-bottom:15px;
    min-height:160px;
}
#footer .footer_text
{
    color:#dedede;
    line-height:20px;
    text-align:left;    
}
#footer .footer_text a
{
    color:#dedede;  
    font-weight:bold;  
}
#footer .footer_text2
{
    color:#dedede;
    font-size:11px;  
    margin-top:5px;  
    text-align:left;
}
#footer .counter
{
    color:#dedede;
    font-size:11px;      
    text-align:left;
}
#footer .counter span
{
    font-weight:bold;
}
#footer .footer_text2 a
{
    color:#dedede;
    font-size:11px;    
}
#footer .share
{    
    float:right;
    text-align:right;
}
#footer .share img
{     
    width:36px;
    height:36px;
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    border-radius: 18px;
    border:2px solid #ffffff;
}
/* FOOTER */

/* CONTACT */
.info
{
    color:#454545;
    font-size:14px;
    line-height:24px;        
    text-align:left;
}
.title_cont
{
    color:#454545;
    font-size:14px;
    padding-bottom:10px;
    margin-bottom:20px;
    border-bottom:1px solid #dddddd;
}
.right_cont
{
    padding-left:30px;    
    background:url(../images/line_cont.png) no-repeat;
}
.agent
{
    padding:5px 0;
    font-size:14px;
}
.agent span
{
    font-weight:bold;
}
.modal-title
{
    text-align:center
}
.select_search
{
    border:2px solid #dddddd;
    color:#454545;
    font-size:12px;
    height:20px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
/* CONTACT */

@media (min-width: 1025px) {
.float-contact {
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 99999;
    text-align: left;
}
.chat-face, .hotline, .zalo, .face {
    overflow: hidden;
    border: none !important;
    background: none !important;
}   
.chat-face a, .hotline a, .zalo a, .face a {
    display: block;
    margin-bottom: 6px;
}
.chat-face a:hover, .hotline a:hover, .zalo a:hover, .face a:hover {
    background: #137b00;
    color: #fff;
    text-decoration: none;
}
.chat-face a img, .hotline a img, .zalo a img, .face a img {
    display: block;
    margin: auto;
}
.chat-face a, .hotline a, .zalo a, .face a {
    color: #000;
    text-align: center;
    display: block;
    font-size: 10px;
}   
}

@media (max-width: 1024px) {
.float-contact {
    position: fixed;
    bottom: 0px;
    z-index: 99999;
    display: flex;
    background: linear-gradient(#fff,#137b00);
    width: 100%;
    height: 63px;
}
.face, .chat-face, .zalo, .hotline {
    width: 25%;
    text-align: center;
    margin: auto;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
}
.face a img, .chat-face a img, .zalo a img, .hotline a img {
    display: block;
    margin: 5px auto 5px;
}
.face a, .chat-face a, .zalo a, .hotline a {
    color: #fff;
    font-size: 13px;
}

}



