@ media screen and (min-width: 1280px) 

body {
    font: 1em sans-serif, Tahoma, Arial, Verdana;
    color: #000055;
    text-align:center; /* Centreren van de pagina */
    margin:0;
    padding:0;
}

body.achtergrond {
    background: #d8d8d8; 
}

/* STRUCTURE */

#wrapper {
    max-width: 1280px;  /* gebaseerd op huidige meest voorkomende resolutie */
    margin: 0 auto; /* Margin op auto zetten om te kunnen centreren */
    background: #FFFFFF;
    text-align: left;
    border: 0px solid #999; 
}

#header, #content, #footer { 
    padding: 0px;  /* This sets a 0px padding on all of our content boxes */
}

header {
    height: 80px;
    width: 100%;
    background: #FFFFFF; 
    margin-bottom: 0px;
    margin-left:auto; margin-right:auto; margin-top:0;
}

#content {
    width: 100%; /* Account for margins + border values */
    float: left;
    min-height: 700px;
    margin-right: auto;
    background: #FFFFFF;
}

#footer {
    clear: both;
    background: #FFFFFF;
    width: 100%;
    margin-left:auto; margin-right:auto; margin-top:0;
    text-align: center;
    border: 0px solid #DBD5D5; 
}



/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 980px or less */
@media screen and (max-width: 980px) {
  #wrapper {
    width: 90%;
  }
  #content {
    width: 90%;
    margin-right:auto;
    float: right;
  }

  header, footer {
    width: 90%;
    height: 90%;
  }
}

/* for 700px or less */
@media screen and (max-width: 700px) {

  #content {
    width: 90%;
    float: right;
    margin-left: 0px;
  }

}

/* for 480px or less */
@media screen and (max-width: 480px) {
  header {
    height: auto;
  }
  h1 {
    font-size: 2em;
  }
}

header, #content, #wrapper, header, #content, footer {
  border: 0px solid #999;
}