@import url('http://fonts.googleapis.com/css?family=Muli:400,700,800');

html { margin-left: calc(100vw - 100%); }

* {
        padding:0;
        margin:0;
}


body {
        color: #000000;
        background-color:#ffffff;
        margin: 10px auto;
        width:1024px;
        font-family: 'Muli', sans-serif;
        font-size:1em;

}



a {
        color: #800000;
        background-color: #FFFFFF;
        font-weight: 600;
        text-decoration: none;
}

p {
        padding-bottom:13px;
}

a:hover {
        color: #3366FF;
        background-color: #FFFFFF;
        font-weight: 600;
        text-decoration: none;
}


/* MENÜ */



#nav1 {
        padding:0px 0px 4px 0px;
        margin:0 0 0 0;
        width:10%;
        float:left;
        border-bottom:2px solid #000000;
}

#nav1 a {
        color: #000000;
        font-weight:800;
        text-decoration:none;
        padding:0px 0px 4px 0px;
}

#nav1 .selected {
        color:#000000;
        text-decoration:none;
        padding:0px 0px 4px 0px;
}

#nav1 a:hover {
        color:#000000;
        text-decoration:none;
        padding:0px 0px 4px 0px;
}

#nav2 {
        padding:0px 0px 4px 0px;
        margin:0 0 0 0;
        width:90%;
        float:right;
        text-align: right;
        border-bottom:2px solid #000000;
}

#nav2 a {
        color: #000000;
        font-weight:800;
        text-decoration:none;
        padding:0px 0px 4px 24px;
}

#nav2 .selected {
        color:#800000;
        text-decoration:none;
        padding:0px 0px 4px 24px;
}

#nav2 a:hover {
        color:#800000;
        text-decoration:none;
        padding:0px 0px 4px 24px;
}

#subtitel {
        clear:both;
        width:300px;
        float:right;
        text-align:right;
        padding:5px 0px 0px 0px;
}

#language {
        clear:both;
        font-size:0.8em;
        width:300px;
        float:left;
        text-align:left;
        padding:5px 0px 0px 0px;
}

/* Hauptbereich content */

#maincontent {

        padding:65px 0px 0px 0px;
        min-height:600px;
}


#mainheader {

      position:relative;
         height:auto;
         max-width: 600px;
         margin-left: auto;
        margin-right: auto;
}

#mainheader1 {

         letter-spacing: 0.44em;
         font-size:2.5em;
         text-align:center;
         font-weight:700;
         margin: auto;
         margin-bottom: 10px;
}


#mainheader2 {
         letter-spacing: 0.61em;
         font-size:2.5em;
         text-align:center;
         font-weight:700;
         margin: auto;
         margin-top: 10px;
         margin-bottom: 20px;
}

#landscapes {
         letter-spacing: 0.9em;
         font-size:2.5em;
         text-align:center;
         font-weight:700;
         margin: auto;
         margin-top: 10px;
         margin-bottom: 20px;
}

#portrait {
         width:220px;
         height:auto;
         float:left;
         margin-right:20px;
         margin-bottom:10px;

}

#cv {
         width:auto;
         text-align:justify;

}

#kontakt {

         clear:both;
         padding:20px 0px 0px 0px;
         margin-bottom:10px;
}

#description {
         width:auto;
         padding:30px 0px 20px 0px;
         text-align:justify;

}



/* Footer */

#copyright {
        clear: both;
        border-top:1px solid #000000;
        border-bottom:1px solid #000000;
        font-size:0.80em;
        color:#000000;
        padding:5px 0px 5px 0px;
        width: 50%;
        text-align: left;
        float:left;
        margin-bottom:10px;
}

#email {
        border-top:1px solid #000000;
        border-bottom:1px solid #000000;
        font-size:0.80em;
        color:#000000;
        text-decoration:none;
        padding:5px 0px 5px 0px;
        width:50%;
        text-align: right;
        float:right;
        margin-bottom:10px;
}


        label { margin-right:10px}

        div.desc {
        width:250px;
        text-align:center;
        font-size:0.8em;
        margin-top:5px;
        margin-bottom:10px;
        }

        div.desc2 {
        width:460px;
        text-align:center;
        font-size:0.8em;
        margin-top:5px;
        }

        #v1 {
        clear: both;
        float:left;
        width:auto;
        margin-right:5px;
        }

        #v2 {

        float:left;
        width:210px;
        height:210px;
        }

        #v1large {
        clear: both;
        float:left;
        width:auto;
        margin-right:5px;
        }

        #v2large {
        float:left;
        width:450px;
        height:230px;

        }


        #vlinks {
        clear:both;
        float:left;
        width:auto;
        margin-bottom:30px;
        margin-right:90px;

        }

        #vrechts {

        float:left;
        width:auto;
        margin-bottom:30px;

        }

        img {
        max-width: 100%;
        height: auto;
        }


#subsites {clear: both; text-align: center; margin-bottom:15px; font-size: 1.3em; }


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

body {width:98%}

#vlinks {

margin-right:10px;
}

#v2large {

        margin-top:10px;
}

}






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



body {width:98%}

#portrait{
         width:40vw;
}

#content {
        clear:both;
        width:100%;

}

#maincontent {
        min-height:auto;
}


#mainheader1 {


         font-size:6.4vw;
         text-align:center;
         font-weight:700;
         margin-bottom: 10px;
         margin-left:5px;
}

#mainheader2 {
         font-size:6.4vw;
         text-align:center;
         font-weight:700;
         margin-top: 10px;
         margin-bottom: 20px;
         margin-left:5px;
}

#landscapes {
         font-size:6.4vw;
         text-align:center;
         font-weight:700;
         margin-top: 10px;
         margin-bottom: 20px;
         margin-left:5px;
}

#nav1 {
        padding:0px 0px 4px 0px;
        margin:0 0 0 0;
        float:left;
        font-size:0.8em;
        width:10%;
}

#nav2 {

        font-size:0.8em;

}

#subtitel {
        font-size:0.8em;

}

#v1 {
        width:40vw;
}

#v1large {
        width:95vw;
}

#v2 {
        width:45vw;
        height:auto;
}

#v2large {
        width:70vw;
        height:auto;
        margin-top:10px;
}

img.cssbox_thumb1 {
        width:15vw;
        height:auto;
        float:left;
}

#vlinks {
        width:95vw;
}

#vrechts {
        width:95vw;
}

div.desc {
    width:40vw;
    text-align:center;
    font-size:0.8em;
}

div.desc2 {
    width:95vw;
    text-align:center;
    font-size:0.8em;
}

#copyright {
        font-size:2.6vw;
}

#email {
        font-size:2.6vw;
}

}