@font-face {
	src: url("../fonts/nunitosans-bold.woff2") format("woff2");
	font-family: "NunitoSans-TL";
	font-weight: 700;
	font-style: normal;
}

@font-face {
	src: url("../fonts/nunitosans-semibold.woff2") format("woff2");
	font-family: "NunitoSans-TL";
	font-weight: 600;
	font-style: normal;
}

@font-face {
	src: url("../fonts/nunitosans-regular.woff2") format("woff2");
	font-family: "NunitoSans-TL";
	font-weight: 400;
	font-style: normal;
}

:root {
	--black: #121212;
	--white: #FFFFFF;
	--light-gray: #D9D9D9;
	--gray: #9C9C9C;
	--green: #42A258;
	--juicy-green: #48D33B;
	--ultramarine: #533FD7;
	--blue: #0295FF;
	--azure: #22E4FF;
	--turquoise: #21EBC7;
	--pink: #FF027C;
	--font-family: NunitoSans-TL, sans-serif;
	--systemfont: -apple-system, BlinkMacSystemFont, Arial, sans-serif;
	--font-size: 18px;
	--line-height: 1.4em;
	--font-weight: 400;
	--bounce-transition: .45s cubic-bezier(.17,.67,.3,1.33);
	--slow-bounce-transition: 1.5s cubic-bezier(.17,.67,.3,1.33);
	--default-transition: .3s ease-in-out;
	--border-radius: 12px;
	--box-shadow: 0px 2px 30px rgba(115, 134, 152, 0.2);
	--xxl: 60px;
	--xl: 48px;
	--l: 36px;
	--m: 24px;
	--s: 12px;
}

::selection {
	background-color: var(--ultramarine);
	color: var(--white);
}

* {
	margin: 0;
	padding: 0;
}

html,
body {
	height: 100%;
}

body {
	font-family: var(--font-family);
	font-size: var(--font-size);
	line-height: var(--line-height);
	font-weight: var(--font-weight);
	color: var(--black);
	background-color: var(--white);
	position: relative;
	overflow-x: hidden;
	z-index: 1;
}

h1, h2, h3, h4, h5, h6 {
	margin-bottom: 0;
}

.effect {
	transition: all .75s cubic-bezier(.2, .6, 0, 1);
}

.effect_scale {
	transform: scale(.94);
}

.wrapper {
	position: relative;
	z-index: 1;
	min-height: 100%;
	display: flex;
	flex-direction: column;
	overflow-x: hidden;
}

.main {
	flex: 1 1 auto;
}

.container {
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 1400px;
}

.title {
	font-weight: 700;
	font-size: 52px;
}

.subtitle {
	font-size: 42px;
	font-weight: 600;
}

.acc-text {
	font-size: 20px;
	font-weight: 600;
}

@media screen and (max-width : 1600px) {
	.container {
		max-width: 1300px;
	}

	.title {
		font-size: 48px;
	}

	.subtitle {
		font-size: 38px;
	}
}

@media (max-width : 1400px) {
	.container {
		max-width: 1100px;
	}
}

@media (max-width : 1199px) {
	.container {
		max-width: 900px;
	}

	.title {
		font-size: 40px;
	}

	.subtitle {
		font-size: 30px;
	}
}

@media (max-width : 992px) {
	.container {
		max-width: 700px;
	}
}

@media (max-width : 768px) {
	.container {
		max-width: 500px;
	}
}

@media (max-width : 576px) {
	:root {
		--font-size: 14px;
	}

	.container {
		max-width: 100%;
		padding-left: var(--m);
		padding-right: var(--m);
	}

	.title {
		font-size: 30px;
	}

	.subtitle {
		font-size: 26px;
	}

	.acc-text {
		font-size: 18px;
	}
}