﻿html 				{ margin:0; padding:0; width:100%; height:100%; border-width:0; border-style:solid; outline:0;  vertical-align:baseline; background:transparent; border-right: 0px solid black; font-weight: normal;text-shadow: 0px 0px 0px white; display: inline;}
body				{ z-index:1; width:100%; height:100%; text-align:center;  background:#ffffff;  overflow:hidden; overflow-y:scroll;}	
section				{ position:relative; margin:0; padding:0; width:100%; height:100%;}
a,p, img 			{ border:none; text-decoration:none; }
ul, li 				{ list-style:none; margin:0; padding:0; }
video,embed,object,iframe { max-width: 100%;}
a:link				{ color:#555;}
/* ----->>> IMAGES <<<-------------------------------------------------------------------------- */
img 				{ max-width:100%; height:auto; border:none;}
html#ie7 img 		{-ms-interpolation-mode:bicubic; }
html#ie8 img 		{ width:auto; }
video,embed,object,iframe { max-width: 100%;}
/* ----->>> CLEAR FIX <<<-------------------------------------------------------------------------- */
.clear {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
* { margin: 0;}
.cf:before,
.cf:after {content:""; display:table;}
.cf:after {clear:both;}

/* ----->>> HOME <<<-------------------------------------------------------------------------- */
section#slide1	{ width:100%; height:100%; }
.box-1 h3 		{ padding: 16% 26% 4% 26%; font-family:Oswald;  font-size: 2.4em; font-weight:500;  text-transform:uppercase;  line-height:1.2;  text-shadow: 2px 4px 3px rgba(0,0,0,.6); }
.box-1 h4 		{ font-family:Raleway; font-size:1em; line-height:1.4em; padding: 0% 26% 6% 26%; text-shadow: 2px 4px 3px rgba(0,0,0,.6); }
.pic			{ width:200%; height:auto}
.box-1 			{ position:absolute; width:100%; margin: 0 auto;  padding:22% 0; color:#ffc300; text-shadow: 2px 4px 3px rgba(0,0,0,1);  }

#down1			{ z-index:100; position:absolute; width:100%; height:auto;  bottom:15%; background-color:#ffc300;  }
#down1 a:link	{ background-color:rgba(255,255,255,0.4); }
#down1 a:hover,a:active,a:visited 		{ background-color:rgba(255,255,255,.2); } 
#down			{ z-index:100; position:absolute; width:100%; height:auto;  bottom:15%; background-color:#ffc300; }
#down a:link	{ background-color:rgba(255,255,255,0.1); }
#down a:hover,a:active,a:visited 		{ background-color:rgba(255,255,255,.4); } 
#arrow 			{ border-radius:80px;  margin-left: -15px; position: absolute; margin-top: 0%; left: 50%; width:40px; height:40px; color: white; background-color:rgba(255,255,255,0.1); }	

/* ----->>> ABOUT ME <<<-------------------------------------------------------------------------- */
section#slide2 	{ width:100%; height:100%; background-color:#ffc300; }
#aboutme		{ margin: 0 auto;  padding:18% 0;  color:rgba(255,255,255,1.0); }
#aboutme h3 	{ font-family:Oswald; font-size: 2em; padding: 26% 6% 4% 6%; font-weight:500;  text-transform:uppercase;  line-height:1.2; text-shadow: 2px 2px 2px rgba(0,0,0,0.05); }
#aboutme h2 	{ font-family: 'Raleway';font-size:.9em; line-height:1.6em; padding: 0% 15% 6% 15%;font-weight:400;text-shadow: 2px 2px 2px rgba(0,0,0,0.05); text-transform:uppercase;color:#fff; }	


/* ----->>> - WORK --------------------------------------------------------*/
section#slide3						{ width:100%; height:160%; background-color:#fff; overflow:hidden;  }
section#slide3 h3 						{ margin: 0px auto; padding:25% 0 4% 0; font-size:220%; color:#333; font-family: 'Oswald'; font-weight:500;  }
section#slide3 .screen					{ width:auto; height:auto; margin:0; padding:0 5.5%;}
section#slide3 .screen	a				{ margin: 0 auto; padding:0; width:100%; height:auto; }
section#slide3 .screen	a 				{ padding:1%;text-align:center;  }
section#slide3 .info h4 				{ text-align:center; width:100%; height:100%; font-family:Arial;padding-top:2%; font-size: 8em; font-weight:bold; color:white;}
section#slide3 .hover 					{ position:relative; float:left; display:inline; width:auto; height:auto; text-align:center; color:white;   }
section#slide3 .hover .info 			{ opacity:.0; position:absolute; float:left; display:inline; width:100%; height:100%; background: #23202b; 
									 -webkit-font-smoothing: antialiased;}	
section#slide3 a.hover:hover .info 		{ opacity:.9; position:absolute; width:100%; height:100%; text-align: center; background: #23202b; }


/* ----->>> NOT WORK --------------------------------------------------------*/
section#slide4						{ margin:0; padding:0; width:100%; height:100%; background-color:#ededed;   }
section#slide4 .quotes_container 		{ width:60%; margin: 0 auto;  padding:52% 0; }
section#slide4 .quotes_container h4 	{ width:92%; margin: 0px auto; line-height:4; text-align:right;}
section#slide4 .quotes 				{ font-size: 160%; margin: 0px auto; line-height:1.4em; color:#333; } 
section#slide4 .author_name_white 		{ margin: 70px 0 0 75px;  font-size: 20px; }  
section#slide4 .author_name_gray 		{ color: #94a4a4;   margin: 0px 0 0 0px;  font-size: 20px; }  
.quotes 				{ text-transform:none; font-family:Wellfleet, Italic; font-size: 160%;   margin: 0px auto;  } 
.author_name_white 	{ font-family:Wellfleet;  margin: 70px 0 0 75px;  font-size: 20px; }  
.author_name_gray 	{ color: #94a4a4; font-family:Wellfleet, Italic; margin: 0px 0 0 0px;  font-size: 20px; }  


/* ----->>> CONTACT --------------------------------------------------------*/
section#slide5								{ margin: 0; padding:0; width:100%; height:100%; font-family: 'Raleway'; color:#ffc300; text-shadow: 2px 2px 2px rgba(0,0,0,0.5); background: url(../img/Hirsch.jpg) 50% 0 no-repeat fixed; background-size: cover; }
section#slide5 .quotes_container 				{ width:60%; height:auto; margin: 0 auto;  padding-top:17%;   }
section#slide5 .quotes_container h2 			{ padding-top:36%; font-size:160%; font-family: 'Oswald';  font-weight:500; text-transform:uppercase;  line-height:1.2;}
section#slide5 .quotes_container h5 			{ padding-top:4%; font-size:110%; color:#ffc300;  line-height:1.2;}
section#slide5 .quotes_container #mail  		{ width:100%; height:120px; margin: 40px auto; }
section#slide5 .quotes_container #mail a		{ margin-left:-64px; font-family:Lobster Two; font-style: italic; font-size:2em; font-weight:300; line-height:1.6;}
section#slide5 .quotes_container #mail a:link 	{ background-color:#ffc300;  border:2px solid #ffc300;color:#ffffff;}
section#slide5 .quotes_container #mail a:hover 	{ background-color:rgba(0,0,0,0.2);  border:2px solid ;   color:#ffc300; } 
section#slide5 .quotes_container #kreis  		{ position: absolute; left:50%;  width: 115px; height:115px; border-radius:100px;  visibility: visible; background-color:rgba(255,255,255,0.04); border:2px solid ; color:#ffc300;}
section#slide5 .quotes_container #kreis>h6 		{ margin-top:32px; margin-left:-8px;}
section#slide5 .quotes_container a.tel 			{ text-decoration:none; -webkit-text-decoration: none; color:#ffc300;}
section#slide5 .quotes_container a:hover.tel 	{ text-decoration:underline;}
section#slide5 .quotes_container #mom  			{ padding-top:3.6%; bottom:0; color:#ffc300; opacity:1;  font-size:.7em;}
section#slide5 .quotes_container #footer 		{ position: absolute; right:0;  bottom:0;  left: 0;  padding: 1rem;  text-align: center;}
section#slide5 .quotes_container #footer p 		{ bottom:0; color:#ffc300; opacity:1;  font-size:.65em;}
section#slide5 .quotes_container #footer a 		{ bottom:0; color:#ffc300; opacity:1;  }
section#slide5 .quotes_container #footer a:hover 	{ color:#fff; opacity:1; }

/* ----->>> WORK --------------------------------------------------------*/
div#sub_work		{ position:fixed; z-index:100000; width:100%; height:54px; background-color:#333; }
#sub_work a			{ color:#fff; float:left; padding-left:6%; margin-top:20px; font-family:Raleway; font-size:.8em; opacity:1;}
#sub_work a:hover	{ opacity:.6;}

.websites,.interaction,.brands			{ z-index:1000; position:absolute; width:100%; height:100%; margin:0; top:0; padding-bottom:12%;background-color:white; text-align:center; }
.brands h1,.interaction h1,.websites h1	{ padding-top:28%; font-family: 'Oswald';font-weight:normal;  font-size:1.8em; color:#333;}
.brands h2,.interaction h2,.websites h2 { padding: 2% 8% 8% 8%; font-family: 'Raleway';font-size: .8em; line-height:1.480000000; font-weight:300; color:#333;  }
.brands h5,.interaction h5,.websites h5	{ padding-top:8%; font-family: 'Oswald';font-weight:400; font-size:1.2em;  line-height:2em; color:#333; text-align:left;}
.brands p,.interaction p,.websites p	{ font-family: 'Raleway';font-weight:400; font-size:.7em;  line-height:1.6em; color:#333; text-align:left;  }

.thumbnail			{ width:100%; height:auto; padding-left:2%; }
.thumbnail a		{ float:left; width:30%; padding:1%;  }
div.client 			{ position:relative; width:auto; height:auto; padding:0% 14.5% 0% 14.5%; }
div.client a		{ opacity:.7; color:#333; font-family:Raleway; font-size: .9em; font-weight:400;   }
div.client a:hover	{ opacity:1; color:#333;}
div#corporate,div#interactive,div#websites	{ color:white;  width:100%; height:auto; overflow:hidden; }
.thumb 				{ width:210px; height:347px;    }
div.box				{ position:relative; padding:0; margin:0; width:90%; height:90%; text-align:center;   padding-bottom:10%;	}	
 
.datenschutz							{ z-index:1000; position:absolute; width:100%; height:auto;  margin:0; top:0;background-color:white; text-align:left; }
.datenschutz h1							{ text-align:left;  padding-left:10%; padding-bottom:2%; padding-top:38%;font-family: 'Oswald';font-weight:normal; font-size:1.2em; color:#333;}
.datenschutz h2 							{ padding: 1% 20% 2% 10%; text-decoration:underline; font-family: 'Raleway';font-size: .7em; line-height:1.480000000; font-weight:300; color:#333;  }
.datenschutz p							{ font-family: 'Raleway'; padding-left:10%;font-weight:400; font-size:.6em;  line-height:1.6em; color:#333; text-align:left; width:76%; }

.copyright			{ margin:0; padding:0; background:#fff; height:100px;}
.copyright p 		{ padding-top:24%;color:#333; opacity:1;  font-size:.65em;}
.copyright a 		{ bottom:0; color:#333; opacity:1;  }
.copyright a:hover 	{ color:#ffc300; opacity:1; }


