﻿@font-face { 
	font-family: "Ionicons"; 
	src: url("../fonts/Ionicons/ionicons.eot"); 
	src: url("../fonts/Ionicons/ionicons.eot#iefix") format("embedded-opentype"), 
		 url("../fonts/Ionicons/ionicons.ttf") format("truetype"), 
		 url("../fonts/Ionicons/ionicons.woff") format("woff"), 
		 url("../fonts/Ionicons/ionicons.svg#Ionicons") format("svg");
	font-weight: normal;
	font-style: normal; 
}



/* DNN FONT AWESOME FOR MODULE ICONS TO WORK  */
.fa { font-weight: normal !important; font-family: FontAwesome !important; }


/* ================================================================================ 
                                    Icons tooltips
   ================================================================================ */
.ion-information:after{ font-family: "Ionicons"; content:"\f14a";}
.ion-information-circled:after{font-family: "Ionicons"; content:"\f149";}
.ion-help:after{font-family: "Ionicons"; content:"\f143";}
.ion-help-circled:after{font-family: "Ionicons"; content:"\f142";}
.ion-alert-circled:after{font-family: "Ionicons"; content:"\f35b";}

/* ================================================================================ 
                                     Inview
   ================================================================================ */
.InView { opacity:0; -webkit-transition-delay:0.4s;  transition-delay:0.4s;  -webkit-transition: -webkit-transform 0.4s ease, opacity 0.6s ease; transition: transform 0.4s ease, opacity 0.6s ease;}
.InView.noTransition {transition:none; transition-delay:0s; -webkit-transition-delay:0s;}
.InView.directionLeft {  transform:translateX(-75px); -webkit-transform:translateX(-75px);}
.InView.directionRight{  transform:translateX(75px); -webkit-transform:translateX(75px);}
.InView.directionUp{  transform:translateY(75px); -webkit-transform:translateY(75px);}
.InView.Active, .InView.active   { opacity:1; transform:translateX(0px); -webkit-transform:translateX(0px);}

.InView.TransDelay_02 {-webkit-transition-delay:0.2s;  transition-delay:0.2s; }
.InView.TransDelay_04 {-webkit-transition-delay:0.4s;  transition-delay:0.4s; }
.InView.TransDelay_06 {-webkit-transition-delay:0.6s;  transition-delay:0.6s; }
.InView.TransDelay_08 {-webkit-transition-delay:0.8s;  transition-delay:0.8s; }
.InView.TransDelay_10 {-webkit-transition-delay:1.0s;  transition-delay:1.0s; }
.InView.TransDelay_12 {-webkit-transition-delay:1.2s;  transition-delay:1.2s; }
.InView.TransDelay_14 {-webkit-transition-delay:1.4s;  transition-delay:1.4s; }

.InviewTrue { opacity:0; -webkit-transition-delay:0.4s;  transition-delay:0.4s;  -webkit-transition: -webkit-transform 0.4s ease, opacity 0.6s ease; transition: transform 0.4s ease, opacity 0.6s ease;}
.InviewTrue.noTransition {transition:none; transition-delay:0s; -webkit-transition-delay:0s;}
.InviewTrue.directionLeft {  transform:translateX(-75px); -webkit-transform:translateX(-75px);}
.InviewTrue.directionRight{  transform:translateX(75px); -webkit-transform:translateX(75px);}
.InviewTrue.directionUp{  transform:translateY(75px); -webkit-transform:translateY(75px);}
.InviewTrue.Active, .InviewTrue.active   { opacity:1; transform:translateX(0px); -webkit-transform:translateX(0px);}

.InviewTrue.TransDelay_02 {-webkit-transition-delay:0.2s;  transition-delay:0.2s; }
.InviewTrue.TransDelay_04 {-webkit-transition-delay:0.4s;  transition-delay:0.4s; }
.InviewTrue.TransDelay_06 {-webkit-transition-delay:0.6s;  transition-delay:0.6s; }
.InviewTrue.TransDelay_08 {-webkit-transition-delay:0.8s;  transition-delay:0.8s; }
.InviewTrue.TransDelay_10 {-webkit-transition-delay:1.0s;  transition-delay:1.0s; }
.InviewTrue.TransDelay_12 {-webkit-transition-delay:1.2s;  transition-delay:1.2s; }
.InviewTrue.TransDelay_14 {-webkit-transition-delay:1.4s;  transition-delay:1.4s; }



/* ================================================================================ 
                                    Progress
   ================================================================================ */
.progress-bar{ height:15px; box-shadow:5px 5px 0 0 rgba(68,68,68,0.1); background-color:#fafafa; margin:50px 0; position:relative}
.progress-bar .bar-label { color:#274052; line-height:1; font-weight:bold; position:absolute; left:0; top:-20px; }
.progress-bar .bar-meter { display:block; background-color:#0086b0; height:15px; width:0%; transition:width	1s ease; transition-delay:0.5s; -webkit-transition:width 1s ease; -webkit-transition-delay:0.5s;}
.progress-bar .bar-meter.Geel { background-color:#f3c218;}
.progress-bar .bar-meter.Oranje { background-color:#f29400;}
.progress-bar .bar-meter.Groen { background-color:#97bf0d;}
.progress-bar:nth-child(2) .bar-meter  {transition-delay:0.6s; -webkit-transition-delay:0.6s;}
.progress-bar:nth-child(3) .bar-meter  {transition-delay:0.7s; -webkit-transition-delay:0.7s;}
.progress-bar:nth-child(4) .bar-meter  {transition-delay:0.8s; -webkit-transition-delay:0.8s;}
.progress-bar:nth-child(5) .bar-meter  {transition-delay:0.9s; -webkit-transition-delay:0.9s;}
.progress-bar:nth-child(6) .bar-meter  {transition-delay:1.0s; -webkit-transition-delay:1.0s;}
.progress-bar:nth-child(7) .bar-meter  {transition-delay:1.1s; -webkit-transition-delay:1.1s;}
.progress-bar:nth-child(8) .bar-meter  {transition-delay:1.2s; -webkit-transition-delay:1.2s;}
.progress-bar:nth-child(9) .bar-meter  {transition-delay:1.3s; -webkit-transition-delay:1.3s;}


/* ================================================================================ 
                                    SocialShare
   ================================================================================ */
.SocialShare {}
.SocialShare:after{ content: ""; display:block; clear:both;}	 
.SocialShare [class^="SS_"] {cursor:pointer; display: block; width: 32px; height: 32px; font-size: 26px; text-align:center; line-height: 32px; margin: 0 5px 0 0; overflow:hidden; float: left; background-color: #aaaaaa; position: relative;}
.SocialShare [class^="SS_"]:before { font-family: 'Ionicons'; color: #fff; display:block; content: ""; width: 100%; height: 100%; }
.SocialShare .SS_FaceBook { background-color: #35569d;}
.SocialShare .SS_FaceBook:before { content: "\f231";}
.SocialShare .SS_Google { background-color: #de4b39;}
.SocialShare .SS_Google:before { content: "\f235";}
.SocialShare .SS_LinkedIn {background-color: #0078b4;}
.SocialShare .SS_LinkedIn:before { content: "\f239";}
.SocialShare .SS_Twitter { background-color: #29a7da; }
.SocialShare .SS_Twitter:before { content: "\f243";}	 
.SocialShare .SS_Xing { background-color: #1a7576; background-image:url(images/xingLogo.png); background-repeat:no-repeat; background-position:center center;}
.SocialShare .SS_WhatsApp { background-color: #51ca5f; display:none;}
.SocialShare .SS_WhatsApp:before { content: "\f4ef";}



/* ================================================================================ 
                                     SHow More CSS
   ================================================================================ */
.ShowMoreWrapper {height:220px; position:relative; padding-bottom:25px; overflow:hidden; -webkit-transition:height 0.5s ease; transition:height 0.5s ease; }
.ShowMoreWrapper:after{content:""; display: block; -webkit-transition:height 0.5s ease; transition:height 0.5s ease;
    bottom: 0; left:0;
    width: 100%;
    height: 5em;
    text-align: center;
    border-bottom: 1px solid #dddbd5;
    position: absolute; 
    background: #fff;
    background: -webkit-linear-gradient(rgba(255,255,255,0),#fff);
    background: linear-gradient(rgba(255,255,255,0),#fff);
	padding-bottom:25px;
}
.ShowMoreWrapper.active:after { height:0;}
.ShowMore {}
*[class*="ShowMoreToggle"] { -webkit-transform:translateX(-50%); padding: 0 10px; transform:translateX(-50%);  cursor:pointer; text-align:center; background-color:#fff; min-width:110px; position:absolute; bottom:-15px; height:30px; left:50%; border:1px solid #ccc; line-height:28px;}
*[class*="ShowMoreToggle"]:hover { background-color:#000; color:#fff;}




/* ================================================================================ 
                                     Table layout css
   ================================================================================ */
/*Table layout css*/
.SliderTableActive { position:relative; width:100%; border-spacing:0;  border-collapse:collapse; overflow:hidden}
.SliderTableActive .SliderTableWrapper {overflow-x:scroll;}
.SliderTableActive .SliderTableWrapper:after { opacity:1; -webkit-transition:opacity 1s ease; transition:opacity 1s ease; position:absolute; right:0px; top:0; z-index:3; height:100%; width:50px; content:""; } 
.SliderTableActive .SliderTableWrapper:before { opacity:1; -webkit-transition:opacity 1s ease; transition:opacity 1s ease; position:absolute; left:0px; top:0; z-index:3; height:100%; width:50px; content:"";}
.SliderTableActive .SliderTableWrapper.SliderTableSlideStart:before{ opacity:0} 
.SliderTableActive .SliderTableWrapper.SliderTableSlideEnd:after{ opacity:0} 

table.SliderTableWrapper { width:100%; border-spacing:0;  border-collapse:collapse; padding:0;  }
.SliderTableWrapper > table {width:100%;}
.SliderTableWrapper > table td,
.SliderTableWrapper > table th  { min-width:100px; border-bottom:1px solid #eee; padding: 5px 40px 5px 10px; border-spacing:0;  border-collapse:collapse;  }

/* ================================================================================ 
                               SHARP SPRING FORMULIEREN 
   ================================================================================ */
.sharpspring_form { color:#8D8E90; font-size: 15px;}

.sharpspring_form fieldset  { min-width: 0;}
.sharpspring_form label  { font-size: inherit;}

.sharpspring_form fieldset li label,
.sharpspring_form fieldset li input,
.sharpspring_form fieldset li textarea,
.sharpspring_form fieldset li select  { color: inherit; }

.sharpspring_form ul.form_fields {margin:0; padding: 0;}
.sharpspring_form ul.form_fields li { position: relative; }
.sharpspring_form ul.form_fields li:after { content: ""; display:block;  clear:both; }
.sharpspring_form ul.form_fields li > label { display:block;  float:left; width: 30%;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 5px 0; color: inherit;}
.sharpspring_form ul.form_fields li > label span.required { color: #d93d3d;}
.sharpspring_form ul.form_fields li > label.error { color: #fff; width: auto; clear: none; margin: 0 0 4px 0; padding: 0 10px; line-height: 2; opacity: 0.8;  box-shadow: none; border-radius: 5px; position: relative;  }
.sharpspring_form ul.form_fields li > label.error:after  { position: absolute; bottom: -8px; left: 20px; content: ""; width: 0;  height: 0;  border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #d93d3d;
}

.sharpspring_form ul.form_fields li .field_value { display:block; float:right; width: 70%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0;}
.sharpspring_form ul.form_fields li .field_value input[type=text],
.sharpspring_form ul.form_fields li .field_value select,
.sharpspring_form ul.form_fields li .field_value textarea { border-color: #D8D8D8; border-radius: 0; padding: 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  
width: 100%; max-width: none; font-size: inherit;
}
.sharpspring_form ul.form_fields li .field_value input[type=text].error ,
.sharpspring_form ul.form_fields li .field_value select.error ,
.sharpspring_form ul.form_fields li .field_value textarea.error { border: 1px solid #d93d3d;}

.sharpspring_form ul.form_fields li .field_value .checkbox-option,
.sharpspring_form ul.form_fields li .field_value .radio-option { display: block; }

.sharpspring_form ul.form_fields li .field_value .checkbox-option .checkbox-label { color:inherit;}

.sharpspring_form ul.form_fields li .field_value .checkbox-option:first-child,
.sharpspring_form ul.form_fields li .field_value .radio-option:first-child{ margin-top: 4px; }

.sharpspring_form p.clear { visibility: visible; width: auto; height: auto;}

.sharpspring_form button.button {background-image: none; box-shadow:none; text-shadow: none; border-radius: 0; border: 0px; }



/* ================================================================================ 
                                Search results
   ================================================================================ */
.dnnSearchBoxPanel { max-width:none !important; background-color:#fff;}
.dnnSearchResultPanel, .dnnSearchBox_advanced, .dnnSearchResultItem-Others{display:none;}
.dnnSearchResultAdvancedTip { visibility:hidden;}
.dnnSearchBoxPanel .dnnSearchBox {margin-right:10px !important; box-shadow:none !important; margin-left:0;}
.dnnSearchBoxPanel .dnnSearchBox > a.dnnSearchButton { width:40px; height:36px; top:0px; margin:0; border-radius:0 5px 5px 0; background-color:#efefef; }
.dnnSearchBoxPanel .dnnSearchBox > a.dnnSearchBoxClearText { margin:0; right:50px !important; top:10px !important;}
.dnnSearchBoxPanel .dnnSearchBox #dnnSearchResult_dnnSearchBox_input { border:0 !important; background-color:#fff; height:29px !important}
.dnnSearchBoxPanel .dnnSearchBox { background-color:#fff;}
.dnnSearchResultContainer > .dnnSearchResultItem > .dnnSearchResultItem-Title  a{ font-weight:normal;}



/* ================================================================================ 
                                 Kerburn Effect
   ================================================================================ */
.KenburnWrapper {  overflow:hidden; position:relative;}
.KenburnWrapper .Kenburn  { -webkit-animation:16s infinite Kenburn linear; -webkit-transform: scale(1.2) translate(0px,0px);  animation:16s infinite Kenburn linear; transform: scale(1.2) translate(0px,0px); }
.KenburnWrapper .KenburnHover { -webkit-animation:none; -webkit-transform: scale(1.2);  animation:none; transform: scale(1.2); transition:all 2s ease;}
.KenburnWrapper .KenburnHover:hover {-webkit-transform: scale(1.6) translate(-18%,-18%); transform: scale(1.6) translate(-18%,-18%); }

@-webkit-keyframes Kenburn {
	0% {  -webkit-transform: scale(1.3) translate(0px,0px);}
	50% { -webkit-transform: scale(1.6) translate(-18%,-18%);}
	100% { -webkit-transform: scale(1.3) translate(0px,0px);}
}

@keyframes Kenburn {
	0% { transform: scale(1.3) translate(0px,0px); } 
	50% { transform: scale(1.6) translate(-18%,-18%);}
	100% { transform: scale(1.3) translate(0px,0px);}
}


/* ================================================================================ 
                                  Responsive Iframe Video's
   ================================================================================ */
.VideoWrapper {	position: relative;	padding-bottom: 56.25%; height: 0;}
.VideoWrapper iframe {	position: absolute;	top: 0;	left: 0; width: 100%; height: 100%;}



