@charset "utf-8";
/* CSS Document */

html{margin-top:0;}
body{ font-size:15px; color:#101010; margin:0px; background:#fff; font-family: 'Roboto', sans-serif;}
.content {padding-top:20px;}
img{max-width:100%; height:auto; border:none;}
p{line-height:20px;}
a{color:#101010;}
a:hover{color:#b30101;}
a, a:hover{text-decoration:none;}
ul{margin:0; padding:0; list-style:none;}
table {width:100%;border-collapse:collapse; line-height:25px;}
table td { border:#2a2a2a solid 1px; padding:1px; vertical-align:middle; padding-left:5px; padding-right:5px; vertical-align:middle;}
.italic {font-style: italic;}
.float-left{float:left;}
.float-right {
float: right;
margin-left: 15px;
border: 1px solid #f2f2f2;
background: #fff;
padding: 5px;
}

#callnowbutton {display:none;}
 
  
/************************************************************************************
CLEARFIX
*************************************************************************************/
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { display: inline-block; }
.clearfix { display: block; zoom: 1; }
.clearb {clear:both;}
.center{text-align:center;}

.wrapper{width:1170px; margin:0 auto;}
/*header*/
#header{background-color:#f2b1b1}
.danhmucleft {float:left; width:180px; margin-top:10px;}
.logo{width:52%; float:left;    margin-top: 6px;}
.logo img{border:none;}
#section {margin-top:10px;}
.block-mang-xh{width:88px; float:right; margin-top: 10px;}
.mang-xh{width:85px; float:left;}
.mang-xh img{margin-left:3px;}
.select-number, .select-string {
overflow: hidden;
background:url(../images/bg-select.png) no-repeat;
height: 24px;
width: 115px;
float: left;
}
.div-dm{width:23%; margin-right:22px; float:left; }
.div-dm:last-child{background:none; margin-right:0px; padding-right:0px;}
.div-dm >h2{font-size:15px; text-align:center; margin-bottom:15px;}
.div-dm >h2 a{color:#303030;}

.danhmucspindex {    float: left;
    width: 15%;
    margin-right: 17px;
    text-align: center;
    border: 1px dotted #ededed ;
    margin-bottom: 19px;
    background-color: white;  }
.danhmucspindex a{font-weight:bold; font-size:15px; color:#FF0000;}
 


.tintuc { background:url(../images/tintuc.png) no-repeat left bottom; width:210px; height:60px; color:#FFFFFF; line-height:60px; font-size:16px; text-align:center; margin:0 auto; text-transform:uppercase;}
div.select-number select {
width: 115px;
border: none;
-webkit-appearance: none;
background: none;
padding-top: 3px;
height: 24px;
}

.search {
    margin-top: 35px;
    margin-left: 48px;
    float: left;
    width: 30%;
    height: 40px;
    position: relative;
}
#popup_up_link{margin-left:-30px}
.search input[type=text] {
    float: left;
    text-indent: 15px;
    height: 38px;
    width: 83%;
    border: 1px solid #CCCCCC;
    color: #898888;
	padding:0;
    font-size: 15px;
	border-radius: 2px 0px 0px 2px;
-moz-border-radius: 2px 0px 0px 2px;
-webkit-border-radius: 2px 0px 0px 2px;
background-color:#FFFFFF
}
.search input[type=submit] {
    width: 15%;
    height: 38px;
    background: url(../images/ico_search.jpg) no-repeat left center;
    border: none;
}

.head_hotline {
    
    margin-top: 35px;
 
}
.hotliner{    font-size: 17px;
    line-height: 12px;
    color: #EB2026;}
.hotliner img {margin-left:10px;}

.head_hotline ul li .info_head small 
{
	font-size:12px;
}
.head_hotline ul li .info_head p 
{
	margin-bottom:0;color:#000;
	font-size:15px;
	margin-top:4px;
	line-height:15px;
}
.info_head a{color:#000;}
.head_hotline ul li .info_head
{
	float:left;
	color:#000;
 
}
.head_hotline ul li .icon_head
{
	float:left;
	margin-right:10px;
}
 
.head_hotline ul li:last-child 
{
  border-right:none; margin-right:0px;
}
.head_hotline ul > li 
{
	float:left;
 width:30%;
	box-sizing:border-box;
	margin-right:8px;
	border-right:1px dotted rgba(255, 255, 255, .6);
}

.slide-show {
    width: 100%; margin:0 auto}
  
.active_home {
    color: #fff;
    background: no-repeat left center #e01a1a;
}

.cate-title {
    cursor: pointer;
    /* border-bottom: none; */
    line-height: 35px;
    font-size: 16px;
    font-weight: normal;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    position: relative;
    padding-left: 0px;
    border-radius: 2px 2px 0 0;
}
.item_review .news_review_title h4{padding:0 10px;font-size: 13px}
#first_news_review h4{font-size: 15px}
.item_review .news_review_title  a{ font-weight: normal;}


#section .slide-show img{max-width:100%;}

#section .about-us{background:#2f0000 url(../images/bg-about.png) repeat-x left bottom; text-align:center; padding:15px 0; color:#fff;}
#section .about-us img{margin-bottom:10px;}
#section .about-us h1{font-size:13px; font-weight:normal;}
.content-section .block{margin-bottom:10px;}
.block-kh {border-top:2px solid #CCCCCC;     background: url(../images/world.png) center top;}
.block-index {  background-color:#a30a0a;}
 

.h3index{margin:0; font-size:15px; text-align:left; padding:10px 0; color:#be0707; font-weight:bold;}
.h3index a {color:#fff; border-bottom:1px solid #e8e8e8;font-weight:bold; padding-bottom:3px;  text-transform:uppercase;  }
.h3index a:hover {color:#fd2c32; text-decoration:none}
.block-index .content a{color:#FFFFFF;}
.block-index .content a:hover{color:#fcff00;}
.block-category >div .content{padding:0px; color:#FFFFFF}
.block-category >div .content img{margin-bottom:7px;}
.block-category >div .content ul{list-style:url(../images/list.png); margin-left: 14px;
    margin-top: 10px}
.block-category >div .content ul li{padding:5px 0;}

/*block index 2*/
.block-index-2 >div{}
.block-index-2 >div >h3{padding:10px 0; font-size:20px; font-weight:700; margin:0; margin-bottom:5px;}
.block-index-2 >div ul{list-style:url(../images/list-1.png); margin-left:20px; margin-bottom:10px;}
.block-index-2 >div ul li{padding:5px 0;}

.video iframe{width:100%; min-height: 205px; height:auto;}

.xem-them{width:77px; height:27px; line-height:27px; padding-left:35px; background:url(../images/xem-them.png) no-repeat top left; float:right; margin-bottom:7px;}

.read-more{width:65px; height:20px; line-height:20px; padding-left:25px; background:url(../images/read-more.png) no-repeat center left; float:right; margin-bottom:7px;}


/*block index 3*/
.block-index-3{}
.block-index-3 >div.left{width:32%; float:left; margin-bottom:10px;}
.block-index-3 >div.left >h3{padding:10px 0; font-size:20px; font-weight:700; margin:0; margin-bottom:5px;}
.jcarousel-index {}
.jcarousel-index ul{list-style:url(../images/list-2.png); margin-left:15px;}
.jcarousel-index ul li{padding:7px 0; line-height:18px;}

.block-index-3 >div.right{width:64%; float:right; padding:15px 10px;
	/*border radius*/
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	 
}
/*slide khach hang*/

#flexisel {/*display:none;*/}
.nbs-flexisel-container {position:relative;	max-width:100%;}
.nbs-flexisel-ul {position:relative; width:9999px; margin:0px; padding:0px; list-style-type:none; text-align:center;}
.nbs-flexisel-inner {overflow:hidden; float:left; width:100%;}
.nbs-flexisel-item {float:left; margin:0px; padding:0px; cursor:pointer; position:relative; line-height:0px;}
.nbs-flexisel-item img {width:135px; height:59px; cursor: pointer; positon: relative;}
/*** Navigation ***/
.nbs-flexisel-nav-left, .nbs-flexisel-nav-right {width: 22px; height: 22px; position: absolute;	cursor: pointer; z-index: 100; opacity: 0.5;}
.nbs-flexisel-nav-left {left: 10px;	background: url(../images/button-previous.png) no-repeat;}
.nbs-flexisel-nav-right {right: 5px; background: url(../images/button-next.png) no-repeat;}
.bgnau {background-color:#fdf4e5;}
.bgtrang {background-color:#fff;}
.bgtrang p{font-size:11px;}
.bgnau p{font-size:11px;}
.bgtrang span a{text-decoration:underline;}
.bgxam {background-color:#f5f4f0}
.bgxam p{font-size:11px;}
.bgxam span a{text-decoration:underline;}
.bgnau span a{text-decoration:underline;}
.hoatdong{    float: left;
    width: 48%; text-align:center;
    margin-right: 5px;}
.doitac img{float:left; margin-right:10px; width:60px;}	

/*footer*/
#footer{ padding:0px 0;}
#footer .block{width:45%; float:left;   margin-bottom:10px; }
#footer .block p {line-height:30px;}
#footer .block ul{list-style:url(../images/list-2.png); margin-left:30px;}
#footer .block ul li{padding:5px 0;}
#footer .block h2{font-size:13px; font-weight:700; text-transform:uppercase; color: #e98023; margin:0 0 10px 0;}
#footer .block:nth-of-type(2n+2){margin-right:0; width:55%; margin-top:20px; }
.copy-right{    font-size: 12px;
    margin: 0;
    padding: 0;
    text-align: center;
    padding: 10px;
    color: #fff;
    background-color: #C82E31;}
 .copy-right a{     
    color: #fff;
 }

/*template*/
.content-left .block{margin-bottom:15px; background:#f5f5f5;}

.content-left .block .content{padding:0 10px; padding-bottom:15px;}
.google {border:3px solid #640101; width:706px; margin:0 auto;}
.mod-category{list-style:url(../images/list.png) inside;}
.liactive {background-color:#d7d7d7;}
.mod-category li{    padding: 12px 8px;
 
    border-bottom: 1px solid #ebebeb;}
.level3 {    padding-left: 30px;
    list-style: url(../images/list.png) inside;
}}
.mod-bloglist{}
.mod-bloglist li{padding:10px 0; background:url(../images/li-news.png) repeat-x left bottom; min-height:70px;}
.mod-bloglist li img{width:85px; height:55px; border:1px solid #c9c9c9; padding:1px; background:#fff; float:left; margin-right:7px;}
.mod-bloglist li h2{font-size:15px; margin:0; padding:0; font-weight:normal; line-height:20px;}

.mod-bloglist1{}
.mod-bloglist1 li{     /* background-color: #efeeee; */
    width: 50%;
    float: left;
    /* margin-left: 12px; */}
.mod-bloglist1 li img{       width: 100%;
    /* height: 144px; */
    padding: 5px;
    /* background: #fff; */
    /* border-radius: 4px; */
    /* margin: 10px; */}
.mod-bloglist1 li h2{font-size:14px; margin:0; padding:0 10px; font-weight:normal; line-height:20px;  }
 

 
.mod-products >div{border: 1px solid #f5f5f5;} 
.mod-products >div h2{font-size:15px; text-transform:none; margin:0; margin-top:15px; line-height:20px;}
.mod-products >div h2 a{color:#ae7e17;}
.mod-products >div h2 a:hover{color:#c40026;}

.block-tintuctrangchu {float:left; width:70%;}
.hotlineright a{font-size:17px; color:#FFFF00}
.hotlineright a:hover{font-size:17px; color:#fff; text-decoration:none}
.topbar {
    background: #530306;
    padding: 4px 0;
    color: #fff;
}
.topbar ul {margin-bottom:0px;}
#menu-top-phai {float:right;}
.topbar #menu-top-trai li {     float: left;
    list-style: none;
    /* padding-right: 18px; */
    font-size: 15px;
    color: yellow;
    line-height: 20px;}
.topbar #menu-top-trai a{color:#FFFFFF}
.new, .sale {
    position: absolute; 
    top: 0;
    right: 0;
}
.productsinfo {
    position: relative; padding:10px;     padding-bottom: 0px;
}
 
.mod-pro >div{margin-bottom:30px;}

.mod-pro-detail >div{width:225px;}

.mod-pro-detail >div{margin-bottom:0 !important;}
.img-pro-detail{float:left; margin-right:15px; margin-top:10px;}
.class-h1{border-bottom:2px solid #85473d;}
.nen { background-color:#1e6cac;}
.tieude  a {color:#FFFFFF;}
.tieude {width:230px; font-size: 15px;font-weight: 700;margin: 0 auto; height:30px; line-height:30px; text-align:center; background-color:#961b20; color:#FFFFFF; text-transform:uppercase; }
.tieude1 {font-size: 13px;font-weight: 700;margin: 0; height:35px; line-height:35px; text-align:left;     background-color:#034789; color:#FFFFFF; text-transform:uppercase; }

.content-right { }
.content-left {float:left !important;}
.content-right .block .content h1{font-size:18px; color:#b30101;}
.content-right .block .content h2{    font-size: 15px;}

.ul-list{list-style:url(../images/list-2.png); margin:10px 20px;}
.ul-list li{padding:5px 0;}

.txt-color{color: #b30101;}
.news-other{}
.news-other >h4{height:20px; border-left:3px solid #FF9900; border-bottom:1px dotted #FF9900; line-height:20px; padding-left:5px; font-size:14px; margin-bottom: 15px;}
.news-other ul{list-style:url(../images/list-2.png); margin-left:25px;}
.news-other ul li{padding:5px 0;}

.news-item{padding:10px 0; border-bottom:1px solid #ececec; clear:both; min-height:130px; }
.news-item img{width:250px; height:170px; float:left; margin-right:15px; border:1px solid #ddd; padding:2px;}
.news-item p{margin-top:5px;}
.date-time{font-size:11px; color:#afafaf; margin:0; padding:0;}
.news-item h2{text-transform:none !important; margin:0; margin-bottom:10px;}

.kh-item{background:url(../images/li-news.png) repeat-x left bottom; padding:15px 0; height:200px; }
.kh-item img{float:left; margin-right:10px; border:1px solid #ddd; padding:2px;}
.kh-item p{margin-top:5px;}
.kh-item h2{text-transform:none !important; margin:0; margin-bottom:7px;}

.contact-info{}
.contact-info ul{margin-bottom:7px;}
.contact-info ul li{padding:7px 0;}
.contact-info ul li .info-left{float:left; width:100px;}
.contact-info ul li .info-right{margin-left:100px;}
.contact-info ul li span{color:#fcff00}

#form-wrapper{margin-top:10px; float:left; position: relative; width:100%;}
#form-wrapper ul{list-style:none !important;}
#form-wrapper:before, #form-wrapper:after
{z-index: -1; position: absolute; content: ""; bottom: 15px;left: 10px; width: 50%; top: 80%; max-width:300px;}
#form-wrapper:after
{  -webkit-transform: rotate(3deg);
    -moz-transform: rotate(3deg);
    -o-transform: rotate(3deg);
    -ms-transform: rotate(3deg);
    transform: rotate(3deg);
    right: 10px;  left: auto;
}
#form-wrapper .button{padding:0.3% 1%; margin-right:1%;}
#form-wrapper li{padding:0.5% 0; clear:both;}
#form-wrapper li label{width:100px; float:left;}
#form-wrapper li input {width:250px;}
#form-wrapper li textarea{width:500px;}
#form-wrapper li .button{padding:3px 10px;}
#form-wrapper li:last-child input{width:100px; float:left; margin-top:15px;}
#form-wrapper li span{color:#f00;}

/**/
/*form bottom
-----------------------------------------------------*/
#form-dk{position: fixed; width:145px; bottom:0px; right:15px; z-index:999;}
#headerDiv, #contentDiv {
float: left;
width: 510px;
}
#titleText {
float: left;
font-size: 1.1em;
font-weight: bold;
margin: 5px;
}
#myHeader {
font-size: 12px;
/*font-weight: bold;*/
margin: 5px 3px;
}
#headerDiv {
background:url(../images/title-httt.png) no-repeat top left;
color: #9EB6FF; width:145px; height:30px; line-height:30px; text-transform:uppercase; font-size:12px; text-align:center;
}
#contentDiv { width:145px;}
#myContent {
	width:145px;/* padding:10px; padding-top:100px;*/
}
#myContent ul{}
#myContent ul li{padding:10px 5px; border-bottom:1px solid #b30101; text-align:center; color:#fff;}
#myContent ul li p{margin:0;}
#myContent ul li span{color:#ff0;}
#myContent ul li img{margin:5px;}
#headerDiv a {
float: right; color:#fff; text-decoration:none;
}
#headerDiv a:hover {
color: #fF0; text-decoration:none;
}


.search-box {
    display: block;
    height: 30px;
    overflow: hidden;
    position: absolute;
    right: 10px;
    margin-bottom: 10px;
    float: right;
}

.search-box form {
    line-height: 0;
}
.search-box input[type="text"] {
    border:1px solid #c6c6c6;;
    border-radius: 0;
    font-size: 14px;
    font-weight: 300;
    height: 21px;
    line-height: 21px;
    margin: 0;
    padding: 0 21px 0 15px;
    width: 160px;
}
.search-box input[type="text"]:focus {
    border-color: #f9e7bc;
}
.search-box input[type="button"], .search-box input[type="submit"] {
    background: #fff url("../images/icon-search.png") no-repeat scroll 50% 50%;
    border-radius: 0;
    display: block; border:none;
    height: 21px;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 1px;
    text-indent: -9999px;
    top: 1px;
    width: 28px;
}

#bttopleft {
   display:none;
}

.m_phone {
    background: #019b35 url(../images/m_phone.png) no-repeat 10px center;
    width: 120px;
    padding-left: 32px;
    height: 33px;
    position: absolute;
    bottom: 30%;
    left: 2%;
    font-weight: bold;
    color: #fff;
    line-height: 33px;
}
._font {
    float: left;
    height: 18px;
    font: 14px/16px Arial; padding-top:8px;
}


/***********/
.tr_mobile
{
  display:none!important;
}
.tr_pc
{
  display:block!important;
 
}


/************/
.d_mneu_mobile
{
    margin: 0px auto;
    background: #961b20 repeat-x;
    width: 100%;
    margin-top: 15px;
    float: left;
    position: relative;
     height:38px;
	 overflow:hidden;
}
.phan-trang{    font-size: 14px;
    text-align: right;
    margin-bottom: 10px;
    margin-top: 5px;
    text-align: center;}
.phan-trang a{color:#fff; padding: 5px 10px;
    background: #FF803B;}
.phan-trang a:hover{    /* color: #fff; */
    background: #CA4E0B;}
.phan-trang span{    font-size:14px;
    padding: 5px 10px;
    background: #CA4E0B;
    color: #fff;}
	
	
 
.div-info ul {
    list-style: none;
}
.div-info li {
    border-bottom: 1px dotted #dddddd;
 
    height: 42px;
    line-height: 30px;
    padding: 6px 0;
}
.div-info li .label {
        padding-left: 17px;
    position: relative;
    width: 24%;
}
.div-info li .text {
       position: relative;
    width: 72%;line-height: 29px;
}
.div-info li .label::before {
    color: #999999;
    content: "+";
    font-size: 16px;
    left: 0;
    position: absolute;
}
 
.fl {float:left;}
.fr {float:right;}
.div-info .price_old {
    color: #333;
    font-size: 14px;
}
.div-info .price {
    color: #e71e1e;
    font-weight: bold;
}

.giohang_tk { margin-top:10px}
.giohang_tk td{ border:1px solid #ccc}
.giohang_tk input[type='button']{background: #ed1c24;
    color: #fff;
    border: none;
    padding: 6px 10px;
    margin: 5px 0px;
    text-transform: uppercase;
    font-size: 12px;}

.menu_giohang ,.tonggia { color:#fff; background:#1275b4}

.phantrang{ display:block; width:100%; text-align:center}
.phantrang a{ padding: 5px 10px;
    background: #ed1c24;
    color: #fff;}
.phantrang span{    padding: 5px 10px;
    background: #b30910;
    color: #fff;}


.giohang_tk1{ border:none}
.giohang_tk1 td{ border:none !important}
.giohang_tk1 td input, .giohang_tk1 td select{     padding: 5px;
    width: 100%;
    margin: 2px 0px;
    border: 1px solid #ccc;
    max-width: 350px;}
	
	.giohang_tk1 td textarea{     padding: 5px;
    width: 100%;
    margin: 2px 0px;
    border: 1px solid #ccc;
    max-width: 450px; margin-bottom:0px;}

#submit_thanhtoan{background: #ed1c24;
    color: #fff;
    border: none;
    padding: 9px 10px !important;
    margin: 5px 0px;
    text-transform: uppercase;
    font-size: 12px;
    max-width: 129px;}



.policy {width:1188px; margin:0 auto;}
.row{background-color:#1e6cac; }
.div33 {float: left;
    margin-left: 0px;
    width: 33%;
    padding-top: 8px; padding-bottom: 8px;
	}
	.div32 {float: left;
    margin-left: 102px;
    width: 25%;
    padding-top: 8px; padding-bottom: 8px;
	}
	.div31 {float: right;
    margin-left: 0px;
    width: 20%;
    padding-top: 8px; padding-bottom: 8px;
	}
	.policy-icon {
	  float: left;
	  height: 50px;
	  width: 50px;
	  line-height: 50px;
	  text-align: center;
	  border: 1px solid #fff;
	  border-radius: 50%;
	  color: #fff;
	  font-size: 22px;
	  margin-right: 15px;

	}

	.policy-text {
	  float: left;
	}

	.policy-text h2 {
		color: #FFF;
		margin: 0;
		padding-top: 0px;
		font-size: 17px;
		font-family: time new roman;
	}

.policy-text p {
	color: #fff;
	font-size: 16px; line-height:14px;
	padding-top: 0px;     margin: 0px !important; margin-bottom:10px;
	font-weight: 700;
}

	.policy-item {
		display: inline-flex;
	}
	#demos .owl-carousel {
	margin:2rem 0
}
 

.quick-alo-phone.quick-alo-static {
  opacity:.6;
}

.quick-alo-phone.quick-alo-hover,
.quick-alo-phone:hover {
  opacity:1;
}

.quick-alo-ph-circle {
  width:160px;
  height:160px;
  top:20px;
  left:20px;
  position:absolute;
  background-color:transparent;
  -webkit-border-radius:100%;
  -moz-border-radius:100%;
  border-radius:100%;
  border:2px solid rgba(30,30,30,0.4);
  border:2px solid #bfebfc 9;
  opacity:.1;
  -webkit-animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
  -moz-animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
  -ms-animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
  -o-animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
  animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
  -webkit-transition:all .5s;
  -moz-transition:all .5s;
  -o-transition:all .5s;
  transition:all .5s;
  -webkit-transform-origin:50% 50%;
  -moz-transform-origin:50% 50%;
  -ms-transform-origin:50% 50%;
  -o-transform-origin:50% 50%;
  transform-origin:50% 50%;
}

.quick-alo-phone.quick-alo-active .quick-alo-ph-circle {
  -webkit-animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
  -moz-animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
  -ms-animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
  -o-animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
  animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
}

.quick-alo-phone.quick-alo-static .quick-alo-ph-circle {
  -webkit-animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
  -moz-animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
  -ms-animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
  -o-animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
  animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
}

.quick-alo-phone.quick-alo-hover .quick-alo-ph-circle,
.quick-alo-phone:hover .quick-alo-ph-circle {
  border-color:#00aff2;
  opacity:.5;
}

.quick-alo-phone.quick-alo-green.quick-alo-hover .quick-alo-ph-circle,
.quick-alo-phone.quick-alo-green:hover .quick-alo-ph-circle {
  border-color:#75eb50;
  border-color:#baf5a7 9;
  opacity:.5;
}

.quick-alo-phone.quick-alo-green .quick-alo-ph-circle {
  border-color:#00aff2;
  border-color:#bfebfc 9;
  opacity:.5;
}

.quick-alo-phone.quick-alo-gray.quick-alo-hover .quick-alo-ph-circle,
.quick-alo-phone.quick-alo-gray:hover .quick-alo-ph-circle {
  border-color:#ccc;
  opacity:.5;
}

.quick-alo-phone.quick-alo-gray .quick-alo-ph-circle {
  border-color:#75eb50;
  opacity:.5;
}

.quick-alo-ph-circle-fill {
  width:100px;
  height:100px;
  top:50px;
  left:50px;
  position:absolute;
  background-color:#000;
  -webkit-border-radius:100%;
  -moz-border-radius:100%;
  border-radius:100%;
  border:2px solid transparent;
  opacity:.1;
  -webkit-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
  -moz-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
  -ms-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
  -o-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
  animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
  -webkit-transition:all .5s;
  -moz-transition:all .5s;
  -o-transition:all .5s;
  transition:all .5s;
  -webkit-transform-origin:50% 50%;
  -moz-transform-origin:50% 50%;
  -ms-transform-origin:50% 50%;
  -o-transform-origin:50% 50%;
  transform-origin:50% 50%;
}

.quick-alo-phone.quick-alo-active .quick-alo-ph-circle-fill {
  -webkit-animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
  -moz-animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
  -ms-animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
  -o-animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
  animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
}

.quick-alo-phone.quick-alo-static .quick-alo-ph-circle-fill {
  -webkit-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
  -moz-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
  -ms-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
  -o-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
  animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
  opacity:0 !important;
}

.quick-alo-phone.quick-alo-hover .quick-alo-ph-circle-fill,
.quick-alo-phone:hover .quick-alo-ph-circle-fill {
  background-color:rgba(0,175,242,0.5);
  background-color:#00aff2 9;
  opacity:.75 !important;
}

.quick-alo-phone.quick-alo-green.quick-alo-hover .quick-alo-ph-circle-fill,
.quick-alo-phone.quick-alo-green:hover .quick-alo-ph-circle-fill {
  background-color:rgba(117,235,80,0.5);
  background-color:#baf5a7 9;
  opacity:.75 !important;
}

.quick-alo-phone.quick-alo-green .quick-alo-ph-circle-fill {
  background-color:rgba(0,175,242,0.5);
  background-color:#a6e3fa 9;
  opacity:.75 !important;
}

.quick-alo-phone.quick-alo-gray.quick-alo-hover .quick-alo-ph-circle-fill,
.quick-alo-phone.quick-alo-gray:hover .quick-alo-ph-circle-fill {
  background-color:rgba(204,204,204,0.5);
  background-color:#ccc 9;
  opacity:.75 !important;
}

.quick-alo-phone.quick-alo-gray .quick-alo-ph-circle-fill {
  background-color:rgba(117,235,80,0.5);
  opacity:.75 !important;
}

.quick-alo-ph-img-circle {
  width:60px;
  height:60px;
  top:70px;
  right:70px;
  position:absolute;
  background:rgba(30,30,30,0.1) url("https://i.imgur.com/YWJeVO2.png") no-repeat center center;
  -webkit-border-radius:100%;
  -moz-border-radius:100%;
  border-radius:100%;
  border:2px solid transparent;
  opacity:.7;
  -webkit-animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
  -moz-animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
  -ms-animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
  -o-animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
  animation:quick-alo-circle-img-anim 1s infinite 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%;
}

.quick-alo-phone.quick-alo-active .quick-alo-ph-img-circle {
  -webkit-animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
  -moz-animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
  -ms-animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
  -o-animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
  animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
}

.quick-alo-phone.quick-alo-static .quick-alo-ph-img-circle {
  -webkit-animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
  -moz-animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
  -ms-animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
  -o-animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
  animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
}

.quick-alo-phone.quick-alo-hover .quick-alo-ph-img-circle,
.quick-alo-phone:hover .quick-alo-ph-img-circle {
  background-color:#00aff2;
}

.quick-alo-phone.quick-alo-green.quick-alo-hover .quick-alo-ph-img-circle,
.quick-alo-phone.quick-alo-green:hover .quick-alo-ph-img-circle {
  background-color:#75eb50;
  background-color:#75eb50 9;
}

.quick-alo-phone.quick-alo-green .quick-alo-ph-img-circle {
  background-color:#00aff2;
  background-color:#00aff2 9;
}


.quick-alo-phone.quick-alo-gray.quick-alo-hover .quick-alo-ph-img-circle,
.quick-alo-phone.quick-alo-gray:hover .quick-alo-ph-img-circle {
  background-color:#ccc;
}

.quick-alo-phone.quick-alo-gray .quick-alo-ph-img-circle {
  background-color:#75eb50;
}

@-moz-keyframes quick-alo-circle-anim {
  0% {
    -moz-transform:rotate(0) scale(.5) skew(1deg);
    opacity:.1;
    -moz-opacity:.1;
    -webkit-opacity:.1;
    -o-opacity:.1;
  }
  30% {
    -moz-transform:rotate(0) scale(.7) skew(1deg);
    opacity:.5;
    -moz-opacity:.5;
    -webkit-opacity:.5;
    -o-opacity:.5;
  }
  100% {
    -moz-transform:rotate(0) scale(1) skew(1deg);
    opacity:.6;
    -moz-opacity:.6;
    -webkit-opacity:.6;
    -o-opacity:.1;
  }
}

@-webkit-keyframes quick-alo-circle-anim {
  0% {
    -webkit-transform:rotate(0) scale(.5) skew(1deg);
    -webkit-opacity:.1;
  }
  30% {
    -webkit-transform:rotate(0) scale(.7) skew(1deg);
    -webkit-opacity:.5;
  }
  100% {
    -webkit-transform:rotate(0) scale(1) skew(1deg);
    -webkit-opacity:.1;
  }
}

@-o-keyframes quick-alo-circle-anim {
  0% {
    -o-transform:rotate(0) kscale(.5) skew(1deg);
    -o-opacity:.1;
  }
  30% {
    -o-transform:rotate(0) scale(.7) skew(1deg);
    -o-opacity:.5;
  }
  100% {
    -o-transform:rotate(0) scale(1) skew(1deg);
    -o-opacity:.1;
  }
}

@-moz-keyframes quick-alo-circle-fill-anim {
  0% {
    -moz-transform:rotate(0) scale(.7) skew(1deg);
    opacity:.2;
  }
  50% {
    -moz-transform:rotate(0) -moz-scale(1) skew(1deg);
    opacity:.2;
  }
  100% {
    -moz-transform:rotate(0) scale(.7) skew(1deg);
    opacity:.2;
  }
}

@-webkit-keyframes quick-alo-circle-fill-anim {
  0% {
    -webkit-transform:rotate(0) scale(.7) skew(1deg);
    opacity:.2;
  }
  50% {
    -webkit-transform:rotate(0) scale(1) skew(1deg);
    opacity:.2;
  }
  100% {
    -webkit-transform:rotate(0) scale(.7) skew(1deg);
    opacity:.2;
  }
}

@-o-keyframes quick-alo-circle-fill-anim {
  0% {
    -o-transform:rotate(0) scale(.7) skew(1deg);
    opacity:.2;
  }
  50% {
    -o-transform:rotate(0) scale(1) skew(1deg);
    opacity:.2;
  }
  100% {
    -o-transform:rotate(0) scale(.7) skew(1deg);
    opacity:.2;
  }
}

@-moz-keyframes quick-alo-circle-img-anim {
  0% {
    transform:rotate(0) scale(1) skew(1deg);
  }
  10% {
    -moz-transform:rotate(-25deg) scale(1) skew(1deg);
  }
  20% {
    -moz-transform:rotate(25deg) scale(1) skew(1deg);
  }
  30% {
    -moz-transform:rotate(-25deg) scale(1) skew(1deg);
  }
  40% {
    -moz-transform:rotate(25deg) scale(1) skew(1deg);
  }
  50% {
    -moz-transform:rotate(0) scale(1) skew(1deg);
  }
  100% {
    -moz-transform:rotate(0) scale(1) skew(1deg);
  }
}

@-webkit-keyframes quick-alo-circle-img-anim {
  0% {
    -webkit-transform:rotate(0) scale(1) skew(1deg);
  }
  10% {
    -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
  }
  20% {
    -webkit-transform:rotate(25deg) scale(1) skew(1deg);
  }
  30% {
    -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
  }
  40% {
    -webkit-transform:rotate(25deg) scale(1) skew(1deg);
  }
  50% {
    -webkit-transform:rotate(0) scale(1) skew(1deg);
  }
  100% {
    -webkit-transform:rotate(0) scale(1) skew(1deg);
  }
}

@-o-keyframes quick-alo-circle-img-anim {
  0% {
    -o-transform:rotate(0) scale(1) skew(1deg);
  }
  10% {
    -o-transform:rotate(-25deg) scale(1) skew(1deg);
  }
  20% {
    -o-transform:rotate(25deg) scale(1) skew(1deg);
  }
  30% {
    -o-transform:rotate(-25deg) scale(1) skew(1deg);
  }
  40% {
    -o-transform:rotate(25deg) scale(1) skew(1deg);
  }
  50% {
    -o-transform:rotate(0) scale(1) skew(1deg);
  }
  100% {
    -o-transform:rotate(0) scale(1) skew(1deg);
  }
}

.quick-alo-phone {
    position: fixed;
    background-color: transparent;
    width: 150px;
    height: 150px;
    cursor: pointer;
    z-index: 200000 !important;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    -webkit-transition: visibility .5s;
    -moz-transition: visibility .5s;
    -o-transition: visibility .5s;
    transition: visibility .5s;
    right: 150px;
    top: 30px;
}