@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-family: "Poppins", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 15px;
}

a {
	text-decoration: none !important;
}

.navbar {
	transition: background-color 0.3s ease;
}

	.navbar.transparent {
		background-color: transparent !important;
	}

	.navbar.scrolled {
		background-color: blue !important;
	}

.carousel-control-prev-icon,
.carousel-control-next-icon {
	filter: invert(56%) sepia(74%) saturate(705%) hue-rotate(29deg) brightness(95%) contrast(96%);
}

.carousel-control-prev,
.carousel-control-next {
	opacity: 1 !important;
}

/******************sticky whatsapp and call***********************/
.icon-bar {
	position: fixed;
	bottom: 30%;
	position: fixed;
	z-index: 1;
	width: 30px;
	left: -12px;
	transform: translateY(-50%);
}

	.icon-bar a {
		display: block;
		text-align: center;
		transition: all 0.3s ease;
		color: white;
		margin-top: 0.5rem;
		font-size: 20px;
	}

		.icon-bar a:hover {
			background-color: #0095da;
		}

.floats {
	height: 50px;
	width: 50px;
	padding-top: 0.4rem;
	background: #ec9622;
	color: white;
}

.icon-bar a img {
	filter: grey;
}


/***** banner code ******/
.pportfolio {
	background-color: #F2F2F2;
}

.fancybox__container {
	z-index: 1080 !important;
}



.website-grid-cc .img-fluid {
	height: 340px;
	width: 100%;
	object-fit: cover;
	display: block;
	border-radius: 4px;
	margin: auto;
	position: relative;
}

.one {
	flex: 1 1 25%; /* Each element takes 25% of the row width */
	max-width: 25%; /* Prevent exceeding 25% of the row */
	box-sizing: border-box;
	padding: 5px; /* Add spacing between items */
}

/* Ensure video fits perfectly inside .one */
video {
	display: block;
	width: 100%;
	height: auto; /* Maintain aspect ratio */
	object-fit: cover; /* Ensures video scales nicely within its container */
}

.home-text {
	position: relative;
	z-index: 1;
}


.website-cont {
	position: relative;
	top: 8rem;
	width: 38vw;
	margin: auto;
}


.banner {
	background-image: url(../images/aarav-web.mp4);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}

.website-banner {
	background-image: url(../images/web-design-bnr.webp);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
}

.mobile-banner {
	background-image: url(../images/mobile-bnr.webp);
	background-position: center;
	/* height: 800px;*/
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}


.print-banner {
	background-image: url(../images/print-bnr.webp);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}

.bannerTwo {
	background-image: url(../images/pakg-bnr.webp);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}

.ban {
	background-image: url(../images/logo-design-bnr.webp);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}


.portfolio-web-page {
	background-image: url(https://cdn.californialogodesigns.com/images/banner-images/port-main-bgbnr.webp);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}

.video-animation-banner {
	background-image: url(https://cdn.californialogodesigns.com/images/banner-images/animation-bnr.webp);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}


.contactUs-page {
	background-image: url(https://cdn.californialogodesigns.com/images/banner-images/contact-bnr.webp);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}


.home-baner {
	padding: 0;
	background-image: url(https://cdn.californialogodesigns.com/images/banner-images/banner-1.webp);
	background-size: cover;
	background-position: center;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	position: relative;
	z-index: 0;
}

.video_header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100vh;
	width: 100%;
	z-index: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}

	.video_header video {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		filter: opacity(.6);
		z-index: -1; /* Keeps the video behind other content */
	}


.home-baner .head {
	font-size: 54px;
}


.impact {
	background-image: url(../images/gream-bg.webp);
	background-position: center;
	height: 800px;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 0;
}

.text-box {
	position: relative;
	top: 5rem;
	width: 90%;
	margin: auto;
}

.text-box2 {
	position: relative;
	top: 10rem;
	width: 90%;
	margin: auto;
}

.para {
	width: 90%;
	color: #fff;
}

.logothree {
	position: relative;
}

	.logothree::before {
		position: absolute;
		content: "";
		background-image: url(https://cdn.californialogodesigns.com/images/bird-cells-new.webp);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
		top: -350px;
		bottom: 0;
		height: 134px;
		width: 114px;
		margin: auto;
	}

.bimageLogoImg img {
	position: relative;
	z-index: 1
}

.bimageLogoImg::before {
	position: absolute;
	content: "";
	background-image: url(https://cdn.californialogodesigns.com/images/bird-cells-new.webp);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	top: 100px;
	bottom: 0;
	height: 134px;
	width: 114px;
	margin: auto;
}

.bimageLogoImg::after {
	position: absolute;
	content: "";
	background-image: url(https://cdn.californialogodesigns.com/images/circle-banner.webp);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	left: 250px;
	z-index: 0;
	bottom: 4px;
	height: 160px;
	width: 158px;
	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	animation: 60s linear infinite asteroid;
}

@media(min-width:1100px) {
	.logothree img {
		position: relative;
		z-index: 1 !important;
	}
}

@media(max-width:1100px) {
	.logothree img {
		width: 100% !important;
		position: relative;
		z-index: 1 !important;
	}

	.logothree::after {
		left: 0px !important;
	}
}

.logothree::after {
	position: absolute;
	content: "";
	background-image: url(https://cdn.californialogodesigns.com/images/circle-banner.webp);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	left: 300px;
	z-index: 0;
	right: 0;
	bottom: -34px;
	height: 160px;
	width: 158px;
	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	animation: 60s linear infinite asteroid;
}

.head {
	font-weight: 700;
	color: #fff;
	font-size: 40px;
}

.head2 {
	font-weight: 700;
	color: #0095da;
	font-size: 40px;
}


.head3 {
	font-weight: 600;
	color: #0095da;
}

.high {
	font-weight: 700;
	color: #ec9622;
	font-size: 40px;
}

.Client h2, .Client .high {
	font-size: 62px;
}

.bimage::after {
	content: ""; /* Required for pseudo-elements to render */
	position: absolute;
	background-image: url(https://cdn.californialogodesigns.com/images/pakg-bner-after.webp);
	background-size: cover; /* Ensures the image fills the specified dimensions */
	right: 150px;
	width: 247px;
	height: 539px;
	top: 150px;
}

.bimage::before {
	content: ""; /* Required for pseudo-elements to render */
	position: absolute;
	background-image: url(https://cdn.californialogodesigns.com/images/pakg-bner-before.webp);
	background-size: cover; /* Ensures the image fills the specified dimensions */
	left: 160px;
	width: 203px;
	height: 550px;
	top: 150px;
}

.privacy {
	padding: 175px 0;
	background-color: #0a1857;
	display: flex;
	align-items: center;
	justify-content: center;
}

/********************************** popup up*********************************************************/

.iti {
	display: block;
}

.contactoffer {
	background: #fff;
	height: 500px;
	overflow: hidden;
}

.iti__country-list {
	max-height: 150px;
	max-width: 310px;
	overflow-x: hidden;
}

.main-cn .modal-content {
	background: transparent !important;
	border: none !important;
}

.contactoffer .modal-header .btn-close {
	background-color: Red !important;
	opacity: 1;
	border-radius: 0px;
}

.modal-backdrop.show {
	opacity: 0.7 !important;
}
/*.modal-backdrop {
		--bs-backdrop-zindex: 0!important;
		--bs-backdrop-opacity:1!important;
	}*/

.Benifit {
	position: relative;
	z-index: 0;
}

.Four, .Agency, .Perfect {
	position: relative;
	z-index: 0;
}

@media (max-width:991px) {
	.main-cn .modal-lg, .main-cn .modal-xl {
		top: 20%;
	}

	.offer {
		display: none;
	}

	.contactoffer {
		height: 100% !important;
		overflow: hidden;
	}
}



@media (min-width: 992px) {
	.main-cn .modal-lg, .main-cn .modal-xl {
		--bs-modal-width: 1000px !important;
		top: 20%;
	}
}

/*****************************home page vertical slider*****************************************/



.custom-text-slider {
	display: flex;
	flex-direction: column;
	height: 600px;
	justify-content: center;
}

.custom-carousel-container {
	position: relative;
	overflow: hidden;
	height: 600px;
}

.custom-carousel {
	display: flex;
	flex-direction: column;
	transition: transform 0.5s ease-in-out;
}

.custom-carousel-item {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 600px;
}


.custom-controls {
	position: absolute;
	top: 50%;
	flex-direction: column;
	display: flex;
	transform: translateY(-50%);
	z-index: 100;
	height: 100%;
	justify-content: center;
	width: 20px !important;
}
	/*.custom-controls {
            position: absolute;
            top: 50%;
            width: 100%;
            display: flex;
            justify-content: space-between;
            transform: translateY(-50%);
        }*/

	.custom-controls button {
		position: relative;
		left: -2rem;
		background-color: #ec9622;
		color: #fff;
		border: none;
		padding: 5px 15px;
		cursor: pointer;
		border-radius: 50%;
		margin-bottom: 1rem;
	}

	.custom-controls span {
		position: relative;
		left: -0.4rem;
	}

	.custom-controls button:hover {
		background-color: rgba(0, 0, 0, 0.8);
	}

/* .custom-dots {
            position: absolute;
            text-align: left;
            left: -2rem;
            padding: 20px 0;
            display: flex;
            align-items: center;
            flex-direction: column;
            height: 100%;
            justify-content: center;
            width: 20px;
            
        }*/

.custom-dot-position {
	position: relative !important;
}

/* .custom-dot {
            display: inline-block;
            margin: 0 5px;
            width: 10px;
            margin: 0.5rem;
            height: 10px;
            background-color: red;
            border-radius: 50%;
            cursor: pointer;
        }*/

.custom-dot.active {
	background-color: #333;
}

@media(max-width: 992px) {
	.custom-carousel-item, .custom-carousel-container, .custom-text-slider {
		height: 805px !important;
	}
}


.img-back {
	background-image: url(../images/ind-before.webp);
	background-position: center;
	width: 100%;
	height: 100%;
}
/*******************End here **************************/

/*******************price section**************************/
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	border: solid !important;
	background: linear-gradient(to right, #b630ad 0, #5b1857 100%);
	color: #fff !important;
}

.nav-pills .nav-link {
	font-size: 14px;
	font-weight: 400;
}

.card-container {
	text-align: center;
	width: 100%; /* Full-width container for responsiveness */
	max-width: 400px; /* Constrain card width */
}

.card {
	border: 1px solid #ddd;
	border-radius: 30px;
	background-color: #fff;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	overflow: hidden;
	transition: transform 0.3s ease; /* Add smooth hover effect */
}



.card-header {
	padding: 20px;
	background-color: #0095da;
	color: #232324;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
}

	.card-header .price span {
		text-decoration: line-through;
		color: #ffd700;
		margin-left: 10px;
		font-size: 1rem;
	}

.card-body {
	position: relative;
	padding: 20px;
	text-align: left;
}

	.card-body ul {
		margin-top: 60px;
		height: 200px;
		overflow-y: scroll;
		z-index: 2;
		padding: 10px;
		scrollbar-width: thin;
		scrollbar-color: #0095da #f4f4f9;
	}

		.card-body ul::-webkit-scrollbar {
			width: 8px;
		}

		.card-body ul::-webkit-scrollbar-thumb {
			background: #B630AD;
			border-radius: 4px;
		}

		.card-body ul::-webkit-scrollbar-track {
			background: #f4f4f9;
		}

	.card-body li {
		margin-bottom: 10px;
		font-size: 0.9rem;
		color: #4a4a4a;
		font-family: "Poppins", sans-serif;
		font-weight: 400;
		font-style: normal;
	}

.card-footer {
	padding: 20px;
	display: flex;
	justify-content: space-around;
	position: relative;
	z-index: 1;
}

	.card-footer button {
		padding: 10px 20px;
		font-size: 1rem;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		transition: background-color 0.3s ease, transform 0.2s ease;
	}

.order-btn, .order-btn:hover {
	padding: 5px 11px;
	background-color: #0095da;
	color: white;
}

.chat-btn, .chat-btn:hover {
	background-color: #ec9622;
	color: #fff;
	padding: 5px 11px;
}




button:hover {
	opacity: 0.9;
	transform: translateY(-2px);
}

button:focus {
	outline: 2px solid #B630AD;
	outline-offset: 2px;
}

.is-hover-animation {
	position: relative;
	overflow: hidden;
	z-index: 0; /* Set base z-index */
}

	.is-hover-animation::after {
		content: '';
		height: 25px;
		width: 25px;
		background-color: #EEEFFA;
		position: absolute;
		border-radius: 30%;
		top: 0;
		right: 0;
		z-index: -1; /* Ensure pseudo-element is below the content */
		transition: all 1.5s ease;
	}

	.is-hover-animation:hover::after {
		background-color: #EEEFFA;
		transform: scale(100);
	}

.icon-logo {
	position: relative;
	z-index: 3;
	display: flex;
	justify-content: center;
}

	.icon-logo img {
		width: 40%;
		height: 30%;
	}

.is-img {
	width: 80%;
	position: absolute;
	top: 0;
	right: 0;
}

.is-one strong, .is-two strong {
	font-weight: 700;
	color: #fff;
}

.is-two {
	display: flex;
	flex-direction: column;
	text-align: right;
	font-size: 2rem;
	font-family: "Poppins", sans-serif;
	font-weight: 700;
	font-style: normal;
	color: #232324;
}

	.is-two span {
		font-size: 16px;
		position: relative;
		color: #f7d400;
	}

		.is-two span::before {
			content: '';
			position: absolute;
			left: 0;
			right: 0;
			top: 50%;
			height: 1px; /* Adjust thickness */
			background-color: #f7d400; /* Line color */
			transform: translateY(-50%);
		}

/************************************The Perfect Price**************************************/

.feedback-card {
	background-color: #fff;
	overflow: hidden;
	text-align: center;
	position: relative;
	z-index: 1;
}


	/* Card Hover Effect */
	.feedback-card::after {
		content: "";
		width: 40px;
		height: 40px;
		background-color: #F7D400;
		position: absolute;
		top: 10%;
		left: 5%;
		border-radius: 50%;
		transform: scale(1);
		transition: all 0.3s ease-in;
		z-index: -2;
	}

	.feedback-card:hover::after {
		top: 0;
		left: 0;
		border-radius: 0%;
		width: 100%;
		height: 100%;
		background-position: center;
		background-repeat: no-repeat;
	}

	.feedback-card > img {
		position: absolute;
		width: 100%;
		left: -100%;
		transition: all 0.5s ease-in;
		object-fit: cover;
	}

	.feedback-card:hover > img {
		position: absolute;
		width: 100%;
		left: -10%;
		z-index: -1;
	}

	.feedback-card .is-text-my h1 {
		position: relative;
	}

		.feedback-card .is-text-my h1::before {
			content: '01';
			position: absolute;
			top: -40px;
			right: -30px;
			opacity: 0.3;
			color: #B630AD;
			font-size: 120px;
			font-family: 'poppins';
			font-weight: 700;
		}

	.feedback-card .is-text-my-two h1 {
		position: relative;
	}

		.feedback-card .is-text-my-two h1::before {
			content: '02';
			position: absolute;
			top: -40px;
			right: -30px;
			opacity: 0.3;
			color: #B630AD;
			font-size: 120px;
			font-family: 'poppins';
			font-weight: 700;
		}

	.feedback-card .is-text-my-three h1 {
		position: relative;
	}

		.feedback-card .is-text-my-three h1::before {
			content: '03';
			position: absolute;
			top: -40px;
			right: -30px;
			opacity: 0.3;
			color: #B630AD;
			font-size: 120px;
			font-family: 'poppins';
			font-weight: 700;
		}

/*************************************portfolio code****************************************************/
.fancybox__container {
	z-index: 1080 !important;
}

/****************fourth section***********************************/

.Four {
	background-color: #5f1861;
}

.btn1, .btn1:hover {
	background: #ec9622;
	border: 1px solid #ec9622;
	color: #fff;
	border-radius: 30px;
}

.btn2, .btn2:hover {
	background: #0095da;
	color: #fff;
	border-radius: 30px;
}

.Four, .Agency, .Perfect {
	position: relative;
	z-index: 0;
}

	.Four::before, .Agency::before {
		content: "";
		position: absolute;
		background-image: url(https://cdn.californialogodesigns.com/images/cta-before.webp);
		background-size: cover;
		background-position: center;
		top: 0;
		left: 0;
		width: 388px;
		height: 475px;
		bottom: 0;
		margin: auto;
	}

.f-cont {
	z-index: 1 !important;
	position: relative;
}

.Four::after, .Agency::after {
	content: "";
	position: absolute;
	background-image: url(../images/cta-after.webp);
	background-size: cover;
	background-position: center;
	top: 0;
	right: 0;
	width: 250px;
	height: 200px;
	bottom: 0;
	margin: auto;
}


/* 2d logo page css************************************/


.bg-changer-is {
	background-color: #0095da;
	padding: 20px;
	padding-top: 40px;
	position: relative;
	z-index: 2;
	overflow: hidden;
	top: -2rem;
	height: 300px;
	border-radius: 0px !important;
}

	.bg-changer-is h1 {
		padding-top: 20px;
	}

.Benifit:hover .bg-changer-is {
	background-color: #ec9622;
	color: #ffffff !important;
}

.bg-changer-is > img {
	width: 100%;
	bottom: -170%;
	left: -39px;
	transition: all 0.3s ease-in;
	object-fit: cover;
	z-index: 0;
	position: absolute;
}

.bg-changer-is:hover > img {
	bottom: -20%;
	object-fit: contain;
	width: 81%;
	left: -30px;
	z-index: -1;
}

.eys-on-me {
	border: 2px solid #0095da;
	width: 100px;
	height: 100px; /* Add a fixed height for consistent centering */
	border-radius: 50%;
	position: relative;
	overflow: hidden;
	z-index: 11;
	display: flex;
	background-color: #fff;
	align-items: center; /* Center content vertically */
	justify-content: center; /* Center content horizontally */
	margin: 0 auto; /* Center the element itself horizontally */
	transition: background-color 0.3s ease, filter 0.3s ease;
}

	.eys-on-me img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		padding: 20px;
		transition: filter 0.3s ease;
	}

.Benifit:hover .eys-on-me {
	background-color: #ec9622; /* Yellow background */
	border: 2px solid #fff;
}

	.Benifit:hover .eys-on-me img {
		filter: brightness(0) invert(1); /* White icon */
	}

/* 3d page css*/

.abt-three, .two-cards-banner {
	position: relative;
}

	.abt-three::before, .two-cards-banner::before {
		position: absolute;
		content: "";
		position: absolute;
		background-image: url(https://cdn.californialogodesigns.com/images/logo-need-before.webp);
		background-size: cover;
		background-position: center;
		top: 0;
		left: 0;
		bottom: 0;
		height: 100%;
		width: 184px;
		margin: auto;
		z-index: -1;
	}

	.abt-three::after, .two-cards-banner::after {
		position: absolute;
		content: "";
		position: absolute;
		background-image: url(https://cdn.californialogodesigns.com/images/logo-need-after.webp);
		background-size: cover;
		background-position: center;
		top: 0;
		right: 0;
		bottom: 0;
		width: 32vw;
		z-index: -1;
		height: 100%;
		margin: auto;
	}

.Agency {
	background-color: #f7d400;
}


.three-logo, .three-cards-banner, .Creative-Portfolio {
	background-color: #f2f2f2;
}


.port-tab .nav-link {
	font-size: 16px;
	margin: 0px 10px;
}


.alernatebg2 {
	background: #eeeff3;
}
/********************footer********************************/

#topScroll {
	display: none;
	position: fixed;
	bottom: 20px;
	left: 30px;
	z-index: 99;
	border: none;
	outline: none;
	cursor: pointer;
}


.footer {
	background: #000;
	position: relative;
}

	.footer p {
		font-size: 14px;
		font-weight: 300;
	}

.foot .nav-link {
	font-size: 14px;
	font-weight: 300;
	padding: 2px;
}

.footer {
	padding: 40px 0 50px;
	background-color: #000;
	position: relative;
	z-index: 0;
	overflow: hidden;
	display: flex;
	align-items: center;
}

	.footer::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		background-image: url(../images/footer-before-img.webp);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
		width: 934px;
		height: 881px;
		z-index: -1;
		border-radius: 50%;
		mix-blend-mode: luminosity; /* Optional */
		transform-origin: center;
		animation: asteroid 100s linear infinite;
	}


/**********************************media query for mobiles **************************************/

@media(min-width:1450px) {
	.print-bn-img .img-fluid {
		position: relative;
		top: 80px;
		width: 50%;
	}

	.Print-text-box {
		position: relative;
		top: 5rem;
	}
}

@media (min-width: 1200px) and (max-width: 1650px) {
	.Four::before, .Agency::before {
		display: none;
	}
}

@media (max-width: 1200px) {
	.bimageLogoImg::before {
		top: 150px;
	}

	.bg-changer-is {
		height: 400px !important;
	}
}

@media (max-width: 992px) {
	.contactoffer {
		background: #fff;
		height: 100% !important;
		overflow: hidden;
	}

	.iti__country-list {
		max-width: 450px !important;
		overflow-x: hidden;
	}
}

@media (max-width: 991px) {
	.ban {
		height: 600px;
	}

	.head2 {
		width: 100% !important;
	}

	.Client .container {
		width: 100% !important;
	}

	.contact-bn-img .img-fluid {
		position: relative;
		top: 20px;
		width: 80%;
	}

	.print-banner .contact-bn-img .img-fluid {
		width: 50%;
	}

	.is-two {
		font-size: 20px;
	}
}

@media (max-width: 767px) {


	.Four::after, .Agency::after {
		display: none;
	}

	.Four::before, .Agency::before {
		display: none;
	}

	.hide, .port-img {
		display: none;
	}

	.impact {
		height: 100%;
	}

	.ban, .contactUs-page, .portfolio-web-page, .print-banner, .video-animation-banner, .website-banner {
		height: 400px !important;
		padding-bottom: 2rem;
	}

	.text-box {
		top: 0px;
	}

	.bimage::after, .bimage::before, .bimage, .main-menu, .print-bn-img {
		display: none;
	}

	.head, .high, .head2 {
		font-size: 30px;
	}

	.Client h2, .Client .high {
		font-size: 30px !important;
		;
	}

	.banner {
		height: 400px;
		align-items: center;
	}

	.navbar .container {
		max-width: 100% !important;
	}

	.bimageLogoImg img {
		width: 100% !important;
	}

	.para {
		width: 90% !important;
	}

	.head2 {
		font-size: 30px !important;
		width: 100% !important;
		text-align: center;
	}

	.two-cards-banner, .Project, .Excellence, .abt-three, .Agency, .Four, .three-logo, .abt, .second-decade, .section-sixth, .custom-carousel-item {
		text-align: center;
	}

	.bimageLogoImg::after, .bimageLogoImg::before, .logothree::before, .logothree::after {
		display: none;
	}

	.logothree img, .contact-bn-img img, .fflogothrees img, .bimageLogoImg img {
		display: none;
	}

	.text-box2, .creative img {
		width: 100% !important;
	}

	.mobile .img-fluid {
		display: none;
	}

	.text-box2 {
		top: 0px;
	}

	.mobile-banner {
		height: 500px;
	}

	.website-cont {
		top: 0px;
		width: 100% !important;
	}
}


@media(max-width:575px) {
	.bg-changer-is {
		height: 100% !important;
	}
}

@media (max-width: 450px) {
	.high, .head, .head2 {
		font-size: 20px !important;
	}

	.Client .high {
		font-size: 20px !important;
	}

	.para {
		width: 100% !important;
	}

	.Client h2, .Client .high {
		font-size: 20px !important;
		;
	}

	.ban {
		height: 400px !important;
	}
}


@media(min-width:1500px) {
	.text-box2 p {
		padding: 0px 70px !important;
	}
}