/*
	Copyright :: www.jwsdesign.nl - 2022
	
*/


/* Base ________________________________________________________________________ Base*/

* {
	margin: 0;
	padding: 0;
 	font-family: "exo_2regular",Arial, Verdana, sans-serif;
	outline: none;
}

html, body {
	margin: 0px;
	height: 100%;
}

body {
	font-size:12px;
	line-height:15px;
	/* background:url(../images/bg_filler1.png); */
	/* background-color: #498A1A; */
	background-color: #EDEDED;
	background-repeat: repeat-x;
	text-align: center;
}

.jws_no_padding{
	padding: 0px;
}

.jws_div_border_left_right{
	border-left: 1px solid black;
	border-right: 1px solid black;
}

a {
	color: inherit;
}

a:hover {
	color: inherit;
}




#login_main_container {
	padding-top:0px;
	width:100%;
	height: 100%;
	text-align:left;
	margin-bottom: 0;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-left: auto;
	margin-right: auto;	
	background-color: silver;
	
	background:url("../img_layout/loginslider2.png");
	background-repeat: no-repeat;
	background-size: cover;
}




#m_login_container {
	display: block;
	padding: 25px;
	box-sizing: border-box;
	text-align: center;
	background-color: #ffffff96;
	max-width: 600px;
	margin: auto;
}

#m_login_container .m_login_logo {
    width: 60%;
	max-width: 360px;
	text-align: center;
}

#m_login_container .form a {
	text-decoration: none;
	color: white;
}

#m_login_container .form p{
	font-size: 28px;
	font-weight: bold;
	line-height: 32px;
	color: #212d55;
	margin: 20px 0px 40px 0px;
}


#m_login_container .form input[type=text],input[type=password] {
  outline: 0;
  background: #F4F4F4;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 15px;
  min-height: 50px;
  box-sizing: border-box;
  font-size: 16px;
  border-radius: 25px;
}
#m_login_container .form button {
  outline: 0;
  background: #212D55;
  float: right;
  border: 0;
  padding: 0px 25px;
  color: #FFFFFF;
  font-size: 16px;
  min-height: 50px;
  line-height: 50px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
  border-radius: 25px;
  -webkit-box-shadow: 5px 5px 15px #eeeeee;
  -box-shadow: 5px 5px 15px #eeeeee;
}

	.form_login_remember {
		display: block;
		width: 100%;
		text-align: left;
		line-height: 40px;
		font-size: 16px;
	}


	
	
	
	
#header1 {
    flex: 0 1 auto;
	display: block;
	height: 100px;
	width: 100%;
	background-color:#212D55; 
	border-bottom: 2px solid #FFF;	
}

#header_logo img{
	height: 80px;
	padding: 10px;
	float: left;
}

#header_home_btn {
	display: block;
	position: absolute;
	right: 10px;
	top: 10px;
}

#header_home_btn img{
	height: 70px;
}

#header_scan_btn {
	display: block;
	position: absolute;
	right: 90px;
	top: 10px;
}

#header_scan_btn img{
	height: 70px;
}

#header_scan_btn2 {
	display: block;
	position: absolute;
	right: 170px;
	top: 10px;
}

#header_scan_btn2 img{
	height: 70px;
}


.button_home {	float: right;	margin: 5px 10px; }
.button_back {	float: left;	margin: 5px 10px; }

#header_small {
    flex: 0 1 auto;
	display: block;
	height: 80px;
	width: 100%;
	/*background-color:#7892c2; */
	border-bottom: 1px solid black;	
    background: black; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#CCCCCC, #FFFFFF); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#CCCCCC, #FFFFFF); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#CCCCCC, #FFFFFF); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#CCCCCC, #FFFFFF); /* Standard syntax */
}

#header_back_btn {
	display: block;
	position: absolute;
	right: 5px;
	top: 5px;
}

#header_back_btn  .fa{
	font-size: 72px;
	color: #000;
}

#header_info_tekst {
	display: block;
	height: 36px;
	width: 80%;
	overflow: hidden;
	font-size: 28px;
	line-height: 36px;
	margin: 5px 0px 0px 5px;
}

#header_info_totalen_order {
	display: block;
	height: 30px;
	width: 75%;
	overflow: hidden;
	font-size: 24px;
	line-height: 30px;
	margin: 5px 0px 0px 5px;
}
	#header_fust_aantal {
	margin: 0px 25px 0px 5px;
	}

	#header_totaal_bedrag {
	margin: 0px 0px 0px 5px;
	}
	
#content_scroller {
	position: absolute; 
	top: 100px; 
	bottom: 50px; 
	left: 0; 
	right: 0;
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
}

#content_scroller1 {
	position: absolute; 
	top: 150; 
	bottom: 50; 
	left: 0; 
	right: 0;
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
}


#content_scroller2 {
  display: flex;
  flex-flow: column;
  height: 100%;
}

#content_scroller2-1 {
  flex: 0 1 auto;
}

#content_scroller2-2 {
  flex: 1 1 auto;
  overflow-y: scroll;
  padding-bottom: 20px;
}


#footer {
    position: fixed;
    bottom: 0;
    width: 100%;
	height: 50px;
    background: #212D55; /* For browsers that do not support gradients */
	border-top: 2px solid #FFF;	
	color: #FFFFFF;
	font-size: 20px;
	line-height: 48px;
}

#footer i {
	font-size: 36px;
	float: right;
	margin-right: 10px;
	line-height: 48px;
}

#search_tekst {
	width: 100%;
	height: 50px;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 2px;
	box-sizing: border-box;
}

#search_tekst_kweker {
	width: 100%;
	height: 50px;
	font-size: 16px;
	font-weight: bold;
	box-sizing: border-box;
}



#zoeken {
	height: 60px;
	font-size: 20px;
	font-weight: bold;
	float: left;	
	color: black;
}

#zoeken_reset {
	height: 60px;
	float: left;
	font-size: 20px;
	color: black;
	width: auto;
	margin-left: 2px;
}

#order_select_tabs {
    position: fixed;
    bottom: 0;
    width: 100%;
	height: 60px;

}


#order_select_tabs span{
	display: block;
	height: 62px;
	width: 19%;
	background-color: grey;
	color: white;
	float: left;
	line-height: 58px;
	border: 2px solid black;
	text-align: center;
	overflow: hidden;
	font-size: 28px;
}

#order_select_tabs span.selected{
	background-color: green;
}

.default_table {
	font-size: 16px;
}

	.kweker_detail td{
	text-align: left;
	line-height: 24px;
	}

	.kweker_detail input,select{
	margin-bottom: 5px;
	}
	
	
	.kweker_detail i {
		font-size: 32px;
		vertical-align: middle;
		margin-left: 5px;
	}
	
	.kweker_detail i.fa-mobile {
		font-size: 38px;
		margin-left: 10px;
	}

.default_table_header {
	font-weight: bold;
	background-color: #999999;
	height: 40px;
}

.default_table_detail td {
	height: 50px;
	vertical-align: top;
	border-bottom: 1px solid #CCCCCC;
	border-top: 1px solid #FFFFFF;
	padding-bottom: 10px;
	vertical-align: middle;
}

.default_table_detail tr {
	padding-bottom: 40px;
}


.default_table_detail2 td {
	height: 24px;
	vertical-align: top;
	border-bottom: 1px solid #CCCCCC;
	border-top: 1px solid #FFFFFF;
	padding-bottom: 10px;
	vertical-align: middle;
}



.default_table_totalline tr{
	height: 40px;
}

.default_table_totalline td{
	border-top: 2px solid black;
	border-bottom: 2px solid black;
	padding: 5px;
	font-weight: bold;
}

.row_not_active td{
	color: #999999;
}

.table_orders_edit_header {
	margin: 5px;
	font-size: 20px;
}
	.table_orders_edit_header tr{
	height: 50px;
	
	}

	.table_orders_edit_header input,
	.table_orders_edit_header select,
	.table_orders_edit_header textarea{
	font-size: 24px;
	}
	.table_orders_edit_header input,
	.table_orders_edit_header select{
	height: 40px;
	}
	
	.table_orders_edit_header select{
	width: inherit;
	padding: 0px 3px;
	}
	
.total_tekst #Zoeken_reset {
	height: 50px;
}

.total_tekst #artikelen_beschikbaar_foto {
	display: block;
    float: left;
    width: 46%;
    font-size: 18px;
    line-height: 24px;
    padding: 5px;
}

#scan_result2 {
	margin: 15px;
}

#scan_result2 h2,h3 {
	margin-bottom: 10px;
}

#scan_result2 h2 {
	font-size: 24px;
	line-height: 28px;
}

#scan_result2 h3 {
	font-size: 16px;
	line-height: 20px;
}
#scan_result2 hr {
	color: black;
	border: 1px solid #cccccc;
}
	
.artikel_nieuw_edit input[name=Omschrijving_NL]{ width: 100%; }	
.artikel_nieuw_edit input[name=Omschrijving2_NL]{ width: 100%; }	
.artikel_nieuw_edit input[name=Kweker_artnr]{ width: 100%; }	
.artikel_nieuw_edit input[name=Kweker_ean]{ width: 100%; }	
.artikel_nieuw_edit input[name=Aantal_pbak],
.artikel_nieuw_edit input[name=Aantal_bak_laag],
.artikel_nieuw_edit input[name=Aantal_bak_cc] { width: 100%; }	
.artikel_nieuw_edit input[name=Inkoop_prijs] {width: 120px; }
.artikel_nieuw_edit input[name=Code] {width: 100px; float: right; }

.kweker_detail input[name=Reservering_aantal] {width: 50px;  }
.kweker_detail select[name=Reservering_type] {float: right;  }

	
.kweker_list i {
	font-size: 24px;
}

.kweker_list a{
	color: black;
}
	.nieuw_artikel_reserv_aantal {
		float: right;
	}
	.nieuw_artikel_reserv_aantal input {
		width: 50px;
	}
	
.btn_artikel_new_opslaan,
.btn_artikel_new_delete {
	float: left;
	height: 50px;
	line-height: 50px;
	padding: 0px 20px;
	margin-right: 10px;
	border: 1px solid #555;
	font-size: 15px;
	background: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
   -webkit-appearance: button;
   -webkit-box-shadow: 1px 1px 1px #fff;
   -webkit-border-radius: 0.0em;
}

	.btn_artikel_new_delete i{
	font-size: 24px;
	margin: 0px;
	}

	
#image_block {
	display: block;
	width: 33%;
	float: left;
	margin-bottom: 15px;

}
#image_block img{
	width: 95%;
	
}
#image_block i { font-size: 32px; display: block; width: 50%; margin-top: 10px;}
#image_block .fa{	float: left; text-align: center;	}
	


#image_block_detail {
	display: block;
	width: 100%;
	float: left;
	text-align: center;
	
}
#image_block_detail img{
	width: 95%;
	
}

#image_block_detail i { font-size: 32px; display: block; width: 50%; margin-top: 10px;}
#image_block_detail .fa{	float: left; text-align: center;}



#frm_invoice_edit input[name=Factuurnr]{ width: 200px; }	
#frm_invoice_edit input[name=Date]{ width: 200px; }	
#frm_invoice_edit input[name=Email_factuur]{ width: 100%; }	
#frm_invoice_edit input[name=Korting]{ width: 100px; }	


#image_block {
	display: block;
	text-align: center;
}

#image_block table{
	font-size: 18px;
	margin-top: 5px;
}

#image_block table h1{
	margin: 5px;
}



#scan_container {
	display: block;
	width: 95%;
	margin-left: auto;
    margin-right: auto;
}

#frm_order_scan {
	margin: 0px;
}

.frm_order_scan {
	margin: 3px 0px 0px 0px;
}

#barcode_scan {
	width: 100%;
	height: 60px;
	font-size: 36px;
	max-width: 240px;
}

#scan_container span{
	display: block;
	font-size: 18px;
	margin: 0px 0px 10px 0px;
}


#popup_orderdetail_hist {
	display: block;
	height: 200;
	background-color: ;
	overflow: scroll;
	overflow-x: hidden;
	scrollbar-width: thin; 
	-webkit-overflow-scrolling: touch;
}

#popup_insert_orderdetail {
	text-align: center;
	font-size: 24px;
	padding: 10px;
	line-height: 72px;
}

#popup_insert_orderdetail h1 {
	line-height: 36px;
	font-size: 28px;
	font-weight: normal;
	margin: 0px;
}

#popup_insert_orderdetail h1.niet_leverbaar{
	color: red;
}

#popup_insert_orderdetail input{
	height: 80px;
	font-size: 36px;
	text-align: right;
	
}
#popup_insert_orderdetail input[name=Aantal]{ width: 100px; float: right;  margin-top: 20px;}	
#popup_insert_orderdetail input[name=Aantal_pbak]{ width: 100px; float: left; margin-top: 20px;}	
#popup_insert_orderdetail input[name=Aantal_verpakking]{ width: 100px; }	
#popup_insert_orderdetail input[name=Prijs]{ width: 200px;  margin-top: 15px; font-size: 60px; height: 100px; padding: 5px;}		
#popup_insert_orderdetail input[name=Opmerkingen]{ width: 200px; }	
#popup_insert_orderdetail input[type=submit]{ text-align: center; padding: 10px; height: 80px; width: 90%; margin-top: 0px; margin-bottom: 5px;}
#popup_insert_orderdetail textarea[name=Artikelomschrijving]{ width: 100%; height: 100px; font-size: 32px; }	

#popup_insert_orderdetail .artikel_omschrijving {
	display: block;
	height: 100px;
	overflow: hidden;
}

#popup_insert_orderdetail .artikel_omschrijving_extra {
	display: block;
	height: 50px;
	border: 1px solid black;
	line-height: 48px;
	margin-bottom: 5px;
	
}

#popup_insert_orderdetail .artikel_omschrijving_extra img{
	height: 26px;
}

#popup_insert_orderdetail #artikelinfo_potmaat,
#popup_insert_orderdetail #artikelinfo_hoogte,
#popup_insert_orderdetail #artikelinfo_artnr,
#popup_insert_orderdetail #artikelinfo_ink{
	display: block;
	width: 25%;
	float: left;
	text-align: left;
	font-size: 24px;
	padding: 3px;
  	box-sizing: border-box;
}

#popup_insert_orderdetail #artikelinfo_artnr {
	font-weight: bold;
}

#popup_insert_orderdetail #artikelinfo_ink{
	text-align: right;
		display: none;
}

#popup_insert_orderdetail .regel_aantallen1 {
	width: 45%;
	height: 140px;
	float: left;
}
#popup_insert_orderdetail .regel_aantallen2 {
	width: 10%;
	height: 140px;
	float: left;
	font-size: 48px;
	line-height: 124px;
}
#popup_insert_orderdetail .regel_aantallen3 {
	width: 45%;
	height: 140px;
	float: right;
}

#popup_insert_orderdetail .regel_prijs1 {
	width: 20%;
	height: 150px;
	float: left;
}

#popup_insert_orderdetail .regel_prijs2 {
	width: 59%;
	height: 150px;
	float: left;
}


#popup_insert_orderdetail .regel_prijs3 {
	width: 20%;
	height: 150px;
	float: left;
}

#popup_insert_orderdetail .artikel_prijs_info_klant{
	display: block;
	width: 100%;
	height: 40px;
	border: 1px solid black;
	overflow: hidden;
}

#popup_insert_orderdetail .artikel_prijs_info_klant span{
	line-height: 36px;
}

.plusmin_btn {
	display: inline-block;
	width: 60px;
	height: 60px;
	border: 1px solid #000000;
	line-height: 60px;
	margin: 0px 10px;
}

.plusmin_btn_aantal {
	float: left;
	margin: 0px 0px 10px 0px;
}

.plusmin_btn_aantal_pbak {
	float: right;
	margin: 0px 0px 10px 0px;
}

.plusmin_btn_prijs_min {
	margin: 0px 0px 10px 0px;
	float: left;
}

.plusmin_btn_prijs_plus {
	margin: 0px 0px 10px 0px;
	float: right;
}


.kopen_btn {
	dipslay: block;
	width: 100%;
}

#inkoopprijs_show_hide {
	display: none;
}



#Order_opmerkingen_block {
	display: none;
	background-color: #FFFFFF;
	height: 115px;
	border-bottom: 1px solid black;
	margin-bottom: -1px;
}

#Order_opmerkingen_block #Opmerkingen_voorklant {
	width: 100%;
}

#Order_opmerkingen_button {
	position: relative;
	display: block;
	float: right;
	height: 32px;
	line-height: 32px;
	width: 160px;
	border-bottom: 1px solid black;
	border-left: 1px solid black;
	border-right: 1px solid black;
	margin: 0px 10px 0px 0px;
	text-align: center;
	background-color: #FFFFFF;
	font-size: 16px;
	margin-bottom: -32px;
	border-bottom-left-radius: 6px;	
	border-bottom-right-radius: 6px;	
	-moz-box-shadow: 0px 10px 14px -7px #999999;
	-webkit-box-shadow: 0px 10px 14px -7px #999999;
}

#Order_opmerkingen_button i {
	margin-right: 5px;
	font-size: 20px;
}

#beschikbaarheids_weeknrs {
	padding: 5px;
}	

.beschikbaarheids_weeknr_active {
	background-color: #2E643E;
	color: white;
}


#beschikbaarheids_weeknrs span{
	display: block;
	width: 46px;
	height: 46px;
	border: 1px solid black;
	float: left;
	line-height: 46px;
	text-align: center;
	font-size: 18px;
	box-sizing: border-box;
}

#beschikbaarheids_weeknrs .current_week{
	border: 4px solid red;
	line-height: 40px;
	font-weight: bold;
}



.Button1 {
	-moz-box-shadow: 0px 10px 14px -7px #333333;
	-webkit-box-shadow: 0px 10px 14px -7px #333333;
	box-shadow: 0px 10px 14px -7px #333333;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.50, #2E643E), color-stop(1, #1e452a));
	background:-moz-linear-gradient(top, #2E643E 50%, #1e452a 100%);
	background:-webkit-linear-gradient(top, #2E643E 50%, #1e452a 100%);
	background:-o-linear-gradient(top, #2E643E 50%, #1e452a 100%);
	background:-ms-linear-gradient(top, #2E643E 50%, #1e452a 100%);
	background:linear-gradient(to bottom, #2E643E 50%, #1e452a 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2E643E', endColorstr='#1e452a',GradientType=0);
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Helvetica;
	font-size:24px;
	font-weight:bold;
	padding:36px 0px;
	text-decoration:none;
	text-shadow:0px 1px 0px #283966;
	width: 100%;
	text-align: center;
}
.Button1:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.50, #2E643E), color-stop(1, #1e452a));
	background:-moz-linear-gradient(top, #2E643E 80%, #1e452a 100%);
	background:-webkit-linear-gradient(top, #2E643E 80%, #1e452a 100%);
	background:-o-linear-gradient(top, #2E643E 80%, #1e452a 100%);
	background:-ms-linear-gradient(top, #2E643E 80%, #1e452a 100%);
	background:linear-gradient(to bottom, #2E643E 80%, #1e452a 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2E643E', endColorstr='#1e452a',GradientType=0);
	color: #FFFFFF;
}
.Button1:active {
	position:relative;
	top:1px;
}


.Button2 {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #7892c2), color-stop(1, #212D55));
	background:-moz-linear-gradient(top, #7892c2 5%, #212D55 100%);
	background:-webkit-linear-gradient(top, #7892c2 5%, #212D55 100%);
	background:-o-linear-gradient(top, #7892c2 5%, #212D55 100%);
	background:-ms-linear-gradient(top, #7892c2 5%, #212D55 100%);
	background:linear-gradient(to bottom, #7892c2 5%, #212D55 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7892c2', endColorstr='#212D55',GradientType=0);
	background-color:#7892c2;
	border:1px solid #4e6096;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Helvetica;
	font-size:20px;
	padding: 12px;
	text-decoration:none;
	text-shadow:0px 1px 0px #283966;
	text-align: center;
	margin: 0px 5px;
}
.Button2:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #212D55), color-stop(1, #7892c2));
	background:-moz-linear-gradient(top, #212D55 5%, #7892c2 100%);
	background:-webkit-linear-gradient(top, #212D55 5%, #7892c2 100%);
	background:-o-linear-gradient(top, #212D55 5%, #7892c2 100%);
	background:-ms-linear-gradient(top, #212D55 5%, #7892c2 100%);
	background:linear-gradient(to bottom, #212D55 5%, #7892c2 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#212D55', endColorstr='#7892c2',GradientType=0);
	background-color:#212D55;
}
.Button2:active {
	position:relative;
	top:1px;
}

.Button2_small {
	padding: 0px 30px;
}


.button2_green {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #11b161), color-stop(1, #3c5d3c));
	background:-moz-linear-gradient(top, #11b161 5%, #3c5d3c 100%);
	background:-webkit-linear-gradient(top, #11b161 5%, #3c5d3c 100%);
	background:-o-linear-gradient(top, #11b161 5%, #3c5d3c 100%);
	background:-ms-linear-gradient(top, #11b161 5%, #3c5d3c 100%);
	background:linear-gradient(to bottom, #11b161 5%, #3c5d3c 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#11b161', endColorstr='#3c5d3c',GradientType=0);
	background-color:#11b161;
	border:1px solid #4e6096;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Helvetica;
	font-size:20px;
	padding: 12px;
	text-decoration:none;
	text-shadow:0px 1px 0px #283966;
	text-align: center;
	margin: 0px 5px;
}

.button2_red {
	-moz-box-shadow: 0px 10px 14px -7px #9fb4f2;
	-webkit-box-shadow: 0px 10px 14px -7px #9fb4f2;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #CC0000), color-stop(1, #FF0000));
	background:-moz-linear-gradient(top, #CC0000 5%, #FF0000 100%);
	background:-webkit-linear-gradient(top, #CC0000 5%, #FF0000 100%);
	background:-o-linear-gradient(top, #CC0000 5%, #FF0000 100%);
	background:-ms-linear-gradient(top, #CC0000 5%, #FF0000 100%);
	background:linear-gradient(to bottom, #CC0000 5%, #FF0000 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#CC0000', endColorstr='#FF0000',GradientType=0);
	background-color:#11b161;
	border:1px solid #4e6096;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Helvetica;
	font-size:20px;
	padding: 12px;
	text-decoration:none;
	text-shadow:0px 1px 0px #283966;
	text-align: center;
	margin: 0px 5px;
}



.Button3 {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #7892c2), color-stop(1, #212D55));
	background:-moz-linear-gradient(top, #7892c2 5%, #212D55 100%);
	background:-webkit-linear-gradient(top, #7892c2 5%, #212D55 100%);
	background:-o-linear-gradient(top, #7892c2 5%, #212D55 100%);
	background:-ms-linear-gradient(top, #7892c2 5%, #212D55 100%);
	background:linear-gradient(to bottom, #7892c2 5%, #212D55 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7892c2', endColorstr='#212D55',GradientType=0);
	background-color:#7892c2;
	border:1px solid #4e6096;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Helvetica;
	font-size:24px;
	padding: 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #283966;
	text-align: center;
	margin: 10px 10px;
}
.Button3:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #212D55), color-stop(1, #7892c2));
	background:-moz-linear-gradient(top, #212D55 5%, #7892c2 100%);
	background:-webkit-linear-gradient(top, #212D55 5%, #7892c2 100%);
	background:-o-linear-gradient(top, #212D55 5%, #7892c2 100%);
	background:-ms-linear-gradient(top, #212D55 5%, #7892c2 100%);
	background:linear-gradient(to bottom, #212D55 5%, #7892c2 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#212D55', endColorstr='#7892c2',GradientType=0);
	background-color:#212D55;
}
.Button3:active {
	position:relative;
	top:1px;
}





.button_zoek_artikel {
	height: 36px;
	width: 40px;
	line-height: 36px;
	font-size: 36px;
}


/* Select2 ________________________________________________________________________ Base*/
.select2 {
	margin-bottom: 5px !important;
}

.select2-selection {
	border-radius: 0px !important;
}


input, textarea, select {
   -webkit-appearance: none;
}
 
 input, textarea, select {
   border: 1px solid #555;
   padding: 0.5em;
   font-size: 15px;
   line-height: 1.2em;
   width: 80%;
   background: #fff;
   background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
   -webkit-appearance: none;
   -webkit-box-shadow: 1px 1px 1px #fff;
   -webkit-border-radius: 0.0em;
 }
 
   input[type=submit] {
	height: 50px;
    line-height: 14px;
	margin-bottom: 2px;
 }
 
 input[type=checkbox],
 input[type=radio] {
   display: inline-block;
   font-size: 15px;
   line-height: 1em;
   margin: 0 0.25em 0 0;
   padding: 0;
   width: 1.25em;
   height: 1.25em;
   -webkit-border-radius: 0.25em;
   vertical-align: text-top;
 }

 input[type=radio] {
    -webkit-border-radius: 2em; /* Make radios round */
  }
  
  input[type=checkbox]:checked {
     background: url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%008%00%00%008%08%02%00%00%00'%E4%ACI%00%00%00%19tEXtSoftware%00Adobe%20ImageReadyq%C9e%3C%00%00%04DIDATx%DA%EC%98%B9J%2CA%14%86%EF%F4%AC%8E%5B%24%F8%00%93%BA%83%89%89%A1%22n%A1%81%89%B8%22%82%2B%06%A2%E2%82%B8%20%1A%A9(%B8%BC%87%8F%E0%12%09%3E%82K%AA%20%EAu%EEo%FFw%0EEuO%2F3%A3%5C%2F%FD%07E%F5Lu%F7%D7%FF9u%BA%BA%22%A9T%EA%D7O%90%F1%EB%87(%00%0D%40%03%D0%004%00%0D%40%03%D0%FF%1B4%F2%3D%B7I%A7%D3%B6%BF%87B%A1%7F%05T%105V%22%F2G%2F%B8%91oC%D4%40qH%3E%B4%D2w%CA%D1%D0%D7H%F3%89%94%86aloo%0F%0C%0C%D8%BA%EB%7C%C1H8%1C%FE%22%2F%D3%19%FD%B5%C40677%BB%BB%BB%D1%8F%C5b%7B%7B%7B%B6%8F%975%F4%BE%40%ADs%C2zu%8D%F2%E3%E3%03-%EE%B2%B1%B1AJhjj%0A'%EE%EF%EF%A3%C5%03xa%8D%409%F09g%95%20B%18%06%CA%F5%F5u%A1%A4%26''qk%F8%8A%7FU%DC%AC%A0%D1h%D4c%1C%1D%1C%95%1Bp%00%11y%08%8E%B5%B5%B5%AE%AE.%EB%95%9B%9A%9A%8E%8F%8F1Re%CD%11T%8B%23%95L%26%CB%CA%CA%EE%EE%EE%D4y%23%E5F%CCF%07%9E%AD%AC%ACtvvZ%AF%7Cyy944%04J%8C%01%A8%9A%00%F6%A0%C8kWJ%E6%19%DBD%22%B1%BB%BB%5BYY988x%7F%7FouB%BCD%BB%B4%B4%D4%D1%D1a%BD%F2%C5%C5%C5%F0%F0%F0%EB%EB%2Bl%22(Mu%02upT%9D%10%BC%7D%3C%1E%DF%D9%D9%A9%A9%A9A%FF%F0%F0%10%96%3C%3C%3C%A8%09%A0V%C7%E5%E5%E5%F6%F6v%5BJ%3C%E4%DB%DB%1B))W%D0P%5B%5B%9B%83%9DD%FCm%0A%DEommUWW%CB%18D%1F%C6%3C%3E%3E%8A%A98%0B%23%D1.%2C%2C%B4%B6%B6%3AP%C6LEM1%F4%CE%F3)%A4MF%DB%99%FB%FE%FE%8E_%40YUU%A5%0DSY%25%EE%F3%F3%F3---%0E%94%88%8C%80%D2Q%D7%1C5bn%E2%85%00%7D%7D%7Dm%3D%1F%C9zppPQQA%D7%F1%0B%BC%CCF%89T%C1%18d9%40%13%A6%E2%A6x%23%B5oU%B8%BE%BE%3E%9CEj8%00zuu%05%C3jkk5%82%92%92%92%E6%E6%E6%F3%F3%F3%A7%A7%A7%C5%C5E%5BJ%CC%F1%91%91%11P%0A%A2J%C9%04%90d%B5U%04C%B3%85%9Eqg%9A%F3%F0%EC%EC%0Cm__%9F%D5%D7%A3%A3%A3%DB%DB%5B%10%5B%2F%85'%1C%1D%1De%5DSm%23%9Cj%87S%1D%CDV%9E%98%A3%F0%80%C9%C7%FC%C3%E1%E9%E9)%3A%FD%FD%FDVV%C8%96rll%0C%97*..%8Eg%24%94%5E*%A8%0FP%89%3E%7D%3D99A%07%8B%20%D7w%2F%D2z%7C%7C%9C%94%92%9A%DAd%F7B%F9%09%EA%10zb%81U%EA%9C%FC%05_%D1qf%05%E5%C4%C4%04%93X%CDK%A1t%AD%9D%3E%0A%3EA%ADi%84%16%ACh%AD9%40%DD%DC%DC%90%12yYd%8A%94%B4%D3%2F%A5K%E8%A5%E0%AB%F3%D1%C8%88%AC%A8%FF%8D%8D%8D%DA%B9%CF%CF%CF%B3%B3%B3%18%03%3E%82%D2N%EB%04%F2%FE%D9%94%D5Qu9%C2%9A%2F%AC2%09%A0%E9%E9i%BCT%1B%1A%1AT%CA%9E%9E%9E%97%97%17D%5C%B33gJ%F7%D0%0B%2B%86%91U%2Bu8%9C%99%99%C1%07F%5D%5D%1D)%7B%7B%7B%B1%DA(--M%9AR%83.1%F1K%E9%BEpVYU8%E2%A2%C5%03%80%60nn%0EK%E3T*%85%E9%85%E7%C1%22%B0(%23%A1T%8B%91_JO%9F%22%C2%AA%BD%B1%84%18%10x%7D%AF%AE%AE%82%09%C3%CA%CB%CB%B5%D7%8FV%8Cr%A0%F4%FA%CD%24%AC%E4c%2B%8E%22%D0p%91%8B%26%D4K%B1Y%DE%40%EA%8A37%CAOP%2F%A7%C9BS-Ob*PdE%A2%FEH%E2%82P%FA%D8%80%10Vy%A3%0A%2Bhh'%07%A8%95A%94'%A5%BF%9D%12%8D%95%1D%88%B5V6g%C8*%E5%B6%20%94%BE%B7tlY%85R%C6%C8%87T%3E%B3'%DF%BD'%8D%953L%FD%92%B6%EE%EA%E4O%99%E3%26%99%F6%11%E7%BC%7DR%10%CA%DCw%F3%D4%95%94-J%A1%F8%0A%B6%EDXp%A0%60%0F%3F%00%0D%40%03%D0%00%F4k%F4G%80%01%00%E2%BB%B3%8D%BD%BE%0E%DE%00%00%00%00IEND%AEB%60%82") no-repeat center center;
     -webkit-background-size: 28px 28px; }

	 
/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2E643E;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2E643E;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}	 

/*  JWS Facnybox  ________________________________________________________________________________ */
#fancyboxContainer {
  position: fixed;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  overflow-x: hidden;
  overflow-y: hidden;
  transition: width 0.5s ease-in-out;
  z-index: 100;
}

#fancyboxContent {
  width: 80%; /* Pas de breedte van de fancybox aan zoals gewenst */
  height: 100%;
  max-width: 320px;
  margin-right: 0;
  margin-top: 0px; /* Verticale uitlijning aanpassen zoals gewenst */
  background-color: #fff;
  padding: 20px;
  float: right;
}

	#fancyboxContent h2 {
	border-bottom: 1px solid #aaaaaa;
	display: flow-root;
	}
#fancyboxContainer.open {
  width: 100%;
}

#fancyboxContent.close {
  margin-right: -100%; /* Schuif de inhoud van de fancybox uit het zicht */
}

#iframefancyboxContent {
	height: calc(100% - 70px);
	width: 100%;
}
	#fancyboxContent i{
		float: right;
		font-size: 36px;
	}
	
	
	
#fancyboxContainer1 {
  position: fixed;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  overflow-x: hidden;
  overflow-y: hidden;
  transition: width 0.5s ease-in-out;
  z-index: 100;
}

#fancyboxContent1 {
  width: 80%; /* Pas de breedte van de fancybox aan zoals gewenst */
  height: 100%;
  max-width: 320px;
  margin-right: 0;
  margin-top: 0px; /* Verticale uitlijning aanpassen zoals gewenst */
  background-color: #fff;
  padding: 20px;
  float: right;
}

	#fancyboxContent1 h2 {
	border-bottom: 1px solid #aaaaaa;
	display: flow-root;
	}
#fancyboxContainer1.open {
  width: 100%;
}

#fancyboxContent1.close {
  margin-right: -100%; /* Schuif de inhoud van de fancybox uit het zicht */
}

#iframefancyboxContent1 {
	height: calc(100% - 70px);
	width: 100%;
}
	#fancyboxContent1 i{
		float: right;
		font-size: 36px;
	}
	
#fancyboxContainer2 {
  position: fixed;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  overflow-x: hidden;
  overflow-y: hidden;
  transition: width 0.5s ease-in-out;
  z-index: 200;
}

#fancyboxContent2 {
  width: 75%; /* Pas de breedte van de fancybox aan zoals gewenst */
  height: 100%;
  max-width: 320px;
  margin-right: 0;
  margin-top: 0px; /* Verticale uitlijning aanpassen zoals gewenst */
  background-color: #fff;
  padding: 20px;
  float: right;
}

	#fancyboxContent2 h2 {
	border-bottom: 1px solid #aaaaaa;
	display: flow-root;
	}
#fancyboxContainer2.open {
  width: 100%;
}

#fancyboxContent2.close {
  margin-right: -100%; /* Schuif de inhoud van de fancybox uit het zicht */
}

#iframefancyboxContent2 {
	height: calc(100% - 70px);
	width: 100%;
}
	#fancyboxContent2 i{
		float: right;
		font-size: 36px;
	}
	
	
/* QRCode scanner _____________________________________________________________   */

#qrscanner_frame_overlay {
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	justify-content: right;
	z-index: 9999;
}

#qrscanner_frame_content {
	background: #FFF;
	max-width: 800px;
	max-height: 800px;
	width: 90%;
	height: 90%;
	overflow: none;
	margin: 20px auto;	
	border-radius: 20px;
}

	#reader {
		padding: 20px;
		width: 90%;
		height: calc(90% - 60px);
		margin: 15px auto; 
		margin-top: 60px;
	}

	#html5-qrcode-button-camera-start {
	width: 90%;
    display: flex;
    align-items: center;
    /* float: right; */
    height: 40px;
    border-radius: 20px;
    min-width: 80px;
    font-size: 16px;
    background-color: #2E643E;
    color: white;
    padding: 15px 25px 15px 25px;
    box-sizing: border-box;
    cursor: pointer;
    margin-top: 15px;
	}

	#html5-qrcode-button-camera-stop {
	width: 90%;
    display: flex;
    align-items: center;
    /* float: right; */
    height: 40px;
    border-radius: 20px;
    min-width: 80px;
    font-size: 16px;
    background-color: #212d55;
    color: white;
    padding: 15px 25px 15px 25px;
    box-sizing: border-box;
    cursor: pointer;
    margin-top: 15px;
	
	}
	

		
        /* Verberg de camera select dropdown */
		#html5-qrcode-select-camera {
		width: 90% !important;
		height: 28px !important;
		}

.popup_close_button {
		font-size: 20px;
		line-height: 40px;
		text-align: center;
		color: #000;
		width: 40px;
		height: 40px;
		border-radius: 25px;
		border: 1px solid #707070;
		cursor: pointer;
		float: right;
}

	
/*  Switches  ________________________________________________________________________________ */
  @supports (-webkit-appearance: none) or (-moz-appearance: none) {
    .checkbox-wrapper-14 input[type=checkbox] {
      --active: #2e643e;
      --active-inner: #fff;
      --focus: 2px rgba(39, 94, 254, .3);
      --border: #BBC1E1;
      --border-hover: #2e643e;
      --background: #fff;
      --disabled: #F6F8FF;
      --disabled-inner: #E1E6F9;
      -webkit-appearance: none;
      -moz-appearance: none;
      height: 21px;
      outline: none;
      display: inline-block;
      vertical-align: top;
      position: relative;
      margin: 0;
      cursor: pointer;
      border: 1px solid var(--bc, var(--border));
      background: var(--b, var(--background));
      transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;
	  box-sizing: unset;
	  padding: unset;
    }
    .checkbox-wrapper-14 input[type=checkbox]:after {
      content: "";
      display: block;
      left: 0;
      top: 0;
      position: absolute;
      transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
    }
    .checkbox-wrapper-14 input[type=checkbox]:checked {
      --b: var(--active);
      --bc: var(--active);
      --d-o: .3s;
      --d-t: .6s;
      --d-t-e: cubic-bezier(.2, .85, .32, 1.2);
    }
    .checkbox-wrapper-14 input[type=checkbox]:disabled {
      --b: var(--disabled);
      cursor: not-allowed;
      opacity: 0.9;
    }
    .checkbox-wrapper-14 input[type=checkbox]:disabled:checked {
      --b: var(--disabled-inner);
      --bc: var(--border);
    }
    .checkbox-wrapper-14 input[type=checkbox]:disabled + label {
      cursor: not-allowed;
    }
    .checkbox-wrapper-14 input[type=checkbox]:hover:not(:checked):not(:disabled) {
      --bc: var(--border-hover);
    }
    .checkbox-wrapper-14 input[type=checkbox]:focus {
      box-shadow: 0 0 0 var(--focus);
    }
    .checkbox-wrapper-14 input[type=checkbox]:not(.switch) {
      width: 21px;
    }
    .checkbox-wrapper-14 input[type=checkbox]:not(.switch):after {
      opacity: var(--o, 0);
    }
    .checkbox-wrapper-14 input[type=checkbox]:not(.switch):checked {
      --o: 1;
    }
    .checkbox-wrapper-14 input[type=checkbox] + label {
      display: inline-block;
      vertical-align: middle;
      cursor: pointer;
      margin-left: 4px;
    }

    .checkbox-wrapper-14 input[type=checkbox]:not(.switch) {
      border-radius: 7px;
    }
    .checkbox-wrapper-14 input[type=checkbox]:not(.switch):after {
      width: 5px;
      height: 9px;
      border: 2px solid var(--active-inner);
      border-top: 0;
      border-left: 0;
      left: 7px;
      top: 4px;
      transform: rotate(var(--r, 20deg));
    }
    .checkbox-wrapper-14 input[type=checkbox]:not(.switch):checked {
      --r: 43deg;
    }
    .checkbox-wrapper-14 input[type=checkbox].switch {
      width: 38px;
      border-radius: 11px;
    }
    .checkbox-wrapper-14 input[type=checkbox].switch:after {
      left: 2px;
      top: 2px;
      border-radius: 50%;
      width: 17px;
      height: 17px;
      background: var(--ab, var(--border));
      transform: translateX(var(--x, 0));
    }
    .checkbox-wrapper-14 input[type=checkbox].switch:checked {
      --ab: var(--active-inner);
      --x: 17px;
    }
    .checkbox-wrapper-14 input[type=checkbox].switch:disabled:not(:checked):after {
      opacity: 0.6;
    }
  }

  .checkbox-wrapper-14 * {
    box-sizing: inherit;
  }
  .checkbox-wrapper-14 *:before,
  .checkbox-wrapper-14 *:after {
    box-sizing: inherit;
  }
	
	.switch_2 input[type=checkbox]{
	vertical-align: unset !important;
	}