/* Global */

body, html {
font-family: 'Roboto', Arial, sans-serif;
font-size: 1em;
font-weight: normal;
color: #ffffff;
line-height: 1.5em;
height: 100%;
width: 100%;
min-width: 320px;
margin: 0px;
padding: 0px;
text-align: left;
-ms-text-size-adjust: none;
-webkit-text-size-adjust: none;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

img { border: 0px; text-decoration: none; border-style: none; border-width: 0; }
a { outline: 0; -moz-outline: 0 }
b, strong { font-weight: 500; }
i, em { font-style: italic; }
form { margin: 0px; padding: 0px; }
p { margin: 0px; padding: 0px; }
ul { margin: 0px; padding: 0px; }
li { margin-left: 15px; }
.wh100 { width: 100%; height: auto; }

.cb { clear: both; }
.fl { float: left; }
.fr { float: right; }

.dispb { display: block; }
.dispn { display: none; }

.do { display: inline-block; }
.mo { display: none; }

* {
box-sizing: border-box;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

#textcontent {
width: 100%;
max-width: 1000px;
color: #000000;
margin: 0px auto;
padding: 50px 25px 50px 25px;
}

.office {
background: #ec6500;
width: 100%;
height: 100%;
padding: 25px;
}

#logo {
position: absolute;
top: 20px;
left: 10px;
width: 65%;
height: auto;
}

#desc {
position: absolute;
bottom: 25px;
left: 30px;
height: auto;
font-size: 100%;
line-height: 1.5em;
}

#claim {
position: absolute;
top: 25px;
left: 40px;
height: auto;
font-size: 3em;
line-height: 1.1em;
font-weight: 300;
}

#contact {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;

}

h2.touch {
font-size: 4.5em;
line-height: 1.1em;
font-weight: 300;
margin: 0px 0px 20px 0px;
padding: 0px;
text-transform: uppercase;
}

#contact a {
color: #ffffff;
text-decoration: none;
font-size: 1.2em;
line-height: 100%;
display: block;
min-height: 50px;
padding: 12px 0px 0px 50px;
margin: 0px 0px 10px 0px;
transform: scale(1);
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

#contact a:hover {
transform: scale(1.05);
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

#iconmenu {
position: absolute;
left: 30px;
bottom: 10px;
}

.icon_loc {
background: url(imgs/icon_location.png) top left no-repeat;
background-size: 40px 40px;
}

.icon_mail {
background: url(imgs/icon_mail.png) top left no-repeat;
background-size: 40px 40px;
}

.icon_phone {
background: url(imgs/icon_phone.png) top left no-repeat;
background-size: 40px 40px;
}

#impmenu {
position: absolute;
top: 130px;
right: -70px;
transform: rotate(-90deg);
text-transform: uppercase;
z-index: 33;
font-size: 90%;
color: #000000;
}

#impmenu a {
color: #000000;
text-decoration: none;
}

#impmenu a:hover {
color: #000000;
text-decoration: underline;
}

/* Raster */

.stern {
position: absolute;
top: 20px;
right: 20px;
z-index: 5;
width: 40px;
height: 40px;
background: url(imgs/stern.png) top left no-repeat;
background-size: 40px 40px;
}

#susi ul { 
margin: 0px; 
padding: 0px; 
width: 100%;
line-height: 0px;
}

#susi ul li img { 
margin: 0px; 
padding: 0px;
width: 100%;
height: auto;
}

#susi ul li { 
position: relative;
margin: 0px; 
padding: 0px;
float: left;
list-style-type: none;
width: 33.33%;
width: calc(100% / 3);
height: auto;
display: block;
overflow: hidden;
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

#susi ul li div.mehr { 
position: absolute;
top: 0px;
left: 0px;
margin: 0px; 
padding: 0px;
width: 100%;
height: 100%;
display: block;
opacity: 0;
transform: scale(1.2);
cursor: pointer;
z-index: 10;
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

#susi ul li:hover div.mehr { 
opacity: 1;
transform: scale(1);
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

.upsumhead {
height: 50px;
width: auto;
overflow: hidden;
}


@media only screen and (max-width: 1400px) {

#impmenu {
position: absolute;
top: 110px;
right: -70px;
transform: rotate(-90deg);
text-transform: uppercase;
z-index: 33;
font-size: 80%;
}


#contact a {
color: #ffffff;
text-decoration: none;
font-size: 1em;
line-height: 100%;
display: block;
min-height: 40px;
padding: 12px 0px 0px 50px;
margin: 0px 0px 10px 0px;
transform: scale(1);
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

}

@media only screen and (max-width: 1200px) {

#desc {
position: absolute;
bottom: 25px;
left: 28px;
height: auto;
font-size: 85%;
line-height: 1.4em;
}

}


@media only screen and (max-width: 1100px) {

#iconmenu {
position: absolute;
left: 20px;
bottom: 5px;
}

#contact a {
color: #ffffff;
text-decoration: none;
font-size: 0.9em;
line-height: 100%;
display: block;
min-height: 30px;
padding: 10px 0px 0px 40px;
margin: 0px 0px 10px 0px;
transform: scale(1);
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

.icon_loc {
background: url(imgs/icon_location.png) top left no-repeat;
background-size: 30px 30px;
}

.icon_mail {
background: url(imgs/icon_mail.png) top left no-repeat;
background-size: 30px 30px;
}

.icon_phone {
background: url(imgs/icon_phone.png) top left no-repeat;
background-size: 30px 30px;
}

}


@media only screen and (max-width: 900px) {

#susi ul li { 
margin: 0px; 
padding: 0px;
float: left;
list-style-type: none;
width: 50%;
height: auto;
display: block;
overflow: hidden;
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}


}


@media only screen and (max-width: 600px) {


#susi ul li { 
margin: 0px; 
padding: 0px;
float: left;
list-style-type: none;
width: 100%;
height: auto;
display: block;
overflow: hidden;
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}


#contact a {
color: #ffffff;
text-decoration: none;
font-size: 1.2em;
line-height: 100%;
display: block;
min-height: 40px;
padding: 12px 0px 0px 50px;
margin: 0px 0px 10px 0px;
transform: scale(1);
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

#iconmenu {
position: absolute;
left: 30px;
bottom: 10px;
}

.icon_loc {
background: url(imgs/icon_location.png) top left no-repeat;
background-size: 40px 40px;
}

.icon_mail {
background: url(imgs/icon_mail.png) top left no-repeat;
background-size: 40px 40px;
}

.icon_phone {
background: url(imgs/icon_phone.png) top left no-repeat;
background-size: 40px 40px;
}

}



@media only screen and (max-width: 400px) {

#iconmenu {
position: absolute;
left: 20px;
bottom: 5px;
}

#contact a {
color: #ffffff;
text-decoration: none;
font-size: 0.9em;
line-height: 100%;
display: block;
min-height: 30px;
padding: 10px 0px 0px 40px;
margin: 0px 0px 10px 0px;
transform: scale(1);
-o-transition: all 400ms ease 10ms;
-moz-transition: all 400ms ease 10ms;
-ms-transition: all 400ms ease 10ms;
-webkit-transition: all 400ms ease 10ms;
transition: all 400ms ease 10ms;
}

.icon_loc {
background: url(imgs/icon_location.png) top left no-repeat;
background-size: 30px 30px;
}

.icon_mail {
background: url(imgs/icon_mail.png) top left no-repeat;
background-size: 30px 30px;
}

.icon_phone {
background: url(imgs/icon_phone.png) top left no-repeat;
background-size: 30px 30px;
}

}