@charset "UTF-8";

/* Colors */

.colorGreen{
    color:#d4d700;
}
.colorGray{
    color:#343f46;
}
.colorLightGray{
    color:#eaebec;
}
.colorBlue{
    color:#007ac8;
}


@font-face {
    font-family: "Akkurat";
    src: url("fonts/regular.woff") format("woff"), url("fonts/regular.svg") format("svg"), url("fonts/regular.eot") format("embedded-opentype");
}

@font-face {
    font-family: "Akkurat Bold";
    src: url("fonts/bold.woff") format("woff"), url("fonts/bold.svg") format("svg"), url("fonts/bold.eot") format("embedded-opentype");
}


@font-face {
    font-family: "Akkurat Light";
    src: url("fonts/light.woff") format("woff"), url("fonts/light.svg") format("svg"), url("fonts/light.eot") format("embedded-opentype");
}

@font-face {
  font-family: "arv-icons";
  src:url("fonts/arv-icons.eot");
  src:url("fonts/arv-icons.eot?#iefix") format("embedded-opentype"),
    url("fonts/arv-icons.woff") format("woff"),
    url("fonts/arv-icons.ttf") format("truetype"),
    url("fonts/arv-icons.svg#arv-icons") format("svg");
  font-weight: normal;
  font-style: normal;

}

[data-icon]:before {
  font-family: "arv-icons" !important;
  content: attr(data-icon);
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "arv-icons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon{
    font-family: "arv-icons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:100%;
}
.icon.downloads{
    font-size:300px;
    color:#eaebec;
}
.icon-arrow-d:before {
  content: "a";
}
.icon-arrow-l:before {
  content: "b";
}
.icon-arrow-r:before {
  content: "c";
}
.icon-arrow-u:before {
  content: "d";
}
.icon-door:before {
  content: "e";
}
.icon-key:before {
  content: "f";
}
.icon-credit:before {
  content: "g";
}
.icon-check:before {
  content: "h";
}
.icon-404:before {
  content: "i";
}
.icon-advanced:before {
  content: "j";
}
.icon-broken:before {
  content: "k";
}
.icon-computer:before {
  content: "l";
}
.icon-download:before {
  content: "m";
}
.icon-map:before {
  content: "n";
}
.icon-phone:before {
  content: "o";
}
.icon-shopping:before {
  content: "p";
}
.icon-puzzle:before {
  content: "q";
}
.icon-mouse:before {
  content: "r";
}
.icon-circle:before {
  content: "s";
}
.icon-menu:before {
  content: "t";
}
.icon-close:before {
  content: "u";
}
.icon-plug:before {
  content: "v";
}

*{
    margin:0;
    padding:0;
    border:0;
    outline:0;
     -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    *behavior: url(boxsizing.htc);  
} 
html,body{
    font-family: "Akkurat",arial,sans-serif;
    text-align:center;
    font-size:1em;
    width:100%;
    line-height:1.2em;
    color:#343f46;
}
a{
    color:#343f46;
    text-decoration:none;
}

h1,h2,h3,h4{
    font-weight: normal !important;
}
.container{
    max-width:1300px;
    min-width:280px;
    width:100%;
    margin:auto;
    text-align:left;
    padding:0 60px 0 60px;
}
figure{
    margin:0;
    font-size:0;
    line-height:0;
}
section{
    width:100%;
}
input[type="text"],
input[type="email"],
textarea{
    padding:8px;
    display:block;
    width:100%;
    margin-bottom:6px;
    font-size:0.9em;
    line-height: 1.2em;
    height:34px;
}
.button{
    color:#FFF;
    background-color:#999fa2;
    display:inline-block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius:5px;
    padding:10px 20px 10px 20px;
}
.button:after {
  content: "c";
  font-family: "arv-icons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:0.6em;
  line-height:1.1em;
  margin-left:4px;
}
#headerMenu{
    float:right;
    margin-top:100px;
    list-style:none;
    list-style-type: none;
}
ul#headerMenu ul{
    background-color:#FFF;
    position:absolute;
    top:30px;
    z-index:100;
    list-style:none;
    list-style-type: none;
    -moz-border-radius:4px; /* Firefox */
    -webkit-border-radius:4px; /* Chrome, Safari */
    -khtml-border-radius:4px; /* Konqueror */
    border-radius:4px; /* CSS3 */
    behavior:url(border-radius.htc); /* Internet Explorer */    
    -webkit-box-shadow: 0px 0px 6px 0px rgba(50, 50, 50, 0.4);
    -moz-box-shadow:    0px 0px 6px 0px rgba(50, 50, 50, 0.4);
    box-shadow:         0px 0px 6px 0px rgba(50, 50, 50, 0.4);
    display:none;
}
#headerMenu li{
    float:left;
    position:relative;
    height:30px;
}
#headerMenu li li{
    float:none;    
    padding:4px;
    height:auto;
    white-space: nowrap;
}
#headerMenu li li:first-child{
    padding-top:10px;
}
#headerMenu li li:last-child{
    padding-bottom:10px;
}
#headerMenu li:hover ul{
    display:block;
}
#headerMenu li a{
    display:block;
    padding:0 8px 0 8px;
    color:#000000;
    text-decoration:none;
}
#headerMenu li li a{
    display:block;
    padding:0 8px 0 8px;
    color:#343f46;
    text-decoration:none;
    font-size:0.8em;
}
#headerMenu li a.active{
    color:#007ac8;   
}
#headerMenu li li a:hover{
    color:#007ac8;   
}
#headerMenu li a:after {
  font-family: "arv-icons" !important;  
  content: "a";
  margin-left:5px;
  font-size:0.6em;
  color:#bababa;
}
#headerMenu li li a:after,
#headerMenu li:last-child a:after {
 display:none;
}
#headerMenu li:first-child {
    display:none;
}
#headerMenu li li:first-child {
    display:block;
}

#pageslide{
    background-color:#FFF;
    color:#343f46;
    text-align:left;
    box-shadow: inset -25px 0px 25px -25px rgba(0,0,0,0.45);
    padding: 0px;
}
#pageslide #headerMenu li:first-child {
    display:block;
}
#pageslide #headerMenu{
    float:none;
    margin-top:20px;
}
#pageslide ul#headerMenu ul{
    position:static;
    top:0px;
    z-index:0;
    -moz-border-radius:0px; /* Firefox */
    -webkit-border-radius:0px; /* Chrome, Safari */
    -khtml-border-radius:0px; /* Konqueror */
    border-radius:0px; /* CSS3 */
    -webkit-box-shadow: none;
    -moz-box-shadow:    none;
    box-shadow:         none;
    display:block;
    margin-top:10px;
    
}
#pageslide #headerMenu li{
    float:none;
    border-bottom:1px solid #e5e5e5;
    padding:20px;
     height:auto;
}
#pageslide #headerMenu li li{
    border-bottom:0;
    padding:2px 0 2px 0;
}
#pageslide #headerMenu li a{
    display:block;
    padding:0px;
    text-decoration:none;
    color:#007ac8;
}
#pageslide #headerMenu li li a{
    color:#343f46;
}
#pageslide #headerMenu li a:after {
    display:none;
}
#headerLogo{
    padding:40px 0 30px 0;
}
#top{
    background:#a5b6c6 url(../images/top_slogan_background_line.png) top left no-repeat;
    background-size:50% 31px;
    border-bottom:6px solid #d4d700;
    position:relative;
    
}
#topImage{
    margin:0 -60px 0 -60px;
}
#topImage img{
    max-width:1300px;
    width:100%;    
}
#topHeadline{
    position:absolute;
    bottom:0;
    background:#d4d700;
    padding:18px 28px 10px 28px;
    /* width:480px; 
    min-width:280px;
    */
    font-size:1.875em;
    line-height:1.2em;
    
}
#topSlogan{
    background:transparent url(../images/top_slogan_background.png) right top no-repeat;
    color:#FFFFFF;
    margin-left:-60px;
    padding:6px 40px 6px 60px;
    font-size:0.9em;   
    display:inline-block;
    background-size:auto 100%;
    position:absolute;
    top:0;
    z-index:10;
    min-width:260px;
}

#bottom{
    background:#ffffff;
    padding:50px 0 50px 0;
    clear:both;
}
#bottom_start{
    background:#eaebec;
    padding:50px 0 50px 0;
    clear:both;
}


.bottomBox{
    display:block;
    width:30%;
    margin-right:5%;
    float:left;
    background-color:#ffffff;
    height:auto;
    position:relative;
    min-width:240px;
    cursor:pointer;
    // min-height:122px;
    height:116px;
}

.nolinks .bottomBox{
    cursor:default;
}
.bottomBoxIcon{
    width:35%;
    float:left;
    background-color:#d4d700;
    height:100%;
    display:block;
    position:absolute;   
    text-align:center;
    vertical-align: middle;
    height:116px;
    width:116px;
}
.bottomBoxIcon2{
    width:25%;
    float:left;
    background-color:#d4d700;
    height:100%;
    display:block;
    position:absolute;   
    text-align:center;
    vertical-align: middle;
    height:80px;
    width:80px;
	background:#d4d700 url(/images/check.svg) no-repeat center center;
	background-size:40px;
}
.bottomBoxIcon i {
    color: #fff;
    font-size: 60px;
    font-style: normal;
    left: 0;
    margin-top: -30px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%;
}
.bottomBoxText{
    float:left;
    width:65%;
    margin-left:35%;
    padding-left:10px;
}
.bottomBoxText2{
    float:left;
    width:75%;
    margin-left:25%;
    padding-left:10px;
}
#bottom_start .bottomBoxText{
    padding:20px 10px 10px 10px;
}
.bottomBox h3{
    font-size:1.5em;
    font-weight:normal;
    margin-bottom:12px;
}
.bottomBox p{
    color:#656e73;
    font-size:0.875em;
    line-height:1.1em;
}



.servicesBox{
    display:block;
    width:46%;
    float:left;
    background-color:#ffffff;
    height:auto;
    position:relative;
    min-width:240px;
    min-height:122px;
    margin-bottom:60px;
    cursor:pointer;
}
.servicesBox.left{
    margin-right:8%;
}
.servicesBoxIcon{
    width:35%;
    float:left;
    background-color:#d4d700;
    height:100%;
    display:block;
    position:absolute;   
    text-align:center;
    vertical-align: middle;
    height: 116px;
    width: 116px;
}
.servicesBoxIcon i {
    color: #fff;
    font-size: 60px;
    font-style: normal;
    left: 0;
    margin-top: -30px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%;
}
.servicesBoxText{
    float:left;
    width:65%;
    margin-left:120px;
    padding-left:10px;
}
#bottom_start .servicesBoxText{
    padding:10px;
}
.servicesBox h3{
    font-size:1.5em;
    font-weight:normal;
    margin-bottom:12px;
}
.mainRight .servicesBox p{
    color:#656e73;
    font-size:0.875em;
    line-height:1.2em;
    margin-bottom:0;
}


footer{
    background:#343f46;
    color:#eaebec;
}
footer a{
    color:#eaebec;
    text-decoration:none;
}
footer .container{
    padding-top:40px;
    padding-bottom:40px;    
}
#footerLogo{
    float:right;
}
#footerMenu{
    margin-top:0px;
    list-style:none;
    list-style-type: none;
    display:block;
}
#footerMenu li{
    float:left;
}
#footerMenu li a{
    display:block;
    padding:0 10px 0 10px;
    color:#eaebec;
    text-decoration:none;
    margin-bottom:10px;
}
#footerMenu li:first-child a{
    padding:0 10px 0 0px;    
}
#footerMenu li a.active{
    color:#d4d700;   
}

#footerCopyright{
    display:block;
    width:70%;
    border-top:1px solid #eaebec;
    padding-top:10px;    
    clear:left;
    font-size:0.8em;
}
.mainRight{
    max-width:770px;
    width:65%;
    float:right;    
}
.mainLeft{
    max-width:266px;
    width:100%;   
}
#historie .mainRight{
    max-width:770px;
    width:65%;
    float:left;    
}
#historie .mainLeft{
    width:35%; 
    float:left;
    max-width:none;
}
.mainLeft img{
    max-width:356px;
    width:100%;
}
#startContact{
    width:100%;
    height:416px;
    background-color:#eaebec;
    display: inline-block;
}
#main.vereine{
    background-color:#57727b;
    clear:both;
}
#main.verbaende{
    background-color:#60676f;
    clear:both;
}
#main .container{
    padding-top:70px;
    padding-bottom:70px;    
}

.mainRight p{
    margin-bottom:25px;
    font-size:0.875em;
    line-height:1.3em;    
}
.mainRight h2{
    margin-bottom:25px;
    font-weight:normal;
    font-size:1.5em;
    line-height:1.2em;    
}

#mainFull p{
    margin-bottom:25px;
    font-size:0.9em;
    line-height:1.4em;    
}
#mainFull h2{
    margin-bottom:15px;
    font-weight:normal;
    font-size:1.5em;
    line-height:1.2em;    
}

#startContact h2{
    padding:16px;
    font-size:1.2em;
    font-weight:normal;
}
#startContactPhone{
    background-color:#343f46;
    color:#FFFFFF;
    font-size:1.4em;
    line-height:1.3em;
    padding:4px 0px 4px 16px;
}
#startContactPhone a{
    color: #ffffff;
    text-decoration:none;
}
#startContactPhone:before {
  content: "o";
  font-family: "arv-icons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:1.2em;
  color:#d4d700;
  float:left;
  line-height:1.1em;
  margin-right:4px;
}
#startContactForm{
    padding:16px;
}

#startContactForm button{
    display:block;
    padding:8px;
    background-color:#d4d700;
    width:47%;
    float:right;
    max-width:104px;
}
#startContactForm label{
    display:block;
    padding:8px;
    background-color:#FFFFFF;
    width:47%;
    margin-right:6%;
    position:relative;  
    cursor:pointer;
    max-width:104px;
}
#startContactForm label[for="frmCallback"] {
    line-height:1.2em;
}


#startContactForm input[type="checkbox"]{
    margin-right:4px;
}
#startContactForm textarea{
    height:90px;
    margin-bottom:12px;
}

#startContactForm button:after {
  content: "c";
  font-family: "arv-icons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:0.6em;
  color:#343f46;  
  line-height:1.1em;
  margin-left:4px;
}
.startBoxLeft{
    width:47%;
    float:left;
    margin-right:6%;
    position:relative;
}
.startBoxRight{
    width:47%;
    float:left;
    position:relative;
}
.startBoxRight img,
.startBoxLeft img{
    width:100%;
    display:block;
}
.startBoxDescription{
    position:absolute;
    padding:15px;
    text-align:center;
    width:100%;
    bottom:0;
    color:#FFFFFF;
    background-color:#343f46;
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    /* IE 5-7 */
    filter: alpha(opacity=80);
    /* Netscape */
    -moz-opacity: 0.8;
    /* Safari 1.x */
    -khtml-opacity: 0.8;
    /* Good browsers */
    opacity: 0.8;
    font-size:1.2em;
}
.startBoxDescription a{
    display:block;
    color:#d4d700;
    text-decoration:none;
    font-size:0.75em;
    padding-top:4px;
}
.startBoxDescription a:after{
    content: "c";
  font-family: "arv-icons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:0.6em;
  color:#d4d700;  
  line-height:1.1em;
  margin-left:4px;
}
.showMobile{
    display:none;
}
.hideMobile{
    display:inline-block;
}
.open{
    text-decoration: none;
    padding-top:10px;
    display:none;
    width:100px;
}
.open:before{
    content: "t";
    font-family: "arv-icons" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1.5em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color:#9c9e9f;
    font-size:2em;
}
ul#downloads{
    list-style: none;
}
ul#downloads li{
    clear:left;  
    font-family: "Akkurat",arial,sans-serif;    
    border-top:1px solid #eaebec;
    padding-top:20px;
    margin-top:20px;
}
ul#downloads li h4{
    font-family: "Akkurat Bold",arial,sans-serif;
    font-weight:300;
}
ul#downloads li span{
    font-size:0.95em;
}
ul#downloads li a:before{
    content: "K";
    font-family: "arv-icons" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1.2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color:#d4d700;
    font-size:2em;
    float:left;
    margin-right:20px;
}

#serviceBox{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color:#f9f9f9;
    border:1px solid #e7e7e7;
    padding:25px 25px 0 25px;
}
.serviceBoxEntry{
   width:48%;
   float:left;
   height:130px;
   margin-bottom:30px;
   border-bottom:1px solid #e0e5ea;
}
.serviceBoxEntry.left{
   margin-right:4%;
   margin-bottom:0;
}
.serviceBoxEntry.last{
   border-bottom:0px solid #e0e5ea;
   margin-bottom:0;
}
.serviceBoxEntry h4{
    font-size:1.125;
    font-weight:normal;
    font-family: "Akkurat",arial,sans-serif; 
    margin-bottom:8px;
}
.serviceBoxEntry i{
    height:73px;
    width:73px;
    border:2px solid #c7ced2;   
    -webkit-border-radius: 73px;
    -moz-border-radius: 73px;
    border-radius:73px;
    display:block;
    float:left;
    margin-right:10px;
    color:#d4d700;
    font-size:30px;
    text-align:center;
}
.serviceBoxEntry i span{
   padding-top:50%;
   margin-top:-15px;
   display:block;
}
.serviceBoxEntry ul{
    margin-left:100px;
    color:#656e73;
}
.serviceBoxEntry ul li{
    font-family: "Akkurat",arial,sans-serif; 
    font-size:0.875em;
}
#submenu{
    padding:20px 0 20px 0;
}
#submenu select{
    display:none;
    padding:8px;
    border:1px solid #e1e2e4;
    width:70%;
    font-size: 0.875em;
    padding: 4px;
    height:28px;
}

#submenu ul{
    list-style: none;
}

#submenu ul li{
    float:left;
    padding:10px 0 10px 60px;
}
#submenu ul li:first-child{
    padding-left:0px;
}
#submenu .button{
    float:right;
    color:#FFF;
    background-color:#999fa2;
    display:block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius:5px;
    padding:10px 20px 10px 20px;
}
#submenu ul li a{
    color:#adb0b2;
}
#submenu ul li a.active{
    color:#343f46;
}
#submenu .button:after{
    font-family: "arv-icons" !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content:"c";
    font-size:0.75em;
    margin-left:4px;
}
.vereine{
    color:#FFF;
}
.vereine .ueberblick{
    background:transparent url(../images/vereine_1.jpg) right top no-repeat;
    height:443px;    
}
.vereine .zutrittssysteme{
    background:transparent url(../images/zutrittssysteme_1.jpg) right top no-repeat;
    height:443px;    
}
.vereine h2{
    font-size:2.25em;
    margin-bottom:0.5em;
    line-height:1em;
    max-width:360px;
    width:100%;
    font-weight: normal;
}
.vereine p{
    display:block;
    font-size:1.125em;
    line-height:1.4em;
    max-width:360px;
    width:100%;
    margin-bottom:1em;
}
.vereine .zutrittssysteme h2{
    max-width:540px;
}
.vereine .zutrittssysteme p{
    display:block;
    font-size:0.875em;
    line-height:1.3em;
    max-width:540px;
    width:100%;
    margin-bottom:1em;
}
.vereine .button{
    color: #343f46;
    background-color:#d4d700;
}
.vereine .champ-web{
    min-height: 440px;
}
.vereine .champ-web p{
    max-width:540px;
    width:100%;
    font-size:0.9em;
    line-height:1.2em;
}

.verbaende{
    color:#FFF;
}
.verbaende .ueberblick{
    background:transparent url(../images/verbaende_1.jpg) right top no-repeat;
    height:443px;    
}
.verbaende h2{
    font-size:2.25em;
    margin-bottom:0.5em;
    line-height:1em;
    max-width:510px;
    width:100%;
    font-weight: normal;
}
.verbaende p{
    display:block;
    font-size:1em;
    line-height:1.3em;
    max-width:510px;
    width:100%;
    margin-bottom:1em;
}
.verbaende .button{
    color: #343f46;
    background-color:#d4d700;
    margin-right:10px;
}
.vereine .button {
    margin-right: 10px;
}
.ipad{
    float:right;
    background: transparent url(../images/ipad.png) no-repeat;
    width:468px;
    height:366px;
    margin-top:-30px;
    position:relative;
}
.ipadButton{
    -webkit-border-radius: 160px;
    -moz-border-radius: 160px;
    border-radius:160px;
    width:160px;
    height:160px;
    position:absolute;
    top:170px;
    left:-80px;
    background-color:#d4d700;
    color:#343f46;
    text-align:center; 
    padding:20px;
    font-size:0.875em;
     z-index:100;
}
.ipadButton h4{
    font-size:1.75em;
    line-height:1em;
    font-weight:normal;
    margin-bottom:4px;
}
.ipadZoom{
    position:absolute;
    top:50%;
    left:50%;
    margin:-20px 0 0 -20px;
}
.laptop{
    float:right;
    background: transparent url(../images/laptop.png) no-repeat;
    width:542px;
    height:324px;
    margin-top:-10px;
    position:relative;
}
.laptopButton{
    -webkit-border-radius: 160px;
    -moz-border-radius: 160px;
    border-radius:160px;
    width:160px;
    height:160px;
    position:absolute;
    top:100px;
    left:-20px;
    background-color:#d4d700;
    color:#343f46;
    text-align:center; 
    padding:20px;
    font-size:0.875em;
    z-index:100;
}
.laptopButton h4{
    font-size:1.75em;
    line-height:1em;
    font-weight:normal;
    margin-bottom:4px;
}

.referenz{
   width:48%;
   float:left;
   border-bottom:1px solid #e0e5ea;
   padding-bottom:16px;
   margin-bottom:16px;
}
.referenz.left{
   margin-right:4%;   
   clear:left;
}
.referenz h3{
    font-size:1.125em;
    margin-bottom:6px;
    font-weight: normal;
}
.referenz span{
    font-size:0.875em;
    color:#656e73;
}
.referenz img{
   float:left;   
   margin-right:10px;
}
.bottomBoxes{
    width:48%;
    float:left;
    margin-right:4%;
}
.bottomBoxEntry{
   width:100%;
   padding-bottom:20px;
   margin-bottom:20px;
   border-bottom:1px solid #e0e5ea;
}
.bottomBoxEntry.last{
    border-bottom:0px solid #e0e5ea;
}

.bottomBoxEntry.left{
   margin-right:4%;
}
.bottomBoxEntry.last{
   border-bottom:0px solid #e0e5ea;
}
.bottomBoxEntry h4{
    font-size:1.25;
    font-weight:normal;
    font-family: "Akkurat",arial,sans-serif; 
    margin-bottom:8px;
    margin-left:90px;
}
.bottomBoxEntry i{
    height:73px;
    width:73px;
    border:2px solid #c7ced2;   
    -webkit-border-radius: 73px;
    -moz-border-radius: 73px;
    border-radius:73px;
    display:block;
    float:left;
    margin-right:10px;
    color:#d4d700;
    font-size:30px;
    text-align:center;
}
.bottomBoxEntry i span{
   padding-top:50%;
   margin-top:-15px;
   display:block;
}
.bottomBoxEntry p{
    margin-left:90px;
    display:block;
    color:#656e73;
    font-size:0.87em;
}
.bottomBoxEntry ul{   
    color:#656e73;
    font-size:0.87em;
    margin-left:104px;
    display:block;
}
.bottomTabs{
    float:right;
    position:relative;
}
.bottomTabs ul{
    list-style:none;    
}
.bottomTabs ul li{
    float:left;
    background-color:#d4d700;
}
.bottomTabs ul li h4{
   display:block;
   background-color:#e1e1e1;
   margin-bottom:2px;
   padding:5px;
   min-width:140px;
   text-align:center;
   font-weight:normal;
   cursor:pointer;
}
.bottomTabs ul li:first-child h4{
   border-right:2px solid #FFF;
   border-bottom:2px solid #FFF;
}
.bottomTabs ul li:last-child h4{
   border-left:2px solid #FFF;
   border-bottom:2px solid #FFF;
}
.bottomTabs ul li.active:first-child h4,
.bottomTabs ul li.active:last-child h4{
   border-color:#d4d700;
}
.bottomTabs ul li.active h4{
   background-color:#d4d700;   
}
.bottomTabs ul li ul{
    display:none;
    position:absolute;
    left:0;
}
.bottomTabs ul li ul li{
   float:none;
   background-color:#FFF;
   font-size:0.875em;
   padding: 5px 0 5px 0;
}
.bottomTabs ul li ul{
    list-style-image: url('/2014/images/icon_list.png');
    margin-left:14px;
}
/*
.bottomTabs ul li ul li:before{
   content: "c";
  font-family: "arv-icons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:0.6em;
  line-height:1.1em;
  margin-right:4px;
  margin-bottom:10px;
  float:left;
}*/
.bottomTabs ul li.active ul{
    display:block;
}
.bottomTabs ul li ul li:first-child{
   padding-top:20px;
}
.impressum .row1 .col1{
    float:left;
    width:32%  
}
.impressum a{
    color:#007ac8;
}
.impressum .row1 .col2{
    float:left;
    width:40%  
}
.impressum .row1 .col3{
    float:left;
    width:28%    
}
.impressum .row1 p,
.impressum .row2 p,
.impressum .row3 p{
    font-size:0.875em;
}
.impressum .row1 h3,
.impressum .row2 h3,
.impressum .row3 h3{
    font-size:0.875em;
    font-family: "Akkurat Bold",arial,sans-serif;
    font-weight:300;
    font-weight: normal;
}
.impressum .row2,.impressum .row3{
    clear:left;
    border-top:1px solid #d6d9da;
    padding-top:25px;
}

section#historie{
    background-color:#edf3f5;
    padding:40px 0 40px 0;
}
section#historie h2{
    color:#dae1e3;
    font-size:5.875em;
    font-family: "Akkurat Light",arial,sans-serif;
    font-weight:300;
    line-height:1em;
    font-weight: normal;
    margin-bottom:20px;
}
section#historie .year{
    font-size:1.125em;
    background:transparent url(../images/historie_arrow.png) no-repeat;
    clear:left;
    float:left;
    width:14%;
    padding:2px 0 0 8px;
    margin-bottom:16px;
    min-width: 80px;    
}
section#historie .info{
    font-size:0.875em;
    float:left;
    width:80%;
    margin-bottom:16px;
}
#vorteile{
    text-align:left;
}
#vorteile .container{
    padding:40px 60px 40px 60px;
}
.vorteileBox{
    width:63%;
    margin-right:4%;
    float:left;
    padding:30px 396px 0px 30px;    
    background:#f5f5f6 url(../images/zutrittssysteme_2.jpg) top right no-repeat;
    min-height:387px;
    background-size:auto 100%;
}

.vorteileBoxEntry{
   width:100%;
   padding-bottom:20px;
   margin-bottom:20px;
   border-bottom:1px solid #e0e5ea;
   min-height:93px;
}
.vorteileBoxEntry.left{
   margin-right:4%;
}
.vorteileBoxEntry.last{
   border-bottom:0px solid #e0e5ea;
   margin-bottom:0;
}

.vorteileBoxEntry h3{
    font-size:0.875em;
    font-weight:normal;
    font-family: "Akkurat",arial,sans-serif; 
    margin-bottom:8px;
    margin-left:90px;
}
.vorteileBoxEntry i{
    height:73px;
    width:73px;
    border:2px solid #c7ced2;   
    -webkit-border-radius: 73px;
    -moz-border-radius: 73px;
    border-radius:73px;
    display:block;
    float:left;
    margin-right:10px;
    color:#d4d700;
    font-size:30px;
    text-align:center;
}
.vorteileBoxEntry i span{
   padding-top:50%;
   margin-top:-15px;
   display:block;
}
.vorteileBoxEntry p{
    margin-left:90px;
    display:block;
    color:#656e73;
    font-size:0.87em;
}
.vorteileBoxEntry ul{   
    color:#656e73;
    font-size:0.87em;
    margin-left:104px;
    display:block;
}
.listeVorteile{
     width:33%;
     float:left;
}
.listeVorteile h3{
    font-size:1.125em;
    padding-bottom:6px;
    border-bottom:3px solid #d4d700;
    margin-bottom:5px;
    font-weight: normal;
}
.listeVorteile ul{
    list-style:none; 
}
.listeVorteile ul li{
    border-bottom:1px solid #e4e9ee;
    padding:5px 0 5px 0;
    font-size:0.875em;
}
.listeVorteile ul li:before{
    content: "h";
    font-family: "arv-icons" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size:1em;
    line-height:1.1em;
    margin:3px 8px 5px 0;
    display:block;
    float:left;
}
.kontakt .container{
    padding:40px 60px 40px 60px;
}
.kontaktBoxLeft{
    width:65%;
    float:left;
    background-color:#e1e2e4;
    height:305px;
    padding:18px 15px 0 15px;
    line-height: 1.2em;
}
input[type="text"].kontaktBoxName{
	display:none;
}
.kontaktBoxLeft h2{
    fonr-size:1.25em;
    font-weight:normal;
    height:35px;
}
.kontaktBoxLeft h3{
    fonr-size:1em;
    font-weight:normal;
    height:35px;
}
.kontaktBoxLeft .col1{
    width:32%;
    float:left;
    margin-right:2%;
}
.kontaktBoxLeft .col1 label{
    padding:8px;
    background-color:#FFF;
    font-size: 0.9em;
    display:block;
    height:34px;
}
.kontaktBoxLeft .col1 input[type="checkbox"]{
    vertical-align:middle;
    margin-right:10px;
    margin-top:-2px;
}
.kontaktBoxLeft .col2{
    width:31%;
    float:left;
    margin-right:2%;
    padding-top:35px;
}
.kontaktBoxLeft .col2 textarea{
    height:194px;
}
.kontaktBoxLeft .col3{
    width:33%;
    float:left;
}
.kontaktBoxLeft .col3 label{
    padding:8px;
    background-color:#8a9095;
    font-size: 0.9em;
    display:block;
    margin-bottom:6px;
    color:#FFF;
    height:34px;
}
.kontaktBoxLeft .col3 input[type="checkbox"]{
    vertical-align:middle;
    margin-right:10px;
    margin-top:-2px;
}
.kontaktBoxRight{
    width:35%;
    float:left;
    background-color:#f5f5f6;
    height:305px;
}
.kontaktBoxRight{
    padding:47px 77px 0 77px;
}
.kontaktBoxRight h3{
    background-color:#343f46;
    padding:10px 0 10px 10px;
    color:#FFF;
    font-size:1.625em;
    line-height:1em;
    margin-bottom:20px;
    max-width: 260px;
    font-weight: normal;
}
.kontaktBoxRight h3 a{
    color:#FFF;
}
.kontaktBoxRight h3:before{
    content: "o";
    font-family: "arv-icons" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size:1.2em;
    line-height:1.1em;
    margin:-5px 5px 0 0;
    color:#d4d700;
    float:left;
}
.kontaktBoxRight h4{
    font-size:0.875em;
}
.kontaktBoxRight p{
    font-size:0.875em;
} 
.kontakt .button{
    color:#343f46;
    background-color:#d4d700;
    display:inline-block;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius:0px;
    padding:5px 10px 5px 10px;
    float:right;
    font-size:0.875em;
    margin-top: 8px;

}
#map {
    width: 100%;
    height: 450px;
    border-top:1px solid #d4d6d8;
}

.featuresBox{
    margin-top:40px;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
    position:relative;
    height:500px;
}
.featuresBoxCol1{
    height:100%;
    background-color:#707e8e;
    width:25%;
    float:left;
    position:absolute;
}
.featuresBoxCol1 ul{
    list-style:none;
}
.featuresBoxCol1 ul li span{
    padding-left:40px;
    color:#FFF;
    line-height:40px;
    height:40px;
    cursor:pointer;
    display:block;
}
.featuresBoxCol1 ul li.active span:after{
    font-family: "arv-icons" !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content:"c";
    font-size:0.6em;
    margin-left:10px;
    
}
.featuresBoxCol1 ul li.active span{
    background-color:#d4d700;
    color:#343f46;
}
.featuresBoxCol1 h2{
    padding:40px 40px 20px 40px;
    font-size:1.875em;
    color:#FFF;
    font-family: "Akkurat Light";
    line-height:1em;
    font-weight: normal;
}
.featuresBoxCol2{
    height:100%;
    width:50%;
    float:left;
    padding:40px;
    margin-left:25%;
}
.featureContent{
    position:absolute;
    width:170%;
    margin-left:100%;
    top:40px;
    padding-left: 15%;
    display:none;
}
.featuresBoxCol1 ul li.active .featureContent{
    display:block;
}

.featureContent h3{
    font-size:1.375em;
    font-weight:normal;
    margin-bottom:16px;
}
.featureContent p,.featureContent li{
    font-size:0.875em;
    line-height:1.25;
}
.featureContent li li{
    font-size:1em;
}

.featureContent ul li:before {
    content: "h";
    display: block;
    float: left;
    font-family: "arv-icons" !important;
    font-size: 1em;
    font-style: normal !important;
    font-variant: normal !important;
    font-weight: normal !important;
    line-height: 1.1em;
    position:absolute;
    top:3px;
    left:0;
    text-transform: none !important;
}

.featureContent ul li li:before {
    content: "-";    
    top:0px;
}
.featureContent ul li {
    padding: 2px 0;
    position:relative;
    padding-left:20px;
}
.featureContent ul li li{
    padding-left:10px;
}

.featureContent ul ul{
    margin:6px 0 0 10px;
}
.featuresBoxCol3{
    height:100%;
    background-color:#f0f2f3;
    width:25%;
    float:left;
    position:absolute;
    right:0;
}
.featuresBoxCol3 i {
    color: #d6dbdf;
    font-size: 240px;
    height: 100%;
    text-align: center;
    display:block;
}
.featuresBoxCol3 i span {
    display: block;
    margin-top: -60px;
    padding-top: 50%;
}
#referenzenSlider{
    height:310px;
    background-color:#343f46;
}
#unternehmenSlider{
   height:360px;
    background-color:#d4d700; 
    position:relative;
    margin-bottom:60px;
}
.unternehmenSliderEntry{
    width:100%;
    max-width:1300px;
    margin:auto;
    text-align:left;
    position:relative;
    height:360px;
    padding:40px 440px 0 184px;
}
.unternehmenSliderEntry img{
    position:absolute;
    bottom:0;
    right:40px;
}
.unternehmenSliderEntry p{
    margin-bottom:20px;
    font-size:0.875em;
}
.bx-wrapper .unternehmenSliderEntry h3{
    font-size:1.625em;
    color:#343f46;
    margin-bottom:14px;
}
.bx-wrapper .unternehmenSliderEntry h4{
    font-size:0.875em;    
    font-family: "Akkurat Bold";
    font-weight:normal;
    margin-bottom:28px;
}
.sliders{
    color:#eaeb80;
    font-size:3em;
    position:relative;
    width:100%;
    top:-210px;
    max-width:1300px;
    margin:auto; 
}
.sliders a{
    color:#eaeb80;
}
.sliders #slider-next{
    position:absolute;
    right:40px;       
}
.sliders #slider-prev{
    position:absolute;
    left:60px;
}
.unternehmenSliderContainer{
    position:relative;
    width:100%;
}
#champ_funktionen{
    width:100%;
    max-width:950px;
    text-align:left;
    padding:30px;
    margin:auto;    
}
#champ_funktionen #champ_funktionen_left,
#champ_funktionen #champ_funktionen_right{
    width:49%;
    float:left;
}
#champ_funktionen #champ_funktionen_left{
    margin-right:2%;
}
#champ_funktionen h3{
    margin-bottom:10px;
    font-size:1.125em;
}
#champ_funktionen h2{
    margin-bottom:20px;
    font-size:1.5em;
}
#champ_funktionen ul li:before {
    content: "h";
    display: block;
    font-family: "arv-icons" !important;
    font-size: 1em;
    font-style: normal !important;
    font-variant: normal !important;
    font-weight: normal !important;
    left: 0;
    line-height: 1.1em;
    position: absolute;
    text-transform: none !important;
    top: 3px;    
}
#champ_funktionen ul{
    list-style-type: none;
    margin-bottom:20px;
}
#champ_funktionen ul li{
    font-size:0.875em;
    position:relative;
    padding-left:20px;
    margin-bottom:2px;
}
#cpop-cont{
position:absolute;
	width:90%;	
	top:calc(50% - 100px);
	width:100%;
	
}
#cpop{
	line-height:24px;
	max-width:460px;
	width:90%;
	margin:auto;
	background:#fff;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);padding:40px;
	position:relative;
	background:#fff url(/images/flag.png) no-repeat;
	background-size:100% 100%;
	color:#fff;
	z-index:100;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
}
#cpop img{
	max-width:125px;
	position:absolute;
	top:-35px;
	left:-50px;
}
#cpop span{	color:#fff;

}
#cpop-cont2{
	position:absolute;
	width:90%;	
	top:calc(50% - 100px);
	width:100%;
	display:none;
}
#cpop2{
	line-height:24px;
	max-width:460px;
	width:90%;
	margin:auto;
	background:#343f46;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	padding:40px;
	position:relative;
	background-size:100% 100%;
	color:#fff;
	z-index:100;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
}
#cpop2 a{
	display:inline-block;
	margin-top:20px;
	background:#d4d700;
	border-radius:4px;
	padding:6px 14px;
	text-shadow:none;
	color:#343f46;
}
#cpop-cont3{
	position:absolute;
	width:90%;	
	top:calc(50% - 100px);
	width:100%;
	display:none;
}
#cpop3{
	line-height:24px;
	max-width:460px;
	width:90%;
	margin:auto;
	background:#343f46;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	padding:40px;
	position:relative;
	background-size:100% 100%;
	color:#fff;
	z-index:100;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
}
#cpop3 a{
	display:inline-block;
	margin-top:20px;
	background:#d4d700;
	border-radius:4px;
	padding:6px 14px;
	text-shadow:none;
	color:#343f46;
}

#cpop-cont4{
	position:absolute;
	width:90%;	
	top:200px;
	width:100%;
	display:none;
}
#cpop4{
	max-width:980px;
	width:90%;
	margin:auto;
	background:#ffffff;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	padding:20px;
	position:relative;
	z-index:100;
}
#cpop-cont5{
	position:absolute;
	width:90%;	
	top:calc(50% - 100px);
	width:100%;
	display:none;
}
#cpop5{
	line-height:24px;
	max-width:460px;
	width:90%;
	margin:auto;
	background:#ffffff;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	padding:0px;
	position:relative;
	background-size:100% 100%;
	color:#fff;
	z-index:100;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
}

@media (min-width: 1300px) {
    .bottomBoxIcon .icon{
        font-size: 4em;        
    }
    
}
@media (max-width: 1280px) {
    .servicesBox h3 {
        font-size: 1.25em;
        margin-bottom:8px;
    }
    
.mainRight .servicesBox p {
    font-size: 0.85em;
   
}
    
    .kontaktBoxLeft,
    .kontaktBoxRight{
        float:none;
        width:100%;
    }   
    .kontaktBoxRight{
        padding-left:25px;
    }
    .bottomBoxText{
        width:auto;
        float:left;
         margin-left:120px;
    }    
    
    .bottomBox h3 {
        font-size: 1.3em;
    }
    #bottom .bottomBox h3 {
         margin-bottom: 8px;
    }
    
   
    .serviceBoxEntry i {       
        margin-bottom: 30px;
    }
    .serviceBoxEntry ul {  
        margin-bottom: 20px;
    }
    .serviceBoxEntry {
        height:auto;
    }
   .bottomBox{
        margin-right: 2%;
        width:32%;
   }   
   #bottom_start .bottomBoxText {
        padding-top: 14px;
    }
    
    .bottomBox p {
        font-size: 0.75em;
    }
}
@media (max-width: 1200px) {
    .vereine .ueberblick {
        background: url("../images/vereine_1.jpg") no-repeat scroll 450px top transparent;
    }
    .vereine .zutrittssysteme {
        background: url("../images/zutrittssysteme_1.jpg") no-repeat scroll 450px top transparent;
    }
    .vorteileBox {
        float: none;
        margin-right: 0;
        width: 100%;
        margin-bottom:30px;
    }
    .listeVorteile {
        float: none;
        width: 100%;
        margin-bottom:20px;
    }
    .featuresBoxCol3{
        display:none;
    }    
    .featuresBoxCol2 {
        width: 65%;
        margin-left: 35%;
    }
    .featuresBoxCol1 {
        width: 35%;
    }
    .featureContent{
        width:170%;
    }
}
@media (max-width: 1100px) {
    #submenu ul li {
        padding: 10px 0 10px 30px;
    }
    .vereine .champ-web p {       
        max-width: 340px;
        width: 100%;
    }
    #historie .mainLeft,
    #historie .mainRight {
        float:none;
        width:100%;
            margin:0;
    }    
    .unternehmenSliderEntry {
        padding: 40px 380px 0 184px;
    }
    .verbaende p {
     max-width:310px;   
    }
    .vereine .zutrittssysteme p {   
    max-width: 440px;
}
.vereine .zutrittssysteme p {
    font-size: 0.825em;
    line-height: 1.25em;
}
}
@media (max-width: 1000px) {    
    .vereine .champ-web p {       
        max-width: none;
    }
    .ipad, .laptop {
        display:none;
    }
    .vereine .champ-web {
        height:auto;
        min-height:0;
    }
    .bx-wrapper h2 {
        margin-bottom:20px !important;
    }
    .impressum .mainLeft{
        display:none;
    }
    .impressum .mainRight{
        width:100%;
        max-width: unset;
    }
    .unternehmenSliderEntry img{
        height:80%;
        right:10px;
    }
    .unternehmenSliderEntry {
        padding: 40px 270px 0 130px;
    }
     #bottom_start .bottomBox{
        display:block;
        width:100%;
        margin-right:0;
        margin-bottom:10px;
        float:none;
        background-color:#ffffff;
        height:auto;
        min-height:100px;
        position:relative;
        min-width:240px;
        height: 116px;
   }   
   #bottom .bottomBox{
        display:block;
        width:100%;
        margin-right:0;
        margin-bottom:10px;
        float:none;
        background-color:#ffffff;
        height:auto;
        min-height:100px;
        position:relative;
        min-width:240px;
        height: 116px;
   }    
   .bottomBox p {
        font-size: 0.875em;
    }
     #bottom .bottomBox h3 {
         margin-bottom: 12px;
    }
}
@media (max-width: 930px) {
    .servicesBox {   
        width: 100%;
        margin-bottom: 30px;
    }
    
    #main .container{
        background-image: none !important;
        height: auto !important;
    }
    #main .container h2,
    #main .container p{
        width:100% !important;
        max-width:none !important;
    }
    #submenu ul{
        display:none;
    }
    #submenu select{
        display:block;
    }
    #submenu .button {           
            padding: 5px 10px 4px 12px;
        }
    
    .mainRight{
        width:55%;   
    }
    .startBoxLeft,
    .startBoxRight{
        width:100%;
        float:none;
        margin-right:0%;
        margin-bottom:20px;
    }
    
    #main .container {
        padding-bottom: 40px;
        padding-top: 40px;
    }
    .container {
        padding: 0 30px;
    }
    #topImage{
        margin:0 -30px 0 -30px;
    }   
}
@media (max-width: 840px) {
    .bottomBoxes{
        float:none;
        width:100%;
        margin:0;
    }
    .bottomTabs {
        float: none;
        min-height:280px;
    }
    .bottomTabs ul{
       /* width:100%; */
    }
    .bottomTabs li{
        width:50%;
    }
    .bottomTabs ul li ul li {    
        width: 100%;
    }
    .vorteileBox {
        background-image:none;
        padding-right:30px;
    }
    .bx-wrapper h2 {
       font-size:1.5em !important;
    }
    .serviceBoxEntry.left {
        margin-right: 0;
         margin-bottom:30px;
    }
    .serviceBoxEntry {
        width: 100%;
    }    
    #serviceBox {
        padding-bottom:0;
    }
    .serviceBoxEntry.left.last {
        border-bottom: 1px solid #e0e5ea;       
    }
    .kontaktBoxLeft{
        height: 580px;        
    }    
    .kontaktBoxLeft .col1{
        width:49%;        
    }
    .kontaktBoxLeft .col2{
        width:49%;
        margin-right:0;
    }
    .kontaktBoxLeft .col3 {
        float: none;
        width: 100%;
        clear:left;
        padding-top:10px;
        padding-bottom:20px;
    }
    .kontaktBoxLeft .button{
        clear:left;
    }
    #map {
        height:250px;
    }
    .featuresBoxCol2{
        display:none;
    }
    .featuresBox {
        box-shadow: none;
        height: auto;
        margin-top: 40px;
        position: relative;
    }
    .featuresBoxCol1{
        width:100%;
        background-color: #FFF;
        float:none;
        position: relative;
    }
    .featuresBoxCol1 h2{
        color:#343f46;
        padding: 0 0 20px 0;
    }
    .featuresBoxCol1 h2 br {
        display:none;
    }
    
    .featuresBoxCol1 ul li span {
        padding-left: 20px;
        background-color: #707e8e;
        margin-bottom:4px;
    }
    .featuresBoxCol1 ul li.active span:after {
        content:"";
    }
    .featureContent {
        width: 100%;
        margin-left: 0;
        position: static;
        top: 0px;
        padding: 20px;
    }
    .bx-wrapper .unternehmenSliderEntry img{
        display:none;
    }
    .unternehmenSliderEntry {
        padding: 20px 130px 0 130px;
    }
    .vorteileBox {
    min-height: 360px;
    }
}
@media (max-width: 730px) {
    #unternehmenSlider{
        display:none;
    }
    #downloads .mainLeft{
            display:none;
        }
    
    .verbaende .button {
        float:none;
        margin:0 0 10px 0;
        display:block;
        max-width:270px;
    }
    .vereine .button {
        float:none;
        margin:0 0 10px 0;
        display:block;
        max-width:230px;
    }
    .referenz.left {
        clear: none;
        margin-right: 0;
    }
    .referenz {
        float: none;
        width: 100%;
    }
    #headerMenu{
        display:none;
    }
    .open{
        display:block;
    }
    #headerMenu li:first-child {
        display:block;
    }
    #headerLogo {
        float: right;
        padding: 14px 0 20px 0;
    }
    #headerLogo img{
        width:85px;
    }
    .bottomBoxIcon{
       /* width:20%; */
    }
    .bottomBoxText{
       /* width:75%;
        margin-left:25%;*/
    }
    #footerLogo{
        display:none;        
    }
    #footerMenu{
        display:none;
    }
    #footerCopyright{
        text-align:center;
        border:0px;
        width:100%;
    }
    .mainLeft{
        max-width:100%;
        min-width:278px;
    }
    .mainRight{
        width:100%;        
        float:none;
    }
    .startBoxLeft,
    .startBoxRight{
        width:47%;
        float:left;
        margin-bottom:20px;
    }
    .startBoxLeft{
        margin-right:6%;
    }
    
    #topHeadline {
        background: none repeat scroll 0 0 #d4d700;
        bottom: 0;
        font-size: 1.2em;
        line-height: 1.2em;
        padding: 12px 30px 4px 30px;
        position: absolute;
        width: 100%;
        margin-left:-30px;
        z-index:10;
    }
    #top{
        height:240px;
        position: relative;
        overflow: hidden;
    }    
    #topImage img {
        height:240px;
        width:auto;
        position: absolute;
        top: -9999px;
        bottom: -9999px;
        left: -9999px;
        right: -9999px;
        margin: auto;
        z-index:1;
    }
    .impressum .row1 .col1,
    .impressum .row1 .col2,
    .impressum .row1 .col3{
        float:none;
        margin:0;
        width:100%;
        border-top: 1px solid #d6d9da;
         padding-top: 25px;
    }
    .impressum .row1 .col1{
         border-top: 0px solid #d6d9da;
    }
}
@media (max-width: 530px) {
    .bottomTabs.big{
        min-height:370px;
    }
	#cpop img{	
	left:-25px;
}
}

@media (max-width: 480px) {
	.mobile100{
		width:100%;
		height:auto;
		margin:20px 0 20px !important;
		max-width:200px;
		display:block;
		float:none !important;
	}
    #champ_funktionen #champ_funktionen_left,
    #champ_funktionen #champ_funktionen_right{
        width:100%;
        float:none;
    }
    #champ_funktionen #champ_funktionen_left{
        margin-right:0%;
    }
    
    .container{
        padding: 0 10px;
    }
    #vorteile .container {
        padding: 10px;
    }
    .startBoxLeft,
    .startBoxRight{
        width:100%;
        float:none;
        margin-right:0%;
        margin-bottom:20px;
    }
    #topHeadline {    
         font-size: 1.2em;
         margin-left:-10px;
         padding: 12px 10px 4px 10px;
    }
    #main .container {
        padding-bottom: 20px;
        padding-top: 20px;
    } 
    .showMobile{
        display:inline-block;
    }
    .hideMobile{
        display:none;
    }
    #bottom {
        padding: 20px 0;
    }
    footer .container {
        padding-bottom: 20px;
        padding-top: 20px;
    }
    #topSlogan {
        font-size: 0.8em;
    }
    #submenu select{
        width:60%;
    }
    #main .container h2{
        font-size:1.8em !important;
    }
    #main .container p{
        font-size:0.875em !important;
    }
    .referenz h3{
        font-size:1em;
    }
    .bx-wrapper h2 {
       font-size:1.25em !important;
    }
    .bx-wrapper {
        padding-top: 30px !important;
    }
    #referenzenSlider {
        height:auto;
        padding-bottom: 40px;
    }
    .kontaktBoxLeft .col1{
        width:100%;  
        float:none;
        margin:0;
    }
    .kontaktBoxLeft .col2{
        width:100%;
        padding-top:8px;
    }
    .kontakt .container {
        padding-right: 10px;
        padding-left: 10px;
    }
    .kontaktBoxLeft {
        height: 790px;
    }
    .kontaktBoxRight{
        padding:20px 10px 20px 10px;
        height:auto;
    }
    section#historie .info{        
        width:70%;
    }
    section#historie h2 {
        font-size: 3.2em;       
    }
    section#historie {       
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .bottomBox p {
        font-size: 0.8em;        
    }
}

@media (max-width: 360px) {
    .bottomBoxIcon{
        width:30%;
    }
    .bottomBoxText{
        width:65%;
        margin-left:35%;
    }
    .bottomBox h3 {
        font-size: 1em; 
    }
    .bottomBox p {
        font-size: 0.8em;
    }
    #footerCopyright {
        font-size: 0.65em;    
    }
    #topSlogan {
        font-size: 0.6em;
        padding: 4px 20px 4px 60px;
    }
}
@media (max-width: 300px) {
    .bottomBoxIcon{
        width:30%;
    }
    .bottomBoxText{
        width:65%;
        margin-left:35%;
    }
    .bottomBox h3 {
        font-size: 0.9em; 
    }
    .bottomBox p {
        font-size: 0.75em;
    }
    #topSlogan {
        font-size: 0.65em;
    }
}