/*
Theme Name: steel
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 6.0.8
*/
#wp-admin-bar-wp-logo {display:none}
/*************** ADD CUSTOM CSS HERE. ***************/
.fa-comment-alt:before, .fa-message:before {content: "\f4ad";}
.text-capitalize {text-transform:capitalize}
.fa-telegram-plane:before, .fa-telegram:before {content: "\e07b";}

.aio-contact-trigger-front .fa-comment-alt{animation:tada 2s linear infinite}
.aio-contact-trigger-front::before{border:1px solid #54171c;content:'';display:block;width:150%;height:150%;border-radius:50%;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-animation:phone-circle-animate 1s ease-in-out infinite;animation:phone-circle-animate 1s ease-in-out infinite}
.aio-contact-trigger-front::after{background-color:#54171c;opacity:0.5;content:'';display:block;width:120%;height:120%;border-radius:50%;position:absolute;left:50%;top:50%;z-index:-1;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-animation:phone-circle-fill-animate 2s ease-in-out infinite;animation:phone-circle-fill-animate 2s ease-in-out infinite}
@keyframes phone-circle-animate {
0%{transform:translate(-50%,-50%) rotate(0) scale(0.5);opacity:.1}
30%{transform:translate(-50%,-50%) rotate(0) scale(0.7);opacity:.5}
100%{transform:translate(-50%,-50%) rotate(0) scale(1);opacity:.1}
}
@keyframes phone-circle-fill-animate {
0%,100%{transform:translate(-50%,-50%) rotate(0) scale(0.7)}
50%{transform:translate(-50%,-50%) rotate(0) scale(1)}
}
@keyframes phone-icon-animate {
0%,100%{transform:rotate(0) scale(1) skew(1deg)}
10%{transform:rotate(-25deg) scale(1) skew(1deg)}
20%,40%{transform:rotate(25deg) scale(1) skew(1deg)}
30%{transform:rotate(-25deg) scale(1) skew(1deg)}
50%{transform:rotate(0) scale(1) skew(1deg)}
}
@keyframes tada {
0%{transform:scale(1)}
10%,20%{transform:scale(.9) rotate(-8deg)}
30%,50%,70%{transform:scale(1.1) rotate(8deg)}
40%,60%{transform:scale(1.1) rotate(-8deg)}
100%,80%{transform:scale(1) rotate(0)}
}

/*#top-bar , #footer .st-footer .section-bg , #footer .st-footer .section-bg-overlay {background-image: linear-gradient(90deg, #00BFFF, #58bde4);}*/

#top-bar .html_topbar_left{
    font-size: 16px;
    text-transform: uppercase;
    color: #2d2d2d;
    margin-left: 154px !important;
    font-weight: bold;
} .top-bar-nav .searchform .button.icon {
    margin: 0;
    font-size: 14px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.header-top{z-index:10}
.header-search-form-wrapper input{height: 35px;min-width: 238px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    font-size: 13px;
    box-shadow: none;
    border-right: none;
}.nav-spacing-xlarge>li {
    margin: 0 15px;
}.nav-dropdown-default {
    padding: 0;
}
.nav-dropdown.nav-dropdown-default>li>a{color: #353535;}
.nav-dropdown.nav-dropdown-default>li>a:hover{color:#54171c; padding-left:8px}
.header-button span{text-transform:none; letter-spacing:0}
.searchform .button.icon i {
		font-size: 11ox;}
.form-flat input:not([type=submit]), .form-flat textarea, .form-flat select {border-radius:5px;
		background-color: rgb(255 255 255);}.form-flat .flex-row .flex-col, .flex-row.form-flat .flex-col {
    padding-right: 0;
}.stuck #logo img {margin-top: -25px;
    border-bottom-right-radius: 9px; 
		border-bottom-left-radius: 9px;max-height: 82px!important;
}
.stuck #logo {
    width: 70px;
}
.section-title-center span {
    position: relative;
    margin: 0 15px;
    font-size: 22px;
    BACKGROUND: #54171c;
    padding: 7px 20px;
    color: white;
}
.section-title-center span::before {content: "";position: absolute;z-index: 1;width: 24px;height: 42px;left: -24px;top: 0;background: #00000000;border-left: 22px solid transparent;border-top: 21px solid #54171c;border-bottom: 21px solid #54171c;}
.product-small.box{background: white;
    padding: 15px;
    border: 1px solid #dadada;}
.page-title-inner {
		padding-top: 32px;}
.product-small .product-title a{
    color:#505050; margin: 0;
    font-size: 17px;
    font-weight: bold;
}
.product-small.box:hover{border: 1px solid #54171c;box-shadow:2px 2px 20px #00000036}
.san-pham-section .large-12{padding-bottom:0}
.product-categories{border: 1px solid #dadada;}
.product-categories li{padding-left:10px;padding-right:10px}
.gioi-thieu-section{padding-bottom:0 !important}
.list-post-1 .box-text{
    background: #eee;
    PADDING: 15px;
    }
.list-post-1 .post-item .post-title{
    /* color: white; */
    text-transform: none;
    letter-spacing: 0;
    font-size: 20px;
    }

.list-post-1 .post-item .post-meta{color: white;
    opacity: 0.5;}
.box-blog-post .is-divider{display:none}
.list-post-1 .post-item .from_the_blog_excerpt 
{
    margin-top: 10px;
    color: #555;
    font-size:14px
    }
.list-post-2 .post-item .post-title{    margin: 0;margin-bottom:10px;
    text-transform: none;
    letter-spacing: 0;}
.list-post-2 .post-item{padding-bottom:0}
.list-post-2 .post-item .col-inner{    padding-top: 16px;
    padding-bottom: 15px;
    border-bottom: 1px dashed #dcdcdc;}
.list-post-2 .post-item .post-title:hover{color: #54171c;}
.list-post-1 .post-item .post-title:hover{color:#fbba23}
.tin-tuc-section .section-title-container {
    margin-bottom: 0;
}
.list-post-2 .post-item:first-child .col-inner{padding-top:0;}
.list-post-2 .post-item:last-child .col-inner{padding-bottom:0;border-bottom:none}
.list-post-2 .post-item a:hover{color:gray;}
.list-post-2 .post-item .box-text{padding:0; padding-left:15px}
.list-post-2 .post-item .button{margin:0; letter-spacing:0; text-transform:none; font-size:14px; font-weight:normal; font-style:italic}
.product-small:hover .product-title a{color: #54171c;}
.product-small .box-text{padding:10px 0 0 0}
.slider-section .col{padding-bottom:0}
.section-title-center span::after{content: "";position: absolute;z-index: 1;width: 24px;height: 42px;right: -24px;top: 0;background: #00000000;border-right: 22px solid transparent;border-top: 21px solid #54171c;border-bottom: 21px solid #54171c;}
.section-title b {height: 2px;
    opacity: 1;
    background-color: #54171c;
}
.footer-section .col{padding-bottom:0}.footer-secondary {
    padding: 0;
}.blog-archive .large-12 {
    text-align: left;
    padding-bottom: 10px;
}#breadcrumbs {
    font-size: 14px;
    margin-bottom: 10px;
}.blog-archive .page-title {
    text-transform: none;
    letter-spacing: 0;
    font-size: 27px;
}.blog-archive .large-9 .post-item .post-title {
    font-size: 20px;
    margin-bottom: 10px;
}.thong-tin-meta .date {
    font-size: 13px;
    color: #afafaf;
}.post-item .byline {
    font-size: 13px;
    color: #969696;
}.post-item .byline:before {
    content: '●';
    margin-left: 4px;
    margin-right: 4px;
    width: 5px;
    height: 5px;
    border-radius: 999px;
    color: #999;
}.post-item .meta-author {
    font-size: 13px;
}.blog-archive .large-9 .post-item .view-more-button {
    display: block !important;
    padding: 0;
    margin: 0;
    text-transform: none;
    letter-spacing: 0;
    font-weight: normal;
    font-size: 14px;
    color: #54171c;
}
.blog-archive .large-9 .post-item a:hover{color:black;}
.blog-archive .large-9 .post-item .post-title:hover{color:#54171c}.blog-archive .large-9 .post-item .box-text {
    padding: 0;
    padding-left: 15px;
}.blog-archive .large-9, .blog-single .large-9, .page-right-sidebar .large-9 {
    flex-basis: 70%;
    max-width: 70%;
}span.widget-title {
    color: white;
    letter-spacing: 0;
    font-size: 17px;
    border-bottom: 1px solid #54171c;
    padding-bottom: 8px;
    margin-bottom: 10px;
    display: block;
    background: #54171c;
    padding: 10px;
}.widget .is-divider{display:none}.recent-blog-posts a {
    font-size: 15px;
}
.blog-archive .large-3{padding-left:0; border-left:none !important;}
a.back-to-top{background:#54171c !important; color:white !important; border:none !important}.blog-archive .large-3, .blog-single .large-3, .page-right-sidebar .large-3 {
    flex-basis: 30%;
    max-width: 30%;
}.topview ul {
    border: 1px solid #ececec;counter-reset: my-sec-counter;
}.topview li {
    display: flex;
}.topview li:before {
    counter-increment: my-sec-counter;
    content: counter(my-sec-counter);
    font-family: "inter", sans-serif !important;
    line-height: 1em;
    color: #54171c !important;
    font-size: 30px !important;
    opacity: 1 !important;
    text-align: right;
    padding: 5px 6px 8px 9px;
}.topview li a {
    font-size: 15px;
    font-weight: bold;
    padding-right: 7px !important;
}.luot-xem {
    color: gray;
    font-size: 14px;
    margin: 10px 0;
    display: block;
}.fa {
    padding-right: 5px;
}.fa-eye {
    margin-left: 20px;
}
.blog-single .large-3{border-left:none !important; padding-left:0}.blog-single .entry-content h2 {
    font-size: 22px;
    border-left: 5px solid #f6921d;
    padding-left: 10px;
}
.blog-single .entry-content h3 {
		font-size: 21px;}
.blog-single .entry-content h4 {
		font-size: 20px;}
.blog-single .entry-content h5 {
		font-size: 19px;}
.blog-single .entry-content h6 {
		font-size: 18px;}.meta-related {
    display: block;
    margin-top: 10px;
    margin-bottom: 25px;
    background: #f5f5f5;
    padding: 10px;
    border-radius: 5px;
}.meta-related ul {
    margin-bottom: 0;
}.meta-related ul li {
    list-style: square;
    font-size: 15px;
    margin-bottom: 5px;
    color: #54171c;
}.meta-related ul li a {
    color: #54171c;
    text-transform: none;
}.xem-them .tieu-de-xem-them {
    font-weight: 700;
    display: block;
    margin-bottom: 10px;
    font-size: 19px;
    color: black;
}.xem-them ul {
    margin-left: 20px;
}.xem-them ul li {
    margin-left: 0;
    margin-bottom: 5px;
}.xem-them ul li a {
    font-weight: 500;
    font-size: 16px;
    color: #54171c;
}.xem-them ul li a:hover {
    text-decoration: underline;
}.blog-single .entry-meta {
    text-transform: none;
    font-size: 14px;
    letter-spacing: 0;
    color: black;
    border-top: 1px solid #e2e2e2;
    border-bottom: 1px solid #e2e2e2;
    padding: 10px;
    background: #f9f9f9;
    margin-bottom: 15px;
}.bai-viet-lien-quan h3 {
    font-size: 19px;
    color: black;
}.bai-viet-lien-quan {
    margin-top: 15px;
}.bai-viet-lien-quan ul {
    margin-bottom: 0;
    display: inline-block;
    width: 100%;
}.bai-viet-lien-quan ul li {
    list-style: none;
    width: 33.33%;
    color: graytext;
    float: left;
    padding-left: 4px;
    padding-right: 5px;
}.bai-viet-lien-quan ul li .box-image img {
    height: 180px;
    border-radius: 4px;
    object-fit: cover;
    object-position: center;
}.bai-viet-lien-quan h4 {
    font-size: 16px;
    color: black;
    line-height: 23px;
    padding-top: 7px;
    height: 51px;
    overflow: hidden;
    font-weight: 500;
}.is-divider{display:none}
.blog-single .blog-share{text-align:left}h1.entry-title.mb {
    margin-bottom: 15px;
    text-transform: none;
    letter-spacing: 0;
}
.page-right-sidebar .large-9{border-right:none !important}
.page-right-sidebar .large-3{padding-left:0}
.bai-viet-lien-quan h4:hover{color:#c90100}
.single-product #product-sidebar{padding-right:0; border-right:none !important}
.single-product .large-9{border-left:none !important}
.related h3{text-transform: none;
    letter-spacing: 0;}.product-section {
    border-top: 0;
}.product-footer .woocommerce-tabs {
    padding: 0;
    border-top: 0;
}
.form-mua-hang h3{background: #54171c;
    text-align: CENTER;
    PADDING: 5px 10px;
    text-transform: uppercase;
    COLOR: white;
    font-size: 17px;}
.form-mua-hang .des{font-size: 14px;
    margin-bottom: 10px;}
.form-mua-hang .row-info {display:block;clear:both; width:100%;}
.form-mua-hang .row-info .left{ display:inline-block; float:left; padding-right:10px; width:30%;}
.form-mua-hang .row-info .right{width:70%; display:inline-block; padding-left:10px}
.form-mua-hang .row-info{font-size:15px;}input[type=email], input[type=search], input[type=number], input[type=url], input[type=tel], input[type=text], textarea{border-radius:5px; box-shadow:none}.wpcf7 p{font-size:15px;text-align:center}
.form-mua-hang input[type=submit]{margin:0; font-size:14px; border-radius:5px; letter-spacing:0; text-transform:none}
.single-product .product-short-description{background: #efefef;
    padding: 15px;
    border-radius: 5px;
    font-size: 15px; margin-bottom:15px}
.single-product .product-short-description p{margin-bottom:0}
.product_meta>span{font-size:15px}
.woocommerce-tabs li a{font-size: 16px;
    text-transform: none;
    letter-spacing: 0;}
.form-mua-hang .box{padding:20px}
.home .view-more-button{display:none}
.form-mua-hang{border: 1px solid #54171c;
}
.page-right-sidebar h2{font-size: 20px;
    border-left: 5px solid #54171c;
    padding-left: 10px;}
.page-right-sidebar .page-inner h3{font-size:19px;}
.page-right-sidebar .page-inner h4{font-size:18px;}
.form-lien-he{box-shadow: 2px 2px 20px #0000001f;
    padding: 20px;
    border-radius: 10px;}
.form-lien-he .des{    text-align: left;
    margin-bottom: 10px;}
.form-lien-he input[type=submit]{   width: 100%;
    margin: 0;
    border-radius: 5px;}


@media (min-width: 1024px) {
	.footer-secondary {padding-top:0}
	
	#logo img {
    max-height: 138px !important;
    position: absolute;
    background: white;
    margin-top: -84px;
    box-shadow: 2px 2px 20px #0000002b;
    padding-bottom: 0px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
	}
	
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE ***************/
	
	

	.blog-archive .large-9, .blog-single .large-9, .page-right-sidebar .large-9 { flex-basis: 100%;
    max-width: 100%;}
	.blog-archive .large-3, .blog-single .large-3, .page-right-sidebar .large-3 {display:none}
	#top-bar .html_topbar_left {
	margin-left: 0x !important;
	 }.section-title-center span {
		position: relative;
		margin: 0 15px;
			 font-size: 16px;}
	.slider-section .col {
		PADDING: 0 !important;
	}
	.san-pham-section .col{padding:0 5px 10px}
	.product-small .product-title a {
		 font-size: 15px;
		font-weight: bold;
	}#logo img {
		max-height: 90px;
		position: inherit;
		background: white;
		margin-top: 0;
		box-shadow: 0;
		padding-bottom: 0px;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}
	.off-canvas .nav-vertical>li>a {
		padding-top: 12px;
		padding-bottom: 12px;
		font-size: 15px;
		text-transform: none;
		letter-spacing: 0;
		COLOR: #212121;
		font-weight: normal;
	}
	.section-title-center span::before {
	   height: 19px;
		border-left: 21px solid transparent;
		border-top: 16px solid #54171c;
		border-bottom: 18px solid #54171c;
		display: BLOCK;
	}
	.section-title-center span::after {
		height: 34px;
		border-right: 21px solid transparent;
		border-top: 16px solid #54171c;
		border-bottom: 18px solid #54171c;
	}.list-post-2 .post-item .box-text {
		padding: 0;
		padding-top: 15px;
	}
	.list-post-2 .post-item .post-title {
		font-size: 16px;
	}.stuck #logo img {
			margin-top: 0;}
	.widget.topview{display:none}
	.off-canvas-right .mfp-content, .off-canvas-left .mfp-content{width:300px}
	.archive .product-small.col, .related .product-small.col{padding:0 5px 10px !important} 
	.single-product .large-6{padding-bottom:10px}
	.nav-tabs+.tab-panels {
		padding: 15px;
	}
	.related h3 {
		margin-bottom: 0;
	}.blog-archive .large-9 .post-item .box-text {
		padding: 0;
		padding-top: 10px;
	}
	.bai-viet-lien-quan h4 {
		font-size: 15px;
		 line-height: 18px;
			height: 62px;
		 }
	.blog-archive .large-9 .post-item .post-title {
			font-size: 17px;}.bai-viet-lien-quan ul li{width:50%}.bai-viet-lien-quan ul li .box-image img{height:120px}

	#logo img { border-radius: 0 0 9px 9px }
	
}
/*end*/