/*
** Written by: TAHIR AMAAN
** Date: 31-Dec-2023
*/

@import url('./bootstrap.css?v1');
@import url('./web-fonts.css?thhh66y7');
@import url('./bootstrap-icons.css');


a{color:#f86161;text-decoration:none;}
a:hover{color:var(--at-red);}
img{width:100%;position:relative;overflow:hidden;pointer-events:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-o-user-select:none;}



header{
    background:#f86161;
	padding:30px 15px;
	position:relative;
}
header .logo{
	width:70px;
	filter:brightness(0) invert(1);
	display:inline-block;
	vertical-align:middle;
	margin-right:10px;

}

header .cmpname{
	display:inline-block;
	vertical-align:middle;
	color:#fff;
	font-size:20px;
	font-weight:600;line-height:1.2;
}

header .cmpname span{
	display:block;
	font-size:13px;
}


header .navicon{
	background:transparent;
	padding:0;
	border:none;
	outline:none;
	font-size:32px;
	line-height:1;
	vertical-align:middle;
	color:#fff;
	font-weight:800;
	position:absolute;
	right:20px;
	top:33px;
}

.hero {
    background: linear-gradient(200deg, #ff9f32, #ffc46c, #ff956e);
    background-size: 800% 800%;
    -webkit-animation: heroAnimatiom 4s ease infinite;
    -moz-animation: heroAnimatiom 4s ease infinite;
    -o-animation: heroAnimatiom 4s ease infinite;
    animation: heroAnimatiom 4s ease infinite;
    padding:30px 20px;
    border-radius:0 0 50px 0;
    box-shadow:15px 20px 0 #f86161;
    margin-bottom:30px;
}
@-webkit-keyframes heroAnimatiom {
    0%{background-position:58% 0%}
    50%{background-position:43% 100%}
    100%{background-position:58% 0%}
}
@-moz-keyframes heroAnimatiom {
    0%{background-position:58% 0%}
    50%{background-position:43% 100%}
    100%{background-position:58% 0%}
}
@-o-keyframes heroAnimatiom {
    0%{background-position:58% 0%}
    50%{background-position:43% 100%}
    100%{background-position:58% 0%}
}
@keyframes heroAnimatiom {
    0%{background-position:58% 0%}
    50%{background-position:43% 100%}
    100%{background-position:58% 0%}
}


.hero .hero_img{
	width:250px
}

.hero .hero_txt{
	color:#111;
	font-size:20px;
	font-weight:600;
	padding:15px 0;
}

.hero .hero_txt big{
	display:block;
	font-size:28px;
	font-weight:800;
}

.hero .hero_txt .ht_txt{
	margin-bottom:30px;
}

.hero .hero_txt u{
	color:var(--at-red);
}

.hero .hero_txt .btn{
	border-radius:8px;
	padding:12px 20px;
	cursor:default;
	font-size:15px;
}

menu{
	padding:0;
	margin:0;
	transition:0.5s ease-in-out;
	opacity:0;
	visibility:hidden;
	max-height:0;
}

menu.active{
	visibility:visible;
	max-height:500px;
	opacity:1;
}

menu ol{
	margin:0;
	padding:5px;
}

menu ol li{
	list-style:none;
	padding:14px 15px;
	border-bottom:1px solid var(--at-border);
	color:#111;
}

menu ol li:hover,menu ol li.active{
	color:#fff;
	background:#ff956e;
}

menu ol li i{
	display:inline-block;
	margin-right:10px;
}

menu ol a:last-child li{
	border-bottom:none;
}


.plist{
	padding:20px 20px 10px 15px;
}

.plist .pltop{
	position:relative;
	margin-bottom:25px;
	text-align:center;
}

.plist .pltop .pl_title{
	font-size:28px;
	font-weight:700;
}

.plist .pltop .pl_title i{
	color:#f86161;
}

.plist .pltop .pl_info{
	color:var(--at-gray-800);
}

.plist .pltop .btn{
	padding:12px 20px;
	margin-top:20px;
	border-radius:10px;
	font-weight:bold;
	cursor:default;
}

.prolist a{
	cursor:default;
}

.prolist .pbox{
	position:relative;
	background:#ffc46c;
	overflow:hidden;
	border-radius:15px;
	margin-bottom:35px;
	box-shadow:5px 5px 0 #f86161;
	transition:0.5s ease-in-out;
}

.prolist .pbox:hover{
	transform:scale(0.98);
	box-shadow:10px 10px 0 #f86161;

}

.prolist .pbox img{
	width:100%;
	position:relative;
	border-radius:15px;
}

.prolist .pbox .offer{
	position:absolute;
	z-index:1;
	padding:4px 0;
	text-align:center;
	width:200px;
	background:#ffc46c;
	transform:rotate(-35deg);
	left:-40px;
	top:20px
}


.prolist .pbox .pinfo{
	padding:10px 15px 15px 15px;
	position:relative;
	color:#111;
}

.prolist .pbox .pinfo .btn{
	position:absolute;
	right:15px;
}

.prolist .pbox .pinfo .ptitle{
	font-weight:600;
	font-size:15px;
}

.plist .pl_text{
	text-align:justify;
	line-height: 1.8;
}

.plist .pl_text .btn{
	padding:10px 20px;
	margin-top:15px;
}

.plist .pr_all .btn{
	padding:12px 30px;
	border-radius:10px;
	font-weight:600;
}

.ackblock{
	display:grid;
	grid-auto-flow:row;
	grid-gap:40px;
	grid-template-rows:120px 120px;
	grid-template-columns:120px 120px;
	justify-content:center;
	padding:30px 0;
}

.ackblock .ackbox{
	background:#ffc46c;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	box-shadow:5px 5px 0 #f86161;
	border-radius:10px;
}

.ackblock .ackbox i{
	display:flex;
	width:30px;
	height:30px;
	align-items:center;
	justify-content:center;
	color:#222;
	font-size:28px;
}

.ackblock .ackbox .ab_title{
	margin:10px 0 0px 0;
	line-height:1;
}

.ackblock .ackbox .ab_count{
	font-size:18px;
	font-weight:700;
	color:var(--at-red);
}

.tst_block{
	background:#ffc46c;
	border-radius:15px;
	padding:10px;
	box-shadow:10px -10px 0 #f86161;
}

.tst_block .tst_box{
	width:280px;
	display:inline-block;
	vertical-align:top;
	white-space:normal;
	border-left:1px solid;
	padding:0 30px 0 10px;
}

.tst_block .tst_box:first-child{
	border-left:none;
}

.tst_block .tst_box i{
	display:block;
	font-size:30px;
	color:#f86161;
}

.tst_block .tst_box .tst_by{
	margin-top:10px;
}


.e404{
	padding:50px 0;
}
.e404 h1{
	font-size:80px;
	margin:0;
	color:#f86161;
}
.e404 h3{
	margin:0 0 30px 0;
	font-size:20px;
}
.e404 .btn{
	padding:14px 25px;
	border-radius:10px;
	font-size:15px;
}


/*
#ff956e
#ffc46c
#f86161
#ff9f32
*/
footer{
	background:url(../img/chinarbg2.svg);
	background-color:#ffc46c;
	background-size:cover;
	background-position:100% 0%;
	padding:30px 15px;
	color:#111;
	margin-top:40px;
	box-shadow:-15px -20px 0 #f86161;
	border-radius:50px 0 0 0;
}

footer .quicklinks{}
footer .quicklinks .qlblox{
	display:inline-block;
	width:50%;
	margin-bottom:20px;
}

footer .quicklinks .qlblox .qlbtitle{
	font-weight:600;
	margin-bottom:20px;
	font-size:16px;
	position:relative;
}

footer .quicklinks .qlblox .qlbtitle:before{
	content:"";
	background:#fd355c;
	width:30px;
	height:5px;
	position:absolute;
	bottom:-8px;
}

footer .quicklinks .qlblox .qlbtitle:after{
	content:"";
	background:#111;
	width:10px;
	height:5px;
	position:absolute;
	bottom:-8px;
	left:35px;
}


footer .quicklinks .qlblox a{
	color:#111;
}

footer .quicklinks .qlblox a:hover{
	color:var(--at-red);
	text-decoration:underline;
}


footer .quicklinks .qlblox ul{
	padding:0;
	margin:0;
}

footer .quicklinks .qlblox ul li{
	list-style:none;
	margin-bottom:3px;
	font-size:15px;
}

footer .quicklinks .qlblox ul li:before{
	content:"\f589 ";
	font-family:bootstrap-icons;
	display:inline-block;
	vertical-align:text-bottom;
	font-size:14px;
	margin-right:8px;

}


footer .copyright{
	color:#111;
	text-align:center;
	border-top:1px solid #111;padding:20px 0;
}

footer .copyright .social{
	display:flex;
	justify-content:center;
	padding:10px 0 20px 0;
}

footer .copyright .social a{
	width:38px;
	height:38px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0 5px;
	font-size:18px;
	border:1px solid #111;
	border-radius:8px;
	color:#111;
}

footer .copyright .social a:hover{
	background:#111;
	color:#eee;
}


footer .copyright .dev a{
	color:#111;
	font-weight:700;
	border-bottom:2px dotted #111;
}

footer .copyright .dev a:hover{
	color:var(--at-red);
}

footer .cmp{
	margin-bottom:25px;
}

footer .cmp a{
	color:inherit;
}
footer .cmp .cmp_logo{
	width:100px;
}
footer .cmp .cmp_name{
	font-size:20px;
	font-weight:600;
}

footer .cmp .cmp_addr{
	margin:10px 0;
}

footer .cmp .cmp_addr i{
	display: inline-block;
	margin-right: 10px;
}


@media screen and (min-width:834px) {
	header{
		padding: 20px;
	}
	header .navicon{
		display: none;
	}

	menu{
		opacity: 1;
		visibility:visible;
		max-height: 400px;
		position:absolute;
		top: 25px;
		right: 25px;
		transition: none;
	}

	menu ol{
		padding: 0;
		display: flex;
	}

	menu ol li{
		border: none;
		padding: 5px 10px;
		font-size: 14px;
		border-radius: 8px;
		color: #fff;
	}

	menu ol li:hover{
		color:#111;
	}

	menu ol li i{
		margin-right: 3px;
	}


	.hero{
		padding: 50px 30px;
		display: flex;
		align-items: center;
	}

	.hero .hero_txt{
		padding-left: 30px;
	}


	footer :where(.quicklinks,.cmp){
		display:inline-block;
		width:50%;
	}

	footer .cmp .cmp_div{
		margin-right: 40px;
	}

	footer .cmp .cmp_addr{
		margin: 2px 0;

	}

	footer .copyright{
		display: flex;
		justify-content: space-between;
	}

	footer .copyright .social{
		padding: 0;
	}
	footer .copyright .dev{
		text-align: right;
	}

	.prolist{
		display: grid;
		grid-gap: 30px;
		grid-template-columns:repeat(4,200fr);
	}

	.prolist .pbox{
		flex-basis: 50%;
		flex-grow: 1;
	}

	.ackblock{
		justify-content: space-evenly;
		padding: 50px 30px;
		grid-gap: 0;
		grid-template-columns:repeat(4,120px);
		grid-template-rows: repeat(1,120px);
	}

	.plflex{
		display: flex;
		margin-bottom: 30px;
	}

	.plflex .pltop{
		min-width: 350px;
		text-align: left;
		padding-left: 40px;
		padding-right: 40px;
	}

	.plflex .pl_text{
		padding-right: 40px;
	}

	.plflex .tst_block{
		width: 62%;
		margin-right: 20px;
	}
}


.pages{
	padding:30px 20px;
}

.pages .pgtitle{
	font-size: 22px;
	font-weight: 700;
}
.pages .pgtinfo{
	color: var(--at-gray-800);
	font-weight: 600;
	position: relative;
	margin-bottom: 40px;
}
.pages .pgtitle i{
	color: #f86161;
}

.pages .pgtinfo:before{
	content:"";
	background:#f86161;
	width:50px;
	height:5px;
	position:absolute;
	bottom:-12px;
}
.pages .pgtinfo:after{
	content:"";
	background:#111;
	width:15px;
	height:5px;
	position:absolute;
	bottom:-12px;
	left:55px;
}

.conpage .cmp_name{
	font-size: 25px;
	font-weight: 600;
}

.conpage .cmp_addr{
	line-height: 1.9;
}

.conpage iframe{
	width: 100%;
	height: 300px;
	border: none;
	background-color: #ddd;
	border-radius: 5px;
}

.conpage .pgt2{
	margin-bottom: 10px;
	font-size: 18px;
	font-weight: 600;
}

.conpage .conbox{
	margin-bottom: 20px;
}

@media screen and (min-width:834px) {
	.pages{
		padding: 30px;
	}

	.conpage{
		display: flex;
		align-items: start;
		justify-content: space-between;
	}

	.conpage iframe{
		width: 500px;
	}

	.conpage .conbox{
		margin: 0;
	}
}

.propage{

}

.probuy .title{
	font-size: 18px;
	font-weight: 600;
	padding: 10px 0 20px 0;
}

.probuy .btn{
	width: 100%;
	padding: 14px 20px;
	border-radius: 10px;
	font-size: 16px;
}

.propage .proimg{
	width:100%;
	border-radius: 10px;
}

.probox{
	margin-bottom: 30px;
}

.pro_dtitle{
	font-size: 18px;
	font-weight: 600;
	text-decoration: underline;
	margin-bottom: 5px;
}

.pro_dinfo{
	text-align: justify;
	line-height: 1.7;
	font-size:15px;
}

.pro_dinfo p{
	margin:0;
}

.pages .textpage{
	text-align:justify;
	font-size:15px;
	line-height:1.7;
}


@media screen and (min-width:834px) {
	.propage{
		display: flex;
		justify-content:start;
	}

	.propage .probox{
		width:750px;
	}
	.propage .promain{
		width:600px;
		margin-right: 40px;
	}
	.propage .pro_dinfo{
		font-size: 16px;
		line-height: 1.8;
	}

	.pages .textpage{
		column-count:2;
		column-gap:30px;
		font-size:16px;
	}
}
