@media only screen and (min-width: 1140px) { /* max */
    .responsive .boxed {
	width: 1130px;
    }
    .responsive .container {
	width: 1030px;
    }
    .responsive .container .one.unit, .responsive .container .one.units {
	width: 40px;
    }
    .responsive .container .two.units {
	width: 130px;
    }
    .responsive .container .three.units {
	width: 220px;
    }
    .responsive .container .four.units {
	width: 310px;
    }
    .responsive .container .five.units {
	width: 400px;
    }
    .responsive .container .six.units {
	width: 490px;
    }
    .responsive .container .seven.units {
	width: 580px;
    }
    .responsive .container .eight.units {
	width: 670px;
    }
    .responsive .container .nine.units {
	width: 760px;
    }
    .responsive .container .ten.units {
	width: 850px;
    }
    .responsive .container .eleven.units {
	width: 940px;
    }
    .responsive .container .twelve.units {
	width: 1030px;
    }
    .responsive .entry-content {
	padding-right: 50px;
    }
}

@media only screen and (min-width: 900px) and (max-width: 1140px) {
    .responsive .container {
	width: 682px;
    }
    .responsive .container .one.unit, .responsive .container .one.units {
	width: 11px;
    }
    .responsive .container .two.units {
	width: 72px;
    }
    .responsive .container .three.units {
	width: 133px;
    }
    .responsive .container .four.units {
	width: 194px;
    }
    .responsive .container .five.units {
	width: 255px;
    }
    .responsive .container .six.units {
	width: 316px;
    }
    .responsive .container .seven.units {
	width: 377px;
    }
    .responsive .container .eight.units {
	width: 438px;
    }
    .responsive .container .nine.units {
	width: 499px;
    }
    .responsive .container .ten.units {
	width: 560px;
    }
    .responsive .container .eleven.units {
	width: 621px;
    }
    .responsive .container .twelve.units {
	width: 682px;
    }
    .responsive .header_menu {
    }
    .responsive .entry-content {
	padding-right: 50px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 899px) {
    .responsive header {
        background-size: auto 44px;
        background-position: left center;
    }
    .responsive .container {
	width: 682px;
    }
    .responsive .container .one.unit, .responsive .container .one.units {
	width: 11px;
    }
    .responsive .container .two.units {
	width: 72px;
    }
    .responsive .container .three.units {
	width: 133px;
    }
    .responsive .container .four.units {
	width: 194px;
    }
    .responsive .container .five.units {
	width: 255px;
    }
    .responsive .container .six.units {
	width: 316px;
    }
    .responsive .container .seven.units {
	width: 377px;
    }
    .responsive .container .eight.units {
	width: 438px;
    }
    .responsive .container .nine.units {
	width: 499px;
    }
    .responsive .container .ten.units {
	   width: 560px;
    }
    .responsive .container .eleven.units {
    	width: 621px;
    }
    .responsive .container .twelve.units {
    	width: 682px;
    }
    .responsive .header_menu {
    	display: none;
    }
    .responsive .entry-content {
    	padding-right: 50px;
    }  
}

@media only screen and (max-width: 767px) {
    .responsive header {
        background-size: auto 44px;
        background-position: center center;
    }
    tbody {
        width: 100%;
        padding: 0;
        overflow: auto;
    }
	table {
		overflow: scroll;
	}
    thead > tr, tbody {
        /*display:block;*/
    }
    .responsive  {
    	overflow-x: hidden;
    }
    .responsive .boxed {
    	width: 318px;
    }
    .responsive .container {
    	margin: 0 auto;
    	width: 268px;
    }
    .responsive .units, .responsive .unit {
    
    }
    .responsive .container .one.unit, .responsive .container .one.units, .responsive .container .two.units, .responsive .container .three.units, .responsive .container .four.units, .responsive .container .five.units, .responsive .container .six.units, .responsive .container .seven.units, .responsive .container .eight.units, .responsive .container .nine.units, .responsive .container .ten.units, .responsive .container .eleven.units, .responsive .container .twelve.units, .responsive  .flex_column {
    	margin: 0 0 20px;
    	width: 100%;
    }
    .responsive .boxed .stretch_full {
	   width: 318px;
    }
    .responsive .offset-by-one, .responsive .offset-by-two, .responsive  .offset-by-three, .responsive  .offset-by-four, .responsive  .offset-by-five, .responsive  .offset-by-six, .responsive  .offset-by-seven, .responsive  .offset-by-eight, .responsive  .offset-by-nine, .responsive  .offset-by-ten, .responsive  .offset-by-eleven {
	   padding-left: 0;
    }
    .responsive .header_menu{
    	display: none;
    	clear: none;
    	z-index: 3;
    }
    
    .responsive .sidebar {
	   border-top: 1px solid;
    }
    
    .responsive .content {
	   border: none;
    }
    
    .responsive .popup {
        width: 100%;
        height: 100%;
        margin: 0;
        left: 0;
        top: 0;
    }
    .responsive .popupcontainer {
        
    }
    
    /* menu */
    
    .responsive .menu{
	    background: var(--primary-bg-color);
	    border: 1px solid var(--primary-border-color);
    }
    
    .responsive .menu, .menu > li, .menu > li > a {
	    height: auto;
    }
    
    .responsive .menu > li > a{
	    padding: 15px 15px;
        background-color: var(--secondary-bg-color);
	    
    }
    
    .responsive .menu > li > a:hover, .menu > li > a:focus {
	    background-color: var(--secondary-bg-color);
	    box-shadow: inset 5px 0px var(--primary-highlight-color);
	    padding: 15px 15px 15px 25px;	
    }
    .responsive .toggle {
        display: block;
    }
    .responsive .toggle:after {
	    content: attr(data-open);
	    display: block;
	    width: 200px;
	    margin: 0;
	    padding: 10px 50px;
	    background: var(--secondary-bg-color);
	    -webkit-border-radius: 2px;
	    border-radius: 2px;
	    text-align: center;
	    font-size: 12px;
	    color: var(--secondary-text-color);
	    -webkit-transition: all 0.5s linear;
	    -moz-transition: all 0.5s linear;
	    -o-transition: all 0.5s linear;
	    transition: all 0.5s linear;
	    -webkit-box-sizing: border-box;
	    -moz-box-sizing: border-box;
	    box-sizing: border-box;
    }
    
    .responsive .toggle:hover:after{
	    background: var(--primary-highlight-color);
    }
    
    .responsive #toggle:checked + .toggle:after{
	    content: "Sluit";
    }
    
    .responsive .menu { display: none; opacity: 0; width: 100%; position: absolute; right: 0; }
	.responsive .menu > li { display: block; width: 100%; margin: 0; }
	.responsive .menu > li > a { display: block; width: 100%; text-decoration: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
	.responsive .toggle { display: block; position: relative; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
	.responsive #toggle:checked ~ .menu { display: block; opacity: 1;}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .responsive {
	   overflow-x: hidden;
    }
    .responsive .boxed {
    	width: 478px;
    }
    .responsive .container {
    	margin: 0 auto;
    	width: 428px;
    }
    .responsive .units, .responsive .unit {
    
    }
    .responsive .container .one.unit, .responsive .container .one.units, .responsive .container .two.units, .responsive .container .three.units, .responsive .container .four.units, .responsive .container .five.units, .responsive .container .six.units, .responsive .container .seven.units, .responsive .container .eight.units, .responsive .container .nine.units, .responsive .container .ten.units, .responsive .container .eleven.units, .responsive .container .twelve.units, .responsive  .flex_column {
    	margin-bottom: 20px;
    	margin-left: 0;
    	width: 100%;
    }
    .responsive .boxed .stretch_full {
	   width: 478px;
    }
}

@media only screen and (max-width: 479px){
    .responsive input[type=text], .responsive input[type=password] { 
        clear: both;
        width: 100%;
    }
    .responsive header > h1 { 
    	text-align: center;
    }
    .responsive header > h1, .nav, .toggle:after{ 
	   float: none; 
    }
    .responsive .toggle:after { 
	   text-align: center; width: 100%; 
    }

    .responsive .toggle {
	   margin: 0;
    }   
}