/* open-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v40-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


html { overflow-y: scroll; }
body {
margin: 0px; border: 0px;
font-size: 100%; font-weight: normal; color:#505050;
font-family: 'Open Sans', sans-serif; font-weight: normal;
background-color: #e1e1e1;
}


#container {
width:1100px;
padding: 0px 0px;
overflow: hidden;
margin:0px auto;
text-align:left;
border:0px solid #000;
}

.section {
width:1080px;
padding: 0px 0px;
overflow: hidden;
margin:0px auto;
margin-bottom: 10px;
text-align:left;
border:0px solid #000;
}

.section.toppad { padding: 20px 0 0 0; }

.section.visualhead {
  position: relative;
  line-height: 1px;
  -webkit-box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  -moz-box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  z-index: 1000;
}

.section.visualhead .logo {
  position: absolute;
  top: 38%;
  right: 30px;
  background: url(../pics/logobalken-bg.png);
  padding: 15px 60px;
}

.section.visualhead .logo .main {
  color: #fff;
  font-size: 30px;
  letter-spacing: 0.15em;
  margin: 0 0 10px;
}
.section.visualhead .logo .sub {
  color: #555;
  font-size: 16px;
  letter-spacing: 0.02em;
  margin: 0px;
}
.section.visualhead .logo .pmalogo {
  border: 0px solid #000;
  padding: 10px 0 0;
}

.section.navigation {
  -webkit-box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  -moz-box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  z-index: 900;
}

.section.cont, .section.foot  {
  -webkit-box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  -moz-box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.42);
  z-index: 800;
}


.content {
  background-color: #fff;
  padding: 26px 26px;
  overflow: hidden;
}

.content h1 { font-family: 'Open Sans', serif; font-size: 30px; font-weight: normal; color: #505050; margin: 5px 0px; }
.content h2 { font-family: 'Open Sans', serif; font-size: 20px; font-weight: bold; color: #505050; margin: 0px; }
.content h3 { font-family: 'Open Sans', serif; font-size: 16px; font-weight: bold; color: #505050; margin: 0px; }
.content p  { color: #505050; }

#quickicons, #quicktel { padding: 0px 2px 0px 2px;}
#quickicons { float: left;  font-size: 30px;}
#quicktel   { float: right; font-size: 14px; padding: 13px 0 0 0; }
#quickicons a, #quicktel a { color: #f28400;}
#quickicons a:hover, #quicktel a:hover { color: #505050;}

#top {
width:1080px;
padding: 0px;
float: left;
border:0px solid #000;
}


#footer {
width:1080px;
overflow: hidden;
border: 0px solid #00f;
background-color: #646464;
}

#footer p{
padding: 10px 25px;
font-family: 'Open Sans', sans-serif;
font-size: 14px; font-weight: normal; color:#fff; text-align:right;
line-height: 20px;
}

#footer .fb{
padding: 10px 10px;
float: left;
}

#footer .links{
width: 97%;
padding: 5px 0px 0px 10px;
text-align: left;
border: 0px solid #0e0;
}

#footer .links a { border-radius: 3px; display: inline-block; vertical-align: middle; padding: 3px; margin: 2px; background-color: #fff;}

.footlink { color: #fff; font-weight: normal; }
.footlink:hover { color: #f28400; font-weight: normal; }

#navigation {
width: 100%;
background-color: #f28400;
float: left;
border: 0px solid #000;
}

#navlist { padding: 20px 0px 20px 30px; margin: 0px; border:0px solid #000; float: left; }
#navlist li	{ display: inline-block; list-style-type: none; border:0px solid #000; text-align: center; padding: 0px 0px 0px 0px; margin: 0px; }

.halfcontent { float: left; width: 50%;}
.halfcontent .inner { padding: 0 0 0 20px;}

p  { font-family: 'Open Sans', sans-serif; font-weight: normal; font-size: 14px; color: #666; line-height: 22px;}
li { font-family: 'Open Sans', sans-serif; font-weight: normal; font-size: 14px; color: #505050; line-height: 20px; padding: 0px; }
.content li { font-family: 'Open Sans', sans-serif; font-weight: normal; font-size: 14px; color: #505050; line-height: 30px; padding: 0px; }

li.kundenliste { display: inline-block; border: 0px solid #000; width: 230px; height:30px; padding: 5px; }

a       { font-family: 'Open Sans', sans-serif; font-weight: normal; text-decoration:none;  color: #666;
  -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
      - o-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
          transition: all 0.3s ease;

}
a:hover { color: #000;}

a.nav                   { font-family: 'Open Sans', sans-serif; font-weight: bold; font-size: 14px; padding: 5px 15px 0 0; color:#fff; height: 23px; text-decoration: none; display: block; }
a.nav:hover             { text-decoration:none; color:#505050;}
a.navselected           { font-family: 'Open Sans', sans-serif; font-weight: bold; font-size: 14px; padding: 5px 15px 0 0; color:#fff; height: 23px; text-decoration: none; display: block; }
a.navselected:hover     { text-decoration:none;}

a.foot       { font-weight: normal; color:#3a6087; text-decoration:none; padding: 0px 0px 0px 0px; text-decoration:underline;}
a.foot:hover { text-decoration:none;}
a.pdflink       { font-size: 12px; color:#3a6087; font-weight:normal; background: url(pics/icon-pdf.gif); background-repeat: no-repeat; background-position: left; padding-left:17px; text-decoration:none;}
a.pdflink:hover { font-size: 12px; color:#3a6087; text-decoration:underline;}
a.print       { font-size: 12px; font-weight: normal; color:#3a6087; text-decoration:none; padding: 0px 0px 0px 0px;}
a.print:hover { text-decoration:underline;}

.contpicright { float: right; padding: 0px 0px 10px 10px;}
.contpicleft  { float: left;  padding: 0px 10px 10px 0px;}


/* ===================
    responsive styles
   =================== */

@media screen and (min-width: 1081px) {
/* desktop navi */
  #drawers { display: none;}
}

@media screen and (max-width: 1080px) {
  html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

  img {max-width: 100%}

  #container { width:100%; }
  .section  { width:98%; }
  .section.toppad { padding: 10px 0 0 0; }
  #top { width:100%; border:0px solid #0f0; }
  #footer { width:100%;}


  /* mobile navi */
  #navigation {display: none;}
  #navlist { padding: 5px 0px 0px 0px; margin: 0px; border:0px solid #000; float: left; }
  #navlist li	{ display: block; list-style-type: none; border:1px solid #009; text-align: left; padding: 0px 0px 0px 0px; }

  #drawers {
    margin: 0px;
    padding: 10px;
    border:0px solid #090;
    background-color: #f28400;
  }
  #drawers li{ list-style-type:none; border: 0px solid #000; }

  #drawers div.lihead {
    border: 0px solid #f00;
    text-align: left;
    padding: 5px;
    color:#fff;
    font-family: 'Open Sans', sans-serif; font-size: 16px; font-weight:normal; text-decoration:none; text-transform: uppercase;
    }
  #drawers div.licont {
    border: 0px solid #0f0;
    margin: 0px 0px 0px 24px;
    display:none;
    overflow: visible;
  }


}

@media screen and (max-width: 900px) {

}

@media screen and (min-width: 761px) {
  #pmalogocontent { display: none;}
}

@media screen and (max-width: 760px) {
  .content { padding: 14px; }
  .content h1 { font-size: 23px; }
  .content h2 { font-size: 16px; font-weight: bold; }
  .section.visualhead .logo { padding: 15px 20px; }
  .section.visualhead .logo .main { font-size: 23px; letter-spacing: 0.15em; }
  .section.visualhead .logo .sub { font-size: 12px; letter-spacing: 0.02em; }
  .section.visualhead .logo .pmalogo { display: none;}
  #pmalogocontent { display: block; float: right; padding: 10px 0 0 10px;}
}

@media screen and (max-width: 450px) {
  .section.visualhead .logo {
    position: absolute;
    top: 20%;
    right: 10px;
    background: url(../pics/logobalken-bg.png);
  }

}
