﻿/* Set padding to keep content from hitting the edges */
.body-content { padding-left: 15px; padding-right: 15px; white-space: nowrap; }

/* styles for validation helpers */
.field-validation-error { color: #b94a48; }

.field-validation-valid { display: none; }

input.input-validation-error { border: 1px solid #b94a48; }

input[type="checkbox"].input-validation-error { border: 0 none; }

.validation-summary-errors { color: #b94a48; }

.validation-summary-valid { display: none; }

@font-face { font-family: 'opensans'; src: url('../fonts/opensans-regular.eot'); src: url('../fonts/opensans-regulard41d.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-regular.ttf') format('truetype'), url('../fonts/opensans-regular.svg#opensans-regular') format('svg'); font-weight: normal; font-style: normal; }

/*QuyetNH*/
.page-des { font-size: 13px; left: 18px; position: absolute; top: 17px; width: 300px; color: #002B58; }
#logo-header { margin-left: 35px; }

.video-right { position: relative; display: block; overflow: hidden; }
.video-right .title { background: url(images/titlebg.png); position: absolute; bottom: 0px; left: 0px; width: 100%; text-align: center; color: #fff; padding: 5px 3px; overflow: hidden; max-height: 50px; }
/*.video-right:hover .play { background-image: url(images/play_iconhv.png); }*/
.video-right .play { position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; background: url(images/yplayhv.png) no-repeat center top 40%; }
.list-unstyled ul { list-style: none; padding: 0px; }
.blockquote p { line-height: 1.6em; margin: 0px; }
.morecnt { padding: 0px; }
.morecnt li { list-style: none; line-height: 22px; padding: 8px 0px; border-bottom: dashed 1px #f2f2f2;font-weight: bold; }
.morecnt li p { text-indent: 10px; background: url(images/moreitem.jpg) no-repeat left top 5px; margin: 0px; }
.morecnt li a:hover { text-decoration: none; }
.morecnt li a:hover p { color: #e67e22; }
.morecnt li a span { display: block; color: #aaa; font-size: 11px; }
h1.title { font-size: 24px; margin-top: 10px; }
.textcnt { font: 14px/30px arial; text-align: justify; }
.textcnt h2 { font-size: 16px; font-weight: bold; }
.textcnt h3 { font-size: 14px; font-weight: bold; }
.textcnt p { margin-bottom: 20px; }
.textcnt img { max-width: 100%; height: auto !important; }
.descnt { font: 14px/25px arial; text-align: justify; }

.branch .item { text-align: left; line-height: 20px; font-size: 13px; margin-bottom: 20px; }
.branch .item a { color: #000; }
.branch .hotline { font-size: 25px; font-weight: bold; color: #e67e22; display: block; margin-top: 7px; }
.branch .fa-circle { color: #777; float: left; margin: 5px 5px 0px 3px; font-size: 6px; }

/*e-tracuu*/
.e-tracuu img { width: auto !important; }
.e-tracuu { position: absolute; z-index: 100; top: -5px; text-align: center; right: 205px; }
.e-tracuu .e-tracuu-body { /*overflow-y: scroll;*/ position: relative; height: 489px; background-color: #ffffff; border-radius: 10px !important; padding: 80px 20px; text-align: left; margin-top: -29px; }
.e-tracuu .e-tracuu-body .tracuu-title { margin-bottom: 20px; }
.e-tracuu .e-tracuu-body .so_xacthuc, .e-tracuu .e-tracuu-body .ma_xacthuc, .e-tracuu .e-tracuu-body .ma_kiemtra { width: 100%; margin-bottom: 10px; /*border-radius: 3px !important;*/ }
.e-tracuu .text-key { color: #c10801; }
.e-tracuu .e-tracuu-body .ma_kiemtra { margin-bottom: 7px; }
.e-tracuu .e-tracuu-body .INma_kiemtra { width: 150px; }
.e-tracuu .e-tracuu-body input { border-radius: 4px !important; border: 1px solid #eeeeee; padding: 3px; }
.e-tracuu .tracuu-footer { position: relative; bottom: 58px; }
.e-tracuu .tracuu-footer button { background-color: transparent; border: none; }
.e-tracuu .img-top { position: relative; z-index: 1; }
.e-tracuu .tracuu-header { padding: 0px 20px; }
.e-tracuu .tracuu-header .text-header { position: absolute; display: block; right: 95px; top: 3px; z-index: 1; color: #fff; text-transform: uppercase; font-size: 13px; }
.e-tracuu .tracuu-header .text-header img { margin-bottom: 2px; padding: 10px 5px; cursor: pointer; }
.e-tracuu .form-group { margin-bottom: 5px; }

/*e-tracuu-device*/
.tracuu-device { position: relative; }
.e-tracuu-xs img { width: 100%; }
.e-tracuu-xs { position: relative; z-index: 100; top: -6px; text-align: center; }
.e-tracuu-xs .e-tracuu-body { position: relative; height: 487px; background-color: #ffffff; border-radius: 10px !important; padding: 80px 20px; text-align: left; margin-top: -20px; }
.e-tracuu-xs .e-tracuu-body .tracuu-title { margin-bottom: 20px; }
.e-tracuu-xs .e-tracuu-body .so_xacthuc, .e-tracuu-xs .e-tracuu-body .ma_xacthuc, .e-tracuu-xs .e-tracuu-body .ma_kiemtra { width: 100%; margin-bottom: 10px; /*border-radius: 3px !important;*/ }
.e-tracuu-xs .text-key { color: #c10801; }
.e-tracuu-xs .e-tracuu-body .ma_kiemtra { margin-bottom: 7px; }
.e-tracuu-xs .e-tracuu-body .INma_kiemtra { width: 150px; }
.e-tracuu-xs .e-tracuu-body input { border-radius: 4px !important; border: 1px solid #eeeeee; padding: 3px; }
.e-tracuu-xs .tracuu-footer { position: relative; bottom: 58px; }
.e-tracuu-xs .tracuu-footer button { background-color: transparent; border: none; }
.e-tracuu-xs .img-top { position: relative; z-index: 1; }
.e-tracuu-xs .tracuu-header { /*padding: 0px 20px;*/ display: inline-block; position: relative; }
.e-tracuu-xs .tracuu-header .text-header { position: relative; display: block; z-index: 30; color: #fff; text-transform: uppercase; font-size: 10px; margin-top: -32px; }
.e-tracuu-xs .tracuu-header .text-header img { margin-bottom: 2px; padding: 10px 5px; cursor: pointer; width: auto !important; }
.e-tracuu-xs .form-group { margin-bottom: 5px; }
/* \e-tracuu-device*/

#Slider img { width: 100%; }

#Slider.carousel-v1 .carousel-arrow a i { background: none; color: #fff; font-size: 50px; }

.zoom-photo { cursor: zoom-in; }
.template .img-wrapper img { margin-bottom: 25px; cursor: pointer; }

.down-item { line-height: 20px; margin: 15px 0px; padding-left: 40px; background: url(images/download.jpg) no-repeat left center; }
.down-item-pdf { line-height: 50px; padding-left: 40px; background: url(images/pdf.png) no-repeat left center; }
.down-item-doc { line-height: 50px; padding-left: 40px; background: url(images/doc.png) no-repeat left center; }
.oItem { padding-left: 40px; background: url(images/icon-tienich.png) no-repeat left top; font-weight: bold; margin-top: 5px; }
.oItem li { font-weight: normal; margin: 8px 0px; }
.headline .view { float: right; margin-top: 10px; }
.logothaison { margin-top: 5px; }
.posts { padding-top: 20px; }

#CommonSocialNetwork .gplus { margin-top: 1px; float: left; }
#CommonSocialNetwork .tweet { margin-top: 1px; float: left; }
#CommonSocialNetwork .likeface { float: left; margin-left: 20px; }

#share-buttons { position: fixed; bottom: 79px; right: 0px; }
#share-buttons img { width: 35px; padding: 2px; border: 0; box-shadow: 0; display: block; }

.fr { float: right; }

.clshome .fa { font-size: 22px; }
.header .navbar-default .navbar-nav > li.clshome > a { padding: 7px 0px; }
/*QuyetNH end*/

body { color: #333; font-size: 14px; line-height: 1.6; }

/*p,
li,
li a { color: #555; }
*/
a { color: #72c02c; text-decoration: none; }

a,
a:focus,
a:hover,
a:active { outline: 0 !important; }
a:focus { text-decoration: none; }
a:hover { color: #72c02c; text-decoration: underline; }

/*Boxed Layout
------------------------------------*/
.wrapper { background: #fff; }

.boxed-layout { padding: 0; box-shadow: 0 0 5px #ccc; margin-left: auto !important; margin-right: auto !important; background: url(images/patterns/15.html) repeat; }

/*Parallax Counter
------------------------------------*/
.parallax-bg { background: url(images/blur/img1.html) 50% 0 repeat fixed; }

/*Parallax Counter Block*/
.parallax-counter { padding: 60px 0; background: url(images/bg/9.html) 50% 0 no-repeat fixed; }

.parallax-counter h4 { color: #fff; font-size: 18px; }

.parallax-counter .counters { color: #fff; padding: 20px 0; font-weight: 200; background: rgba(0,0,0,0.6); }

/*Parallax Counter v1
------------------------------------*/
/*Parallax Counter Block*/
.parallax-counter-v1 { padding: 60px 0; background: url(images/patterns/5.html) repeat fixed; }

.parallax-counter-v1 .counters { color: #fff; padding: 15px 0 10px; border: solid 1px #555; }

.parallax-counter-v1 h4 { color: #bbb; font-size: 16px; text-transform: uppercase; }

.parallax-counter-v1 span.counter { font-size: 42px; line-height: 48px; }

/*Parallax Counter v2
------------------------------------*/
.parallax-counter-v2 { position: relative; padding: 80px 0 60px; background: url(images/patterns/16.html) repeat fixed; }

.parallax-counter-v2:after { top: 0; left: 50%; content: " "; margin-left: -25px; position: absolute; border-top: 25px solid #fff; border-left: 25px solid transparent; border-right: 25px solid transparent; }

.parallax-counter-v2:before { top: 0; left: 0; width: 100%; height: 100%; content: " "; position: absolute; background: rgba(0,0,0,0.02); }

.parallax-counter-v2 .counters { padding: 20px 0; border-bottom: solid 2px #ddd; background: rgba(255,255,255,0.9); }

.parallax-counter-v2 .counters h4,
.parallax-counter-v2 .counters span { color: #555; font-weight: 200; font-family: 'Open Sans', sans-serif; }

.parallax-counter-v2 .counters span { font-size: 36px; }

.parallax-counter-v2 .counters h4 { font-size: 22px; text-transform: uppercase; }

@media (max-width: 992px) {
    .parallax-counter-v2 .counters { margin-bottom: 0 !important; }
}

/*Parallax Team
------------------------------------*/
.parallax-team { background: url(images/team/faces.html) 50% 0 repeat fixed; }

.parallax-team,
.parallax-team .title-box-v2 { position: relative; }

.parallax-team:before { top: 0; left: 0; width: 100%; height: 100%; content: " "; position: absolute; background: rgba(255,255,255,0.9); }

/*Main Styles
------------------------------------*/
/*Purchase Block*/
.purchase { padding: 25px 0 30px; border-bottom: solid 1px #eee; background: url(images/breadcrumbs.png) repeat; }
.purchase p { margin-bottom: 0; }
.purchase h1 { color: #666; display: block; font-size: 24px; line-height: 35px; font-weight: normal; margin-bottom: 12px; padding: 0px; margin-top: 0px; font-family: 'Open Sans', sans-serif; }

.purchase .btn-buy { }

.purchase .btn-buy a { margin-top: 44px; display: block; }

.purchase .btn-buy a i { margin-right: 5px; }

@media (max-width: 992px) {
    .purchase { text-align: center; }

    .purchase span { font-size: 22px; line-height: 29px; }

    .purchase .btn-buy a { margin-top: 25px; font-size: 16px; }
    .e-tracuu-xs .e-tracuu-body{height:460px;}
}

/*Service*/
.service { overflow: hidden; margin-bottom: 10px; padding: 15px 15px 10px; }
.service:hover { background: #fcfcfc; box-shadow: 0 0 5px #ddd; -webkit-transition: box-shadow 0.2s ease-in-out; -moz-transition: box-shadow 0.2s ease-in-out; -o-transition: box-shadow 0.2s ease-in-out; transition: box-shadow 0.2s ease-in-out; }
.service:hover i { color: #656565; }

.service .desc { padding: 2px 0px; overflow: hidden; }
.service .desc h4 { font-size: 19px; line-height: 28px; margin-top: 6px; }

.service .service-icon { float: left; padding: 10px; color: #72c02c; font-size: 25px; text-align: center; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }
.service .service-icon.icon-cogs { font-size: 37px; }
.service .service-icon.icon-plane { font-size: 43px; }

/* Recent Work  */
.recent-work a { text-align: center; background: #fcfcfc; display: inline-block; }

.recent-work a:hover { text-decoration: none; }

.recent-work a:hover strong { color: #555; }

.recent-work em.overflow-hidden { display: block; }

.recent-work a span { display: block; padding: 10px; border-bottom: solid 2px #eee; }

.recent-work a strong { color: #555; display: block; }

.recent-work a i { color: #777; }

.recent-work a img { -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; }

.recent-work a:hover img { opacity: 0.8; -webkit-transform: scale(1.2) rotate(3deg); -moz-transform: scale(1.2) rotate(3deg); -o-transform: scale(1.0) rotate(3deg); -ms-transform: scale(1.2) rotate(3deg); transform: scale(1.2) rotate(3deg); }

.recent-work a:hover span { border-bottom: solid 2px #72c02c; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.3s ease-in-out; }

/* Work */
.work { margin-top: 6px; }
.work .details { padding: 10px; }
.work .caption { display: block; padding-top: 5px; color: #585f69 !important; font-size: 18px !important; }
.work .caption:hover { cursor: pointer; color: #444 !important; text-decoration: underline; }

/*Other Footer Common Classes
------------------------------------*/
/*Thumb Headline*/
.thumb-headline h2 { color: #eee; font-size: 16px; }

/*Footer Logo*/
.footer-logo { margin: 17px 0 20px; }

/*Latest List*/
.latest-list li { padding: 8px 0; border-top: 1px solid #091f74; }

.latest-list li:first-child { padding-top: 0; border-top: none; }

.latest-list li a { color: #eee; }

.latest-list small { color: #999; display: block; }

/*Link List*/
.link-list li { border-top: solid 1px #353535; }

.link-list li:first-child { border-top: none !important; }

.link-list a { color: #eee; font-size: 11px; padding: 6px 0px; display: inline-block; text-transform: uppercase; }

.link-list li i { color: #bbb; float: right; margin-top: 10px; }

/*Latest Tweets*/
.latest-tweets .latest-tweets-inner p { color: #555; font-size: 13px; }

.latest-tweets .latest-tweets-inner a { /*color: #3498db;*/ text-decoration: none; }
.latest-tweets .latest-tweets-inner a:hover { text-decoration: underline; }

.latest-tweets .latest-tweets-inner i.fa { top: 2px; float: left; color: #bbb; color: #55acee; font-size: 18px; margin-right: 5px; position: relative; }

.latest-tweets .latest-tweets-inner small { color: #777; display: block; }

/*Social Icons*/
.social-icons { margin-top: 5px; }

.social-icons li { margin: 0; }

.social-icons li a { margin: 0 3px; }

/*Breadcrumbs
------------------------------------*/
/*Default Breadcrumbs*/
.breadcrumbs { overflow: hidden; padding: 5px 0 0px; border: solid 1px #eee; background: url(images/breadcrumbs.png) repeat; }
.breadcrumbs h1 { color: #666; font-size: 22px; margin-top: 8px; }

.breadcrumbs .title { color: #666; font-size: 22px; margin-top: 8px; }


.breadcrumb { top: 10px; padding-right: 0; background: none; position: relative; }
.breadcrumb a { color: #777; white-space: nowrap; }
.breadcrumb li.active,
.breadcrumb li a:hover { color: #72c02c; text-decoration: none; }

@media (max-width: 550px) {
    .breadcrumbs h1.pull-left,
    .breadcrumbs ul.pull-right { width: 100%; text-align: center; }

    .breadcrumbs h1.pull-left { margin-bottom: 0; }

    .breadcrumbs .breadcrumb { top: 0; margin-bottom: 10px; }

    .zoom-icon { display: none; }
    .fr { display: block; width: 100%; float: left; margin-top: 10px; }
}

/*Thumbnails
------------------------------------*/
a.thumbnail { padding: 0; border: none; margin-bottom: 15px; }

.thumbnail-style { padding: 7px; margin-bottom: 25px; box-shadow: 0 0 8px #ddd; -webkit-transition: box-shadow 0.2s ease-in-out; -moz-transition: box-shadow 0.2s ease-in-out; -o-transition: box-shadow 0.2s ease-in-out; transition: box-shadow 0.2s ease-in-out; }
.thumbnail-style:hover { box-shadow: 0 0 8px #999; -webkit-transition: box-shadow 0.2s ease-in-out; -moz-transition: box-shadow 0.2s ease-in-out; -o-transition: box-shadow 0.2s ease-in-out; transition: box-shadow 0.2s ease-in-out; }

.thumbnail h3,
.thumbnail-style h3 { margin: 6px 0 8px 0; }

.thumbnail h3 a,
.thumbnail-style h3 a { color: #585f69; font-size: 16px; display: block; height: 50px; overflow: hidden; }

.thumbnail h3 a:hover,
.thumbnail-style h3 a:hover { color: #72c02c; text-decoration: none; }

.thumbnail-style .thumbnail-img { position: relative; margin-bottom: 11px; }
.imggr {position:relative;width:100%;height:165px;overflow:hidden;z-index:0}

.thumbnail-style a.btn-more { right: 0px; bottom: 10px; color: #fff; padding: 1px 6px; position: absolute; background: #72c02c; display: inline-block; }
.thumbnail-style a.btn-more:hover { text-decoration: none; }
.thumbnail-style:hover a.btn-more { right: 0px; }

/*Servive Blocks
------------------------------------*/
/*Service Alternative Block*/
.service-alternative .service:hover { background: #76ca2c; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }
.service-alternative .service:hover i,
.service-alternative .service:hover p,
.service-alternative .service:hover h4 { color: #fff; }

/*Servive Block Versions*/
.service-v1 h2 { margin: 15px 0 10px; font-size: 20px; line-height: 28px; }

.service-v1 p { text-align: justify; }

/*Blog Posts
------------------------------------*/
.posts .dl-horizontal a { color: #555; }

.posts .dl-horizontal { margin-bottom: 15px; overflow: hidden; }

.posts .dl-horizontal dt { width: 60px; float: left; }

.posts .dl-horizontal dt img { width: 60px; height: 60px; padding: 2px; margin-top: 2px; border: solid 1px #ddd; }

.posts .dl-horizontal dd { margin-left: 70px; }

.posts .dl-horizontal dd p { margin: 0; }

.posts .dl-horizontal dd a { font-size: 14px; line-height: 16px !important; }

.posts .dl-horizontal dd a:hover { color: #72c02c; text-decoration: none; }

.posts .dl-horizontal:hover dt img,
.posts .dl-horizontal:hover dd a { color: #72c02c; border-color: #72c02c !important; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

/*About Page
------------------------------------*/
.team ul.team-socail { text-align: right; }

.team ul.team-socail li { margin: 0 !important; padding: 0 !important; }

.team ul.team-socail li a,
.team ul.team-socail li a:hover { text-decoration: none; }

.team ul.team-socail li i { color: #aaa; padding: 6px 7px; min-width: 30px; font-size: 18px; text-align: center; background: #f7f7f7; display: inline-block; }

.team ul.team-socail li i:hover { color: #fff; background: #72c02c; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

.team .thumbnail-style { padding: 12px; }

.team .thumbnail-style img { margin-bottom: 7px; }

.team .thumbnail-style h3 { margin-bottom: 5px; }

.team .thumbnail-style:hover h3 a { color: #72c02c !important; }

.team .thumbnail-style small { display: block; margin-top: 5px; font-size: 12px; }

/*About Me Page
------------------------------------*/
.about-me { overflow: hidden; }

.about-me h2 { margin: 0; font-size: 20px; text-transform: uppercase; }

.about-me span { color: #999; display: block; font-size: 14px; margin-bottom: 10px; }

.about-me .social-icons { margin-top: 7px; }

/*About My Goals*/
.about-my-goals h2 { text-transform: uppercase; }

/*About Skills*/
.about-skills { padding: 40px 0; border-top: 1px solid #eee; border-bottom: 1px solid #eee; background: url(images/breadcrumbs.png) repeat; }

/*Gallery Page
------------------------------------*/
.gallery-page .thumbnail,
.gallery-page .thumbnail:hover { padding: 0; border: none; box-shadow: none; }
.gallery-page .thumbnails { margin-bottom: 6px; }

/*Privacy Page
------------------------------------*/
.privacy a { text-decoration: underline; }
.privacy a:hover { color: #72c02c; text-decoration: none; }

/*Portfolio Item Page v1
------------------------------------*/
.portfolio-item h2 { color: #555; font-size: 24px; margin: 0 0 15px; }
.portfolio-item li { padding: 3px 0; }
.portfolio-item p a { text-decoration: underline; }
.portfolio-item p a:hover { text-decoration: none; }

/*Portfolio Item v1*/
.portfolio-item1 ul { margin: 10px 0 20px; }

.portfolio-item1 li { font-size: 16px; margin-bottom: 3px; }

.portfolio-item1 li i { font-size: 18px; margin-right: 4px; }

/*Sidebar Features
------------------------------------*/
/*Blog Tags*/
ul.blog-tags li { display: inline-block; }

ul.blog-tags a { font-size: 13px; padding: 2px 7px; background: #f7f7f7; margin: 0 3px 6px 0; display: inline-block; }

ul.blog-tags a i { color: #666; }

ul.blog-tags a:hover { background: #72c02c; }

ul.blog-tags a:hover,
ul.blog-tags a:hover i { color: #fff !important; text-decoration: none; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

/*Blog Photo Stream*/
.blog-photos li { display: inline; }

.blog-photos li img { width: 58px; height: 58px; margin: 0 2px 8px; }

.blog-photos li img:hover { box-shadow: 0 0 0 2px #72c02c; }

/*Blog Latest Tweets*/
.blog-twitter .blog-twitter-inner { padding: 10px; position: relative; background: #f7f7f7; margin-bottom: 10px; }

.blog-twitter .blog-twitter-inner,
.blog-twitter .blog-twitter-inner:after,
.blog-twitter .blog-twitter-inner:before { transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; }

.blog-twitter .blog-twitter-inner:after,
.blog-twitter .blog-twitter-inner:before { width: 0; height: 0; right: 0px; bottom: 0px; content: " "; display: block; position: absolute; }

.blog-twitter .blog-twitter-inner:after { border-top: 15px solid #eee; border-right: 15px solid transparent; border-left: 0px solid transparent; border-left-style: inset; /*FF fixes*/ border-right-style: inset; /*FF fixes*/ }
.blog-twitter .blog-twitter-inner:before { border-bottom: 15px solid #fff; border-right: 0 solid transparent; border-left: 15px solid transparent; border-left-style: inset; /*FF fixes*/ border-bottom-style: inset; /*FF fixes*/ }

.blog-twitter .blog-twitter-inner:hover { border-color: #72c02c; border-top-color: #72c02c; }
.blog-twitter .blog-twitter-inner:hover:after { border-top-color: #72c02c; }

.blog-twitter .blog-twitter-inner span.twitter-time { color: #777; display: block; font-size: 11px; }

.blog-twitter .blog-twitter-inner a { color: #72c02c; text-decoration: none; }
.blog-twitter .blog-twitter-inner a:hover { text-decoration: underline; }

.blog-twitter .blog-twitter-inner i.fa { top: 2px; color: #bbb; font-size: 18px; position: relative; }

/*Choose Block*/
.who li { margin-bottom: 6px; }
.who li i { color: #72c02c; font-size: 13px; min-width: 15px; margin-right: 8px; text-align: center; position: relative; }
.who li:hover i,
.who li:hover a { color: #777; }
.who li:hover a:hover { text-decoration: none; }

/*Promo Page
------------------------------------*/
/*Slider Part*/
.fullwidthbanner-container.slider-promo { max-height: 460px !important; }

.slider-promo-info-bg { padding: 25px 20px 20px; background: url(images/bg-black.html) repeat; }

.slider-promo-info span.big-size { color: #fff; display: block; font-size: 30px; margin-bottom: 25px; text-shadow: none !important; }

.slider-promo-info p { color: #fff; font-size: 16px; margin-bottom: 0; }

/*Promo Box*/
.promo-box { padding: 20px; margin: 25px 0 20px; text-align: center; }

.promo-box i { display: block; font-size: 50px; }

.promo-box p { font-size: 14px; margin-bottom: 0; }

.promo-box strong,
.promo-box strong a { color: #555; display: block; font-size: 20px; font-weight: 200; margin: 20px 0 15px; }

.promo-box:hover strong,
.promo-box:hover strong a { color: #72c02c; }

/*Promo Service*/
.promo-service { margin-bottom: 20px; }

.promo-service li { margin-bottom: 5px; }

.promo-service a.btn-u { margin: 0px 20px 10px 0; }

/*Promo Elements*/
.title-box { font-size: 16px; text-align: center; padding: 10px 0 30px; border-bottom: solid 1px #eee; }

.title-box .title-box-text { color: #555; display: block; font-size: 35px; font-weight: 200; }

@media (max-width: 768px) {
    .title-box .title-box-text { font-size: 26px; line-height: 34px; margin-bottom: 10px; }
    .title-box p { font-size: 15px; }
    .zoom-icon { display: none; }
}

.block-blockquote { margin: 20px 0; text-align: center; border: dashed 1px #ccc; }

.block-blockquote-inner { padding: 15px; }

.block-blockquote p { font-size: 26px; margin-bottom: 0; }

/*Info Blocks*/
.info-blocks { margin-bottom: 15px; }

.info-blocks:hover i.icon-info-blocks { color: #72c02c; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

.info-blocks i.icon-info-blocks { float: left; color: #777; font-size: 30px; min-width: 50px; margin-top: 10px; text-align: center; }

.info-blocks .info-blocks-in { padding: 0 10px; overflow: hidden; }

.info-blocks .info-blocks-in h3 { color: #555; font-size: 20px; line-height: 28px; }

.info-blocks .info-blocks-in p { font-size: 12px; }

/*Brand Page
------------------------------------*/
.brand-page .btn { margin-bottom: 10px; }

/*Form Pages
------------------------------------*/
.form-page input,
.form-page select { margin-bottom: 10px; }

/*Labels and Badges Page
------------------------------------*/
ul.labels-demo { margin: 5px 0; }

ul.labels-demo li { list-style: none; display: inline-block; margin: 0 5px 2px 0; }

.badge-sidebar { border-left: solid 1px #eee; }

@media (max-width: 991px) {
    .badge-sidebar { border-left: none; }
}

/*Line Icon Page
------------------------------------*/
.line-icon-page .item-box { width: 25%; float: left; height: 90px; text-align: center; padding: 20px 10px; margin: 0 -1px -1px 0; word-wrap: break-word; border: 1px solid #ddd; }

@media (max-width: 768px) {
    .line-icon-page .item-box { height: 115px; }
}

@media (max-width: 450px) {
    .line-icon-page .item-box { height: 130px; }
}

.line-icon-page .item-box:hover { background: #fafafa; }

.line-icon-page .item span { display: block; font-size: 28px; margin-bottom: 10px; }

.line-icon-page .item:hover { color: #72c02c; }

/*Line Icon Page
------------------------------------*/
.icon-page-fa { margin-bottom: 20px; }

.icon-page-fa .item-box { float: left; height: 100px; width: 16% !important; }

.icon-page-fa .item { font-size: 12px; }

.icon-page-fa .item i { color: #555; display: block; font-size: 24px; margin-bottom: 10px; }

@media (max-width: 767px) {
    .icon-page-fa .item-box { width: 20% !important; }
}

@media (max-width: 600px) {
    .icon-page-fa .item-box { width: 30% !important; }
}

@media (max-width: 400px) {
    .icon-page-fa .item-box { width: 50% !important; }
}

/*GLYPHICONS Icons Page
------------------------------------*/
/*Special styles for displaying the icons and their classes*/
.bs-glyphicons { padding-left: 0; list-style: none; overflow: hidden; padding-bottom: 1px; margin-bottom: 20px; }

.bs-glyphicons li { width: 25%; float: left; height: 115px; padding: 10px; font-size: 11px; line-height: 1.4; text-align: center; margin: 0 -1px -1px 0; border: 1px solid #ddd; }

.bs-glyphicons .glyphicon { display: block; font-size: 18px; margin: 5px auto 10px; }

.bs-glyphicons li:hover { color: #72c02c; background-color: #fafafa; }

@media (min-width: 768px) {
    .bs-glyphicons li { width: 12.5%; }
}

/*Glyphicons Pro*/
.demo-pro-glyphicons li { width: 170px; height: 100px; padding: 20px 10px 30px; }

.demo-pro-glyphicons span { height: 40px; display: block; }

.demo-pro-glyphicons span:before { color: #555; padding: 10px 62px; }

.demo-pro-glyphicons span.glyphicons:before { font-size: 22px; }

/*Glyphicons Pro Halflings*/
.demo-pro-glyphicons span.halflings { height: 30px; }

.demo-pro-glyphicons span.halflings:before { padding: 10px 70px; }

/*Contact Pages
------------------------------------*/
.map { width: 100%; height: 350px; border-top: solid 1px #eee; border-bottom: solid 1px #eee; }

.map-box { height: 250px; }

.map-box-space { margin-top: 15px; }

.map-box-space1 { margin-top: 7px; }

/*Background Opacity
------------------------------------*/
.service-or { overflow: hidden; position: relative; }

.service-bg { width: 250px; padding: 60px; position: absolute; top: -10px; right: -100px; background-color: rgba(255,255,255,0.1); transform: rotate(55deg); -o-transform: rotate(55deg); -ms-transform: rotate(55deg); -moz-transform: rotate(55deg); -webkit-transform: rotate(55deg); }

/*Service Block v2
------------------------------------*/
.service-block-v2 .service-block-in { padding: 20px 30px; text-align: center; margin-bottom: 15px; background: rgba(255,255,255,0.2); }

.service-block-v2 .service-block-in img { width: 100%; margin-bottom: 15px; }

.service-block-v2 .service-block-in i { font-size: 40px; }

.service-block-v2 .service-block-in h4 { line-height: 25px; }

.service-block-v2 .service-block-in p { margin-bottom: 20px; }

.service-block-v2 .service-block-in i,
.service-block-v2 .service-block-in h4,
.service-block-v2 .service-block-in p { color: #fff; }

/*Easy Block
------------------------------------*/
.easy-block-v1 { position: relative; }

.easy-block-v1 img { width: 100%; }

.easy-block-v1 .overflow-h h3 { width: 60%; float: left; font-size: 18px; line-height: 24px; margin-bottom: 5px; }

.easy-block-v1 .easy-block-v1-badge { left: 0px; top: 10px; z-index: 1; color: #fff; padding: 4px 10px; position: absolute; }

/*Easy Block v2
------------------------------------*/
.easy-block-v2 { overflow: hidden; position: relative; margin-bottom: 20px; }

.easy-block-v2 img { width: 100%; }

.easy-bg-v2 { top: 5px; color: #fff; width: 100px; padding: 5px; right: -32px; font-size: 13px; position: absolute; text-align: center; letter-spacing: 2px; transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); }

/*Easy Block v3
------------------------------------*/
.easy-block-v3 { text-align: left; background: #585f69; margin-bottom: 10px; padding: 30px 20px 20px; }

.easy-block-v3.first { background: #696f77; }
.easy-block-v3.second { background: #707780; }
.easy-block-v3.third { background: #787f88; }

.easy-block-v3 i { color: #fff; float: left; font-size: 30px; min-width: 45px; padding-top: 10px; }

.easy-block-v3 .inner-faq-b { overflow: hidden; }

.easy-block-v3 .inner-faq-b h2,
.easy-block-v3 .inner-faq-b h3 { font-size: 21px; margin-bottom: 8px; }

.easy-block-v3 .inner-faq-b h4 { color: #fff; font-size: 17px; margin-bottom: 2px; }

.easy-block-v3 .inner-faq-b h2,
.easy-block-v3 .inner-faq-b h3,
.easy-block-v3 .inner-faq-b p { color: #fff; }

/*Full Width Block
------------------------------------*/
.full-w-block { padding: 30px 0; background: #282828; }

.full-w-block .info-blocks i,
.full-w-block .info-blocks-in h3 { color: #fff; }

.full-w-block .info-blocks-in p { color: #ccc; }

.full-w-block .info-blocks:hover i.icon-info-blocks { color: #fff; }

/*Team v2
------------------------------------*/
.team-v2 { position: relative; margin-bottom: 20px; }

.team-v2 img { width: 100%; }

.team-v2 .inner-team { padding: 20px; background: #fff; text-align: center; }

.team-v2 .inner-team h3 { margin: 0; }

.team-v2 .inner-team small { display: block; font-size: 12px; margin-bottom: 7px; }

.team-v2 .inner-team p { font-size: 13px; }

.team-v2 .inner-team hr { margin: 10px 0 15px; }

/*Team-Social ---- Temporary*/
.team-social { margin-bottom: 0; }

.team-social li { padding: 0 2px; }

.team-social li a { font-size: 14px; padding: 6px 4px; text-align: center; border-radius: 50% !important; }

.team-social li i { min-width: 20px; }

.team-social li a.fb { color: #4862a3; border: 1px solid #4862a3; }

.team-social li a.tw { color: #159ceb; border: 1px solid #159ceb; }

.team-social li a.gp { color: #dc4a38; border: 1px solid #dc4a38; }

.team-social li a:hover { text-decoration: none; }

.team-social li a.fb:hover { color: #fff; background: #4862a3; }

.team-social li a.tw:hover { color: #fff; background: #159ceb; }

.team-social li a.gp:hover { color: #fff; background: #dc4a38; }

/*Simple Block
------------------------------------*/
.simple-block { margin-bottom: 20px; }

.simple-block img { width: 100%; }

.simple-block p { text-align: center; }

.simple-block .carousel-indicators { top: 10px; left: 65%; text-align: right; }

.simple-block .carousel-indicators .active { background: #555; }

.simple-block .carousel-indicators li { border-color: #555; }

.simple-block .carousel-inner > .item { margin: 0; }

.simple-block .responsive-video { margin-bottom: 3px; }

/*Two Blocks
------------------------------------*/
.two-blocks { text-align: center; }

.two-blocks-in { margin-bottom: 30px; }

.two-blocks-in i { color: #fff; padding: 11px; font-size: 30px; min-width: 50px; text-align: center; background: #585f69; margin-bottom: 10px; display: inline-block; }

/*Three Blocks
------------------------------------*/
.three-blocks { text-align: center; }

.three-blocks-in { margin-bottom: 30px; }

.three-blocks-in i { color: #777; padding: 9px 6px; font-size: 20px; min-width: 40px; margin-bottom: 10px; border: 1px solid #777; }

.three-blocks-in h3 { font-size: 20px; margin-bottom: 7px; }

/*Temperory Classes
------------------------------------*/
/*Banner-info*/
.banner-info { margin-bottom: 10px; }

.banner-info i { float: left; color: #fff; padding: 11px; /*min-width works with line-icon*/ min-width: 40px; font-size: 22px; text-align: center; margin: 7px 20px 0 0; }

/*min-width works with FontAwesome*/
.banner-info i.fa { min-width: 46px; }

.banner-info.light i { border: 1px solid #fff; }

.banner-info.dark i { background: #585f69; }

.banner-info h3 { font-size: 21px; margin-bottom: 5px; }

.banner-info.light h3 { color: #fff; }
.banner-info.light p { color: #eee; }

/*Breadcrumb-V2*/
.breadcrumbs-v2 { text-align: center; position: relative; background: url(images/bg/11.html) no-repeat center; }

.breadcrumbs-v2-in { padding: 60px 0; position: relative; }

.breadcrumbs-v2 h1 { color: #fff; text-transform: uppercase; }

.breadcrumb-v2 li a,
.breadcrumb-v2 li.active { color: #fff; }

.breadcrumb-v2 li i { color: #fff; min-width: 19px; padding: 3px 7px; margin-right: 5px; text-align: center; border: 1px solid #fff; }

/*Breadcrumbs-v3*/
.breadcrumbs-v3 { padding: 10px 0; background: #585f69; border-bottom: 1px solid #eee; }

.breadcrumbs-v3 h1 { color: #fff; margin: 3px 0; font-size: 22px; font-weight: 200; }

.breadcrumbs-v3 .breadcrumb { padding: 0; margin-top: 2px; margin-bottom: 0; }

.breadcrumbs-v3 .breadcrumb li a { color: #fff; }

/*Title-Box-V2*/
.title-box-v2 { text-align: center; margin-bottom: 40px; }

.title-box-v2 h2 { font-size: 25px; text-transform: uppercase; }

.title-box-v2 p { font-size: 13px; }

/*remove padding from "Col-"*/
.no-space { padding: 0; }

.no-space-left { padding-left: 0; padding-right: 15px !important; }

.no-space-right { padding-right: 0; padding-left: 15px !important; }

/*List Style v1*/
.list-style-v1 li { margin-bottom: 7px; }

.list-style-v1 i { margin-right: 5px; }

/*Social Contacts
------------------------------------*/
.social-contacts li { padding: 5px 0; border-top: 1px solid #ddd; }

.social-contacts li:first-child { border-top: none; }

.social-contacts li i { color: #777; font-size: 13px; min-width: 13px; margin-right: 12px; text-align: center; }

/*Service Block v3
------------------------------------*/
.service-block-v3 { padding: 20px; }

.service-block-v3 i { color: #fff; float: left; font-size: 50px; margin: 0 20px 20px 0; }

.service-block-v3 .service-heading,
.service-block-v3 .service-in small { color: #fff; opacity: 0.8; line-height: 1; }

.service-block-v3 .service-in h4,
.service-block-v3 .counter { color: #fff; }

.service-block-v3 .service-heading { font-size: 16px; text-transform: uppercase; }

.service-block-v3 .counter { display: block; line-height: 1; font-size: 30px; }

.service-block-v3 .progress { margin-bottom: 7px; }

/*Service Innner*/
.service-block-v3 .service-in small { font-size: 16px; text-transform: uppercase; }

.service-block-v3 .service-in h4 { font-size: 16px; line-height: 0.8; margin-bottom: 0; }

/*Statistics*/
.service-block-v3 .statistics .heading-xs { color: #fff; opacity: 0.8; }

.service-block-v3 .statistics small { color: #fff; }

.service-block-v3 .statistics .progress { background: #bbb; }

.service-block-v3 .statistics .progress-bar-light { background: #fff; }

/*Status Bar
------------------------------------*/
.status-bar li { padding-left: 9px; border-left: 1px solid #eee; }

.status-bar li:first-child { border-left: none; }

.status-bar li i { color: #72c02c; margin-right: 5px; }

.status-bar li a:hover { text-decoration: none; }

.status-bar-in { padding: 10px; position: relative; background: #f0f0f0; }

.status-bar-in:after { width: 0; height: 0; top: -10px; left: 50px; content: " "; display: block; position: absolute; border-bottom: 11px solid #f0f0f0; border-left: 11px solid transparent; border-right: 11px solid transparent; border-left-style: inset; /*FF fixes*/ border-right-style: inset; /*FF fixes*/ }

/*Share List*/
.share-list { margin-bottom: 0; }

.share-list li { padding-left: 20px; }

.share-list li:first-child { padding-left: 0; }

.share-list li i { color: #72c02c; margin-right: 5px; }

/*Table Search v1
------------------------------------*/
.table-search-v1 .btn-u.dropdown-toggle { border-left: none; }

.table-search-v1 .btn-group .btn-u { top: 4px; padding: 0 6px; position: relative; }

.table-search-v1 thead { border-bottom: solid 1px #ddd; }

.table-search-v1 td { vertical-align: middle !important; }

.table-search-v1 td a { color: #555; }

.table-search-v1 td span { display: block; }

.table-search-v1 .star-vote { margin: 5px 0 0px; }

.table-search-v1 .star-vote li { padding: 0; }

.table-search-v1 .progress { margin-bottom: 0; }

.table-search-v1 .m-marker a { font-size: 11px; }

.table-search-v1 .m-marker i { float: left; min-width: 20px; font-size: 26px; }

.table-search-v1 .m-marker .display-b { top: 3px; display: block; line-height: 10px; position: relative; }

.table-search-v1 .td-width { width: 40%; }

/*Table Search v2
------------------------------------*/
.table-search-v2 .btn-u.dropdown-toggle { border-left: none; }

.table-search-v2 .btn-group .btn-u { top: 4px; padding: 0 6px; position: relative; }

.table-search-v2 thead { border-bottom: solid 1px #ddd; }

.table-search-v2 td { vertical-align: middle !important; }

.table-search-v2 td img { width: 60px; height: 60px; margin: 0 auto; display: block; }

.table-search-v2 .user-names span,
.table-search-v2 .user-names small { display: block; text-align: center; }

.table-search-v2 .user-names span { color: #555; font-size: 16px; position: relative; }

.table-search-v2 .user-names small { color: #999; font-size: 13px; }

.table-search-v2 td h3 { font-size: 16px; margin: 0 0 2px; }

.table-search-v2 td a { color: #555; }

.table-search-v2 td p { margin-bottom: 0; }

.table-search-v2 td span { display: block; }

.table-search-v2 td small { font-style: italic; }

.table-search-v2 .s-icons { margin-bottom: 0; }

.table-search-v2 .s-icons li { padding: 2px; }

.table-search-v2 .table-buttons { margin: 0; }

.table-search-v2 .table-buttons li { padding: 0; }

.table-search-v2 .table-buttons .btn-u-sm { padding: 3px 6px; }

.table-search-v2 .td-width { width: 55%; }

/*People Say
------------------------------------*/
.people-say img { float: left; width: 40px; height: auto; margin: 6px 10px 0 0; }

.people-say .overflow-h span { font-weight: 700; }

.people-say .overflow-h p { font-style: italic; line-height: 1.3; }

.people-say .overflow-h small { text-align: right; font-style: italic; }

/*Page Option v1
------------------------------------*/
.page-option-v1 p { color: #999; font-size: 14px; }

/*Inspire Page
------------------------------------*/
img.img-mouse { width: 150px; height: auto; margin: 0 auto 60px; }

/*Desire Page
------------------------------------*/
/*Service Info*/
.service-info { position: relative; padding: 40px 0 50px; background: url(images/patterns/17.html) repeat; }

.service-info .info-description { overflow: hidden; }

.service-info i.service-info-icon { color: #777; float: left; width: 50px; height: 50px; padding: 15px; font-size: 20px; line-height: 17px; margin-right: 20px; text-align: center; display: inline-block; border: 1px solid #777; }

.service-info .info-description h3 { margin: 0 0 10px; }

.service-info .info-description p { color: #777; }

/*Portfolio Single Item Page
------------------------------------*/
/*Project Details*/
.project-details li { color: #555; font-weight: 200; margin-bottom: 5px; }

.project-details strong { min-width: 100px; display: inline-block; }

.project-details a { text-decoration: underline; }

/*Bootstrap Testimonials
------------------------------------*/
.testimonials-bs { padding: 50px 0; background: url(images/bg/16.html) 50% 0 repeat fixed; }

.testimonials-bs .headline-center-v2 span.author { color: #777; font-size: 14px; }

/*Removes Bootstrap carousel background images*/
.testimonials-bs .item { margin-bottom: 30px; }

.testimonials-bs .carousel-arrow { text-align: center; }

.testimonials-bs .carousel-control-v2 i { color: #888; width: 30px; height: 30px; padding: 2px; font-size: 22px; display: inline-block; border: 2px solid #888; }

.testimonials-bs .carousel-control-v2 i:hover { color: #72c02c; border-color: #72c02c; text-decoration: none; transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; }

.testimonials-bs .carousel-control-v2.left,
.testimonials-bs .carousel-control-v2.right { text-decoration: none; background-image: none; }

/*Team v1*/
.team-v1 li > h3 { color: #555; }
#fanpage { margin-top: 30px; }

.video-home { margin-top: 45px; position: relative; }
.video-home img { cursor: pointer; }
.video-home .playicon { cursor: pointer; width: 79px; height: 49px; background: url(images/yplayhv.png) no-repeat; position: absolute; left: 50%; top: 50%; margin-left: -35px; margin-top: -25px; }

#vgc_adv_client { display: none; }
#panel_chat_vatgia .panel_footer_vgchat .vgc_bt_logovchat, #vgc_logo_msgoffline .vgclogovchat, .vgc_bt_logovchat { display: none !important; }

.faq-cnt .panel-group { margin-bottom: 10px; }
.faq-cnt .panel-group .panel { border-radius: 0px; box-shadow: none; }
.faq-cnt .panel-title { font-size: 14px; }
.faq-cnt .panel-title a { display: block; }
.faq-cnt .panel-heading { padding: 5px 35px 0px 15px; background: #fafafa url(images/arrow-down-b.png) no-repeat right center; }

.posts ul { padding: 0px; }
.posts ul li { list-style: none; }
.posts ul li a { color: #fff; line-height: 23px; }

.mb20 { margin-bottom: 20px; }
/*=================== Start phone ring ===============*/
.coccoc-alo-phone {
    background-color: transparent;
    cursor: pointer;
    height: 120px;
    position: fixed;
    transition: visibility 0.5s ease 0s;
    visibility: hidden;
    width: 120px;
    z-index: 200000 !important;
}
.coccoc-alo-phone.coccoc-alo-show {
    visibility: visible;
}
.coccoc-alo-phone.coccoc-alo-hover, .coccoc-alo-phone:hover {
    opacity: 1;
}
.coccoc-alo-ph-circle {
    animation: 1.2s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim;
    background-color: transparent;
    border: 2px solid rgba(30, 30, 30, 0.4);
    border-radius: 100%;
    height: 96px;
    left: 20px;
    opacity: 0.1;
    position: absolute;
    top: 20px;
    transform-origin: 50% 50% 0;
    transition: all 0.5s ease 0s;
    width: 96px;
}
.coccoc-alo-phone.coccoc-alo-active .coccoc-alo-ph-circle {
    animation: 1.1s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim !important;
}
.coccoc-alo-phone.coccoc-alo-static .coccoc-alo-ph-circle {
    animation: 2.2s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim !important;
}
.coccoc-alo-phone.coccoc-alo-hover .coccoc-alo-ph-circle, .coccoc-alo-phone:hover .coccoc-alo-ph-circle {
    border-color: #00aff2;
    opacity: 0.5;
}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-circle, .coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-circle {
    border-color: #baf5a7;
    opacity: 0.5;
}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-circle {
    border-color: #bfebfc;
    opacity: 0.5;
}
.coccoc-alo-ph-circle-fill {
    animation: 2.3s ease-in-out 0s normal none infinite running coccoc-alo-circle-fill-anim;
    background-color: #000;
    border: 2px solid transparent;
    border-radius: 100%;
    height: 60px;
    left: 50px;
    opacity: 0.1;
    position: absolute;
    top: 50px;
    transform-origin: 50% 50% 0;
    transition: all 0.5s ease 0s;
    width: 60px;
}
.coccoc-alo-phone.coccoc-alo-hover .coccoc-alo-ph-circle-fill, .coccoc-alo-phone:hover .coccoc-alo-ph-circle-fill {
    background-color: rgba(0, 175, 242, 0.5);
    opacity: 0.75 !important;
}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-circle-fill, .coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-circle-fill {
    background-color: rgba(117, 235, 80, 0.5);
    opacity: 0.75 !important;
}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-circle-fill {
    background-color: rgba(0, 175, 242, 0.5);
    opacity: 0.75 !important;
}

.coccoc-alo-ph-img-circle {
    animation: 1s ease-in-out 0s normal none infinite running coccoc-alo-circle-img-anim;
    border: 2px solid transparent;
    border-radius: 100%;
    height: 36px;
    left: 42px;
    opacity: 0.7;
    position: absolute;
    top: 42px;
    transform-origin: 50% 50% 0;
    width: 36px;
}

.coccoc-alo-phone.coccoc-alo-hover .coccoc-alo-ph-img-circle, .coccoc-alo-phone:hover .coccoc-alo-ph-img-circle {
    background-color: #00aff2;
}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-img-circle, .coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-img-circle {
    background-color: #75eb50;
}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-img-circle {
    background-color: #00aff2;
}
@keyframes coccoc-alo-circle-anim {
0% {
    opacity: 0.1;
    transform: rotate(0deg) scale(0.5) skew(1deg);
}
30% {
    opacity: 0.5;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
100% {
    opacity: 0.6;
    transform: rotate(0deg) scale(1) skew(1deg);
}
}

@keyframes coccoc-alo-circle-img-anim {
0% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
10% {
    transform: rotate(-25deg) scale(1) skew(1deg);
}
20% {
    transform: rotate(25deg) scale(1) skew(1deg);
}
30% {
    transform: rotate(-25deg) scale(1) skew(1deg);
}
40% {
    transform: rotate(25deg) scale(1) skew(1deg);
}
50% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
}
@keyframes coccoc-alo-circle-fill-anim {
0% {
    opacity: 0.2;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
50% {
    opacity: 0.2;
    transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
    opacity: 0.2;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
}
.coccoc-alo-ph-img-circle a img {
    padding: 4px 0 0 3px;
}

/*=================== End phone ring ===============*/
