/*====== product details section start =====*/
#content-wrapper{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

.column{
	width: 100%;
	padding: 15px;

}

#featured{
	max-width: 100%;
	max-height: 100%;
	object-fit: cover;
	cursor: pointer;
	border: 2px solid var(--text-color);

}

.thumbnail{
	object-fit: cover;
	max-width: 30%;
	max-height: 30%;
	cursor: pointer;
	opacity: 0.5;
	margin: 5px;
	border: 2px solid var(--text-color);

}

.thumbnail:hover{
	opacity:2;
}

.active{
	opacity: 2;
}

#slide-wrapper{
	max-width: 500px;
	display: flex;
	min-height: 100px;
	align-items: center;
}

#slider{
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;

}

#slider::-webkit-scrollbar {
		width: 8px;

}

#slider::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);

}
 
#slider::-webkit-scrollbar-thumb {
  background-color: #dede2e;
  outline: 1px solid slategrey;
   border-radius: 100px;

}

#slider::-webkit-scrollbar-thumb:hover{
    background-color: #18b5ce;
}

.arrow{
	width: 30px;
	height: 30px;
	cursor: pointer;
	transition: .3s;
}

.arrow:hover{
	opacity: .5;
	width: 35px;
	height: 35px;
}

section {
	padding: 2.5rem 9rem;
	background: #f7f2f2;
}

.slider{
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	padding-top: 10rem;
	background: #f7f2f2;
}

.slider .slider_one{
	flex: 1 1 50rem;
}

.slider .slider_one .col-1{
	background-color: #fff;
	padding: 2rem 1.5rem;
	box-shadow: 0 0 3px #646161;
	margin-top: 1rem;
}

.slider_one h6{
	background: var(--main-color);
	color: #ffffff;
	width: 110px;
	font-size: 1rem;
	padding: 0.2rem 0.5rem;
	border-radius: 3px;
	margin-bottom: 1rem;
}

.slider_one h5{
	font-size: 1.5rem;   
	text-transform: capitalize;
	letter-spacing: 1px;
	font-weight: 600;
	padding-bottom: 1rem;
}

.slider_one .date{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.5rem;
}

.slider_one .date span{
	color: var(--text-color);
	font-size: 1.1rem;
	font-family: 'poppins' ,sans-serif;
}

.slider_one .date span i{
	color: var(--main-color);
	padding-right: 0.5rem;
	padding-bottom: 3rem;
}

.slider .slider_one .col-1 .key-row{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 2rem;
}

.slider_one .col-1 .key-row .key{
	display: flex;
	align-items: center;
	gap: 1rem;
}

.slider_one .col-1 .key-row .key i{
	color: var(--main-color);
	font-size: 1.4rem;
}

.slider_one .col-1 .key-row .key span{
	color: #646161;
	font-size: 1rem;
	font-family: 'poppins' sans-serif;
	font-weight: 600;
}

.slider_one .col-1 .key-row .key p{
	color: #141622;
	font-size: 0.8rem;
	font-weight: 600;
	font-family: 'poppins' sans-serif;
}

.slider_one .col-1 p.dec{
	font-size: 1rem;
	padding-bottom: 1rem;
	color: var(--text-color);
}

.slider_one .col-1 .features{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 1rem;
	padding-bottom: 1.5rem;
}

.slider_one .col-1 .features p.fe{
	color: var(--text-color);
	font-size: 1rem;
}

.slider_one .col-1 .features p.fe i{
	color: var(--main-color);
	padding-right: 0.5rem;
}

.slider_one .col-1 .history p.fe {
	color: var(--text-color);
	font-size: 1rem;
}

.slider_one .col-1 .history p.fe i {
	color: var(--main-color);
	padding-right: 0.5rem;
}

.slider .slider_two {
	flex: 1 1 17.5rem;
	padding-top: 1rem;
}

.slider_two .col-2{
	background: #ffffff;
	padding: 1rem 1.5rem;
	box-shadow: 0 0 3px #646161;
	margin-bottom: 1.5rem;
}

.slider_two .col-2 h3{
	color: var(--main-color);
	font-size: 1.2rem;
	font-family: 'poppins' ,sans-serif;
	padding-bottom: 1rem;
}

.slider_two .col-2 .location{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	grid-area: 1rem;
	font-size: 1rem;
}

.slider_two .col-2 .location i{
	color: var(--text-color);
	padding-right: 0.5rem;
}

.slider_two .col-2 .customer{
	display: flex;
	align-items: center;
	gap: 1rem;
}

.slider_two .col-2 .customer img{
	width: 80px;
	height: 80px;
	border-radius: 50%;
}

.slider_two .col-2 .customer h6{
	font-size: 1.2rem;
	color: var(--text-color);
}

.slider_two .col-2 .customer span{
	display: block;
	color: var(--main-color);
	font-size: 1rem;
	font-weight: 600;
}

.slider_two .col-2 .customer i{
	font-size: 1.4rem;
	margin-top: 1rem;
	color: #141622;
	padding-right: 0.5rem;
	cursor: pointer;
}

.slider_two .col-2 .customer i:hover{
	color: #ff0000;
	font-size: 1.5rem;
	font-weight: 700;
}

.slider_two .col-2 h6{
	font-size: 1.2rem;
	color: var(--main-color);
	padding-bottom: 0.5rem;
}

.slider_two .col-2 input,
.slider_two .col-2 textarea{
	border: 1px solid #646161;
	width: 100%;
	margin-top: 1rem;
	padding: 1rem;
	border-radius: 5pa;
	font-size: 1.1rem;
}

.slider_two .col-2 button{
	margin-top: 1.2rem;
	background: var(--main-color);
	padding: 0.5rem 1.5rem;
	color: #ffffff;
	font-size: 1.5rem;
	border-radius: 0.5rem;
	position: relative;
	cursor: pointer;
}

.slider_two .col-2 button i{
	position: absolute;
	top: 15px;
}

.slider_two .col-2 button :hover{
	background: var(--text-color);
}


@media(max-width:1350px) {
    section{
        padding: 2.5rem 5rem;
    }
}

@media(max-width:1275px) {
    section{
        padding: 2.5rem 3rem;
    }
}

@media(max-width:1190px) {
    section{
        padding: 2.5rem 1rem;
    }
}

@media(max-width:768px) {
    .slider .swiper {
        height: auto;
    }

    .slider {
        display: inherit;
    }

    .slider .slider_one .col-1 .key-row{
        grid-template-columns: 1fr 1fr;
    }

    .slider_one .col-1 .features{
        grid-template-columns: 1fr 1fr;
    }
}

@media(max-width:450px) {
    .slider .slider_one .col-1 .key-row{
        grid-template-columns: 1fr;
    }

    .slider_one .col-1 .features{
        grid-template-columns: 1fr;
    }

    .slider_one .date {
        font-size: 0.8rem;
    }
}


.off-info .sm-title{
	background: var(--main-color);
        color: #ffffff;
        display: inline-block;
        padding-top: 0.3rem;
		padding-bottom: 0.3rem;
		padding-left: 3rem;
		padding-right: 3rem;
		font-size: 0.8rem;
		font-family: 'poppins' ,sans-serif;
		margin-bottom: 1rem;
		position: relative;
		top: -14rem;
		left: -33px;
        transform: rotate(-45deg);
        z-index: 1;
        letter-spacing: 1px;
        cursor: pointer;
}

@media (max-width: 991px) {
	.off-info .sm-title{
		top: -6rem;
		left: -30px;
	}
}

@media (max-width: 768px) {
	.off-info .sm-title{
		top: -33rem;
		left: -33px;
	}
}

@media (max-width: 720px) {
	.off-info .sm-title{
		top: -31rem;
		left: -40px;
	}
}

@media (max-width: 680px) {
	.off-info .sm-title{
		top: -28rem;
		left: -30px;
	}
}

@media (max-width: 650px) {
	.off-info .sm-title{
		top: -27rem;
		left: -30px;
	}
}

@media (max-width: 600px) {
	.off-info .sm-title{
		top: -24rem;
		left: -30px;
	}
}

@media (max-width: 550px) {
	.off-info .sm-title{
		top: -22rem;
		left: -30px;
	}
}

@media (max-width: 520px) {
	.off-info .sm-title{
		top: -20rem;
		left: -30px;
	}
}

@media (max-width: 490px) {
	.off-info .sm-title{
		top: -18rem;
		left: -30px;
	}
}

@media (max-width: 450px) {
	.off-info .sm-title{
		top: -17rem;
		left: -30px;
	}
}

@media (max-width: 430px) {
	.off-info .sm-title{
		top: -16rem;
		left: -30px;
	}
}

@media (max-width: 400px) {
	.off-info .sm-title{
		top: -15rem;
		left: -30px;
	}
}

@media (max-width: 380px) {
	.off-info .sm-title{
		top: -15rem;
		left: -30px;
	}
}

@media (max-width: 360px) {
	.off-info .sm-title{
		top: -14rem;
		left: -30px;
	}
}

@media (max-width: 340px) {
	.off-info .sm-title{
		top: -12rem;
		left: -30px;
	}
}

@media (max-width: 300px) {
	.off-info .sm-title{
		top: -10rem;
		left: -30px;
	}
}

@media (max-width: 280px) {
	.off-info .sm-title{
		top: -9rem;
		left: -30px;
	}
}

@media (max-width: 250px) {
	.off-info .sm-title{
		top: -8rem;
		left: -30px;
	}
}

@media (max-width: 230px) {
	.off-info .sm-title{
		top: -7rem;
		left: -30px;
	}
}