@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600&display=swap&subset=latin-ext');

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	width: 100%;
	height: 100%;
}

body {
	width: 100%;
	height: 100%;
	font-size: 1.2em;
	font-weight: 300;
	font-family: 'Oswald', sans-serif;
}

h1, h2 {
	font-weight: 600;
}

h3, h4 {
	color: #FFF;
	font-weight: 500;
}

h5, h6 {
	color: #FFF;
	font-weight: 400;
}

h1 {
	color: #FFF;
	font-size: 3.8em;
}

h2 {
	color: #111;
	font-size: 2.6em;
	padding: 20px 0;
}

h3 {
	font-size: 2em;
}

h4 {
	padding: 10px 0;
	font-size: 1.5em;
}

h5 {
	font-size: 1.8em;
}

h6 {
	font-size: 1.4em;
	padding: 10px 0;
}

.navbar {
	padding: 30px 50px;
}

	.navbar.scrolled {
		padding: 10px 50px;
		background-color: #000 !important;
		-webkit-transition: background-color 200ms linear;
		-moz-transition: background-color 200ms linear;
		-ms-transition: background-color 200ms linear;
		-o-transition: background-color 200ms linear;
		transition: background-color 200ms linear;
	}

	.navbar .navbar-brand {
		float: left;
		width: 200px;
	}

		.navbar .navbar-brand img {
			width: 100%;
		}

		.navbar .navbar-brand.scrolled img {
			width: 80%;
		}

	.navbar .navbar-right {
		line-height: 24px;
		vertical-align: middle;
	}

		.navbar .navbar-right a {
			color: #fff;
			text-decoration: none;
		}

		.navbar .navbar-right i {
			color: #FECC18;
			font-size: 1.2em;
			font-weight: 400;
		}

	.navbar .navbar-nav {
		width: 50%;
		margin: auto;
	}

		.navbar .navbar-nav .nav-item {
			font-weight: 500;
			letter-spacing: 2px;
			text-decoration: none;
		}

			.navbar .navbar-nav .nav-item .nav-link {
				color: #fff;
				padding: 1em 2em;
			}

				.navbar .navbar-nav .nav-item .nav-link:hover {
					color: #fecc18;
				}

.banner {
	height: 100vh;
	background-image: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../images/banner2.jpg');
	background-position: center;
	background-repeat: no-repeat;
	-ms-background-size: cover;
	background-size: cover;
}

	.banner .text {
		top: 50%;
		position: absolute;
		-webkit-transform: perspective(1px) translateY(-50%);
		-moz-transform: perspective(1px) translateY(-50%);
		-ms-transform: perspective(1px) translateY(-50%);
		-o-transform: perspective(1px) translateY(-50%);
		transform: perspective(1px) translateY(-50%);
	}

	.banner .text-alt {
		top: 90%;
		width: 90%;
		color: #AAA;
		position: absolute;
	}

		.banner .text-alt a {
			color: #BBB;
			font-size: 3em;
			font-weight: 700;
			text-decoration: none;
		}

			.banner .text-alt a:hover {
				color: #FECC18;
			}

.content {
	padding: 70px 100px;
}

	.content h4 {
		margin-top: -1.5em;
	}

	.content i {
		z-index: 1;
		color: #fff;
		font-size: 5em;
		line-height: 1em;
		-ms-opacity: 0.2;
		opacity: 0.2;
	}

	.content p {
		padding: 20px 0;
	}

.content2 {
	padding: 70px 10px;
}

	.content2 img {
		max-height: 24em;
	}

	.content2 p {
		text-align: justify;
	}

	.content2 iframe {
		width: 100%;
		height: 340px;
		border: 1px solid #DDD;
	}

.inner {
	height: 31rem;
	padding: 160px 0;
	background-image: url('../images/inner.jpg');
	background-position: center;
	background-repeat: no-repeat;
	-ms-background-size: cover;
	background-size: cover;
}

	.inner a {
		color: #FECC18;
		font-size: 3em;
		font-weight: 500;
		text-decoration: none;
	}

.content .price {
	margin-top: 30px;
	font-size: 1.6em;
	font-weight: 700;
}

	.content .price .header {
		color: #FFF;
		padding: 20px 0;
		background-color: #000;
	}

	.content .price .title {
		padding: 40px 0;
		background-color: #FECC18;
	}

.footer {
	padding: 6rem;
	background-color: #171717;
}

	.footer a {
		color: #000;
		margin: 0 4px;
		font-size: 1.2em;
		padding: 16px 18px;
		text-align: center;
		background: #FECC18;
		text-decoration: none;
	}

		.footer a:hover {
			color: #FFF;
			text-decoration: none;
		}

	.footer p {
		color: #A3A4A6;
	}

	.footer .fa {
		-ms-border-radius: 50%;
		border-radius: 50%;
	}

.teknoden {
	color: #BBB;
	font-size: .9em;
	padding: 30px 0;
	background-color: #000;
	border-top: 1px solid #444;
}

	.teknoden a {
		color: #BBB;
		text-decoration: none;
	}

		.teknoden a:hover {
			color: #5180BF;
			text-decoration: none;
		}