/*
Theme Name: Deducation
Theme URI: http://www.deducation.nl
Description: Template voor Deducation
Version: 1.0
Author: Roel Beekmans
Author URI: http://www.skyhighmedia.nl/
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

html {
	font-size: 62.5%;
}

body {
    margin : 0 auto;
	padding : 0;
	font-family: 'Dosis', sans-serif;
	color : #202020; 
	font-size: 1.9em;
	letter-spacing: 0.3px;
    line-height: 160%;
	width:100%;
	height:100%;
	background:#fff;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
	display: block;
	position: relative;
}

nav ul {
    list-style: none;
}

.wrapperMain {
    margin: 0 auto;
	padding:0;
    max-width: 1200px;
    width: 100%;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.7);
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.7);
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.7);
}

.wrapper {
    margin: 0 auto;
	padding:0 5%;
    max-width: 1600px;
    width: 90%;
}

.wrapperXS {
    margin: 0 auto;
	padding:0 5%;
    max-width: 800px;
    width: 90%;
}

.wrapperS {
    margin: 0 auto;
	padding:0 5%;
    max-width: 1200px;
    width: 90%;
}

.wrapperL {
    margin: 0 auto;
	padding:0 3%;
    width: 94%;
}

.clear {
    clear:both;
}

iframe {
    width: 100%;
	vertical-align: top;
}

/* HEADER ============================================================================= */

#header {
	margin: 0;
    position: relative;
    z-index: 10;
	width:100%;
}

#headerLogo a:hover {
	background:none;
}

#headerMenu {
	background: #fff none repeat scroll 0 0;
    border-bottom: 10px solid #004487;
    font-family: "Dosis",sans-serif;
    left: -9999px;
    margin: auto;
    max-width: 1200px;
    min-height: 53px;
    padding: 15px 0;
    position: fixed;
	top: 15px;
    right: -9999px;
    z-index: 1000;
}

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

	#headerMenu {
		width:100%;
		padding: 15px 0 17px;
	}
	
}

#headerMenu .ubermenu .ubermenu-target-text {
    font-weight: 500;
}

#headerMenu .col{
	margin:0;
}

#headerMenu .span_1_of_2{
	width:50%;
}

#headerMenu #menuL{
	padding:0 0 0 25px;
}

#headerMenu #menuR{
	padding:0 25px 0 0;
}

#headerLogo {
	width:300px;
	height:68px;
	left: -9999px;
    margin: auto;
    position: absolute;
    right: -9999px;
	z-index:30;
	top:15px;
	background:#fff;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

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

	#headerMenu .span_1_of_2 {
		width:100%;
	}

	#headerMenu #menuL{
		padding:0;
	}
	
	#headerMenu .ubermenu-responsive-toggle-hoofdmenu-rechts{
		display:none;
	}
	
	#headerMenu .ubermenu-target {
		font-size: 20px;
	}
	
}

.ubermenu-responsive-toggle .fa {
    font-size: 2em;
}

.rsUni, .rsUni .rsOverflow, .rsUni .rsSlide, .rsUni .rsVideoFrameHolder, .rsUni .rsThumbs {
    background: #fff;
}

/* CONTENT ============================================================================= */

#content {
	padding:8em 0 1em;
}

.page-template-page_contact #content {
	padding:5.8em 0 0;
}

#headerSliderPage  {
	height:200px;
	background:#dcdcdc;
}

#headerSliderPage h1 {
	top:52%;
}

blockquote {
	border-bottom: 1px solid lightgray;
    border-top: 1px solid lightgray;
    display: flex;
    font-size: 1.7em;
    margin: 0 0 0.7em;
    padding: 10px 0;
}

blockquote p {
	margin:0 0 0.2em 0;
}

/* DIENSTEN ============================================================================= */

#diensten {
	margin:2em 0;
}

#diensten  .button{
	margin:2em 0 0;
}

/* HOME INTRO ============================================================================= */

#homeIntro {
	margin:2em 0;
}

#homeIntro  .col {
    margin-bottom:0;
}

#homeIntro .span_2_of_7 {
	padding:35px 0 0;
}

#homeIntro .span_2_of_7 a:hover {
	background:none;
}

.highlights {
	position:relative;
	color:#fff;
	padding:4em 0 3.5em;
	margin:0;
}

.highlights.hlv1 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1fa2da+0,1fa2da+50,2077bd+50,2077bd+100 */
	background: #1fa2da; /* Old browsers */
	background: -moz-linear-gradient(left,  #1fa2da 0%, #1fa2da 50%, #2077bd 50%, #2077bd 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #1fa2da 0%,#1fa2da 50%,#2077bd 50%,#2077bd 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #1fa2da 0%,#1fa2da 50%,#2077bd 50%,#2077bd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1fa2da', endColorstr='#2077bd',GradientType=1 ); /* IE6-9 */
}

.highlights.hlv2 {
	background: #2077bd; /* Old browsers */
	background: -moz-linear-gradient(left,  #2077bd 0%, #2077bd 50%, #1fa2da 50%, #1fa2da 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #2077bd 0%,#2077bd 50%,#1fa2da 50%,#1fa2da 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #2077bd 0%,#2077bd 50%,#1fa2da 50%,#1fa2da 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1fa2da', endColorstr='#1fa2da',GradientType=1 ); /* IE6-9 */
}

.highlights.hlv3 {
	background: #fff; /* Old browsers */
	background: -moz-linear-gradient(left,  #fff 0%, #fff 50%, #f4f4f4 50%, #f4f4f4 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #fff 0%,#fff 50%,#f4f4f4 50%,#f4f4f4 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #fff 0%,#fff 50%,#f4f4f4 50%,#f4f4f4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#f4f4f4',GradientType=1 ); /* IE6-9 */
}

.highlights.hlv3,
.highlights.hlv3 h2 {
	color:#202020;
}


.highlights h2{
	color:#fff;
}

.highlights .col{
	position:relative;
}

.highlights .imgCon {
	padding:0;
	width:200px;
	height:200px;
	border: 10px solid #fff;
    border-radius: 50%;
	display:inline-block;
	background:#fff;
	transform: scale(1.0);
    transition: all 0.2s ease-in-out 0s;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
}

.page-template-page_home .imgCon {
	position:absolute;
	padding:0;
	margin:auto;
	width:200px;
	height:200px;
	left:-9999px;
	right:-9999px;
	bottom:-110px;
	z-index:99;
}

.page-template-page_coaches h2 {
	font-size:1.4em;
	margin: 0 0 10px;
}

.page-template-page_coaches h3 {
	font-size:1.0em;
}

.page-template-page_coaches .imgCon {
	border: 5px solid #fff;
	margin:0 0 35px 0;
}

.highlights .imgCon:hover {
	transform: scale(1.3);
}

.page-template-page_coaches .imgCon:hover {
	transform: scale(1.0);
}

.highlights img{
    border-radius: 50%;
	vertical-align:bottom;
}

.highlights a.button:link, .highlights a.button:visited{
	color:#fff;
	background:none;
	border:2px solid #fff;
}

.highlights a.button:hover, .highlights a.button:active{
	text-decoration: none;
	color:#2077bd;
	background:#fff;
	border:2px solid #fff;
}

.homeButton {
	float:right;
	margin:40px 0 15px 15px;
}

.homeButton a:hover,
.homeButtonMob a:hover {
	background:none;
}

.homeButtonMob {
	display:none;
}

/* BLOKKEN ============================================================================= */

.blokken .span_1_of_3 {
    width: 33.33%;
}

.blokken .span_1_of_4 {
    width: 25%;
}

.blokken .col {
    margin:0;
}

.blokken .blauw{
	background:#f4f4f4;
}

.blokken .lichtblauw{
	background:#fff;
}

.blokkenTxt {
	width:80%;
	margin: 3em auto;
	text-align:center;
}

.blokken a.button:link, .blokken a.button:visited{
	color:#202020;
	background:none;
	border:2px solid #202020;
}

.blokken a.button:hover, .blokken a.button:active{
	text-decoration: none;
	color:#fff;
	background:#202020;
	border:2px solid #202020;
}

.blokken .imgCon {
	padding:0;
	margin:0 0 35px 0;
	width:200px;
	height:200px;
	border: 5px solid #fff;
    border-radius: 50%;
	display:inline-block;
	background:#fff;
	transform: scale(1.0);
    transition: all 0.2s ease-in-out 0s;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
}

.blokken img{
    border-radius: 50%;
	vertical-align:bottom;
}

.page-template-page_contact .blokkenTxt {
    text-align:left;
}

.page-template-page_contact .span_1_of_2 {
    width: 50%;
}

/* COACHES ============================================================================= */

.page-template-page_coaches .highlights h2 {
	margin: 0 0 5px;
}

.page-template-page_coaches .highlights h3 {
	margin: 0 0 25px;
	color:#fff;
}

/* BLOG */

#blog {
	padding:8em 0 2em;
}

#blog .entry {
	padding:0 0 2em;
	margin:0 0 2em;
	border-bottom:1px solid #dadada;
}

#blog h2 {
	padding:0;
	margin:0;
}

#blog .metadata {
	padding:0 0 0.5em 0;
	margin:0 0 1em 0;
	border-bottom:1px solid #f4f4f4;
}

.imgCon {
	padding:0;
	width:auto;
	height:auto;
	border: 5px solid #fff;
    border-radius: 50%;
	display:inline-block;
	background:#fff;
	transform: scale(1.0);
    transition: all 0.2s ease-in-out 0s;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3);
}

.imgConBig {
	float:right;
	width:300px !important;
	height: 300px !important;
	margin:40px 0 25px 50px;
}

.imgCon img{
	width: 100%;
    border-radius: 50%;
	vertical-align:bottom;
}

.imgCon a:hover{
	background:none;
}

/* HOME DRIEHOEK ============================================================================= */

#driehoek {
	margin:10em 0;
	text-align:center;
}

.contentBorder {
	position:relative;
	padding:40px 40px 30px 40px;
	border:2px solid #202020;
}

#driehoekCon {
	position:absolute;
	top:-80px;
	left:-200px;
}

#driehoekTxt {
	float:right;
}

#driehoekConMob {
	display:none;
}

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

	#driehoekCon {
		left: -180px;
		top: -80px;
		transform: scale(0.8);
	}
	
}

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

	#driehoekCon {
		top: -100px;
	}

	#driehoekTxt {
		width:50%;
	}
	
}

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

	#driehoekCon {
		top: -100px;
	}

	#driehoekTxt {
		width:40%;
	}
	
}

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

	#driehoek {
		margin: 4em 0;
		text-align: center;
	}

	#driehoek .wrapperS {
		padding:0 5%;
		width: 90%;
	}
		
	#driehoekCon {
		left: auto;
		position: relative;
		top: auto;
		margin: -200px 0 0;
	}

	#driehoekTxt {
		float:none;
		width:100%;
	}

}	

/* FOOTER ============================================================================= */

#footer {
	font-family: 'Dosis', sans-serif;
    background: #074559;
    color: #fff;
	margin:0;
	padding:3em 0 2em;
	text-align: center;
}

#footer h2, 
#footer h3{
    color: #fff;
}

#footer i{
    background: #fff;
	color:#074559;
	height:20px;
	width:20px;
	margin:0 5px;
	padding:5px 3px 1px;
	font-size: 0.8em;
    border-radius: 50%;
	text-align:center;
	transition: all 0.2s ease-in-out 0s;
}

#footer a:hover i{
    background: #074559;
	color:#fff;
	transition: all 0.2s ease-in-out 0s;
}

#footerCopy {
	font-family: 'Dosis', sans-serif;
    background: #04232e;
    color: #fff;
	padding:0;
	font-size:0.8em;
	text-align:center;
}

#footerCopy p {
    margin:0;
	padding:5px 0;
}

#footer a:link, #footer a:visited,
#footerCopy a:link, #footerCopy a:visited{
	color:#fff;
	text-decoration: none;
}

#footer a:hover, #footer a:active,
#footerCopy a:hover, #footerCopy a:active{
	color:#ff;
	text-decoration: underline;
	background:none;
}

/* TEXT ============================================================================= */

p, td {
    line-height: 1.5em;
    margin-bottom: 1em;
	font-weight:300;
}

td p {
    font-size: 1.0em;
}

ul,ol {
    margin:1em 0 1em 2em;
	padding:0;
}

li {
    margin:0;
	padding:0 0 0 1em;
	text-align: left;
}

a:link, a:visited{
	color:#1fa2da;
	text-decoration: none;
}

a:hover, a:active{
	color:#fff;
	text-decoration: none;
	background:#1fa2da;
}

h1 {
	font-family: 'Dosis', sans-serif;
	font-weight: 500;
    color: #202020;
    font-size: 1.8em;
    padding: 0 0 15px;
	letter-spacing:0.005em;
}

h2 {
	font-family: 'Dosis', sans-serif;
	font-weight: 500;
    color: #202020;
    font-size: 1.4em;
    margin: 0 0 15px;
	letter-spacing:0.005em;
}

h3 {
	text-transform:none;
	font-family: 'Dosis', sans-serif;
	font-weight: 500;
    color: #202020;
    font-size: 1.2em;
    margin: 0 0 15px;
	letter-spacing:0.005em;
}

h4 {
    text-transform:none;
	font-family: 'Dosis', sans-serif;
	font-weight: 500;
    color: #202020;
    font-size: 1.0em;
    margin: 0 0 15px;
	letter-spacing:0.005em;
}

.gallery {
    margin: 0 0 1.5em 0 !important;
}

hr {
    margin: 2em 0 2em;
}

.alignright {
    text-align:right;
}

.aligncenter {
    text-align:center;
}

a.button:link, a.button:visited{
	font-family: 'Dosis', sans-serif;
	font-weight:500;
	font-size:1.0em;
	display: inline-block;
	padding:10px 15px;
	margin:0;
	color:#202020;
	text-decoration: none;
	background:#fff;
	border:2px solid #202020;
}

a.button:hover, a.button:active{
	text-decoration: none;
	color:#fff;
	background:#202020;
	border:2px solid #202020;
}

/* FORMULIEREN ============================================================================= */

.gform_wrapper form li, .gform_wrapper li {
    padding:0;
}

input[type="email"], input[type="text"], textarea {
    border: medium none;
}

input[type="submit"] {
	font-family: 'Dosis', sans-serif;
	font-size:1.0em !important;
	display: inline-block;
	padding:10px 15px;
	margin:0;
	color:#202020;
	text-decoration: none;
	background:none;
	text-shadow: none;
	box-shadow:none;
	border-radius:0;
	border:1px solid #202020;
	transition: all .2s ease-in-out;
}

input[type="submit"]:hover {
    text-decoration: none;
	color:#fff;
	background:#202020;
	border:1px solid #202020;
	transition: all .2s ease-in-out;
}

input, textarea {
    background: #fff none repeat scroll 0 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    font-size: 1em;
    margin: 0;
    padding: 5px;
}

.gform_wrapper .top_label input.medium, .gform_wrapper .top_label select.medium {
    width: 100% !important;
}

.gform_wrapper textarea.medium {
    width: 100% !important;
}

.page-template-page_contact .gform_wrapper {
    margin: 0;
}

.page-template-page_contact .gform_wrapper .top_label .gfield_label {
	display:none;
}

body .gform_wrapper label.gfield_label + div.ginput_container {
    margin: 0 0 1em;
}

/* IMAGES ============================================================================= */

img {
border : 0;
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
}

img.alignleft {
    float: left;
    margin-bottom: 1em;
    margin-right: 2em;
}

img.alignright {
    float: right;
    margin-bottom: 1em;
    margin-left: 2em;
}

.wp-caption {
    position: relative;
	width:auto !important;
}

.wp-caption-text {
    background: #95C739;
    bottom: 0;
    color: #000000;
    display: block;
    left: 0;
	margin:0;
    padding: 0.5%;
    position: absolute;
    width: 99%;
}


.gallery img {
    border: none !important;
}

/* TABELLEN ============================================================================= */

/* 
	Generic Styling, for Desktops/Laptops 
	*/
	table { 
		width: 100%; 
		border-collapse: collapse;
		margin: 0 0 0.5em;
	}
	
	#content table { 
		width: 100%; 
		border-collapse: collapse;
		margin: 0 0 1.5em;
	}
	
	/* Zebra striping
	tr:nth-of-type(even) { 
		background: #474747; 
	}*/
	th { 
		font-weight: bold; 
	}
	td, th { 
		padding: 0 10px; 
		border: none; 
		text-align: left; 
		vertical-align:top;
		text-align:center;
	}

/* 
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media 
only screen and (max-width: 1024px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: none; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: none; 
		position: relative;
		
	}
	
}

/* FONTS ============================================================================= */

@font-face {
    font-family: 'montserratblack';
    src: url('fonts/montserrat-black-webfont.eot');
    src: url('fonts/montserrat-black-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/montserrat-black-webfont.woff') format('woff2'),
         url('fonts/montserrat-black-webfont.woff') format('woff'),
         url('fonts/montserrat-black-webfont.ttf') format('truetype'),
         url('fonts/montserrat-black-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratbold';
    src: url('fonts/montserrat-bold-webfont.eot');
    src: url('fonts/montserrat-bold-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/montserrat-bold-webfont.woff') format('woff2'),
         url('fonts/montserrat-bold-webfont.woff') format('woff'),
         url('fonts/montserrat-bold-webfont.ttf') format('truetype'),
         url('fonts/montserrat-bold-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratlight';
    src: url('fonts/montserrat-light-webfont.eot');
    src: url('fonts/montserrat-light-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/montserrat-light-webfont.woff') format('woff2'),
         url('fonts/montserrat-light-webfont.woff') format('woff'),
         url('fonts/montserrat-light-webfont.ttf') format('truetype'),
         url('fonts/montserrat-light-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratregular';
    src: url('fonts/montserrat-regular-webfont.eot');
    src: url('fonts/montserrat-regular-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/montserrat-regular-webfont.woff') format('woff2'),
         url('fonts/montserrat-regular-webfont.woff') format('woff'),
         url('fonts/montserrat-regular-webfont.ttf') format('truetype'),
         url('fonts/montserrat-regular-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* METERS ============================================================================= */

.contentGrey {
	padding:3em 0 1em;
	text-align:center;
	background:#f4f4f4;
}

.chart-container  {
    margin:0;
	padding:0;
}

.chart-container p,
.chart-container h2,
.chart-container h3  {
    text-align:center;
}

.chart-container .pr-chart-ctrl {
    display:block; 
    float:left; 
    width:100%;
	padding:0;
}

.chart-container .pr-chart-ctrl .pr-chart {
    display:block; 
	position:relative; 
	width:100%; 
	margin:0 0 15px 0; 
	text-align:center; 
	margin-top: 15px;
}
.chart-container .pr-chart-ctrl .pr-chart canvas {
	display:block; 
	margin:0 auto; 
	padding:0; 
	vertical-align:center;
}
.chart-container .pr-chart-ctrl .pr-chart i {
    position:absolute; 
	top:0; 
	left:0; 
	width:100%; 
	height:200px; 
	line-height:200px; 
	font-size:48px; 
	font-style:normal; 
	color: #202020;
}
    
@media screen and (max-width:500px) {
    .chart-container .pr-chart-ctrl {
        width:100%; 
		margin-bottom:50px;
    } 
}