/*______________________________________*/
/*										*/
/* Copyright 2019 by Daniel Friedrich	*/
/*______________________________________*/
/*										*/
/* web: www.slideandscroll.com			*/
/*______________________________________*/
/*										*/
/* author: Daniel Friedrich				*/
/*______________________________________*/


/*TABLE OF CONTENTS

I. general

II. screen and projection
01 - global
02 - header
03 - main
04 - footer
05 - sidebar

III. screen and (max-width: 959px)
01 - global
02 - header
03 - main
04 - footer
05 - sidebar

IV. screen and (max-width: 639px)
01 - global
02 - header
03 - main
04 - footer
05 - sidebar

V. print
01 - global
02 - header
03 - main
04 - footer
05 - sidebar
*/

/*______________________________________*/
/*										*/
/* I. general							*/
/*______________________________________*/
*[irrelevant=true]
{
	display: none;
}
*[irrelevant=false]
{
	display: inherit;
}

div.floatClear
{
	width: 100%;
	height: auto;
	clear: both;
}
span.sns
{
	font-family:'Yanone Kaffeesatz';
	color: rgb(97,97,97);
}
p.sLetter
{
	font-family: Courier, monospace;
	font-size: 11px;
	letter-spacing: 0.1em
}
a.link
{
	color: rgb(97,97,97);
	text-decoration: none;
}
a.link:hover,
a.link:focus
{
	color: rgb(47,47,47);
	text-decoration: underline;
}
a.link:active
{
	color: rgb(191,191,191);
	text-decoration: underline;
}













html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6
{
	-webkit-text-size-adjust: none;
}
body
{
	width: 100%;
	font-family: 'Roboto', Arial, sans-serif;
	color: rgb(47,47,47);
}
div#main
{
	width: 100%;
	height: auto;
	position: relative;
}
div#background
{
	width: 100%;
	height: auto;
	position: absolute;
	z-index: 3;
	background-color: rgb(47,47,47);
}
div#background-video
{
	width: 100%;
	height: auto;
	position: fixed;
}
div#video
{
	width: 100%;
	height: auto;
	top: 0px;
	left: 0px;
	position: absolute;
	z-index: 1;
}
div#overlay
{
	width: 100%;
	height: 100%;
	position:	absolute;
	background-image: url('images/Overlay-8.png');
	background-position: left top;
	background-repeat: repeat;
	z-index: 2;
}
div#background-video video,
div#background-video img
{
	width: 100%;
	height: auto;
	position: absolute;
}



/*______________________________________*/
/*										*/
/* III. screen and projection			*/
/*______________________________________*/

/* 01 - global							*/
.unnecessary_1280
{
	display: none;
}
div#wrapper
{
	width: 100%;
	height: auto;
	position: absolute;
	z-index: 4;
}

/* 02 - header							*/
div#header
{
	width: 100%;
	height: auto;
	position: fixed;
	z-index: 7;
	background-color: rgb(255,255,255);
}
div#headerInner
{
	width: 80%;
	height: auto;
	margin: auto;
}

img#logo
{
	width: auto;
	height: 58px;
	margin: 16px 0px 16px 0px;
}

/* 03 - main							*/
div#content
{
	width: 100%;
	height: auto;
	z-index: 5;
}
div#contentInner
{
	width: 80%;
	height: 970px;
	padding: 86px 0px 0px 0px;
	margin: auto;
}
div#contentInnerLeft
{
	width: 60%;
	height: 100%;
	position: relative;
	float: left;
}
div#contentInnerLeft div
{
	width: auto;
	height: auto;
	position: absolute;
	top: 50px;
	left: 0px;
	padding: 5px 5px 5px 5px;
	background-color: rgb(255,255,255);
	opacity: 0.5;
	font-size: 32px;
}
div#contentInnerRight
{
	width: 40%;
	height: 100%;
	position: relative;
	float: right;
}
div#contentInnerRight div
{
	width: auto;
	height: auto;
	position: absolute;
	bottom: 50px;
	right: 0px;
	padding: 5px 5px 5px 5px;
	background-color: rgb(255,255,255);
	opacity: 0.5;
	line-height: 1.1em;
}

/* 04 - footer							*/
div#footer
{
	width: 100%;
	height: auto;
	z-index: 6;
	background-color: rgb(255,255,255);
}
div#footerInner
{
	width: 80%;
	height: auto;
	padding: 12px 0px 12px 0px;
	margin: auto;
	font-size: 14px;
	text-align: right;
}

/* 05 - sidebar							*/



/*______________________________________*/
/*										*/
/* III. screen and (max-width: 1279px)	*/
/*______________________________________*/
@media only screen and (max-width: 1279px)
{
/* 01 - global							*/
.unnecessary_1280
{
	display: block;
}
.unnecessary_768
{
	display: none;
}
/* 02 - header							*/
img#logo
{
	height: 46px;
	margin: 12px 0px 12px 0px;
}

/* 03 - main							*/
div#contentInner
{
	padding: 70px 0px 0px 0px;
}
div#contentInnerLeft div
{
	font-size: 18px;
}


/* 04 - footer							*/

/* 05 - sidebar							*/
}



/*______________________________________*/
/*										*/
/* IV. screen and (max-width: 767px)	*/
/*______________________________________*/
@media only screen and (max-width: 767px)
{
/* 01 - global							*/
.unnecessary_1280
{
	display: block;
}
.unnecessary_768
{
	display: block;
}
.unnecessary_480
{
	display: none;
}
/* 02 - header							*/
img#logo
{
	height: 34px;
	margin: 8px 0px 8px 0px;
}

/* 03 - main							*/
div#contentInner
{
	padding: 54px 0px 0px 0px;
}
div#contentInnerLeft div
{
	font-size: 11px;
}
div#contentInnerRight div
{
	font-size: 11px;
}


/* 04 - footer							*/

/* 05 - sidebar							*/
}



/*______________________________________*/
/*										*/
/* V. print								*/
/*______________________________________*/
@media only print
{
/* 01 - global							*/
.unnecessary_print
{
	display: none;
}
/* 02 - header							*/

/* 03 - main							*/

/* 04 - footer							*/

/* 05 - sidebar							*/
}