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

/*************** ADD CUSTOM CSS HERE.   ***************/
.ss_banner img{
	width: 100%;
}
.ss_banner .section-content{
	min-height: 650px;
}
/* banner */
.ss_banner .box-bn .box-t1{
	color: rgba(0, 0, 0, 0);
	font-size: 41px;
	font-weight: bold;
	-webkit-text-stroke: 1px rgba(184, 190, 193, 0.7);
	padding-top: 15px;
	margin-bottom: 0;
}
.box-bn .box-t2{
	color: rgb(57, 104, 142);
	font-size: 41px;
	font-weight: bold;
	line-height: 1.2;
	margin-bottom: 0;
}
.box-bn .box-p1{
	color: rgb(57, 104, 142);
	font-size: 20px;
	letter-spacing: 1px;
	font-weight: bold;
	margin-bottom: 0;
}
.bn-right{
	padding-left: 20px;
}
.box-bn:before{
	content: "";
	position: absolute;
	left: -20px;
	top: 0;
	height: 170px;
	width: 2px;
	background: rgb(194, 202, 206);
}
.box-ani{
	position: relative;
}
.box-ani .ani-img img{
	position: absolute;
	left: 25px;
	top: 0;
	width: 220px;
	z-index: 9;
}
.box-ani .ani-h1{
	font-family: "Oswald", sans-serif;
	color: rgb(57, 104, 142);
	font-size: 234px;
	font-weight: bold;
	line-height: 1;
	padding-top: 20px;
	display: inline-block;
	width: auto;
	margin-bottom: 0;
	text-shadow: 7px 0px 3px #313a42;
	position: relative;
}
.box-ani .ani-h2{
	font-family: "Oswald", sans-serif;
	color: rgba(255, 255, 255, 0.4);
	font-size: 234px;
	font-weight: bold;
	line-height: 1;
	padding-top: 20px;
	display: inline-block;
	width: auto;
	margin-bottom: 0;
}
.box-ani .ani-h1 span{
	font-family: "Oswald", sans-serif;
	color: rgb(57, 104, 142);
	text-shadow: 3px 0px 2px #313a42;
	font-size: 52px;
	position: absolute;
	background: rgb(243, 239, 237);
	bottom: 15px;
	right: 0;
}
.box-bn .box-p2{
	color: rgb(60, 60, 60);
	font-size: 18px;
	letter-spacing: 1px;
	font-weight: bold;
}
a.button.primary{
	margin: 0;
	background: rgb(241, 82, 82) !important;
	box-shadow: 0px 15px 20px -17px #000;
	border-radius: 0 !important;
	animation: 1s pulse infinite;
	margin-right: 40px;
}
.ss_banner .col.large-5{
	left: -100px;
}
.img-1  img{
	background: #fff;
}
.img-1 {
	width: 312px;
	height: 483px;
	top: 30px;
	left: 258px;
	position: absolute;
	z-index: 9;
}
.img-1:before{
	content: "";
	width: 100%;
	height: 40%;
	position: absolute;
	bottom: -20px;
	right: -20px;
	background: rgb(57, 104, 142);
	z-index: -1;
}
.img-2 {
	position: absolute;
	width: 251px;
	height: 375px;
	top: 200px;
	left: 0;
	z-index: 8;
}
.img-3{
	position: absolute;
	width: 623px;
	height: 384px;
	top: 73px;
	left: 41px;
	z-index: 7;
}

@keyframes pulse{
	0% {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}

	50% {
		-webkit-transform: scale(1.1);
		-ms-transform: scale(1.1);
		transform: scale(1.1);
	}
	100% {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
}

/* show product */
.ss_pro:before{
	content: "";
	background: url(/wp-content/uploads/2021/03/rrrrrrrr-20201020061046.jpg);
	position: absolute;
	width: 715px;
	height: 470px;
	top: 0px;
	left: 240px;
}
.ss_pro .row-pro{
	padding: 80px 50px;
	box-shadow: 0px 0px 30px -10px rgb(0 0 0 / 20%);
	background-color: rgb(255, 255, 255);
	border-radius: 0px;
	position: relative;
	padding-bottom: 0;
}
.ss_pro .pro-h1{
	color: rgb(97, 97, 97);
	font-size: 22px;
	margin-bottom: 0;
}
.ss_pro .pro-h2{
	font-size: 18px;
	color: rgba(60, 55, 55, 0.8);
	font-weight: normal;
}
.rate-star svg{
	width: 14px;
}
.rate-star h4{
	color: rgb(170, 31, 31);
	font-size: 16px;
	font-weight: normal;
	text-decoration: underline;
	margin-bottom: 5px;
}
.rate-star h4,.rate-star div,
.rate-star,.ss_pro .pro-rate .rate-ot{
	display: inline-block;
	width: auto;
	line-height: 1;
}
.rate-star{
	padding-right: 20px;
	border-right: 1px solid #000;
}
.ss_pro .pro-rate .rate-ot h4{
	font-size: 14px;
	text-decoration: underline;
}
.ss_pro .pro-rate .rate-ot p{
	color: rgb(111, 111, 111);
	font-size: 13px;
}
.ss_pro .pro-rate .rate-ot h4,.ss_pro .pro-rate .rate-ot p{
	display: inline-block;
	width: auto;
	font-weight: normal;
	margin-bottom: 5px;
}
.ss_pro .pro-rate .rate-ot:nth-child(2){
	padding-right: 20px;
	border-right: 1px solid #000;
	margin: 0 3px 0 5px;
}
.ss_pro .sosp{
	margin: 10px 0;
}
.ss_pro .pro-price{
	padding: 20px;
	background: rgba(233, 233, 233, 0.3);
}
.ss_pro .pro-price .price{
	display: inline-block;
	width: 65%;
	position: relative;
}
.ss_pro .pro-price .giam{
	display: inline-block;
	width: 30%;
	vertical-align: top;
}
.ss_pro .pro-price .price .giaban{
	text-decoration-line: line-through;
	color: #585858;
	font-size: 17px;
}
.ss_pro .pro-price .price .giakm{
	color: rgb(241, 82, 82);
	font-size: 22px;
	font-weight: bold;
	animation: tada 1s infinite;
	background-size: cover;
	background-position: center center;
	position: absolute;
	top: -10px;
	padding: 0 5px 0 15px;
}
@keyframes tada{
	0% {
		transform: scale(1);
	}
	10%, 20% {
		transform: scale(.9) rotate(-3deg);
	}
	30%, 50%, 70%, 90% {
		transform: scale(1.1) rotate(3deg);
	}
	40%, 60%, 80% {
		transform: scale(1.1) rotate(-3deg);
	}
	100% {
		transform: scale(1) rotate(0);
	}
}
.ss_pro .pro-price p{
	color: #585858;
	font-size: 14px;
	margin: 0;
}
.ss_pro .pro-price .giam{
	background: rgb(241, 82, 82);
	color: #fff;
	font-size: 14px;
	text-align: center;
	padding: 3px 5px;
	border-radius: 20px;
	font-weight: bold;

}
.row-pro a.button{
	background: linear-gradient(180deg, rgba(255, 149, 103, 1.0), rgba(237, 78, 8, 1.0));
	border: 0;
	box-shadow: none;
}
.ani-hand{
	display: inline-block;
	width: 25px;
	animation: shake 3s 1s infinite;
}
@keyframes shake{
	0%, 100% {
		transform: translateX(0);
	}
	10%, 30%, 50%, 70%, 90% {
		transform: translateX(-10px);
	}
	20%, 40%, 60%, 80% {
		transform: translateX(10px);
	}
}
img.size-full.alignnone{
	margin-bottom:0 !important;
}
.box-info ul{
	margin-bottom: 10px;
	background: rgba(242, 242, 242, 0.3);
}
.box-info ul li{
	color: rgba(178, 178, 178, 1.0);
	font-size: 15px;
}
.box-info ul li span{
	color: #333;
}
.box-info > p{
	font-size: 14px;
	color: #555;
}
.row-icon{
	margin-top: 30px;
}
.row-icon .col{
	padding-left: 40px !important;
}
.row-icon .icon-box{
	align-items: center;
}
.row-icon .icon-box-text{
	box-shadow: 0px 0px 30px -10px rgb(0 0 0 / 40%);
	background-color: rgb(255, 255, 255);
	border-radius: 10px;
	padding: 20px 15px 20px 70px !important;
}
.row-icon .icon-box-img{
	position: absolute;
	width: 80px !important;
	height: 80px;
	left: -35px;
	display: flex;
	align-items: center;
	border-radius: 100%;
	padding: 15px;
	box-shadow: 0px 0px 10px -3px #00000099;
	background: #fff;
}


/* Detail product */
h3.title-page{
	text-align: center;
	color: rgb(241, 84, 84);
	font-size: 30px;
	letter-spacing: 1px;
	padding-bottom: 10px;
	position: relative;
}
h3.title-page:before{
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 100px;
	height: 2px;
	background: rgb(211, 211, 211);
	transform: translatex(-50%);
}
.ss_dlpro .title-dtpro{
	background-color: rgb(245, 245, 245);
	border: 1px dashed rgb(207, 207, 207);
	text-align: center;
	font-size: 24px;
	padding: 5px 0;
	color: rgb(94, 94, 94);
}
.ss_dlpro .col_txt .col-inner{
	padding: 30px;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);
	height: 100%;
}
.ss_dlpro .col_txt h3{
	font-size: 22px;
}
.ss_dlpro .col_txt ul{
	margin-bottom: 0;
	list-style-type: none;
}
.ss_dlpro .col_txt ul li{
	margin-left: 0;
	padding-left: 30px;
	font-size: 15px;
	margin-bottom: 15px;
	position: relative;
}
.ss_dlpro .col_txt ul li:before{
	content: "\f058";
	font-family: fontawesome;
	position: absolute;
	left: 0;
	color: rgba(57, 104, 142, 1);
}

/* info pro */
.ss_infopro .flickity-viewport{
	padding: 15px 0;
}
.ss_infopro .slider-wrapper .col .col-inner{
	box-shadow: 0px 0px 10px  rgb(0 0 0 / 20%);
	padding: 15px;
}
.ss_infopro .slider-wrapper .box-text h4{
	font-size: 20px;
}
.ss_infopro .slider-wrapper .box-text p{
	margin-bottom: 10px;
	font-weight: bold;
}

/* Ưu điểm */
.ss_uudiem .r-3col{
	padding: 70px;
	background: rgb(57, 104, 142) 
		url('/wp-content/uploads/2021/03/bgy-20201019091338.png') no-repeat;
	background-size: cover;
	background-position: left top;
}
.ss_uudiem .r-3col .col {padding-bottom: 0;}
.ss_uudiem .r-3col .col .col-inner{
	background: #fff;
	padding: 10px;
	height: 100%;
}
.ss_uudiem .r-3col h4{
	font-size: 20px;
	color: rgb(57, 104, 142);
	margin-bottom: 10px;
}
.ss_uudiem .r-3col .box-text{
	padding-bottom: 0;
}
.ss_uudiem .r-3col ul{
	margin-bottom: 0;
	list-style-type: none;
}
.ss_uudiem .r-3col ul li{
	text-align: left;
	margin-left: 0;
	padding-left: 25px;
	font-size: 14px;
	position: relative;
}
.ss_uudiem .r-3col ul li:before{
	content: "\f00c";
	font-family: fontawesome;
	position: absolute;
	left: 0;
	color: rgba(241, 82, 82, 1);
}

/* Giám giá mua */
.ss_paysale .row{
	padding: 60px;
	background: rgb(243, 239, 237);
}
.ss_paysale .col_txtsale h3{
	color: rgb(57, 104, 142);
	font-size: 31px;
}
.ss_paysale .col_txtsale .item_sale{
	background: #fff;
	padding: 20px 10px 20px 40px !important;
}
.ss_paysale .col_txtsale .item_sale>*{
	margin-bottom: 0;
	line-height: 1.7;
}
.ss_paysale .col_txtsale .item_sale h4 span{
	animation: 1s tada infinite ease-in;
	position: absolute;
	margin-left: 15px;
	color: rgb(241, 84, 84)
}
.ss_paysale .col_txtsale .ship{
	text-align: center;
	margin-top: 10px;
	font-weight: bold;
}
.ss_paysale .col_txtsale .ship i{
	color: rgba(11, 54, 88, 1.0);
}
.ss_paysale .col{
	padding-bottom: 0;
}
.ss_paysale .col-im .col-inner {
    border: 15px solid rgb(190, 190, 190);
}

/* Comment */
.ss_comment .box-sort{
	display: flex;
	color: rgb(92, 92, 92);
	font-weight: bold;
	align-items: center;
	border-bottom: 1px solid rgb(211, 211, 211);
	padding: 5px 0 10px;
}
.ss_comment .box-sort .s-left{
	font-size: 19px;
	flex-basis: 30%;
}
.ss_comment .box-sort .s-right{
	flex-basis: 70%;
	text-align: right;
}
.ss_comment .box-sort .s-right span{
	background-color: rgb(238, 238, 238);
	border-style: solid;
	border:1px solid rgb(191, 191, 191);
	padding: 7px 10px;
	border-radius: 5px;
	margin-left: 15px;
}
.ss_comment .col.item{
	margin-top: 30px;
	padding-bottom: 0;
}
.ss_comment .col.item .icon-box-text p{
	margin-bottom: 0;
}
.ss_comment .col.item .rate-star{
	border-right: 0;
}
.ss_comment .col.item .rate-star h4{
	font-size: 14px;
}
.ss_comment .col.item .like{
	display: flex;
	font-size: 13px;
	align-items: center;
}
.ss_comment .col.item .like a:nth-child(1){
	padding-left: 0;
}
.ss_comment .col.item .like>*{
	padding: 0 5px;
	color: rgb(67, 102, 176);
}
.ss_comment .col.item .like img{
	width: 23px;
}
.ss_comment .col.item_fdb{
	margin-left: 80px;
	border-left: 1px dotted #ccc;
	padding-bottom: 0;
	width: auto;
}
.ss_comment .last-cmt{
	margin-top: 30px;
	padding-bottom: 0;
}
.ss_comment .last-cmt .dot{
	height: 17px;
	margin-right: 10px;
}
.ss_comment .last-cmt .dot> span{
	background-color: #8d949e;
	animation: mercury 1.5s infinite ease-in-out;
	border-radius: 2px;
	display: inline-block;
	height: 4px;
	margin-right: 2px;
	width: 4px;
}
.ss_comment .last-cmt .dot .dot1{
	animation-delay: 200ms;
}
.ss_comment .last-cmt .dot .dot2{
	animation-delay: 300ms;
}
.ss_comment .last-cmt .dot .dot3{
	animation-delay: 400ms;
}
@keyframes mercury{
	0% {
		transform: translateY(0px);
	}
	28% {
		transform: translateY(-5px);
	}
	44% {
		transform: translateY(0px);
	}
}

/* Đăng ký */
.ss_dangky .section-content > .row > .col.large-7 .col-inner .dky-img{
	min-height: 320px;
}
.ss_dangky .dky-h1{
	color: rgba(51, 51, 51, 0);
	font-size: 39px;
	font-weight: bold;
	line-height: 1.6;
	-webkit-text-stroke: 1px rgb(50, 50, 50);
	margin-bottom: -15px;
}
.ss_dangky .dky-h2{
	color: rgb(51, 51, 51);
	font-size: 39px;
	font-weight: bold;
	line-height: 1.6;
	-webkit-text-stroke: 0px rgb(50, 50, 50);
	margin-bottom: 0;
}
.ss_dangky .dky-box-sale img{
	width: 195px;
}
.ss_dangky .dky-box-sale .sale-text{
	display: inline-block;
	vertical-align: middle;
	margin-left: 5px;
	padding-left: 10px;
	border-left: 1px solid #ddd;
	position: relative;
}
.ss_dangky .dky-box-sale .sale-text .sale-h1{
	margin: 0;
	font-size: 17px;
}
.ss_dangky .dky-box-sale .sale-text .sale-ani{
	color: rgb(249, 110, 64);
	font-size: 23px;
	animation: tada 1s infinite;
	margin: 0;
}
.ss_dangky .dky-box-sale .dky-p1{
	background-color: rgb(141, 139, 139);
	border-radius: 30px;
	color: #fff;
	width: 80%;
	text-align: center;
	padding: 5px;
	font-size: 18px;
}
.ss_dangky .dky-img{
	position: relative;
}
.ss_dangky .dky-img .img1 {
	position: absolute;
	width: 208px !important;
	height: auto;
	top: 0;
	left: 230px;
}
.ss_dangky .dky-img .img2 {
	position: absolute;
	width: 200px !important;
	height: auto;
	top: 70px;
	left: 20px;
}
.ss_dangky .dky-img .img3 {
	position: absolute;
	width: 528px !important;
	height: auto;
	top: 0;
	left: 12px;
	z-index: -1;
}
.ss_dangky .dky-dorm{
	padding: 15px;
	background: rgb(57, 104, 142);
	max-height: 530px;
}
.ss_dangky .dky-dorm .col-inner{
	padding: 35px;
	border: 2px solid #f3aeae66;
	text-align: center;
	max-height: 100%;
}
.ss_dangky .dky-dorm .frm-h1{
	color: #fff;
	font-size: 18px;
	margin-bottom: 20px;
}
.ss_dangky .dky-dorm .wpcf7-submit{
	border: 2px solid #eee;
	background: transparent;
	border-radius: 50px;
	font-size: 18px;
	margin: 0;
}
.ss_dangky .dky-dorm .frm-p1{
	font-size: 13px;
	color: #fff;
}
.ss_footer h4{
	font-size: 18px;
	margin-bottom: 20px;
}
.ss_footer ul li{
	list-style-type: none;
	margin-left: 0;
	font-size: 14px;
}
.ss_footer ul li i{
	margin-right: 10px;
	font-size: 18px;
	padding: 2px;
}
.ss_footer ul.li-2c li{
	display: inline-block;
	width: 49%;
}
.ss_ftbottom p{
	padding-top: 20px;
	border-top: 1px solid  rgba(255,255,255,0.3);
}


@media only screen and (max-width: 480px) {
	body{overflow: hidden;}
	.ss_banner .section-content{min-height: 900px;}
	.box-bn .box-t2,.ss_banner .box-bn .box-t1{font-size: 28px;}
	.box-ani .ani-h1{font-size: 165px;}
	.box-ani .ani-h2{font-size: 140px;}
	.box-bn .box-p1{font-size: 17px;}
	.box-ani .ani-img img{width: 150px;left:20px;}
	.box-bn .box-p2{font-size:15px;}
	.ss_banner .col.large-5{left: 0;}
	.img-1 {
		width: 183px;
		height: auto;
		top: 50px;
		left: 125px;
		z-index: 9;
	}
	.img-1:before {
		bottom: -10px;
		right: -10px;
	}
	.img-2 {
		width: 160px;
		height: auto;
		top: 140px;
		left: 0;
		z-index: 10;
	}
	.img-3 {
		position: absolute;
		width: 330px;
		height: auto;
		top: 43px;
		left: 0px;
		z-index: 7;
	}
	.ss_banner .col{padding: 0 30px;}
	.ss_pro:before {
		width: 165px;
		height: 210px;
		left: 0px;
	}
	.ss_pro .pro-rate .rate-ot h4, .ss_pro .pro-rate .rate-ot p{font-size: 12px;}
	.ss_pro .section-content{padding:10px;}
	.ss_pro .row-pro {padding: 15px 0 0;}
	.ss_pro .pro-h1{font-size: 20px;}
	.ss_pro .pro-rate .rate-star,.ss_pro .pro-rate .rate-ot:nth-child(2),.ss_pro .pro-price{padding-right: 10px;}
	.ss_pro .pro-price .price .giaban,.box-info ul li,.box-info > p,.ss_dlpro .col_txt ul li,.ss_uudiem .r-3col ul li {font-size: 13px;}
	.ss_pro .pro-price .price .giakm{font-size: 16px; top: 0;}
	h3.title-page{font-size: 22px;}
	.ss_dlpro .title-dtpro{font-size: 16px;}
	.ss_dlpro .col_txt h3,.ss_uudiem .r-3col h4{font-size: 18px;}
	.ss_paysale .row  {padding:10px 0;}
	.ss_infopro .box-text-bottom h4 {font-size: 15px;}
	.ss_dlpro .gallery-col.col .box-image {padding-top: 200px !important;}
	.ss_uudiem .r-3col{padding: 20px;}
	.ss_uudiem .r-3col .col {padding-bottom: 20px;}
	.ss_paysale .col_txtsale h3{font-size: 20px; text-align: center;}
	.ss_paysale .col_txtsale .item_sale{padding: 10px 10px 10px 20px !important;}
	.ss_paysale .col_txtsale .item_sale>*{font-size: 14px;}
	.ss_comment .box-sort .s-left,.ss_comment .box-sort .s-right {font-size: 13px;}
	.ss_comment .col.item h3 {font-size: 16px;}
	.ss_comment .col.item .icon-box-text p {font-size: 12px;}
	.ss_comment .col.item_fdb {margin-left: 30px;}
	.ss_comment .col.item {padding: 0;}
	
	.ss_dangky .dky-h1{font-size: 25px;margin-bottom: -8px;}
	.ss_dangky .dky-h2{font-size: 25px;}
	.ss_dangky .dky-box-sale img {
		width: 150px;
	}
	.ss_dangky .dky-box-sale .dky-p1{font-size: 15px;}
	.ss_dangky .dky-img .img1 {
		width: 175px !important;
		left: 140px;
	}
	.ss_dangky .dky-img .img2 {
		width: 160px !important;
	}
	.ss_dangky .dky-dorm{flex-basis: 95%;margin: auto;}
	.ss_dangky .dky-dorm .col-inner{padding: 20px;}
	.ss_footer ul li{font-size: 12px;}
	.ss_footer h4{font-size: 17px}
}
