/* ---------------------- Font ---------------------- */

@font-face {
	font-family: "DIN Next Light";
	src: url("/font/DIN Next Light.woff");
}

.font-din {
	font-family: "DIN Next Light";
}

/* -------------------- General -------------------- */

.title, .subtitle, .label {
	color: #fff;
}

/*.icon {
	color: #fff;
}*/

/* -------------------- Background -------------------- */
.cover {
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center;
}

/* --------------------- Sections --------------------- */

.wrapper {
	padding: 4em 4em 6em;
}
@media screen and (max-width: 480px) {
	.wrapper {
		padding: 4em 1em 6em;
	}
}
@media screen and (min-width: 481px) and (max-width: 768px) {
	.wrapper {
		padding: 4em 2em 6em;
	}
}
@media screen and (min-width: 769px) and (max-width: 1023px) {
	.wrapper {
		padding: 4em 3em 6em;
	}
}
@media screen and (min-width: 1024px) and (max-width: 1215px) {
	.wrapper {
		padding: 4em 3em 6em;
	}
}

.box {
	background: rgba(0, 0, 0, 0.5);
	margin: 5em 20em;
	overflow: hidden;
	padding: 4em;
}
@media screen and (max-width: 480px) {
	.box {
		padding: 1em;
		margin: 2em 0;
	}
}
@media screen and (min-width: 481px) and (max-width: 768px) {
	.box {
		padding: 2em;
		margin: 2em 5em;
	}
}
@media screen and (min-width: 769px) and (max-width: 1023px) {
	.box {
		padding: 3em;
		margin: 5em 5em;
	}
}
@media screen and (min-width: 1024px) and (max-width: 1215px) {
	.box {
		padding: 3em;
		margin: 5em 10em;
	}
}

a.box, a.box {
	transition: 1s;
}
a.box:focus, a.box:hover {
	box-shadow: 0 2px 3px rgb(10 10 10 / 10%), 0 0 0 2px #ffffff;
	background-color: rgb(0 0 0 / 80%);
}

/* --------------------- Scrollbar --------------------- */

::-webkit-scrollbar {
	width: 10px;
}

::-webkit-scrollbar-track {
	background: #f1f1f1; 
}

::-webkit-scrollbar-thumb {
	background: #00000080; 
}

/* --------------------- Button Up --------------------- */

#scroll_to_top{
	display: none;
	position: fixed;
	bottom: 3%;
	right: 30px;
	z-index: 99;
	font-size: 18px;
	border: none;
	outline: none;
	background-color: rgba(0, 0, 0, 0);
	color: rgba(255, 255, 255, 0.8);
	cursor: pointer;
	padding: 5px;
	border-radius: 4px;
}

#scroll_to_top button {
	width: 25px;
}

#scroll_to_top:hover {
	color: rgba(255, 255, 255, 1);
}

.i-scroll-to-top {
	border-radius: 25px;
	transition: 0.8s;
}

.i-scroll-to-top:hover {
	color: rgba(255, 255, 255, 1);
	border: solid rgba(0, 0, 0, 0.8) 3px;
}