*{
    position:relative;
	list-style :none;
	margin:0;
	padding:0;
	border:0;
	}

td:nth-child(2){
witdh:500px;
}

#achtergrond{
	
	background:#f8f8f8;
}
body{
	margin: 0 auto;
	}
	
#container{
  /*width:1077px;*/
  /*height:890px;*/
	min-height:100%;
    margin:0 auto;
    padding-bottom:100px;

 	
  }

h1{
    width:100%;
    height:100%;
    display: block;
    text-indent: -99999px;
}

.logo{
    position: absolute;
    right: 20px;
    top: 13px;
}
.bovagbanner {
    position: relative;
    top:20px;
}

#header_praktijk {
	background:#fff url('images/header_praktijk.jpg') no-repeat -1px bottom;
}

#header_lesauto {
	background:#fff url('images/header_lesauto.jpg') no-repeat -1px bottom;
}

#header_contact {
	background:#fff url('images/header_contact.jpg') no-repeat -1px bottom;
}

#header_links {
	background:#fff url('images/header_links.jpg') no-repeat -1px bottom;
}


#header_tarieven {
	background:#fff url('images/header_tarieven.jpg') no-repeat -1px bottom;
}

#header_theorie {
	background:#fff url('images/header_theorie.jpg') no-repeat -1px bottom;
}
#header {
	background:#fff url('images/header_home.jpg') no-repeat -1px bottom;
}


.praktijk{
	background:url('images/background_praktijk.jpg');
}

.lesauto{
	background:url('images/background_lesauto.jpg');
}

.theorie{
	background:url('images/background_theorie.jpg');
}

.links{
	background:url('images/background_links.jpg');
}

.contact{
	background:url('images/background_contact.jpg');
}

.tarieven{
	background:url('images/background_tarieven.jpg');
}


.index{
	background:url('images/background_home.jpg');
}

.praktijk, .lesauto, .theorie, .links, .contact, .tarieven, .index{
    background-position-y: 233px;
    background-repeat: no-repeat;
}

#tekst{
	font-family:Helvetica, sans-serif, Arial;
	font-size:15px;
	color:#000;
	padding-top:100px;
	}

#teksttarieven{
	font-family:Helvetica, sans-serif, Arial;
	font-size:15px;
	color:#000;
	padding-top:40px;
padding-left:40px;
	}

#logos{
	position:relative;
	}

table
{
border-collapse:collapse;
}

td{
	
	width:300px;
	border:solid 1px #4658a3;
	padding:4px;
	font-size:14px;
	border-collapse: collapse;

}

a{
	
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#4658a3;
	font-weight:bold;
	font-size:14px;
}

a:hover{
	
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#7f93e6;	
	font-weight:bold;
	font-size:14px;
}
#menu li{
    float:left;
}

li#close{
    display: none;
}


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

    #container {
        width: 1023px;
        height: 890px;
    }

    #header_praktijk, #header_lesauto, #header_contact, #header_links, #header_tarieven, #header_theorie, #header{
        height:233px;
        width:1023px;
        clear:both;
    }

    #menu {
        padding-left: 400px;
        margin: 0px;
        position: absolute;
        bottom: 30px;
    }


    #tekstvak_praktijk, #tekstvak_lesauto, #tekstvak_theorie, #tekstvak_links, #tekstvak_contact, #tekstvak_tarieven, #tekstvak{
        width:1023px;
        height:657px;
    }

    #rijschoolkiezer{
        top:10px;
    }

    #tekst{
        padding-left:200px;
        padding-right:200px;
    }

    #logos{
        padding-left:200px;
    }

    #logos li{
        margin-top:40px;
        float:left;
        margin-left:15px;
    }

    a span{
        text-indent: -9999px;
        display:inline-block;
    }

}

@media screen and (max-width:1077px){
    html, body{
        width:100%;
        height:100%;
        overflow:hidden;
    }

    #achtergrond{
        height: 100%;
    }

    #container {
        width: 100%;
        height: 100%;
        overflow:auto;

    }

    .praktijk, .lesauto, .theorie, .links, .contact, .tarieven, .index{
        background-size: cover;
        height: 100%;
        background-position-y: 0px;
        background-repeat: no-repeat;
    }

    #tekst{
        width: 80%;
        margin: 0 auto;
    }

    #logos{
        padding-bottom:50px;
    }

    #logos ul{
        width:80%;
        margin:0 auto;
    }

    #logos li{
        display: inline-block;
        padding: 10px 10px;
    }





    #header_praktijk, #header_lesauto, #header_contact, #header_links, #header_tarieven, #header_theorie, #header{
        height: 150px;
        width: 100%;
        clear: both;
        background-position: left bottom;
        background-size: cover;
    }
    a span{
        text-indent: -9999px;
        display:inline-block;
    }
}

@media screen and (max-width:1077px){
    #menu a img{
        display: none;
    }

    a span{
        text-indent: 0px;
        display:inline-block;
    }

    #menu{
        position: absolute;
        top: 10px;
    }

    #menu ul{
        display: block;
        top: 0;
        position: fixed;
        padding: 10px 20% 10px 50px;
        left:0;
        left: -500px;
        width: auto;
        height: 100%;
        font-family: Helvetica, sans-serif, Arial;
        background-color: #fff;
        z-index: 1;
        transition: 0.4s;
        overflow:auto;
    }


    #menu ul li a:hover, a.active{
        color:#7f93e6;
    }

    #menu ul li:nth-child(2){
        margin-top: 40px;
    }

    #menu ul li:last-child{
        margin-bottom: 40px;
    }

    #menu ul li{
        text-transform: capitalize;
        float: none;
        padding: 10px 0px;
    }

    button#menubutton{
        border: 2px solid #4658a3;
        outline: none;
        background-color: transparent;
        height: 38px;
        width: 48px;
        top: 10px;
        position: absolute;
        left: 20px;
        border-radius: 2px;
        padding: 2px 0;
        transition: 0.2s;
    }

    button#menubutton span{
        background-color: #4658a3;
        display: block;
        margin: 5px auto;
        height: 3px;
        width: 70%;
        border-radius: 15px;
    }

    button#menubutton:hover{
        background-color:#ffffff;
        background-color:rgba(196, 203, 218, 0.74);
    }

    .logo {
        width:200px;
    }

    button#menubutton:hover span{

    }

    #menu.active li#close{
        display: block;
    }

    #menu.active ul{

        left:0;
    }

    #menu ul li#close{
        position: absolute;
        right: 20px;
        width: auto;
        font-size: 20px;
        z-index: 3;
        cursor:pointer;
    }

    #menu ul li#close span{
        background-image: url('images/close.png');
        text-indent: -9999px;
        display: block;
        background-position: 0 0;
        background-size: 100% 100%;
        height: 23px;
        width: 23px;
    }


    table * {
        display: block;
        width: 100%;
    }


    table {
        display: block;
    }

    tr {
        margin-bottom: 20px;
    }

    td:first-of-type {
        font-weight: bold;
    }

    td:last-of-type {
        font-weight: bold;
    }

    td {
        box-sizing: border-box;
    }

    #logos img {
        height: 35px;
    }

}