@import url('https://fonts.nwwn.de/css?family=Dosis');
@import url('https://fonts.nwwn.de/css?family=Open+Sans:300,400,600');
* { box-sizing:border-box; }
body { background:#fff; color:#2b2b2b; margin:0; font:normal 12pt/150% 'Open Sans',Helvetica, Arial, sans-serif;
}
.fweb_bottom { width:100%; position:relative; background:#181818; border-top:1px solid #222; display:block; line-height:150%; }
.fweb_bottom1 { margin:0 auto; width:98%; max-width:960px; color:#fefefe; font-size:0.7rem; text-align:center; padding:10px 0 20px 0; line-height:150%; }
.fweb_bottom a { text-decoration:none; color:#ddd; font-weight:bold; line-height:200%; }
.fweb_bottom a:hover { text-decoration:none; color:#ccc; font-weight:bold; line-height:110%; }
#fwa:after,#fwb:after,#fwc:after,#fwd:after,#fwe:after,#fwf:after { content:" | ";}
#fwa, #fwb, #fwc, #fwp, #fwq,#sublinks { display:none; }

a { color:#009900; text-decoration:none; }
a:hover { color:#777; text-decoration:underline; cursor:pointer; }
h1,h2,h3 {font-family:'Dosis'; color:#009900;}
img { max-width:100%; height:auto; }
.flex { display:flex; flex-direction:row; justify-content: space-between; flex-wrap:wrap; }
.inner, #wrapper { position:relative; margin:0 auto; width:95%; max-width: 1140px; }

#top-outline { position:relative; background:#F0F0F0; height:266px; margin:0; }
#top-contact, #top-contact a { position:relative; font-size:8pt; text-transform:uppercase; color:#555; line-height:36px; text-align:right; }
#top-contact a:hover { text-decoration:none; color:#009900; }
#top-wrapper { position:relative; background:url(../files/logos/gears.jpg) no-repeat; width:100%; height:230px; margin:0; display:flex;  }
#logo { position:relative; padding: 40px 0 0 40px; width:190px; height:190px; display:inline-block; }
#logo a { display:block; position:relative; background:#009900 url(../files/logos/logo.png) center center no-repeat; top:0; left:0; 
 height:150px; width:150px; background-size:contain;  }
#top-center { position:relative; width:calc(100% - 190px); padding-top:35px; text-align:right; font-size:95%; }
#top-center ul , #top-center li { margin:0; padding:0; display:block; list-style-type:none; }
#top-center ul { width:400px; right:40px; position:absolute; top:35px; }
#top-center li { display:inline-block; font-weight:600;  }
#top-center li a {  transition:all .3s ease-in-out;
 padding:8px 15px; background:#555; color:#fff; margin:6px; border:1px solid #666; display:inline-block; width:180px; text-align:center; display:block; text-decoration:none; }
#top-center li a:hover { border:1px solid #009900; margin:6px; color:#ffff00; background:#009900; transition:all .3s ease-in-out; }

#facebook { position:relative; vertical-align:middle; display:inline-block; width:32px; height:32px; text-align:right; }
#facebook a { position:absolute; opacity:0.9; background:url(../files/logos/facebook.png) center center no-repeat; top:0; left:0; height:32px; width:32px; background-size:50%; }
#facebook a:hover { opacity:1;}



#nav-outline { background:#fff; }
#nav a {text-decoration:none;}
#nav{ position: relative; z-index: 999 !important; padding-left:4px; }
#nav > a { display:none; }
#nav li { position:relative; }
#nav li a { color:#555; display:block; font:600 12pt 'Open Sans'; transition:all 0.1s ease-in-out;  }
#nav li a.current { color:#009900; }
#nav li a:active { color:#555; transition:all 0.1s ease-in-out; background:#eee; }
#nav span:after{ width:0; height:0; border:0; content:''; vertical-align:middle; display:inline-block; position:relative; }

#nav > ul { padding:0; margin:0; }
#nav > ul > li{ display:inline-block; }
#nav > ul > li > a { margin:0 2px 0 0; padding:15px 25px; margin:0 0 0 -4px; text-transform:uppercase; text-align:center;   }
#nav > ul > li:hover > a,
#nav > ul:not(:hover) > li.active > a { color:#009900; background:#eee; }

#nav li ul { transition:all 0.25s ease-in-out; border:10px solid #eee; background:#eee; display:none; position:absolute; margin:0 0 0 -4px; padding:0; top:100%; width: 250px; list-style-type:none;}

#nav li:hover ul{display:block;left:0;right:0; transition:all 0.25s ease-in-out;  }
#nav li:not(:first-child):hover ul{ }
#nav li ul a{ display:block; padding: 10px 15px; border-bottom:1px solid #fff; font-weight:400; }
#nav li ul a:last-child {  }

#nav li ul li a:hover, #nav li ul:not(:hover) li.active a{ color:#009900;   }


#title-outline { position:relative; background:#F0F0F0; height:28px; margin:0; font:300 10pt 'Open Sans';line-height:28px; }


#bottom-outline { border-bottom:5px solid #009900; padding:20px 0; background:#3c3c3c; color:#ddd; }
#bottom-outline a { color:#ddd; }
#bottom-outline td { min-width:300px; padding:20px; }
#bottom-outline h3,#bottom-outline p { margin:0; padding:0;color:#ddd;  }


#main-outline .form table { width:90%; text-align:left;}
button,.button { margin:10px; padding:10px 15px; background:#009900; color:#fff; border:1px solid #009900; text-transform:uppercase;font: normal 14pt 'Dosis';  }
button:hover,.button:hover { cursor:pointer; text-decoration:none; background:#fff; color:#009900; border:1px solid #009900; }
.button {margin:15px 0; padding:6px 15px;}

#main-outline input, #main-outline textarea,select { width:100%; padding:5px; border:1px solid #ccc; margin:10px; font: normal 12pt 'Open Sans';}
#main-outline input[type="checkbox"] ,#main-outline input[type="radio"]{ width:32px; }
.boxx1 { width:32px;}
.boxx2 { position:relative; padding:5px; width:calc(100% - 52px); height:32px; }
.checkboxx { position:relative; display:inline-flex; width:50%; }
.row { display:flex; border-top:1px solid #009900; padding:10px; }
label { width:25%; font-weight:600; }
.row > div { width:75%; }


table img { width:200px; min-width:200px; height:auto; margin:0 15px 15px 0; }
table,tr,td { border:0; vertical-align:top;}
  

#osmmap { width:100%;height:400px; background:#f0f0f0; border-bottom:5px solid #009900; margin-bottom:9px;} 


#main { position:relative; display:flex; background:#fff; margin:0; }
#content { padding:40px 0; min-height:500px;    }
#aside { width:66.66%;}
#aside ul,#aside li {list-style-type:none; margin:0; padding:0;}
#aside li { position:relative; display:inline-block; width:33.33%; padding:15px; }
#aside li a { opacity:0.9; position:relative; display:block; }
#aside li a div { position:absolute; bottom:30px; background:#009900; color:#fff; padding:5px;  }
#aside img {border-bottom:5px solid #009900;}
#aside li a:hover { opacity:1;  }
#aside li a:hover div {color:#ffff00;}


#main p { margin: 0 0 9px; hyphens:auto; }
#main h2,#main h3 { padding-top:0 0 20px 0; margin:0 0 20px 0; } 
 
.list_entry { border:1px solid #009900; padding:15px; background:#fff; display:inline-block; width:calc(50% - 20px); margin:10px; }
.list_entry h3 { margin:0; padding:0; }
p.lighttext { color:#888; font-size:90%; }
 



/**************** SMARTPHONE *****************/

 

@media only screen and (max-width:800px) {
 body { padding-top:44px;  } 

.list_entry, #jobs > div { width:100%; display:block; margin:10px 0; }  
#nav { 					position:fixed; background:#eee; margin:0; float:none; top:0; left:0; width:100%; max-width:100%; }
#nav:before { 				position:relative; margin:0; color:#009900; float:left; top:0; left:0; padding:0 20px; content:'BRUNS-TEAM-ARBEIT'; line-height:44px; }

#nav > a{					width:44px;height:44px; text-align:right; float:right; text-indent:-9999px; background-color:#009900; position:relative; }
#nav > a:before, #nav > a:after{		position:absolute; border:2px solid #fff;top:35%;left:25%;right:25%;content:'';}
#nav > a:after{				top:60%; }
#nav > ul > li{				width:100%; float:none; padding:0; margin:0; display:block; background:#fff;  }
#nav > ul > li:hover > a,
#nav > ul:not(:hover) > li.active > a,
#nav > ul > li > a{ 				padding:0; margin:0; background:#fff; height:36px; line-height:36px; color:#009900; }
#nav > ul > li:not(:last-child) > a{   	border-right:none; border-bottom:1px solid #dadada;}
#nav > ul > li:hover > a,
#nav > ul:not(:hover) > li.active > a { 	background:#009900; color:#fff; }
#nav > ul {					list-style-type:none; padding:0; margin:44px 0 0 0; height:auto; display:none; position:absolute; left:0; right:0;}
#nav:target > ul {				display:block;}
#nav li ul {					position:static; list-style-type:none; width:100%; border:0; }
#nav li ul a:last-child,
#nav > li > ul > li > a {          	border:0; border-bottom:1px solid #009900; text-align:center; }
#nav:not(:target) > a:first-of-type,#nav:target > a:last-of-type { display:block; }
#nav > ul > li:hover > a,
#nav > ul:not(:hover) > li.active > a { 	border-bottom:1px solid #009900; }
#top-center  { display:none; }
.checkboxx  { width:100%; }
td, td img,label,.row > div,#aside,#content,#aside li,.row{ display:block; width:100%;float:none;}
}



@media only screen and (max-width:600px) { 
#main-outline { hyphens:auto; }
 body {   } 
#title-outline,#top-contact { display:none; }
.flex { display:block; width:100%; }
}