/* normalize */
html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
body { margin: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }
audio:not([controls]) { display: none; height: 0; }
[hidden], template { display: none; }
a { background-color: transparent; color:#e3ecd9; }
a:active, a:hover { outline: 0; color:#3a4946;}
abbr[title] { border-bottom: 1px dotted; }
b, strong, .bold { font-weight:700; }
dfn { font-style: italic; }
mark { background: #ff0; color: #000; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
img {border: 0;}
svg:not(:root) { overflow: hidden; }
hr { box-sizing: content-box; height: 0; }
pre { overflow: auto; }
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
input { line-height: normal; -webkit-appearance: none; border-radius: 0;}
select { border-radius: 0;}
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="checkbox"] {-webkit-appearance: checkbox;}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; border-radius: 0;-webkit-appearance: none !important;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
legend { border: 0;  padding: 0; }
textarea { overflow: auto; }
optgroup { font-weight: bold; }
table { border-collapse: collapse; border-spacing: 0;}
td, th { padding: 0; }
::-moz-selection {background: #b7e6f8; text-shadow: none; }
audio, canvas, iframe, svg, video { vertical-align: middle; }
img { vertical-align: top; }
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }
.hidden, .invisible { display: none !important; }
.clearfix:before, .clearfix:after { content: " ";  display: table; }
.clearfix:after, .clear { clear: both; }
/* nur safari */
* {-webkit-tap-highlight-color: rgba(0,0,0,0);}
svg:not(:root) { overflow: hidden; }

/* allgemein */
* { margin:0; padding:0; border:0; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
html,body { height:100%; width:100%; font-size: 100%}
html { font-size:100%; }
a {text-decoration:none; -webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out; display:inline-block; }
*:focus  { outline: 0; }
ul, ol { margin: 0; padding: 0 ; }
nav ul, ul { list-style: none; list-style-image: none;list-style-position: outside;}
.home-li li::before {position:relative;}
main li {position:relative; padding-left:12px;margin-bottom:8px;}
main li:before { content:''; display:inline-block; height:10px; width:10px; background-image:url('../pix/dot.svg'); background-size:contain; background-repeat:no-repeat; padding-left:10px;} 

.transit, input.submit {-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}

/* BITV */
ul#skip {position: absolute;top: -6000px;left: -6000px;height: 1px;width: 1px;}

/************** ICON SITES *****************/
@font-face { font-family: 'icomoon'; src:  url('fonts/icomoon.eot?b2v1di'); src:  url('fonts/icomoon.eot?b2v1di#iefix') format('embedded-opentype'), url('fonts/icomoon.ttf?b2v1di') format('truetype'), url('fonts/icomoon.woff?b2v1di') format('woff'), url('fonts/icomoon.svg?b2v1di#icomoon') format('svg'); font-weight: normal;  font-style: normal; }
[class^="icon-"], [class*=" icon-"], .icon { font-family: 'icomoon' !important;speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.icon-haus:before, .icon-sonder:before, .icon-miethaus:before, .icon-kran:before, .icon-2014:before, .icon-598:before, .icon-276:before {color:#a6c94f;font-size:11.25em;-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
.icon-haus:before { content: "\e905";}
.icon-sonder:before { content: "\e90d"; }
.icon-miethaus:before { content: "\e90b"; }
.icon-kran:before { content: "\e906"; }
.icon-2014:before { content: "\e902"; }
.icon-598:before { content: "\e901"; }
.icon-276:before { content: "\e900"; }
.icon-haken:before { content: "\e903"; }
.icon-lupe:before { content: "\e904"; }
.icon-pfeil:before { content: "\e90c"; }
.icon-vor:before { content: "\e90c"; }
.icon-back:before { content: "\e90c";}
.icon-li:before { content: "\e907"; }

/************** FONTS *****************/
@font-face {font-family: 'monsthin';src: url('fonts/montserrat-thin-webfont.eot');src: url('fonts/montserrat-thin-webfont.eot?#iefix') format('embedded-opentype'),url('fonts/montserrat-thin-webfont.woff2') format('woff2'),url('fonts/montserrat-thin-webfont.woff') format('woff'),url('fonts/montserrat-thin-webfont.ttf') format('truetype'),url('fonts/montserrat-thin-webfont.svg#open_monsthin') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'monsreg';src: url('fonts/montserrat-regular-webfont.eot');src: url('fonts/montserrat-regular-webfont.eot?#iefix') format('embedded-opentype'),url('fonts/montserrat-regular-webfont.woff2') format('woff2'),url('fonts/montserrat-regular-webfont.woff') format('woff'),url('fonts/montserrat-regular-webfont.ttf') format('truetype'),url('fonts/montserrat-regular-webfont.svg#open_monsreg') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'sansbold';src: url('fonts/opensans-bold-webfont.eot');src: url('fonts/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'),url('fonts/opensans-bold-webfont.woff2') format('woff2'),url('fonts/opensans-bold-webfont.woff') format('woff'),url('fonts/opensans-bold-webfont.ttf') format('truetype'),url('fonts/opensans-bold-webfont.svg#open_sansbold') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'sanslight';src: url('fonts/opensans-light-webfont.eot');src: url('fonts/opensans-light-webfont.eot?#iefix') format('embedded-opentype'),url('fonts/opensans-light-webfont.woff2') format('woff2'),url('fonts/opensans-light-webfont.woff') format('woff'),url('fonts/opensans-light-webfont.ttf') format('truetype'),url('fonts/opensans-light-webfont.svg#open_sanslight') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'sansreg';src: url('fonts/opensans-regular-webfont.eot');src: url('fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),url('fonts/opensans-regular-webfont.woff2') format('woff2'),url('fonts/opensans-regular-webfont.woff') format('woff'),url('fonts/opensans-regular-webfont.ttf') format('truetype'),url('fonts/opensans-regular-webfont.svg#open_sansregular') format('svg');font-weight: normal;font-style: normal;}

body { font-family: 'sansreg', sans-serif; font-weight:300; color:#586b67; font-size:14px; line-height:24px;}
.bodygr {background:#bfcec6;}

h1, h2, h3, h4, h5, h6 { text-transform:uppercase;font-family:'monsthin';}
h1 {font-size:50px; line-height:40px; letter-spacing:1px;margin:0;}
h2 {font-size:30px; line-height:30px; letter-spacing:1px; margin-bottom:20px;}
h3 {font-size:22px; line-height:22px; letter-spacing:1px;}
h4 {font-size:20px; line-height:22px; letter-spacing:1px; margin-bottom:15px;}

/* allgemein */
.hell {color:#e3ecd9;}
.gray {color:#586b67;}
.dklgray {color:#3a4946;}
.green {color:#929d38;}
.greenhell {color:#bfcec6;}
.blue {color:#20baba;}
.bluhell {color:#d4ccc5;}
.orange {color:#ae5d23;}
.orangehell {color:#d4ccc5;}
.white {color:#fff;}

.space100 {padding-bottom:100px;float:left;width:100%;}

/* allgemein */
.center {max-width:1280px; margin:0 auto; position:relative; padding:0 20px;}
.wrap {opacity:0;}
.transit, input.submit {-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
.loading {position:fixed; top:50%; left:50%; margin:-40px 0 0 -40px; width:80px; height:80px; background:url(../methodpix/logoicon.png) no-repeat center center; -webkit-animation-duration: 1s; animation-duration: 1s;  -webkit-animation-fill-mode: both;  animation-fill-mode: both; -webkit-animation-name: pulse; 	animation-name: pulse;	-webkit-animation-iteration-count: infinite;}
@-webkit-keyframes pulse {  0% { -webkit-transform: scale(0.7); } 50% { -webkit-transform: scale(1.0); } 100% { -webkit-transform: scale(0.7); } }
@keyframes pulse {  0% { transform: scale(0.7); } 50% { transform: scale(1.0); } 100% { transform: scale(0.7); } }
.no-js .wrap {opacity:1;}
.no-js .loading {display:none;}

header {margin-bottom:50px;}
.homer {position:relative; width:100%;background-image:url('../pix/header_bg.jpg');background-repeat: no-repeat;background-size: cover;}
.headpic {position:absolute; width:100%;z-index:2;}

#allwhidth {width:100%;z-index:999;float:left;position:relative;background:rgba(143, 160, 153, 0);-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
#navi {width:100%;margin-top:30px;float:left;background-color:transparent;}
header #loga {float:left;position:relative;width:166px;height:80px;margin-bottom: 10px;}
header #logo {position:relative;width:166px;height:80px;text-indent:-1000px;-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}

header .loggreen {background:url('../pix/sichtweiten_logo.svg') no-repeat;}

.navkl {margin-top:8px!important;}
.navbg {background:rgba(255, 255, 255, 0.7);}
.sticky {position:fixed!important;width:100%;margin-top:0!important;background:rgba(143, 160, 153, 0.9)!important;}
.stickmarg {margin-top:90px;}

/* ################# navigation ################# */
.navigation {float:right;position:relative; z-index:1000; font-weight:300;font-family:'sanslight';font-size:16px; color:#e3ecd9; text-transform:uppercase; letter-spacing:0.5px;}
.main_nav li {float:left; margin-right:1px; position:relative;}
.main_nav li:last-child {margin-right:0;}
.main_nav li a { padding:20px; color:#e3ecd9;display:block;border-bottom:1px solid rgba(227, 236, 217, 0);border-top:1px solid rgba(227, 236, 217, 0);background:rgba(227, 236, 217, 0);}
.main_nav li:hover a, .main_nav li.trail a {border-bottom:1px solid rgba(227, 236, 217, 1);border-top:1px solid rgba(227, 236, 217, 1);color:#586b67;background:rgba(227, 236, 217, 0.1);}
.main_nav li.active .active {padding:20px;border-bottom:1px solid #e3ecd9;border-top:1px solid rgba(227, 236, 217, 0);color:#586b67;display:block;}
.main_nav .level_2 li.active .active {padding:0 20px 0 20px;}
.main_nav .level_2 {position:absolute;display:none;transition: transform 250ms ease-in-out;background:#fff;}
.main_nav li:hover .level_2 {display:block;opacity: 1;animation-name: fadeInOpacity;animation-iteration-count: 1;animation-timing-function: ease-in;animation-duration: 0.4s;}
 @keyframes fadeInOpacity {0% {opacity: 0;} 100% {opacity: 1;}}
.main_nav .level_2 li {border-bottom:1px solid #dfe0c9; font-size:14px;line-height:60px;display:block;width:100%; margin-right:0;white-space:nowrap;}
.main_nav .level_2 li:first-child {border-top:1px solid #fff;}
.main_nav .level_2 li:last-child {border-bottom:none;}
.main_nav .level_2 li a { color:#4b5053; background:rgba(255,255,255,0.9); padding:0 20px 0 20px;}
.main_nav .level_2 li.trail a { color:#e3ecd9; background:#e3ecd9;}
.main_nav .level_2 li a:hover { color:#e3ecd9; background:#e3ecd9; }
/* hamburger */
label.hamburg {display: none;z-index:1001;background: none; width: 59px; height: 50px; position:absolute; top:0; right:25px; cursor:pointer; margin-left: auto; margin-right: auto;border-radius: 4px; }
input#hamburg {display:none}
.line { position: absolute; left:2px;height: 6px; width: 55px; background: #e3ecd9;display: block; transition: 0.5s; transform-origin: center; }
label.hamburg:hover .line {background: #586b67;}
.line:nth-child(1) { top: 12px; }
.line:nth-child(2) { top: 24px; }
.line:nth-child(3) { top: 36px; }
.line:nth-child(1).rotated {transform: translateY(12px) rotate(-45deg); -webkit-transform: translateY(12px) rotate(-45deg); -moz-transform: translateY(12px) rotate(-45deg); -o-transform: translateY(12px) rotate(-45deg);transition-duration:0.2s;}
.line:nth-child(2).rotated {opacity:0;}
.line:nth-child(3).rotated {transform: translateY(-12px) rotate(45deg); -webkit-transform: translateY(-12px) rotate(45deg); -moz-transform: translateY(-12px) rotate(45deg); -o-transform: translateY(-12px) rotate(45deg);transition-duration:0.2s;}

/********** HEADERBILD **********/
.header_image {position:relative;}

.hicont {max-height:450px;}
.header_image img {position:relative; width:100%; height:auto;}
.slogan {position:absolute; top:50%;right:15%;text-align:left;color:#e3ecd9; z-index:100; }
.slogan1, .slogan2 {font-family: 'monsthin';font-weight:700; font-size:70px; line-height:60px;letter-spacing:1.7px; display:none;text-align:right;}
.slogan3 {font-family: 'monsreg';font-weight:400; font-size:18px; margin-top:10px; display:none;text-transform:uppercase;text-align:right;}

.onscroll { opacity: 1; -webkit-transition: opacity .7s ease-in, margin-top .7s ease-out; transition: opacity .7s ease-in, margin-top .7s ease-out; }
.onscroll-hidden { opacity: 0; margin-top:0; }

.go_top {position:fixed; right:20px; bottom:20px; width:35px; height:35px; background:#e3ecd9; z-index:999; text-align:center; display:none;}
.go_top:hover {background:#586b67;}
.go_top .arrow {width:18px; height:18px; border-top:3px solid #586b67; border-left:3px solid #586b67; position:absolute; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg);-o-transform: rotate(45deg);-webkit-transform: rotate(45deg); top:12px; left:9px;}
.go_top:hover .arrow {border-top:3px solid #e3ecd9; border-left:3px solid #e3ecd9;}

/* ################# MAIN ################# */
main {position:relative;width:100%;z-index:20;}
img {width:100%; height:auto;}

/* ################# STARTKREISE ################# */
.kreise {width:100%;position:relative;margin-bottom:80px;}
.kreiscont {width:90%;margin:0 auto;}
.kreise h1 {font-size:36px;}

.kreis1, .kreis2, .kreis3 {z-index:30;width:33%;float:left;margin-bottom:30px;position:relative;border-radius:50%;opacity:0.7;-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
.kreis1 {margin-left:-4%;margin-top:-100px;text-align:center;}
.kreis2 {margin-left:5%;}
.kreis3 {margin-left:-6%;margin-top:40px;}
.kreis1, .kreishead {background: -prefix-linear-gradient(left top,#b5bf5b, #99a71f);background: linear-gradient(to bottom right, #b5bf5b, #99a71f);}
.kreis2, .kreisheadblue {background: -prefix-linear-gradient(left top, #68d2d4, #11a9ab);background: linear-gradient(to bottom right, #68d2d4, #11a9ab);}
.kreis3, .kreisheadorange {background: -prefix-linear-gradient(left top, #d2a162, #cb7506);background: linear-gradient(to bottom right, #d2a162, #cb7506);}
.kreis1:hover, .kreis2:hover, .kreis3:hover {opacity:1;z-index:32;scale:1.1;}
.texti {color:#ffffff;text-align:center;font-size 16px;line-height:24px;padding:60px 25px; 30px;opacity:1!important;}
.texti ul {margin:20px 0 20px;text-align:center;}
.texti ul li {margin-bottom:2px;}
.mehr {padding:6px 15px;border:1px solid #e3ecd9;border-radius:6px;width:100px;margin:0 auto;background:transparent;-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
.mehr:hover {background:rgba(227,236,217,0.4);color:#586b67;}


.headtxt {position:relative;max-width:1000px;margin:0 auto;}
.headtxtblau {text-align:left;background-color:#f2f5f7;border-left:8px solid #003b61;padding:60px 80px 30px;}
.headtxtblau li:before {content:"\e907"; position:absolute; left:0;font-family: 'icomoon' !important;color:#003b61;font-size:11px;} 
.headtxtblau h1 {margin:0 0 50px;color:#003b61;}
.headtxtblau {margin-bottom:80px;}
.headtxt h1 {margin:100px 0 10px;text-align:center;}
.headtxt h2 {text-align:center;margin:0 0 50px;}
.headtxt p {margin:0 0 15px;font-size:18px;line-height:26px;}
.headtxt .teas {font-size:22px;line-height:34px;}
.headtxt ul {margin:0 0 80px;}

.left {width:48%; float:left; padding-right:15px;}
.right {width:48%; float:right; padding:0 20px 0 15px;}

.curve {background:#bfcec6;width:100%;height:auto;margin-top:50px;}
.curve img {vertical-align:bottom;}
.kreishead, .kreisheadblue, .kreisheadorange {float:left;margin:5% 20px;position:relative;border-radius:50%;padding:5% 0;z-index:60;}

/* ################# INHALTSSEITEN ####################################### */
.conthead {position:relative;width:100%;float:left;}
.contperson {position:relative;background:url('../pix/personlichberatung.svg');width:1240px;height:170px;}
.contheadpic {position:absolute;width:100%;}
.contheadline {position:relative;color:#fff;font-size:30px;padding:8% 12% 7%;}
.subtext {font-size:20px;line-height:30px;color:#e6f4ed;text-transform:uppercase;float:left;padding:2% 20% 4%;}
.subtextmini {font-size:14px;text-transform:none;}

.inhaltbox {padding:0% 0% 2% 12%;width:100%;float:left;margin-bottom:80px;}
.text {width:100%;float:left;}
.textlinks {width:60%;float:left;padding:0% 4% 3% 0%;}
.bildrechts {width:40%;float:right;padding:0%}

.textrechts {width:60%;float:right;padding:0% 0% 3% 4%;}
.bildlinks {width:40%;float:left;padding:0%}

.txtcenter {text-align:center;}
.specbutt {width:40%;}
.specbutt a {margin:30px 0;background-color:#a6c94f;color:#fff;border:1px solid #a6c94f;padding:10px 30px;text-transform:uppercase;}
.specbutt a:hover {background-color:#fff;color:#003b61;border:1px solid #003b61;}


/* ACCORDION */
.ce_rsce_team {width:24%;position:relative;float:left;}
.ce_rsce_team {margin:0 1% 2% 0;}
.ce_rsce_team:last-child {margin:0 0 10% 0;}
.ce_rsce_gesch {width:48%;position:relative;float:left;}
.ce_rsce_gesch {margin:0 4% 3% 0;}
.ce_rsce_gesch:nth-child(2), .ce_rsce_gesch:nth-child(4), .ce_rsce_gesch:nth-child(6), .ce_rsce_gesch:nth-child(8) {margin:0 0 10% 0;}
.ce_accordion { /* background:rgba(177,201,79,1);color:#fff; */position:relative;margin-bottom:20px;/* width:100%; */-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
.toggler {background:rgba(177,201,79,1);color:#fff;text-align:center;padding:15px;width:100%; top:0;font-size:16px;cursor:pointer;-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;position:relative;}
.toggler:hover {background:rgba(243,243,243,1);color:#4b5053;}
.accbox:hover .togglerxx, .ce_accordion .toggler.on, .ce_accordion.on, .accbox:hover .ce_accordion {background:rgba(243,243,243,1);color:#003b61;}
.toggler.on {border-bottom:none;}
.toggler:after {content: "\e90c"; font-family: 'icomoon' !important; position:absolute;top:20px;right:20px; -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); -webkit-transform: rotate(90deg);-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
.toggler.on:after {-moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); -webkit-transform: rotate(-90deg);}
.accordion {position:relative;color:#003b61;padding:30px 15px 15px; border-bottom:1px solid #e5ebef;background:rgba(243,243,243,1);}
.bluex {width:50%;background-color:#fff;border-left:8px solid #003b61;}
.bluex .toggler {background-color:#f2f5f7;color:#4b5053;}
.bluex .toggler:hover {background-color:#003b61;color:#fff;}
.bluex .accordion {padding: 15px 80px 20px;}
.bluex .accordion h3, .blue .accordion li:before, .blue .accordion li {color:#4b5053;}

/* KONTAKT */
.kontbox {width:50%;margin:0 auto;}
.kontbox h2 {margin:50px 0 40px;}
.form_box {margin:15px 0 20px;}
#kontaktformular input, #kontaktformular select { width:100%; border:1px solid #a6c94f; height:30px; line-height:30px; padding-left:5px; margin-bottom:10px;}
#kontaktformular label{height:30px; line-height:30px;display:block;}
#kontaktformular textarea {width:100%; height:150px; padding:5px; border:1px solid #a6c94f; margin-bottom:10px; -webkit-appearance: none; border-radius: 0;}
#kontaktformular input.captcha {width:50px; margin-right:10px;}
#kontaktformular button, .newslet button {border:1px solid #a6c94f; color:#fff; background:#a6c94f; float:none; width:150px; margin-top:20px;padding:12px 30px;}
#kontaktformular button:hover, .newslet button:hover {background:#003b61;}
.captcha_text { line-height:30px;}


/********** FOOTER **********/
footer {position:relative;width:100%;padding:50px 0;}
.footgre {background-color:#80918b;}

.fooleft, .fooright {width:48%;padding:0 0 20px;}
.fooleft p {width:90%;}
.fooleft {margin-right:2%;}
.fooleft, .fooright {float:left;color:#fff;margin-bottom:10%;}
.fooleft a, .fooright a {color:#d4e5dc;}
.fooleft a:hover, .fooright a:hover {color:#586b67;}
.fooright li a {margin-bottom:15px;padding:6px 15px;}

/****************************** MEDIAX **********************/

@media (max-width: 1024px) { 
    .kreiscont {width:100%;}
    .kreise h1 {font-size:30px;}
    .slogan1, .slogan2 {font-size:50px; line-height:48px;letter-spacing:1.2px;}
    .slogan3 {font-size:14px;}
    .kreis1, .kreis2, .kreis3 {width:48%;}
    .kreis3 {margin-top:-60px;margin-left:-20%;}
    .kreis1 {margin-top:-60px;}
    #loga {margin-top:8px;}
	.navigation {position:fixed; background:#bfcec6; margin-top:0; top:0; right:0; width:50%; max-height:100%;display:none;overflow: hidden; bottom:0;}
    label.hamburg {display: block;}
	.overflowbox { position: relative; top:64px; height: calc(100% - 100px); max-height: 100%; overflow:auto; }
	.main_nav {position: relative; margin-bottom:20px; font-weight:400;font-size:22px;}
	.main_nav li {float:none; margin-right:0; }
	.main_nav li:hover .level_2 {display:none;}
	.main_nav .level_2 li:first-child {border-top:none;}
	.main_nav li a { padding:30px 40px; background:none; color:#4b5053;border-bottom: 1px solid #e3ecd9;}
	.main_nav li a:hover {color:#e3ecd9; background:#586b67;}
	.main_nav li.active .active {padding:30px 40px; color:#e3ecd9; background:#586b67;}
	.main_nav .level_2 li.active .active { padding-left:30px;}
	.main_nav li.active .level_2, .main_nav li.trail .level_2 {display:block; position:relative; width:100%;}
	.main_nav .level_2 li, .main_nav .level_2 li:last-child {border:none; text-transform:none; font-size:16px; line-height:50px;}	
	.main_nav .level_2 li a { color:#586b67; background:none; padding:0 0 0 30px;background:rgba(255,255,255,0.2);}
	.main_nav .level_2 li.trail a { color:#e3ecd9; background:#586b67;}
	.main_nav .level_2 li a:hover { color:#e3ecd9; background:#586b67; }
	#navi {margin-top:0;}
}

@media (max-width: 768px) {
	header #logo {width:120px; height:58px;}
	header #loga {width:120px; height:58px;}
    .slogan1, .slogan2 {font-size:40px; line-height:35px;letter-spacing:1.1px;}
    .slogan3 {font-size:12px;}
    .subtext {padding:2% 12% 4%;}
    .contheadpic {display:none;}
	.navigation {width:100%;}
	.overflowbox {height: calc(100% - 80px); }
	.main_nav .level_2 {text-transform:none;}
	h1 {font-size:34px; line-height:36px; }
	h2 {font-size:25px; line-height:26px; }
	h4 {font-size:18px; line-height:20px; }
	.foomid, .fooright {width:48%;}
    .left {width:100%; float:none; padding-right:0;margin-bottom:20px;}
	.right {width:100%; float:none; padding:0;}
}

@media (max-width: 650px) {
    .kreis1, .kreis2, .kreis3 {width:94%;}
    .kreis1 {margin-left:0%;margin-top:-40px;}
    .kreis3 {margin-left:0%;}
    .textlinks {width:100%;padding:0 0 3% 0;float:left;}
    .bildrechts {width:80%;padding:0 0 5% 0;float:left;}
    .textrechts {width:100%;padding:0 0 3% 0;float:left;}
    .bildlinks {width:80%;padding:0 0 5% 0;float:left;}
    .inhaltbox {padding:0% 0% 2% 4%}
    .contheadline {padding:6% 4% 7%;}
    .subtext {padding:2% 8% 4%;}
    .contheadline {font-size:24px;word-wrap: break-word;}
	header .mod_search {display:none;}
	header .zuUG {display:none;}
	.slogan {top:40%;}
	.slogan1, .slogan2 {font-size:36px; line-height:36px;letter-spacing:1.4px;}	
}
@media (max-width: 500px) {
    .header_image img {opacity:0.2;}
	h1, h2 {font-size:30px; line-height:32px; }
	h3 {font-weight:400; }
	.navigation {font-size:18px; }
	.main_nav li { line-height:30px;}	
    .main_nav li.active .active, .karriere .main_nav li.active .active { padding-left:20px;}
	.main_nav li a, .main_nav .level_2 li.active .level_3, .main_nav .level_2 li.trail .level_3 { padding-left:20px;}
	.main_nav .level_2 li.active .active, .main_nav .level_2 li a { padding-left:40px;}
    .fooleft, .foomid, .fooright {width:100%;}
	.fooleft, .foomid {border-bottom: 1px solid #e3ecd9;}

	
}
@media (max-width: 460px) { 
    .bildrechts {width:100%;}
    .bildlinks {width:100%;}
    .slogan1, .slogan2 {font-size:30px;}
}
@media (max-width: 400px) { 
    .kreis1, .kreis2, .kreis3 {border-radius:15%;}
    .kreis1 {margin-left:0%;margin-top:0px;}
    .kreis2 {margin-left:0%;}
    .kreis3 {margin-left:0%;margin-top:0px;}
    .slogan1, .slogan2, .slogan3 {color:#415450;}
}














