html, body {
width:100%; height:100%;
}

body {
margin:0; padding:0;
background:#fff;
color:#5c5c5c;
font-size:17px;
line-height:24px;
font-weight:300;
text-decoration:none;
-webkit-text-size-adjust:none;
}

* {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
-webkit-text-size-adjust:none;
}

a, span, div, ul, li, td, th, form, fieldset, input, select, textarea, p, h1, h2, h3, h4 {
font-family:Calibri, Candara, Segoe, 'Segoe UI', Optima, Arial, Helvetica, sans-serif;
color:inherit;
font-size:inherit;
line-height:inherit;
font-weight:inherit;
text-decoration:inherit;
margin:0; padding:0;
list-style-type:none;
outline:none;
border:0;
font-synthesis:none;
}

.clearfix {
*zoom:1;
}

         .clearfix:before,
         .clearfix:after {
         content:'';
         display:table;
         }

         .clearfix:after {
         clear:both;
         }

h1 {
display:block;
font-size:29px;
line-height:36px;
text-transform:uppercase;
text-align:center;
position:relative;
margin:65px 0;
font-weight:400;
}

h1:after {
content:'';
position:absolute; top:100%; left:50%;
margin-left:-12px;
width:24px; height:2px;
background:#5c5c5c;
}

h2, h3 {
display:block;
font-size:19px;
line-height:24px;
text-transform:uppercase;
text-align:center;
font-weight:400;
}


h2 + p,
h3 + p,
h2 + h3,
p + h3,
p + p,
p + h2,
p + ul,
p + div,
h3 + div,
ul + p,
ul + h2,
ul + h3,
h3 + ul,
h2 + ul {
margin-top:24px;
}

img {
border:0;
}

.dn {
display:none;
}

.vh {
visibility:hidden;
}

#main a {
color:#6c9cb2;
text-decoration:underline;
transition:color, ease, .25s;
}

#main a:focus,
#main a:hover {
color:#5c5c5c;
text-decoration:underline;
transition:color, ease, .25s;
}

#header {
position:absolute; left:0px; top:0px;
background:#fff;
z-index:102;
}

         #nav li {
         font-size:19px;
         line-height:55px;
         font-weight:400;
         text-transform:uppercase;
         }

         #nav li a {
         color:#fff;
         border-bottom:2px solid transparent;
         transition:border, ease, .25s;
         }

         #nav li.aktiv a,
         #nav li a:focus,
         #nav li a:hover {
         border-bottom:2px solid #6c9cb2;
         text-decoration:none;
         transition:border, ease, .25s;
         }

         #nav #nav0 a {
         border-bottom:0;
         }


@media screen and (min-width:984px) {

#header {
position:absolute; left:0px; top:0px;
width:100%; height:100vh;
padding-top:calc(100vh - 57px);
}

#header.fixed, #header.fixed2 {
position:fixed; left:0px; top:calc(55px - 100vh);
z-index:105;
}

         #header div {
         position:relative;
         width:100%; height:55px;
         background:#000;
         }

         #header div div {
         width:960px; height:55px;
         margin:0 auto;
         text-align:center;
         }

         #logo_gross {
         position:absolute; left:50%; top:50%;
         margin:-52px 0 0 -210px;
         width:420px; height:105px;
         z-index:102;
         }

         #menu {
         display:none;
         }

         #logo_klein {
         float:left;
         margin:11px 90px 0 23px;
         width:120px; height:30px;
         }

         #nav {
         float:left;
         width:727px;
         }

                  #nav li {
                  float:left;
                  margin-right:40px;
                  -webkit-transition:all, ease, .25s;
                  -moz-transition:all, ease, .25s;
                  transition:all, ease, .25s;
                  }

                  #header.fixed #nav li,
                  #header.fixed2 #nav li {
                  -webkit-transition:all, ease, .25s;
                  -moz-transition:all, ease, .25s;
                  transition:all, ease, .25s;
                  }

                  #nav li:nth-child(5) {
                  float:right;
                  margin-right:70px;
                  }

                  #nav li:nth-child(1n+6) {
                  display:none;
                  }

         #header div.line {
         position:absolute; left:0px; bottom:0px;
         width:100%; height:4px;
         background:#000;
         transition:background, ease, .25s;
         }

         #header div.line.aktiv {
         background:#6c9cb2;
         transition:background, ease, .25s;
         }

}

@media screen and (max-width:983px) {

#header {
position:fixed; left:0px; top:0px;
width:100%; height:60px;
}

#header.fixed, #header.fixed2 {
overflow:hidden;
z-index:105;
}

         #header div {
         position:relative;
         width:100%; height:60px;
         background:#000;
         }

                  #header div div > a {
                  position:absolute; left:20px; top:15px;
                  }

                           #logo_klein {
                           display:inline-block;
                           width:120px; height:30px;
                           }

         #menu {
         position:absolute; left:50%; top:23px;
         margin-left:-13px;
         z-index:102;
         width:26px; height:21px;
         border-style:solid;
         border-color:transparent;
         border-width:5px 0;
         }

                  #menu span {
                  display:block;
                  width:26px; height:5px;
                  border-radius:2px;
                  text-indent:-1000px;
                  overflow:hidden;
                  background:#fff;
                  transition:background, ease, .25s;
                  }

                  #menu:before,
                  #menu:after {
                  content:'';
                  position:absolute; left:0px;
                  width:26px; height:5px;
                  border-radius:2px;
                  background:#fff;
                  transition:background, ease, .25s;
                  }

                  #menu:before {
                  top:-8px;
                  }

                  #menu:after {
                  top:8px;
                  }

                  #menu:hover span,
                  #menu:focus span,
                  #menu:hover:before,
                  #menu:focus:before,
                  #menu:hover:after,
                  #menu:focus:after {
                  background:#6c9cb2;
                  transition:background, ease, .25s;
                  }

         #nav {
         position:absolute; left:0px; top:60px;
         width:100%;
         padding:30px 0;
         background:rgba(0,0,0,0.85);
         display:none;
         z-index:100;
         }

                  #nav li {
                  font-size:24px;
                  line-height:60px;
                  font-size:20px;
                  line-height:40px;
                  text-align:center;
                  }

         #header div.line {
         position:fixed; left:0px; bottom:0px;
         width:100%; height:4px;
         background:transparent;
         transition:background, ease, .25s;
         }

         #header div.line.aktiv {
         background:#6c9cb2;
         transition:background, ease, .25s;
         }

         #logo_gross {
         position:absolute; left:50%; top:50%;
         margin:-32px 0 0 -130px;
         width:260px; height:65px;
         }

}


#all {
position:relative;
width:100%; height:100%;
}

#main {
padding-top:100vh;
margin:0 auto;
max-width:960px;
box-shadow:0 0 30px rgba(0,0,0,0.03);
}

section {
display:block;
*zoom:1;
padding:0 20px 80px 20px;
}

       section:before, section:after,
       #footer>div:before, #footer>div:after {
       content:' ';
       display:table;
       }

       section:after,
       #footer>div:after {
       clear:both;
       }

       section>div {
       max-width:660px;
       margin:0 auto;
       }


.center {
text-align:center;
}

#header h1 {
display:none;
}

#start {
padding:0;
}

/* Kompetenzen */

#kompetenzen,
#aktuelles {
background:#f8f8f8;
}

div.kasten {
border:1px solid #5c5c5c;
padding:30px 20px 25px 20px;
margin-bottom:45px;
}

         div.kasten h2 {
         margin:-41px auto 0 auto;
         }

         div.kasten h2 span {
         display:inline-block;
         background:#f8f8f8;
         padding:0 15px;
         }

         div.ausklapp {
         display:none;
         }

         a.ausklapp, a.top {
         display:block;
         position:relative; top:34px;
         margin:-15px auto 0 auto;
         width:30px; height:18px;
         background:#f8f8f8 url('img/pfeil.png') center center no-repeat;
         background-size:16px auto;
         overflow:hidden;
         text-indent:-1000px;
         }

         a.ausklapp.aktiv {
         transform:rotate(180deg);
         }

#kompetenzen li {
position:relative;
padding:0 0 0 15px;
}

#kompetenzen li:before {
content:'';
display:block;
position:absolute; left:0px; top:11px;
width:3px; height:3px;
border-radius:50%;
background:#5c5c5c;
}



/* Partner */

#partner h3 {
font-style:italic;
font-weight:300;
font-size:14px;
line-height:20px;
}

@media screen and (min-width:984px) {

body section#partner>div {
max-width:100%;
}

#partner>div>div {
float:left;
width:450px;
text-align:center;
padding-top:345px;
background-size:100% auto;
background-repeat:no-repeat;
}

#partner div.ausklapp { display:block; }
#partner a.ausklapp { display:none; }

#partner div.bihler { background-image:url('img/partner_desktop_bihler.jpg'); }
#partner div.barth { margin-left:20px; background-image:url('img/partner_desktop_barth.jpg'); }

}

@media screen and (max-width:983px) {

#partner>div>div {
width:100%;
margin:0 auto 50px auto;
text-align:center;
padding-top:calc((100% * 0.7111) + 25px);
background-size:100% auto;
background-position:center top;
background-repeat:no-repeat;
}

#partner div.bihler { background-image:url('img/partner_desktop_bihler.jpg'); }
#partner div.barth { background-image:url('img/partner_desktop_barth.jpg'); }

}



#partner a.ausklapp {
margin-top:-5px;
background-color:#fff;
}

/* Aktuelles */

#aktuelles li,
#archiv li {
background:#fff;
padding:15px 20px 35px 20px;
}

#aktuelles li {
margin-bottom:20px;
}

#aktuelles li span,
#archiv li span,
#aktuelles li h3,
#archiv li h3 {
float:left;
font-size:12px;
color:#c0c0c0;
}

#aktuelles li span,
#archiv li span {
min-width:120px;
}

#aktuelles li p,
#archiv li p {
clear:left;
}

#aktuelles li a.ausklapp,
#archiv li a.ausklapp {
background-color:#fff;
top:25px;
}


/* Kontakt */

#kontakt h2 {
font-size:22px;
font-weight:400;
text-align:left;
margin-top:65px;
}

#kontakt i {
display:inline-block;
min-width:70px;
}

@media screen and (min-width:984px) {

#kontakt p:nth-of-type(2),
#kontakt p:nth-of-type(3),
#kontakt p:nth-of-type(4) {
float:left;
width:33%;
}

}

/* Gerichtsstandorte, Datenschutz */

#datenschutz h1:nth-of-type(2) span:nth-of-type(2) {
display:none;
}

@media screen and (max-width:374px) {

#datenschutz h1:nth-of-type(2) span:nth-of-type(1) {
display:none;
}
#datenschutz h1:nth-of-type(2) span:nth-of-type(2) {
display:block;
}

}

.overlay {
display:none;
position:absolute; left:0px; top:55px;
width:100%;
min-height:calc(100% - 55px);
background:#fff;
border-bottom:4px solid #6c9cb2;
z-index:103;
}

.close {
position:fixed; right:0px; top:61px;
width:60px; height:60px;
text-indent:-1000px;
overflow:hidden;
z-index:104;
background:#fff;
border-radius:30px;
}

@media screen and (min-width:720px) {

.close {
right:calc((100% - 702px) / 2);
top:109px;
}

}

@media screen and (min-width:1176px) {

.close {
right:calc((100% - 894px) / 2);
}


}

.close:before,
.close:after {
content:'';
position:absolute; left:19px; top:29px;
display:block;
width:23px; height:3px;
background:#5c5c5c;
transform:rotate(45deg);
}

.close:after {
transform:rotate(-45deg);
}


#main .sort,
#main .sort a {
display:block;
font-size:12px;
color:#c0c0c0;
text-transform:uppercase;
text-align:center;
text-decoration:none;
}

#main .sort {
margin:-20px 0 45px 0;
}

#main .sort.aktiv a {
text-decoration:underline;
}

#gerichtsstandorte>div {
max-width:680px;
}

#gerichtsstandorte h2 {
text-align:left;
margin-bottom:24px;
}

#gerichtsstandorte div div {
line-height:30px;
}

#gerichtsstandorte div div.a {
display:none;
}

@media screen and (min-width:984px) {

.sort {
float:left;
width:50%;
}

#gerichtsstandorte div div {
float:left;
width:200px;
margin-left:20px;
}

#gerichtsstandorte div div:nth-of-type(3n+3) {
margin-top:48px;
}

}

@media screen and (max-width:983px) {

#gerichtsstandorte div div:nth-of-type(3n+3) {
margin-top:48px;
}

}

#archiv a.ausklapp,
#archiv div.kasten h2 span {
background-color:#fff;
margin-top:0;
}


#footer {
width:100%; height:100px;
background:#000;
color:#fff;
border-bottom:4px solid #6c9cb2;
}

         #footer>div {
         width:100%;
         max-width:660px;
         padding:20px 0;
         margin:0 auto;
         *zoom:1;
         text-align:center;
         }

         #footer a {
         font-size:20px;
         text-transform:uppercase;
         text-decoration:none;
         }

         #footer a.top {
         float:none;
         clear:both;
         background:url('img/top.png') center center no-repeat;
         background-size:16px auto;
         transform:none;
         top:20px;
         }

@media screen and (min-width:984px) {

         #footer a {
         float:left;
         }

         #footer a + a {
         float:right;
         }

}

@media screen and (max-width:983px) {

#footer {
height:124px;
}

         #footer a:first-of-type,
         #footer a:nth-of-type(2) {
         display:block;
         }

         #footer a:nth-of-type(2) {
         margin:12px 0;
         }

}

@media screen and (min-width:1176px) {

         #header div div {
         width:1152px; /* +192 */
         }

         #nav {
         width:919px;
         }

         #main {
         max-width:1152px;
         }

         #footer>div,
         section:not(#gerichtsstandorte)>div {
         max-width:852px;
         }

         #partner div.bihler { margin-left:76px; }
         #partner div.barth { margin-left:60px; }

}