/* Media Queries */

/* Breakpoints Up */

/* xs (mobile) */
@media(max-width:575px) {

	form .radio, .checkbox {
		background: #fff none repeat scroll 0 0;
		display: block;
		height: auto;
		/* width: 20px; */
		position: relative;
	}

}

/* sm (mobile) */
@media(min-width:576px) {

}

/* md (tablet portrait) */
@media(min-width:768px) {

}

/* xs to md */
@media(min-width:320px) and (max-width:991px) {
	
	h1 {
		color: #333;
		font-weight: 600;
		font-size: 1.25rem;
		letter-spacing: -.01rem;
		margin: 0;
	}
	h2 {
		font-weight: 600;
		font-size: .95rem;
		margin-bottom: 0;
		/* padding-bottom: .5rem; */
		letter-spacing: -.01rem;
	}
	button.btn-primary {
		font-size: .9rem;
		padding: .375rem .75rem;
	}
	button.btn-primary.inverted {
		font-size: .9rem;
		padding: .375rem .75rem;
	}
	.statsbar span.counter {
		font-size: 1rem !important;
	}
	.statsbar span.title {
		font-size: .8rem !important;
	}	
		
}

/* md to lg */
@media(min-width:768px) and (max-width:1200px) {
	
	h1 {
		color: #333;
		font-weight: 600;
		font-size: 1.25rem;
		letter-spacing: -.01rem;
		margin: 0;
	}
	h2 {
		font-weight: 600;
		font-size: .95rem;
		margin-bottom: 0;
		/* padding-bottom: .5rem; */
		letter-spacing: -.01rem;
	}
	button.btn-primary {
		font-size: .9rem;
		padding: .375rem .75rem;
	}
	button.btn-primary.inverted {
		font-size: .9rem;
		padding: .375rem .75rem;
	}
	.statsbar span.counter {
		font-size: 1rem !important;
	}
	.statsbar span.title {
		font-size: .8rem !important;
	}	
		
}


/* lg (tablet landscape) */
@media(min-width:992px) {
	
}


/* xl (desktop) */
@media(min-width:1200px) {

}


/* xl (desktop - columns) */
@media(min-width:992px) and (max-width:2000px) {
	
	main.col-12 {
		display: block;
		flex: 100%;
		max-width: 100%;
	}
	main.col-12 .col-left {
		display: block;
		flex: 100%;
		max-width: 100%;
	}
	main.col-12 .col-right {
		display: block;
		flex: 100%;
		max-width: 100%;
	}
	
}

/* navigation icons */
@media(min-width:768px) and (max-width:2000px) {
	
	.nav-icon { display: inline-block; }
	.nav-icon i { 
		margin-right: 0rem !important;
		font-size: .95rem;
 	}
	.nav-text { display: none; }
}

/* navigation padding space x-axle */
@media(min-width:992px) and (max-width:1300px) {
	
	header nav ul li a {
		font-size: .85rem;
		padding: .8rem .7rem !important;
	}
	
}

/* navigation padding space x-axle */
@media(min-width:1301px) and (max-width:1700px) {
	
	header nav ul li a {
		font-size: .9rem;
		padding: .8rem 1.25rem !important;
	}
	
}

/* dashboard stats 1701 -> */
@media(min-width:1701px) {
	.moodybar .currentinfo ul li {
		color: #555;
		font-size: 1.25rem !important;
		font-weight: 300;
		white-space: nowrap;
	}
}
/* dashboard stats 1701 <- */
@media(max-width:1700px) {
	.moodybar .currentinfo ul li {
		color: #555;
		font-size: 1rem !important;
		font-weight: 300;
		white-space: nowrap;
	}
}

/* dashboard stats layout */
@media(max-width:1400px) {
	.moodybar .currentinfo .col-lg-6 {
		display: block;
		flex: 100%;
		max-width: 100%;
	}
}





@media(min-width:1400px) and (max-width:1700px) {
	
	header nav ul li a {
		font-size: .9rem;
		font-weight: 600;
		letter-spacing: 0;
		padding: .8rem 1.25rem !important;
		white-space: nowrap;
		text-transform: uppercase;
	}

	.dashboard-bubble .col-xl-6 {
		flex: 0 0 100%;
		max-width: 100%;
	}
	.klanten-bubble .col-xl-6 {
		flex: 0 0 100%;
		max-width: 100%;
	}
	.facturen-bubble .col-xl-6 {
		flex: 0 0 100%;
		max-width: 100%;
	}
	.diensten-bubble .col-xl-6 {
		flex: 0 0 100%;
		max-width: 100%;
	}
	.producten-bubble .col-xl-6 {
		flex: 0 0 100%;
		max-width: 100%;
	}	

	.time-indication {
	    width: 5.15% !important;
	}
	.time-slot {
	    width: 13.55% !important;
	}
	
}
@media(min-width:2001px) {
	
	.nav-icon { display: none; }
	.nav-text { display: inline-block; }
}

/* xl (media module) */
@media(min-width:1701px) {

	.folder_wrapper {
	-ms-flex: 0 0 16.666667%;
	flex: 0 0 16.666667%;
	max-width: 16.666667%;
	}

}



/* Breakpoints Down */

/* sm - lower (mobile) */
@media(max-width:575px) {

}

/* md - lower (mobile) */
@media(max-width:767px) {

}

/* lg - (tablet portrait and lower) */
@media(max-width:991px) {
	
}

/* xl (tablet landscape and lower) */
@media(max-width:1500px) {
	.table {
	font-size: .8rem;
	}
}