/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {

body {
    background-color: white;
  }

#content {
         position:relative;
         left: 40px;
         height:1450px;
         width: 900px;
         font-size:40px;
         }
#header {
         position:relative;
         left: 0px;
         height:120px;
         width:95%;
         font-size:40px;
         text-align: center;
         }
#grafiek {
         position:relative;
         width: 95%;
         height:500px;
         font-size: 40px;
         }
#richting {
        
         position:relative;
         width: 95%;
         height:100px;
         float:left;
         font-size: 30px;
         left: 0px;
         }
#leeg    {
         position:relative;
         width: 100%;
         height:30px;
         float:left;
         font-size: 25px;
         }
#headerl {
         position:relative;
         width: 95%;
         height:30px;
         float:left;
         font-size: 25px;
         }
#actueel {
         position:relative;
         width: 100%;
         height:975px;
         float:left;
         font-size: 40px;
         }

#email {
         position: relative;
         left:0px;
         width: 100%;
         height:100px;
         font-size: 40px;
         color: blue;
         font-style: italic;
         }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

body {
    background-color: blue;
  }

#email {
         position:relative;
         left:20px;
         width: 500px;
         height:500px;
         font-size: 14px;
         color: green;
         }

}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

body {
    background-color: grey;
  }

}








/* Large devices (laptops/desktops/iPad2020, 992px and up) */
@media only screen and (min-width: 992px) {

body {
    background-color: white;
     }

#content {
         position:top;
         left: 0px;
         height:850px;
         width:100%;
         font-size:25px;
         }         

#header {position:relative;
         left: 0px;
         height:100px;
         width:100%;
         font-size:40px;
         text-align: center;
         }
#grafiek {
         /* Display: none; */
         position:relative;
         width: 60%;
         height:530px;
         float:left;
         font-size: 25px;
         }
#leeg    {
         position:relative;
         width: 40%;
         height:30px;
         float:right;
         font-size: 25px;
         }
#headerl {
         position:top;
         width: 40%;
         height:30px;
         float:right;
         font-size: 25px;
         }
#actueel {
         position:relative;
         width: 40%;
         height:540px;
         float:right;
         font-size: 20px;
         }
#richting {
         Display: inline;
         position:left;
         width: 60%;
         height:100px;
         float:left;
         font-size: 30px;
         margin-left: 0px;
         }
#email {
         /* Display: none; */
         position:relative;
         float: left;
         width: 42%;
         height:50px;
         font-size: 14px;
         color : black;
         }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

body {
    background-color: white;
  }

#content {
         position:top;
         left: 0px;
         height:750px;
         width:100%;
         font-size:40px;
         }

#header {
         position:relative;
         left: 0px;
         height:100px;
         width:100%;
         font-size:40px;
         text-align: center;
         }
#grafiek {
         position:relative;
         width: 55%;
         height:600px;
         float:left;
         font-size: 30px;
         }
#leeg    {
         position:relative;
         width: 42%;
         height:30px;
         float:right;
         font-size: 25px;
         }
#headerl {
         position:relative;
         width: 42%;
         height:30px;
         float:right;
         font-size: 25px;
         }
#actueel {
         position:relative;
         width: 42%;
         height:600px;
         float:right;
         font-size: 20px;
         }
#richting {
         position:relative;
         width: 50%;
         height:100px;
         float:left;
         font-size: 30px;
         margin-left: 40px;
         }
#email {
         position:relative;
         float: right;
         width: 42%;
         height:50px;
         font-size: 14px;
         color: red; 
         }
         
}