/* 
	GEVERS-IT.2016|cybox.nl
*/

@import url(https://fonts.googleapis.com/css?family=Palanquin:400,100,200,300,500,600,700);
@import url(https://fonts.googleapis.com/css?family=Palanquin+Dark:400,500,700,600);


/* reset */  html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { 	margin: 0; 	padding: 0; 	border: 0; 	outline: 0; 	font-size: 100%; 	vertical-align: baseline; 	background: transparent; } body { 	line-height: 1; } ol, ul { 	list-style: none; } blockquote, q { 	quotes: none; } blockquote:before, blockquote:after, q:before, q:after { 	content: ''; 	content: none; }  /* remember to define focus styles! */ :focus { 	outline: 0; }  /* remember to highlight inserts somehow! */ ins { 	text-decoration: none; } del { 	text-decoration: line-through; }  /* tables still need 'cellspacing="0"' in the markup */ table { 	border-collapse: collapse; 	border-spacing: 0; }
/* clearfix  */   .cf:before, .cf:after {     content: " "; /* 1 */     display: table; /* 2 */ }  .cf:after {     clear: both; }  /**  * For IE 6/7 only  * Include this rule to trigger hasLayout and contain floats.  */ .cf {     *zoom: 1; }


body {
	font-family: "Palanquin", arial;
	font-size: 1.2em;
	background: #E1E6F3;
	color: #000;
}

a {
	color: #0066A4;
	text-decoration: none;
}
a:hover {
	color: #003f65;
}


#nav {
	width: 120px;
	height: 100%;
	background: #fff;
	position: fixed;
	left: 0; top: 0;
	box-sizing: border-box;
	background: #efefef;
	background-image: url('../images/logo.v3.png');
	background-position: 50% 96%;
	background-size: 80px 400px; /* 50px 250px; */
	background-repeat: no-repeat;
	z-index: 2;
}
#nav #nav-button {
	width: 100%;
	min-height: 400px;
	height: 50vh;
	background: #EE3A43;
	position: relative;
	transition: width 400ms;
	overflow: hidden;
}
#nav #nav-button .bars {
	width: 40px;
	height: 50px;
	position: absolute;
	left: 40px;
	top: 45px;
	cursor: pointer;
}
#nav #nav-button .bars .bar {
	width: 40px;
	height: 2px;
	background: #E1E6F3;
	position: absolute;
	transition: all 300ms cubic-bezier(0.215,.61,.355,1);
}
	#nav #nav-button .bars .bar.bar-1 {
		top: 0;
	}
	#nav #nav-button .bars .bar.bar-2 {
		top: 7px;
	}
	#nav #nav-button .bars .bar.bar-3 {
		top: 14px;
	}

		/* wobbled: */
		#nav #nav-button .bars.wobble .bar.bar-1 {
			margin-top: -5px;
		}
		#nav #nav-button .bars.wobble .bar.bar-3 {
			margin-top: 5px;
		}

#nav #nav-button #remote-support,
#nav #nav-button #customer-service {
	width: 120px;
	height: 120px;
	background: #cd363d;
	color: #E1E6F3;
	position: absolute;
	left: 0;
	bottom: 0;
}
#nav #nav-button #customer-service {
	bottom: 120px;
	background: #c1343b;
}
#nav #nav-button #remote-support:hover,
#nav #nav-button #customer-service:hover {
	background: #b0272d;
}
#nav #nav-button #remote-support a,
#nav #nav-button #customer-service a {
	color: #E1E6F3;
}
#nav #nav-button #remote-support img,
#nav #nav-button #customer-service img {
	display: block;
	width: 32px;
	margin: 25px auto;
}
#nav #nav-button #remote-support .tag,
#nav #nav-button #customer-service .tag {
	position: absolute;
	left: 0; bottom: 25px;
	width: 100%;
	text-align: center;
	font-size: 0.7em;
	font-family: "Palanquin Dark";
	letter-spacing: 1px;
}
#nav #nav-button #sections {
	position: absolute;
	left: 140px;
	top: 35px;
}
#nav #nav-button #sections ul {
	font-family: "Palanquin Dark";
	font-weight: 700;
}
#nav #nav-button #sections ul.large {
	font-size: 1.5em;
	margin-bottom: 15px;
}
#nav #nav-button #sections ul li a {
	color: #fff;
	text-decoration: none;
	display: block;
	padding: 3px 0;
	white-space: nowrap;
}
#nav #nav-button #sections ul li.active a,
#nav #nav-button #sections ul li a:hover {
	color: #E3E6F3;
}
#nav #nav-button #logobar {
	width: calc(100%-120px);
	height: 120px;
	background: #fff;
	position: absolute;
	left: 120px;
	bottom: 0;
}
#nav #nav-button #logobar .button {
	width: 120px;
	height: 120px;
	background: #fff;
	float: left;
	position: relative;
}
#nav #nav-button #logobar .button a {
	display: block;
	width: 100%;
	height: 100%;
}
#nav #nav-button #logobar .button.button-2 {
	background: #E3E6F3;
}
#nav #nav-button #logobar .button img {
	position: absolute;
	left: 50%; top: 50%;
	max-width: 90px;
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	pointer-events: none;
}
/* menu activated */
#nav.active #nav-button {
	width: 100vw;
}
#nav.active #nav-button .bars .bar.bar-1 {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	width: 20px; left: -5px;
}
#nav.active #nav-button .bars .bar.bar-3 {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	width: 20px; left: -5px;
}



/* gevers content */
#content {
	width: calc(100%-120px);
	margin-left: 120px;
	min-height: 150vh;
	position: relative;
	z-index: 1;
}
#content .header {
	width: 100%;
	min-height: 400px; 
	height: 70vh;
	background: #0066A7;
	overflow: hidden;
	position: relative;
	z-index: 1;
}
@media screen and (max-width: 1300px) {
		#content .header {
			height: 50vh;
		}
}
@media screen and (max-width: 900px) {
		#content .header {
			height: 100vh;
		}
}
#content .header img {
	width: 100%;
	display: block;	
	margin-top: -15vh;
	opacity: 0.6;
	z-index: 1;	
	opacity: 0;
	transition: margin 600ms;	


    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'https://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: gray; /* IE6-9 */
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */	
}
#content .header img.loaded {
	opacity: 0.6;
}
#content .header.act img {
	margin-top: -50px;
}
#content .header h1 {
	position: absolute;
	left: 0; top: 50%;
	font-size: 2em;
	line-height: 1.2;
	font-family: "Palanquin Dark";
	color: #fff;
	font-weight: 700;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%; text-align: center;
	z-index: 2;
}
@media screen and (max-width: 900px) {
		#content .header img,
		#content .header.act img  {
			width: auto;
			height: 100%;
			-webkit-transform: translateX(-50%);
			transform: translateX(-50%);
			margin-top: 0;
		}
		#content .header h1 {
			font-size: 1.5em;
		}
}
/* masonry section */
#content .masonry {
	position: relative;
	width: 100%;
	box-sizing: border-box;
	min-height: 900px; /* = fix height a bit */
	z-index: 2;
}
#content .masonry .grid-sizer {
	width: 33.333%;
}
#content .masonry .picture {
	position: relative;
	width: 33.333%; 
	float: left;
}
#content .masonry .picture img {
	display: block;
	width: 100%;
	opacity: 0;
	transition: all 200ms;
}
#content .masonry .picture.loaded img {
	opacity: 1;
}
#content .masonry .text-block {
	width: 33.333%;
	background: #fff;
	color: #0066A7;
	box-sizing: border-box;
	padding: 2em;
	font-size: 1em;
	line-height: 1.7em;
	float: left;
	margin-top: -3em;
	position: relative;
	min-height: 500px;
}
#content .masonry .text-block strong {
	font-family: "Palanquin Dark";
}
#content .masonry .text-block p {
	padding-bottom: 1em;
}
#content .masonry .text-block ul li {
	list-style-type: disc;
	margin-left: 1em;
}
#content .masonry .text-block .crumbs {
	font-size: 0.8em; 
	margin-bottom: 1em;
}
@media screen and (max-width: 1200px) {
		#content .masonry .grid-sizer, 
		#content .masonry .picture,
		#content .masonry .text-block {
			width: 50%; 
		}
}
@media screen and (max-width: 900px) {
		#content .masonry .grid-sizer, 
		#content .masonry .picture,
		#content .masonry .text-block {
			width: 100%; 
		}
}


/* klanten */
#logos {
	min-height: 600px;
	background: #fff;
}
#logos #logos-holder {
	max-width: 1200px;
	margin: 0 auto;
	padding: 3em;
	font-size: 1em;
	text-align: center;
	line-height: 1.5;
	color: #0066A7;
	padding-bottom: 200px;
}
#logos #logos-holder .logo-holder-logos {
	padding-top: 3em;
}
#logos #logos-holder .logo-holder-logos .logo {
	width: 18%;
	float: left;
	margin: 1%;
	min-height: 150px;
	border: 2px solid #efefef;
	box-sizing: border-box;
	position: relative;
}
#logos #logos-holder .logo-holder-logos .logo img {
	display: block;
	max-width: 90%;
	max-height: 90%;
	position: absolute;
	left: 50%; top: 50%;
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

/* team */
#team {
	padding-bottom: 170px;
	width: 115%;
	padding-top: 1em;
	margin-left: -7.5%;
}
#team .persoon {
	width: 50%;
	float: left;
	position: relative;
}
#team .persoon img {
	display: block;
	width: 100%;
}
#team .persoon .name {
	position: absolute;
	left: 0; bottom: 0;
	background: #EE3A43;
	color: #fff;
	padding: 10px 20px;
	font-size: 0.9em;
}

/* contact */
#contact {
	box-sizing: border-box;
	padding-top: 1em;
	padding-bottom: 150px;
}

#contact .field {
	display: block;
	color: #999;
	position: relative;
}
#contact .field.bc {
    display: none;   
}
#contact input,
#contact textarea {
	font-family: inherit;
	font-size: 0.9em;
	color: inherit;
	display: block;
	border: 2px solid #efefef;
	background: #efefef;
	color: #333;
	float: none;
	width: 100%;
	margin: 0.5em 0;
	padding: 5px;
	box-sizing: border-box;
}
#contact textarea {
	min-height: 230px;
}
#contact input[type=submit] {
	background: #EE3A43;
	color: #E3E6F3;
	border: 0;
	margin: 0 auto;
	max-width: 190px;
	border-radius: 3px;
	padding: 10px 5px;
	margin-top: 1em;
	padding-left: 40px;
	background-image: url('../images/icons/signup.png');
	background-size: 20px 20px;
	background-repeat: no-repeat;
	background-position: 10% 50%;
	font-family: "Palanquin Dark";
	text-transform: uppercase;
	letter-spacing: 1px;
}
#contact input[type=submit]:hover {
	cursor: pointer;
	background-color: #B0272D;
	background-size: 24px 24px;
}
#contact form  label.error {
    background: #ed2024; background: rgba(237,32,36,0.9);
	color: #fff; font-size: .9em; width: auto; text-align: center; padding: 5px 10px!important;
	position: absolute; 
    bottom:0; right: -4px;
    font-weight: normal!important;
    line-height:1.2;
    border-radius: 1px; 
	/*box-shadow: 0px 0px 10px rgba(0,0,0,0.2);*/
}


/* submenu */
#submenu-open {
	display: none;
}
#submenu {
	position: absolute;
	left: 50%;
	top: 2em;
	z-index: 3;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 80%;
	text-align: center;
}
#submenu.submenu-lower {
	top: 120px;
	z-index: 4;
}
#submenu ul li {
	display: inline-block;

	position: relative;
}
#submenu ul li a {
	color: #fff; 
	display: block;
	font-weight: bold;
	padding: 0 1em;
	font-family: "Palanquin Dark"
}
#submenu ul li.active a {
	color: #96d0f0;
}
#submenu ul li a:hover {
	color: #E1E6F3;
}

/* subsub */
#submenu .subsub {
	position: absolute;
	left: 0;
	top: 35px;
	padding: 10px 0;
	width: 100%;
	z-index: 999;
	border-top: 3px solid #fff;
}
#submenu .subsub.hidden {
	display: none;
}
#submenu .subsub li {
	float: none; 
	display: block; 
	padding: 5px 0;
}
#submenu .subsub li a {
	color: #fff!important;
}
#submenu .subsub li a:hover {
	color: #ccc!important;
}
#submenu .subsub li.active a {
	color: #EE3A43!important;
}


/* sectorenmenu */
#sectorenmenu {
	position: relative;
	left: 50%;
	top: -50px;
	z-index: 3;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 80%;
	text-align: center;
}
#sectorenmenu li {
	float: left;
	width: 23%;
	margin: 1%;
	background: #fff;
	padding-top: 1em;
}
#sectorenmenu li img {
	display: block; 
	width: 100%;
	margin-top: 1.2em;
}
#sectorenmenu ul li a {
	color: #0066A7; 
	display: block;
	font-weight: normal;
	font-family: "Palanquin Dark";
	text-align: center;
	font-size: 0.9em;
}
#sectorenmenu ul li a:hover {
	color: #EE3A43;
}




/* mailstage archief */
ul.nieuwsbrieven {
	margin-top:2em;
}


/* gevers footer */
#content #footer {
	background: #EE3A43;
	clear: both;
	min-height: 180px;
	width: 100%;
	z-index: 3;
	position: relative;
	margin-top: -150px;
}
#content #footer .footer-container {
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
	font-size: 0.8em;
}
#content #footer .footer-container .contact {
	position: absolute; 
	top: 0px;  
	right: 1em;
	height: 70px; 
	line-height: 70px;
	background: #0066A7; 
	padding: 0 2em;
	font-size: 1.3em; 
	color: #fff;
	font-family: "Palanquin Dark";
	transition: all 300ms;
	height: 0; overflow: hidden;
	padding-left: 50px;
	background-image: url('../images/icons/phone.png');
	background-size: 20px 20px;
	background-repeat: no-repeat;
	background-position: 5% 50%;
}
#content #footer .footer-container .contact span {
	color: #e1e6f3; 
	padding-right: 0.5em;
}
#content #footer .footer-container .contact span.of {
	padding-left: 0.5em;
}
#content #footer .footer-container .contact a {
	color: #fff; 
	text-decoration: none;
}
#content #footer.act .footer-container .contact {
	top: -70px; height: 70px;
}
#content #footer .footer-container .col {
	width: 33.333%; float: left;
	color: #E1E6F3;
	padding: 3em 0;
	line-height: 1.6;
}
@media screen and (max-width: 900px) {
		#content #footer .footer-container .col {
			width: 100%; 
			text-align: center;
			float: none;
			padding-bottom: 0;
		}
}
#content #footer .footer-container .col strong {
	display: block;
	padding-bottom: 1em;
	font-size: 1.1em;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-family: "Palanquin Dark";
	font-weight: normal;
}
#content #footer .footer-container .col.mailstage {
	/* background: #B0272D; */
	color: #E1E6F3;
	text-align: center;
	min-height: 180px;
	box-sizing: border-box;
}
#content #footer .footer-container .col.mailstage strong {
	
}
#content #footer .footer-container .col.mailstage form {
	width: 80%;
	margin: 0 auto;
	margin-top: -5px;
	position: relative;
}
#content #footer .footer-container .col.mailstage label.error {
	position: absolute;
	display: block;
	color: #B0272D;
	background: #E1E6F3;
	font-family: Verdana, Arial, sans-erif;
	font-size: 11px;
	padding: 2px 5px;
	border-radius: 0 0 2px 2px;
	top: 50px;
	left: 12px;
}
#ms-success {
	display: none;
}
#content #footer .footer-container .col.mailstage input {
	background: #efefef;
	padding: 10px;
	border: 0;
	font-family: inherit;
	box-sizing: border-box;
	float: left;
	height: 50px;
	line-height: 50px;
	font-size: 1em;
}
#content #footer .footer-container .col.mailstage input[type="email"] {
	width: 80%; 
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
#content #footer .footer-container .col.mailstage input[type="submit"] {
	width: 20%;
	background: #cd363d;
	color: #E1E6F3;
	padding: 0;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;

	background-image: url('../images/icons/signup.png');
	background-size: 20px 20px;
	background-position: 45% 50%;
	background-repeat: no-repeat;
	cursor: pointer;
}
#content #footer .footer-container .col.mailstage input[type="submit"]:hover {
	background-color: #B0272D;
	background-size: 24px 24px;	
}



.links a {
	display: block;
	padding-left: 20px;
	position: relative;
}
.links a:before {
	content: "› ";
	position: absolute;
	left: 0;
	top: 0px;
}


#socialcontent {
	margin-top: 2em;
	margin-bottom: 200px;
	background-image: url('../images/social/icon_twitter.png');
	background-position: 0px 23px;
	background-size:32px 32px;
	background-repeat: no-repeat;
	border-top: 3px solid #E1E6F3;
	padding-top: 1em;
}
#socialcontent h2 {
	padding-left: 40px;
	font-size: 1.4em;
	color: #EE3A43;
}
#socialcontent .item {
	padding: 2em 0;	
	border-bottom: 3px solid #E1E6F3;
	
}

#socialcontent .item .media {
	margin-bottom: 1em;
	background: #ccc;
}
#socialcontent .item img {
	display: block;
	width: 100%;
	opacity: 0.8;
}
#socialcontent .item span {
	font-weight: bold;
	display: block;
	color: #EE3A43;
	font-size:0.9em;
}

/* disable selection */

#submenu-open, #submenu, #nav
{
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}



/* extra download button support */
#support-download {
	position: absolute;
	left: 50%; top: 60%;
	color: #fff;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	  -moz-user-select: none;
	  -khtml-user-select: none;
	  -webkit-user-select: none;
	  user-select: none;	
	z-index: 9;
}

@media screen and (max-width: 900px) {
	#support-download {
		width: 90%;
	}
}
#support-download .button {
	background: #EE3A43;
	margin-top: 20px;
	background-image: url('https://gevers-it.nl/images/icons/buoy.png');
	background-size: 32px 32px;
	background-position: 15px 50%;
	background-repeat: no-repeat;
	line-height: 1;
	opacity: 0.2;
	pointer-events:none;
}
#support-download .button:nth-of-type(2) {
	background-image: url('https://gevers-it.nl/images/icons/logo_windows.png');
}
#support-download .button:nth-of-type(3) {
	background-image: url('https://gevers-it.nl/images/icons/logo_apple.png');
}
#support-download .button a {
	display: block;
	padding: 20px;
	border-radius: 3px;
	text-align: left;
	font-size: 1em;
	color: #fff;
	font-weight: bold;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding-left: 60px;
}
#support-download .button:hover {
	background-color: #B0272D;
}
#support-download .button.active {
	opacity: 1;
	pointer-events: all;
}
#support-download .check span {
	background: #fff;
	width: 20px;
	height: 20px;
	float: left;
	cursor: pointer;
	margin-right: 10px;
	border-radius: 2px;
	font-size: 0.9em;
	text-align: center;
	line-height: 20px;
	pointer-events:all;
}
#support-download .check.checked span {
	background: #006CA7; 
	color: #fff;
}


/* CAL CSS v1
div.calendar div.item.hide {
	display: none;
}
ul#catselect {
	list-style-type: none!important;
	width: 100%;
	margin-bottom: 1em;
}
ul#catselect li {
	display: block;
	background: #E1E6F3;
	color: #0066A7;
	font-family: "Palanquin Dark";
	font-size: 1.1em;
	font-weight: bold;
	margin: 0!important;
	list-style-type: none!important;
}
ul#catselect li.active {
	background: #EE3A43;
	color: #fff;
}
ul#catselect li a {
	display: block;
	position: relative;
	color: inherit;
	padding: .5em 1em;
} 
*/



#agenda-interface {
	background: #edf1fc;
	padding-top: 60px;
	max-width: 2000px;
	padding-bottom: 90px;
}

/* calendar (cursusagenda) */
div.calendar div.item {
	color: #000;
	
	border-bottom: 1px solid #ccc;
	height: 220px;
	width: 33.333%;
	float: left;

	background: #FFFFFF;
	padding: 2em;
	box-sizing: border-box;
	border-bottom: 2px solid #edf1fc;
	border-right: 2px solid #edf1fc;
	transition: all 300ms;
}
div.calendar div.item div.descr {
	width: 100%; float: left; clear: both;
	font-size: .8em;
	margin-top: .5em;
	line-height: 1.4;
}
div.calendar div.item div.specs div.spec {
	display: inline-block;
	margin-right: .5em;
}
div.calendar div.item img {
	float: right;
	margin: 0 0 1em 1em;
}
div.calendar div.item h3 {
	color: #0066a7;
	display: block;
	font-family: "Palanquin";
	font-weight: bold;
	text-align: center;
	font-size: 1em;
	text-align: left;
	margin-bottom: 10px;
}
div.calendar div.item h2 {
	color: #EE3A43;
	display: block;
	font-family: "Palanquin Dark";
	font-weight: bold;
	text-align: center;
	font-size: 1em;
	text-align: left;
	margin-bottom: 1em;
}
div.calendar div.item.hide {
	opacity: 0.3;
	transform: scale(0.9);
	-webkit-transform: scale(0.9);
}
div.calendar a.cta {
	background: #0066A7 url("../images/icons/signup.png") no-repeat scroll 10% 50% / 20px 20px;
	border: 0 none;
	border-radius: 3px;
	color: #e3e6f3;
	font-family: "Palanquin Dark";
	letter-spacing: 1px;
	margin: 1em auto 0;
	max-width: 190px;
	padding: 10px 10px 12px 40px;
	text-transform: uppercase;
	display: block;
	float:left;
	font-size: .9em;
	margin-right: 1em;
}
div.calendar a.cta:hover {
	background-color: #ee3a43;
}
div.calendar a.get-info {
	background: #0066A7 url("../images/icons/signup.png") no-repeat scroll 10% 50% / 20px 20px;
	border: 0 none;
	border-radius: 3px;
	color: #e3e6f3;
	font-family: "Palanquin Dark";
	letter-spacing: 1px;
	margin: 1em auto 0;
	max-width: 190px;
	padding: 10px 10px 12px 40px;
	text-transform: uppercase;
	display: block;
	float:left;
	font-size: .9em;
	margin-right: 1em;
	background-color: #888;
	color: #fff;
}
div.calendar a.get-info:hover {
	background-color: #666;
}



ul#catselect {
	list-style-type: none!important;
	width: calc(100% - 120px);
	background: #E1E6F3;
	height: 60px;
	position: fixed; right: 0; top: 0;
	line-height: 1;
	transition: all 300ms;
	-moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; 
	z-index: 9;
}
ul#catselect li {
	display: block;
	background: #E1E6F3;
	color: #0066A7;
	font-family: "Palanquin Dark";
	font-size: 0.8em;
	font-weight: bold;
	margin: 0!important;
	list-style-type: none!important;
	float: left;
}
ul#catselect li a:hover  {
	background:#c5ccde;;
}
ul#catselect li.active a:hover,
ul#catselect li.active {
	background: #EE3A43;
	color: #fff;
}
ul#catselect li a {
	display: block;
	position: relative;
	color: inherit;
	height: 60px;
	line-height: 60px;
	padding: 0 15px;
}
ul#catselect li.notice {
	height: 60px;
	line-height: 60px;
	color: #c5ccde;
	font-family: "Palanquin";
	padding: 0 10px;	
	font-weight: 400;
} 
ul#catselect li.notice:after {
	content: ":";
}

@media screen and (max-width: 1300px) {
	div.calendar div.item {
		width: 50%;
	}
	ul#catselect li {
		font-size: 0.7em;
	}
}


@media screen and (max-width: 900px) {

	#agenda-interface {
		padding-top: 100px;
		padding-bottom: 0px;
	}

	div.calendar div.item {
		width: 100%;
		min-height: 200px;
		height: auto;
	}

	ul#catselect {
		width: 100%;
		top: 60px;
		height: 40px;
	}
	ul#catselect li {
		width: 100%;
		box-sizing: border-box;
		display: none;
	}
	ul#catselect li a,
	ul#catselect li.notice {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;	
		line-height: 40px;
		height: 40px;
		font-size: 13px;	
	}
	ul#catselect li.notice {
		color: #fff;
		display: block;
		cursor: pointer;
		text-align: center;
		background: #B0272D;
		height: 50px;
		line-height: 50px;
	}
	ul#catselect li.notice:after {
		content: " trainingen:";
	}	
	ul#catselect.active li {
		display: block;
	}

	div.calendar a.cta,
	div.calendar a.get-info {
		font-size: 12px;
		margin-top: 10px;
	}


}