h1, h2, h3 {
	font-family: 'Srisakdi', cursive;
	font-weight: 400;
}
p, button {
	font-family: 'Montserrat', sans-serif;
}
h1 {
	font-size: 40px;
	text-align: center;
	color: #FFFB00;
	margin: 0 0 40px 0;
}
h2 {
	font-size: 10px;
	text-align: center;
	color: #FFFB00;
	margin: 0 0 30px 0;
}
h3 {
	font-size: 40px;
	text-align: center;
	color: #FFFB00;
	margin: 0 0 30px 0;
}
p {
	font-size: 13px;
	text-align: center;
	color: #FFFB00;
	margin: 0 0 30px 0;
}
button {
	background: #000;
	border: 5px solid #E84E4D;
	border-radius: 10px;
	padding: 18px 30px;
	font-size: 50px;
	color: #FFFB00;
	cursor: pointer;
}
button:focus {
	outline: none;
}
button:hover {
	color: #fff;
	background: #E54A4A;
}
/*about*/
.about {
	background: #000;
	border: 10px solid #E84E4D;
	border-radius: 20px;
	position: absolute;
	display: none;
	z-index: 9999;
	height: 350px;
	width: 600px;
	padding: 20px;
	left: 50%;
	top: 50%;
	margin-left: -300px;
	margin-top: -175px;
}
.about > div {
	max-width: 600px;
	width: 70%;
	position: fixed;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	left: 50%;
	top: 50px;
	background: #FFFFFF;
	padding: 30px;
	z-index: 5001;
	text-align: center;
	border: 25px solid #9AD3DE;
	border-radius: 10px;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
}
/*port*/
.port {
	background: #;
	border: ;
	border-radius: ;
	position: absolute;
	display: none;
	z-index: 9999;
	height: 3000px;
	width: 3000px;
	padding: 20px;
	left: 50%;
	top: 50%;
	margin-left: -1500px;
	margin-top: -1500px;
}
.port > div {
	width: 1000px;
	height: 500px;
	position: fixed;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	left: 50%;
	top: 50%;
	background: #;
	padding: 30px;
	z-index: 10000;
	text-align: center;
	border: ;
	border-radius: 20px;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
}
/*subs*/
.subs {
	background: #;
	position: absolute;
	display: none;
	z-index: 10000;
	height: 100%;
	width: 100%;
	top: 0px;
}
.subs > div {
	position: absolute;
	height: 220px;
	width: 680px;
	padding: 20px;
	left: 50%;
	top: 50%;
	margin-left: -340px;
	margin-top: -110px;
	background: #000;
	z-index: 5001;
	text-align: center;
	border: 10px solid #FFFB00;
	border-radius: 10px;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
}
/* ================================= */
/* ::::::: Media Setting :::::::: */
/* ================================= */
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 320px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 300px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -150px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 450px;
		width: 300px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -150px;
		margin-top: -225px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 350px;
		height: 400px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 320px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 360px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 400px;
		width: 380px;
		padding: 20px;
		left: 50%;
		top: 40%;
		margin-left: -190px;
		margin-top: -200px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 400px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 360px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 375px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 420px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -210px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 400px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 375px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 411px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 400px;
		width: 400px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -200px;
		margin-top: -200px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 400px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 411px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 414px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 420px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -210px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 400px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 414px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 480px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 230px;
		width: 450px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -225px;
		margin-top: -115px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 420px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -210px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 400px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 480px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 568px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 568px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 220px;
		width: 500px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -250px;
		margin-top: -110px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 90%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 280px;
		width: 480px;
		padding: 20px;
		left: 50%;
		top: 45%;
		margin-left: -240px;
		margin-top: -140px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 400px;
		height: 250px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 600px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 250px;
		width: 500px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -250px;
		margin-top: -125px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 600px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 600px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 280px;
		width: 480px;
		padding: 20px;
		left: 50%;
		top: 45%;
		margin-left: -240px;
		margin-top: -140px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 640px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 400px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -200px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 640px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 90%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 330px;
		width: 400px;
		padding: 20px;
		left: 50%;
		top: 45%;
		margin-left: -200px;
		margin-top: -165px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 500px;
		height: 300px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 667px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 400px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -200px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 667px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 90%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 330px;
		width: 400px;
		padding: 20px;
		left: 50%;
		top: 45%;
		margin-left: -200px;
		margin-top: -165px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 500px;
		height: 300px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 731px) and (orientation : portrait) {
	.subs > div {
		height: 250px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -125px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 731px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 550px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -275px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 90%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 600px;
		height: 300px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 736px) and (orientation : landscape) {
	.subs > div {
		height: 220px;
		width: 500px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -250px;
		margin-top: -110px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 80%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 500px;
		height: 300px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 768px) and (orientation : portrait) {
	.subs > div {
		height: 250px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -125px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 800px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 768px) and (orientation : landscape) {
	.subs > div {
		height: 250px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -125px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 812px) and (orientation : portrait) {
	.subs > div {
		height: 200px;
		width: 400px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -200px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 400px;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 812px) and (orientation : landscape) {
	.subs > div {
		height: 280px;
		width: 350px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -175px;
		margin-top: -140px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 400px;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 300px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -150px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 500px;
		height: 300px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 823px) and (orientation : portrait) {
	.subs > div {
		height: 250px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -125px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 823px) and (orientation : landscape) {
	.subs > div {
		height: 230px;
		width: 500px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -250px;
		margin-top: -115px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 90%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 600px;
		height: 300px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 1024px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 700px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 1024px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 1366px) and (orientation : landscape) {
	/*.subs > div {
			position: absolute;
			height: 200px;
  width: 800px;
  padding: 20px;
  left: 50%;
  top: 50%;
  margin-left: -400px;
  margin-top: -100px;
  
		}
		
		.subs {
  background: #;

  position: absolute;
  height: 100%;
  width: 100%;
  padding: 20px;
  left: 50%;
  top: 70%;
  margin-left: -50%;
  margin-top: -50%;

}*/
	/*about*/
	.about {
		/*background: #E6C76B;*/
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 1080px) and (orientation : portrait) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 30%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 700px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}
/* *=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=* */
@media (width: 1080px) and (orientation : landscape) {
	.subs > div {
		position: absolute;
		height: 200px;
		width: 800px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -400px;
		margin-top: -100px;
	}
	.subs {
		background: #;
		position: absolute;
		height: 100%;
		width: 100%;
		padding: 20px;
		left: 50%;
		top: 70%;
		margin-left: -50%;
		margin-top: -50%;
	}
	/*about*/
	.about {
		background: #E6C76B;
		border: 10px solid #E84E4D;
		border-radius: 20px;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 350px;
		width: 600px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -175px;
	}
	.about > button {
		background: #;
		position: absolute;
		height: 70px;
		width: 160px;
		padding: 0px;
		font-size: 30px;
		left: 50%;
		top: 100%;
		margin-left: -80px;
		margin-top: -35px;
	}
	/*port*/
	.port {
		background: #;
		border: ;
		border-radius: ;
		position: absolute;
		display: none;
		z-index: 9999;
		height: 3000px;
		width: 3000px;
		padding: 20px;
		left: 50%;
		top: 50%;
		margin-left: -1500px;
		margin-top: -1500px;
	}
	.port > div {
		width: 1000px;
		height: 500px;
		position: fixed;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		left: 50%;
		top: 50%;
		background: #;
		padding: 30px;
		z-index: 10000;
		text-align: center;
		border: ;
		border-radius: 20px;
		box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.4);
	}
}