@charset "UTF-8";

@font-face {
    font-family: 'OpenSansRegular';
    src: url('../fonts/open-sans/OpenSans-Regular-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-Regular-webfont.woff') format('woff'),
         url('../fonts/open-sans/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('../fonts/open-sans/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

html { color: #fff; font: 400 100% 'OpenSansLight', 'Trebuchet MS', sans-serif; text-rendering: optimizeLegibility; }

#cover h1 { color:#fff; font: 3.4em/1.10 'Baumans', 'Georgia', cursive; word-spacing: 0.1em; text-indent: 0em; margin-left: 1em; opacity: 0.9; filter:alpha(opacity=90);}
#cover article {font: .8em 'OpenSansRegular', 'Trebuchet MS', sans-serif;}
#cover article { text-align: right; position: fixed; bottom:0.5em; right: 1em; width:auto;background:transparent; }
#cover aside {position:fixed; right:1em;top:1em;}
#cover aside a {opacity: 0.3; filter:alpha(opacity=30);}
#cover aside a:hover {opacity: 0.9; filter:alpha(opacity=90);background:transparent;}
#cover footer {font: .8em 'OpenSansRegular', 'Trebuchet MS', sans-serif;}
#cover footer {
    position: fixed; bottom:0px; left: 0px; width:auto; margin-bottom: -15px;background:transparent;
    transform: rotate(-90deg); transform-origin: left top;
    -moz-transform: rotate(-90deg);-moz-transform-origin: left top;
    -webkit-transform: rotate(-90deg);-webkit-transform-origin: left top;
    -ms-transform: rotate(-90deg);-ms-transform-origin: left top;
    -o-transform: rotate(-90deg);-o-transform-origin: left top;
}
#cover footer p {margin:0px;background:transparent;}
#cover footer a { text-decoration:none; }
#cover a {color:#fff}
#cover a:hover { color:#fff;/*color:#2D6A98;*/background-color:#FF0022;text-decoration: none;}
#cover p {display:inline; background-color:#000;padding: 0 0.5em 0 0.5em;line-height: 2em;}
#cover article p br {margin-right: 0.5em;}

#inside h1 { color:#000; font: 3.4em/1.10 'Baumans', 'Georgia', cursive; word-spacing: 0.1em; text-indent: 0em; margin-left: 1em; /*opacity: 0.9; filter:alpha(opacity=90);*/}
#inside article {font: .8em 'OpenSansRegular', 'Trebuchet MS', sans-serif;}
#inside article { text-align: right; position: fixed; bottom:0.5em; right: 1em; width:auto;background:transparent; }
#inside footer {font: .8em 'OpenSansRegular', 'Trebuchet MS', sans-serif; }
#inside footer {
    position: fixed; bottom:0px; left: 0px; width:auto; margin-bottom: -15px;background:transparent;
    transform: rotate(-90deg); transform-origin: left top;
    -moz-transform: rotate(-90deg);-moz-transform-origin: left top;
    -webkit-transform: rotate(-90deg);-webkit-transform-origin: left top;
    -ms-transform: rotate(-90deg);-ms-transform-origin: left top;
    -o-transform: rotate(-90deg);-o-transform-origin: left top;
}
#inside footer p {margin:0px;background:transparent;}
#inside footer a { text-decoration:none; color:#000;}
#inside a {color:#fff}
#inside a:hover { color:#fff;background-color:#FF0022;text-decoration: none;}
#inside p {display:inline; background-color:#000;padding: 0 0.5em 0 0.5em;line-height: 2em;}

@media only screen and (max-width: 34.99em) {
    #home { background: #000 url(../img/bg_xs.jpg) no-repeat left top; }
    #home #head { background:transparent url('../img/mg114bt.png') no-repeat 217px 26px; height:245px; }
    #home #content { position:relative; }
    #home #main { position: static; height:1px; }
    #home #asside { background: #000;}
    #home article.i-am {
        background: transparent;
        width:340px; font-size: .8125em;
        margin:0 auto 1em auto;
        padding: .8em .8em .8em .8em;
    }
    #home article.i-am h1 {
        font: 3.2em/1.10 'VolkhovRegular', 'Georgia', serif; letter-spacing: 0.01em; word-spacing: 0.1em;
    }
    #home #footer { background: transparent; }
    #home #footer footer.i-am { padding: .8em .8em .8em .8em; clear:both; }
    #home #footer a { font-size: .8125em }
}

/* etwa ab 560 Pixel */
@media only screen and (min-width: 35em) {
    #home {
        background: url(../img/bg_small.jpg) no-repeat center center fixed;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    }
    
    #home #head { position: relative; opacity: 0.3; filter:alpha(opacity=30); }
    #home #content { position:absolute; top:20%; /*top:168px;*/ width:100%; bottom:0px; }

    #home #asside {
        position: absolute; top: 0px; right: 2em; width: 23em; min-height: 100%;
        background: rgb(0, 0, 0);
        background: rgba(0, 0, 0, 0.6);
        /*filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000); */ /* IE 5.5 - 7 */
        /*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)"; *//* IE 8*/
    }
    
    #home article.i-am { font-size: .9375em; padding: .9em .9em 1.8em .9em; }


    #home #footer {
        position: fixed; bottom:0px; left: 0px; width:auto; margin-bottom: -15px;background:transparent;
        transform: rotate(-90deg); transform-origin: left top;
        -moz-transform: rotate(-90deg);-moz-transform-origin: left top;
        -webkit-transform: rotate(-90deg);-webkit-transform-origin: left top;
        -ms-transform: rotate(-90deg);-ms-transform-origin: left top;
        -o-transform: rotate(-90deg);-o-transform-origin: left top;
        
    }
    #home #footer p {margin:0px;}
    #home #footer a { font-size: .9375em }
}

/* etwa ab 768 Pixel */
@media only screen and (min-width: 48em) {
    #home {
        background: url(../img/bg_medium.jpg) no-repeat center center fixed;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    }
    #home #asside { width: 25em; }
    #home article.i-am { font-size: .9375em; padding: 1.2em 1.2em 2.4em 1.2em; }
}


@media only screen and (min-width: 64em) {
    #home {
        background: url(../img/bg_big.jpg) no-repeat center center fixed;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    }
}


@media only screen and (min-width: 35em) and (orientation: portrait) {
    #home {
        background: url(../img/bg_medium.jpg) no-repeat center center fixed;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    }
    #home #content { position:absolute; top:50%; /*top:168px;*/ width:100%; bottom:0px; }
    #home #asside {
        /*position: absolute;*/
        position: static;
        /*top: 60%;*/
        right: 0px;
        left:0px;
        bottom:0px;
        min-width: 100%;
        padding: 1em auto 0 auto;
        
    }
   #home article.i-am { font-size: .9375em; width: 68%; margin: 0 auto 0 auto; padding:0; }
}