/*
Theme Name: webbanhanghailinh
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
.nav-dropdown{padding: 10px 0}
.nav-column>li>a, .nav-dropdown>li>a, .nav-vertical-fly-out>li>a, .nav>li>a{color: #333}
.header-search-form-wrapper .search-field{height: 40px; border-radius: 20px 0 0  20px; padding-left: 30px}
.header-search-form-wrapper .ux-search-submit{height: 40px; width: 45px; border-radius: 0 20px 20px 0}
.col-inner>.img:not(:last-child), .col>.img:not(:last-child){margin-bottom: 0}

.hwp-title-home .section-title-main{background: linear-gradient(-90deg, rgb(255 255 255 / 0%) -19%, #074eb4 100%); border-width: 0}

.hwp-product-cat .icon-box .icon-box-img{margin-bottom: 5px}
.section-title{margin-bottom: 0}
.section-title a{font-weight: normal; font-size: 15px}
.box-blog-post .post-title a{    display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;width: 100%;}

.product-small .col-inner{border: 1px solid #e4e4e7}
.product-small .col-inner .price-wrapper{margin-top: 10px}
.product-small:hover .col-inner{border-color: var(--fs-color-primary);}
.product-small .product-title a{font-size: 0.9em}
.product-small .product-title{font-size: 1.1em}

/*PRODUCT CAT*/
.hwp-sub-category{margin-top: 20px}
.live-sub-cats {margin: 0;padding: 0;text-align: center;}
.live-sub-cats li {display: inline-block;padding: 7px 10px;border-radius: 5PX;;margin-right: 10px;margin-bottom: 10px;text-decoration: none; border: 1px solid var(--fs-color-primary);}
.live-sub-cats li a {color: var(--fs-color-primary);font-size: 14px; font-weight: 600}
.live-sub-cats li:hover {background-color: var(--fs-color-primary);}
.live-sub-cats li:hover a {background-color: var(--fs-color-primary);color: #fff}

.widget .widget-title {height: 40px;line-height: 40px;position: relative;padding: 0px 10px;background: var(--fs-color-primary);display: block;text-transform: uppercase;font-size: 16px;margin: 0px;font-weight: bold;color: #fff;box-shadow: 2px 2px 2px #999999;text-align: center;}
.widget .is-divider{display: none}
.hwp-recent-box{margin-top: 20px !important}
.hwp-recent-box li{padding: 10px 0}
.hwp-recent-box li:first-child{padding-top: 0}
.hwp-recent-post{width: 100%; display: table}
.hwp-recent-post>div{display: table-cell; vertical-align: middle;}
.hwp-recent-post .box-image{width: 95px;}
.hwp-recent-post .box-image .overlay-icon{width: 30px; height: 30px; line-height: 30px}
.hwp-recent-post:hover .box-image .overlay-icon{transform: scale(1.1);}
.hwp-recent-post .box-image .image-cover{border-radius: 10px}
.box-text-link{padding-left: 15px; line-height: 1.1}
.box-text-link a{font-size: 15px; display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;}

/*Single Product*/
.hwp_single_price {margin: 0 0 20px;color: #000;}
.hwp_single_price > span{display: block;}
.hwp_price_top span.amount{font-size: 28px; color: #f00; margin-bottom: 10px}
.hwp_single_price span.label {color: #333;font-weight: 400;font-size: 14px;padding: 0;margin: 0;float: left;width: 82px;text-align: left;line-height: 18px;}
.hwp_single_price span.hwp_price .amount {font-size: 14px;font-weight: 700;color: #ff3a3a;}
.hwp_single_price span.hwp_price{position: relative; top:-4px}
.hwp_single_price span.hwp_price del .amount, .hwp_single_price span.hwp_price del {font-size: 14px;color: #333;font-weight: 400;}

.product-small .col-inner{border: 1px solid #eee; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.01);border-radius: 5px;}
.form-flat button, .cart .buy_now_button{border-radius: 5px;}
.single-product #main, .single-product .product-page-title{background-color: #F2F4F8; }
.single-product #main{padding-bottom: 30px}
.single-product .product-info{padding-top: 0; padding-bottom: 0}
.hwp-single-p-info, .hwp-p-detail{background-color: #fff; padding: 30px; }
.product-tabs > li > a{font-size: 22px; padding: 0}
.product-footer .woocommerce-tabs>.nav-line:not(.nav-vertical){margin-top: 0}
.product-footer .woocommerce-tabs{border-top: 0; padding-top: 0 !important}
.product-tabs.nav-line>li>a:before{display: none}
ul.product_list_widget li{margin: 0}
.product_list_widget .product-title{font-size: 14px; color: #212121}
.product_list_widget a:hover .product-title{color: var(--fs-experimental-link-color-hover);}
.product_list_widget .contact-for-price, .product_list_widget span.amount{font-size: 12px} 

.single-product .product-info .product-title{line-height: 1.3em; font-size: 22px; }
.pwb-single-product-brands{padding-top: 5px; margin-bottom: 10px}
.pwb-single-product-brands a:before{content: 'Thương hiệu '; font-size: 0.85em}
.pwb-single-product-brands img{width: 80px; padding: 3px; margin-left: 10px;}
/*.product-info .cart{margin-bottom: 0}*/
.product-short-description{ padding-top: 10px; border-bottom: 1px dotted #ddd; margin-bottom: 15px }
.product-short-description ul{margin-bottom: 10px}


.hwp-single-hotline{margin-bottom: 15px;border: solid 1px #005EE4;border-radius: 5px;padding: 15px 10px;}
.hwp-single-hotline p{color: #EA892B;font-size: 18px; margin-bottom: 0}
.hwp-single-hotline a{font-size: 30px; color: #005EE4; font-weight: bold}
.hwp-single-hotline a:hover{color: #cd0000}
.hwp-single-hotline a .fa{margin-right: 10px}

.cs-chinh-sach {display: table;width: 100%;}
.cs-box {display: -ms-flexbox;display: -webkit-box;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-left: -5px;margin-right: -5px;}
.csvc {padding-left: 5px;padding-right: 5px;position: relative;min-height: 1px;float: left;-ms-flex: 0 0 50%;-webkit-box-flex: 0;-ms-flex: 0 0 50%;flex: 0 0 50%;width: 50%;margin: 3px 0;}
.csvc-content {width: 100%;display: table; border: 1px solid #ebebeb; padding: 5px; border-radius: 3px}
.csvc-content img {height: 30px;vertical-align: middle;}
.csvc-content span {display: inline-table;width: calc(100% - 35px);padding-left: 5px; font-size: 14px}

/*Single Post*/

.related-head{font-size: 20px}
.related-head span{text-decoration:underline; font-weight: bold}
.relate-image {position: relative;overflow: hidden; background-size: cover;background-position: center;}
.relate-image::before {content: "";display: block;padding-top: 60.25%;}
.relate-image .image{position: absolute;top: 0;left: 0;bottom: 0;right: 0;margin: auto;}
.related-title{margin-top: 12px;}
.related-title a{font-size: 15px;color: #000; font-weight: bold; line-height: 1.3em}
.related-box .hwp-date{font-style:italic; font-size: 14px; margin-top: 3px; color: #666}
.relate-item:hover .related-title a{color: var(--fs-color-primary);}

/*Footer*/
.hwp-tabs-ft .nav-vertical+.tab-panels{border-left: 0}
.hwp-tabs-ft .nav-vertical>li>a{color: #212121; font-size: 16px;}
.hwp-tabs-ft .nav-vertical>li.active>a{color: var(--fs-color-primary);}
.hwp-tabs-ft .text-left{font-size: 30px; font-weight: bold; margin-bottom: 100px}
.hwp-tabs-ft.tabbed-content .nav-vertical{align-items: baseline;}
a.ft-maps span, a.ft-maps i {font-weight: normal; letter-spacing: 0}
.ft-info.text-box{bottom: 10px}
.hwp-tabs-ft .banner{border-radius: 10px; overflow: hidden}
.hwp-tabs-ft .banner .banner-inner .fill{background: linear-gradient(180deg, rgb(255 255 255 / 0%) 60%, rgb(0 174 239) 100%);}
.mb-ft-info p{margin-bottom: 10px}
.mb-accord .accordion-inner{padding-left: 0; padding-right: 0}
.mb-accord.accordion .toggle {left: auto; right: 0}
.mb-accord .accordion-title{padding-left: 5px; font-size: 1em}
.mb-accord .img img{border-radius: 10px}

.absolute-footer.dark{color: #fff}

/*Hotline*/

.online1 legend {margin-bottom: 0;width: auto;padding: 0 5px;border-bottom: 0;}
.online1 a:active,.online1 a:visited,.online1 a:link {color: #f00;}
.online1 fieldset {border: 1px solid #e1e1e1;margin: 15px 0 2px;padding: .35em .625em .75em;border-radius: 5px;}
#button2 {margin: 0;position: absolute;z-index: 2;top: -30px;right: -10px;display: inline-block;width: 35px;height: 35px;overflow: hidden;border: none;background: transparent;padding: 0;}
#button2:before {transform: rotate(45deg);}
#button2:after {transform: rotate(-45deg);}
#button2:after {content: '';position: absolute;height: 2px;width: 100%;top: 50%;left: 0;margin-top: -1px;background: #ffb400;border-radius: 5px;margin-top: -6px;animation: colorBackground .5s infinite;-webkit-animation: colorBackground 5s infinite;-moz-animation: colorBackground 5s infinite;-o-animation: colorBackground .5s infinite;}
#button2:before {content: '';position: absolute;height: 2px;width: 100%;top: 50%;left: 0;margin-top: -1px;background: #ffb400;border-radius: 5px;margin-top: -6px;animation: colorBackground .5s infinite;-webkit-animation: colorBackground 5s infinite;-moz-animation: colorBackground 5s infinite;-o-animation: colorBackground .5s infinite;}
.td-hotline img {height: 18px;}
.td-hotline {padding: 2px 5px;position: fixed;left: 0;bottom: 110px;}
.hotline-bh {position: fixed;bottom: 120px;left: 0;width: 300px;z-index: 9991;}
#hidden_content {margin-left: 45px;box-shadow: 0 0 6px rgba(0,0,0,10);-moz-box-shadow: 0 0 6px rgba(0,0,0,10);-webkit-box-shadow: 0 0 6px rgba(0,0,0,10);border-radius: 10px;display: none;}
.online1 {padding: 0;width: 100%;text-align: center;float: left;background: #fff;box-shadow: 0 0 6px rgba(0,0,0,10);-moz-box-shadow: 0 0 6px rgba(0,0,0,10);-webkit-box-shadow: 0 0 6px rgba(0,0,0,10);border-radius: 10px;padding: 0 5px 10px;}
.onlinea {border: 1px solid #024466;-moz-border-radius: 10px 10px 10px 10px;border-radius: 10px 10px 10px 10px;-webkit-border-radius: 10px 10px 10px 10px;padding: 4px;margin: 5px 0;}
.online_ht {width: 100%;clear: both;line-height: 1.6;padding: 0;}
.online_ht a{font-size: 0.9em}
.online_ht img{width: 30px}
.hotline-phone-ring-wrap {position: fixed;bottom: 100px;left: 0px;z-index: 999999;}
.hotline-phone-ring-wrap a:link,.hotline-phone-ring-wrap a:active,.hotline-phone-ring-wrap a:visited {color: #fff!important;padding: 0!important;}
.hotline-phone-ring {visibility: visible;background-color: transparent;width: 30px;height: 30px;cursor: pointer;z-index: 11;-webkit-backface-visibility: hidden;-webkit-transform: translateZ(0);transition: visibility .5s;right: 50px;bottom: 50px;display: block;}
.hotline-phone-ring-circle {width: 85px;height: 85px;top: -20px;left: 10px;position: absolute;background-color: transparent;border-radius: 100%;border: 2px solid #e60808;-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%;opacity: .5;}
.hotline-phone-ring-circle-fill {width: 55px;height: 55px;top: -5px;left: 25px;position: absolute;background-color: rgba(230,8,8,0.7);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%;}
.hotline-phone-ring-img-circle {background-color: #e60808;width: 33px;height: 33px;top: 7px;left: 37px;position: absolute;background-size: 20px;border-radius: 100%;border: 2px solid transparent;-webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;-webkit-transform-origin: 50% 50%;-ms-transform-origin: 50% 50%;transform-origin: 50% 50%;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;align-items: center;justify-content: center;}

@media only screen and (min-width: 1200px){
    .hwp-tabs-ft .nav-vertical+.tab-panels{padding: 0 0 0 100px}
}
@media only screen and (max-width: 1199px){
    .hwp-tabs-ft .nav-vertical+.tab-panels{padding: 0 0 0 50px}
    .hwp-tabs-ft .text-left{font-size: 30px; font-weight: bold; margin-bottom: 30px}
}


@media only screen and (min-width: 850px){
    .hwp-tabs-ft.tabbed-content .nav-vertical{width: 45%}
}
@media only screen and (max-width: 849px){
    .show-cats{display: none; position: absolute;top: 45px;right: 0px;float: none !important;z-index: 999; min-width: 150px}
    .show-cats li{padding: 5px 10px; background: #3f7cbd}
    .show-cats li a{color: #fff; font-size: 13px}

    .single-product .product-info{margin-top: 20px}
    .hwp-single-p-info, .hwp-p-detail{padding: 15px; }
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
.hwp-tabs .nav .tab a{font-size: 16px; padding: 5px 10px; margin: 0 5px}
.csvc {-ms-flex:0 0 100%;-webkit-box-flex: 0;-ms-flex: 0 0 100%;flex: 0 0 100%;width: 100%;}

}

@-webkit-keyframes phonering-alo-circle-anim {
    0% {-webkit-transform: rotate(0) scale(0.5) skew(1deg);-webkit-opacity: .1;}
    30% {-webkit-transform: rotate(0) scale(0.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(0.7) skew(1deg);opacity: .6;}
    50% {-webkit-transform: rotate(0) scale(1) skew(1deg);opacity: .6;}
    100% {-webkit-transform: rotate(0) scale(0.7) skew(1deg);opacity: .6;}
}

@-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);}
}