.top_section
{
	position: relative;
	top: 0px;
	left: 0px;

	width: 100vw;
	height: 50vh;

	margin-bottom: calc((100/768) * ((100vw + 100vh) / 2));
}

.top_section .background
{
	position: absolute;
	width: 100%;
	height: 100%;

	background-image: url('../content/backgrounds/background_main.jpg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;

	filter: blur(5px);
}

.top_section .title
{
	position: absolute;
	top: calc(50% - ((10/768) * ((100vw + 100vh) / 2)));
	left: 0px;

	width: 100vw;
	height: calc((60/768) * ((100vw + 100vh) / 2));

	text-align: center;
	color: #ffffff;
	font-family: 'Montserrat', sans-serif;
	font-size: calc((60/768) * ((100vw + 100vh) / 2));
}

.blogs
{
	position: relative;
	top: 0px;
	left: 0px;

	width: 100vw;

	margin-top: calc((50/768) * ((100vw + 100vh) / 2));
}

.blog
{
	position: relative;
	top: 0px;
	left: 0px;

	width: calc(100vw - ((100/768) * ((100vw + 100vh) / 2)));
	height: calc((200/768) * ((100vw + 100vh) / 2));
	min-height: calc(32vh - ((50/768) * ((100vw + 100vh) / 2)));

	margin: calc((25/768) * ((100vw + 100vh) / 2)) calc((50/768) * ((100vw + 100vh) / 2));

	border: 1px solid #ffffff;
}

.blog .title
{
	position: absolute;
	top: calc(50% - ((35/768) * ((100vw + 100vh) / 2)));
	left: calc((25/768) * ((100vw + 100vh) / 2));

	width: calc(100% - ((50/768) * ((100vw + 100vh) / 2)));
	height: calc((30/768) * ((100vw + 100vh) / 2));

	text-align: left;
	color: #ffffff;
	font-family: 'Comfortaa', cursive;
	font-size: calc((30/768) * ((100vw + 100vh) / 2));

	z-index: 3;
}

.blog .author
{
	position: absolute;
	bottom: calc((25/768) * ((100vw + 100vh) / 2));
	left: calc((25/768) * ((100vw + 100vh) / 2));

	width: calc(100% - ((50/768) * ((100vw + 100vh) / 2)));
	height: calc((15/768) * ((100vw + 100vh) / 2));

	text-align: left;
	color: #aaaaaa;
	font-family: 'Muli', sans-serif;
	font-size: calc((15/768) * ((100vw + 100vh) / 2));

	z-index: 3;
}

.blog .image
{
	position: absolute;
	top: 0px;
	right: 0px;

	width: 100%;
	height: 100%;

	background-image: url('../content/backgrounds/background_main.jpg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;

	z-index: 1;
}

.blog .overlay
{
	position: absolute;
	top: 0px;
	right: 0px;

	width: 100%;
	height: 100%;

	background-color: #000000;
	opacity: 0.7;

	z-index: 2;
}

.footer
{
	top: calc((40/768) * ((100vw + 100vh) / 2));
}

.loader .drone
{
	background-image: url('../content/images/drone_cross.svg');
}

.blogfooter
{
	position: relative;
	top: calc((50/768) * ((100vw + 100vh) / 2));
	left: 0px;

	width: 80%;

	margin: calc((25/768) * ((100vw + 100vh) / 2)) 10%;
	padding: calc((50/768) * ((100vw + 100vh) / 2));

	font-size: calc((12/768) * ((100vw + 100vh) / 2));
	font-family: 'Raleway', sans-serif;
	text-align: center;
	color: #ffffff;
	line-height: calc((18/768) * ((100vw + 100vh) / 2));

	border-top: calc((1/768) * ((100vw + 100vh) / 2)) solid #dddddd;
	border-bottom: calc((1/768) * ((100vw + 100vh) / 2)) solid #dddddd;
}

.blogfooter a
{
	cursor: pointer;
	text-decoration: underline;
	color: #ffffff;
}

.blogfooter a:hover
{
	color: #e8b01e;
}

#subscribeform input
{
	position: relative;
	top: 0px;
	left: 0px;

	width: 80%;

	color: #ffffff;
	font-size: calc((15/768) * ((100vw + 100vh) / 2));
	font-family: 'Muli', sans-serif;
	border: calc((1/768) * ((100vw + 100vh) / 2)) solid #c0c4c4;

	margin-bottom: calc((20/768) * ((100vw + 100vh) / 2));
	padding: calc((5/768) * ((100vw + 100vh) / 2)) calc((10/768) * ((100vw + 100vh) / 2));
	border-radius: calc((10/768) * ((100vw + 100vh) / 2));
	background-color: transparent;
}

@media only screen and (min-width: 576px) {
	.blog .image
	{
		width: 62%;
	}

	.blog .overlay
	{
		visibility: hidden;
	}

	.blog.alt .title
	{
		text-align: right;
	}

	.blog.alt .author
	{
		text-align: right;
	}

	.blog.alt .image
	{
		position: absolute;
		top: 0px;
		left: 0px;
	}
}
