html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}

main    {width:100%; float:left}
header  {width:100%; float:left}
.head   {width:100%; float:left; background-color:#fbfbfb; height:35px; padding:11px 0px 11px 0px}
.bar    {width:100%; height:15px; background-color:#09c; float:left}
.slider {width:100%; float:left;}
.center {width:100%; margin:0px auto; float:none; text-align:center}
.center {-webkit-transition: all 0.3s ease; transition: all 0.5s ease; // set animation;}
.center2{width:65%; margin:0px auto; float:none; text-align:center}
.center2{-webkit-transition: all 0.3s ease; transition: all 0.5s ease; // set animation;}
.center3{width:60%; margin:0px auto; float:none; text-align:center}
.center3{-webkit-transition: all 0.3s ease; transition: all 0.5s ease; // set animation;}
.center4{ position:absolute; width:100%; text-align:center}
.center4{-webkit-transition: all 0.3s ease; transition: all 0.5s ease; // set animation;}

.disable{display:none}

#language a {color:white; text-decoration:none;}
#language a:hover {color:white}
#language{position:fixed; top:25px; left:14px; border:2px solid #0099CC; cursor: pointer}
#language{margin:0px 5px 0px 5px; padding:4px 12px 7px 12px; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700}
#language{-webkit-transition: all 0.6s ease; transition: all 0.6s ease; // set animation;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
#language{background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
#language{background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
#language{background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
#language{background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}
#language:hover{border:2px solid #000000; text-decoration:none;}
#language:hover{background-image: -webkit-linear-gradient(#656565 0%, #000000 100%)}
#language:hover{background-image: -moz-linear-gradient(#656565 0%, #000000 100%)} 
#language:hover{background-image: -o-linear-gradient(#656565 0%, #000000 100%)} 
#language:hover{background-image: linear-gradient(#656565 0%, #000000 100%)}

.language div a {color:black!important;}
.language       {display:inline-block;}
.language a div {display:block; text-decoration: none; padding:6px 12px 7px 12px; z-index: 1; color:black!important}
.language a div {font-size:15px; font-family: 'Open Sans', sans-serif;font-weight:700}
.language div   {visibility: hidden; z-index: 1; padding:4px 12px 7px 12px; margin:7px 0px 0px -14px; position: absolute;}
.language div   {-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
.language:hover div {visibility: visible; background:none; background-color:white; border:2px solid #000000;}

/* mobile Navigation */
.open_navi{position:fixed; top: 4.1%; left: 4%; width:20px; height:15px; background-image: url('../images/open_navi.gif'); cursor: pointer;}
.navi   {width:290px; min-height:100%; background-color:white; position: fixed; padding-top:70px; z-index: 1000;}
.navi   {display:none; top:0px; left:-290px;}
#navi li{list-style: none; text-align: left; margin-left:12%; margin-top:22px; display: block; padding-bottom:1px } 
#navi li a {text-decoration: none; font-size:24px; line-height: 0px; font-weight:400; font-family: 'Roboto Condensed', sans-serif; color:#a0a0a0}
#navi li a {-webkit-transition: all 0.4s ease; transition: all 0.4s ease; // set animation;}
#navi li a:hover {color:black}
.active3 {color:black!important}
#close  {width:20px; height: 20px; position:absolute; top:2%; right: 6%; cursor: pointer}
.btn5    {font-size:16px; font-family: 'Open Sans', sans-serif; font-weight:300; color:#0099CC; text-decoration:none; display:block;  margin-bottom:15px}
.btn5:hover{color:white}


.animation {
	background: linear-gradient(-220deg, #000000, #303030, #000000, #3d3d3d );
	background-size: 400% 400%;
	animation: gradient 9s ease infinite;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

#uber a {color:white; text-decoration:none; }
#uber a:hover {color:white;}
#uber{border:2px solid #0099CC; cursor: pointer;}
#uber{margin:0px 5px 0px 5px; padding:4px 12px 7px 12px; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700}
#uber{-webkit-transition: all 0.6s ease; transition: all 0.6s ease; // set animation;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
#uber{background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
#uber{background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
#uber{background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
#uber{background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}
#uber:hover{border:2px solid #000000; text-decoration:none;}
#uber:hover{background-image: -webkit-linear-gradient(#656565 0%, #000000 100%)}
#uber:hover{background-image: -moz-linear-gradient(#656565 0%, #000000 100%)} 
#uber:hover{background-image: -o-linear-gradient(#656565 0%, #000000 100%)} 
#uber:hover{background-image: linear-gradient(#656565 0%, #000000 100%)}

.uber div a {color:black!important; display:block; padding:6px 12px 7px 12px; border-bottom:1px solid rgba(0,0,0,0.10); width:72px; margin:0px 0px 0px -12px;}
.uber       {display:inline-block;}
.uber a div {display:block; text-decoration:none; z-index: 1; color:black!important;}
.uber a div {font-size:15px; font-family: 'Open Sans', sans-serif;font-weight:700;}
.uber div   {visibility:hidden; z-index: 1; padding:0px 12px 0px 12px; margin:7px 0px 0px -14px; position:absolute; width:72px;}
.uber div   {-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  border-bottom:1px solid rgba(0,0,0,0.30)}
.uber div a:hover{background-image: -webkit-linear-gradient(#656565 0%, #000000 100%); color:white!important}
.uber div a:hover{background-image: -moz-linear-gradient(#656565 0%, #000000 100%)} 
.uber div a:hover{background-image: -o-linear-gradient(#656565 0%, #000000 100%)} 
.uber div a:hover{background-image: linear-gradient(#656565 0%, #000000 100%)}
.uber:hover div {visibility: visible; background:none; background-color:white; border:2px solid #000000;}

#ref a {color:white; text-decoration:none; }
#ref a:hover {color:white;}
#ref{border:2px solid #0099CC; cursor: pointer;}
#ref{margin:0px 5px 0px 5px; padding:4px 12px 7px 12px; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700}
#ref{-webkit-transition: all 0.6s ease; transition: all 0.6s ease; // set animation;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
#ref{background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
#ref{background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
#ref{background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
#ref{background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}
#ref:hover{border:2px solid #000000; text-decoration:none;}
#ref:hover{background-image: -webkit-linear-gradient(#656565 0%, #000000 100%)}
#ref:hover{background-image: -moz-linear-gradient(#656565 0%, #000000 100%)} 
#ref:hover{background-image: -o-linear-gradient(#656565 0%, #000000 100%)} 
#ref:hover{background-image: linear-gradient(#656565 0%, #000000 100%)}

.ref div a {color:black!important; display:block; padding:6px 12px 7px 12px; border-bottom:1px solid rgba(0,0,0,0.10); width:94px; margin:0px 0px 0px -12px;}
.ref       {display:inline-block;}
.ref a div {display:block; text-decoration:none; z-index: 1; color:black!important;}
.ref a div {font-size:15px; font-family: 'Open Sans', sans-serif;font-weight:700;}
.ref div   {visibility:hidden; z-index: 1; padding:0px 12px 0px 12px; margin:7px 0px 0px -14px; position:absolute; width:94px;}
.ref div   {-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  border-bottom:1px solid rgba(0,0,0,0.30)}
.ref div a:hover{background-image: -webkit-linear-gradient(#656565 0%, #000000 100%); color:white!important}
.ref div a:hover{background-image: -moz-linear-gradient(#656565 0%, #000000 100%)} 
.ref div a:hover{background-image: -o-linear-gradient(#656565 0%, #000000 100%)} 
.ref div a:hover{background-image: linear-gradient(#656565 0%, #000000 100%)}
.ref:hover div {visibility: visible; background:none; background-color:white; border:2px solid #000000;}

.retu{float:none; margin:-36px 0px 0px 106px!important; display:none}

#phot a {color:white; text-decoration:none;}
#phot a:hover {color:white;}
#phot{border:2px solid #0099CC; cursor: pointer;}
#phot{margin:0px 5px 0px 5px; padding:4px 12px 7px 12px; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700}
#phot{-webkit-transition: all 0.6s ease; transition: all 0.6s ease; // set animation;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
#phot{background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
#phot{background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
#phot{background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
#phot{background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}
#phot:hover{border:2px solid #000000; text-decoration:none;}
#phot:hover{background-image: -webkit-linear-gradient(#656565 0%, #000000 100%)}
#phot:hover{background-image: -moz-linear-gradient(#656565 0%, #000000 100%)} 
#phot:hover{background-image: -o-linear-gradient(#656565 0%, #000000 100%)} 
#phot:hover{background-image: linear-gradient(#656565 0%, #000000 100%)}

.phot div a {color:black!important; display:block; padding:6px 12px 7px 12px; border-bottom:1px solid rgba(0,0,0,0.10); width:110px; margin:0px 0px 0px -12px;}
.phot       {display:inline-block;}
.phot a div {display:block; text-decoration:none; z-index: 1; color:black!important;}
.phot a div {font-size:15px; font-family: 'Open Sans', sans-serif;font-weight:700;}
.phot div   {visibility:hidden; z-index: 1; padding:0px 12px 0px 12px; margin:7px 0px 0px -14px; position:absolute; width:110px;}
.phot div   {-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  border-bottom:1px solid rgba(0,0,0,0.30)}
.phot div a:hover{background-image: -webkit-linear-gradient(#656565 0%, #000000 100%); color:white!important}
.phot div a:hover{background-image: -moz-linear-gradient(#656565 0%, #000000 100%)} 
.phot div a:hover{background-image: -o-linear-gradient(#656565 0%, #000000 100%)} 
.phot div a:hover{background-image: linear-gradient(#656565 0%, #000000 100%)}
.phot:hover div {visibility: visible; background:none; background-color:white; border:2px solid #000000;}

.schein {width:100%; position:absolute; height:186px; margin-top:-36px; background-image:url('../images/schatten2.png'); opacity:0.25;}
.schein2{width:100%; height:186px; float:left; background-image:url('../images/schatten2.png'); opacity:0.1}

.ab     {padding:18px 18px 35px 18px; text-align:left}
.big    {font-size:22px; margin-left:17px; font-weight:bold;}
.img_3  {float:left; padding:10px 17px 15px 17px}
.none   {display:none}

.round    {-moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -khtml-border-radius: 6px; height:130px; }
.round    {width:18%; position:relative; margin:5% auto; float:none; background-color:white; text-align:center; border:1px solid rgba(0,0,0,0.2)}
.fenster  {position:fixed; width:100%; top:0;left:0;bottom:0;right:0; z-index:15; height:100%; background-color:rgba(0,0,0,0.8); display:none; }
.round_top{width:100%; height:40px; border-bottom:1px solid rgba(0,0,0,0.1)}
.change   {height:auto; width:48%; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; // set animation;}
.baukunst {display:none}
#frauen   {display:none}
#bauen    {display:none}
.women    {display:none}

.close    {width:22px; height:21px; float:right; position:relative;  background-image:url('../images/x_navi.png'); margin:0px -45px 0px 0px; cursor:pointer}
.img      {cursor:pointer; margin-top:3.5%; }
.img img  {max-width:100%; height:auto}
.fenster2 {position:fixed; width:100%; height:100%; top:0; left:0; background-color:rgba(0,0,0,0.75); display:none; z-index:1200!important}

.b1       {width:33%; height:auto}
.f1       {width:792px; height:445px}

/*   Safe   */
.blue_safe {color:#0099CC!important}
.safe_left {width:100%; float:left; height:70px;}

input[type="checkbox"] {display:none;}
input[type="checkbox"] + label {
	width: 60px;
	height: 30px;
	border-radius: 30px;
	border: 2px solid #ddd;
	background-color: #EEE;
	display: inline-block;
	content: "";
	float: left;
	margin-right: 5px;
	transition: background-color 0.5s linear;
	margin-top: 15px;
  }
  input[type="checkbox"] + label:hover {
	cursor: pointer;
  }
  input[type="checkbox"] + label::before {
	width: 30px;
	height: 30px;
	border-radius: 30px;
	background-color: #fff;
	display: block;
	content: "";
	float: left;
	margin-right: 5px;
	transition: margin 0.1s linear;
	box-shadow: 0px 0px 5px #aaa;
  }
  input[type="checkbox"]:checked+label{
	background-color: #2b8718;
  }
  input[type="checkbox"]:checked+label::before {
	margin: 0 0 0 30px;
  }

  input[type="checkbox"] + label {
	position: relative;
  }
  input[type="checkbox"] + label::after {
	  content: "Ich bin kein Roboter";
	  position: absolute;
	  left: 70px;
	  top: 5px;
	  font-family: 'Open Sans', sans-serif; font-weight:400;
	  width:150px;
  }

/*  Cookies */
.fenster1{width:100%;height:100%; position: fixed; display:none;}
.popup1  {width:35%; position:fixed; margin:1.2% 1.2% 1.2% 1.2%; background-color:white; bottom:20px; right:20px}
.popup1  {-webkit-border-radius: 6px; -moz-border-radius: 6px;border-radius: 6px; border:1px solid rgba(0,0,0,0.09); margin-top:3.0%}
.popup1  {padding:1.2% 1.2% 1.2% 1.2%;}
.popup1  {-webkit-transition: all 0.3s ease; transition: all 0.3s ease; // set animation;}
.cook_txt{font-size:16px; color:black; font-family: 'Open Sans', sans-serif; font-weight:400; line-height: 28px}
.ok      {padding:8px 10px 8px 10px; background-color:#0099CC; float: none; position: relative;  -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
.ok      {color:white; font-family: 'Open Sans', sans-serif; font-weight:600; clear:both; display:inline-table}
.ok:hover{background-image: -webkit-linear-gradient(#656565 0%, #000000 100%)}
.ok:hover{background-image: -moz-linear-gradient(#656565 0%, #000000 100%)} 
.ok:hover{background-image: -o-linear-gradient(#656565 0%, #000000 100%)} 
.ok:hover{background-image: linear-gradient(#656565 0%, #000000 100%)}

.pfeil  {width:67px; height:66px; position:fixed; bottom:15px; right:15px; cursor:pointer; z-index:1; display:none}

section {width:100%; float:left}
.klein  {font-size:15px;}

ul li   {list-style-image:none; list-style-position:none; list-style:none; display:inline; font-size:15px;}
li      {font-size:15px; font-family: 'Roboto Slab', serif; font-weight:300; text-decoration:none; color:black; line-height:31px; cursor:default!important}

.position{position:absolute; margin:0px 0px 0px 0px; width:100%; padding:48px 0px 0px 0px; z-index:1000}
.position2{position:absolute; width:100%; margin-top:27%; -webkit-transition: all 0.3s ease; transition: all 0.5s ease; // set animation;}
.back2  {float:none; margin:0px auto; text-align:center!important;}
nav     {float:none; margin:0px auto; text-align:center;}
.btn    {margin:0px 5px 0px 5px; padding:4px 12px 7px 12px; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700}
.btn    {color:white; text-decoration:none; background-color:#0099CC;  border:2px solid #0099CC }
.btn    {-webkit-transition: all 0.3s ease; transition: all 0.3s ease; // set animation;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}

.btn    {background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
.btn    {background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.btn    {background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.btn    {background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}

.btn6   {margin:0px 0px 0px 1px; padding:3px 14px 5px 14px; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700}
.btn6   {color:white; text-decoration:none; border-right:1px solid rgba(255,255,255, 0.2); float:left; border-left:1px solid rgba(0,0,0, 0.2);}
.btn6   {-webkit-transition: all 0.3s ease; transition: all 0.3s ease; // set animation;}
.btn6   {background-image: -webkit-linear-gradient(#414141 30%, #000000 100%); background-image: -moz-linear-gradient(#414141 30%, #000000 100%);}
.btn6   {background-image: -o-linear-gradient(#414141 30%, #000000 100%); background-image: linear-gradient(#414141 30%, #000000 100%);}

.btn7   {margin:0px 5px 0px 5px; padding:4px 12px 7px 12px; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700}
.btn7   {color:white; text-decoration:none; background-color:#0099CC;  border:2px solid #0099CC }
.btn7   {-webkit-transition: all 0.3s ease; transition: all 0.3s ease; // set animation;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}

.btn7   {background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
.btn7   {background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.btn7   {background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.btn7   {background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}

.btn8   {margin:0px 5px 0px 5px; padding:4px 12px 7px 12px; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700}
.btn8   {color:white; text-decoration:none; background-color:#0099CC;  border:2px solid #0099CC }
.btn8   {-webkit-transition: all 0.3s ease; transition: all 0.3s ease; // set animation;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}

.btn8   {background-image: -webkit-linear-gradient(#414141 0%, #000000 100%);}
.btn8   {background-image: -moz-linear-gradient(#414141 0%, #000000 100%);} 
.btn8   {background-image: -o-linear-gradient(#414141 0%, #000000 100%);} 
.btn8   {background-image: linear-gradient(#414141 0%, #000000 100%);}

.btn8:hover {background-color:rgba(255,255,255,1.0)!important; background:none!important; background-image:none!important; color:black}
.btn8:hover {border:2px solid #000000}

.btn:hover{background:rgba(255,255,255,1.0); border:2px solid #0099CC; text-decoration:none; color:#0099CC!important;}
#txt_ko  {padding:2px 2px 2px 2px; background-color:#0099cc; display:inline; color:white!important}
.banner  {display:none}
.bewegen {display:none}
.retusche{display:none}

.potraits{display:none}
.land    {display:none}
.architekt{display:none}

.bar_men {width:100%; height:30px; position:fixed; top:0; left:0; z-index:10} 
.bar_men {background-color:rgba(0, 0, 0, 0.6)}
.bar_men {animation: ani8 0.5s; animation-fill-mode: forwards; margin-top:-39px; display:none;}

.left    {width:47%; float:left; margin-top:50px}
.right   {width:47%; float:right; margin-top:50px}

.logo    {width:115px; height:158px; float:left; position:relative; margin:-17px 0px 0px 14% }
.text1   {height:300px; float:left; margin:9.5% 0% 0% 2%}
.linie   {width:10%; height:7px; background-color:#0099CC; margin:35px auto}
.uberihn {width:100%; float:left; padding:100px 0px 100px 0px}
.skills  {width:100%; float:left; padding:250px 0px 200px 0px}
.referenzen{width:100%; float:left; padding:220px 0px 250px 0px}
.photodesign{width:100%; float:left; padding:220px 0px 250px 0px}
footer   {width:100%; float:left; padding:50px 0px 125px 0px; background-color:#1b2e42}
.bottom  {width:100%; float:left; padding:15px 0px 15px 0px; background-color:#08101a;}
.foot_txt{line-height:18px; color:white; font-size:14px; text-align:center; width:100%; padding-top:10px;}

.box_in  {width:100%; height:60px; position:relative; margin-top:-60px;}
.box_in1 {width: 18px;  height: 18px; position:relative; float:right; margin-right:10px; margin-top:32px; border:1px dashed  rgba(255, 255, 255, 0); transition: transform .3s;}
.box_in1:hover {transform: scale(1.10);}

#wb01    {background-color:black}
#wb02    {background-color:black}

.boxa    {width:24.5%; float:left; margin-top:35px; text-align:center}
.boxb    {width:0.5%; float:left; margin-top:35px}
.btn4    {font-size:16px; font-family: 'Open Sans', sans-serif; font-weight:300; color:#0099CC; text-decoration:none; display:block;  margin-bottom:15px}
.btn4:hover{color:white}

.aufklappen {width:100%; height:100%; position:fixed; background-color:rgba(0,0,0,0.95); z-index:1; display:none}
.x_navi     {position:absolute; top:43px; right:48px; width:30px; height:22px; cursor:pointer}
.xbtn       {font-size:18px; font-family:'Open Sans'; display:block;  float:none; color:white; font-weight:700; margin-bottom:25px; text-decoration:none;}
.xbtn       {-webkit-transition: all 0.3s ease; transition: all 0.3s ease; // set animation}
.xbtn:hover {color:#45a0ed}
.ab3        {float:none; margin-top:150px}

.kontakt {padding:220px 0px 250px 0px}
.kontakt {width:100%; float:left; text-align:center}
.kontakt {background-image:url('../images/contact_background.jpg');background-repeat: no-repeat; background-attachment: fixed;}
.kontakt {background-position: center;}

.subnavi {width:100%; float:left; text-align:center}
.big_white{font-weight:700; color:white; padding-bottom:5%}

.blue    {text-decoration:none; color:#0099CC; font-weight:700}
.blue_a  {text-decoration:underline; color:#0099CC; font-weight:700}
.blue_a:hover  {color:black}
.strich  {text-decoration:underline}
.me      {width:235px; height:251px; float:none; margin:10% auto; z-index:2;  cursor:pointer!important; transition: transform .4s;}
.me:hover{ transform: scale(1.1);}
.active  {background:none; background-image:none; background-color:black}
.active2 {background:none; background-image:none; background-color:black}

.open_m  {width:31px; height:22px; position:fixed; z-index:1000; top:30px; right:20px; cursor:pointer}

.boximg {display:block}
.box_a  {margin:-89% 0px 0px 9.5%; position:relative; z-index:8; float:left}
.box    {width:31%; height:30%; float:left; background-color:white; margin-right:2%; text-align:left; padding:0px 0px 0px 0px;}
.box    {transition: transform .3s;}
.box    {margin-top:70px; cursor:pointer; border:1px solid rgba(0,0,0, 0.1)}
.box:hover{transform: scale(1.09);}

.box4    {width:1.5%; height:200px; float:left;}
.box3    {-webkit-box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.15); box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.15); margin-top:120px}
.box3    {width:31%; height:220px; float:left; background-color:white; cursor:pointer; cursor:pointer; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.box3_1  {width:80px; height:80px; float:none; margin:-40px auto; position:relative;}
.box3_2  {width:100%; float:left; margin:60px 0px 0px 20px; text-align:left; }
.box3_2 p{font-size: calc(0.65em + 0.65vmin); font-family: 'Roboto Slab', serif; font-weight:300; text-decoration:none; color:#878787; line-height:24px; cursor:default!important; padding:0px 40px 0px 10px}
.box3_2 strong{padding:10px 10px 10px 10px; float:left; background-color:#0099CC; color:white; cursor:pointer}
.box3_2 strong{background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
.box3_2 strong{background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.box3_2 strong{background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.box3_2 strong{background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}
.box3_2 span{padding:10px 10px 10px 10px; float:left; background-color:black; color:white; cursor:pointer}



.white3 {color:white; font-size:16px}
.white2 {color:white; font-size:14px}
.white1 {color:white; text-align:center;}
.black1 {color:black; font-weight:bold}

.kontakt_feld {width:99%; height:50px; margin-bottom:22px; border:1px solid gray;}
.kontakt_feld2{width:99%; height:50px; margin-bottom:22px; border:1px solid #136884;}
.kontakt_feld3{width:99%; height:280px; border:1px solid #136884; padding-top:1%}
.kontakt_feld4{width:99%; height:280px; border:1px solid #136884; padding-top:1%; display:none}
.kontakt_btn  {width:101.5%; height:60px; margin-top:22px; cursor:pointer; background-image:none; border:none;}
.kontakt_btn  {color:white; font-size:16px; font-family: 'Open Sans', sans-serif; font-weight:700;}
.kontakt_btn  {background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
.kontakt_btn  {background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.kontakt_btn  {background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.kontakt_btn  {background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}

.kontakt_btn2  {width:101.5%; height:60px; margin-top:22px; cursor:pointer; background-image:none; border:none;}
.kontakt_btn2  {color:white; font-size:16px; font-family: 'Open Sans', sans-serif; font-weight:700;}
.kontakt_btn2  {background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
.kontakt_btn2  {background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.kontakt_btn2  {background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
.kontakt_btn2  {background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}
.kontakt_btn2  {-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}

.schreiben    {color:gray; font-size:16px; font-weight:500; font-family: 'Open Sans', sans-serif; padding-left:2%}

p       {font-size:19px; font-family: 'Roboto Slab', serif; font-weight:300; text-decoration:none; color:black; line-height:31px; cursor:default!important}
h1      {font-size:80px; font-family: 'Open Sans', sans-serif; font-weight:700; float:none; display:inline-block; text-decoration:none; color:white; line-height:26px; padding:35px 15px 35px 15px; background-color:#0099CC}
h1      {-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; cursor:default; -webkit-transition: all 0.3s ease; transition: all 0.5s ease; // set animation;}
h1      {background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
h1      {background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
h1      {background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
h1      {background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}

h2      {background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
h2      {background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
h2      {background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
h2      {background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}
h2      {-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; cursor:default}
h2      {font-size:45px; font-family: 'Open Sans', sans-serif; font-weight:700; float:none; text-decoration:none; color:white; line-height:26px; padding:20px 18px 20px 18px; background-color:#0099CC}
h2      {margin:20px 0px 0px 240px; letter-spacing:-1px; }

h3      {background-image: -webkit-linear-gradient(#2cbbea 0%, #0099CC 100%);}
h3      {background-image: -moz-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
h3      {background-image: -o-linear-gradient(#2cbbea 0%, #0099CC 100%);} 
h3      {background-image: linear-gradient(#2cbbea 0%, #0099CC 100%);}
h3      {font-size:40px; font-family: 'Open Sans', sans-serif; font-weight:700; float:none; text-decoration:none; color:white; margin-bottom:0px; letter-spacing:-1px; background-color:#0099CC; padding:0px 9px 0px 9px; display:inline-block}
h3      {margin-bottom:20px; cursor:default!important; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}

h5      {background-image: -webkit-linear-gradient(#141414 0%, #000000 100%);}
h5      {background-image: -moz-linear-gradient(#141414 0%, #000000 100%);} 
h5      {background-image: -o-linear-gradient(#141414 0%, #000000 100%);} 
h5      {background-image: linear-gradient(#141414 0%, #000000 100%);}
h5      {font-size:58px; font-family: 'Fira Sans Condensed', sans-serif; font-weight:400; text-decoration:none; color:white;  display:inline; letter-spacing:0px; padding:10px 20px 10px 20px; margin-bottom:35px; line-height:85px}
h5      {cursor:default; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;  -webkit-transition: all 0.3s ease; transition: all 0.5s ease; // set animation;}

h4      {font-size:22px; font-family: 'Roboto Slab', serif; font-weight:300; text-decoration:none; color:black; line-height:38px; cursor:default!important}

#back2  {display:none}
.back1  {position:absolute;}

#flow   { height:100px}

.a8     {opacity:0.0; animation-name: fadeIn2; animation-delay: 0.3s; animation-duration: 1.5s; animation-fill-mode: forwards;}
.a9     {opacity:0.0; animation-name: fadeIn2; animation-delay: 0.6s; animation-duration: 1.5s; animation-fill-mode: forwards;}

@keyframes fadeIn2 {
	0%   { opacity: 0.0;}
	100% { opacity: 1.0;}
}

#ani1   {width:3%}
#ani2   {opacity:0.0;}
#ani3   {opacity:0.0;}


@media screen and (max-width: 1500px) {
.box    {width:45.33%; margin-left:2.30%}
.box3   {width:43.5%;}
.box4   {width:4%;}
.boxa   {width:48%; margin-top:45px}
.boxb   {width:2%;}
.round  {width:22%}
}

@media screen and (max-width: 1435px) {
h5        {font-size:58px; display:inline-flex; padding:11px 16px 11px 16px; margin-bottom:0px; line-height:50px}
.position2{margin-top:22%}
.round  {width:22%}
}


@media screen and (max-width: 1250px) {
.text1   {height:300px; float:left; margin:01% 0% 0% 16%}
.round  {width:22%}
}

@media screen and (max-width: 1220px) {
#txt3    {display:none}
.kontakt_feld3 {display:none}
.kontakt_feld4 {display:block; margin-top:25px}

.right  {display:none}
.left   {width:99%}
}

@media screen and (max-width: 1160px) {

.round  {width:22%}
}

@media screen and (max-width: 1125px) {
h1       {font-size:68px; padding:25px 16px 27px 16px}
h2       {font-size:38px; padding:11px 13px 13px 13px}
.round   {width:26%}
}

@media screen and (max-width: 1100px) {
.box     {width:99%; margin-left:0px}
.box3    {width:99%;}
.box4    {display:none;}
}

@media screen and (max-width: 1080px) {
.boxa   {width:99%; margin-top:45px}
.boxb   {display:none;}
.popup1  {padding: 1.9% 1.9% 1.9% 1.9%; width:40%}
#p_text1 {font-size: 14px; line-height: 23px}
}

@media screen and (max-width: 1060px) {
h5        {font-size:46px; display:inline-flex; padding:9px 15px 9px 15px; margin-bottom:-5px; line-height:50px}
.position2{margin-top:22%}
}


@media screen and (max-width: 990px) {
nav      {display:none}
input[type="checkbox"] + label::after {
	content: "Ich bin kein Roboter";
	position: relative;
	float:left;
	left:0;
}
}

@media screen and (max-width: 980px) {
.text1   {height:300px; float:left; margin:8% 0% 0% 12%}
h1       {font-size:60px; padding:18px 16px 20px 16px}
h2       {font-size:30px; padding:7px 13px 8px 13px}
.logo    {display:none}
}

@media screen and (max-width: 900px) {
.f1     {width:486px; height:270px!important}
.big    {margin-left:0px}
#flow   {overflow-y: scroll; height:700px;}
#bio    {display:none}
h5      {font-size:38px; display:inline-flex; padding:6px 13px 6px 13px; margin-bottom:-15px; line-height:50px}
.position2{margin-top:17%}
}

@media screen and (max-width: 890px) {
.btn7   {float:left; width:96.5%; margin:3px 0px 3px 0px; padding:7px 5px 7px 5px}
.btn8   {float:left; width:96.5%; margin:3px 0px 3px 0px; padding:7px 5px 7px 5px}
.popup1 {padding: 2.2% 2.2% 2.2% 2.2%; width:45%}
#p_text1{font-size: 14px; line-height: 23px}
}


@media screen and (max-width: 820px) {
h1      {font-size:45px; padding:10px 16px 10px 16px; }
h2      {display:none}
}

@media screen and (max-width: 790px) {
#txt6    {display:none}
#txt5    {display:none}
h5       {font-size:34px; display:inline-flex; padding:5px 12px 5px 12px; margin-bottom:-15px; line-height:50px}
.position2{margin-top:17%; margin-left:0%}
}

@media screen and (max-width: 700px) {
.popup1   {padding: 2.5% 2.5% 2.5% 2.5%; width:50%}
}

@media screen and (max-width: 668px) {
	input[type="checkbox"] + label::after {
		display: none;

	}
	}

@media screen and (max-width: 600px) {
.f1     {width:296px; height:165px!important}
}

@media screen and (max-width: 625px) {
h5       {font-size:28px; display:inline-flex; padding:1px 8px 1px 8px; margin-bottom:-15px; line-height:50px}
.position2{margin-top:15%;}
}

@media screen and (max-width: 470px) {
h1      {font-size:34px; padding:6px 8px 6px 8px; margin:-40px 0px 0px 2% }
.popup1 {padding: 3.6% 3.6% 3.6% 3.6%; width:68%}
}

@media screen and (max-width: 460px) {
h5       {font-size:22px; display:inline-flex; padding:-1px 3px -1px 3px; margin-bottom:-15px; line-height:50px}
.position2{margin-top:12%;}
}

@media screen and (max-width: 490px) {
#txt4    {display:none}
}
@media screen and (max-width: 400px) {
h3       {padding:2px 9px 2px 9px; font-size:26px}
h4       {font-size:23px; line-height:28px}
.me img  {width:90%!important; margin-right:7%}
.uberihn {padding:50px 0px 50px 0px!important}
}

@media screen and (max-width: 380px) {
.box3_2 strong {margin-top:-12px}
.box3_2 span   {margin-top:-12px}
}

@media screen and (max-width: 345px) {
h5        {font-size:17px; display:inline-flex; padding:0% 5px 0% 5px!important; margin-bottom:-15px; line-height:50px}
.position2{margin-top:10%;}
}

@media screen and (max-width: 320px) {
h1       {margin:-15% 0% 0% -8%}
.text1   {margin:4% 0% 0% 12%}
}