/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}


/* #Basic Styles
================================================== */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

body { color: #444; -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; font-family: 'Raleway', sans-serif; font-weight:400; font-size: 13px; line-height: 21px; }

h1, h2, h3, h4, h5, h6 { color: #2D83C7; font-family: 'Raleway', sans-serif; font-weight: 400; text-transform: uppercase; }
h1 { font-size: 36px;line-height: 42px;}
h2 { font-size: 30px;line-height: 35px; margin: 35px 0 7px 0; text-align:center;}
h3 { font-size: 20px;line-height: 28px; margin: 21px 0 21px 0; }
h4 { color: #efefef; font-size: 32px; line-height: 42px; margin: 42px 0 21px 0;}
h4 span { color: #2D83C7; font-size: 32px; line-height: 42px; }
h5 { font-size: 17px; line-height: 28px; margin: 21px 0 21px 0;}
h6 { font-size: 16px; line-height: 21px; margin: 14px 0 14px 0; font-family: 'Oswald', sans-serif; }

.subheader { color: #2D83C7; }
p { margin: 20px 0 20px 0;}
p img { margin: 0; }
p.lead { font-size: 21px; line-height: 27px; color: #2D83C7; }
p span { font-weight: bold; color: #2D83C7; }
em { font-style: italic; }
strong { font-weight: bold; color: #000000; }
small { font-size: 80%; }

/*hr { border: solid #ddd; clear: both; border-width: 1px 0 0; margin: 10px 0 30px; height: 0; } Base styling skeleton*/
hr { border: none; background-color: #dddddd; height: 1px; margin: 0 10px 21px 10px; clear: both; }
hr.wide { border: none; background-color: #dddddd; height: 1px; margin: 0 0 35px 0; clear: both; }

/*	Blockquotes  */
blockquote, blockquote p { font-size: 17px; line-height: 21px; color: #2D83C7; font-style: italic; }
blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 6px solid #2D83C7; }
blockquote cite { display: block; font-size: 12px; color: #2D83C7; }
blockquote cite:before { content: "\2014 \0020"; }
blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; }

/* #Links
================================================== */
a, a:visited { color: #2D83C7; text-decoration: none; outline: 0; }
a:hover, a:focus { color: #444444; }
p a, p a:visited { line-height: inherit; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { text-decoration:none; }

/* #Lists
================================================== */
ul, ol { margin-bottom: 21px; font-size: 12px;}
ul { list-style: none outside; }
ol { list-style: decimal; }
ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
ul.square { list-style: square outside; }
ul.circle { list-style: circle outside; }
ul.disc { list-style: disc outside; }
ul ul, ul ol,
ol ol, ol ul { margin: 7px 0 7px 30px;  }
ul ul li, ul ol li,
ol ol li, ol ul li { margin-bottom: 7px; }
li { line-height: 14px; margin-bottom: 7px; }
ul.large li { line-height: 21px; }
li p { line-height: 21px; }

ul.image li{ padding: 3px 0 2px 38px; list-style: none; background: url(../images/checkmark.png) no-repeat top left; }

/* #Images
================================================== */
/*img.scale-with-grid {max-width: 100%; height: auto;} Base styling skelton*/

img.scale {border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom; 
/* Responsive images */
max-width: 100%;
height: auto; //IE8 fix
width: auto; //IE8 fix}

img.scale-50 {border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom; 
/* Responsive images */
max-width: 35%;
height: auto; //IE8 fix
width: auto; //IE8 fix}

img.border {padding: 5px; border: 1px solid #ddd; background: #efefef; line-height: 0; }
img.circle {-webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%;} 

img.left, p img.left, p a img.left {float: left; margin: 0 14px 7px 0;}
img.right, p img.right, p a img.right {float: right; margin: 0 0 7px 14px;}
img.top, p img.top, a img.top, p a img.top {margin: 14px 0 7px 0; display:block;}

.gallery {}
.gallery img {	float:left;	padding: 2px; border: 1px solid #ffffff; background: #ffffff; line-height: 0;  margin: 4px 4px 0 0;}

		
/* #Buttons
================================================== */

.button, button, input[type="submit"], input[type="reset"], input[type="button"] {background: #eee; /* Old browsers */ background: #eee -moz-linear-gradient(top, rgba(255,255,255,.2) 0%, rgba(0,0,0,.2) 100%); /* FF3.6+ */ background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.2)), color-stop(100%,rgba(0,0,0,.2))); /* Chrome,Safari4+ */ background: #eee -webkit-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Chrome10+,Safari5.1+ */ background: #eee -o-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Opera11.10+ */ background: #eee -ms-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* IE10+ */ background: #eee linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* W3C */ border: 1px solid #aaa; border-top: 1px solid #ccc; border-left: 1px solid #ccc; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; color: #444; display: inline-block; font-size: 11px; font-weight: bold; text-decoration: none; text-shadow: 0 1px rgba(255, 255, 255, .75); cursor: pointer; margin-bottom: 20px; line-height: normal; padding: 8px 10px; }
.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover {color: #222; background: #ddd; /* Old browsers */ background: #ddd -moz-linear-gradient(top, rgba(255,255,255,.3) 0%, rgba(0,0,0,.3) 100%); /* FF3.6+ */ background: #ddd -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.3)), color-stop(100%,rgba(0,0,0,.3))); /* Chrome,Safari4+ */ background: #ddd -webkit-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Chrome10+,Safari5.1+ */ background: #ddd -o-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Opera11.10+ */ background: #ddd -ms-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* IE10+ */ background: #ddd linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* W3C */ border: 1px solid #888; border-top: 1px solid #aaa; border-left: 1px solid #aaa; }
.button:active, button:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active {border: 1px solid #666; background: #ccc; /* Old browsers */ background: #ccc -moz-linear-gradient(top, rgba(255,255,255,.35) 0%, rgba(10,10,10,.4) 100%); /* FF3.6+ */ background: #ccc -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.35)), color-stop(100%,rgba(10,10,10,.4))); /* Chrome,Safari4+ */ background: #ccc -webkit-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* Chrome10+,Safari5.1+ */ background: #ccc -o-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* Opera11.10+ */ background: #ccc -ms-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* IE10+ */ background: #ccc linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* W3C */ }
.button.full-width, button.full-width, input[type="submit"].full-width, input[type="reset"].full-width, input[type="button"].full-width { width: 100%; padding-left: 0 !important; padding-right: 0 !important; text-align: center; }
/* Fix for odd Mozilla border & padding issues */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0;}

/* #Forms
================================================== */

form {margin-bottom: 20px;}
fieldset {margin-bottom: 20px;}
input[type="text"], input[type="password"], input[type="email"], textarea, select {border: 1px solid #ccc; padding: 6px 4px; outline: none; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-size: 13px; color: #333333;margin: 0; width: 210px; max-width: 100%; display: block; margin-bottom: 5px; background: #fff;}
select {padding: 0;}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus {border: 1px solid #aaa; color: #444; -moz-box-shadow: 0 0 3px rgba(0,0,0,.2); -webkit-box-shadow: 0 0 3px rgba(0,0,0,.2); box-shadow:  0 0 3px rgba(0,0,0,.2);}
textarea {min-height: 60px;}
label, legend {display: block; font-weight: bold; font-size: 13px;}
select {width: 220px;}
input[type="checkbox"] {display: inline;}
label span, legend span {font-weight: normal; font-size: 13px; color: #efefef; }

/* #Misc
================================================== */
.remove-bottom { margin-bottom: 0 !important; }
.half-bottom { margin-bottom: 10px !important; }
.add-bottom { margin-bottom: 20px !important; }	
.double-bottom { margin-bottom: 40px !important; }	

/* #Navigation
================================================== */
#mobile-header {display: none; float:right; margin:30px 20px 0 0;} 
#nav-main {}
#nav-main ul {list-style-type: none; padding: 0; float:right;font-size:0;margin-top:70px; }
#nav-main li {display: inline-block; }
#nav-main li:last-child {}
#nav-main a {display: block;color: #282A2B;padding: 10px 22px; text-decoration: none; font-family: 'Raleway', sans-serif; font-weight:400; text-transform: uppercase; font-size: 16px; }
#nav-main a:hover {background:#2D83C7; color:#ffffff; }
#nav-main a.current{ background:#2D83C7; color:#ffffff;}

.sidr ul li a, .sidr ul li span {font-family: 'Raleway', sans-serif; font-weight:400; text-transform: uppercase; font-size: 16px;}
 
/* Social media links */
nav.social-nav ul {float:left;margin:0 15px 0 0;}
nav.social-nav ul li{list-style: none; float: left; padding:0 3px 0 3px;}
nav.social-nav ul li:hover {opacity:.5;}

/*Language choice*/
nav.secondary ul {margin: 5px 0 0 0; width: auto; float:right; clear:right;}
nav.secondary li {list-style:none; display:inline;}
nav.secondary li a {padding-left:5px;}
nav.secondary ul li a:hover {opacity:.5;}

/*My flexslider styles*/
.flexslider { background: #444444; border: 1px solid #555555; padding:5px; margin-bottom:30px;}
.flexslider .slides li {margin-bottom:0;}
.flex-control-paging li a:hover { background: #2D83C7; background-color: rgba(233,106,25,0.7); }
	
/* Caption style */
/* IE rgba() hack */ 
.flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;}

.flex-caption {width: 50%; padding: 0.5% 2% 0.5% 2%; margin: 0; position: absolute; left: 0; bottom: 40px; background: rgba(0,0,0,.3); color:#ffffff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-family: 'Raleway', sans-serif; font-weight:400; text-transform: uppercase; }
.flex-caption h1{font-size: 21px; line-height: 35px; color:#ffffff;}
.flex-caption p{font-size: 16px;}
.flex-caption ul li{font-size:18px; line-height: 21px;}

/* #Easytabs aanpassing
================================================== */

.resp-tab-content {overflow:hidden;}
.resp-tabs-container {background-color: #343434; margin-bottom:20px;}
.resp-tab-content {border: 1px solid #555555;}
.resp-tab-active {background-color: #343434;border-color: #555555 #555555 -moz-use-text-color;}
.resp-tab-content img { display: block; margin: 0 auto; }
.resp-tab-content .employee-container {float:left; margin:0 20px 0 0; width:190px;}
.resp-tab-content .employee-container h3{font-size: 13px; line-height: 21px; margin: 7px 0 7px 0;text-align:center;}
.resp-tab-content .employee-container p{font-size:12px; text-align:center;}
/*-----------Accordion styles-----------*/
h2.resp-accordion {font-size: 13px; border: 1px solid #555555; border-top: 0px solid #555555; margin: 0px;padding: 10px 15px;}
h2.resp-tab-active {background: #343434 !important;}
.resp-easy-accordion .resp-tab-content {border: 1px solid #555555;}
.resp-easy-accordion .resp-tab-content:last-child {border-bottom: 1px solid #555555 !important;}
h2.resp-accordion:first-child {border-top: 1px solid #555555 !important;}
/*-----------Vertical tabs-----------*/
.resp-vtabs .resp-tabs-container {background-color: #343434; border: 1px solid #555555;}
.resp-vtabs li.resp-tab-active {border: 1px solid #555555; background-color: #343434;}
.resp-arrow {border-top: 12px solid #555555;}
h2.resp-tab-active span.resp-arrow {border-bottom: 12px solid #9B9797;}

/* #Accordion - http://www.unwrongest.com
================================================== */

.accordion {overflow:hidden; border-left: 1px solid #333333; border-bottom: 1px solid #333333; border-right: 1px solid #333333; margin-top:20px;}
.accordion ul { padding: 0; margin: 0; float: left; display: block; width: 100%; }
.accordion li { background: #000000; cursor: pointer; list-style-type: none; padding: 0; margin: 0; float: left; display: block; width: 100%;}
.accordion li.active>a { background: url('../images/close-accordion.gif') no-repeat center right; color:#dddddd;}
.accordion li div { padding: 10px; display: block; clear: both; float: left; font-size:13px; line-height:22px; color:#dddddd;/*width: 100%;*/}
.accordion li div span { }
.accordion li div h1 {font-size: 14px; font-weight:normal; line-height: 21px; margin: 10px 0 0 0; font-family: Arial, Helvetica, sans-serif;}
.accordion li div em { font-style: italic; margin-top: 10px;}
.accordion a { font-family: 'Raleway', sans-serif; font-weight:400; text-transform: uppercase; color: #ffffff; border-top: 1px solid #333333; font-size: 18px; text-decoration: none; padding: 20px 10px; display: block; cursor: pointer; background: url('../images/open-accordion.gif') no-repeat center right; }
.accordion a.last{ }
.accordion a:hover {color:#dddddd;}


/* Level 2 */
.accordion li ul li { background: #444444;}
.accordion li ul li div { padding: 10px 10px 10px 20px;}
.accordion li ul li a{ font-size: 14px; padding: 20px 10px 20px 10px; color: #ffffff;}

/* #Validation Styles*/
================================================== 
.LV_validation_message{font-weight:bold;font-size:12px;margin:0 0 0 5px;}
.LV_valid {font-weight:bold;font-size:12px;color:#00CC00;}
.LV_invalid {font-weight:bold;font-size:12px;color:#CC0000;}

.LV_valid_field,
input.LV_valid_field:hover, 
input.LV_valid_field:active,
textarea.LV_valid_field:hover, 
textarea.LV_valid_field:active {border: 1px solid #00CC00;}
    
.LV_invalid_field, 
input.LV_invalid_field:hover, 
input.LV_invalid_field:active,
textarea.LV_invalid_field:hover, 
textarea.LV_invalid_field:active {border: 1px solid #CC0000;}

input[type="text"],input[type="password"],input[type="email"],textarea,select {margin-bottom:5px;}	

/* #Site Styles
================================================== */
html {height:100%;}
body { margin: 0; background-color:#ffffff; height:100%;}
#wrapper {width:980px; max-width: 100%; margin:0 auto; background: rgba(0,0,0,.6);}

.fullnav { width: 100%; postion: relative; background-color: #ffffff; height: 160px;}
.fullpage {width:100%;position:relative;}
.full-bg {width:100%; height:700px;position:relative;}

#over.background { min-height: 100%; background-color: #ffffff; overflow: hidden; /*background-attachment: fixed; background-image: url(../images/backgrounds/wood.jpg); background-repeat: repeat; background-position: left top;*/ }
#cursussen.background { min-height: 100%; background-color: #444; overflow: hidden; background-attachment: fixed; background-image: url(../images/backgrounds/bg_grayjean.png); background-repeat: repeat; background-position: left top; }
#contact.background { min-height: 100%; padding-bottom: 100px; background-color: #ffffff; overflow: hidden; }

.hometext {text-align:center; margin:200px auto 0 auto; width: 80%;}
.hometext h1 { text-align: center; font-size: 42px; line-height: 56px; color: #ffffff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); margin:0; padding: 80px 20px;}

.btn2 {font-family:'Raleway', sans-serif; font-weight:400; text-transform: uppercase; background: none; color: #ffffff; font-size: 18px; padding: 7px 15px; border: solid #ffffff 1px; text-decoration: none;}
a.btn2 {color:#000000;}
.btn2:hover {background:#dddddd; text-decoration: none; color:#ffffff;}

.btn {background-image: url("../images/arrow_down.png");bottom: 0;display: block;height: 51px;left: 50%;margin-left: -76px;position: absolute;width: 152px;z-index: 8; }

.fadeIn{animation-name: fadeIn;-webkit-animation-name: fadeIn;	animation-duration: 5.0s;	-webkit-animation-duration: 5.0s;animation-timing-function: ease-in-out-webkit-animation-timing-function: ease-in-out;visibility: visible !important;	}

@keyframes fadeIn {
	0% {transform: scale(0);opacity: 0.0;}
	/*60% {transform: scale(1.1);	}
	80% {transform: scale(0.9);opacity: 1;}*/	
	100% {transform: scale(1);opacity: 1;}		
}

@-webkit-keyframes fadeIn {
	0% {-webkit-transform: scale(0);opacity: 0.0;}
	/*60% {-webkit-transform: scale(1.1);}
	80% {-webkit-transform: scale(0.9);opacity: 1;}	*/
	100% {-webkit-transform: scale(1);opacity: 1;	}		
}

.topmargin {margin-top:160px;}
.background { }
.button.full-width{margin-top:5px;}
.transp { background: transparent;}

h1.logo {float: left; margin: 20px 0 0 0;}
h1.logo a { width: 140px; height: 121px; display: block; background: url(../images/piext-logo.png) no-repeat 0 0; 
/*http://nicolasgallagher.com/another-css-image-replacement-technique/*/ font: 0/0 a; text-shadow: none; color: transparent; }

.box{padding:20px !important; background:rgb(0,0,0); background: transparent\9; background:rgba(0,0,0,0.7); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000,endColorstr=#b2000000); zoom: 1;}
.box:nth-child(n) {	filter: none;}
/* opacity: http://hammerspace.co.uk/2011/10/cross-browser-alpha-transparent-background-css */

.right {float:right;}
.left {float:left;}
.hide {display:none;}
.center {text-align: center;}

a.button:link {color: #222222; text-decoration: none; }
a.button:visited {color: #444444; text-decoration: none; }
a.button:hover {color: #444444; text-decoration: none; }
a.button:active {color: #444444; text-decoration: none; }

.footer {}
.footer p{ font-size: 10px; line-height: 14px; text-align: left; color: #aaa; padding: 6px 0 0 0; }
[class*="el-icon-"] {margin-right: 10px;color:#2D83C7;}
[class*="el-icon-lines"] {font-size:30px;}


/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
	.full-bg {height:500px;}
	.hometext h1 { font-size: 36px; line-height: 42px; padding: 20px 10px;}	
	#mobile-header {display: block;}
	#nav-main{display:none;}
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
	.full-bg {height:400px;}
	hr {margin: 0 0 21px 0;}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
	.hometext {text-align:center; margin:200px auto 0 auto; width: 75%;}
	.hometext h1 { font-size: 20px; line-height: 24px; padding: 20px 10px;}
	img.scale-50 {max-width: 40%;}
	}
	
	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
	.hometext {text-align:center; margin:200px auto 0 auto; width: 95%;}
	.hometext h1 { font-size: 18px; line-height: 21px; padding: 0 10px;}
	img.scale-50 {max-width: 50%;}
	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */


	
/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/