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

/*************** ADD CUSTOM CSS HERE.   ***************/


/******************** Moraphelious *********************/

/*global*/
.home .linhvuc-sect.footer1{
	display:none;
}
.no-padding-bottom{
	padding-bottom:0 !important;
}
.title-sect{
	margin-top: 0px;
/*     border-bottom: 1px solid #ccc; */
    padding-bottom: 6px;
    text-transform: uppercase;
    font-size: 30px;
    line-height: 38px;
	position:relative;
	color: #055ea8;
}
/* .title-sect:before{
	content: "";
    display: inline-block;
    width: 125px;
    height: 7px;
    position: absolute;
    bottom: -6px;
    left: 0px;
	background: url(images/bg-heading.png) 0 0 no-repeat;
} */
.sub-title {
    height: 50px;
    margin-bottom: 10px;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 120%;
    line-height: 1.5;
}

.post-item .box-text .post-title, .footer-title, .tieu-de-sidebar{
	font-family: "Roboto", sans-serif !important;
}

.is-divider{
	display:none;
}

.page-title-bar{
	margin-bottom: 10px;
    background: #f5f5f5;
	padding: 1px;
}
.breadcrumb {
    position: relative;
    overflow: hidden;
	background: #e8e8e8;
    padding: 10px 25px 10px 30px;
    margin: 25px 0px 15px;
    font-size: 13px;
}
.breadcrumb:before {
    content: "";
    display: inline-block;
    background: #055ea8;
    position: absolute;
    width: 30px;
    height: 30px;
    left: 0px;
    top: 0px;
    transform: rotate(45deg) translateX(-20px);
}
.breadcrumb:after {
    content: "";
    display: inline-block;
    background: #055ea8;
    position: absolute;
    width: 30px;
    height: 30px;
    top: inherit;
    left: inherit;
    right: 0px;
    bottom: 0px;
    transform: rotate(45deg) translateX(21px);
}
.shop-page-title .breadcrumbs{
	display:none;
}
/*Header*/
@media only screen and (min-width: 1024px) {
	.header-top .nav.nav-right li > a{
		color:#055ea8;
	}
	.header-main{
		z-index: unset;
	}
	div#logo{
		z-index: 11;
	}
	.header-main .flex-right{
    float: left;
    z-index: 1;
    display: block;
    margin: 0;
	}


	.header-wrapper:not(.stuck) div#logo a{
		position: absolute;
		bottom: 0;
		width: 200px;
		background: #FEFEFE;
	}
	.header-wrapper:not(.stuck) div#logo a:before{
		content: "";
		position: absolute;
		bottom: 0;
		right: 100%;
		height: 110px;
		width: 1000%;
		background: #FEFEFE;
	}
	.header-wrapper:not(.stuck) div#logo a:after{
		content: "";
		position: absolute;
		left: 100%;
		bottom: 0px;
		width: 0;
		height: 0;
		border-left: 64px solid #FEFEFE;
		border-top: 70px solid transparent;
		border-bottom: 65px solid transparent;
	}
/*	.header-nav-main.nav > li.menu-item{
		padding: 0 0 0 20px !important;
	}*/

	/*.header-nav-main.nav > li.menu-item:before {
		content: "";
		display: block;
		position: absolute;
		width: 1px;
		left: 5%;
		transform: rotate(45deg);
		z-index: -1;
		border-right: 1px solid #161633;
		height: 70px;
		top: -20px;
		opacity: 1;
		border-bottom-color: transparent;
		border-width: thin;
		margin-left: initial;
	}*/

	/*.header-wrapper.stuck,  .header-wrapper.stuck .header-bg-color{
		background-color:#42426f !important;
	}*/
	/* background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,0) 20%); */
	.header-wrapper:not(.stuck) #logo img {
		max-height: 110px;
		padding: 10px;
	}

	
	.header-nav-main.nav li {
		position: relative;
	}
	/* sub menutop lv 1 */
	.header-main .header-nav-main.nav li li {
		width: 100%;
		display: block;
		float: initial;
		clear: both;
		border-bottom: rgba(255, 255, 255, 0.51) dashed 1px;
		padding: 0;
		margin-top: -15px;
		-moz-transition: opacity 0.1s 0.15s ease-out, margin 0.3s 0.1s ease-out;
		-webkit-transition: opacity 0.1s 0.15s ease-out, margin 0.3s 0.1s ease-out;
		-o-transition: opacity 0.15s 0.15s ease-out, margin 0.3s 0.1s ease-out;
		transition: opacity 0.15s 0.15s ease-out, margin 0.3s 0.1s ease-out;
    	background: #145a8d !important;
	}
	.header-main .header-nav-main.nav li li:hover{
    	background: #067ea9 !important;
	}
	.header-nav-main.nav li li.menu-item-has-children:after {
		font-family: 'fl-icons' !important;
		content: "\f105";
		position: absolute;
		top: 6px;
		right: 8px;
		z-index: 9;
	}
	.header-nav-main.nav li li a {
		font-size: 13px;
		line-height: 37px;
		padding: 0 0 0 10px;
		border: none;
		position: relative;
		font-weight: bold;
		text-transform: uppercase;
		color: #fff !important;
	}
	
	.header-nav-main.nav li ul {
		z-index: 9999;
		float: left;
		list-style: none;
		margin: 0;
		padding: 0;
		position: absolute;
		left: 0;
		min-width: 240px;
		background: #fff;
		border: 1px solid #ddd;
		opacity: 0;
		visibility: hidden;
		-moz-transition: opacity 0.2s 0.1s ease-out, visibility 0.1s 0.1s linear;
		-webkit-transition: opacity 0.3s ease-out, visibility 0.1s 0.1s linear;
		-o-transition: opacity 0.3s ease-out, visibility 0.1s 0.1s linear;
		transition: opacity 0.3s ease-out, visibility 0.1s 0.1s linear;
	}
	.header-nav-main.nav li ul ul {
		top: -1px;
	}
	.header-nav-main.nav li ul ul {
		left: 100%;
	}
	.header-nav-main.nav li:hover>ul {
		opacity: 1;
		visibility: visible;
	}
	.header-nav-main.nav li:hover ul li {
		margin-top: 0;
		opacity: 1;
	}

	/* sub menutop lv 2 */
	.header-nav-main.nav ul ul ul {
		float: left;
		list-style: none;
		z-index: 9999;
		margin: 0;
		padding: 0;
		position: absolute;
		left: 80%;
		top: 0px;
		background: #222;
		width: 100%;
		opacity: 0;
		visibility: hidden;
		-moz-transition: opacity 0.2s 0.01s ease-in-out, left 0.2s 0.1s ease-out, visibility 0.1s 0.1s linear;
		-webkit-transition: opacity 0.2s 0.01s ease-in-out, left 0.2s 0.1s ease-out, visibility 0.1s 0.1s linear;
		-o-transition: opacity 0.2s 0.01s ease-in-out, left 0.2s 0.1s ease-out, visibility 0.1s 0.1s linear;
		transition: opacity 0.2s 0.01s ease-in-out, left 0.2s 0.1s ease-out, visibility 0.1s 0.1s linear;
	}
	.header-nav-main.nav ul ul ul li {
		border: none;
		border-bottom: 1px solid #ccc;
		clear: both;
		margin: 0;
		padding: 0;
		width: 100%;
		opacity: 1;
	}
	.header-nav-main.nav ul ul li:hover ul {
		opacity: 1;
		left: 100%;
		visibility: visible;
	}
}


/*Main*/
.linhvuc-sect ul{
    list-style:none;
}
.linhvuc-sect ul li{
    margin-left:0;
}
.linhvuc-sect ul li:before {
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    font-size: 15px;
    margin-right: 10px;
    color: black;
	font-weight: bold;
}
.linhvuc-sect .button.white{
	background-color: #e4e4e4 !important;
}
.duan-sect .post-item{
	padding-bottom:0;
}
.duan-sect .post-item .box-text{
	top: -40px;
    padding: 10px;
	position: relative;
	background: rgb(0,0,0,0.5);
}
.duan-sect .post-item .box-text .post-title{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1; /* number of lines to show */
	-webkit-box-orient: vertical;
	text-transform:uppercase;
	color:white;
	font-size:14px;
	height: 17px;
}
.duan-sect .post-item .box-image .image-cover:before{
	content: "";
    display: inline-block;
    background: #f5f5f5;
    width: 30px;
    height: 30px;
    clip-path: polygon(100% 0, 0 0, 0 100%);
    position: absolute;
    left: -1px;
    top: -1px;
	z-index: 9;
}
.duan-sect .post-item .box-image .image-cover:after, .duan-sect .post-item .box-text .post-title:after{
	content: "";
    display: inline-block;
    background: #f5f5f5;
    width: 30px;
    height: 30px;
	left: initial;
    right: -1px;
    top: initial;
    bottom: -1px;
    clip-path: polygon(100% 0, 0 100%, 100% 100%);
    z-index: 9;
	position: absolute;
}
.duan-sect .post-item .box-text button{
	position:absolute;
	left:50%;
	margin-left:-35px !important;
}

.badge-container {
	display:none;
}
.product-small .product-title  {
	text-transform: uppercase;
}
.product-small .price{
	display: flex;
    justify-content: space-between;}
.product-small .price del span.amount{
	font-size: 13.5px;
	color: #111;
	opacity: .6;
}
 .product-small .price span.amount{
	color: red;
}

.product-small .image-tools.bottom{
	bottom: inherit !important;
    top: 0px;
    width: 60px;
    height: 60px;
    margin-top: 0px;
    text-align: left;
    clip-path: polygon(100% 0, 0 0, 0 100%);
    font-size: 16px;
	transform: translateX(-100%) translateY(0);
}
.product-small .box-text{
	overflow:hidden;
    padding-bottom: 15px;
}

.product-small.has-hover:hover .custom_button{
	opacity: 1;
    transform: scale(1) translateZ(0) translateY(0) !important;
    pointer-events: inherit;
	transition: opacity 0.3s, transform 0.3s, background-color 0.3s;
}

.product-small .custom_button{
	position:absolute;
	font-size: 16px;
    width: 60px;
    height: 60px;
    background-color: #055ea8;
    color: #fff;
	bottom: 0;
    right: 0;
	opacity: 0;
    line-height: 30px;
    clip-path: polygon(100% 0, 0 100%, 100% 100%);
	transform: translateX(100%) translateY(0);
	transition: opacity .5s, transform .3s, max-height .6s, filter .6s;
    filter: blur(0);
}

.custom_button a {
    display: block;
    height: 100%;
}
.custom_button a i{
    position: absolute;
    bottom: 10px;
    right: 10px;
    color: white;
    z-index: 99;
}

.product-small .image-tools.bottom a{
	text-indent: 11px;
}
.product-small .image-tools.bottom a:before{
	content: "\f06e";
    font-family: "Font Awesome 5 Free";
	font-weight:400;
    margin-right: 100000px;
}


.tt-ha-dt-sect .section-title-normal span{
	margin-top: 0px;
    border-bottom: 0px solid #055ea8;
    padding-bottom: 6px;
    text-transform: uppercase;
    font-size: 30px;
    line-height: 38px;
	position:relative;
	color: #055ea8;
}

.tt-ha-dt-sect .gallery-box{
	border-top-left-radius: 50px;
    overflow: auto;
    border-bottom-right-radius: 50px;
}

.tt-ha-dt-sect .post-item .box-text{
	padding-top: 0;
    padding-bottom: 0;
}

.tt-ha-dt-sect .post-item .box-text .post-title{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1; /* number of lines to show */
	-webkit-box-orient: vertical; font-weight:600; color:#000;
}
.tt-ha-dt-sect .post-item .box-image ,.tt-ha-dt-sect .post-item .box-text {
	vertical-align:top;
}
.tt-ha-dt-sect .post-item .box-text .from_the_blog_excerpt {
	margin-left: 55px;
	font-size: 14px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 4; /* number of lines to show */
	-webkit-box-orient: vertical;
}
.tt-ha-dt-sect .post-item .badge.post-date {
    bottom: 32%;
    top: auto;
    left: 35%;
}
/*Footer*/
.menu-footer {
	min-width: 200px;
    width: fit-content;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #161633;
}
.menu-footer:before {
    content: "\f28d";
    font-family: "Font Awesome 5 Free";
    font-size: 15px;
    margin-right: 10px;
    color: #fca91e;
	font-weight: bold;
}
.footer-title:before {
    content: url(images/phu1.png);
    padding-right: 10px;
}

.footer-primary.pull-left {
	padding: 7.5px 0;
}

.footer-section .social-icons .is-outline{
	background-color:#fca91e;
}
.footer-section .social-icons .is-outline i:before{
	color: #055ea8;
}

/*sidebar*/

.tieu-de-sidebar {
    background: #055ea8 !important;
    color: white;
    text-transform: uppercase;
    font-size: 16px;
    margin: 0;
    height: 40px;
    text-align: left;
    line-height: 40px;
    font-weight: 400;
	padding-left:15px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.widget-title {
    display: block;
    background:#145a8d;
    color: white;
    text-align: center; 
    overflow: hidden;
	padding:15px
}

.sidebar-wrapper .widget{
	padding:0;
}

#recent-posts-9 li>a{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1; /* number of lines to show */
	-webkit-box-orient: vertical;
}

#recent-posts-9 ul{
	border-color: rgb(243, 243, 243);
    border-width: 0px 1px 1px 1px;
	    border-width: 1px;
    border-style: solid;
    border-color: #ececec;
    pointer-events: none;
    border-radius: 0;
	padding: 0 15px	15px 15px;
}

/* tin tức */
.archive .post-item .box-text .from_the_blog_excerpt {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-weight: bold;
    line-height: 22px;
    height: 44px;
}

.archive .post-item .box-text .post-title{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	-webkit-box-orient: vertical;
}

/* chi tiết sp */
.shipping-product {
    border: 1px solid #055ea8;
    padding: 15px;
    border-radius: 5px;
    display: inline-block;
    width: 100%
}

.shipping-product .item {
    padding-bottom: 12px;
    margin-bottom: 8px;
    border-bottom: 1px solid #eee;
    display: inline-block;
    width: 100%;
    position: relative
}

.shipping-product .item:last-child {
    border-bottom: none;
    padding-bottom: 0px;
    margin-bottom: 0px
}

.shipping-product .icon {
    display: inline-block;
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(calc(-50% - 6px));
    width: 33px;
    text-align: center
}

.shipping-product .icon .fa {
    font-size: 30px;
    color: #055ea8
}

.shipping-product .text {
    display: inline-block;
    width: 100%;
    float: left;
    vertical-align: top;
    padding-left: 50px
}

.shipping-product h3 {
    margin: 0px 0px 5px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700
}

.shipping-product p {
    font-size: 12px;
    color: #999;
    line-height: 16px;
    margin-bottom: 0px
}

.single-product .price-wrapper .product-page-price{
	display: flex;
    flex-flow: row-reverse;
	justify-content: flex-end;
}

.single-product .price-wrapper .product-page-price del span.amount{
	font-size: 15px;
	color: #111;
	opacity: .6;
}
.single-product .price-wrapper .product-page-price span.amount{
	color: red;
	margin-right: 20px;
}



.col-divided {
    border-right:none;
}
#product-sidebar{
	padding-left: inherit;
}
body .star-rating:before {
	color: #d0d0d0;
}
body .star-rating span:before {
	color: #f4a712;
}
.product-small.box .price-wrapper {
	position: relative;
}
.star-rating {
	position: absolute;
	bottom: 0;
	left: 0;
}
/* */
.product-info .woocommerce-product-rating {
	padding: 10px 0;
}
@media only screen and (min-width: 768px) {
/*************** ADD PC & TABLET ONLY CSS HERE  ***************/
	.post-sidebar.large-3{
		padding:0 10px;
	}

}
@media only screen and (max-width: 768px) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

.product-small.box .product-title a {
	text-transform: initial;
	font-weight: bold;
}
.product-small.box .box-image img {
	height: 220px;
	object-fit: contain;
}
.des-loop {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 20px;
    margin-top: 10px;
}
.widget_price_filter span {
    margin-bottom: 15px;
}
.product-footer .nav-tabs>li>a {
	background: #145a8d;
	color: #fff;
}
.product-footer .nav-tabs>li.active>a {
    background: #093e65;
}
/******************** Moraphelious end *****************/
@media only screen and (max-width: 767px) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
	.product-small.box {
		min-height: initial;
	}
	.product-small.box .box-image img {
		height: 185px;
	}
	.title-sect {
		font-size: 23px;
	}
	.product-small .price {
		display: block;
		text-align: center;
		width: 100%;
	}
	.product-small .price del span.amount {
		margin: 0;
	}
	.tt-ha-dt-sect .post-item .badge.post-date {
	    bottom: 10%;
	    top: initial;
	    left: 0;
	}
}

.header-nav-main.nav > li.menu-item > a:after {
    content: "";
    display: block;
    position: absolute;
    height: 100%;
    width: 1px;
    left: 0px;
    top: 0px;
    transform: rotate(45deg);
    z-index: -1;
    border-right: 1px solid #3983c2;
    height: 90px;
    top: -28px;
    left: -32px;
}
.header-nav-main.nav > li.menu-item {
	margin: 0 30px;
}
.widget {
	border: 1px solid #e1e1e1;
}
.widget ul.menu > li {
	padding: 0 15px;
}

