.pagewrapper .content-wrap {
	max-width: 1280px;
	padding: 90px 0
}

:root{
	--sprite-path: url(/sites/zweb/images/bookings/explore/explore-img-sprite.svg);
}
h1,
h2,
h3 {
	font-family: var(--zf-primary-bold)
}

.zbs-prd-name {
	display: inline-block
}
.bld-prt {
	font-family: var(--primaryfont-semibold)
}
.zbs-blk-elmt {
	display: block
}

.text-center {
	text-align: center
}

/* zbs-banner */
.zw-product-header{
    background: #49067a;
}
.zbs-banner{
	background: var(--zbs-gradient-bg);
}
.zbs-banner h1{
	font-size: 60px;

}
.zbs-banner {
	text-align: center;
    color: #fff;
}
.zbs-banner .content-wrap{
	position: relative;
}
.zbs-banner .content-wrap::before, .zbs-banner .content-wrap::after{
	content: "";
    position: absolute;
    background: var(--sprite-path);
    background-size: 350px auto;
    width: 55px;
    height: 76px;
	z-index: 1;
}
.zbs-banner .content-wrap::before{
	left: 15%;
    bottom: 17%;

}
.zbs-banner .content-wrap::after{
	background-position: -72px 0px;
    width: 57px;
    height: 57px;
    right: 17%;
    top: 20%;
}
/* zbs-banner */
/* zbs-list-prt */
.zbs-banner p{
    max-width: 650px;
    margin: 0px auto 20px;
    font-size: 20px;
}
.zbs-list-prt .grid-element{
	display: grid;
	grid-template-columns: repeat(3 , 1fr);
	gap: 30px;

}
.zbs-list-prt{
	background: var(--zbs-light-bg-1);
}

.zbs-detail-prt{
	position: relative;
    background: #fbfbfb;
    -webkit-transition: .5s ease;
    -o-transition: .5s ease;
    transition: .5s ease;
    border-radius: 10px;
	padding: 50px 50px 60px;
    box-shadow: 0px 4px 4px 0px rgba(223, 207, 249, 1);

}

.zbs-detail-prt:hover {
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    -webkit-transform: translate(0, -10px);
    -ms-transform: translate(0, -10px);
    transform: translate(0, -10px);
}

.zbs-detail-prt::before{
    content: "";
    position: absolute;
    background: var(--sprite-path);
	background-size: 400px auto;
    background-position: -150px 0px;
    width: 115px;
    height: 69px;
    right: 0px;
    bottom: 0px;
}
.zbs-list-prt .grid-element .zbs-detail-prt:nth-child(even)::before{
    background-position: -282px 0px;
}
.zbs-detail-prt.two-box-mrg{
	grid-column-start: 1;
    grid-column-end: 3;
	padding-bottom: 0px;
	background: var(--zbs-dark-violet-2);
	color: #fff;
}
.zbs-detail-prt.two-box-mrg a{
	color: #fff;
}

.zbs-detail-prt.two-box-mrg::before{
	display: none;

}
.zbs-detail-prt-spl-case{
	display: grid;
	grid-template-columns: repeat(2 , 1fr);
	align-items: center;
	gap: 50px;
}
.zbs-detail-prt-spl-case img{
	display: block;
}

.zbs-detail-prt.last-box-mrg{
	grid-column-start: 1;
    grid-column-end: 4;

}
/* zbs-list-prt */



@media all and (max-width:1280px) {
	.zbs-banner .content-wrap::before, 	.zbs-banner .content-wrap::after{
		display: none;
	}
	.zbs-detail-prt, .zbs-detail-prt.two-box-mrg{
		padding: 30px 30px 60px;
	}
	.zbs-detail-prt-spl-case{
		display: block;
	}
	.zbs-detail-prt.two-box-mrg{
        grid-column-start: unset;
        grid-column-end: unset;

		background: #fff;
		color: #000;
	}
	.zbs-detail-prt.two-box-mrg a{
		color: var(--zbs-link-clr);
	}
	.spl-case-img{
		display: none;
	}
	.zbs-detail-prt.two-box-mrg::before{
		display: block;
	
	}

}

@media all and (max-width:991px) {
	.zbs-banner h1 {

		font-size: 44px;
	}

	.zbs-list-prt .grid-element{
		grid-template-columns: repeat(2, 1fr);
	}
	

}

@media all and (max-width:767px) {
	.zbs-banner h1{

		font-size: 30px;
	}
	.zbs-banner p{
		max-width: 550px;
	}
	.pagewrapper .content-wrap{
		padding: 60px 0;
		width: 95%;
	}
	.zbs-list-prt .grid-element{
		grid-template-columns: repeat(2, 1fr);
		gap: 15px;
	}

	.zbs-banner p {

		font-size: 17px;
	}
	.zbs-list-prt .grid-element{
		max-width: 550px;
		grid-template-columns: repeat(1, 1fr);
		gap: 20px;
		margin: 0 auto;
	}
	
	
	
}

@media all and (max-width:480px) {
	.pagewrapper .content-wrap{
		padding: 60px 0;
		width: 90%;
	}
.zbs-banner {
    text-align: left;
}

	
}