/* stijlregels voor browserschermen ≥ 1920pxi Desktop HP */

#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;
         }


/* On screens that are 992px wide or less, the background color is blue */
@media screen and (max-width: 992px) {

#content {
         position:top;
         left: 20px;
         height:990px;
         width:600px;
         font-size:40px;
         }

#header {
         position:relative;
         left: 0px;
         height:100px;
         width:100%;
         font-size:40px;
         text-align: center;
         }
#grafiek {
         position:relative;
         width: 100%;
         height:600px;
         float:left;
         font-size: 40px;
         }
#richting {
         position:relative;
         width: 100%;
         height:100px;
         float:left;
         font-size: 30px;
         margin-left: 40px;
         }

#leeg    {
         position:relative;
         width: 100%;
         height:30px;
         float:left;
         font-size: 25px;
         }
#headerl {
         position:relative;
         width: 100%;
         height:30px;
         float:left;
         font-size: 25px;
         }
#actueel {
         position:relative;
         width: 100%;
         height:600px;
         float:left;
         font-size: 20px;
         }
#email {
         position:relative;
         float: left;
         width: 100%;
         height:50px;
         color: blue;
         font-size: 14px;
         }
}

/* On screens that are 600px wide or less. iPhone7 Nokia Lumia */
@media screen and (max-width: 600px) {

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

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