/*pro-section*/
.pro-section{
	position: relative;
	width: 100%;
	height: auto;
	min-height: 100vh;
	z-index: 1;
	padding-top: 100px;
}

.pro-section:before{
	content: '';
	position: absolute;
	width: 100%;
	height: 50vh;
	left: 0;
	top: 0;
	z-index: -100;
	background: #182222;
}
@media screen and (max-width:1200px){
	.pro-section:before{
		display: none !important;
	}
}

/*pro-section-Main*/
.pro-section-Main{
	position: relative;
	width: 100%;
	height: auto;
	min-height: 500px;
	background: #fff;
	border-radius: 10px;
	-webkit-box-shadow: 0 0 10px rgb(0 0 0 / 15%);
	-moz-box-shadow: 0 0 10px rgb(0 0 0 / 15%);
	box-shadow: 0 0 10px rgb(0 0 0 / 15%);
	padding:40px 70px;
}
@media screen and (max-width:1200px){
	.pro-section-Main{
		padding: 30px !important;
		padding: 0px !important;
		box-shadow: none !important;
	}
	.pro_2{
		position: relative !important;
		height: auto !important;
		top: 0px !important;
	}
}
.pro-header{
	position: relative;
	width: 100%;
	height: auto;
}
.pro-header h2{
	font-size: 30px;
	font-weight: 500;
}
@media screen and (max-width:500px){
	.pro-header h2{
		font-size: 23px !important;
	}
}
.pro-Grid{
	position: relative;
	width: 100%;
	height: auto;
	display: grid;
	grid-template-columns: 1fr 330px;
	grid-gap: 80px;
}
@media screen and (max-width:1200px){
	.pro-Grid{
		display: flex !important;
		flex-direction: column !important;
		grid-gap: 30px !important;
		gap: 30px !important;
	}
}


.pro_1{
	position: relative;
	width: 100%;
	height: auto;
}
.performance-box{
	position: relative;
	width: 100%;
	height: auto;
	margin-top: 20px;
}
.performance-box a{
	position: relative;
	width: 100%;
	display: block;
}
.performance-box img{
	position: relative;
	width: 100%;
	height: auto;
}
.performance-header{
	position: relative;
	width: 100%;
	height: auto;
	margin-bottom: 15px;
}
.performance-header h3{
	font-size: 18px;
}
.intruct-vid{
	position: relative;
	width: 100%;
	height: auto;
	margin-bottom: 10px;
}
.intruct-vid video{
	position: relative;
	width: 100%;
	height: auto;
}
.file-babbns{
	position: relative;
	width: auto;
	height: auto;
	display: inline-flex;
	align-items: center;
	margin-bottom: 20px;
	gap: 10px;
	grid-gap: 10px;
}
@media screen and (max-width:370px){
	.file-babbns{
		flex-direction: column !important;
		width: 100% !important;
	}
	.file-babbns a{
		margin:0px !important;
		width: 100% !important;
		justify-content: center;
		text-align: center;
	}
}
.file-babbns a{
	position: relative;
	padding: 10px 20px;
	background:#F9F9F9;
	font-size: 14px;
	font-weight: 500;
	border-radius: 8px;
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	gap: 10px;
	grid-gap: 10px;
	transition: all 0.3s ease-in-out;
}
.file-babbns a:hover{
	background:#F0F0F0;
}
.file-babbns a img{
	width: 20px;
}
.file-babbns a:first-child{
	background: #F48C06;
}
.file-babbns a:first-child:hover{
	background: #E48605;
}
.Ss_about_Sec{
	position: relative;
	width: 100%;
	height: auto;
	padding: 30px;
	margin-top: 20px;
	border:1px solid #EDEDED;
	border-radius: 8px;
}
@media screen and (max-width:500px){
	.Ss_about_Sec{
		padding: 20px !important;
	}
}

.about-bot{
	position: relative;
	width: 100%;
	height: auto;
	padding-bottom: 20px;
	border-bottom:1px solid #EDEDED;
}
.about-bot h3{
	font-size: 17px;
	font-weight: 700;
}
.about-bot p{
	margin-top:10px;
	font-size: 17px;
}
@media screen and (max-width:500px){
	.about-bot p{
		font-size: 15px !important;
	}
}
.about-bot ul{
	position: relative;
	margin-top: 30px;
}
.about-bot ul li{
	position: relative;
	width: 100%;
	height: auto;
	display: grid;
	grid-template-columns: auto 1fr;
	grid-gap: 10px;
	margin-top: 10px;
}
.about-bot ul li i{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 20px;
	height: 20px;
	background-color: #fff;
	color: #000;
	border-radius: 50%;
	font-size: 10px;
	margin-top: 5px;
	-webkit-box-shadow: 0 0 5px rgb(0 0 0 / 20%);
	-moz-box-shadow: 0 0 5px rgb(0 0 0 / 20%);
	box-shadow: 0 0 5px rgb(0 0 0 / 20%);
}
.about-bot ul li span{
	font-size: 18px;
}
@media screen and (max-width:500px){
	.about-bot ul li span{
	font-size: 15px !important;
}
}
.bot_services{
	position: relative;
	width: 100%;
	margin-top: 20px;
}
.bot_services h3{
	font-size: 17px;
	font-weight: 700;
}
.bot_services ul{
	margin-top: 10px;
}
.bot_services ul li{
	display: inline-flex;
	padding: 5px 10px;
	font-size: 12px;
	background: #F9F9F9;
	font-weight: 500;
	border-radius: 3px;
	margin-top: 5px;
	margin: 5px;
}


.pro_2{
	position: sticky;
	top: 30px;
	width: 100%;
	height: auto;
	z-index: 200;
	height: 80vh;
}

.cart-sec-calc{
	position: relative;
	width: 100%;
	height: auto;
}


.cart-sec-calc-main{
	position: relative;
	border-radius: 5px;
	width: 100%;
	height: auto;
	background: #ffffff;
	-webkit-box-shadow: 0 0 0 1px rgb(0 0 0 / 5%), 0 10px 34px -16px rgb(0 0 0 / 8%), 0 6px 4px hsl(0deg 0% 64% / 6%);
    -moz-box-shadow: 0 0 0 1px rgb(0 0 0 / 5%), 0 10px 34px -16px rgb(0 0 0 / 8%), 0 6px 4px hsl(0deg 0% 64% / 6%);
    box-shadow: 0 0 0 1px rgb(0 0 0 / 5%), 0 10px 34px -16px rgb(0 0 0 / 8%), 0 6px 4px hsl(0deg 0% 64% / 6%);


}
.cart-sec-calc-main p{
	position: relative;
	width: 100%;
	height: auto;
	padding: 10px;
	border-bottom: 1px solid #EDEDED;
	font-weight: 500;
	font-size: 14px;
}
.p-header{
	text-transform: uppercase;
}
.total-p,
.sub-p{
	display: flex;
	align-content: center;
	justify-content: space-between;
}
.sub-p img{
	width: 15px;
	margin-right: 3px;
}
.total-p span:nth-child(2){
	font-size: 20px;
	    background: url(../svg/brush-bg.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50%;
}

/*cart-deliv-sec*/
.cart-deliv-sec{
	position: relative;
	width: 100%;
	height: auto;
	padding: 10px;
	border-bottom: 1px solid #EDEDED;
}
.cart-deliv-sec-1{
	position: relative;
	width: 100%;
	height: auto;
}
.cart-deliv-sec-1 h3{
	position: relative;
	width: 100%;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 10px;
}
.cart-deliv-sec-1 h3 span{
	font-size: 15px;
	white-space: nowrap;
}
.cart-deliv-sec-2{
	position: relative;
	width: 100%;
	height: auto;
	text-align: right;
}
@media screen and (max-width:500px){
	.cart-deliv-sec-2{
		text-align: left !important;
	}
}
.cart-deliv-sec-2 p{
	position: relative;
	cursor: pointer;
	user-select: none;
	padding:0px !important;
	display: inline-flex;
	align-items: flex-start;
	font-size: 14px !important;
	color: #ED017F;
	font-weight: normal !important;
	width: auto !important;
	border:none !important;
}
.delivery-optional-p .del-btn{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 20px;
	height: 20px;
	background: #FFF8FC;
	color:#ED017F;
	border-radius: 50%;
	cursor: pointer;
	user-select: none;
	margin-left: 5px;
	font-size: 12px;
}
@media screen and (max-width:300px){
	.delivery-optional-p .del-btn{
		display: none !important;
	}
}
.delivery-optional-p .del-btn i{
	font-weight: 700;
}
.delivery-optional-p .need-del,
.delivery-optional-p .del-btn .ti-plus{
	display: none;
}
.delivery-dec.delivery-optional-p .need-del,
.delivery-dec.delivery-optional-p .del-btn .ti-plus{
	display: inline-flex;
}
.delivery-dec.cart-deliv-sec-1,
.delivery-dec.delivery-optional-p .dont-need-del,
.delivery-dec.delivery-optional-p .del-btn .ti-minus{
	display: none;
}



.cart-sec-calc-btn{
	position: relative;
	width: 100%;
	height: auto;
	padding: 10px;
	padding-bottom: 0px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.checkout-btn{
	position: relative;
	width: 100%;
	height: auto;
	padding:15px 20px;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	outline: none !important;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	cursor: pointer;
	border:none;
	border-radius: 5px;
	background: #04471C;
	color:#ffffff !important;
	-webkit-box-shadow: rgb(0 0 0 / 20%) 0px 5px 10px;
	-moz-box-shadow: rgb(0 0 0 / 20%) 0px 5px 10px;
    box-shadow: rgb(0 0 0 / 20%) 0px 5px 10px;
    transition: all 0.3s ease-in-out;
}
.checkout-btn:hover{
    background:#06712C !important;
}
.cart-footer{
	position: relative;
	width: 100%;
	height: auto;
	padding: 10px;
	border-top: 1px solid #EDEDED;
	margin-top: 10px;
}
.cart-footer-2{
	position: relative;
	width: 100%;
	height: auto;
	margin-top: 2px;
}
.cart-footer-2 p{
	margin: 0;
	padding: 0px;
	font-size: 14px;
	font-weight: normal;
	border:none;
	display: flex;
	align-items: flex-start;
	font-size: 13px;
	color:#555A64;
	opacity: 0.8;
}
.cart-footer-2 p img{
	margin-right: 5px;
	margin-top: 4px;
}


/*courses-add*/
.courses-add{
	position: relative;
	width: 100%;
	height: auto;
	margin-top: 20px;
}

.courses-add-Box{
	position: relative;
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	overflow: hidden;
	border-radius: 6px;
	z-index: 1;
}
.courses-add-Box:before{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 4;
	background: rgba(0, 0, 0, 0.3);
}
.courses-add-Box video{
	position: relative;
	width: 100%;
	height: auto;
	object-fit: cover;
	object-position: center;
}
.courses-add-txt{
	position: absolute;
	z-index: 10;
	color: #fff;
}
.courses-add-txt p{
	font-size: 18px;
	font-weight: 500;
}
.courses-add-txt span{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 5px 20px;
	border:1px solid #fff;
	margin-top: 10px;
	border-radius: 5px;
	font-size: 13px;
	text-transform: uppercase;
	font-weight: 500;
	transition: all 0.3s ease-in-out;
}
.courses-add-Box:hover .courses-add-txt span{
	background: rgba(255,255,255,0.2);
}