/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 11-feb-2014, 11:12:08
    Author     : ACS
*/


/*
----------------------------------------------------------------------------
Standaard CSS voor body en content gedeeltes
----------------------------------------------------------------------------
*/

@font-face {
    font-family:"FontAwesome";
    src: url('wp-content/plugins/acs-utab/font-awesome/css/font-awesome.min.css');
}

#user_logged_in .mobile-container label a{
    margin:0px;
}

#switch_user{
    position:absolute;
    display:block;
    top:3px;
    left:40%;
    background:#fff;
    //padding:5px 10px;
}

.sm-edit-caps label{
    width:100%;
    display:inline-block;
}
.sm-edit-caps input[type="checkbox"]{
    cursor:pointer;
}

geroyeerd{
    display:block;
    padding:5px 10px;
    background: #ffcccc;
    border: 1px solid #000;
}
div.pasfoto-myprofile a{
    position:absolute;
}
div.pasfoto-myprofile{
    float:right;
    position:absolute;
    top:70px;
    right:40px;
}
div.pasfoto-myprofile img{
    max-width:260px;
    max-height:500px;
}
div.pasfoto-myprofile{
    border-radius:5px;
    border-radius:5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border:1px solid #ccc;
    background:#fff;
    overflow:hidden;
}
.overzicht-lid h2 {
    font-size: 20px !important;
}
.overzicht-lid .stats {
    float: left;
    padding: 20px;
    padding-top: 0px;
}
.overzicht-lid .stats.first{
    padding-left:0px;
}
.overzicht-lid .stats.last{
    padding-right:0px;
}
.overzicht-lid p {
    font-size: 16px !important;
}
.sm-edit-user #pasfoto{
    position:absolute;
    right:40px;
    margin-top:0px;
    background-color:#fff;
    border:1px solid #ccc;
    padding:10px;
    padding-top:0px;
    overflow:hidden;
    border-radius:5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    display:block;
    width:270px;
    height:270px;
}
.sm-edit-user #pasfoto img{
    max-width:300px;
    max-height:300px;
}
div.sm-edit-user label{
    display:block;
    margin:20px 0 5px 0;
    font-weight:bold;
}
.sm-search .edit-pasfoto{
    display:none;
}
.sm-search img.pasfoto{
    max-height:50px;
    max-width:50px;
    overflow:hidden;
}
.sm-edit-user input,
.sm-edit-user select{
    display:block;
    margin:3px 0 10px 0;
}

#header{
    position:fixed;
    top:0;
    left:0;
    display:block;
    width:98%;
    z-index:999;
    max-width:1863px;
    height:58px;
    
    -webkit-box-shadow: 0px 4px 5px -3px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 4px 5px -3px rgba(0,0,0,0.5);
    box-shadow: 0px 4px 5px -3px rgba(0,0,0,0.5);
}
#header #nav-menu{
    max-width:778px;
    margin:0 auto;
    position:relative;
    top:4px;
}
.last.menu-item{
    border-right: none;
}
body .wrap{
    margin-top:90px;
}
body.kassa .wrap{
    margin-top:0;
}
body.kassa .ingelogd-profile-pic-holder{
    display:none;
}

#user_logged_in{
    display:block;
    position:absolute;
    top:11px;
    left:88px;
}
#user_logged_in label{
    display:block;
    font-size:12px;
    margin-bottom:5px;
}
.ingelogd-profile-pic-holder{
    position:absolute;
    width:56px;
    height:56px;
    overflow:hidden;
    display:block;
    left:-72px;
    top:0px;
    border:1px solid #f1f1f1;
    border-radius:24px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
}
.ingelogd-profile-pic-holder img.pasfoto{
    max-width:57px;
}
.ingelogd-profile-pic-holder .pasfoto-edit{
    display:none;
}

#sm_settings_panel label{
    display:block;
    width:100%;
    border-bottom:1px solid #ccc;
    padding:20px 0 20px 0;
}

table input, table select{
    margin:6px 0;
    margin-right:3px;
}
.grey{
    color:grey;
}
table.cumulatie td{
	//border-bottom:	1px solid #CCC;
}
table.list tr td{
    /*min-width:100px;*/
}
table.list tr td p b{
    margin:0px;
    padding:0px;
}
table.list tr td p b a{
    margin:0px;
    width:0px;
}
table.list tr td p b a img{
    float:left;
    margin:0px;
}
table.list tr td p{
    margin:0px;
}
table.activate{
    width:50%;
}
div.uitgifte{
    top:0px;
}
tr.vakje td.no-border{
    padding-left:10px;
}
td.border-top{
    border-top:1px solid #ccc;
    padding-top:3px;
}
td.border-left{
    border-left:1px solid #ccc;
    padding-left:3px;
}
td.border-right{
    border-right:1px solid #ccc;
    padding-right:3px;
}
td.border-bottom{
    border-bottom:1px solid #ccc;
    padding-bottom:3px;
}

table.mutaties{
    font-size:12px;
    border:1px solid #ccc;
}
table.mutaties td{
    padding-left:10px;
    padding-bottom:5px;
}
table.mutaties td.important{
    padding-bottom:5px;
}
table.mutaties p{
    margin-left:10px;
}
table.mutaties b{
    font-size:12px !important;
}
div.where{
    padding:5px;
    display:block;
    margin-bottom:5px;
    border:1px solid #ccc;
    border-radius:3px;
    -moz-border-radius:3px;
    font-size:10px;
}
div.where a{
    margin-right:0px;
    font-size:10px !important;
}
body{   
    font-family: "Open Sans", Oxygen, sans-serif !important;
    margin:0px;
    padding:0px;
    width:100%;
    background-color: #b7cddb;
    background-size:cover;
}
body h1, body h2, body h3, body h4, input, textarea{
    font-family: "Open Sans", Oxygen, sans-serif !important;
    font-style:normal;
}
body a, i, u, b{
    font-family: "Open Sans", Oxygen, sans-serif !important;
    font-size:13px !important;
}
body b{
    font-size:13px;
}
img.logo{
    position:relative;
    left:98px;
    width:270px;
}
.pasfoto-right{
    width:200px;
    height:300px;
    overflow:hidden;
    float:right;
    position:relative;
    top:540px;
    margin-bottom:-250px;
}
div.pasfoto-right img.pasfoto-edit{
    position:relative;

    z-index:9999;
}
.pasfoto-right img{
    position:relative;
    max-width:100%;
}
img.pasfoto-edit{
    position:relative;
    //top:40px;
    left:10px;
    max-width: 500px;
    max-height: 500px;
}
div.opmerking .inner table img{
    max-width: 400px;
    max-height: 175px;
}
td.right{
    float:right !important;
    border-bottom:none !important;
}
table.leerlingkaart1{
    border:2px solid #000;
    padding:2px;
}
table.leerlingkaart1 td{
    border-bottom:1px solid #000;
}
table.leerlingkaart2{
    border:1px solid #000;
    margin-top:10px;
    background:#ccc;
    padding:2px;
}
table.leerlingkaart3{
    border:1px solid #000;
}
table.leerlingkaart3 td{
    border:1px solid #000;
    padding:2px;
}
table.leerlingkaart3 td.grey{
    text-align: center;
    color:#e2e2e2;
}
table.leerlingkaart4{
    margin-top:10px;
    border:1px solid #000;
    margin-bottom:20px;
}

table.leerlingkaart4 td.title{
    text-align: center;
    font-weight:bold;
    background:#ccc;
}
table.leerlingkaart4 td.center{
    text-align: center;
}
table.leerlingkaart4 td.center h3, p{
    margin:2px;
    padding:0px;
}
table.leerlingkaart4 tr.title{
    text-align: center;
    font-weight:bold;
    background:#ccc;
}
table.leerlingkaart4 td{
    border-right:1px solid #000;
    border-bottom:1px solid #000;
    height:40px;
}
table.leerlingkaart1 td.right{
    border:0 !important;
}
div.leerlingkaart{
    font-family: 'Verdana', sans-serif !important;
    font-size:12px;
}
div.leerlingkaart p, b, h1, h2, h3, h4{
    font-family: 'Verdana', sans-serif !important;
    font-size:12px;
}
img.leerlingkaart{
    position:relative;
    float:right;
    max-height:150px;
    right:11px;
    margin-top:-135px;
    top:150px;
    border:2px solid #000;
}
// -------
.pasfoto-right img {
    border:5px solid #ccc;
    max-width:200px !important;
    max-height:200px !important;
}
td img.pasfoto{
    max-width:100px;
    border:2px solid #000;
}
tr.grey{
    background:#ccc;
}
#container{
    margin:0px;
    padding:0px;

}
#header{
    background:#fff;
    padding:20px;
}
#header h1{
    color:#fdf243; 
    text-shadow: black 0.1em 0.1em 0.2em;
    margin-bottom:0px;
}
#header h3{
    color:#fdf243; 
    text-shadow: black 0.1em 0.1em 0.2em;
    margin-top:0px;
}
#header img{
    float:right;
    position:relative;
}
#logged-in{
    border-top:1px solid #ccc;
}
#nav-menu{
    //padding-top:20px;
    //padding-bottom:30px;
    margin-bottom:10px;
}
#nav-menu li.current-menu-item a{
    font-weight:bold;
}
#nav-menu ul{
    list-style:none;
    margin:0px;
    padding:0px;
}
#nav-menu ul li{
    float:left;
}
table.login{
    padding:20px;
    border:1px solid #ccc;
    border-radius:5px;
}
table{
    font-size:14px;
    width:100%;
}
table.inname{
    margin-bottom:20px;
}
td.upload p{
    font-size:10px !important;
}
table.login{
    width:300px;
}
table.loggedin{
    margin-top:10px;
    margin-bottom:20px;
    width:235px;
    position:absolute;
    top:0;
}
table.full-rechten td.border-bottom{
    border-bottom:1px solid #ccc;
    padding:5px;
}
.wrap{
    position:relative;
    border:1px solid #fff;
    border-radius:3px;
    -moz-border-radius:3px;
    top:20px;
    max-width:940px; /* + 2x 50px padding = 940px */
    margin-left:auto;
    margin-right:auto;
    margin-top:0px;
}
#content{

    padding-top:21px;
    padding-bottom:21px;
    background:#fff;
    padding:20px;
}
#footer{
    padding:21px 0 21px 0;
    margin-top:20px;
    height:15px;
    width:100%; /* padding = 2x 21px, dus 95% ipv 100% */
    clear:both;
    font-size:10px;
    color:#3d4d7e;
    text-align:center;

background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(47%,rgba(246,246,246,1)), color-stop(100%,rgba(237,237,237,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
}
#footer p{
    font-size:12px !important;
}
p.blue, b.blue{
    color:#00baff !important;
}
div.upload{
    margin-top:20px;
    margin-bottom:10px;
    padding:10px 10px 20px 10px;
    border:1px solid #ccc;
}
td.bottom-buttons img{
    margin-left:0px !important;
}
div.upload p{
    font-size:10px;
    margin:0px;
}
div.upload p b{
    margin:0px;
    padding:0px;
}
div.upload p.path{
    height:30px;
    margin-bottom:5px;
}
/*
----------------------------------------------------------------------------
Errors 
----------------------------------------------------------------------------
*/
#error{
    padding:10px; 
    border:1px solid red;
    border-radius:5px;
    color:red;
    margin-top:10px;
    margin-bottom:30px;
}
p#error{
    color:red;
    padding:0;
    border:none;
    margin:0px;
}
#error2{
    margin-top:30px;
    width:300px;
    margin-left:auto;
    margin-right:auto;
    font-weight:bold;

}
p.error{
    font-weight:bold;
    color:red;
}
pre{
    background:#ffcccc;
    padding:10px;
    border:1px solid #000;
}
/*
----------------------------------------------------------------------------
 Success 
----------------------------------------------------------------------------
*/
#success{
    padding:10px; 
    border:1px solid green;
    border-radius:5px;
    color:green;
    margin-top:30px;
    margin-bottom:30px;
    display:block;
    clear:both;
}
#success img{
    float:left;
    padding:10px;
    border:1px solid #000;
    display:block;
    clear:both;
    margin:0 10px 0 0;
}
#success td.img{
    max-width:100px;
    overlay:hidden;
}
/*
----------------------------------------------------------------------------
Buttons en links
----------------------------------------------------------------------------
*/
.deelnemers{
    border:1px solid #ccc;
    margin-bottom:20px;
}
.deelnemers p.red{
    padding:0;
}
.deelnemers p{
    padding:10px;
}
.deelnemers h3, h2{
    margin-left:10px;
}
.deelnemers a.button{
    margin-left:10px;
}
body a{
    color:#000;
    text-decoration:none;
    border-radius:5px;
}
.button{
    padding:7px;
    background: #f6f8f9; /* Old browsers */
    background: -moz-linear-gradient(top,  #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6f8f9), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#f5f7f9)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
    border:1px solid #ccc;
}
a.button{
    bottom:2px;
    position:relative;
}
tr.white{
    background:#fff !important;
}
a.button:hover {
    color:#000 !important;
}
a img:hover{
    opacity:0.6;
    filter:alpha(opacity=60); /* For IE8 and earlier */
}
body a:hover{
    color:#ccc !important;
}
body hr{
    clear:both;
    margin-top:10px;
}
input[type="submit"]{
    padding:7px;
    background: #f6f8f9; /* Old browsers */
    background: -moz-linear-gradient(top,  #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6f8f9), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#f5f7f9)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
    border:1px solid #ccc;
    border-radius:5px;
}
textarea{
    font-family: "Open Sans", Oxygen, sans-serif !important;
    font-size:12px;
    margin:0px;
    padding:5px;
}
a, button, input[type="submit"] {
    cursor: pointer;
    margin:0px 10px 1px 0;
    height:31px;
}
input{
    border:1px solid #ccc;
    border-radius:2px;
    padding:5px;
}
input:hover{
    border: 1px solid #1d8ce2;
}
select{
    border:1px solid #ccc;
    border-radius:2px;
    padding:5px;    
}
select:hover{
    border: 1px solid #1d8ce2;
}
input[type="submit"]:hover, .button:hover{
    background: #eaebed; /* Old browsers */
    background: -moz-linear-gradient(top,  #eaebed 0%, #e5ebee 50%, #d7dee3 51%, #eaebed 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaebed), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#eaebed)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaebed', endColorstr='#eaebed',GradientType=0 ); /* IE6-9 */
    border:1px solid #ccc;
}
input[type="file"]{
    border:none;
}
#file{
    float:left;
    width:118px;
}
a.button img{
    position:relative;
    top:4px;
    left:4px;
}
a.button img.back{
    left:-2px;
}
body a:visited{
    color:#000;
}
a.ingelogd{
    float:left;
    display:block;
    clear:both;
}
/*
----------------------------------------------------------------------------
Wapenbeheer
----------------------------------------------------------------------------
*/
#wapenmeester{
    border:1px solid #000;
    border-radius:5px;
    width:100%;
    clear:both;
    display:block;
    margin:21px 0 0 0;
    padding:0px;
}
#wapenmeester .blok{
    width:44.763%;
    border:1px solid #ccc;
    border-radius:5px;
    float:left;
    display:block;
    padding:21px;
}
img.pasfotoholder{
    position:relative;
    float:left;
}
table.uitgifte{
    float:left;
    position:relative;
    width:75%;
}
/*
----------------------------------------------------------------------------
Blokken content
----------------------------------------------------------------------------
*/
.blok{
    border:1px solid #ccc;
    border-radius:3px;
    -moz-border-radius:3px;
    clear:both;
    display:block;
    padding:21px;
    margin-bottom:20px;
    overflow:hidden;
    font-size:12px;
    background:#fff;
}
.blok h1{
    font-size:24px;
}
.blok h3{
    font-size:16px;
}
.blok a{
    margin-right:21px;
}
.blok td img{
    margin-left:5px;
    margin-top:2px;
}
.blok tr.empty{
    height:25px;
}
.blok ul.list{
    list-style:none;
}
.blok ul.list li{
    padding-bottom:20px;
    margin-left:0px;
}
p.right{
    margin:0 65% 0 0;
    padding:0px;
    text-align: right;
}
table.cumulatie p.right{
	margin: 0px;
}
/*
----------------------------------------------------------------------------
Wapens
----------------------------------------------------------------------------
*/
td.status select{
    width:140px;
    position:relative;
    z-index:5;
}
table.onderhoud{
    padding:0px;
}
table.onderhoud form{
    margin-bottom:0px;
}

td.status p{
    font-size:10px;
    float:left;
}
td.status{
    padding:0px;
    margin:0px;
}
.red{
    color:red;
}
td.status img{
    padding:0px;
    margin:0px;
    position:relative;
    float:left;
}
td.important{
    background:#eaebed;
    padding:10px;
}
img.loading{
    border:none !important;
    float:none !important;
}
table.wapenlijst p.left{
    margin-left:10px;
}
table.wapenlijst tr:nth-child(even) {
    background:#e7e7e7;
}
table.wapenlijst tr:nth-child(odd) {
    background:#fff;
}
.opmerkingen{
    margin-bottom:10px;
}
h1 img{
    position:relative;
    top:6px;
    left:10px;
}
#adiv1{
    font-family: "Open Sans", Oxygen, sans-serif !important;
    border:1px solid #ccc;
    margin-bottom:20px;
}
#adiv1 h2, h3{
    margin-left:10px;
}
#adiv1 td{
    padding:10px !important;
}
#adiv2{
    position:relative;
}
/*
----------------------------------------------------------------------------
Opmerkingen
----------------------------------------------------------------------------
*/
div#search-user-loginform{
    position:fixed;
    right:0;
    top:0;
    background:#fff;
    padding:20px;
    bottom:0;
}
.overlay{
    position:fixed;
    padding-top:200px;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background-color: rgba(0, 0, 0, .4);
    width:100%;
    height:100%;
    z-index:998;
}
.opmerking{
    position:relative;
    z-index:999;
    margin:auto;
    width:500px;
    height:450px;
    background:#fff;
    border:1px solid #000 !important;
    padding:20px;
    left:10px;
    bottom:10px;
}
.opmerking #success{
    background:#fff;
}
h3.green{
    color:green;
}
h3.red{
    color:red;
}
.waarschuwing{
    position:relative;
    z-index:99999999;
    margin:auto;
    width:500px;
    height:400px;
    background:#ffcccc;
    border:1px solid #000 !important;
    padding:20px;
    left:10px;
    bottom:10px;
}
.weigering{
    position:relative;
    z-index:99999999;
    margin:auto;
    width:500px;
    height:400px;
    background:#ffcccc;
    border:1px solid #000 !important;
    padding:20px;
    left:10px;
    bottom:10px;
}
/*
----------------------------------------------------------------------------
Presentielijst
----------------------------------------------------------------------------
*/
table.presentielijst p.left{
    margin-left:10px;
}
table.presentielijst tr:nth-child(even) {
    background:#e7e7e7;
}
table.presentielijst tr:nth-child(odd) {
    background:#fff;
}
table.presentielijst td{
    padding:10px;
}

#knsa_present_via_zoek {
    display:none;
}

#label_present_via_zoek {
    cursor: pointer; background-size: contain; background-repeat: no-repeat; display: inline-block; width: 20px; height: 20px; background-image: url('../images/checkmark.png');
}
/*
----------------------------------------------------------------------------
Kassa
----------------------------------------------------------------------------
*/
body.kassa #content{
    padding:0px;
    margin:0px;
    background:none;
    float:left;
}
body.kassa .overlay{
    margin:0px;
    padding:200px 0 0 0;
    height:100%;
    width:100%;
    bottom:0;
    top:0;
    left:0;
    right:0;
}
body.kassa table.loggedin,
body.kassa .where {
    display:none;
}
body.kassa{
    padding:0px;
    margin:0px;
    background-size: cover;
}
body.kassa .wrap{
    width:100%;
    margin:0;
    padding:0;
    height:100%;
    border:none;
    box-shadow:none;
    display:block;
    float:left;
    position:relative;
    background:none;
    max-width:100%;
}
body.kassa #container{
    width:100%;
}
body.kassa #footer{
    display:none;
}
body.kassa #header{
    display:none;
}
body.kassa #logged-in{
    display:none;
}
body.kassa #nav-menu{
    display:none;
}
ul.bedrag{
    list-style:none;
    padding:0px;
    margin:0px;
}
ul.bedrag h3{
    font-size:20px;
    margin:0px;
}
ul.bedrag li{
    float:left;
    width:55px;
    height:30px;
    padding-left:5px;
    padding-top:2px;
    margin:20px;
    border-radius:5px;
    background: #f6f8f9; /* Old browsers */
    background: -moz-linear-gradient(top,  #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6f8f9), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#f5f7f9)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
    border:1px solid #ccc;
    }
ul.bedrag li:hover{

    background: #eaebed; /* Old browsers */
    background: -moz-linear-gradient(top,  #eaebed 0%, #e5ebee 50%, #d7dee3 51%, #eaebed 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaebed), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#eaebed)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaebed', endColorstr='#eaebed',GradientType=0 ); /* IE6-9 */
    border:1px solid #ccc;
}
.kassa-item{
    width: 95%;
    clear: both;
    display: block;
    overflow: hidden;
    font-size: 12px;
}
table.saldo td{
    background:#eaebed;
    padding:10px;
}
td.white{ 
    background:#fff;
}
h4{
    font-size:16px;
    margin-bottom:0px;
    padding-bottom:0px;
}
.opmerking-content{
    height:92%;
}
table.list td{
    padding:5px;
}
table.list tr:nth-child(even) {
    background:#e7e7e7;
}
table.list tr:nth-child(odd) {
    background:#fff;
}
.sortable_list a{
    font-size: 14px!important;
    text-decoration: underline!important;
}
ul.buttonlist{
    list-style:none;
    padding-left:0px;
    margin-left:0px;
}
ul.buttonlist li{
    margin-bottom:20px;
    margin-top:20px;
}
b.right{
    margin-left:67px;
}
td.important b{
    font-size:16px;
}
p.red{
    color:red;
}
.kassa{
    width:100%;
    margin-left:auto;
    margin-right:auto;
    background-color: #b7cddb;
    padding:20px;
}
.kassa-top{
    margin-bottom:20px;
    border-bottom:1px solid #ccc;
    width:98%;
    float:left;
}
.kassa-top h1{
    float:left;
}
.kassa-top ul{
    list-style:none;
    padding:0px;
    margin:0px;
    float:left;
}
.kassa-top li{
    float:left;
    margin-left:10px;
    margin-top:6px;
}
.kassa-top h1{
    margin-left:10px;
}
#kassa{
    width:100%;
    display:block;
    float:left;
}
h2.grey{
    color:grey;
}
.inner{
    width:100%;
    height:90%;
    float:left;
}
ul.kassa{
    list-style:none;
    margin:0px;
    padding:0px;
    width:100%;
}
div.debug{
    background: #ffcccc;
    padding: 10px;
    border: 1px solid #000;
    border-radius:0px;
    font-size:13px;
}
span#error{
    background: #ffcccc;
    padding: 10px;
    border: 1px solid red;
    border-radius:0px;
    font-size:13px;
}
span#opm{
    background: #8cc885;
    padding: 10px;
    border: 1px solid green;
    border-radius:0px;
    font-size:13px;
    color:green;
}
ul.kassa{
    display:block;
}
ul.kassa li{
    float:left;
    margin-right:2%;
    width:27.333%;
    opacity:0.9;
    display:block;
    margin-top:20px;
}
ul.kassa li.left{
    background: #fff;
    margin-right: 0px !important;
    font-size: initial;
    width:64.666%;
    clear:both;
    margin-right:2% !important;
}
ul.kassa .afr-button{
    //margin-right:0px;
    //width:25.333%;
}
ul.kassa li.left li{
    margin-top:0px;
}
ul.kassa img{
    width:1vw;
}
ul.producten li h3{
    font-size:initial !important;
    margin-right:10px;
}
ul.paylist li{
    float:none;
}
ul.producten li img{
    width:2.5vw;
}
li.overzicht{
    background:#fff;
    min-height:60%;
    display:block;
    padding:2%;
    float:left;
}
li.center{
    padding:20px 2% 20px 2%;
    background:#99ccff;
    opacity:0.9;
}
li.center.retour{
    background:#cc99ff !important;
}
li.center.presentie{
    background:#6cb33f !important;
    width: 60%;
    max-width: 1400px;
}
li.center.presentie h1, li.center.presentie h3, li.center.presentie p, li.center.presentie ul {
    display: none;
}
.kassa li.center.presentie #error h3 {
    display: initial;
}
li.center.presentie td p {
    display: block;
}
li.center.presentie li{
    width: 100%;
    margin-top: 5px;
    margin-bottom: 20px;
}
li.center.presentie.blok {
    padding: 0px 21px;
}
li.center.inactive{
    background:none;
    min-height:75%;
    position:relative;
    z-index:-1;
}

div.presentie_overlay{
	background-color: red;
}

a.retourneren{
    margin-top:50px;
    background:grey;
    color:#fff !important;
    font-size:16px;
    border-radius:0;
    padding:10px;
    border:1px solid #ccc;
    width:100%;
}
.input-scan{
    background:#fff;
    border:none;
    width:100%;
    font-size:24px;
    padding:20px;
    text-align: center;
    
}
a.retourneren:hover{
    opacity:0.9;
    color:#fff !important;
}
tr.retour{
    background:#ccffcc !important;
}
table.retour{
    margin-bottom:20px;
}
li.right-kassa{
    padding:20px 2% 20px 2%;
    background:#fff;
    margin-right:0px !important;
    min-height:60%;
    font-size:initial;
}
li.right-kassa h1, li.overzicht h1{
    font-size:1vw;
}
li.center h2{
    font-size:1vw;
}
span#bedrag h1{
    font-size:1vw;
}
ul.kassa table{
    font-size:initial;
}
ul.kassa table b, p, a{
    font-size:initial !important;
}
li.overzicht h2{
    font-size:1vw;
}
#kassafooter h1, h2{
    font-size:1vw;
}
ul.kassa h3{
    font-size:initial;
}
li.right-kassa.munitie{
    background:#fff;
    box-shadow: 0 0 0 5px #fad873 inset;
}
li.right-kassa.presentie{
    display:none;
}
.corner{
    position:relative;
    float:right;
    top:-37px;
    right:-20px;
}
.afrekenen{
    width:40%;
    height:100%;
    margin-right:10px;
    margin-top:20px;
    float:right;
}
ul.menu{
    font-size:12px;
    height:40px;
    padding:7px;
    background: #f6f8f9; /* Old browsers */
    background: -moz-linear-gradient(top,  #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6f8f9), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#f5f7f9)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
    border:1px solid #ccc; 
    border-radius:3px;
    -moz-border-radius:3px;
}
ul.menu li{
    background:none;
    border-right:1px solid #ccc;
    padding-left:10px;
    padding-right:10px;
    height:40px;
    line-height:39px;
}
ul.menu li:hover{
    background: #eaebed; /* Old browsers */
    background: -moz-linear-gradient(top,  #eaebed 0%, #e5ebee 50%, #d7dee3 51%, #eaebed 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaebed), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#eaebed)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaebed', endColorstr='#eaebed',GradientType=0 ); /* IE6-9 */
}
ul.menu li.current-menu-item{
    background: #eaebed; /* Old browsers */
    background: -moz-linear-gradient(top,  #eaebed 0%, #e5ebee 50%, #d7dee3 51%, #eaebed 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaebed), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#eaebed)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #eaebed 0%,#e5ebee 50%,#d7dee3 51%,#eaebed 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaebed', endColorstr='#eaebed',GradientType=0 ); /* IE6-9 */
}
ul.menu a li.current-menu-item{
    color:#ccc;
}
.overzicht h3{
    margin:0px;
    padding:0px;
}
.producten{
    float:left;
    width:100%;
    position:relative;
}
ul.producten{
    list-style:none;
    padding:0px;
    margin:0px;
    width:100%;
}
ul.producten li{
    padding:1.2%;
    padding-left:1.5%;
    padding-right:1.5%;
    float:left;
    margin-right:5px;
    background:#fff;
    opacity:0.9;
    clear:right;
}
ul.producten li:hover{
    opacity:0.8;
}
ul.producten li.bedrag{
    background:#6cb33f;
    color:#fff;
    margin-left:0px;
    width:12.5%;
    padding:0;

}
#totaal h1{
    width:55%;
    font-size:1.6vw;
    padding-top:3% !important;
    padding-bottom:3% !important;
}
ul.producten li.right{
    padding-top:1.2%;
    padding-bottom:1.2%;
}
.cat.scan{
//    margin-right:0px !important;
}
ul.producten li.fill{
    background:none;
    height:48px;
    width:15.5%;
}
#kassafooter li p{
    float:left;
    margin-top:4px;
}
ul.producten li.cat{
    background:#e2e2e2;
    color:#000;
    text-transform: uppercase;
}
ul.producten li.presentie-selected{
    background:#6cb33f !important;
    color:#000;
}
ul.producten li.scan-selected{
    background:#99ccff !important;
    color:#000;
}
ul.producten li.retour-selected{
    background:#cc99ff;
}
ul.producten li.munitie-selected{
    background:#fad873;
}
ul.producten li.kaarten-selected{
    background:#cdf9f5;
}
li.right-kassa.kaarten{
    background:#fff;
    box-shadow: 0 0 0 5px #cdf9f5 inset;
}
ul.producten li.blank{
    height:48px;
    padding-right:20px;
}
.kassa-bottom{
    width:100%;
    display:block;
}
.afr-button h2{
    color:#fff;
    font-size:18px;
}
.left ul li{
    float:left;
    width:auto;
}
.left ul li h2{
    float:left;
    margin-right:10px;
}
.kassa-top{
    background:#fff;
    padding:10px;
    position:relative;
    top:0;
}
.medewerker{
    border-bottom:2px solid #ccc;
}
#kassafooter{
    color:#fff;
    width:100%;
    position:relative;
    bottom:10px;
    float:left;
    color:#000;
    max-height:92px;
    overflow:hidden;
    opacity:0.9;
}
#kassafooter h1, h2{
    font-size:1vw;
}
.disabled{
    background:#eaebed;
    color:#ccc !important;
}
.disabled h2{
    color:#ccc;
}
.disabled:hover{
    background:#eaebed;
}
#afrekenen{
    padding-bottom:20px;
}
li.button.nosaldo{
    background:#eaebed;
    color:#ccc;
}
.green {
    color:#6cb33f;
}
#kassafooter .left{
    background:#fff; 
    width:59.6%;
    padding:0.5% 3% 0 3%;
    float:left;
    margin-right:2%;
    border:1px solid #ccc;
}
.afr-button{
    background:#6cb33f;
    padding:0.5% 3%;
    color:#fff;
    font-size:20px;
    font-weight:bold;
	margin-top: 20px;
}
.afr-button h1{
    font-size:initial;
}
.afr-button a h1{
    color:#fff;
}
.afr-button:hover{
    opacity:0.9;
}
.afr-button a{
    color:#fff;
}
#kassafooter h1{
    float:left;
    margin-top:0px;
    margin-bottom:0px;
}
#kassafooter h2{
    margin-top:0px;
    margin-bottom:0px;
}
#kassafooter li{
    float:left;
}
#kassafooter ul{
    list-style:none;
    float:left;
    margin:0px;
}
#scan{
    float:left;
    margin-left:10px;
    background:#006699;
    padding:20px;
    width:25%;
}
ul li.selected{
    background:#fff !important;
    color:grey !important;
}
#scan h2{
    float:left;
    color:#ccc;
}
#scan input{
    float:left;
    margin-left:30px;
    margin-top:8px;
    padding:10px;
}
span.total{
    height:83px;
}
td img.ammo-icon{
   position:relative;
   top:2px;
}
ul.paylist{
    list-style:none;
    padding:0px;
}
ul.paylist li{
    margin-bottom:10px;
}
li.grey{
    background:#ccc;
    padding:10px;
    width:300px !important;
}
p.green{
    color:green;
}
img.center{
    position:relative;
    width:35px;
    left:223px;
    right:auto;
}
td.edit-link{
    width:50px;
}
ul.empty{
    list-style:none;
    
}
ul.empty li{
    float:left;
    padding:20px 40px 20px 40px;
    border:1px solid #ccc;
    margin-right:20px;
    background:#6cb33f;
    color:#fff;
    font-size:20px;
    text-align: center;
    text-transform:uppercase;
}
ul.empty li:hover{
    opacity:0.9;
}

/*
----------------------------------------------------------------------------
Payments
----------------------------------------------------------------------------
*/
table.payments td{
    padding:20px;
    border-bottom:1px solid #ccc;
}
table.payments td.blue{
    font-weight:bold;
    color:#fff;
    background:#3333ff;
    padding:10px;

}
table.payments td.orange{
    font-weight:bold;
    color:#fff;
    background:#ff9900;
    padding:10px;

}
table.payments td.white{
    border-bottom:none;
}
/*
----------------------------------------------------------------------------
geroyeerde leden
----------------------------------------------------------------------------
*/
h2.geroyeerd{
    color:red;
}
div.geroyeerd{
    background: #ffd9d9;
}
/* Rechten function
-------------------------------------------------------------- */
#rechten{
    float:left;
    width:20%;
}
/* Pasfoto function
-------------------------------------------------------------- */
#userpic{
    float:left;
    width:20%;
    overflow:hidden;
    margin-bottom:20px;
}
#userpic img.pasfoto{
    max-width:200px;
    max-height:300px;
    width:100%;
}
/*
----------------------------------------------------------------------------
mutatie formulier
----------------------------------------------------------------------------
*/
.bottomnav{
    margin-top:20px;
}
table.mutaties{
    margin-bottom:10px;
    margin-top:10px;
}
table.mutatie{
    font-size:12px;
    margin-bottom:2px;
}
table.mutatie b, i, u{
    font-size:12px;
}
table.mutatie td.top{
    color:#fff;
    font-weight:bold;
    background:#000;
}
span.nr{
    font-size:19px;
    margin-left:5px;
}
.print{
    max-width:960px;
    width:100%;
    background:#fff;
    margin-left:auto;
    margin-right:auto;
    margin-top:0px;
    padding:10px;
}
body.mutatie .overlay{
    padding-top:0px;
    height:100%;
}
.print table.mutatie{
    font-size:10px;
}

#mutatieheader{
    display:none;
}

@media print{
    .no-print, .no-print *{
        display:none !important;
    }
    .pagebreak, .pagebreak *{
        page-break-after: always !important;
        -webkit-region-break-after:always !important;
        height:50px !important;
    }
    .print table.mutatie i, u, a, b{
        font-size:10px !important;
    }
    table.list i, table.list u, table.list a, table.list b, table.list p, table.list{
        font-size:10px !important;
    }
    .print table *, table.list *{
        page-break-inside:auto !important;
        -webkit-region-break-inside:auto !important;
    }
    .print tr *, table.list tr *, td *, table.list td *{
        page-break-inside:avoid !important;
        page-break-after:auto !important;
        -webkit-region-break-inside:avoid !important;
        -webkit-region-break-after:auto !important;
    }
    .print thead *, table.list thead *{
        //display:table-header-group !important;
    }
    .print tfoot, table.list tfoot *{
        display:table-footer-group !important;
    }
    table.list{
        position:relative;
        left:-20px;
    }
    #nav-menu, #nav-menu *{
        display:none !important;
    }
    #header, #header *{
        display:none !important;
    }
    table.loggedin, table.loggedin *{
        display:none !important;
    }
    #mutatie h2, #mutatie h2 *{
        display:none !important;
    }
    #footer, #footer *{
        display:none !important;
    }
    .print, .print *{
        padding:0px !important;
        font-family: Verdana !important;

    }
    body, body *{
        background-image:none !important;
    }
    table.leerlingkaart4 td.center p{
        display:block !important;
    }
    #mutatieheader{
        display:block;
        margin-top:-20px;
        padding-top:0px;
        color:#ccc;
        margin-bottom:10px;
    }
    #mutatieheader img{
        margin-bottom:5px;
    }
    #mutatieheader .sub-header{
    border-top:1px solid #ccc;
    border-bottom:1px solid #ccc;
    margin-bottom:2px;
    letter-spacing:3px;
    padding:2px;
    margin-bottom:3px;
    }
    #mutatieheader center{
        font-size:8px;
    }
}
div.loginform{
    width:30%;
    height:40%;
    margin:0px auto;
}
#content h3{
    font-size:24px;
}
#content label.text, #content label.input{
    float:left;
    display:block;
    margin:5px 20px;
}
div.loginform input[type='submit']{
    margin-top:10px;
    margin-bottom:20px;
    display:block;
}

@page  
{ 
    size: auto;   /* auto is the initial value */ 

    /* this affects the margin in the printer settings */ 
    margin: 10mm 0mm 10mm 10mm;
} 
/*
----------------------------------------------------------------------------
Tablet --- kassa
----------------------------------------------------------------------------
*/

/*
----------------------------------------------------------------------------
Mobile --- kassa
----------------------------------------------------------------------------
*/
@media all and (max-width:1500px){
    #header img{
        max-width:115px;
    }
}
@media all and (max-width:1337px){
    #header #nav-menu{
//        top:inherit;
//        padding-top:34px;
        float: right;
    }
    #header img{
        margin-right:20px;
    }
    body .wrap{
        margin-top:110px;
    }
}

@media all and (min-width:780px){
    div#nav-menu ul.menu a#mobile{
        display:none;
    }

}

@media all and (min-width:320px) and (max-width:780px) {
    div#switch_user{
        display:none;
    }
    div.ngelogd-profile-pic-holder{
        display:block;
    }
    body .wrap{
        margin-top:22px;
    }
    #header{
        padding:0;
        display:block;
        height:auto;
        width:100%;
    }
    #nav-menu{
        padding-top:0px !important;
    }
    #nav-menu ul li{
        float:left;
        width:100%;
        text-align:center;
        background:#038cc3;
        text-shadow: 0 -1px 1px #006799, 1px 0 1px #006799, 0 1px 1px #006799, -1px 0 1px #006799;
        color:#fff;
        border-bottom:1px solid #0085ba;
        padding:0;
        height:50px;
        line-height:50px;
    }
    #nav-menu ul li:hover{
        background:#079dda;
    }
    #nav-menu ul a#mobile li{
        background: #0085ba;
        border-color: #0073aa #006799 #006799;
        -webkit-box-shadow: 0 1px 0 #006799;
        box-shadow: 0 1px 0 #006799;
        color: #fff;
        text-decoration: none;
        text-shadow: 0 -1px 1px #006799, 1px 0 1px #006799, 0 1px 1px #006799, -1px 0 1px #006799;
    }
    #mobile li span:before{
        font-family:"FontAwesome";
        content:"\f0c9";
        color:#fff;
        position:relative;
        right:5px;
    }
    
    div.pasfoto-myprofile{
        top:192px;
    }
    div.pasfoto-myprofile img{
        max-width:157px;
    }
    .sm-edit-user #pasfoto{
        width:125px;
        height:125px;
        margin-top:140px;
    }
    div#nav-menu ul.menu a#mobile{
        display:block;
    }
    #nav-container #nav-menu{
        max-width:100%;
    }
    #nav-container{
        width:100%;
        left:0;
        position:absolute;
        top:0;
    }
    #nav-container a{
        margin:0;
    }
    ul.menu{
        width:100%;
    }
    div#nav-menu ul.menu li.menu-item{
        display:none;
    }
    
    html, body, #container{
        width:100%;
        margin:0px;
        padding:0px;
        //overflow:hidden;
    }
    div.loginform{
        width:100%;
    }
    div.loginform label input{
        width:300px;
        height:40px;
    }
    div.loginform label{
        margin-bottom:20px;
    }
    #header img{
        //float:left;
        display:none;
    }
    #user_logged_in{
        right:0;
        left:inherit;
        height:58px;
    }
    #user_logged_in .mobile-container{
        display:none;
        position:absolute;
        background:#038cc3;
        z-index:999;
        color:#fff;
        box-shadow:1px 1px 1px rgba(34, 34, 34, 0.9);
    }
    #user_logged_in .mobile-container a{
        color:#f1f1f1;
    }
    #user_logged_in .mobile-container{
        top:41px;
        padding:10px;
        border-bottom-left-radius:5px;
        border-bottom-right-radius:5px;
    }
    #user_logged_in .ingelogd-profile-pic-holder{
        z-index:999;
        left:inherit;
        top:-8px;
        left:22px;
        width:45px;
        height:45px;
        cursor:pointer;
        
    }
    #header{
        display:block;
    }
    table.loggedin{
        position:relative;
        display:block;
        width:100%;
    }
    #nav-menu{
        //padding:0px;
        height:60%;
    }
    #nav-menu ul{
        background:none;
        border:none;
        margin-bottom:20px;
    }
    div.where{
        display:none;
    }
    #container p{
        font-size:14px !important;
    }
    #container h2{
        font-size:20px !important;
    }

    div.right{
        float:left;
    }
    form[name='search'] input, form[name='search'] input:focus{
        //float:left;
        margin-top:10px;
        width:100%;
        height:50px;
    }
    form[name='search']{
        margin-bottom:20px;
    }
    a.button{
        //float:left;
        width:94%;
        text-align:center;
        height:auto;
        display:block;
    }
    table.loggedin a.button{
        margin-right:20px;
        height:auto;
    }
    table.loggedin img.back{
        margin-left:20px;
    }
    div.blok a.button{
        margin-top:5px;
        line-height:30px;
    }
    .pasfoto-right img{
        max-width:80%;
        float:left;
    }
    div.blok{
        overflow:visible;
    }
    div.pasfoto-right{
        top:0px;
        width:100%;
        margin-bottom:0px;
    }
    
}
@media all and (min-width:704px) and (max-width: 900px){
    ul.menu li{
        padding-left:5px;
        padding-right:5px;
        font-size:initial;
    }
    
    #header #nav-menu {
        max-width:729px;
    }
}
@media all and (max-width: 1550px){
    .kassa .producten .cat{
        padding: 0px;
        padding-top: 5px;
        padding-bottom: 5px;
    }
    .kassa .producten .cat h3{
        font-size: 15px!important;
        margin-right: 14px;
        margin-left: 14px;
    }
}
@media all and (max-width: 1330px){
    .kolom_titel_bestelling b, .kolom_waarde_bestelling, ul.kassa table b{
        font-size: 9px!important;
    }
}
@media all and (max-width: 1100px){
    .kassa .producten .cat{
        padding: 0px;
        padding-top: 5px;
        padding-bottom: 5px;
    }
    .kassa .producten .cat h3{
        font-size: 14px!important;
        margin-right: 10px;
        margin-left: 10px;
    }
}
@media all and (max-width: 970px){
    .kassa .producten .cat{
        padding: 0px;
        padding-top: 5px;
        padding-bottom: 5px;
    }
    .kassa .producten .cat h3{
        font-size: 12px!important;
        margin-right: 5px;
        margin-left: 5px;
    }
}