@charset "UTF-8";
/* CSS Document */


/* Standard-Design */
#wrapper {width:960px;height:450px;background:none;
position: absolute;
     margin: auto;
     top: 10px;
     right: 0;
     bottom: 0;
     left: 0;}

#box-blue {width:430px;height:430px;background-color:#e2e6e7;padding:10px;float:left;margin-right:30px;}

#box-green {width:430px;height:430px;background-image: url(../images/wohngeschwisterchen.jpg);padding:10px;float:left;margin-left:30px;}

#slogan {width:66%; text-transform:uppercase; font-family: montserratregular, sans serif; font-size:13px;letter-spacing:0.1em;
margin-top: 30px;}
 
#address {width:60%; text-transform:none; font-family: libre_baskervilleregular, serif; font-size:11px;
margin-top:90px;}

#logo-blue {float:right;margin-right:25px;
margin-top: 25px;
-moz-transform: rotate(15deg); -ms-transform: rotate(15deg); -o-transform: rotate(15deg); -webkit-transform: rotate(15deg); transform: rotate(15deg);
}

#arrow-blue {margin-left:30px; margin-top: 185px; }

.blue {text-align:right; color: #006a85;float:right;margin-right:30px;}

.impressum {text-align:left;color: #787878;font-size:10px;float:left;margin-top:10px;}

#address.blue {margin-top:100px;}


/* Responsive-Design Original Size */
@media only screen and (max-width: 959px) {
    #wrapper {width:450px;height:890px;background:none;margin:60px auto;}
	#box-blue {float:none;margin: 0px 10px 60px 10px;}
	#box-green {float:none;margin: 0px 10px 0px 10px;}
	#arrow-blue {display:none;}
	.blue {text-align:center;float:none; margin:auto;}
	#logo-blue {width:100%;float:none;margin-top:25px;margin-right:0px;text-align:center;transform:none;}
	#slogan {width:100%;margin-top:40px;}
	#address {width:100%;}
	a {text-decoration:none;}
	#address.blue {margin-top:90px; }
}

/* Responsive-Design Smartphone Sizes */
@media only screen and (min-width:300px) and (max-width: 449px) {
#wrapper {width:95%;margin:20px auto;}
#box-blue {width:95%;margin:0px 0px 20px 0px;}
}

@font-face {
    font-family: 'montserratregular';
    src: url('../fonts/montserrat-regular-webfont.eot');
    src: url('../fonts/montserrat-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/montserrat-regular-webfont.woff2') format('woff2'),
         url('../fonts/montserrat-regular-webfont.woff') format('woff'),
         url('../fonts/montserrat-regular-webfont.ttf') format('truetype'),
         url('../fonts/montserrat-regular-webfont.svg#montserratregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'libre_baskervilleregular';
    src: url('../fonts/librebaskerville-regular-webfont.eot');
    src: url('../fonts/librebaskerville-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/librebaskerville-regular-webfont.woff2') format('woff2'),
         url('../fonts/librebaskerville-regular-webfont.woff') format('woff'),
         url('../fonts/librebaskerville-regular-webfont.ttf') format('truetype'),
         url('../fonts/librebaskerville-regular-webfont.svg#libre_baskervilleregular') format('svg');
    font-weight: normal;
    font-style: normal;

}