/*	---------------------------------------------------------------------------------------------------
	Copyright (C) 2002 - Main_2021 movingline | www.movingline.de | info@movingline.de
	---------------------------------------------------------------------------------------------------*/

/*	----------------------------------------------------------------------------------------------------------------------------
	CSS RESET
	---------------------------------------------------------------------------------------------------------------------------- */
	html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big,
	cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd,
	ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details,
	embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font-family: arial, tahoma, verdana, sans-serif;font-weight: normal;text-decoration: none;outline-style: none;font: inherit;vertical-align: baseline; }
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{ display: block; }
	body{ line-height: 1; }
	ol, ul{ list-style: none; }
	blockquote, q{ quotes: none; }
	blockquote:before, blockquote:after, q:before, q:after{ content: ''; content: none; }
	table{ border-collapse: collapse; border-spacing: 0; }
	figure img {display: block;}
	.invisible{display: none;}

/*	----------------------------------------------------------------------------------------------------------------------------
	GLOBALS
	---------------------------------------------------------------------------------------------------------------------------- */

	body{
		background-color: #f1f1f1;
		text-transform: none;
		overflow-y: scroll;
	}

	body,
	html{
		height: 100%;
	}

	#wrapper{
		display: block !important;
		position: relative;
		height: 100%;
		min-height: 100%;
		z-index: 1;
		cursor: url('../img/loader.svg'), auto;
	}

	.inner{
		position: relative;
		width: 90%;
		max-width: 1200px;
		margin: 0 auto;
	}


/*	----------------------------------------------------------------------------------------------------------------------------
	STUCTURES
	---------------------------------------------------------------------------------------------------------------------------- */

	#main{
		position: relative;
		min-height: calc(100vh - 280px);
		padding-top: 200px;
		background-color: #ffffff;
		transition: all 0.2s ease 0s;
		z-index: 0;
	}

	@media only screen and (max-width: 1050px){
		#main{
			min-height: calc(100vh - 230px);
			padding-top: 150px;
		}
	}

	@media only screen and (max-width: 900px){
		#main{
			min-height: calc(100vh - 180px);
			padding-top: 100px;
		}
	}

	#main::before{
		content: '';
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: 100%;
		background-image: url("../img/bg_start.jpg");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		z-index: -1;

		animation: fadeIn 1s linear forwards 1;
	}

	#papierlos #main::before{
		background-image: url("../img/bg_papierlos.jpg");
	}

	#vita #main::before{
		background-image: url("../img/bg_vita.jpg");
	}

	#kontakt #main::before{
		background-image: url("../img/bg_kontakt.jpg");
	}

	#impressum #main::before{
		background-image: none;
	}

	#datenschutz #main::before{
		background-image: none;
	}

	@keyframes fadeIn {
	    from {
	        opacity: 0;
	    }
	    to {
	        opacity: 1;
	    }
	}

	#main .content{
		padding: 12vh 0;
	}

/*	----------------------------------------------------------------------------------------------------------------------------
	COLUMN
	---------------------------------------------------------------------------------------------------------------------------- */

	.col{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}

	.col_item{
		flex: 1;
		position: relative;
		margin: 1%;
		background-color: #ffffff;
		box-shadow: 0px 10px 30px 0px rgba(0,0,0,0.1);
		box-sizing: border-box;
	}

	.c1 .col_item{flex: 0 0 98%;}
	.c2 .col_item{flex: 0 0 48%;}
	.c3 .col_item{flex: 0 0 31.33333333333%;}

	.col_inner{
		padding: 60px 40px;
	}

	.flex2{
		flex: 1.5;
	}

/*	----------------------------------------------------------------------------------------------------------------------------
	IMPRINT
	---------------------------------------------------------------------------------------------------------------------------- */

	.box{
		margin-bottom: 30px;
		padding: 60px;
		background-color: #f1f1f1;
		border-radius: 6px;
	}

/*	----------------------------------------------------------------------------------------------------------------------------
	CONTENT
	---------------------------------------------------------------------------------------------------------------------------- */

	#kontakt p{
		white-space: nowrap;
	}


	@media only screen and (max-width: 400px){
		#kontakt p{
			white-space:normal;
		}
	}

	#vita .member{
		float: right;
		width: 200px;
		margin-left: 30px;
		margin-bottom: 20px;
		height: auto;
	}

	@media only screen and (max-width: 600px){
		#vita .member{
			float: right;
			width: 100%;
			margin-left: 0px;
			margin-bottom: 20px;
			height: auto;
		}
	}


/*	----------------------------------------------------------------------------------------------------------------------------
	Video
	---------------------------------------------------------------------------------------------------------------------------- */

	.video img{
		display: block;
    	margin: 0 auto;
		width: 50%;
		height: auto;
		border: 5px solid #C7A980;
	}

	@media only screen and (max-width: 600px){
		.video img{
			width: 100%;
		}
	}

/*	----------------------------------------------------------------------------------------------------------------------------
	PRELOADER
	---------------------------------------------------------------------------------------------------------------------------- */

	.changeOverlay{
		position: relative;
		z-index: 4000;
	}

	.changeOverlay .layer1{
		position: fixed;
		top: 0;
		bottom: 0;
		right: 0;
		height: 100%;
		width: 100%;
		background-color: #C7A980;
		overflow: hidden;
		z-index: 5;
		transition: all 0.4s ease 0s;
	}

	.changeOverlay .layer1.click_in{
		right: 0;
		width: 100%;
		background-color: #C7A980;
	}

	.changeOverlay .layer1.click_open{
		right: 0;
		width: 100%;
	}

	.changeOverlay .layer1.click_out{
		right: auto;
		left: 0;
		width: 0%;
	}

/*	----------------------------------------------------------------------------------------------------------------------------
	FOOTER
	---------------------------------------------------------------------------------------------------------------------------- */

	#footer{
		position: relative;
		height: 80px;
		background-color: #373E5F;

		font-family: "Arial", "Verdana", "Sans-Serif";
		font-weight: normal;
		font-size: 12px;
		color: #c7a980;
		z-index: 1;
	}

	#footer .nav_footer{
		float: left;
	}

	#footer .nav_footer li{
		float: left;
		margin-right: 30px;
	}

	#footer .nav_footer li a{
		display: block;
		line-height: 80px;
		color: #c7a980;
	}

	#footer .nav_footer_socials{
		float: right;
	}

	#footer .nav_footer_socials li{
		float: left;
	}

	#footer .nav_footer_socials li.facebook a{
		display: block;
		height: 80px;
		width: 80px;
		text-indent: -9999px;
		background-image: url("../img/socials_facebook.svg");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 100%;
		margin-left: 30px;
	}

	#footer .nav_footer_socials li.bbh{
		display: block;
		height: 80px;
		width: 80px;
		text-indent: -9999px;
		background-image: url("../img/bbh.svg");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 60%;
		margin-left: 30px;
	}








	/* END */