* {margin:0; padding:0; border:0}

html {height:100%}
body { background-color: #fff;}

li {margin-top:5px;}

/** ***************
SCHRIFTEN
*************** **/

h1 {font-family: arial,verdana,helvetica; color:grey; font-size: 50px; float:right;}
h2 {font-family: arial,verdana,helvetica; color:grey; font-size: 25px; margin: 0 0 10px 0; }
h3 {font-family: arial,verdana,helvetica; color:grey; font-size: 15px; margin: 5px 0; }
p {font-family: arial,verdana,helvetica; color:#87891A; font-size: 12px; }
a:link, a:visited {font-family: arial,verdana,helvetica; color: #fdab00; font-size: 12px; text-decoration:none}
a:hover {color: #f91a0c }
li a:link, li a:visited {font-family: arial,verdana,helvetica; color: #fdab00; font-size: 15px; text-decoration:none}
li a:hover {color: #f91a0c }

#wrapper {width:100%; height:100%; }
#flaggen {position:absolute; left: 420px;}
#copy {position:fixed;}
#headline {position: absolute; height:50px; width: 300px; border: 1px solid white; left: 55px; top: 340px;}

#navi {position: absolute; height:150px; width: 120px; left: 235px; top: 440px;}

#linie1 {position:absolute; height:1px; width: 93px; left:357px; top: 350px; background-color: white;}
#linie2 {position:absolute; height:584px; width: 1px; left:445px; top: 0; background-color: red;}
#linie3 {position:absolute; height:1px; width: 40px; left:425px; top: 584px; background-color: red;}

#content {position: absolute; height:100%;  max-width:800px; left: 450px; top:60px;}

#Workspace { width:850px; height: 100%; position:relative; }

    .example { margin-bottom:0px; }

    /* großes bild */
    #Viewer { position:absolute; left:300px; top:0;  max-width:500px; max-height:450px; width:510px; height:450px;}
    .picture  {position:absolute; left: 300px;}

    /* Generic Carousel Properties */
    .carousel { position:relative; top:50px; clear:both; border:2px solid white;}
    .carousel .navButton {cursor:pointer; display:block; text-indent:-9999px; background-repeat:none; z-index:10;}
    .carousel .container { position:absolute; overflow:hidden; }
    .carousel .items { position:relative; }
    .carousel .item { position:relative;
        cursor:pointer;
            filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
        -moz-opacity:0.7;
        opacity:0.7;
        list-style-type:none; margin-top:0px;
    }
    .carousel .item.hover, .carousel .item.selected {
            filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
        -moz-opacity:1.0;
        opacity:1.0;
    }

    /* vertical carousel */
    #Carousel { width:220px; height:500px;}
    #Carousel .container { left:8px; top:15px; width:150px; height:440px; }

    #Carousel .items { left:2px; }
    #Carousel .item { background-color:pink; height:auto; margin-bottom:10px;  width:150px; }
    #Carousel .item.hover { background-color:#fff; }
    #Carousel .item.selected { background-color:#ffffff; }
   /* #Carousel .item .caption { position:absolute; left:35px; top:5px; width:135px; background-color:transparent; font-size:10px; } */
   /* #Carousel .item .icon img { position:relative; left:5px; width:22px !important; height:22px; cursor:default; top:2px;} */
    #Carousel .navButton { position:absolute; bottom:0px; width:23px; height:30px; }
    #Carousel .navButton.previous { left:45px; background-image:url('../img/arrow_up.png');  }
    #Carousel .navButton.next { left:80px; background-image:url('../img/arrow_down.png'); }