/*-------------------------------------------------------------------------------------

  CSS definition for basic layout

-------------------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700|Roboto:300,300i,400,500&subset=latin-ext');
@font-face{
	font-family: "Born Ready Slanted W00 Regular";
	src:url("../fonts/4a855eba-83e1-40c9-bf0b-1be9f3474ec2.eot?#iefix");
	src:url("../fonts/4a855eba-83e1-40c9-bf0b-1be9f3474ec2.eot?#iefix") format("eot"),
		url("../fonts/6ecd7155-468c-4a96-b5cc-b9e2d9c9e9e2.woff2") format("woff2"),
		url("../fonts/18a6982c-f3dd-4c34-a385-d509d34f2b95.woff") format("woff"),
		url("../fonts/f0c7feba-a2fe-4249-bdab-474dc7730b56.ttf") format("truetype");
}

html {
	margin: 0;
	padding: 0;
	width: 100%;
}
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}


/*-------------------------------------------------------------------------------------
  CSS Layout
-------------------------------------------------------------------------------------*/

header,
main,
article,
section,
footer,
iframe,
#header-top,
#header-main,
.container,
.raster,
.iframe {
	float:left;
	position: relative;
	margin: 0;
	width:100%;
}
section {
	z-index: 1;
}
.inner {
    margin: 0 auto;
    width: 986px;
	height:auto;
	min-height: 10px;
}
.visually-hidden { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.mobile { display:none; }
.desktop { display:block; }
.center { text-align:center; }
.right { text-align: right; }
.white { background-color:rgb(255,255,255) !important; }
.grey { background-color:rgb(240,240,240) !important; }
.blue { background-color:rgb(0,159,227) !important; }
.darkgrey { background-color:rgb(55,55,55) !important; }
.separation { padding-top: 66px; padding-bottom: 66px; }
.content { padding-bottom: 110px; }
.clearfix { height: 1%; }
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

header {
	position: fixed;
	top:0;
	left:0;
	z-index: 100;
	-webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 3px 6px rgba(0,0,0,0.5);
	box-shadow: 0px 3px 6px rgba(0,0,0,0.5);
}
#header-top {
	height: 50px;
	background-color: rgb(0,159,227);
}
#header-top .inner {
	display: flex;
	justify-content: flex-end;
}
#header-main {
	height: 110px;
	background-color: rgb(255,255,255);
}
#header-main .inner {
	display: flex;
	justify-content: space-between;
}


#logo {
	float: left;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 146px;
	height: 110px;
}
#logo img {
	float: left;
	width: 100%;
	height: auto;
}

#nav-search {
	float: left;
	height: 50px;
	background: transparent url(../images/bg_nav-search.png) 100% 0 no-repeat;
	background-size: 50px auto;
	cursor: pointer;
}
.navMobileIcon {
	display: none;
}
/*
#nav-search:hover {
	background-position: 100% 100%;
}
*/

#slide-show {
	margin-top: 160px;
	height: calc(100vh - 160px);
}
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) {
	#slide-show { height: calc(100vh - 218px); }
}}

#main-image {
	margin-top: 160px;
	height: calc(65vh - 160px);
	background-size: cover;
	background-position: center;
}
.distance {
	margin-top: 160px;
}

.advertising {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 44px 0 66px 0;
	height: 120px;
	width: 100%;
}
.advertising img {
	float: left;
	width: 100%;
}


footer .first-row {
	float: left;
	margin: 0 -11px;
	padding: 44px 0 14px 0;
	width: calc(100% + 22px);
}
footer .second-row {
	float: left;
	padding: 11px 0 44px 0;
	width: 100%;
}
footer .line-top {
	border-top: 1px solid rgb(255,255,255);
}
footer .footer-logo img {
	float: left;
	width: 146px;
	height: auto;
}

#cookie-note {
	position: fixed;
	margin: 0 !important;
	padding: 22px 44px !important;
	left: 0 !important;
	bottom: 0 !important;
	width: calc(100% - 88px) !important;
	background-color: rgb(55,55,55) !important;
	color: rgb(255,255,255) !important;
	font-weight: 300 !important;
	text-align: center;
}

/* Images */
.imageFrame {
	display: inline-block;
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	float: left;
	background-color:rgba(0,0,0,0.05);	
	background-position:center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.imageFrame:before {
	content: "";
	display: block;
	padding-top: 70%;
}

/*-------------------------------------------------------------------------------------
  CSS DEFINITIONS FOR raster
-------------------------------------------------------------------------------------*/
.raster {
	float: left;
	display: flex;
	flex-wrap: wrap;
	margin: 0 -11px 22px -11px;
	padding: 0;
	width: calc(100% + 22px);
}
.raster .box {
	position: relative;
	float:left;
	margin:11px;
	width:calc(25% - 22px);
	height:auto;
	background-size: cover;
	background-position: center;
}
.raster .box:before {
	content: "";
	display: block;
	padding-top: 100%;
}
.raster .boxContent {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	position: absolute;
	padding: 11px;
	top:0;
	left: 0;
	width: calc(100% - 22px);
	height: calc(100% - 22px);
}



/*-------------------------------------------------------------------------------------
  CSS DEFINITIONS FOR tabs
-------------------------------------------------------------------------------------*/
ul.tabs {
	float: left;
	margin: 0 -11px;
	padding: 0;
	width: calc(100% + 22px);
	height: 50px;
}
ul.tabs li {
	float: left;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 11px;
	padding: 0;
	width: calc(33.3333% - 22px);
	height: 50px;
	cursor: pointer;
	background-color: rgb(240,240,240);
}
ul.tabs li img {
	margin-right: 10px;
	width: 18px;
	height: 18px;
}
ul.tabs li.current{
	background-color: rgb(255,255,255);
}
.tab-content {
	float: left;
	padding: 22px 0;
	width: 100%;
	display: none;
}
.tab-content.current {
	display: inherit;
	background-color: rgb(255,255,255);
}
.tab-content .separation {
	padding-top: 44px;
}


/*-------------------------------------------------------------------------------------
  CSS DEFINITIONS FOR headlines
-------------------------------------------------------------------------------------*/
.headlines {
	float: left;
	display: flex;
	flex-wrap: wrap;
	margin: 0 -11px 22px -11px;
	padding: 0;
	width: calc(100% + 22px);
}
.headlines .headline {
	position: relative;
	float:left;
	margin:11px;
	width:calc(25% - 22px);
	height:auto;
	cursor: pointer;
}
.headlines .headline .image {
	float: left;
	margin: 0 0 22px 0;
	padding: 0;
	width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.headlines .headline .image:before {
	content: "";
	display: block;
	padding-top: 100%;
}




.block,
.block_05,
.block_10,
.block_15,
.block_20,
.block_25,
.block_30,
.block_33,
.block_35,
.block_40,
.block_45,
.block_50,
.block_55,
.block_60,
.block_65,
.block_66,
.block_70,
.block_75,
.block_80,
.block_85,
.block_90,
.block_95,
.block_100 {
	float: left;
	height:auto;
}
.block {
	margin:0 -11px;
	width: calc(100% + 22px);
}
.block.half {
	margin:0 11px;
	width:calc(50% - 22px);
}
.block.third {
	margin:0 11px;
	width:calc(33.3333% - 22px);
}
.block.quarter {
	margin:0 11px;
	width:calc(25% - 22px);
}
.block.two-third {
	margin:0 11px;
	width:calc(66.6666% - 22px);
}
.block.three-quarter {
	margin:0 11px;
	width:calc(75% - 22px);
}
.block.full {
	margin:0 11px;
	width:calc(100% - 22px);
}


.block_05 { width:5%; }
.block_10 { width:10%; }
.block_15 { width:15%; }
.block_20 { width:20%; }
.block_25 { width:25%; }
.block_30 { width:30%; }
.block_33 { width:33%; }
.block_35 { width:35%; }
.block_40 { width:40%; }
.block_45 { width:45%; }
.block_50 { width:50%; }
.block_55 { width:55%; }
.block_60 { width:60%; }
.block_65 { width:65%; }
.block_66 { width:66%; }
.block_70 { width:70%; }
.block_75 { width:75%; }
.block_80 { width:80%; }
.block_85 { width:85%; }
.block_90 { width:90%; }
.block_95 { width:95%; }
.block_100 { width:100%; }