/* GLOBAL START */
:root {
	--dik-blue: #0BAFFD;
	--dik-secondary: #f0f0f0;
	--dik-tertiary: #cecece;
}

.scrollbar-measure {
	width: 100px;
	height: 100px;
	overflow: scroll;
	position: absolute;
	top: -9999px;
}

.freeprivacypolicy-com---nb-simple {
	left: 0 !important;
	right: auto !important;

	font-family: "Work Sans", sans-serif !important;
}

.freeprivacypolicy-com---nb-simple button {
	background-color: var(--dik-blue) !important;
	color: #ffffff !important;
}
/* GLOBAL END */

/* GLOBAL ELEMENTS START */
main { min-height: 400px; }
img { width: 100%; }
ul { list-style-type: none; }
p { font-size: 1.3rem; }

.img-inline {
	width: unset;
	display: inline-block;
}

@media (max-width: 991.98px) {
	main > .container, .wave > .container {
		padding: 0 30px;
	}
}

.dik-container {
	width: 100%;
}
/* GLOBAL ELEMENTS END */

/* FONT CONTROL START */
body {
	font-family: "Work Sans", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	color: #000000;
}

a {
	text-decoration: none;
	color: #000000;
}

.text-medium {
	color: #000000;
	text-transform: uppercase;
	font-weight: 700;
}

.text-big {
	color: #000000;
	text-transform: uppercase;
	font-weight: 700;
}

.text-giant {
	color: #000000;
	text-transform: uppercase;
	font-weight: 700;
}

.text-blue { color: var(--dik-blue); }
.text-black { color: #000000; }
.text-white { color: #ffffff; }

.fw-100 { font-weight: 100; }
.fw-300 { font-weight: 300; }
.fw-400 { font-weight: 400; }
.fw-500 { font-weight: 500; }
.fw-700 { font-weight: 700; }
.fw-900 { font-weight: 900; }

/* Small */
@media (max-width: 991.98px) {
	.text-medium {
		font-size: 2rem;
		line-height: 2rem;
	}

	.text-big {
		font-size: 3rem;
		line-height: 2.5rem;
	}

	.text-giant {
		font-size: 5rem;
		line-height: 2rem;
	}
}

/* Big */
@media (min-width: 992px) {
	.text-medium {
		font-size: 3rem;
		line-height: 3rem;
	}
	
	.text-big {
		font-size: 5rem;
		line-height: 5rem;
	}

	.text-giant {
		font-size: 8rem;
		line-height: 7rem;
	}
}
/* FONT CONTROL END */

/* MODIFIERS START */
.bg-grid {
	background-image: url('/assets/img/gridfade.png');
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	background-size: 100%;
}

.bg-left { background-position-x: left; }
.bg-right { background-position-x: right; }
.bg-center { background-position-x: center; }
.bg-top { background-position-y: top; }
.bg-bottom { background-position-y: bottom; }
.bg-middle { background-position-y: center; }
.bg-25 { background-size: 25%; }
.bg-33 { background-size: 33%; }
.bg-50 { background-size: 50%; }
.bg-75 { background-size: 75%; }
.bg-100 { background-size: 100%; }

.row-contact { margin: 8rem 0; }

@media (max-width: 765.98px) {
	.row-contact { margin: 4rem 0 5rem 0; }
}
/* MODIFIERS END */

/* DIK BTN START */
.btn-dik {
	box-shadow: -2px 3px 0px 4px #000000;
	background-color: #ffffff;
	border-radius: 7px;
	border: 1px solid #000000;
	display: inline-block;
	cursor: pointer;
	color: #000000;
	font-size: 1.5rem;
	font-weight: 900;
	padding: 5px 10px;
	text-decoration: none;
	text-transform: uppercase;
}

.btn-dik:hover {
	transform: scale(1.01);
	background: #ffffff;
}

.btn-dik:active {
	position: relative;
	top: 1px;
	background: #ffffff !important;
}

.socialbtn {
	box-shadow: -3px 3px 0px 4px #000000;
	background-color: #ffffff;
	border-radius: 24px;
	border: 3px solid #000000;
	display: inline-block;
	cursor: pointer;
	color: var(--dik-blue);
	text-decoration: none;
	padding: 1rem;
	margin: 1rem;
}

.socialbtn img {
	width: 4rem;
}

@media (max-width: 991.98px) {
	.socialbtn {
		box-shadow: -2px 2px 0px 2px #000000;
	}

	.socialbtn img {
		width: 2rem;
	}
}

@media (max-width: 765.98px) {
	.socialbtn {
		box-shadow: -2px 2px 0px 2px #000000;
		margin: 0.5rem;
	}

	.socialbtn img {
		width: 2rem;
	}
}
/* DIK BTN END */

/* DESIGN START */
.glow {
	box-shadow: 0px -50px 100px 0 rgba(11, 175, 253, 0.5);
}

.wave {
	background-color: var(--dik-blue);
	padding-bottom: 3rem;
}

.wave-top, .wave-bottom {
	width: 100%;
	height: 100px;
	display: block;
	background-repeat: no-repeat;
	background-position-y: bottom;
	background-size: cover;
	background-size: 100% 100%;
}

.wave-top {
	background-image: url('/assets/img/wave-top.png');
}

.wave-bottom {
	background-image: url('/assets/img/wave-bot.png');
}

@media (max-width: 991.98px) {
	/* SMALL */
	.wave-top, .wave-bottom {
		height: 50px;
	}

	.wave {
		padding-bottom: 1rem;
	}
}

.dik-box {
	border: 3px solid black;
	border-radius: 10px;
	color: #000000;
	box-shadow: -3px 5px 0px 3px #000000;
	background-color: #ffffff;
	padding: 20px;
}

.dik-box h3 {
	text-transform: uppercase;
	font-weight: bold;
	font-size: 3rem;
	margin: 20px 0 30px 0;
}

.dik-box .btn {
	margin: 10px 0 20px 0;
}

.project-wrapper {
	background-color: white;
	background-image: url('/assets/img/gridfade.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-position-y: bottom;
}

.project-img {
	border-radius: 10px;
	aspect-ratio: 1/1;
	object-fit: cover;
}

.project-text {
	margin-bottom: 2rem;
}

.project-logo {
	margin: 1rem 0;
	aspect-ratio: 4/1;
	object-fit: contain;
}

.project-title {
	display: block;
	font-weight: 900;
	white-space: nowrap;
}

.row-socials {
	margin: 8rem 0;
}

.row-followers-top {
	margin-top: 7rem;
	margin-bottom: 5rem;
}

.row-followers-counter {
	margin-bottom: 6rem;
}

.socials-text {
	padding-top: 1.5rem;
	text-align: center;
}

@media (min-width: 992px) {
	/* BIG */
	.project-title {
		font-size: 2.2rem;
		margin: 15px 0;
	}

	.project-text {
		font-size: 1.1rem;
	}
}

@media (max-width: 991.98px) {
	/* SMALL */
	.project-title {
		font-size: 3rem;
		margin: 15px 0;
	}

	.project-text {
		font-size: 1.1rem;
	}

	.row-socials {
		margin: 6rem 0 7rem 0;
	}
}

@media (max-width: 765.98px) {
	/* MINI */
	.project-title {
		font-size: 2rem;
		margin: 15px 0;
	}
}

.dik-box-topper {
	height: 15px;
	background: var(--dik-blue);
	border-bottom: 2px solid black;
	border-radius: 5px 5px 0 0;
}
/* DESIGN END */

/* NAVBAR START */
.navbar {
	width: 100%;
	height: 140px;
	display: block;
	position: absolute;
	background-image: url('/assets/img/wave-nav.png');
	background-repeat: no-repeat;
	background-position-y: bottom;
	background-size: cover;
	background-size: 100% 100%;
	z-index: 999;
}

.navbar-solid {
	position: relative;
}

.nav-link {
	font-size: 1.8rem;
	font-weight: 900;
	color: white;
	text-transform: uppercase;
}

.nav-link:hover, .nav-link:focus {
	color: #ffffff;
	transform: scale(1.05);
}

.nav-link:active {
	color: #ffffff;
}

.nav-logo {
	width: unset;
	height: 75%;
	position: absolute;
	top: 12.5%;
}

@media (min-width: 992px) {
	/* BIG */
	.navbar-collapse {
		height: 100px;
	}

	.nav-link {
		margin-left: 35px;
	}

	.navbar .btn-dik {
		margin-left: 35px;
	}
}

@media (max-width: 991.98px) {
	/* MOBILE */
	.navbar {
		height: 70px;
	}

	.nav-item {
		text-align: center;
	}

	.nav-item .btn {
		margin-top: 5px;
		font-size: 2rem;
	}

	.navbar-nav {
		padding-top: 25%;
	}

	.nav-link {
		display: inline-block;
		font-size: 2.5rem;
	}

	.nav-link:hover, .nav-link:focus {
		transform: none !important;
	}

	.navbar-toggler, .navbar-toggler:focus {
		border: none;
		box-shadow: none;
		color: white;
		font-size: 2rem;
		z-index: 9999;
	}

	.navbar-collapse {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background: var(--dik-blue);
		z-index: 999;
	}

	.navbar .collapsing {
		height: 0;
		overflow: hidden;
		transition: none;
	}
}
/* NAVBAR END */

/* HEADER START */
.header-carousel {
	width: 100%;
	padding: 0;
}

.header-carousel img {
	aspect-ratio: 16/7;
	object-fit: cover;
	min-height: 350px;
}

.header-showreel {
	width: 100%;
	padding: 0;
	aspect-ratio: 16/7;
}

.header-showreel video {
	min-height: 350px;
	object-fit: cover;
	width: 100%;
	height: 100%;
	margin-top: 2rem;
}
/* HEADER END */

/* BRAND SLIDER START */
.marquee {
	width: 100%;
	pointer-events: none;
	overflow: hidden;
	border-radius: 6px;
	padding: 5px 0;
}

.marquee-wrap {
	height: 100%;
	width: 100%;
}

.brands-img {
	height: 50px;
	margin-right: 90px;
	display: inline-block;
}

.marquee-inner {
	height: 100%;
	width: fit-content;
	align-items: center;
	display: flex;
	position: relative;
	animation: marquee 180s linear infinite;
	will-change: transform;
}

@media (max-width: 991.98px) {
	/* MOBILE */
	.brands-img {
		height: 30px;
		margin-right: 20px;
	}

	.marquee-inner {
		animation: marquee 90s linear infinite;
	}
}

.brand-container {
	top: -30px;
	z-index: 99;
	position: relative;
}

@keyframes marquee {
	to {
		transform: translateX(-50%);
	}
}
/* BRAND SLIDER END */

/* FOOTER START */
footer {
	background-color: var(--dik-blue);
}

footer .col {
	padding: 0 30px
}

.footerlogo {
	width: 75%;
	margin: auto;
	display: block;
}

footer h3 {
	font-size: 3rem;
	text-transform: uppercase;
	color: #ffffff;
	font-weight: bold;
	margin-bottom: 20px;
}

footer ul {
	padding-left: 0;
}

footer li a, footer p {
	font-size: 1.5rem;
}

footer small {
	color: #ffffff;
	font-size: 0.7rem;
	line-height: 1rem;
	display: inline-block;
}

footer small a {
	color: #ffffff;
}

@media (max-width: 991.98px) {
	footer h3 {
		font-size: 2rem;
		margin-bottom: 10px;
	}

	footer li a, footer p {
		font-size: 1.2rem;
	}
}

@media (max-width: 767.98px) {
	footer h3 {
		font-size: 1.5rem;
		margin-bottom: 10px;
	}

	footer li a, footer p {
		font-size: 0.8rem;
	}

	footer small {
		font-size: 0.5rem;
		line-height: 0.7rem;
	}
}
/* FOOTER END */

/* FORMS START */
.form-control {
	background-color: #f9f9f9;
	border: 1px solid #d3d3d3;
	padding: 15px;
}

.form-control::placeholder {
	color: #cccccc;
}

.form-group {
	margin-bottom: 10px;
}
/* FORMS END */