﻿body {
	margin:0px;
	padding:0px;
	font-size:14px; 
	line-height:24px;
	color:#186274;
	font-family: 'Roboto', sans-serif; 
	font-weight:400;
	background:#ffffff;
	color:#ffffff;
}

html { 
	height:100%; 
	width:100%; 
	-webkit-text-size-adjust: none; 
}


/*-------------------------------------------------------------------------*/ 
/* BASICS */
/*-------------------------------------------------------------------------*/ 

.grey {
background:#4e5054;
}

.blue { 
background:#3a96d5;
}

.darkblue { 
background:#35719a;
}

.right { 
	float:right; 
}

.left { 
	float:left; 
}

.rightalign { 
	text-align:right; 
}

.leftalign { 
	text-align:left; 
}

.centeralign { 
	text-align:center; 
}

a { 
	color:#ffffff; 
	cursor: pointer;
	text-decoration:none; 
	-o-transition: .4s;
    -ms-transition: .4s;
    -moz-transition: .4s;
    -webkit-transition: .4s;
    transition: .4s;
}

a:hover { 
	text-decoration:none;	
}

a.hover {
	border-bottom:1px dotted #ffffff;
}

a.hover:hover {
	border-bottom:1px solid #ffffff;
	-o-transition: 0s;
	-ms-transition: 0s;
	-moz-transition: 0s;
	-webkit-transition: 0s;
	transition: 0s;
}

a.arrow:after {
   content: " \00bb";
}

a, div, input, select, img { outline:none; }

img { border:0px; }



h1, h2, h3 { 
	font-family: 'Yanone Kaffeesatz', sans-serif; 
	font-weight:400;
	margin:0px;
	padding:0px;
}

h1 { 
	font-size:36px;
}

h2 {
	font-size:28px;
}

h2.h2grey {
	color:#4e5054;
}

span.mini { 
	font-size:10px;
}

ul, li { 
	margin:0px; 
	padding:0px; 
	list-style:none; 
}

ul.in-line li {
	float:left;
	margin-right:20px;
}

.clear { 
	clear:both;
}

.maxwidth {
	width:1600px;
	margin:auto;
	position:relative;
}

.box {
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	background-color: rgba(58, 150, 213, 0.9);
	background-color: #3a96d5 \9;
	behavior: url(../../css/PIE.htc);
	position:relative;
	border:5px solid #ffffff;
	box-shadow: 0px 0px 0px #4e5054;
}

.delay {
	animation-delay: 0.5s;
	-webkit-animation-delay: 0.5s;
	-moz-animation-delay:0.5s;
}

i.checkmark {
	font-size:18px;
}

.mr-1 {
	margin-right: 6px
}


/*TOOLTIP*/
.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
	background-color: rgba(58, 150, 213, 0.9);
	background-color: #3a96d5 \9;
	border: 1px solid white;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	font-size: 12px;
	white-space: pre-line;
}
body .ui-tooltip {
	border-width: 2px;
}
.ui-tooltip-content {
	white-space: pre-line;
}

/*AUTOCOMPLETE*/
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
	background:#ffffff;
    max-height: 200px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}

.ui-menu-item { 
	color:#0397d6; 
	font-size:12px; 	
	position: relative;
	margin: 0;
	padding: 3px 1em 3px .4em;
	cursor: pointer;
	min-height: 0; /* support: IE7 */
	/* support: IE10, see #8844 */
	list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}

.ui-state-focus { 
	background:#0397d6; 
	color:#ffffff; 
}

.remove { 
	color:#fb4c4c; 
}

label { 
	cursor:pointer; 
}

[ng-click],
[data-ng-click],
[x-ng-click] {
	cursor: pointer;
}

br.brmobile { 
	display:none; 
}
.show-when-small{
    display: none;
}

.fancymodal-content {
	padding-left: 28px;
}
/*-------------------------------------------------------------------------*/ 
/* GRID */
/*-------------------------------------------------------------------------*/ 

.row {
	float:left;
	width:100%;
}

.rowbottommargin {
	margin-bottom:20px;
}

.cell-50 {
	float:left;
	width:48%;
	padding-right:2%;
}
.cell-15 {
    float: left;
    width: 12%;
    padding-right: 2%;
    padding-bottom:2%;
}

.padding {
	width:96%;
	padding:2%;
}

.paddingpix {
	width:calc(100% - 20px);
	padding:10px;
	width:96% \9;
	padding:2% \9;
}

/*-------------------------------------------------------------------------*/ 
/* FORM ELEMENTS */
/*-------------------------------------------------------------------------*/ 

.default-form input.textfield {
	width:calc(100% - 16px);
	padding:8px;
	float:left;
	margin:0px 0px 15px 0px;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border:0px;
	width:95% \9;
	padding:2% \9;
	behavior: url(../../css/PIE.htc);
	position:relative;
	font-family: 'Roboto', sans-serif; 
	font-size:14px;
	color:#4e5054;
}

.default-form button {
	width:100%;
	padding:8px;
	float:left;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border:0px;
	width:95% \9;
	padding:2% \9;
	behavior: url(../../css/PIE.htc);
	position:relative;
	font-family: 'Roboto', sans-serif; 
	color:#ffffff;
	cursor:pointer;
	clear:both;
	margin:0px 0px 15px 0px;
	background:#333333;
	font-weight:700;
	font-size:16px;
	-o-transition: .4s;
    -ms-transition: .4s;
    -moz-transition: .4s;
    -webkit-transition: .4s;
    transition: .4s;
}

.default-form button:hover {
	background:#222222;
}

.default-form label {
	float:left; 
	width:100%;
	cursor:pointer;
	margin:0px 0px 15px 0px;
}


	/* STEPS INPUT FIELDS */
	input.defaultinput {
		border:0px;
		border-radius:4px;
		-moz-border-radius:4px;
		-webkit-border-radius:4px;
		font-family: 'Roboto', sans-serif;
		font-size:12px;
		padding:4px; 
	}

   .searchwrapper {
    position: relative; 
}

input.search { padding-left: 20px; }

.searchwrapper:before {
    font-family: 'FontAwesome';
    position: absolute;
    left: 5px;
    content: "\f002";
}

input.bordered {
    border: 1px solid #aaaaaa;
    
}
input.full {
    width: 100%;
    
}

    
	
	
	.defaultinputsmall {
		width:90px;
	}
	
	.defaultinputlarge {
		width:200px;
	}
	
	.defaultinputfluid {
		width:calc(100% - 6px);
		width:90% \9;
	}
	
	input.accent {
        background-color: palegoldenrod;
	}
	
a.submitbutton {
	background:#35719a;
	border-radius:4px;
	-moz-border-radius:4px;
	border-bottom:4px solid #32607f;
	color:#ffffff;
	padding:10px 20px;
	font-weight:600;
	font-size:12px;
}
a.submitbutton.disabled, a.submitbutton.disabled:hover {
    background:#bbbbbb;
    color:#DADADA;
    border-bottom:4px solid #999999;
    cursor: not-allowed;
	
}

a.submitbutton:hover {
	background:#508bb3;
}
	
	
	
/*-------------------------------------------------------------------------*/ 
/* MAIN DIV */
/*-------------------------------------------------------------------------*/ 	
	
#main { 
	float:left;
	width:100%;
	margin-bottom:50px;
}	



/*-------------------------------------------------------------------------*/ 
/* MOBILE NAVIGATION */
/*-------------------------------------------------------------------------*/ 


#mobile-nav {
	display:none;
	width:96%;
	padding:2%;
	float:left;
	background:#3a96d5;
}

#mobile-nav ul {
	padding:10px 0px;
	border-bottom:1px solid #ffffff;
}

#mobile-nav ul:last-of-type {
	border-bottom:0px;
}

ul.mobile-nav li a { 
	display:block;
	line-height:28px;
}

ul.mobile-nav li.active a { 
	font-weight:700; 
	padding-left:10px; 
}


#mobile-nav ul.inline {
	width:100%;
	float:left;
}

#mobile-nav ul.inline li {
	float:left; 
	margin-right:20px;
}



/*-------------------------------------------------------------------------*/ 
/* TOP SECTION */
/*-------------------------------------------------------------------------*/ 

#top-container { 
	width:100%;
	float:left;
	z-index:10;
}

#top { 
	width:1600px;
	margin:auto;
	line-height:42px;
}

#top ul.inline li {
	float:left;
	margin-right:10px;
}

#top-nav { 
	float:left;
	font-size:20px;
	font-family: 'Yanone Kaffeesatz', sans-serif; 
	padding:10px 0px 10px 0px;
}

#top-nav ul.inline li {
	margin-right:20px;
}

#top-nav ul.inline li:last-of-type {
	margin-right:0px;
}

#top-nav ul li.active a, #top-nav ul li a:hover { 
	color:#94cef6;
}

#top-right-section {
	padding:10px 0px 10px 0px;
	float:right;
}

#top-contact, #top-loggedin, #top-language { 
	float:left;
	margin:0px 0px 0px 40px;
}

#top-language ul li a img {
	vertical-align:middle;
}

#top-loggedin {
	position:relative;

}

a.showpopout { 
	display:block; 
	padding:0px 10px; 
	background:#333333; 
}

a.showpopout:hover { 
	background:#000000; 
}

#top-loggedin-popout {
	position:absolute; 
	right:0px; 
	top:42px;
	padding:10px;
	min-width:200px;
	display:none;
	background:#ffffff;
	box-shadow: 5px 5px 8px #999999;
	z-index:100;
	behavior: url(../../css/PIE.htc);
}

#top-loggedin-popout ul li {
	margin:2px 0px;
}
#top-loggedin-popout ul li.title {
    color: #333333;
    border-bottom: 1px solid #333333 ;
}
#top-loggedin-popout a { 
	display:block;
	color:#3a96d5;
	padding:2px;
}

#top-loggedin-popout a:hover {
	background:#ececec;
}

#top-shownav { 
	display:none; 
}



/*-------------------------------------------------------------------------*/ 
/* HOME SECTION */
/*-------------------------------------------------------------------------*/ 

#home-container {	
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

#home-header-container {
	background-color: rgba(255, 255, 255, 1);
 	background-color: #ffffff \9;
	height:120px;
}

#home-header { 
	width:1600px; 
	margin:auto;	
}

#home-header-qlip, #home-header-qportal {
	width:10%;
	height:80px;
	padding:20px 0px;
	line-height:80px;
}

#home-header-qlip img, #home-header-qportal img { 
	vertical-align:middle;
	max-width:100%;
	max-height:100%;
}

#home-header-qlip, #home-header-ansynth {
	width: 20%;
	height: 80px;
	padding: 20px 0px;
	line-height: 80px;
}

	#home-header-qlip img, #home-header-ansynth img {
		vertical-align: middle;
		max-width: 100%;
		max-height: 100%;
	}

#home-header-title {
	width:60%;
	float:left;
	text-align:center;
}

#home-login-container {
	float:left;
	width:100%;

}

#home-login {
	margin:150px auto;
	padding:20px;
	width:500px;
	min-height:250px;
}

#home-login-header {
	width:100%;
	float:left;
	margin:10px 0px 30px 0px;
}

#home-login-left { 
	width:47%;
	padding:0% 2% 0% 0%;
	border-right:1px dotted #ffffff;
}

#home-login-right {
	width:47%;
	padding:0% 0% 0% 2%;
}

.popup-link {
	color: #3a96d5
}

/*-------------------------------------------------------------------------*/
/* WELCOME SECTION */
/*-------------------------------------------------------------------------*/
.welcomeblock {
	float: left;
	/*width:calc(25% - 43px);*/
	width: calc(33% - 42px);
	margin: 150px 12px 150px 0;
	padding: 12px;
	font-size: 13px;
	width: 30% \9;
	margin: 150px 12px 150px 0px \9;
}

	.welcomeblock:last-of-type {
		margin: 150px 0px 150px 0;
	}

.welcomeblock3 {
	margin: 150px 0px 150px 0px \9;
}

.welcomeblock1 {
	margin: 150px 12px 150px 12px \9;
}

.welcomeblock h2 i {
	font-size: 24px;
}

.welcomeblock0 ul {
	position: absolute;
	bottom: 15px;
}

.welcomeblock1 ul {
	position: absolute;
	bottom: 15px;
}

.welcomeblock2 span {
	display: none;
}
#home-text {
	min-height: 110px;
}

.flex-container {
	display: flex;
	flex-wrap: nowrap;
	line-height: 1.0;
	justify-content: start;
}

/*-------------------------------------------------------------------------*/
/* BARCODE REQUEST SECTION */
/*-------------------------------------------------------------------------*/
img.resize {
	max-width: 50%;
	max-height: 50%;
	border-radius: 10px;
}

.barcode-request-btn {
	color: white !important
}

/*-------------------------------------------------------------------------*/
/* REQUEST SECTION */
/*-------------------------------------------------------------------------*/
#request-container {
	background: #ffffff;
}

#request-header-container { 
	height:80px;
	color:#4e5054;
	background:#ffffff;
}

#request-header-logo {
	width:20%;
	float:left;
	height:50px;
	line-height:50px;
	padding:15px 0px;
}

#request-header-logo img { 
	vertical-align:middle;
	max-width:100%;
	max-height:100%;
}

#request-header-title {
	width:60%;
	float:left;
	line-height:80px;
	height:80px;
}


#request-header-cart {
	width:20%;
	float:left;
	line-height:80px;
	height:80px;
	text-align:right;
}

#request-header-cart i { 
	font-size:32px;
}

#request-header-cart a { 
	color:#4e5054;
}


#tab-container span.invoerper {
	float:left;
	color:#4e5054;
	line-height:42px;
	width:calc(20% - 20px);
	text-align:right;
	padding-right:20px;
}


#tab-container ul.tabs {
	margin:0px;
	padding:0px;
}

#tab-container ul.tabs li {
	float:left;
}

#tab-container ul.tabs li a {
	display:block;
	color:#ffffff;
	line-height:42px;
	padding:0px 20px;
}

#tab-container ul.tabs li.tab-barcode a { 
	background:#3a96d5;
}

#tab-container ul.tabs li.tab-product a {
	background:#35719A;
}

#tab-container ul.tabs li.tab-template a {
    background: #65BAEA;
}


#tab-container ul.tabs li.hiddentab a {
	background:#ffffff;
	color:#4e5054;
	cursor:default;
}

#request-content-container {
	margin-top:20px;
}

.request-contents {
	float:left;
	background:#3a96d5;
	width:100%;
}

#result-info-modal .fancymodal-content {
	max-width: 1500px;
	max-height: 900px;
	background-color:#fff;
}

#result-info-modal .requestid {
	color: #0397d6;
	transition: .025s;
}

#result-info-modal a {
	transition: .025s;
}

#attachment-info-modal .fancymodal-content {
	max-width: 1000px;
	max-height: 900px;
	background-color: #fff;
}

#attachment-info-modal .requestid {
	color: #0397d6;
	transition: .025s;
}

#attachment-info-modal a {
	transition: .025s;
}

#excel-export-modal a {
	transition: .025s;
}

#result-table {
	max-height: 600px;
	max-width: 1450px;
	overflow-y: scroll;
	background-color: #f5f8fa;
}

#result-table tr td {
	border-bottom: 0px !important;
}

#result-table th {
	color: #0397d6;
}

/*-------------------------------------------------------------------------*/
/* Analyseaanvraag ACCORDION MARKUP */
/*-------------------------------------------------------------------------*/
/*ui-accordion-header ui-accordion-icons ui-corner-all*/
.steps-container {
	width: 100%;
}
	
	.request-contents h2 {
		width:calc(100% - 20px);
		padding:10px;
		width:98% \9;
		padding:1% \9;
		outline:none;
		cursor:pointer;
		float:left;
		font-family: 'Roboto', sans-serif; 
		font-size:20px;
	}
	
	.request-contents icon { 
		color:#ffffff;
		margin-right:10px;
   		font-size:18px;
	}
	
	/*.ui-icon-plus:after {
		font-family: FontAwesome;
   		content: "\f055";
   		font-size:18px;
	}
	
	.ui-icon-minus:after {
		font-family: FontAwesome;
   		content: "\f056";
   		font-size:18px;
	}*/
	
	.step-bar {
		float:left;
		width:calc(100% - 20px);
		padding:10px;
		width:96% \9;
		padding:2% \9;
		outline:none;
		clear:both;
	}
	
	
	div.info {
		position:absolute;
		z-index:5;
		right:10px; 
		top:-36px;
		font-size:24px;
	}
	
	.steps-container {
		float:left;
	}
	
	.step-product {
		position:relative;
		background:#35719a;
	}
	
	.step-monster {
		position:relative;
		background:#3A96D5;
	}
.step-grid {
    position: relative;
    background: #3A96D5;
}
.step-template-picker {
    position: relative;
    background: #65BAEA;
}
	.step-onderzoek {
		position:relative;
		background:#65BAEA;
	}
 
	.step-right {
		width:calc(20% - 21px);
		padding:0px 0px 0px 20px;
		border-left:1px solid white;
		float:right;
		width:25% \9;		
	}
	
	.step-right span {
		width:100%;
		font-size:20px;
		margin-bottom:10px;
		display:block;
	}
	
	.step-left {
		width:calc(80% - 20px);
		padding:0px 20px 0px 0px;
		float:left;
		width:65% \9;
	}
	

	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag BARCODE TAB */
	/*-------------------------------------------------------------------------*/ 

	#request-barcode-header { 		
		width:calc(80% - 20px);
		padding:10px;
		float:right;
		background:#3a96d5;
		width:96% \9;
		padding:2% \9;
	}
	
	#selectedBarcodes {
		margin-right:10px;
	}	

	
	
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: product */
	/*-------------------------------------------------------------------------*/ 
	

	.productscontainer {
		float:left;
		width:16%;
		margin:1% 1% 1% 0%;
		width:15% \9;
	}
	
	.productscontainerlarge {
		width:32%;
		width:30% \9;
	}

	.productscontainer-header-desktop, .productscontainer-header-mobile {
		width: 100%;
		float: left;
		font-size: 18px;
		margin-bottom: 10px;
		font-weight: bold;
	}

	.productscontainer-header-mobile {
		display:none;
	}
	
	.productscontainer-products { 
		float:left;
	}
	
	.productscontainer-products ul li {
		font-size:11px;		
		margin-bottom:1px;		
	}

	.productscontainer-products ul li a {		
		padding:4px 3px;
		/*display:block;*/
		line-height:12px;
		-o-transition: 0s;
		-ms-transition: 0s;
		-moz-transition: 0s;
		-webkit-transition: 0s;
		transition: 0s;
	}
	
	.productscontainer-products ul li a:hover, .productscontainer-products ul li a.active {
		background-color: rgba(255, 255, 255, 0.2);
		background-color:#5d8dae \9;
	}
	
	.productscontainerlarge ul {
		width:49%; 
		float:left;
		margin-right:2%;
		width:48% \9;
	}
	
	.productscontainerlarge ul:last-of-type {
		margin-right:0%;
	}
	
	

	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: monster */
	/*-------------------------------------------------------------------------*/ 
	
	.step-monster-column { 
		float:left; 
		width:23%; 
		padding-right:2%;
	}

.step-template-column {
    float: left;
    width: 99%;
    padding-right: 2%;
}

    .step-template-column .header
    {

    }
    /*-------------------------------------------------------------------------*/
    /* Analyseaanvraag stap: onderzoek */
    /*-------------------------------------------------------------------------*/
    .onderzoek-tabs {
        float: left;
        width: 100%;
    }

	.onderzoek-tabs ul.tabs {
		margin:0px;
		padding:0px;
	}
	
	.onderzoek-tabs ul.tabs li {
		float:left;
	}
	
	.onderzoek-tabs ul.tabs li a {
		display:block;
		color:#ffffff;
		line-height:42px;
		padding:0px 20px;
	}
	
	.onderzoek-tabs ul.tabs li a.active { 
		background:#35719a;
	}
	
	.onderzoek-container {
		float:left;
		width:calc(100% - 40px);
		padding:20px;
		background:#35719a;
		width:98% \9;
		padding:1% \9;
	}
	
	.step-onderzoek-column {
		float:left;
		width:33.3%;
		padding-right:3%;
	}
	.step-onderzoek-column-small {
		float:left;
		width:20%;
		padding-right:3%;
	}
	
	.step-onderzoek-column table {
		width:100%;
		cellspacing:0;
		cellpadding:0;
		border:0px;
		border-collapse: collapse;
	}
	
	.step-onderzoek-column table tr td {
		font-size:11px;
		padding:1px 2px 1px 0px;
		border:0px;
		vertical-align:top;
	}
	.step-onderzoek-column table tr td .disabled {
            color: #86aac2;
        }
	
	
	.step-onderzoek-column table tr.viewmore {
		display:none;
	}
	
	.step-onderzoek-column ul {
		float:left;
		width:47%;
		margin:0% 3% 0% 0%;
	}
	
	.step-onderzoek-column ul li {
		font-size:11px;
		padding:1px 0px;
	}

/*-------------------------------------------------------------------------*/
/* Barcodes aanvragen */
/*-------------------------------------------------------------------------*/ 	
.barcode-overview-content {
	width: 90% !important
}

/*-------------------------------------------------------------------------*/ 
/* Bevestiging van uw opdracht */
/*-------------------------------------------------------------------------*/ 	
	
.bestelling-container {
	margin-top:80px;
}

.bestelling-content {
	float:right;
	color:#4e5054;
	font-size:11px;
}

.bestelling-content a, .bestelling-content a:visited { 
	color:#0397d6;
}

.bestelling-content span, .bestelling-content th { 
	font-size:14px;
	font-weight:600;
}

.bestelling-klant-table {	
	border-collapse:collapse;
	border:0px;
}

.bestelling-klant-table tr td {	
	margin:0px;
	padding:0px 20px 2px 0px;
	font-size:11px;
}

.bestel-table-container {
	margin-top:40px;
	float:left;
	width:100%;
}

.bestel-table-column {
	float:left;
}

.subrow {
	margin-bottom:20px;
}

.mainrow .subrow:last-of-type {
	margin-bottom:0px;
}

.column1 {
	width:20%;
	padding:0% 1%;
}

.column2 {
	width:21%;
	padding:0% 1% 0% 0%;
}

.column3 {
	width:33%;
	padding:0% 1% 0% 0%;
}

.column4 {
	width:20%;
	padding:0% 1%;
}

.column-2-3 {
	width:54%;
	padding:0% 1% 0% 0%;
}

.monster-column, .onderzoeken-column {
	border-bottom:1px solid #86aac2;
}

.mainrow .row:last-of-type .monster-column, .mainrow .row:last-of-type .onderzoeken-column {
	border-bottom:0px;
}

.monster-column .row div {
	width:46%;
	padding:0% 4% 0% 0%;
	float:left;
}

#btw-total div {
	width: 60%;
}

.onderzoeken-column .row div:first-of-type {
	width:81%;
	padding:0% 4% 0% 0%;
	float:left;
}

.onderzoeken-column .row div:last-of-type {
	width:11%;
	padding:0% 0% 0% 4%;
	float:left;
	text-align:right;
}

.monster-column .row:last-of-type div, .onderzoeken-column .row:last-of-type div {
	margin-bottom:20px;
}

.mainrow .row:last-of-type .monster-column .row:last-of-type div, .mainrow .row:last-of-type .onderzoeken-column .row:last-of-type div {
	margin-bottom:0px;
}

.row .collapse {
	width:96%; 
	float:left;
	padding:0% 4% 0% 0% !important;
}

.odd {
	background:#f5f8fa;
}

.even {
	background:#eaf1f5;
}

.totalrow {
	background:#86aac2;
	color:#ffffff;
}


.totalrow .row .onderzoeken-column .row div:first-of-type {
	width:61%;
	padding:0% 4% 0% 0%;
}

.totalrow .row .onderzoeken-column .row div:last-of-type {
	width:31%;
	padding:0% 0% 0% 4%;
}

.mainrow {
	padding:20px 0px;
}

.confirmrow {
	font-size:12px;
}

.confirmrow .icheckbox_square-aero { 
	margin:0px 10px 0px 0px;	
}

.confirmrow a.submitbutton {
	color:#ffffff;
}

.rowheader {
	display:none;
}

	.rowheader-static {
		display:block;
		font-size:14px;
	}

/*-------------------------------------------------------------------------*/ 
/* Mijn opdrachten */
/*-------------------------------------------------------------------------*/

table#mijn-opdrachten-table tr th {
	font-size:14px;
	font-weight:600;
	text-align:left;
	background:#f5f8fa;
	padding:8px;
}

table#mijn-opdrachten-table tr td {
	font-size:12px;
	background:#f5f8fa;
	padding:6px 8px;
	border-bottom:1px solid #eaf1f5;
}

table#mijn-opdrachten-table tr:hover td {
	background-color:#e8f1f6;
}

table#mijn-opdrachten-table tr td i {
	font-size:18px;

	vertical-align:middle;
}

table#mijn-opdrachten-table tr td i.small {
	font-size:12px;

	vertical-align:middle;
}

table#mijn-opdrachten-table tr td.verticalalign {
	vertical-align:middle;
}

table#mijn-opdrachten-table a {
	display:inline;
}

table#mijn-opdrachten-table tr.base td {
    -webkit-transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s;
    transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s;
}


table#mijn-opdrachten-table tr.new td {
    background-color: #2ac67e;
}

.assignmentoverviewtable {
	display: block;
	overflow-x: auto;
	max-height: 50vh;
	width:100%;
}

i.ired { 
	color:#d91f1f; 
}

i.igreen { 
	color:#04b909; 
}

i.iorange { 
	color:#fdad01; 
}

i.iblue  { 
	color:#03a0e3; 
}

i.igrey { 
	color:#5e5054; 
}

i.disabled {
	color: #dddddd;
	cursor: default;
}

.order-legend a { 
	line-height:24px; 
}

.order-legenda i { 
	vertical-align:middle; 
	font-size:18px; 
}

.order-legenda a:hover i { 
	color:#dddddd; 
}
	
.order-search { 
	background:#f5f8fa;
	position:relative;
}

.order-search input.defaultinput {
	width:25%;
}

.order-search input.defaultinputsmall {
	width:125px;
}
.order-search .datefilter {
    display: inline-block;
    float: right;
}

.order-search a.tooltip { 
	font-size:24px;
}
	
.order-legenda-bottom span {
	font-weight:400;
	font-size:12px;
	margin-right:20px;
}

.pagination { 
	font-size:14px;
}

.pagination a {
	padding:4px;
}

.pagination a:hover {
	text-decoration:underline;
}

.order-legenda-bottom i { 
	vertical-align:middle; 
	font-size:18px; 
}
	
	
	

/*-------------------------------------------------------------------------*/ 
/* MEDIA QUERIES */
/*-------------------------------------------------------------------------*/ 


@media screen and (max-width:1600px) {

	.maxwidth { 
		width:96%;
		padding:2%; 
		float:left;
	}
	
	#top { 
		width:96%;
		padding:0% 2%;
	}
	
	#home-header { 
		width:96%;
		padding:0% 2%;
	}
	
	.productscontainer-products ul li {
		font-size:10px;		
		margin-bottom:1px;		
	}
	
	
		
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: monster */
	/*-------------------------------------------------------------------------*/ 
	
	.step-monster-column { 
		float:left; 
		width:31.3%;
		padding-right:2%; 
	}
	
	
}



@media screen and (max-width:1300px) {



	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: onderzoek */
	/*-------------------------------------------------------------------------*/ 
	
	.step-onderzoek-column { 
		width:47%;
		padding-right:3%; 
		margin-bottom:40px;
	}
	
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: monster */
	/*-------------------------------------------------------------------------*/ 
	
	
	.step-monster-column { 
		float:left; 
		width:48%;
		padding-right:2%; 
	}
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Bevestiging van uw opdracht */
	/*-------------------------------------------------------------------------*/ 	
	
	.bestelling-content {
		width:100%;
		float:left;
	}


}



@media screen and (max-width:1024px) {

	
	#top-contact { 
		display:none;
	}
	
	#top-language {
		margin:0px;
	}

	
	/*-------------------------------------------------------------------------*/ 
	/* WELCOME SECTION */
	/*-------------------------------------------------------------------------*/ 
	
	.welcomeblock {
	float:left;
	width:calc(50% - 40px);
	margin:auto;
	padding:12px;
	font-size:13px;	
	width:45% \9;
	margin:0px 12px 0px 0px \9;
	}
	
	.welcomeblock1 {
		margin:50px 12px 0px 0px;
	}
	
	.welcomeblock2 {
		margin:50px 0px 0px 0px; 
	}
	
	.welcomeblock3 {
		margin:50px 12px 50px 0px;
	}
	
	.welcomeblock4, .welcomeblock:last-of-type {
		margin:50px 0px 50px 0px;
	}
	
	.welcomeblock h2 i {
		font-size:24px;
	}
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: product */
	/*-------------------------------------------------------------------------*/ 
	
	.step-right {
		width:100%;
		padding:20px 0px 20px 0px;
		border-left:0px;
		float:left;
		width:100% \9;	
		text-align:center;	
		background-color: rgba(255, 255, 255, 0.2);
		margin-bottom:20px;
	}
	
	.step-right span {
		width:100%;
		font-size:20px;
		margin-bottom:10px;
		display:block;
	}
	
	
	.step-left {
		width:100%;
		padding:0px 0px 0px 0px;
		float:left;
	}
	
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Bevestiging van uw opdracht */
	/*-------------------------------------------------------------------------*/ 	
	
	.headerrow {
		display:none;
	}	
	
	.column1 {
	width:98%;
	padding:0% 0% 0% 2%;
	}
	
	.column2 {
		width:46%;
		padding:0% 2% 0% 2%;
	}
	
	.column3 {
		width:46%;
		padding:0% 2% 0% 2%;
	}
	
	.column4 {
		width:98%;
		padding:0% 0% 0% 2%;
	}
	
	.column4 ul li { 
		float:left;
		margin-right:20px;
	}
	
	.column-2-3 {
		width:100%;
		padding:0%;
	}
	
	.monster-column, .onderzoeken-column {
		border-bottom:0px;
	}
	
	.column4 {
		border-bottom:1px solid #86aac2;
		padding-bottom:20px;
	}
	
	.mainrow .row:last-of-type .column4 {
		border-bottom:0px;
		padding-bottom:0px;
	}
	
	.mainrow .row:last-of-type .monster-column .row:last-of-type div, .mainrow .row:last-of-type .onderzoeken-column .row:last-of-type div {
		margin-bottom:20px;
	}

	.subrow {
		margin-bottom:0px;
	}
	
	.totalrow .column1, .totalrow .column4 {
		display:none;
	}

	.totalrow .row:last-of-type .monster-column .row:last-of-type div, .totalrow .row:last-of-type .onderzoeken-column .row:last-of-type div {
	    margin-bottom: 0px;
	}
	
	.confirmrow {
		width:96%;
		padding:0px 2% 0px 2%;
	}
	
	.rowheader {
		display:block;
		font-size:14px;
	}
	
	.column1 span {
		display:block; 
		margin-bottom:20px; 
	}
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Mijn opdrachten */
	/*-------------------------------------------------------------------------*/ 	
	
	.order-search input.defaultinput {
		width:40%;
	}

    	
}


@media screen and (max-width:768px) {

    .grid-header {
        display: none;
    }

    .cell-15 label {
        width: 48%;
        display: block;
        float: left;
        font-weight: bold;
    }

    .cell-15 {
        float: none;
        width: 99%;
    }

    .hide-when-small {
        display: none;
    }

    .show-when-small {
        display: inline;
    }

    #top-loggedin-popout{
        right: auto;
    }

	#top-container {
		position:fixed;
	}

	#top-nav, #top-language {
		display:none;
	}
	
	#top-right-section {
		width:100%;
		float:left;	
	}
	
	#top-loggedin { 
		float:left;
		margin:0px 20px 0px 0px;
		max-width:300px;
	}
	
	#top-shownav {
		display:block;
		float:right;
		font-size:24px;
	}
	
	#home-container, #request-container {
		margin-top:62px;
	}
	
	#home-header-container {
		height:80px;
	}
	
	#home-header-qlip, #home-header-qportal {
		width:40%;
		height:50px;
		padding:15px 0px;
		line-height:50px;
	}

	
	#home-header-title { 
		display:none;
	}
	
	
	#home-login {
		margin:50px auto;
		padding:5%;
		width:calc(80% - 10px);
	}
	
	#home-login-left { 
		width:100%;
		padding:0%;
		border-right:0px;
	}
	
	#home-login-right {
		width:100%;
		padding:0%;
		margin-top:20px;
	}
	
	#home-login-right span {
		display:none;
	}
		
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag SECTION */
	/*-------------------------------------------------------------------------*/ 
	
	#request-header-title {
		width:50%;
	}
	
	#request-header-cart {
		width:30%;
		font-size:16px;
	}
	
	#request-header-cart i { 
		font-size:24px;
	}
	
	#request-header-title h2 {
		font-size:16px;
		margin-left:10px;
	}
	
	.invoerper { 
		width:auto;
		font-size:12px;
	}
	
	#request-barcode-header { 			
		width:calc(100% - 20px);
		float:left;
	}
	
	
	
		
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: monster */
	/*-------------------------------------------------------------------------*/ 
	
	
	.step-monster-column { 
		float:left; 
		width:100%; 
		margin-bottom:40px; 
		padding-right:0%;
	}
	
	.step-monster-column:last-of-type { 
		margin-bottom:0px; 
	}
	
	
			
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: onderzoek */
	/*-------------------------------------------------------------------------*/ 
	
	
	.step-onderzoek-column {
		width:100%;
		padding-right:0%;
	}
	
	/*-------------------------------------------------------------------------*/ 
	/* Mijn opdrachten
	/*-------------------------------------------------------------------------*/ 
	.order-search .datefilter{
        float: inherit;
	}
    .order-search .datefilter label {
        display:none;
    }
    .grid-header {
        display: none;
    }

}


@media screen and (max-width:600px) {


	br.brmobile { display:block; }


    /*-------------------------------------------------------------------------*/
    /* FORM ELEMENTS */
    /*-------------------------------------------------------------------------*/
    input.defaultinput {
        padding: 5px;
    }


	/*-------------------------------------------------------------------------*/ 
	/* WELCOME SECTION */
	/*-------------------------------------------------------------------------*/ 
	
	.welcomeblock1, .welcomeblock2, .welcomeblock3, .welcomeblock4, .welcomeblock:last-of-type {
		margin:auto;
	}
	
	.welcomeblock, .welcomeblock:last-of-type {
	float:left;
	width:calc(100% - 34px);
	margin:0px 0px 50px 0px;
	padding:12px;
	font-size:13px;	
	width:90% \9;
	margin:0px 12px 50px 12px \9;
	}
	
	.welcomeblock:first-of-type {
		margin:50px 0px 50px 0px;
	}
	

	.welcomeblock h2 i {
		font-size:24px;
	}
	
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag ACCORDION MARKUP */
	/*-------------------------------------------------------------------------*/ 
	
	div.info {
		position:absolute;
		z-index:5;
		width:42px;
		height:42px;
		right:2px; 
		top:-45px;
		font-size:24px;
		line-height:46px;
		text-align:center;
	}
	
	div.info a { 
		display:block;
		background-color: rgba(0, 0, 0, 0.0);
	}

	
	
	
	.step-right span {
		display:none;
	}
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: product */
	/*-------------------------------------------------------------------------*/ 
	
	.productscontainer {
		float:left;
		width:100%;
		margin:0% 0% 0% 0%;
		border-bottom:1px solid white;
	}
	
	.productscontainerlarge {
		width:100%;
	}
	
	.productscontainer:last-of-type {
		margin:0% 0% 4% 0%;
	}
	
	.productscontainerlarge ul {
		width:100%; 
		float:left;
		margin-right:0%;
	}
	
	.productscontainerlarge ul:last-of-type {
		margin-right:0%;
	}
	
	.productscontainer-header-desktop {
		display:none;
	}
	
	.productscontainer-header-mobile {
		display:block;
		margin-bottom:0px;
	}
	
	.productscontainer-header-mobile a { 
		display:block;
		padding:10px;
	}
	
	.productscontainer-header-mobile a:hover {
		background-color: rgba(255, 255, 255, 0.2);
	}
	
	.productscontainer-products {
		width:100%;
		float:left;
		display:none;
	}
        .productscontainer-products .activePanel {
            display:block;
        }
	.productscontainer-products ul li {
		font-size:13px;
	}
	
	.productscontainer-products ul li a { 
		padding:3px;
	}
	
	
		
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: onderzoek */
	/*-------------------------------------------------------------------------*/ 
	
	div.step-onderzoek {	
		float:left;
		width:calc(100% - 10px);
		padding:5px;
		width:98% \9;
		padding:1% \9;
		outline:none;
		clear:both;
	}
	
	#onderzoek-tab-container ul.tabs li a {
		padding:0px 10px;
	}
	
	.onderzoek-container {
		width:calc(100% - 20px);
		padding:10px;
	}

    .warning {
        color: #86aac2;
    }

    .messages {
        margin-left:15px;
        margin-top: 10px;
    }
	
	/*-------------------------------------------------------------------------*/ 
	/* Analyseaanvraag stap: monster */
	/*-------------------------------------------------------------------------*/ 
	
	
	.step-monster-column { 
		font-size:11px;
	}
	
	
	/*-------------------------------------------------------------------------*/ 
	/* Bevestiging van uw opdracht */
	/*-------------------------------------------------------------------------*/ 	
	
	.bestelling-container {
		margin-top:20px;
	}
	
	.column1 {
	width:96%;
	padding:0% 2% 0% 2%;
	}
	
	.column2 {
		width:96%;
		padding:0% 2% 0% 2%;
	}
	
	.column3 {
		width:96%;
		padding:0% 2% 0% 2%;
	}
	
	.column4 {
		width:96%;
		padding:0% 2% 2% 2%;
	}
	
	.column4 ul li { 
		float:none;
		margin-right:0px;
	}
	
	.column-2-3 {
		width:96%;
		padding:0% 2% 0% 2%;
	}
	
	.mainrow .row:last-of-type .monster-column .row:last-of-type div, .mainrow .row:last-of-type .onderzoeken-column .row:last-of-type div {
		margin-bottom:20px;
	}
	
	.totalrow .column2, .totalrow .column3 {
		width:46%;
		padding:0% 2%;
	}
	
	.totalrow .row:last-of-type .monster-column .row:last-of-type div, .totalrow .row:last-of-type .onderzoeken-column .row:last-of-type div {
		margin-bottom:0px;
	}
	
	.confirmrow {
		font-size:11px;
	} 
	
	
		
	/*-------------------------------------------------------------------------*/ 
	/* Mijn opdrachten */
	/*-------------------------------------------------------------------------*/ 	
	
	.order-search input.defaultinput {
		width:80%;
	}
}
/*****
Loaders
*****/
.cssload-spin-box {
	position: relative;
	left: 20px;
	top: 20px;
	bottom: 0;
	right: 0;
	width: 15px;
	height: 15px;
	border-radius: 100%;
	box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
		-o-box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
		-ms-box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
		-webkit-box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
		-moz-box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
	animation: cssload-spin ease infinite 4.6s;
		-o-animation: cssload-spin ease infinite 4.6s;
		-ms-animation: cssload-spin ease infinite 4.6s;
		-webkit-animation: cssload-spin ease infinite 4.6s;
		-moz-animation: cssload-spin ease infinite 4.6s;
}



@keyframes cssload-spin {
	0%,
	100% {
		box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
	}
	25% {
		box-shadow: -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73);
	}
	50% {
		box-shadow: -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223);
	}
	75% {
		box-shadow: 15px -15px #dfdfdf, 15px 15px #4f4d49, -15px 15px #dfdfdf, -15px -15px #4f4d49;
	}
}

@-o-keyframes cssload-spin {
	0%,
	100% {
		box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
	}
	25% {
		box-shadow: -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73);
	}
	50% {
		box-shadow: -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223);
	}
	75% {
		box-shadow: 15px -15px #dfdfdf, 15px 15px #4f4d49, -15px 15px #dfdfdf, -15px -15px #4f4d49;
	}
}

@-ms-keyframes cssload-spin {
	0%,
	100% {
		box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
	}
	25% {
		box-shadow: -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73);
	}
	50% {
		box-shadow: -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223);
	}
	75% {
		box-shadow: 15px -15px #dfdfdf, 15px 15px #4f4d49, -15px 15px #dfdfdf, -15px -15px #4f4d49;
	}
}

@-webkit-keyframes cssload-spin {
	0%,
	100% {
		box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
	}
	25% {
		box-shadow: -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73);
	}
	50% {
		box-shadow: -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223);
	}
	75% {
		box-shadow: 15px -15px #dfdfdf, 15px 15px #4f4d49, -15px 15px #dfdfdf, -15px -15px #4f4d49;
	}
}

@-moz-keyframes cssload-spin {
	0%,
	100% {
		box-shadow: 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223);
	}
	25% {
		box-shadow: -15px 15px rgb(223,223,223), -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73);
	}
	50% {
		box-shadow: -15px -15px rgb(79,77,73), 15px -15px rgb(223,223,223), 15px 15px rgb(79,77,73), -15px 15px rgb(223,223,223);
	}
	75% {
		box-shadow: 15px -15px #dfdfdf, 15px 15px #4f4d49, -15px 15px #dfdfdf, -15px -15px #4f4d49;
	}
}