/* CSS Document */

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

/*		PANTONE

	PEMBE: #F3229B
	YEŞİL: #61C92B
	GRİ: #1A1A1A
	BEYAZ: #FFFFFF
	MAVİ: #27AAE1
*/



body {
	font-family: Montserrat, "sans-serif";
	background-image: url("../images/Lotusuzunsaydam.webp");
	width: 100%;
	height: 100vh;
	background-size: cover;
	background-position: bottom;
	background-repeat: no-repeat;
}
	
a {
	color: inherit;
	text-decoration: none; 
	display: inline-block;
}



		/* HEADER */




header {
	display: flex;
	flex-direction: row;
	gap: 10px;
	justify-content: flex-end;
	align-items: center;
	padding: 10px 10%;
}

header h4 {
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0px;
	color: #1A1A1A;
}

header a img {
	display: flex;
	align-items: center;
	border-radius: 5px;
	transition-duration: .5s;
}



		/* MAIN */



main {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8vh;
	padding: 8vh 10%;
}




		/* FİLLER */



main section.filler {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	width: 100%;	
}


main section.filler h1 {
	text-align: center;
	font-size: 50px;
	font-weight: 400;
	color: #F3229B;
	letter-spacing: 1px;
	width: 100%;
}


main section.filler h5 {
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	color: #61C92B;
	letter-spacing: 1px;
	width: 100%;
}

main section.filler p {
	padding-top: 15px;
	text-align: center;
	line-height: 1.5em;	
	width: 100%;
	color: #1A1A1A;
}



		/* WEB */



main section.web {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;	
}

main section.web h2 {
	text-align: center;
	font-size: 26px;
	font-weight: 500;
	color: #61C92B;
	letter-spacing: 1px;
}

main section.web a.btn {
	background-color: #FFFFFF;
	border-radius: 5px;
	color: #61C92B;
	font-size: 14px;
	letter-spacing: 2px;
	padding: 10px 25px;
	border: 2px solid #61C92B;
	font-weight: 500;
	transition-duration: .5s;
}

main section.web a.btn:hover {
	background-color: #61C92B;
	border-radius: 5px;
	color: #FFFFFF;
	font-size: 14px;
	letter-spacing: 2px;
	padding: 10px 25px;
	border: 2px solid #61C92B;
	font-weight: 500;
	transition-duration: .5s;
}



		/* FOOTER */




footer {
	font-size: 14px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2vh;
	padding: 10px 10%;
}

footer section.social_media {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;	
}

footer section.social_media h3 {
	text-align: center;
	font-size: 20px;
	font-weight: 500;
	color: #F3229B;
	letter-spacing: 1px;	
}

footer section.social_media div.icons {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	gap: 10px;	
}

footer section.social_media div.icons a {
	
}

footer section.social_media div.icons a img {
	width: 30px;
	height: 30px;
	transition-duration: .5s;
}

footer section.social_media div.icons a img:hover {
	transition-duration: .5s;
	border-radius: 50px;
	width: 35px;
	height: 35px;
}

footer p {
	text-align: center;
	font-size: 12px;
	font-weight: 300;
	word-spacing: 4px;
	padding-top: 30px;
	letter-spacing: 0px;
	color: #1A1A1A;
}



/* MEDIA ÇAĞIRMA */



@media screen and (max-width: 900px) {
	
	body {
	background-image: none;
	}
	
	main section.filler {
	background-image: url("../images/Lotusortasaydam.webp");
	background-position: bottom;
	}
	
	main section.web {
	flex-direction: column;
	}
}

@media screen and (max-width: 600px) {
	
	main section.web {
	display: flex;
	flex-direction: column !important;
	}
	
	body {
	background-image: none;
	}
	
	main section.filler {
	background-image: url("../images/Lotusortasaydam.webp");
	background-position: bottom;
	}
	
	main section.filler h1 {
	font-size: 40px;
	font-weight: 400;
	}
	
	main section.filler h5 {
	font-size: 12px;
	font-weight: 600;		
	}
}

@media screen and (max-width: 430px) {
	
	body {
	background-image: none;
	}
	
	main section.filler {
	background-image: url("../images/Lotusortasaydam.webp");
	background-repeat: no-repeat;
	}
}

