/*
Theme Name: Thiết kế web Hoàng Long media
Theme URI: http://underscores.me/
Author: Webgiadinh
Author URI: http://wordpress.org
Description: Giao diện website được thiết kế bởi công ty TNHH Hoàng Long media
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tkw
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Thiết kế web Hoàng Long media is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/


/* ----------------------  $custom css ------------------------------------------------------------------------------------------------*/
body{
	font-size: 14px;
	font-family: Arial, helvetica ,  sans-serif;
	color: #444;
}

@font-face{
font-family: abc;
src:url('../fonts/Continuum Bold.ttf');
}

h1{
font-family: "abc";
color:green;
}

ul {
	padding-left: 0;
	list-style: none;
}

a:hover {
	text-decoration: none;
}

/* ----------------------  $plugin -----------------------------------------------------------------------------------------------------------*/
.wp-pagenavi{
	text-align: center;
	padding: 20px 0;
}
.wp-pagenavi a,
.wp-pagenavi span{
	padding: 5px 10px;
}
.wp-pagenavi span.current {
    font-weight: bold;
    border-color: royalblue;
    background: royalblue;
    color: white;
}
.breadcrumbs {
	padding:20px 0;
	text-align: left;
}
.breadcrumbs span {
	margin : 0 3px;
}
.breadcrumbs span a{
	color : royalblue;
}
.breadcrumbs >span:last-child{
	display: none;
}

.wp-contact-form {
    background: #f8f8f8 none repeat scroll 0 0;
    padding: 15px;
    overflow: hidden;
}

.wp-contact-form label {
    float: left;
    font-size: 12px;
    width: 23%;
}

.wp-contact-form p {
	margin-bottom: 10px;
	overflow: hidden;
}

.wp-contact-form span.wpcf7-form-control-wrap {
    float: right;
    width: 77%;
}

.wp-contact-form span.wpcf7-form-control-wrap .wpcf7-form-control {
	width: 100%;
	max-width: 100%;
}

.wp-contact-form span.wpcf7-form-control-wrap .wpcf7-textarea {
	height: 120px;
	max-height: 150px;
}

.wp-contact-form .wpcf7-submit {
	width: 120px;
	background-color: #555;
	color: white;
}
.cpd {
	padding: 10px;
	margin: 0;
	border: 1px solid #ddd;
	list-style: none;
}

.cpd li {

    font-size: 13px;
    padding: 5px 18px;
    position: relative;
}

.cpd li::after {
    color: #49b81d;
    content: "\f0c0";
    font-family: FontAwesome;
    left: 0;
    position: absolute;
    top: 8px;
}

.cpd-l span {
	color: pink;
}

#home-slide {
	border-bottom: 2px solid #fff;
}

.form-camket {
	width: 80%;
	margin: 35px auto;
    border: 1px solid #abc;
    padding: 15px;
}

.title-form, .hotline-form {
    font-size: 25px;
    text-align: center;
    text-transform: uppercase;
}

.title-form {
	color: #333;
}

.hotline-form {
	color: #ed4a7a;
	margin-bottom: 15px;
}

.form-camket .wpcf7-form-control {
    border: 1px solid #abc;
    border-radius: 2px;
    margin-bottom: 20px;
    width: 100%;
    padding: 8px 15px;
}

.form-camket .wpcf7-submit {
	background-color: #ed4a7a;
	padding: 8px 15px;
	border:none;
	color: white;
	font-size: 18px;
	text-transform: uppercase;
}
/* ----------------------  $menu --------------------------------------------------------------------------------------------------------------*/
.menu-ul{
	margin: 0;
	padding: 0;
}
.nav-menu ul ul{
	display: none;
}
.nav-menu li{
	list-style: none;	
}
.nav-menu-standard-type li{
	position: relative;	
}
.nav-menu .menu-ul  > li{
	float: left;	
}

.nav-menu-standard-type .menu-ul > li:hover > ul{
	display: block;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 999;
}
.nav-menu-standard-type .menu-ul > li:last-child:hover > ul {
	left: auto;
	right: 0;
}
.nav-menu-standard-type  .menu-ul ul > li:hover > ul{
	display: block;
	position: absolute;
	top: 0;
	left: 100%;
	z-index: 999;	
}

.nav-menu ul ul ul ul{
	display: none !important;
}


/* ----------------------  $global ----------------------------------------------------------------------------------------------------------*/
#site-wrapper{
	background: rgba(0, 0, 0, 0) url("../images/bg_bottom.jpg") no-repeat scroll center bottom / 100% auto;
}
#site-inner{
	min-width: 1170px;
}

.container{
	width: 1170px;
	margin-left: auto;
	margin-right: auto;
}

.site-main-wrapper{
	
}

.bg-inner-content {
	background:  url("../images/bg_cen_top.png") repeat-x scroll center top;
}

.bg-main {
	background: white;
	box-shadow: 0 0 10px 0 #000;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	padding: 20px 0; 
}

#left-sidebar{

}

.widget_nav_menu ul {
	list-style: none;
}

.widget_nav_menu .menu {
	padding-left: 0;
}

.widget_nav_menu li {
	position: relative;
}


.widget_nav_menu li {
    position: relative;
}

.widget_nav_menu li.menu-item-has-children:after{
    position: absolute;
    top: 5px;
    right: 5px;
    font-family: FontAwesome;
    content: "\f105";
    color: #abc;
}

.widget_nav_menu li a {
	text-decoration: none;
}

.widget_nav_menu .sub-menu {
	display: none;
	position: absolute;
	z-index: 99999;
	width: 100%;
	top: 0;
	border-bottom: 1px solid #ddd;
	background: #f8f8f8;
	left: 100%;
}

.widget_nav_menu li:hover .sub-menu{
	display: block;
}

#right-sidebar{

}

.main-col {
	padding-left: 0;
}

.site-main{	
	min-height:400px;
	padding-right: 10px;
}

.tmp-title-bar{
	margin:10px 0 20px;
	padding-bottom: 5px;
	border-bottom: 1px solid #666;
}
.tmp-title-bar .title{
	font-weight: bold;
    color: royalblue;
    font-size: 18px;
}

.message{
	padding: 15px;
	margin: 15px;
	font-weight: bold;
}
.message-success{
	color: green;
}
.message-danger{
	color: red;
}
.message-warning {
	color: brown;
}
.thumb{
	text-align: center;
}
.thumb img{
	display: block;
}

.site-header, .site-main-wrapper, .site-footer {
	width: 100%;
	max-width: 100%;
	clear: both;
}

/* ----------------------  $header ------------------------------------------------------------------------------------------------------------*/
.site-header {
	background-color: #333;
	text-align: center;
}

.title-logo {
	margin: 0;
	font-size: 0;
}

.button-menu {
	padding: 5px 0px;
	font-weight: bold;
	cursor: pointer;
	font-size: 20px;
	display: none;
	color: #49b81d;
	text-transform: uppercase;
	overflow: hidden;
}

.title-menu {
	float: left;
	padding: 1px 0;
}

.icon-menu{
	float: right;
	padding: 0 8px;
	border-radius: 2px;
	border:1px solid #49b81d;
}

.nav-bar {
	//background: rgba(0, 0, 0, 0) url("../images/bg_menu.png") repeat-x scroll center center;
	background-color: #095c9e;
	border-bottom: 2px solid #49b81d;
}


#primary-menu ul {
	padding-left: 0;
}

#primary-menu .menu-ul {

}

#primary-menu li {

}

#primary-menu li a {
	text-decoration: none;
	display: block;
	color: white;
	padding: 8px 15px;
}

#primary-menu .menu-ul > li {

}

#primary-menu .menu-ul > li > a {
	padding: 10px 15px;
	display: block;
}


#primary-menu .menu-ul li:hover a, #primary-menu .menu-ul li.current-menu-item a{
	background: #49B81D;
	color: yellow;
}

#primary-menu .sub-menu {
	width: 250px;
	z-index: 9999;
	position: absolute;
}

#primary-menu .sub-menu li{

}

#primary-menu .menu-ul > li:first-child > a {
    font-size: 0;
    padding: 20px 30px;
    position: relative;
}

#primary-menu .menu-ul > li:first-child > a::after {
    color: #ffffff;
    content: "\f015 ";
    font-family: FontAwesome;
    font-size: 30px;
    left: 17px;
    position: absolute;
    text-shadow: 0 0 5px #f7f7f7;
    top: -2px;
}

/* ----------------------  $footer ----------------------------------------------------------------------------------------------------------*/
.site-footer{

}

.site-footer .company-info{
	padding: 20px 0;
	text-align: center;
}

.site-footer .fanpage{

}

.copyright {
    font-size: 10px;   
    padding: 5px;
    font-family: arial;
    text-align: center;
    background-color: #005db3;
}

.copyright a, .copyright {
		color: #abc;
}

.btn-top {
    background: url("../images/btn_top1.png") no-repeat 0 0 / 45px 45px;
    border: medium none;
    bottom: 70px;
    cursor: pointer;
    display: none;
    height: 50px;
    outline: medium none;
    padding: 0;
    position: fixed;
    right: 20px;
    width: 50px;
    z-index: 9999;
}

/* ----------------------  $sidebar -----------------------------------------------------------------------------------------------------------*/
.sidebar {
	padding-right: 10px;
	padding-left: 10px;
}

.box-sidebar {
	margin-bottom: 20px;
}

.content-box-sidebar, .widget_nav_menu .menu {
	border: 1px solid #ddd;	
}

.box-sidebar-nav {

}

.widget_nav_menu ul {
	margin-bottom: 0;
}

.widget_nav_menu li {
    border-bottom: 1px solid #ddd;
    padding: 5px 15px;
    position: relative;
}

.widget_nav_menu li:last-child {
	border-bottom: none;
}

.sidebar-title, .block-title .title, .section-header, .article-title, .single-title {
	font-size: 15px;
	margin: 0;
	background: #095c9e;
	border-left: 8px solid #49b81d;
	padding-left: 15px;
	color: white;
	height: 35px;
	line-height: 35px;
}

.sidebar-title, .block-title .title, .section-header, .list-tab li a, .article-title, .single-title {
	font-family: 'Cuprum', sans-serif;
}

.box-sd-content {

}

.single-title {
	margin-bottom: 15px;
}


/* ----------------------  $404 ----------------------------------------------------------------------------------------------------------*/
#e404-tmp {

}

#e404-content {

}

.message-danger .title-404 a {
	color: green;
}

.message-danger {
	color: red;
	text-align: center;
	background-color: #f2f2f2;
}

.message-danger img {
	margin-top: 20px;
	max-width: 400px;
}

/* ----------------------  $category ----------------------------------------------------------------------------------------------------------*/
#category-tmp .section-main{

}

.cate-list-posts{
	
}

.category .col-box-thumb, .single .col-box-thumb {

}

.category .col-box-meta, .single .col-box-meta{
	padding-left: 0;
}

.category-tmp-posts .cate-post-item{
	margin-bottom: 15px;
}
.cate-post-thumb{		

}
.category-tmp-posts .cate-post-thumb {

}


.cate-post-item, {
	margin: 10px 0;
}

.cate-post-item-meta{

}
.category-tmp-posts .cate-post-item-meta {

}
.cate-post-title{
	margin-top: 0;
	font-size: 15px;
}
.cate-post-date{
	color: #777;
	font-size: 12px;
}
.cate-post-excerpt{
	font-size: 12px;
}
.cate-post-item .read-more{
	color: #49b81d;
    font-size: 12px;
    text-decoration: underline;
}

/* ----------------------  $single ----------------------------------------------------------------------------------------------------------*/
#single-tmp{}

section.singular-content{

}

.singular-content .section-main{

}
.single-related-posts{
	margin-top: 30px;
}

.related-title-bar{

}

.related-title-bar span{

}

.single-related-posts ul{}
.single-related-posts li{
	list-style: url('../images/new-post.png') inside;
	margin: 10px 0;
    font-weight: bold;
    font-size: 13px;
    font-style: italic;
}


/* ----------------------  $page  ----------------------------------------------------------------------------------------------------------*/

/* ----------------------  $search ----------------------------------------------------------------------------------------------------------*/

.search-form {
    display: block;
    height: 30px;
    margin-top: 4px;
    position: relative;
}

.search-field {
	position: absolute;
	padding: 4px;
	padding-right: 50px;
	max-width: 100%;
	width: 100%;
}

.search-submit {
    border: medium none;
    padding: 4px 10px;
    position: absolute;
    right: 0;
    top: 1px;
    z-index: 5588;
}

#search-tmp{}
.search-tmp-title{
	font-size: 16px;
    border-bottom: 1px solid #bbb;
    padding-bottom: 5px;
    margin-bottom: 20px;
    font-weight: bold;
    font-style: italic;
}
.search-tmp-title .search-keywords{
	font-weight:bold;
	font-size:18px;
	color: royalblue;
}
.search-result-items{

}
.search-result-items li {
	list-style: none;;
	margin: 10px 0;
	color: royalblue;
	font-weight: bold;
	font-size: 14px;
}

.box-img-search img {
	width: 150px;
}

.section-header-search {
	background-color: #f8f8f8;
}


/* ----------------------  $archive ----------------------------------------------------------------------------------------------------------*/
#archive-tmp {}

.archive-list-sp {
	overflow: hidden;
}
.archive-list-sp-container {
}
.archive-da-item{
	//display: inline-block;
	vertical-align: top;
}
.archive-da-item-thumb {

}

.block-new-left .archive-da-item {
	margin: 10px 0;
}

.cate-post-item, .archive-da-item, .item-da {
	margin: 10px 0;
}

.block-new-right .archive-da-item {
	margin: 10px 0;
	padding-bottom: 10px;
	border-bottom: 1px dotted #f8f8f8;
}

.block-new-right .archive-da-item-thumb-h {
	width: 20%;
	margin-right: 2%;
	float: left;
	padding: 5px;
	border: 1px solid #ddd;
}

.block-new-right .archive-da-item-meta-h {
	width: 77%;
	float: right;
}

.archive-da-item-meta {
	padding: 5px 0;
}
.archive-da-item .ten-da {
	margin-top: 0;
    margin-top: 0;
    font-size: 15px;
    padding-top: 8px;
    font-weight: bold;
}

.ten-da a:hover, .title-cate a:hover {
	color: #49b81d;
}

.box-sidebar .archive-da-item {
	padding: 10px;
	border-bottom: 1px dotted  #ddd;
}

.box-sidebar .archive-da-item:last-child, .block-new-right .archive-da-item:last-child {
	border-bottom: none;
}

.box-sidebar .archive-da-item-meta-h .ten-da {
	font-size: 13px;
    margin-top: 0;
}

.box-sidebar .archive-da-item-thumb-h {
    float: left;
    margin-right: 3%;
    width: 23.7%;
    border: 1px solid #ddd;

    padding: 2px;
}

.box-thumbnail-hover img {
	-webkit-transition-duration: 0.5s; 
	-moz-transition-duration: 0.5s; 
	-o-transition-duration: 0.5s; 
}

.single-da-related-posts .box-thumbnail-hover {
   max-height: 500px;
   min-height: 215px;
}

.box-thumbnail-hover {
	border: 1px solid white;
}

.box-thumbnail-hover:hover {
	border: 1px solid #ddd;
}

.box-thumbnail-hover img:hover {
	-webkit-transform:scale(0.9);
	-moz-transform:scale(0.9); 
	-o-transform:scale(0.9);
}

.box-sidebar .archive-da-item-meta-h {
	float: right;
	width: 73%;
}

.block-new-left .ten-da {
	margin-top: 15px;
}
/* ----------------------  $single sp ----------------------------------------------------------------------------------------------------------*/
#single-da-tmp {

}
.single-da-info {
	margin-bottom: 30px;
}
.single-da-thumb {
	padding: 10px;
	text-align: center;
	border: 1px solid #ddd;
}

.single-da-thumb:hover {
	background-color: #f8f8f8;
}

.single-da-thumb img:hover {
	transform: rotateY(360deg);
   	transition: transform 5s;
}

.single-da-fields {

}

.single-da-related-posts ul {
	list-style: none;
}

.single-da-fields .title-da {
	margin-top: 0;
	font-size: 20px;
	border-bottom: 1px solid;
	padding-bottom: 5px;
}
.single-da-fields .field-row {
	padding: 5px 0;
	border-bottom: 1px solid #f8f8f8;
}

.single-da-fields .field-row label {
	font-weight: normal;
}

.single-da-content {

}
.single-da-content .header-tab-group {

}

.single-da-content .header-tab{

}

.single-da-content .content-tab-group{
	//padding: 15px;
}

.single-da-content .content-tab {
	
}
/* ----------------------  $home  ----------------------------------------------------------------------------------------------------------*/
.home-block {

}

.block-1 .cate-post-item {
	border-bottom: 1px solid #ddd;
	padding-bottom: 5px;
}

.block-1 .cate-post-title {
	
} 

.block-2 .cate-post-thumb {
	float: left;
	width: 40%;
	margin-right: 5%;
}

.block-2 .cate-post-title {
	width: 55%;
	float: right;
	font-size: 15px;
}

.block-2 .col-box-meta {
    padding-left: 0;
}

.block-1 .col-box-meta {
	padding-left: 0;
}

.col-box-right {
	padding-left: 0;
}

.list-tab {
	width: 100%;
	margin-bottom: 0;
}

.list-tab li {
	float: left;
	width: 50%;
	text-align: left;
}

.list-tab li a {
	text-decoration: none;
	display: block;
	padding: 5px 0px;
	padding-left: 15px;
	font-size: 15px;
	color: #fff;
	background-color: #095c9e;
}

.list-tab li a.active {
	color: yellow;
	background-color: #49b81d;
}

.home-block {
	margin-bottom: 20px;
}

.home-block .block-title{

}
.home-block .block-content{

}
/* ----------------------  $custom template -----------------------------------------------------------------------------------------------------------*/

/*Call animation*/
.phonering-alo-phone {
    position:fixed;
    visibility:hidden;
    background-color:transparent;
    width:200px;
    height:200px;
    cursor:pointer;
    z-index:200000!important;
    -webkit-backface-visibility:hidden;
    -webkit-transform:translateZ(0);
    transition:visibility .5s;
    left: -15px;
    bottom: 15px;
    display:block!important;
}

.phonering-alo-phone.phonering-alo-show {
    visibility:visible
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }

    100% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}

@-webkit-keyframes fadeInRightBig {
    0% {
        opacity:0;
        -webkit-transform:translate3d(2000px,0,0);
        transform:translate3d(2000px,0,0)
    }

    100% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity:1
    }

    100% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }
}

.fadeOutRight {
    -webkit-animation-name:fadeOutRight;
    animation-name:fadeOutRight
}

.phonering-alo-phone.phonering-alo-static {
    opacity:.6
}

.phonering-alo-phone.phonering-alo-hover,.phonering-alo-phone:hover {
    opacity:1
}

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

.phonering-alo-phone.phonering-alo-active .phonering-alo-ph-circle {
    -webkit-animation:phonering-alo-circle-anim 1.2s infinite ease-in-out!important;
    animation:phonering-alo-circle-anim 1.2s infinite ease-in-out!important
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.phonering-alo-ph-img-circle {
    width:60px;
    height:60px;
    top:70px;
    left:70px;
    position:absolute;
    background:rgba(30,30,30,0.1) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAABNmlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjarY6xSsNQFEDPi6LiUCsEcXB4kygotupgxqQtRRCs1SHJ1qShSmkSXl7VfoSjWwcXd7/AyVFwUPwC/0Bx6uAQIYODCJ7p3MPlcsGo2HWnYZRhEGvVbjrS9Xw5+8QMUwDQCbPUbrUOAOIkjvjB5ysC4HnTrjsN/sZ8mCoNTIDtbpSFICpA/0KnGsQYMIN+qkHcAaY6addAPAClXu4vQCnI/Q0oKdfzQXwAZs/1fDDmADPIfQUwdXSpAWpJOlJnvVMtq5ZlSbubBJE8HmU6GmRyPw4TlSaqo6MukP8HwGK+2G46cq1qWXvr/DOu58vc3o8QgFh6LFpBOFTn3yqMnd/n4sZ4GQ5vYXpStN0ruNmAheuirVahvAX34y/Axk/96FpPYgAAACBjSFJNAAB6JQAAgIMAAPn/AACA6AAAUggAARVYAAA6lwAAF2/XWh+QAAAB/ElEQVR42uya7W3CMBCG31QM4A1aNggTlG6QbpBMkHYC1AloJ4BOABuEDcgGtBOETnD9c1ERCH/lwxeaV8oPFGP86Hy+DxMREW5Bd7gRjSDSNGn4/RiAOvm8C0ZCRD5PSkQVXSr1nK/xE3mcWimA1ZV3JYBZCIO4giQANoYxMwYS6+xKY4lT5dJPreWZY+uspqSCKPYN27GJVBDXheVSQe494ksiEWTuMXcu1dld9SARxDX1OAJ4lgjy4zDnFsC076A4adEiRwAZg4hOUSpNoCsBPDGM+HqkNGynYBCuILuWj+dgWysGsNe8nwL4GsrW0m2fxZBq9rW0rNcX5MOQ9eZD8JFahcG5g/iKT671alGAYQggpYWvpEPYWrU/HDTOfeRIX0q2SL3QN4tGhZJukVobQyXYWw7WtLDKDIuM+ZSzscyCE9PCy5IttCvnZNaeiGLNHKuz8ZVh/MXTVu/1xQKmIqLEAuJ0fNo3iG5B51oSkeKnsBi/4bG9gYB/lCytU5G9DryFW+3Gm+JLwU7ehbJrwTjq4DJU8bHcVbEV9dXXqqP6uqO5e2/QZRYJpqu2IUAA4B3tXvx8hgKp05QZW6dJqrLTNkB6vrRURLRwPHqtYgkC3cLWQAcDQGGKH13FER/NATzi786+BPDNjm1dMkfjn2pGkBHkf4D8DgBJDuDHx9BN+gAAAABJRU5ErkJggg==) no-repeat center center;
    border-radius:100%;
    border:2px solid transparent;
    -webkit-animation:phonering-alo-circle-img-anim 2s infinite ease-in-out;
    animation:phonering-alo-circle-img-anim 2s infinite ease-in-out;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%
}

.phonering-alo-phone.phonering-alo-active .phonering-alo-ph-img-circle {
    -webkit-animation:phonering-alo-circle-img-anim 2s infinite ease-in-out!important;
    animation:phonering-alo-circle-img-anim 2s infinite ease-in-out!important
}

.phonering-alo-phone.phonering-alo-static .phonering-alo-ph-img-circle {
    -webkit-animation:phonering-alo-circle-img-anim 0 infinite ease-in-out!important;
    animation:phonering-alo-circle-img-anim 0 infinite ease-in-out!important
}

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

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

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

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

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

@-webkit-keyframes phonering-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
    }
}

@-webkit-keyframes phonering-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
    }
}

@-webkit-keyframes phonering-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)
    }
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }

    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}

@keyframes fadeInRight {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }

    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity:1
    }

    100% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity:1
    }

    100% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }
}

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

    30% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.5
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg);
        opacity:.1
    }
}

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

    30% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.5
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg);
        opacity:.1
    }
}

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

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg);
        opacity:.2
    }

    100% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.2
    }
}

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

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg);
        opacity:.2
    }

    100% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.2
    }
}

@-webkit-keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }

    10% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
                transform:rotate(-25deg) scale(1) skew(1deg)
    }

    20% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg);
                transform:rotate(25deg) scale(1) skew(1deg)
    }

    30% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
                transform:rotate(-25deg) scale(1) skew(1deg)
    }

    40% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg);
                transform:rotate(25deg) scale(1) skew(1deg)
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }
}

@keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }

    10% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
                transform:rotate(-25deg) scale(1) skew(1deg)
    }

    20% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg);
                transform:rotate(25deg) scale(1) skew(1deg)
    }

    30% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
                transform:rotate(-25deg) scale(1) skew(1deg)
    }

    40% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg);
                transform:rotate(25deg) scale(1) skew(1deg)
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }
}