@charset "UTF-8";
/* CSS Document */

@media (min-width: 1850px) {
	.img-grid-text {
		position: absolute;
		margin: calc(var(--top-border)*1.5);
	}

	.sub-slider {
		height: 60vh;
	  }
}

@media (max-width: 1850px) {
	h1 {
		font-size: 94px;
	}

	.img-grid-text {
		position: absolute;
		margin: calc(var(--top-border)*1.5);
	}

	.sub-slider {
		height: 60vh;
	  }
}

@media (max-width: 1500px) {
	h1 {
		font-size: 72px;
	}

	h2 {
		font-size: 42px;
	}

	.img-grid-text {
		margin: calc(var(--top-border)*0.8);
	}

	.writing-container {
		position: absolute;
		height: 75vh;
		width: 47vw;
		top: calc(25vh - var(--top-border));
		right: calc(var(--top-border)*0.8);
	}
}

@media (max-width: 1200px) {
	h1 {
		font-size: 60px;
	}

	h2 {
		font-size: 32px;
	}

	p {
		font-size: 16px;
	}

	.img-grid-text {
		margin: calc(var(--top-border)*0.3);
	}

	.sub-slider {
		height: 60vh;
	}
}

@media (min-width: 900px) {
	.swiper-pagination {
		display: none;
	}

	#vector1 {
		right: 30vw;
		bottom: var(--top-border);
		height: 20vw;
	}
	
	#vector2 {
		z-index: -9999;
		right: 23vw;
		top: 0px;
		height: 15vw;
	}
	
	#vector3 {
		z-index: -9999;
		right: 30px;
		top: 37vh;
		height: 18vw;
	}

}

@media (max-width: 900px) {
	:root {
		--top-border: calc(2vw + 3vh);
		--gap-grid: 30px;
	}

	.main-logo {
		transform: scale(0.8);
		left: calc((var(--top-border) / 2) -30px);
	}

	h1 {
		font-size: 48px;
	}

	.img-grid-text {
		margin: 0 0 0 var(--gap-grid);
	}

	.image-box-top2 {
		position: relative;
		border-radius: 0px 0px 23px 23px;
		height: 40vh;
		width: 100vw;
		top: 0px;
		left: 0px;
	}

	.writing-container {
		position: relative;
		width: 80%;
		margin-top: 7vh;
		margin-right: 10%;
		margin-left: 10%;
		top: 0;
		right: 0;
	}

	.mid-container {
		position: relative;
		transform: none;
		top: 0;
	}

	.top-content {
		height: 108vh;
		min-height: 900px;
		margin-bottom: 30px;
	}

	.sub-button {
		transform: scale(0.9);
	}

	.sub-button:hover {
		transform: scale(0.92);
	}

	.header-button {
		transform: scale(0.8);
	}

	.header-button:hover {
		transform: scale(0.82);
	}

	.grid-container {
		height: 120vh;
		margin: var(--gap-grid) 0 var(--gap-grid) 0;
	}

	.img-grid-box2 {
		height: 50%;
		width: 75%;
	}

	@media (max-height: 800px) {
		.writing-container {
			margin-top: 3vh;
		}
	}

	@media (max-height: 700px) {
		.writing-container {
			margin-top: 0px;
		}
	}

 	.calendar-icon {
		height: 100px;
		width: 100px;
	}

	.sub-slider {
		position: relative;
		border: 6px solid #e41f3e;
		border-radius: 23px;
		max-width: 430px;
		height: 55vh;
	}

	.pricetag {
		font-size: 24px;
	}

	small {
		font-size: 20px;
	}

	.sub-text {
		font-size: 18px;
	}

	.sub-text2 {
		font-size: 18px;
	}

	.space-line {
		height: 6px;
	}



	.contact-grid-container {
		display: grid;
		width: 80%;
		margin-left: 10%;
		margin-right: 10%;
		grid-template-columns: 1fr;
		grid-template-rows: 1.3fr 0.7fr;
		gap: var(--gap-grid);
		grid-template-areas:
			"C1"
			"C2";
	}

	#vector1 {
		right: 45vw;
		bottom: var(--top-border);
		height: 210px;
	}
	
	#vector2 {
		z-index: -9999;
		right: 23vw;
		top: 40vh;
		height: 150px;
	}
	
	#vector3 {
		z-index: -9999;
		right: 30px;
		bottom: 18vh;
		height: 190px;
	}

}

@media (min-width: 700px) {
	.img-grid-text {
		position: relative;
	}

}

@media (max-width: 700px) {
	:root {
		--top-border: calc(1vw + 2vh);
	}

	h1 {
		font-size: 36px;
	}

	h2 {
		font-size: 26px;
	}

	.writing-container {
		position: relative;
		width: 90vw;
		margin-right: 5vw;
		margin-left: 5vw;
		top: 0;
		right: 0;
	}

	.warning-icon {
		height: 32px;
		width: 32px;
	}

	.sub-slider {
		position: relative;
		border-radius: 23px;
		width: 2300px;
		height: 60vh;
	}

/*	.pricetag {
		font-size: 18px;
	}

	.calendar-icon {
		height: 64px;
		width: 64px;
	}

	small {
		font-size: 14px;
	}

	.sub-text {
		font-size: 14px;
	}

	.sub-text2 {
		font-size: 14px;
	}

	.space-line {
		height: 4px;
	} */

	.img-grid-text {
		position: relative;
		max-width: none;
	}

}

@media (max-width: 550px) {

	.sub-slider {
		position: relative;
		border-radius: 23px;
		width: 180px;
		height: 55vh;
	  }

/*	.pricetag {
		font-size: 16px;
	}

	.calendar-icon {
		height: 40px;
		width: 40px;
	}

	small {
		font-size: 12px;
	}

	.sub-text {
		font-size: 12px;
	}

	.sub-text2 {
		font-size: 12px;
	}

	.space-line {
		height: 2px;
	}

	.sub-container {
		margin-top: 8vh;
		margin-left: 5%;
		margin-right: 5%;
	} */

	.spaceing-layout-half {
		height: 50px;
	}

}

@media (max-width: 450px) {
	p, h3, a {
		font-size: 14px;
		line-height: 1.3;
	}

	#vector1 {
		right: 45vw;
		bottom: var(--top-border);
		height: 160px;
	}
	
	#vector2 {
		z-index: -9999;
		right: 23vw;
		top: 40vh;
		height: 100px;
	}
	
	#vector3 {
		z-index: -9999;
		right: 30px;
		bottom: 22vh;
		height: 140px;
	}

}