body { background-color: transparent;
 background-image: url("bg.jpg");
 background-position: left top;
 background-repeat: no-repeat;
 height: 100%;
 opacity: 1;
 visibility: inherit;
 width: 100%;font-family: 'Open Sans', Verdana }

a:hover { text-decoration: none}


.clear { clear: both;display: block;height: 0;overflow: hidden;visibility: hidden;width: 0; }

p { line-height: 1.3em;font-size:0.9em}

div#content img { width: 90%}
.haikeroels { width:75% }
div#logo { text-align: center;width:90% }
div#logo img { width: 90%}
div#kader {
    position: fixed;
    left: 50%;
    top: 50%;
    background-color: white;
    z-index: 100;

    height: 350px;
    margin-top: -165px;

    width: 500px;
    margin-left: -265px;
    -webkit-box-shadow: 0 0 30px 30px rgba(0,0,0,.1);
    box-shadow: 0 0 30px 30px rgba(0,0,0,.1);
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border:1px rgba(0, 0, 0, 0.8);
    padding:15px;
    }
div#content { font-family: "Open Sans"; font-size: 1em; text-align: center;padding-top:15px; }
div#content p { padding:0; margin-bottom: 10px;line-height: 1.3em; }

.col_50 { float:left;width: 50%}


@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 320px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 320px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 320px),
only screen and (        min-device-pixel-ratio: 2)      and (min-width: 320px),
only screen and (                min-resolution: 192dpi) and (min-width: 320px),
only screen and (                min-resolution: 2dppx)  and (min-width: 320px) {

    /* Small screen, retina, stuff to override above media query */

}

/* ------------------------
:: 320
------------------------- */

@media only screen and (min-width: 320px){

  div#kader {
    height: 180px;
    margin-top: -155px;

    width: 320px;
    margin-left: -175px;

  }

}
/* ------------------------
:: 480
------------------------- */
@media only screen and (min-width: 480px){

  div#kader {
    height: 210px;
    margin-top: -155px;

    width: 428px;
    margin-left: -227px;

  }

  div#content { font-size:0.8em; }

}
/* ------------------------
:: 600
------------------------- */
@media only screen and (min-width: 600px){

  div#kader {

      height: 220px;
      margin-top: -195px;

      width: 500px;
      margin-left: -265px;

      }
      div#content { font-size:1em; }

}


/* ------------------------
:: 768
------------------------- */
@media only screen and (min-width: 768px){


}

@media only screen and (min-width: 880px){


}


/* ------------------------
:: 992
------------------------- */
@media only screen and (min-width: 992px){


}


/* ------------------------
:: 1382
------------------------- */
@media only screen and (min-width: 1382px){


}