html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em,
img, ins, q, small, strong, sub, sup, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
        margin: 0;
        padding: 0;
        border: 0;
}

article, aside, figure, figure img, figcaption, hgroup,
footer, header, nav, section {
        display: block;
}

img { -ms-interpolation-mode:bicubic;
border:none;}

a img {border: 0;}
a:focus{outline:none;}

figure {position: relative;}
figure img {width: 100%;}

#nav li{
         position:fixed;
         left:25px; top:5px;
         list-style: none;
         display: inline;
         font-size: 12px;
}

#nav li a {
         padding: 10px 10px 5px 10px;
         color:#fff;
         font-weight: bold;
         text-shadow: #999 0 0px 1px;
         background: #aaa;
         background-color: rgba(0, 0, 0, 0.2);
         text-decoration: none
}

#nav li a:hover {
         padding: 10px 10px 5px 10px;
         color:#fff;
         text-shadow: #000 0 0px 1px;
         background-color:#1a90ff;
         text-decoration: none
}



/*        Default 8-column layout
        60 px columns, 24 px gutters, 60 px margins, 768 px total
        ---------------------------------------------------------
        1     2      3      4      5      6      7      8
        60px  144px  228px  312px  396px  480px  564px  648px        */



#content {
        text-align:center;
        padding: 0;
        margin:0px auto;
        width: 760px;
}

#white {
color:#fff;
-webkit-tap-highlight-color: rgb(155,155,0);
text-shadow: rgb(1,1,1) 0px 1px 1px;
}

article{
float:left;
margin:20px 20px 0 40px;
overflow:hidden;
position:relative;
padding:5px;
-webkit-tap-highlight-color: rgb(155,155,0);
text-shadow: rgb(255,255,255) 0px 1px 1px;
}

article h3{
font-size: 58px;
line-height: 58px;
padding:20px 0 15px 0;
}

article p{
padding:0px 20px 25px 20px;
font-size: 16px;
line-height: 26px;
width:96%;
}

article a{
color:#000;
text-decoration: none
}

article a:hover{
color:#1a90ff;
text-decoration: none
}

#stefan {
float:left;
position:relative;
left:0px; top:168px;
padding:18px 0 0 0;
color:#000;
line-height: 28px;
width: 200px;
height: 100px;
text-shadow: #fff 0 1px 1px;
}

#plus {
        position: absolute;
        right:30px;
        top: 30px;
        margin: 0 auto
}

::selection    {background: rgb(255,255,0);}
::-moz-selection {background: rgb(255,255,0);}


/*        13-column layout
        60 px columns, 24 px gutters, 72 px margins, 1212 px total (extra space for scrollbars)
        ---------------------------------------------------------------------------------------
        1     2      3      4      5      6      7      8      9      10     11     12     13
        60px  144px  228px  312px  396px  480px  564px  648px  732px  816px  900px  984px  1068px        */

@media only screen and (min-width: 1080px) {

        #content {
                text-align:center;
                margin:0px auto;
                width: 1030px;
        }

article h3{
font-size: 68px;
line-height: 68px;
padding:20px 0 10px 0;
}

article p{
padding:0px 50px 25px 115px;
font-size: 18px;
line-height: 28px;
width:77%;
}

#stefan {
position:relative;
left: -100px; top:215px;
padding:35px 0 0 0;
font-size: 18px;
line-height: 28px;
width: 200px;
height: 120px;
text-shadow: #fff 0 1px 1px;
}

}


/*        5-column layout
        60 px columns, 24 px gutters, 42 px margins, 480 px total
        ---------------------------------------------------------
        1     2      3      4      5
        60px  144px  228px  312px  396px        */

@media only screen and (max-width: 767px) and (min-width: 520px) {

#content {
         text-align:center;
         padding: 0;
         margin:0px auto;
         width: 520px;
        }

        article h3{
         font-size: 40px;
         line-height: 40px;
         padding:20px 0 10px 0;
         }

         article p{
         padding:0px 20px 5px 10px;
         font-size: 12px;
         line-height: 22px;
         width:95%;
         }


}

/*        3-column layout
        60 px columns, 24 px gutters, 46 px margins, 320 px total
        ---------------------------------------------------------
        1     2      3
        60px  144px  228px        */

@media only screen and (max-width: 520px){

        #content {
        text-align:center;
        padding: 0;
        margin:0px auto;
        width: 300px;
        }

        header #logo{
         position:relative;
         left:0;
         width:150%;
         }

        header li{
         position:relative;
         left:-125px; top:70px;
         width:220%;
         list-style: none;
         }

        footer #logo{
         position:relative;
         left:6%;
         width:150%;
         }

        footer li{
         position:relative;
         left:-115px; top:75px;
         width:220%;
         list-style: none;
         }

        article h3{
         font-size: 22px;
         line-height: 28px;
         padding:20px 0 5px 15px;
         }

         article p{
         padding:0px 0 5px 32px;
         font-size: 12px;
         line-height: 22px;
         width:82%;
         }


}

body{
font-family: 'Droid Sans', arial, serif;
}

header, section, footer{
clear:both;
}

header{
position:relative;
left:10%; top:50px;
width:50%;
float:left;
}

header ul{
position:absolute;
left:102%; top:0px;
width:60%;
list-style: none;
display:block;
float:left;
z-index:100;
}

header li a {
        display:block;
        background: url(../img/blanc.gif);
        white-space : nowrap;
}

header li a:hover {
         background: url(../img/back2.png);
         background-repeat: repeat;
         border: #fff 0 1px 1px;
         z-index:100;
}


article{
float:left;
margin:20px 20px 0 0;
position:relative;
padding:5px;
width:100%;
color:#000;
}

footer{
position:relative;
left:10%;
width:50%;
float:left;
}

footer ul{
position:absolute;
left:102%; top:0px;
width:60%;
list-style: none;
display:block;
text-align:left;
}

footer li a {
        display:block;
        background: url(../img/blanc.gif);
        white-space : nowrap;
        z-index:100;
}

footer li a:hover {
         background: url(../img/back2.png);
         background-repeat: repeat;
         z-index:100;
}

.no-opacity

/*
Supersized - Fullscreen Slideshow jQuery Plugin Stylesheet Version 3.0
By Sam Dunn (www.buildinternet.com // www.onemightyroar.com)
Version: supersized.3.0.js
Website: www.buildinternet.com/project/supersized
*/

        /*Area to place content normally*/
        #wrapper{

                z-index:4;
        }


        #supersized { position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
                #supersized img{ position:relative; display:none; outline:none; border:none; }
                        #supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }        /*Speed*/
                        #supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }                        /*Quality*/

                #supersized a { z-index:-30; position:absolute; top:0; left:0; width:100%; height:100%; background:#fff; }
                        #supersized a.prevslide { z-index:-20; }
                        #supersized a.activeslide { z-index:-10; }
                        #supersized a.prevslide img, #supersized a.activeslide img{ display:inline; }