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


div#page-wrap {
    width: 800px;
    height: 600px;
    margin: 20px auto;
    background-color: #000000;
    z-index:0;
}

div#page-layer {
    position: absolute;
    width: 800px;
    height: 600px;
    margin: 0 auto;
    z-index:99;
}


.myborder {
    border-style:solid;
    border-color:#ff0000;
    border-width:1px;
}


/******************
    SVG Allgemein
*******************/

svg {
  border: 0px solid #eee;
  display: block;
  margin: 0 auto;
}

rect {
    stroke-width:0px;
    stroke:rgb(255,0,0);
}

text.h1{
    font-size: 4em;
    font-family: "bitterbold";
    stroke-width: 0px;
}

text.p{
    font-size:1.2em;
    line-height: 1.4em;
    font-family: "bitterregular";
    stroke-width: 0px;
}


/********* SVG-Farbpalette *******/

.colNone        { fill:none; }

.colRed         { fill:hsl(000,50%,50%); }
.colOrange      { fill:hsl(030,50%,50%); }
.colYellow      { fill:hsl(060,50%,50%); }
.colGrassGreen  { fill:hsl(090,50%,50%); }
.colGreen       { fill:hsl(120,50%,50%); }
.colTurquoise   { fill:hsl(150,50%,50%); }
.colCyan        { fill:hsl(180,50%,50%); }
.colSkyBlue     { fill:hsl(210,50%,50%); }
.colBlue        { fill:hsl(240,50%,50%); }
.colViolett     { fill:hsl(270,50%,50%); }
.colMagenta     { fill:hsl(300,50%,50%); }
.colPink        { fill:hsl(330,50%,50%); }


.colRedDark         { fill:hsl(000,36%,30%); }
.colOrangeDark      { fill:hsl(030,36%,30%); }
.colYellowDark      { fill:hsl(060,36%,30%); }
.colGrassGreenDark  { fill:hsl(090,36%,30%); }
.colGreenDark       { fill:hsl(120,36%,30%); }
.colTurquoiseDark   { fill:hsl(150,36%,30%); }
.colCyanDark        { fill:hsl(180,36%,30%); }
.colSkyBlueDark     { fill:hsl(210,36%,30%); }
.colBlueDark        { fill:hsl(240,36%,30%); }
.colViolettDark     { fill:hsl(270,36%,30%); }
.colMagentaDark     { fill:hsl(300,36%,30%); }
.colPinkDark        { fill:hsl(330,36%,30%); }
.colGrayDark        { fill:hsl(330,00%,30%); }

.colRedLight        { fill:hsl(000,50%,60%); }
.colOrangeLight     { fill:hsl(030,50%,60%); }
.colYellowLight     { fill:hsl(060,50%,60%); }
.colGrassGreenLight { fill:hsl(090,50%,60%); }
.colGreenLight      { fill:hsl(120,50%,60%); }
.colTurquoiseLight  { fill:hsl(150,50%,60%); }
.colCyanLight       { fill:hsl(180,50%,60%); }
.colSkyBlueLight    { fill:hsl(210,50%,60%); }
.colBlueLight       { fill:hsl(240,50%,60%); }
.colViolettLight    { fill:hsl(270,50%,60%); }
.colMagentaLight    { fill:hsl(300,50%,60%); }
.colPinkLight       { fill:hsl(330,50%,60%); }
.colGrayLight       { fill:hsl(330,00%,60%); }

.colWhite           { fill:rgb(255,255,255); }
.colBlack           { fill:rgb(000,000,000); }

.colGray090         { fill:hsl(000,000%,010%); }
.colGray085         { fill:hsl(000,000%,015%); }
.colGray080         { fill:hsl(000,000%,020%); }
.colGray070         { fill:hsl(000,000%,030%); }
.colGray060         { fill:hsl(000,000%,040%); }
.colGray050         { fill:hsl(000,000%,050%); }
.colGray040         { fill:hsl(000,000%,060%); }
.colGray030         { fill:hsl(000,000%,070%); }
.colGray020         { fill:hsl(000,000%,080%); }
.colGray010         { fill:hsl(000,000%,090%); }

.colGreenDark2      { fill:hsl(120,36%,20%); }

body {
    background-color: #000000;
    color: #ffffff;
}


a:link {
    color: #ffffff;
    text-decoration: none;
    text-underline: none;
    opacity: 0.4;
    filter: alpha(opacity=40);
}

a.imagelink {
    opacity: 1;
    filter: alpha(opacity=100);
}

a:active {
    color: #ffffff;
    text-decoration: none;
    text-underline: none;
    opacity: 0.4;
    filter: alpha(opacity=40);
}

a:visited {
    color: #ffffff;
    text-decoration: none;
    text-underline: none;
    opacity: 0.4;
    filter: alpha(opacity=40);
}

a:hover {
    color: #ffffff;
    text-decoration: none;
    text-underline: none;
    opacity: 0.8;
    filter: alpha(opacity=80);
}


.opac040 {
    color: #ffffff;
    opacity: 0.4;
    filter: alpha(opacity=40);
}

p {
    font-size:1.0em;
    line-height: 1.6em;
    margin-top: 1em;
    font-family: "bitterregular";
}


.mono {
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
}


.black {
    color: #000000;
}


.impressum {
    font-size:0.9em;
    line-height: 1.5em;
    margin-top: 1em;
    font-family: "bitterregular";
}

.ra {
    text-align: right;
}

.nospace {
    margin: 0;
}


.wide {
    letter-spacing: 2px;
}

.small {
    font-size:0.7em;
    line-height: 1.4em;
}

.backlink {
    margin: 0;
    font-size: 1.5em;
    line-height: 1.2em;
}

.strikethrough {
    text-decoration: line-through;
    -moz-text-decoration-color: #cc0000; /* Code for Firefox */
    text-decoration-color: #cc0000;
}



.fi {
    width:80px;
    height:20px;
    background-color:#6699cc;
    border:none;
    padding:1px;
    margin-bottom: 14px;
}

.fi2 {
    width:80px;
    height:20px;
    background-color:#cc6699;
    border:none;
    padding:1px;
    margin-top:6px;
}


.big {
    font-size: 12em;
    line-height: 12.2em;
    margin-top: 0em;
    font-family: "bitterbold";
}



h1 {
    font-size: 3em;
    line-height: 2.2em;
    margin-top: 0em;
    font-family: "bitterbold";
}

h2 {
    font-size: 1.6em;
    line-height: 1.8em;
    margin-top: 1.2em;
    font-family: "bitterbold";
}


h3 {
    font-size: 1.6em;
    line-height: 1.8em;
    margin-top: 1.2em;
    font-family: "bitterregular";
}




@font-face {
    font-family: 'bitterregular';
    src: url('fonts/bitter-regular-webfont.eot');
    src: url('fonts/bitter-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/bitter-regular-webfont.woff2') format('woff2'),
         url('fonts/bitter-regular-webfont.woff') format('woff'),
         url('fonts/bitter-regular-webfont.ttf') format('truetype'),
         url('fonts/bitter-regular-webfont.svg#bitterregular') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'bitterbold_italic';
    src: url('fonts/bitter-bolditalic-webfont.eot');
    src: url('fonts/bitter-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/bitter-bolditalic-webfont.woff2') format('woff2'),
         url('fonts/bitter-bolditalic-webfont.woff') format('woff'),
         url('fonts/bitter-bolditalic-webfont.ttf') format('truetype'),
         url('fonts/bitter-bolditalic-webfont.svg#bitterbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'bitterbold';
    src: url('fonts/bitter-bold-webfont.eot');
    src: url('fonts/bitter-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/bitter-bold-webfont.woff2') format('woff2'),
         url('fonts/bitter-bold-webfont.woff') format('woff'),
         url('fonts/bitter-bold-webfont.ttf') format('truetype'),
         url('fonts/bitter-bold-webfont.svg#bitterbold') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'bitteritalic';
    src: url('fonts/bitter-italic-webfont.eot');
    src: url('fonts/bitter-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/bitter-italic-webfont.woff2') format('woff2'),
         url('fonts/bitter-italic-webfont.woff') format('woff'),
         url('fonts/bitter-italic-webfont.ttf') format('truetype'),
         url('fonts/bitter-italic-webfont.svg#bitteritalic') format('svg');
    font-weight: normal;
    font-style: normal;

}