﻿@import url("reset.css");
@import url(http://fonts.googleapis.com/css?family=Aldrich);

body {
margin:0;
padding:0;
background-color:#ffffff;
font-family: Arial, sans-serif;
font-size: 62.5%;
color: #2b3d47;
font-style: normal; 
line-height: normal;
}

#top {
position:relative;
width:100%;
height:273px;
background-color:white;
z-index:10000;
}
#top #servNav {
position:relative;
margin:4px auto -4px auto;
max-width:128.0em;
text-align:right;
height:20px;
}
#top #servNav a {
font-size:1.4em;
line-height:2.0em;
font-weight:bold;
text-transform:uppercase;
text-decoration:none;
color:#2b3d47;
margin-right:20px;
}
#top #servNav a:hover {
text-decoration:underline;
}
#top #logo {
position:relative;
margin:0 auto 20px auto;
max-width:52.5em;
}
#top #logo img {
width:100%;
}

/*tmp umzugadresse */
#top #umzugAdresse {
position:relative;
margin:16px auto 14px auto;
}
#top #umzugAdresse p {
text-align:center;
font-size:1.4em;
line-height:1.2em;
}
#top #umzugAdresse p a {
text-decoration:none;
color:#2b3d47;
}
#top {
height:283px;
}
/* tmp umzugadresse*/

#top #mainNav,
#content #sliderBorderBottom {
position:relative;
width:100%;
height:56px;
border-top:2px solid black;
border-bottom:2px solid black;
background-image:url(../img/mainNavHg.png);
background-repeat:repeat-x;
}
#top #mainNav nav {
display:none;
}
/*
#top #mainNav nav {
position:relative;
margin:0 auto;
width:128.0em;
}
#top #mainNav ul {
position:relative;
list-style-type:none;
height:3.2em;
padding-top:1.0em;
font-family: 'Aldrich', sans-serif;
}
#top #mainNav ul li {
position:relative;
float:left;
margin:0 0 0 1.0em;
padding:0 0 2.0em 1.4em;
color:#a4c621;
}
#top #mainNav ul li a {
font-size:1.6em;
line-height:1.2em;
text-decoration:none;
color:#004696;
display:block;
}
#top #mainNav ul li a:hover {
color:#a4c621;
}
#top #mainNav ul li a.active {
font-weight:bold;
}
#top #mainNav ul li.first {
background-image:none;
}
*/

#content {
position:relative;
overflow:auto;
text-align:center;
width:100%;
}
#content #headImageSlider {
position:relative;
margin:0 auto;
max-height:503px;
background-image:url(../img/sliderHg.jpg);
background-repeat:no-repeat;
//background-position:center center;
background-size:cover;
}
#content #headImageSlider figure figcaption {
font-family: Arial, sans-serif;
position:absolute;
top:60px;
left:28%;
color:#d00b37;
font-size:3.2em;
line-height:1.5em;
font-weight:bold;
}


h1 {
font-family: 'Aldrich', sans-serif;
text-transform:uppercase;
color:#d00b37;
font-weight:normal;
font-size:3.2em;
line-height:1.6em;
}
h2 {
font-family: 'Aldrich', sans-serif;
text-transform:uppercase;
font-size:2.2em;
line-height:1.6em;
margin-bottom:0.8em;
}
i {
font-style:italic;
}

#content .contentBlock {
position:relative;
margin:0 auto;
max-width:1280px;
text-align:center;
}
#content .contentBlock .contentText {
position:relative;
margin:0 auto;
max-width:772px;
text-align:center;
}
#content .contentBlock p {
font-size:1.4em;
line-height:1.5em;
margin-bottom:1.5em;
text-align:justify;
-moz-text-align-last:center;
text-align-last:center;
}

#content .contentBlock #madeIn {
position:absolute;
bottom:-95px;
right:60px;
}

#content .contentBlock .zOnTop {
z-index:100000;
}
#content .contentBlock .zOnTop figure {
margin-left:35%;
margin-right:35%;
}

#content .contentBlock .pearl {
position:relative;
margin:-140px 0 20px 0;
}
/****/
#content .contentBlock .pearl figure.pearlRed {
margin-left:38%;
margin-right:38%;
}
/****/
#content .contentBlock .pearl figcaption {
position:absolute;
width:100%;
text-align:center;
top:92px;
}
#content .contentBlock .pearl figcaption span {
font-family: 'Aldrich', sans-serif;
text-transform:uppercase;
font-size:2.2em;
line-height:1.6em;
color:white;
}
#content .contentBlock .pearl figcaption span a {
color:white;
text-decoration:none;
}
#content .contentBlock .pearl figcaption span a:hover {
text-decoration:underline;
}

#content .borderPerle {
position:relative;
width:100%;
height:56px;
border-top:2px solid black;
border-bottom:2px solid black;
background-color:#2b3d47;
margin-top:110px;
}

#content .contentBlock .contentImages {
position:relative;
margin:0 auto;
max-width:980px;
text-align:center;
padding-left:20px;
}
#content .contentBlock .contentImages .singleImg {
position:relative;
float:left;
width:33%;
text-align:center;
margin-bottom:6.0em;
}
#content .contentBlock .contentImages .singleImgSingle {
position:relative;
float:none;
width:33%;
text-align:center;
margin-bottom:6.0em;
margin:0 auto;
}

#content .contentBlock .contentImages .singleImgSingle figure.noPadLeft {
margin-left:-10px;
}

#content .contentBlock .contentImages .singleImgDoubleLeft,
#content .contentBlock .contentImages .singleImgDoubleRight {
position:relative;
float:left;
width:50%;
margin-bottom:6.0em;
margin:0 auto;
}
#content .contentBlock .contentImages .singleImgDoubleLeft figure {
position:relative;
float:right;
text-align:center;
margin-right:20px;
}
#content .contentBlock .contentImages .singleImgDoubleRight figure {
position:relative;
float:left;
text-align:center;
margin-left:10px;
}

#content .contentBlock .contentImages .singleImg figcaption span {
font-size:1.4em;
line-height:1.5em;
margin-bottom:1.5em;
}
#content .contentBlock .contentImages .singleImg figcaption span a {
color:#2b3d47;
text-decoration:underline;
}
#content .contentBlock .contentImages .singleImg figcaption span a:hover {
text-decoration:none;
}

#content .contentBlock p.footerAddress {
margin-top:-15px;
}
#content .contentBlock p.footerToTop {
position:absolute;
right:30px;
top:40px;
text-align:right;
-moz-text-align-last:right;
}
#content .contentBlock p.footerToTop a {
padding-left:22px;
background-image:url(../img/toTop.png);
background-repeat:no-repeat;
background-position:left 3px;
}

#footerWrapper {
position:relative;
margin:0 auto;
width:100%;
overflow:auto;
height:20.0em;
}


a {
color:#d00b37;
text-decoration:underline;
}
a:link,
a:visited { 
}
a:hover,
a:active { 
text-decoration:none;
}

a.noDecoration {
text-decoration:none;
color:#2b3d47;
}

a:focus{ outline:0; }
b, strong { font-weight:bold; }
img {
max-width: 100%;
height: auto;
}





@media screen and (max-width: 1280px) {
#content #headImageSlider figure figcaption {
top:40px;
left:24%;
}
}


@media screen and (max-width: 1024px) {
#content #headImageSlider figure figcaption {
top:35px;
left:15%;
}
}


@media screen and (max-width: 960px) {
#content .contentBlock .zOnTop figure,
#content .contentBlock .pearl figure.pearlRed {
margin-top:2%;
}
#content .contentBlock .pearl figcaption {
top:36%;
}
#content .contentBlock .pearl figcaption span {
line-height:2.2em;
}
/*tmp umzugadresse */
#top {
height:293px;
}
/* tmp umzugadresse*/
#content #headImageSlider figure figcaption {
left:8%;
}
}



@media screen and (max-width: 820px) {
#content .contentBlock p {
padding:0 10px 0 10px;
}
#content .contentBlock #madeIn {
z-index:1000;
right:10px;
}
#top {
height:245px;
}
#content .contentBlock .zOnTop figure {
margin-top:5%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-top:4%;
}
#content .contentBlock .pearl figcaption {
top:37%;
}
#top #mainNav,
#content #sliderBorderBottom,
#content .borderPerle {
height:28px;
}
/*tmp umzugadresse */
#top {
height:280px;
}
/* tmp umzugadresse*/
#top #servNav {
text-align:left;
margin-left:10px;
}
}


@media screen and (max-width: 760px) {
#content .contentBlock .zOnTop figure {
margin-left:38%;
margin-right:38%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-left:41%;
margin-right:41%;
}
#content .contentBlock .zOnTop figure {
margin-top:7%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-top:8%;
}
#content .contentBlock .pearl figcaption span {
font-size:1.4em;
line-height:2.2em;
}
#content .contentBlock p.footerToTop {
position:relative;
right:auto;
top:auto;
text-align:center;
-moz-text-align-last:center;
margin-top:20p;
font-weight:bold;
}
#content #headImageSlider figure figcaption {
top:15px;
left:2%;
font-size:2.8em;
}
}


@media screen and (max-width: 650px) {
#content .contentBlock .zOnTop figure {
margin-top:13%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-top:13%;
}

	
}


@media screen and (max-width: 570px) {
#top {
height:auto;
}
#top #logo {
padding:0 10px 0 10px;
}
#content .contentBlock .zOnTop figure {
margin-left:34%;
margin-right:34%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-left:37%;
margin-right:37%;
}
#content .contentBlock .zOnTop figure {
margin-top:12%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-top:11%;
}
#content #headImageSlider figure figcaption {
top:10px;
left:1%;
font-size:2.4em;
}
#top #servNav {
margin-bottom: 20px;
}
}


@media screen and (max-width: 520px) {
#content .contentBlock .pearl figure.pearlRed {
margin-top:12%;
}
}


@media screen and (max-width: 490px) {
#content .contentBlock .zOnTop figure {
margin-top:16%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-top:15%;
}
}


@media screen and (max-width: 460px) {
#content .contentBlock .zOnTop figure {
margin-top:19%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-top:16%;
}
#content #headImageSlider figure figcaption {
top:8px;
left:5px;
font-size:2.0em;
line-height:1.2em;
}
}


@media screen and (max-width: 430px) {
#content .contentBlock #madeIn img {
width:100px;
}
#content .contentBlock .zOnTop figure {
margin-top:21%;
}
#content .contentBlock .pearl figcaption span {
font-size:1.0em;
line-height:2.8em;
}
#content .contentBlock .pearl figure.pearlRed {
margin-top:18%;
}
#content #headImageSlider figure figcaption {
font-size:1.8em;
}
}


@media screen and (max-width: 400px) {
#content .contentBlock .pearl figure.pearlRed {
margin-top:20%;
}
}


@media screen and (max-width: 370px) {
#content .contentBlock #madeIn img {
width:80px;
}
#content .contentBlock .zOnTop figure {
margin-top:27%;
}
#content .contentBlock .pearl figure.pearlRed {
margin-top:24%;
}
}
