@font-face {
    font-family: 'Roboto Condensed';
    src: url('../fonts/RobotoCondensed-Regular.eot');
    src: url('../fonts/RobotoCondensed-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/RobotoCondensed-Regular.woff2') format('woff2'),
        url('../fonts/RobotoCondensed-Regular.woff') format('woff'),
        url('../fonts/RobotoCondensed-Regular.ttf') format('truetype'),
        url('../fonts/RobotoCondensed-Regular.svg#RobotoCondensed-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto Condensed';
    src: url('../fonts/RobotoCondensed-Bold.eot');
    src: url('../fonts/RobotoCondensed-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/RobotoCondensed-Bold.woff2') format('woff2'),
        url('../fonts/RobotoCondensed-Bold.woff') format('woff'),
        url('../fonts/RobotoCondensed-Bold.ttf') format('truetype'),
        url('../fonts/RobotoCondensed-Bold.svg#RobotoCondensed-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto Condensed';
    src: url('../fonts/RobotoCondensed-Light.eot');
    src: url('../fonts/RobotoCondensed-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/RobotoCondensed-Light.woff2') format('woff2'),
        url('../fonts/RobotoCondensed-Light.woff') format('woff'),
        url('../fonts/RobotoCondensed-Light.ttf') format('truetype'),
        url('../fonts/RobotoCondensed-Light.svg#RobotoCondensed-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/roboto-v18-latin-300.eot');
  src: local('Roboto Light'), local('Roboto-Light'),
       url('../fonts/roboto-v18-latin-300.eot?#iefix') format('embedded-opentype'), 
       url('../fonts/roboto-v18-latin-300.woff2') format('woff2'), 
       url('../fonts/roboto-v18-latin-300.woff') format('woff'), 
       url('../fonts/roboto-v18-latin-300.ttf') format('truetype'), 
       url('../fonts/roboto-v18-latin-300.svg#Roboto') format('svg'); 
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v18-latin-regular.eot');
  src: local('Roboto'), local('Roboto-Regular'),
       url('../fonts/roboto-v18-latin-regular.eot?#iefix') format('embedded-opentype'), 
       url('../fonts/roboto-v18-latin-regular.woff2') format('woff2'), 
       url('../fonts/roboto-v18-latin-regular.woff') format('woff'), 
       url('../fonts/roboto-v18-latin-regular.ttf') format('truetype'), 
       url('../fonts/roboto-v18-latin-regular.svg#Roboto') format('svg'); 
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/roboto-v18-latin-100.eot'); 
  src: local('Roboto thin'), local('Roboto-thin'),
  	url('../fonts/roboto-v18-latin-100.eot?#iefix') format('embedded-opentype'), 
       url('../fonts/roboto-v18-latin-100.woff2') format('woff2'), 
       url('../fonts/roboto-v18-latin-100.woff') format('woff'), 
       url('../fonts/roboto-v18-latin-100.ttf') format('truetype'), 
       url('../fonts/roboto-v18-latin-100.svg#Roboto') format('svg');        
}



html, body{
width: 100%; 
height: 100%; 
padding: 0px; 
margin: 0px; 
font-family: 'Roboto', 'Segue', 'Open Sans', 'Helvetica', 'Arial';
font-weight: 300;
}

#links, #row_one, #row_two, #rechts{
width: 25%; 
height: 100%; 
padding: 0px; 
margin: 0px; 
border-right: 0px solid #FF0000; 
float: left; 
position: relative; 
}

#row_data{
width: 40%; 
min-height: 50%; 
padding: 0px 5% 80px 5%; 
margin: 0px; 
border-right: 0px solid #FF0000; 
float: right; 
position: relative; 
display: block; 
}
#row_data .textbox{
display: block; 
padding: 0px 0px 80px 5%; 
}


#logobox, #navbox{
min-height: 190px;
}
#footerbox{
min-height: 166px;
}
.bilderlinks, .bilderrechts{
min-height: 230px; 
}
.bildmitte{
min-height: 706px; 
}

.textbox, .textboxzwei{
border: 0px solid #FF0000; 
background-repeat: repeat; 
background-image: url(../images/sys/weiss_90.png); 
display: block; 
padding: 20px 5% 20px 5%; 
margin: 0px; 
font-size: 1.0vw; 
line-height: 1.8em; 
opacity: 0.0; 
    -webkit-transition: 1.0s ease-in-out;
    -moz-transition: 1.0s ease-in-out;
    -o-transition: 1.0s ease-in-out;
    -ms-transition: 1.0s ease-in-out;
    transition: 1.0s ease-in-out;
}
.textbox{
width: calc(90% - 6px); 
position: absolute; 
top: 8px; 
min-height: 25%; 
}
.textboxzwei{
min-height: calc(100% - 40px);
width: 90%; 
position: relative; 
top: 0px; 
}


#row_one .textbox{
top: 31%; 
height: 62%; 
}
.versicherungsschaeden #row_one .textbox, .kontakt #row_one .textbox{
top: 0%; 
height: auto; 
min-height: 28%; 
}

.textbox.open, .textboxzwei.open{
opacity: 1.0; 
}

.textbox.open a:link, .textbox.open a:visited, .textboxzwei.open a:link, .textboxzwei.open a:visited, #row_data a:link, #row_data a:visited{
text-decoration: none; 
color: #000000; 
font-weight: 400;
    -webkit-transition: 1.0s ease-in-out;
    -moz-transition: 1.0s ease-in-out;
    -o-transition: 1.0s ease-in-out;
    -ms-transition: 1.0s ease-in-out;
    transition: 1.0s ease-in-out;
}

.textbox.open a:hover, .textbox.open a:focus, .textboxzwei.open a:hover, .textboxzwei.open a:focus, #row_data a:hover, #row_data a:focus{
color: #2561A9; 
}

.textbox h2, .textboxzwei h2{
font-size: 1.2vw; 
padding: 0px 0px 20px 0px; 
margin: 0px; 
}
.small{
font-size: 0.9vw; 
}
h2{
font-weight: 500; 
}

#logobox, #footerbox{
border-bottom: 0px solid #FF0000; 
width: 90%; 
height: calc(32% - 60px); 
float: left; 
padding: 0px 0px 0px 10%; 
margin: 50px 0px 0px 0px; 
}

#logobox{
font-family: 'Roboto Condensed', 'Segue', 'Open Sans', 'Helvetica', 'Arial';
width: 90%; 
}
#navresp, #footerbox_zwei{
display: none; 
padding: 0px; 
margin: 0px; 
border: 0px solid #FF0000; 
}
ul#nav_resp, ul#nav_resp.zu{
    position: relative;
    display: block;
    max-height: 0px;
    overflow: hidden;
    border: 0px solid #000000;
    width: calc(100% - 4px);
    padding: 50px 2px 0px 2px;
    margin: 20px 0px 0px 0px;
    background-image: url(../images/sys/nav_resp.png);
    background-position: right top;
    background-repeat: no-repeat;
    background-color: #2561A9;
    list-style-type: none;
    -webkit-transition: 1.0s ease-in-out;
    -moz-transition: 1.0s ease-in-out;
    -o-transition: 1.0s ease-in-out;
    -ms-transition: 1.0s ease-in-out;
    transition: 1.0s ease-in-out;
}
ul#nav_resp.offen {
    padding: 50px 2px 0px 2px;
    margin: 20px 0px 0px 0px;
    max-height: 5000px;
    height: auto;
}
ul#nav_resp li{
min-height: 50px; 
padding: 0px; 
margin: 0px; 
}
ul#nav_resp li.letzter{
padding: 0px 0px 60px 0px; 
}

ul#nav_resp a:link, ul#nav_resp a:visited{
text-decoration: none; 
display: block; 
width: 90%; 
color: #FFFFFF; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
line-height: 3.0vw; 
padding: 0px 0px 0px 10%; 
border-top: 1px solid #2561A9; 
border-bottom: 1px solid #2561A9; 
font-size: 1.3em; 
line-height: 50px; 
}
ul#nav_resp a:hover, ul#nav_resp a:focus, ul#nav_resp li.aktiv a:link, ul#nav_resp li.aktiv a:visited{
border-top: 1px solid #C4D3EB; 
border-bottom: 1px solid #C4D3EB;
}



#navbox{
font-family: 'Roboto', 'Segue', 'Open Sans', 'Helvetica', 'Arial';
height: calc(32% - 68px); 
float: left;
padding: 25px 0px 25px 0px; 
margin: 8px 0px 0px 0px; 
border-bottom: 0px solid #FF0000; 
width: calc(100% - 8px); 
background-color: #E8EFF7; 
font-size: 1.0vw; 
font-weight: 400; 
}
ul#nav{
list-style-type: none; 
padding: 0px; 
margin: 0px; 
height: 100%; 
width: 100%; 
display: inline-block; 
border: 0px solid #0000FF; 
}
ul#nav li{
width: 100%; 
display: inline-block; 
padding: 0px; 
margin: 0px 0px 0px 0px; 
float: left; 
}

ul#nav li a:link, ul#nav li a:visited{
text-decoration: none; 
display: block; 
color: #2561A9; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
line-height: 3.0vw; 
padding: 0px 0px 0px 10%; 
border-top: 1px solid #E8EFF7; 
border-bottom: 1px solid #E8EFF7; 
}

ul#nav li a:hover, ul#nav li a:focus, ul#nav li.aktiv a:link, ul#nav li.aktiv a:visited{
color: #000000; 
padding: 0px 0px 0px 11%; 
background-color: #FFFFFF; 
background-position: right 0px; 
border-top: 1px solid #C4D3EB; 
border-bottom: 1px solid #C4D3EB; 
}

#footerbox{
position: relative; 
}
#footer{
position: absolute; 
left: 10%; 
bottom: 0px; 
font-size: 0.9em; 
}
#footer a:link, #footer a:visited, #footer_resp a:link, #footer_resp a:visited
{
text-decoration: none; 
color: #000000; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
}
#footer a:hover, #footer a:focus{
color: #2561A9; 
}

#logo{
text-transform: uppercase; 
font-weight: 900;
font-size: 2.5vw; 
text-align: left;
width: 100%; 
border: 0px solid #0000FF; 
letter-spacing: 0.3em; 
color: #FFFFFF; 
-webkit-transition: 1.5s ease-in-out;
-moz-transition: 1.5s ease-in-out;
-o-transition: 1.5s ease-in-out;
-ms-transition: 1.5s ease-in-out;
transition: 1.5s ease-in-out; 
}

.immologo{
font-family: 'Roboto Condensed', 'Segue', 'Open Sans', 'Helvetica', 'Arial';
font-weight: 300;
border: 0px solid #FF0000; 
text-align: left;
font-size: 1.6vw; 
letter-spacing: 0.1em;
float: left; 
color: #FFFFFF; 
-webkit-transition: 1.5s ease-in-out;
-moz-transition: 1.5s ease-in-out;
-o-transition: 1.5s ease-in-out;
-ms-transition: 1.5s ease-in-out;
transition: 1.5s ease-in-out; 
}
.oe_lig{
font-family: 'Roboto Condensed', 'Segue', 'Open Sans', 'Helvetica', 'Arial';
font-weight: 300;
color: #FFFFFF; 
position: relative; 
top: 0px; 
border: 0px solid #FF0000; 
-moz-transform: rotate(350deg);
-ms-transform: rotate(350deg);
-o-transform: rotate(350deg);
-webkit-transform: rotate(350deg);
transform: rotate(350deg);
font-size: 1.6vw; 
letter-spacing: 0.1em;
float: left; 
background-repeat: no-repeat; 
background-size: 80% auto; 
background-position: 0px -500px; 
background-image: url(../images/sys/oe.jpg); 
-webkit-transition: 1.5s ease-in-out;
-moz-transition: 1.5s ease-in-out;
-o-transition: 1.5s ease-in-out;
-ms-transition: 1.5s ease-in-out;
transition: 1.5s ease-in-out; 
}
.oe_lig:hover, .oe_lig:focus{
-moz-transform: rotate(365deg);
-ms-transform: rotate(365deg);
-o-transform: rotate(365deg);
-webkit-transform: rotate(365deg);
transform: rotate(365deg);
}

#logo.aktiv, .immologo.aktiv, .oe_lig.aktiv{
color: #2561A9; 
}
.oe_lig.aktiv{
background-position: 0px 2px; 
}

ul.logodesc{
font-family: 'Roboto', 'Segue', 'Open Sans', 'Helvetica', 'Arial';
font-weight: 300;
color: #000000; 
margin: 0px 0px 0px 0px; 
padding: 50px 0px 0px 0px; 
font-size: 0.8vw; 
display: block; 
text-transform: uppercase; 
list-style-type: none; 
list-style-image: url('../images/sys/list_style_1.png');
}
.bilderlinks, .bildmitte, .bilderrechts{
display: block; 
float: left; 
width: calc(100% - 8px); 
padding: 0px 0px 0px 0px; 
margin: 8px 0px 0px 0px; 
background-color: #DFDFDF; 
border-left: 0px solid #0000FF;
border-bottom: 0px solid #0000FF; 
}
.bilderlinks, .bilderrechts{
height: calc(32% - 18px); 
}
.bildmitte{
height: calc(96% - 38px); 
}
#bildeins, #bildzwei, #bilddrei, #bildvier, #bildfuenf, #bildsechs, #bildsieben{
height: 100%; 
width: 100%; 
display: block; 
padding: 0px; 
margin: 0px; 
background-size: cover; 
background-position: center center; 
opacity: 1.0; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
}

#bildeins:hover, #bildzwei:hover, #bilddrei:hover, #bildvier:hover, #bildfuenf:hover, #bildsechs:hover, #bildsieben:hover, #bildeins:focus, #bildzwei:focus, #bilddrei:focus, #bildvier:focus, #bildfuenf:focus, #bildsechs:focus, #bildsieben:focus
{
/*opacity: 0.8; */
}

#bildeins{background-image: url(../images/referenzen/eins.jpg); }
#bildzwei{background-image: url(../images/referenzen/zwei.jpg); } 
#bilddrei{background-image: url(../images/referenzen/drei.jpg); }
#bildvier{background-image: url(../images/referenzen/vier.jpg); }
#bildfuenf{background-image: url(../images/referenzen/fuenf.jpg); }
#bildsechs{background-image: url(../images/referenzen/sechs.jpg); } 
#bildsieben{background-image: url(../images/referenzen/sieben.jpg); }

.immo #bildeins{background-image: url(../images/immogutachten/eins.jpg); }
.immo #bildzwei{background-image: url(../images/immogutachten/zwei.jpg); } 
.immo #bilddrei{background-image: url(../images/immogutachten/drei.jpg); }
.immo #bildvier{background-image: url(../images/immogutachten/vier.jpg); }
.immo #bildfuenf{background-image: url(../images/immogutachten/fuenf.jpg); }
.immo #bildsechs{background-image: url(../images/immogutachten/sechs.jpg); } 
.immo #bildsieben{background-image: url(../images/immogutachten/sieben.jpg); }

.versicherungsschaeden #bildeins{background-image: url(../images/versschaeden/eins.jpg); }
.versicherungsschaeden #bildzwei{background-image: url(../images/versschaeden/zwei.jpg); } 
.versicherungsschaeden #bilddrei{background-image: url(../images/versschaeden/drei.jpg); }
.versicherungsschaeden #bildvier{background-image: url(../images/versschaeden/vier.jpg); }
.versicherungsschaeden #bildfuenf{background-image: url(../images/versschaeden/fuenf.jpg); }
.versicherungsschaeden #bildsechs{background-image: url(../images/versschaeden/sechs.jpg); } 
.versicherungsschaeden #bildsieben{background-image: url(../images/versschaeden/sieben.jpg); }

.beweis #bildeins{background-image: url(../images/beweissicherung/eins.jpg); }
.beweis #bildzwei{background-image: url(../images/beweissicherung/zwei.jpg); } 
.beweis #bilddrei{background-image: url(../images/beweissicherung/drei.jpg); }
.beweis #bildvier{background-image: url(../images/beweissicherung/vier.jpg); }
.beweis #bildfuenf{background-image: url(../images/beweissicherung/fuenf.jpg); }
.beweis #bildsechs{background-image: url(../images/beweissicherung/sechs.jpg); } 
.beweis #bildsieben{background-image: url(../images/beweissicherung/sieben.jpg); }


.leithold{
width: 25%; 
padding: 0px 75% 0px 0px; 
margin: 0px; 
float: left; 
}
ul.sachverstaendige{
padding: 0px; 
margin: 0px; 
line-height: 1.1em; 
list-style-type: circle; 
}

#footerlinks{
position: fixed; 
bottom: 0px; 
right: 8px; 
border: 0px solid #0000FF;
}
#koimda{
padding: 0px; 
margin: 0px; 
list-style-type: none; 
height: 50px; 
}
#koimda li{
float: left; 
padding: 5px 20px 5px 20px; 
margin: 0px; 
border-right: 1px solid #2561A9; 
background-color: #FFFFFF; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
}
#koimda li.last{
border-right: 0px solid #2561A9; 
}
#koimda li a:link, #koimda li a:visited{
text-decoration: none; 
color: #2561A9; 
font-size: 1.0vw; 
}
#koimda li:hover, #koimda li:focus{
color: #000000; 
background-color: #E8EFF7; 
}





@media screen and (max-width: 1200px) {
#logo{border: 0px solid #2561A9;font-size: 3.5em; border: 0px solid #FF0000; }
.immologo{font-size: 2em;}
.oe_lig{font-size: 2.1em;}
ul.logodesc{font-size: 0.8em; padding: 70px 0px 30px 0px;}
#navbox{display: none; }
#navresp{display: inline-block; width: 100%; }
.bildmitte, #links{
width: 100%; 
height: auto; 
}
#row_one .textbox, #row_two .textbox, #rechts .textbox, .textboxzwei{
font-size: 1.0em; 
max-height: 1000%; 
height: auto; 
z-index: 100;  
top: 0px;
padding: 20px 5% 100px 5%;
}
#row_one .textbox, #row_two .textbox, #rechts .textbox {
width: 90%; 
}

.textbox h2, .textboxzwei h2{
font-size: 1.1em; 
font-weight: 500;
}
.small{
font-size: 0.8em; 
}
.bilderlinks, .bildmitte, .bilderrechts{
background-color: #FFFFFF;
}
.bildmitte{
height: 200px; 
min-height: 200px; 
margin: 8px 0px 8px 0px; 
}
.bilderlinks{
width: 32%; 
min-height: 200px; 
float: left; 
margin: 0px 1% 0px 0px; 
padding: 0px; 
}
.bilderlinks.last{
margin: 0px 0px 0px 0px; 
width: 34%; 
}
.bilderrechts{
width: 100%; 
min-height: 100%; 
float: left; 
margin: 30px 0px 0px 0px; 
padding: 0px; 
}
.leithold{
max-height: 200px; 
width: auto; 
padding: 0px 30px 0px 0px;
}

.bilderrechts.last{display: none; }
#bildfuenf, #bildsechs{background-image:none; min-height: 250px; }
#row_one{
margin: 3px 0px 0px 0px; 
}
#rechts{
margin: 0px 0px 140px 0px; 
}
#row_one, #row_two, #rechts{
width: 100%; height: 200px; 
}
#row_two{margin: 0px 0px 0px 0px; z-index: 1;  }
#row_data, #row_one{width: 100%; }

.kontakt #row_data, .datenschutz #row_data{
width: 90%; 
}
.kontakt #row_one .textboxzwei, .datenschutz #row_one .textboxzwei{
display: none; 
}


#footerbox{
display: none; 
}
#footerbox_zwei{
display: inline-block; 
float: left; 
width: 100%; 
border-top: 0px solid #DFDFDF; 
}
#footer_resp{
font-size: 0.85em; 
opacity: 1.0; 
padding: 10px 0px 0px 0px; 
margin: 10px 0px 10px 0px; 
text-align: center; 
-webkit-transition: 0.5s linear;
-moz-transition: 0.5s linear;
-o-transition: 0.5s linear;
-ms-transition: 0.5s linear;
transition: 0.5s linear; 
height: auto; 
}
#footer_resp a:link, #footer_resp a:visited{
text-decoration: none; 
color: #000000; 
}
#footer_resp a:hover, #footer_resp a:focus{
color: #2561A9; 
}
#footer_resp.close{
padding: 0px 0px 0px 0px; 
margin: 0px 0px 0px 0px; 
height: 10px; 
opacity: 0.0; 
}

#footerlinks{
bottom: 0px; 
display: block; 
width: 96%; 
right: 0px; 
background-repeat: repeat; 
background-image: url(../images/sys/weiss_95.png); 
border-top: 1px solid #DFDFDF; 
padding: 0px 2% 0px 2%; 
margin: 5px 0px 0px 0px;
z-index: 110;
}

#koimda{
display: inline-block; 
float: left; 
width: 100%; 
height: auto; 
padding: 0px 0px 0px 0px; 
margin: 0px; 
display: table; 
table-layout: fixed; 
padding: 10px 0px 0px 0px; 
margin: 0px; 
}
#koimda li{
background-color: transparent; 
display: table-cell;
width: 32%;
margin: 0px; 
padding: 0px;
text-align: center; 
}
#koimda li a:link, #koimda li a:visited{
font-size: 1.0em;
margin: 0px; 
padding: 5px 0px 5px 0px;
}


}