/* call phone */
@keyframes zoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}
.mypage-alo-phone {
    position: fixed;
    left: 0;
    bottom: 0;
    visibility: visible;
    background-color: transparent;
    width: 110px;
    height: 110px;
    cursor: pointer;
    z-index: 200000 !important;
}
.mypage-alo-phone span{
  border-radius:16px;
  background:rgba(0, 137, 185, .7);
  margin:42px;
  padding:5px 10px 5px 50px;
  letter-spacing:2px;
  color:yellow;
  display:inline-block;
}
.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.mypage-alo-ph-circle {
    width: 90px;
    height: 90px;
    top: 12px;
    left: 12px;
    position: absolute;
    background-color: transparent;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid rgba(30,30,30,.4);
    opacity: .1;
    border-color: #0089b9;
    opacity: .5;
}
.mypage-alo-ph-circle-fill {
    width: 60px;
    height: 60px;
    top: 28px;
    left: 28px;
    position: absolute;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    background-color: rgba(0,175,242,.5);
    opacity: .75 !important;
}
.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}
.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}
.mypage-alo-ph-img-circle {
  width: 30px;
  height: 30px;
  top: 43px;
  left: 43px;
  position: absolute;
  background: rgba(30,30,30,.1) url(dienthoai.png) no-repeat center center;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  border: 2px solid transparent;
  opacity: .7;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  background-color: #0089b9;
  background-size: 70%;
}
/* end call phone */

/* header */
#topheader, #header {
margin-left:auto;
margin-right:auto;
width: 100%;
}
#topheader{
height: 85px;
background: #fff;
line-height: 85px;
box-shadow: 0 0 10px #333;
}
#header{
background: #e0301e;
height: 66px;
line-height: 66px;
}
#header p{margin:0}
#topheader #search {
float:right;
width:200px;
}
#topheader .button-search{
cursor: pointer;
width: 54px;
font-size: 27px;
left:-54px;
}
#topheader #search input{
height:45px;
background-color:#fff;
border:0;
padding: 0;
}
.english{
background:url(flag-en.png) left center no-repeat;
padding-left:20px;
}
.vietnam{
background:url(vietnam.png) left center no-repeat;
padding-left:30px;
}

/* hotline */
.contact-info i{margin-right: 6px;}
.contact-info a{margin-right: 20px;}
.hotline-mob{
color:#fff;
font-weight:700;
padding:5px 10px;
font-size:20px;
}
.tophotline{
margin-right: 12px;
}
.hotline-lines{
padding-top:10px;
color:red;
font-weight:700;
}
.hotline{
margin-bottom:10px;
background:#d81a15;
color:#fff;
text-align:center;
font-size:18px;
padding:7px 10px;
border-radius:3px;
font-weight:700;
}
.hotline-mobile{
color:orange
}
#searchkeywordinput{
background:#fff;
padding:5px 10px;
height:40px;
width:320px;
border:1px solid #eee;
}
/* logo */
.logo img{
margin-top:15px;
}
/* menu */
.fixedmenu{
top:0;
left:0;
right:0;
display:block;
    -moz-animation: fadeInDown .3s ease-in ;
    -webkit-animation: fadeInDown .3s ease-in ;
    animation:fadeInDown .3s ease-in ;
background:#fff;
z-index:100;
-webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,.3);
box-shadow: 0 2px 2px 0 rgba(0,0,0,.3);
height: 100%;
}

#menu-topmenu{height:66px; position: relative}
#menu-topmenu > ul{ float:right;height: 100%;}
#menu-topmenu > ul > li{height: 100%;}
#menu-topmenu > ul > li:hover{border-bottom: 4px solid white}
#menu-topmenu > ul > li.hassub{margin-right: 10px}
#menu-topmenu > ul > li:hover, #menu-topmenu > ul > li.selected{
	/* border-bottom: 2px solid #f30000; */
	/* background-color: #e7e7e7; */
}
#menu-topmenu ul li ul{
	position: absolute;
    width: 215px;
    line-height: 22px;
    background: #e0301e;
    display: none;
    z-index: 9999;
    top: 52px;
    padding-left: 0;
    margin-left: 0;
	border-top: 2px solid white
}
.hassub li {
    width: 100%;
}
#menu-topmenu ul li ul li ul{margin-left:186px;margin-top:0}
#menu-topmenu ul li:hover ul{display:block;}
#menu-topmenu > ul > li > a{color:#fff;padding:0 18px; display: inline-block; height: 100%; line-height: 66px; font-size: 16px;}
#menu-topmenu > ul > li > a:hover{color:#fff}
#menu-topmenu ul li ul a:hover{text-decoration: underline; color: white}
#menu-topmenu ul li ul a{
font-size:13px;
height:36px;
line-height:36px;
padding:0 15px;
color:#fff;
display:block;
z-index:6;
position:relative;
}
#menu-topmenu ul li a:hover {color:yellow}
#menu-topmenu > ul > li > a:hover {background: none}
.hassub > a{position: relative}
.hassub > a:after{
	content: "\f105";
    font-family: "fontello";
    position: absolute;
    right: 0px;
	font-size: 20px
}
#menu{
height:30px;
background: #982c14;
}
#menu > ul{
list-style:none;
margin:0 0 0 5px;
float:left;
padding:0;
}
#menu > ul > li:last-child{background:none}
#menu > ul > li{
position:relative;
display:inline-block;
z-index:20;
margin:0;
padding-right:10px;
background:url(line_menu.gif) right bottom no-repeat
}
#menu > ul > li > a {
font-size:13px;
color: #fff;
font-weight:700;
line-height:30px;
padding:0 17px;
text-decoration:none;
display:block;
z-index:6;
position:relative;
}

#menu > ul > li > div{
display:none;
position: absolute;
top:35px;
font-size:12px;
text-align:left;
z-index: 5;
}

#menu > ul > li > a:hover{
color:#eee;

}
#menu > ul > li:hover > div {
display: table;
width:250px;
padding-top: 10px;
}
#menu > ul > li > div > ul {
background-color:#098fc8;
    list-style: none;
    padding: 0 15px;
}
#menu > ul > li > div > ul li {
    border-bottom: 1px solid #00afef;
}
#menu > ul > li > div > ul li:last-child{
border-bottom:none;
}
#menu > ul > li > div > ul li a {
    color: #fff;
    display:block;
    padding:10px 0;
    text-transform: uppercase;
}
#menu > ul > li ul + ul {
padding-left: 20px;
}
/* mobile menu */
.accordionItem{border-top:1px solid #ddd;padding-top:10px}
#mobile-menu > ul > li.accordionItem.open > a > span{
	border-bottom: 2px solid;
    padding-bottom: 2px;
}
#menu-button{
margin:30px 0px 15px 15px;
text-indent:-99999px;
background:url(mobile-menu.png) center center no-repeat;
width:27px;
height:21px;
/* position: fixed; */
right: 0px;
z-index: 99;
}
#mobile-menu li {
    position: relative;
}
.menuItemHeading.hc {
    position: absolute;
    top: 11px;
    right: 10px;
    height: 30px;
    width: 17px;
    background: url(arrow-mn-r.png) no-repeat center center;
}
.open .menuItemHeading.hc {
    background: url(arrow-mn-d.png) no-repeat center center;
}
#mobile-menu ul,
#mobile-menu li{list-style:none;padding:10px 0;margin:0}
#mobile-menu li li{padding:3px 0}
#mobile-menu li ul{
padding-top:10px;
}
#mobile-menu ul ul a{font-weight:normal !important;padding:1px 10px;color: #666;font-size:16px;}
#mobile-menu > ul > li > a{
padding:1px 10px;
color:#000067 !important;
font-size:24px;
text-align:left;
display:block;
}
#mobile-menu > ul{
	margin-left:5px;
}
#mobile-menu a.red{
	color:#515151;
    font-size: 15px;
}
.cls .menuItemContent, .close .accordionItemContent{
	display:none;
}
.open .menuItemContent, .open .accordionItemContent{
	display:block;
}

.close-mobile{font-size: 30px;color:#000067;border-radius:3px;padding:6px 10px;margin:10px 10px 0 0;top:0;right:0; height: 30px;}
#search-mobile{
margin:10px 0 0 15px;
}
#menu #search-mobile .button-search{
right:auto;
left:230px;
top:10px;
}
#menu #search-mobile input{
width:255px;
background:#fff;
border-radius:3px;
padding-left:10px;
}
#mobile-menu input[name='search']{
	width: 75%;
	height: 30px;
	border: 0;
	padding-left: 0;
	border-bottom: 1px solid green;
}
/* share social */
.shareme{
	margin-top: 12px;
}
.shareme > span{padding-right:15px;}
.shareme > a {
background:url(social.png) no-repeat;
display:inline-block;
overflow:hidden;
width:70px;
height:25px;
margin-right:7px;
text-indent:-9999px;
}
.shareme > a.twitter-icon {
background-position:-76px 0;
}
.shareme > a.plus-icon {
width:79px;
background-position:-154px 0;
}
.social:hover{background:#666}
.social{
	margin-left: 5px;
	font-size: 18px;
border:1px solid #666;
}
.social .fa{
	border-radius: 50%;
	height: 37px;
	width: 37px;
	text-align: center;
	line-height: 39px;
	color: white;
}
.social .fa-google-plus{background-color: #db4935}
.social .fa-facebook{background-color: #305891}
.social .fa-twitter{background-color: #05aced}
.social .fa-google-plus:hover{background-color: white; color: #db4935; border: 1px solid #db4935}
.social .fa-facebook:hover{background-color: white; color: #305891; border: 1px solid #305891}
.social .fa-twitter:hover{background-color: white; color: #05aced; border: 1px solid #05aced}
/* .social .fa:hover{color: grey} */

#before-footer .social .fa{
	border-radius: 4px;
	height: 28px;
    width: 28px;
    line-height: 30px;
    font-size: 17px;
}
.footer_menu li a{
	border-top: 2px solid #939598;
	margin-right: 15px;
	padding-top: 5px;
}
.footer_menu li a:hover{
	border-top: 2px solid #eb8c00;
}

/* news */
.media-list li {
padding:10px 0;
border-top:1px dotted #eee;
}
.media-list li h3{
margin:0
}
.media img{border: 1px solid #d7d7d7; display: block}
.media-list .media{
	margin-bottom: 20px;
}
.thumb .medium{
padding:10px;
color:#888;
line-height:1.3355
}
/* search page */
.searchpage h3{margin-bottom: 5px;}
.searchpage .media-list .media{margin-bottom:0px;}
/* cart-page */
.cart-info table {
	width: 100%;
	margin-bottom: 30px;
	border-collapse: collapse;
	border-top: 1px solid #DDDDDD;
	border-left: 1px solid #DDDDDD;
	border-right: 1px solid #DDDDDD;
}
.cart-info td {
	padding: 7px;
	border-right: 1px solid #ddd;
}
.cart-info thead td {
	color: #4D4D4D;
	font-weight: bold;
	background-color: #DDD;
	border-bottom: 1px solid #DDDDDD;
	border-right: 1px solid white;
}
.cart-info thead tr td:last-child {
	border-right: 0;
}
.cart-info thead .image {
	text-align: center;
}
.cart-info thead .name, .cart-info thead .model, .cart-info thead .quantity {
	text-align: left;
}
.cart-info thead .price, .cart-info thead .total {
	text-align: right;
}
.cart-info tbody td {
	border-bottom: 1px solid #DDDDDD;
}
.cart-info tbody .image img {
	border: 1px solid #DDDDDD;
	height: 50px;
}
.cart-info tbody .image {
	text-align: center;
}
.cart-info tbody .name, .cart-info tbody .model, .cart-info tbody .quantity {
	text-align: left;
}
a.buynow{
	height: 25px;
    background: #f30000 url(cart-icon.png) 11px center no-repeat;
    color: white;
    line-height: 25px;
    padding-right: 15px;
    padding-left: 40px;
	border-radius:4px;
}
/* contact page */
.contactpage textarea,
.contactpage input{
margin-top: 4px;
margin-bottom: 11px;
border-radius: 3px;
min-height: 35px;
padding: 3px 10px;
width: 100%;
border: 1px solid #ddd;
}
.contactpage input[type="submit"]{
	width: auto;
	margin-top: 13px;
	background: #e0301e;
	color: white;
	font-weight: 400;
	border-radius: 4px;
}
input[name="captcha"]{
	width: 60%;
	float:left;
	margin-right:5px;
	margin-top: 0;
}
.map iframe{
	width: 100% !important;
	height: 320px !important;
}
.contactleft{
	line-height: 25px;
}
/* footer */
#before-footer{
	height: 80px;
	line-height: 80px;
	margin-top; 15px;
}
/* module */
/* slideshow */
#slideshow{border-bottom: 4px solid #8b1b1b; width: 100%}
.description-slide{
	bottom: 10px;
	right: 30px;
}
.description-slide h3, .description-slide h6{
	background: rgba(0,0,0,0.8);
	padding: 10px 20px;
}
.description-slide h6{width: 450px;}
/* featured */
.featured{padding-bottom: 30px;border: 1px solid #e5e5e5;border-bottom: 0;}
.featured img{margin-bottom: 20px;}
.featured .product-item{min-height: 300px; margin-bottom: 15px;}
/* newsfeatured */
.item{padding-top: 15px;}
.item:last-child{padding-bottom: 15px;}
h3 + .item{padding-top: 0;}
/* form contact */
#order_form_hosting input, #order_form_hosting textarea{width: 100%; margin-bottom: 15px;background: none; border: 1px solid #b9babb; height: 46px; padding-left: 10px;}
#order_form_hosting textarea{height: 100px; padding-top: 10px;}
.submit-button{height: 50px; margin-top: 20px; line-height: 50px;}


/* extra */
.bottom30{padding-bottom: 30px;}
.border-right{border-right: 1px solid #e5e5e5;}
.readmore{
	border: 1px solid;
    padding: 8px 20px;
    display: inline-block;
    margin-bottom: 15px;
	font-family: Arial;
	color: #404041;
}
.desc{
	height: 252px;
	overflow: hidden
}
.product .desc{min-height: 195px;}
.desc:hover{background: white}
.desc-i:hover{background: white}
.desc-i:hover .readmore{background: #6d6e71; color: white;}
.cat-item{margin-left: 20px; border-bottom: 2px solid #ccc}
.cat-item:hover{border-bottom: 2px solid #e0301e}
/* .breadcrumbs .fa{margin: 0 0px;} */
.contact-info{font-size: 14px; padding-left: 15px;}
.newscontent p{margin-bottom: 20px;}
.newscontent a{color:blue}
@media only screen and (max-width: 739px) {
  .mypage-alo-phone span{display:none}
	.col-12 {padding-left: 15px; padding-right:15px;}
	.rowgutter{padding-top: 15px; padding-bottom:15px;}
	.product-item {min-height: auto;}
	.logo img{margin: 10px auto;}
	#header > .left{float:none}
}