section.sec1-ab{
	background-color: #e6e6e6;
	width: 100%;
	height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	position: relative;
}



section .vid1,
section .vid2,
section .vid3,
section .vid4,
section .vid6,
section .vid7,
section .vid5{
	position: absolute;
	width: 12rem;
	height: 12rem;
}

.vid1{
	transform: translate(8rem, 17rem) rotate(-14deg);
}

.vid2{
	transform: translate(-17rem, 17rem) rotate(23deg);
}

.vid3{
	transform: translate(-3rem, -16rem) rotate(-17deg);
}

.vid4{
	transform: translate(32rem, -8rem) rotate(-19deg);
}

.vid5{
	transform: translate(-36rem, -18rem) rotate(22deg);
}

.vid6{
	transform: translate(-42rem, 20rem) rotate(-10deg);
}

.vid7{
	transform: translate(38rem, 15rem) rotate(19deg);
}







.content1-head{
	opacity: 1;
	transform: translateY(-10rem);
	transition: 1.5s ease-in-out;
}

.content1-body{
	opacity: 1;
	transform: translateY(10rem);
	transition: 1.5s ease-in-out;

}

.content1-head p{
	font-size: 72px;
	color: #fc7703;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
	font-weight: 800;
	font-family: 'Mukta Malar', sans-serif;
}

.content1-body p{
	font-size: 36px;
	color: #666666;
	font-weight: lighter;
	font-family: 'Mukta Malar', sans-serif;
}

.content1-body.show{
	transform: translateY(0);
	opacity: 1;
}

.content1-head.show{
	transform: translateY(0);
	opacity: 1;
}

@media (max-width: 541px){
	.content1-head p{
	font-size: 72px;
	color: #fc7703;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
	font-weight: 800;
	font-family: 'Mukta Malar', sans-serif;
}

}

@media (max-width: 461px){
	.content1-head p{
	font-size: 56px;
	color: #fc7703;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
	font-weight: 800;
	font-family: 'Mukta Malar', sans-serif;
}

	.content1-body p{
		font-size: 22px;
		color: #666666;
		font-weight: lighter;
		font-family: 'Mukta Malar', sans-serif;
	}
}

@media (max-width: 281px){
	.content1-head p{
		font-size: 42px;
		color: #fc7703;
		text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
		font-weight: 800;
		font-family: 'Mukta Malar', sans-serif;
	}

	.content1-body p{
		font-size: 16px;
		color: #666666;
		font-weight: lighter;
		font-family: 'Mukta Malar', sans-serif;
	}

}



section.sec2-ab{
	background: rgba(252, 119, 3, 0.7);	
	width: 100%;
	height: auto;
}




.sec2-container{
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: center;
	padding-top: 7rem;
	padding-bottom: 4rem;

}

.sec2-box1{
	width: 23rem;
	height: 38rem;
	background: rgba(255, 255, 255, 1);
	display: flex;
	justify-content: center;
	flex-direction: column;
	box-shadow: 0 0 5px rgba(0, 0, 0, .3);
}


.sec2-box1-head{
	width: 100%;
	height: 20%;
	padding: 1rem;
}

.sec2-box1-head p{
	color: #616263;
	text-align: center;
	width: 100%;
	height: 20%;
	font-size: 38px;
	font-family: 'Koulen', sans-serif;
	font-weight: 300;
}

.sec2-box1-body{
	width: 100%;
	height: 80%;
	padding-left: 1rem;
	padding-right: 1rem;
	padding-bottom: 1rem;
	
}



.sec2-box1-body p{
	color: #000 ;
	font-size: 16px;
	font-family: 'Mukta Malar', sans-serif;
	text-align: justify;
	text-justify: inter-word;

}


.sec2-box1-okinawa{
	display: flex;
	justify-content: center;
	padding-bottom: 1rem;
}

.sec2-box1-body img{
	width: 10rem;
	height: 3rem;

}

@media (max-width: 767px){
	section.sec2-ab{
		background: rgba(252, 119, 3, 0.7);	
		width: 100%;
		height: auto;
		padding-bottom: 6rem;
	}

	.sec2-container{
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
		align-items: center;
		padding-top: 7rem;
		gap: 3rem;

	}

		.sec2-box1{
				width: 90%;
				height: auto;
				background: rgba(255, 255, 255, 1);
				display: flex;
				flex-direction: column;
			box-shadow: 0 0 5px rgba(0, 0, 0, .3);
	}


}


@media (max-width: 281px){
			section.sec2-ab{
				background: rgba(252, 119, 3, 0.7);	
				width: 100%;
				height: auto;
		}
				
			.sec2-box1{
				width: 90%;
				height: auto;
				background: rgba(255, 255, 255, 1);
				display: flex;
				flex-direction: column;
				box-shadow: 0 0 5px rgba(0, 0, 0, .3);
	}

			.sec2-box1-okinawa{
				
	}

}



section.sec3-ab{
	background-color: #FFF;
	width: 100%;
	height: 100vh;
}
