/* TEST */

// LOAD LIBARY
@import "lib/source";
@import "settings";

@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700,700i&display=swap');

// ============================================================================
// TEMPLATE VARIABLES
// ============================================================================


// colors & fonts
@hand: 'Nothing You Could Do', cursive;
@tienne: 'Tienne', serif;
@text: #707070;
@red: #770310;
@orange: #f29100;
@brown: #ca998a;
@grey: #DCE2ED;

// sizes
@header: 230;
@menubar: 28;
@footer: 110;	


// ============================================================================
// TEMPLATE BASE
// ============================================================================


// basic
html,body                 { .h(100%); -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;}
html                      { .fs(62.5%); .ofy(scroll); }
body                      { font-size: 16px;line-height: 140%; font-family: 'Roboto', sans-serif; background-image: url(/images/back.png); background-position: top center; background-repeat: no-repeat; background-color: #eeeff0; }


// structure
.grid(3,4,5,12);
#container                { .h(n,100%,n); .ps(relative); }
.wrapper                  { .clf(); }
.row                      { .clf(); }
.inner                    { .m(10); }
[class^="grid"]           { .fl(left); }
.hidden                   { .o(none); }


// typo
.headings(26,24,20,18,14,12);
h1,h2,h3,h4,h5,h6,legend  { .ff(@tienne); .fw(normal); .c(mix(@red,white,80%)); }
p                         { .lh(160%); }


// links
a                         { color: #000; transition: 0.3 ease-in-out;
  &:hover,
  &:active,
  &:focus                 { outline: 1;  transition: 0.3 ease-in-out;}
  &:hover,                { transition: 0.3 ease-in-out;}
  img                     { .b(0);  }
}


// buttons
.button                   { .bgc(@red); .ff(@tienne); .brad(8); .b(0); .t(16,22,white); .p(4,12);
  &:hover                 { .bgc(@orange); .tr(background-color 0.2s ease-in); }
}


// tables
table                     { width:100%; }


// list
ul,ol                     { .pl(20); }


// forms
input[type='text'],
input[type='password'],
textarea                  { .brad(2); .bs(2,2,2,fade(black,10)); .b(1,solid,@grey); .p(6,8);
  &:focus                 { .bs(0,0,4,fade(#26ACE6,80)); .tr(all 0.2s ease-in); outline: none  }
}

fieldset                  { .b(0); .mp(0); }
legend                    { .fs(26); .mb(10) }
button,
input[type='submit']      { .button; }


// icons
.icon                 { .s(20); .bgc(@red); .ps(absolute,0,0,n,n); .brad(3);
  .icon_top,
  .icon_bottom        { .o(block); .w(5); .m(2,auto); }
  .icon_top           { .bgc(@orange); .h(5); .brad(50%); }
  .icon_bottom        { .bgc(white); .h(9); }
}



// ============================================================================
// TEMPLATE DEFAULT ELEMENTS
// ============================================================================


// background effect
.bg-effect                { .ps(absolute,0,n,n,0); .w(50%,500); .h(auto); .z(-1); }


// header
#header                   { .ps(relative); float: left; width: 100%; height: 480px; background-image: url(/images/sunset.jpg); background-position: 50% 30%; background-size: cover;
  .wrapper                { .w(100%); margin: 0 auto !important;}
  .wrapper,
  [class^="grid"],
  .inner                  { .m(0); float: left;}
}
.erfenis #header{background-image: url(/images/erfenis.jpg);}
.schenking #header{background-image: url(/images/coins.jpg); background-position: 50% 60%;}
.contact #header{background-image: url(/images/surf.jpg); background-position: 50% 60%;}
#header .wrapper.row{height: auto; float: left; width: 100%; background-image: url(/images/grey.png); background-position: 50% 75%; background-repeat: no-repeat;}
#header .wrapinner{
	max-width: 1500px; margin: 0 auto;
}
#header .grid3{width: 40%; float: left;}

// logo
#logo                     { .w(n,250); margin-top: 31px !important;
  a                       { .o(block); .ta(center); }
  h1                      { .notext(); .m(0); }
  p                       { .m(0); .pt(5);padding-top: 5px;     display: table;    float: left;    margin: 0 0 0 0; }
  img                     {  width: 330px; margin-left: 10%}
  &:hover                 { .op(0.85); .tr(opacity 0.2s ease-in); }
}


// slogan
#slogan                   { .w(n,660); margin: 35px 20px 0px 0px!important;
  h3,h2                   { .ts(0,0,4,white); }
  h3                      { .t(24,32,darken(@brown,10)); .m(0); .pt(56); /*.ff(@hand);*/ }
  h2                      { .t(17,38,#cecece); .mt(5); font-family: 'Arvo', serif; text-shadow: none; /*.ff(@tienne);*/ }
}


// slideshow
#slides                   { .ps(relative); .z(-1); float: left; width: 100%; top: 12px;
  .wk-slideshow           { .size(460,@header); }
  /*.mask                   { .ps(absolute,0,n,0,0); .size(200,i); .hgrad(white,fade(white,0)); .z(999); }*/
}
#slides .uk-flex-center{background-size: cover; background-position: center !important;}

// language
.lang                     { .ps(absolute,(@menubar / 2),8,n,n); .h(@menubar);
  ul                      { .lst(none); .mp(0); .h(i);
    li                    { .fl(left); .h(i);

      a                   { .o(block); .t(12,@menubar,white); .p(0,4); .td(none);
        &:hover           { .c(@red); }
      }
      &.lang-active a     { .c(@red); }
    }
  }
}

.es-deactivate ul li:nth-child(3) {.o(none);}


// menubar
.menubar-bg               { .h(@menubar); .bg(fade(@red,20)); .ps(absolute,(@menubar / 2),0,n,0); .z(-1); .ta(right); }
.menubar                  { .w(100%); .m(0,auto);
  ul                      { .fl(right); .hmenu(@menubar,10,8,level1);.pl(40); .m(0,-5,0,0);
    a.level1              { .t(18,@menubar,#01587a); .ls(1); font-weight: 400; text-transform: uppercase; padding: 15px 25px;
      &:hover,
      &.active            { text-decoration: none; background-image: url(/images/square.png); background-repeat: no-repeat; background-position: center left;}
    }
  }
  .menubar-right          { .fl(left); .s(35%,@menubar); .hgrad(@red,rgba(256,256,256,0)); }
}
.inline-menu{
	float: right;
	/*min-width: 50%;
	background-color: #dddee0;*/
}

// top
#top                      { .bg(fade(@red,80)); .brad(20,20,0,0);
  .inner                  { .m(n,0,0,0); .pl(90); }
  ul                      { .o(block); .hmenu(38,8%,0,level1); .h(60); .mp(0); .mt(30);
    li                    { .w(25%);
      a.level1            { .ta(center); .t(22,38,n,n,uppercase,white); .ff(@tienne); .c(lighten(@brown,20)); .brad(8,8,0,0);
        &:hover,
        &.active          { .bgc(#E9F2FD); .c(@red); .tr(all 0.2s ease-in); }
      }
    }
  }
}


// main
#main                     { .ps(relative); .pb(50); float: left; width: 100%; margin-top: -100px;
  .wrapper                { .w(60%,830); .m(40,auto,0,auto); .ps(relative); }
  #middle                 { .bg(white); .clf(); .p(20,35,0,100); -webkit-box-shadow: 0px 0px 7px 3px rgba(0,0,0,0.19); -moz-box-shadow: 0px 0px 7px 3px rgba(0,0,0,0.19); box-shadow: 0px 0px 7px 3px rgba(0,0,0,0.19);
    &.noLeft               { .pl(20);}
  }
  #content h1             { .mt(0); }
  .bgfade                 { .h(60); .vgrad(fade(white,80),fade(white,0)); .mb(35); }
  &.nosubpage #middle     { .brad(0); }
  &.subpage #middle       { .pl(100); }
}


// left
#left                     { .w(180); .ps(absolute,68,n,n,-89); .bg(fade(@red,50));
  .inner                  { .m(0); }
  ul                      { .mp(0); .vmenu(auto,0,5,level2); .bb(1,solid,white);
    a.level2              { .o(block); .b(1,1,0,1,solid,white); .ff(@tienne); .t(14,20,white); .ta(center); .p(5);
      &:hover,
      &.active            { .bgc(@red); .tr(background-color 0.2s ease-in); }
    }
    .level3               { .o(none); }
  }
}


// footer
#footer                   { .h(100); border-bottom: 10px solid #01587a; float: left; width: 100%;;
  /*.footerbottom           { .bgc(@red); .h(@footer - @menubar); }*/
	.wrapper{max-width: 1200px; margin: 15px auto; position: relative; color: #01587a; font-size: 16px;
		.blokje{position: absolute; right: 0; bottom: 0;}
		.copyright{float: right; margin: 0; width: 100%; text-align: center;
			a{color: white; text-decoration: none;font-size: 14px;}
		}
	}
}
#footer > .wrapper{height: 40px;}

.sponsors                 { .m(0,15);
a {.o(table-cell);}
//img {.maxw(125); .h(auto);}
.maxwidth {
  //img {.minw(253); .h(auto);}
  }
}




// ============================================================================
// ZOO APPLICATIONS
// ============================================================================


// default zoo elements
.media-left               { .fl(left); .m(n,20,5,n) }
.pos-meta                 { .mt(0); .c(@brown); }
.pos-title                { .mb(0); }
.pos-bottom               { .mt(20); }


// news overview
.news.overview            {
  &.mod                   { .p(5,0,25,0); .m(0,15); .b(1,n,solid,@red); }
  .row                    { .bt(1,dotted,mix(@brown,white,50%)); .pt(20) }
  .media-left             { .mt(5); }
  .pos-title,
  .pos-meta               { .o(inline); .m(0); }
  .pos-title a            { .t(16,16,n,n,n,none); }
  .pos-content p          { .m(0); }
  .pos-links              { .ta(right); .mt(5); .pr(28); .ps(relative); }
}


// meta
.pos-meta               {
  a                     { .c(@brown); .td(none);
    &:hover             { .c(@red); }
    &:before            { content:"- "; }
  }
}


// pages overview
#pages.frontpage          {
  .teaser-item            { .ta(center); .p(0,15,20,15); .ps(relative);
    .head                 { .m(0,auto); .s(80%,275); .w(n,180,220); .bgc(lighten(@grey,2)); .pt(12); .ff(@sans);
      h2.pos-title        { .mt(0);
        a                 { .t(22,22,n,n,uppercase,none,mix(@red,white,65%)); .ts(0,0,5,white); }
      }
      .pos-image          { .mt(15);
        a                 { .o(block); .w(110%); .brad(50%); .of(hidden); .ml(-5%); .b(1,solid,white); .bs(0,2,8,fade(black,30)); .lh(0);  }
        img               { .s(100%,auto); }
      }
      &:hover             { .bgc(darken(@grey,2%)); .tr(all 0.4s ease-in);
        h2.pos-title      {
          a               { .c(@red); .tr(all 0.2s ease-in); }
        }
        .pos-image a      { .b(1,solid@orange); .m(-3,-10%,3,n); .w(120%); .bs(0,4,16,fade(black,60)); .tr(all 0.2s ease-in); }
      }
      .lt-ie9 &           { .h(auto);
        .pos-image        { .pb(15); }
        &:hover           {
          .pos-image a    { .w(110%); .m(0,0,0,-5%); }
        }
      }
    }
    .pos-links            { .mt(20);
      a                   { .button; .td(none); .mt(20); }
    }
    .pos-description      { .ta(left); }
  }
}


// gallerijen
#pictures                 {
  .zoo-gallery            { .mt(25); }
  .teaser-item            { .m(0,15,15,0); .ps(relative);
    a                     { .o(block); .lh(0); .td(none);
      img                 { width:100% !important; height:auto !important; }
      &:after             { content:" "; .ps(absolute,0,0,0,0); background: url("/expospanje/media/widgetkit/widgets/spotlight/images/magnifier.png") no-repeat scroll 50% 50% rgba(0, 0, 0, 0.5); .op(0); }
    }
    h2                    { .ps(absolute,0,0,n,0); .t(16,18); .bgc(fade(white,70)); .p(4,8); .z(99);
      a                   { .lh(18);
        &:after           { .o(none); }
      }
    }
    &:hover               {
      h2                  { .bgc(fade(white,90)); .tr(background-color 0.3s ease-in); }
      a:after             { .op(1); .tr(opacity 0.3s ease-in); }
    }
  }
}



// sprekers overview
#sprekers                 {
  .spreker                { .clf(); .mb(25); }
  .pos-media              { .fl(left); .w(20%); .mr(3%);
    img                   { .s(100%,auto); }
  }
  .pos-content            { .fl(left); .w(77%);
    h3,p                  { .m(0,n,10,n); }
  }
  h1                      { .mb(20); }
  &.detail                {
    h1                    { .mb(0); }
    .pos-content          { .fl(none); .w(auto); .mt(20); }
  }
}



// ============================================================================
// TABLE LISTINGS
// ============================================================================


table.listings             { .bb(1,dotted,mix(@brown,white,50%));
  td                       { .t(16,20,bold); .p(4,0);  .bt(1,dotted,mix(@brown,white,50%));
    &.col1                 { .c(@red); }
    &.col3 a               { .c(@text);
      &:hover              { .c(@red);  }
    }
  }
}

table#downloads            { .bgc(fade(@red,10)); .m(20,n);
  td                       { .p(6); .fw(normal); .c(@red); .bb(1,solid,#EFF5F7);
    a                      { .fl(right); .brad(6); .bgc(darken(@grey,20)); .t(12,white); .td(none); .p(3,6);
      &:hover              { .bgc(@red); .tr(background-color 0.2s ease-in); }
    }
  }
}

// ============================================================================
// MODULES
// ============================================================================


// sponsors
.sponsors               {
  h2                    { .ff(@sans); .fs(16);
    &:after             { content:":"; }
  }
  a                     { .mr(10);
   img                  {  }
   &:hover              { .op(0.8); .tr(opacity 0.2s ease-in); }
  }
	object embed									{	width:415px; .m(10,0,0);}
}

// seminars
.seminars               { .mb(30);
  h2                    { .bgc(mix(@red,white,60%)); .c(lighten(@brown,30)); .t(22,26); .p(4,8); }
  table.listings        {
    .col1               { .w(20%); }
    .col2,.col3         { .w(40%); }
    .col2,.col3,.col3 a { .fw(normal); }
    .col3 a             { .c(@red);
      &:hover           { .c(@orange); }
    }
  }
}

// resister btn

.register 							{.s(230,auto); .fl(right); .mr(155);.mt(-37);
	 img 									{.s(100%,auto);}
}

.video-box              {.s(170,auto); .fl(right); .mr(3); .mb(-70); .ps(relative,-55,n,n,n); .z(20);}

.fair-box              {.s(170,auto); .fl(right); .mr(-170); .mb(-100); .ps(relative,-100,n,n,n); .z(20);}


// ============================================================================
// RSFORMS
// ============================================================================


fieldset.formFieldset   {
  ol                    { .lst(none); .mp(0);
    li                  { .mb(10); }
    .formCaption,
    .formBody           { .o(inline-block); }
    .formCaption        { .w(150); }
    span.formClr        { .pl(10); .c(red);
      .formNoError      { .o(none); }
    }
    input[type="text"],
    textarea            { .w(400); }
    input[type="submit"]{ .mt(15); }
    .rsform-block-intro { .mb(25);
      .formCaption      { .o(none); }
    }
    .rsform-block-days  {
      .formCaption      { .pl(153); .w(350); .o(block); .fl(none); .c(@red); .mt(20) }
      .formBody         { .pl(153); .cl(both); .mt(10); }
      label             { .mr(8); }
    }
  }
}



.social                 { .ps(absolute,0,80,n,n); .z(99); .w(70);
  a                     { .o(inline-block,32,32); .brad(50%); .bs(0,0,3,fade(black,5)); .mb(4); .bgc(fade(white,50)); .ta(center);
    &:hover             { .bs(0,0,3,fade(black,30)); .bgc(fade(white,70)); .tr(background-color 0.2s); }
    img                 { .mt(5); }
  }
}



// ============================================================================
// WIDGETKIT
// ============================================================================


.wk-slideset                  { .m(10,8); }

.wk-slideset-default > div:hover .next,
.wk-slideset-default > div:hover .prev,
.wk-slideset .next,
.wk-slideset .prev            { background:none; .bg(@red); .brad(50%); .s(30); .pst(50%); .mt(-15); }
.wk-slideset-default > div:hover .next,
.wk-slideset .next            { .psr(-23); }
.wk-slideset-default > div:hover .prev,
.wk-slideset .prev            { .psl(-23); }

.zoo-gallery-wall.margin > *  { .m(0); }
.zoo-gallery-wall.margin      { .mr(0); }
.spotlight                    { .s(20%,auto); .m(n,0,15,0); }
.spotlight > *                { width:90% !important; height: auto !important; .ps(n,10%,0,n); .mb(15); }


// ============================================================================
// MQ
// ============================================================================

#mobile-menubar {.o(none);}

@media (min-width: 1500px) { #pages.frontpage .teaser-item .head { .h(300); } }
@media (min-width: 1600px) { #pages.frontpage .teaser-item .head { .h(320); } }




// SCROLL TO TOP

.scrollup         { .s(40); .ps(fixed,n,10,10,n); .o(none); .ti(-9999); .bg(fade(#325064,60),"scrolltop.png",no-repeat,center,center); .brad(50%); .bs(0,0,3,fade(black,30));
  &:hover         { .bgc(@red); .tr(background-color 0.2s); }
}



// ============================================================================
// BODYCLASSES
// ============================================================================


/* body.kortingbg #main #middle { .bg(fade(white,80),"korting.png",no-repeat,top,right); } */



// ============================================================================
// CROSSBROWSER
// ============================================================================

html.lt-ie9         {
 .wk-slideset       { .o(none); }
}

html.lt-ie8         {
 #main .wrapper     { .pt(40); }
 #left              { .pst(108); }
 .pos-bottom        { .cl(both) }
}

.language-wrapper{
	float: right;
    margin-top: 0px;
    margin-right: 20px;
}
.language-wrapper a{
	    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    background: #325064;
    display: block;
    border-radius: 50%;
    color: white;
	font-size: 14px;
}
.page-header{
	width: 60%;
}
.page-header h2{
	font-family: 'Arvo', serif;
	font-weight: 400;
	color: black;
	font-size: 36px;
	text-transform: uppercase;
	line-height: 120%;
}
.frontpage #main.nosubpage #middle{
	width: 63%;
    float: left;
	margin-top: 30px;
}
#main.nosubpage #middle{
	    width: 90%;
    float: left;
    margin-top: 30px;
    padding: 7% 5%;
}
#main #right.grid3{
	float: right;
    width: 30%;
	margin-top: 115px;
}
#main #right.grid3 .inner h2{
	font-family: 'Roboto', sans-serif;
	font-weight: 600;
    color: black;
}
#main #right.grid3 .inner ul{
	padding-left: 35px;
}
#main #right.grid3 .inner li{
	list-style-image: url(/images/arrow.png);
	    margin-bottom: 2%;	
}
#main #bottom{
	border-top: 1px solid #e6e6e6;
    float: left;
    width: 100%;
    margin-top: 80px;
    padding-top: 40px;
}
#main #bottom .grid12 .inner .uk-overlay-fade {
    opacity: 0.5;
}
#main #bottom .grid12 .inner .uk-row-first{
	padding-left: 0;
}
.col1, .col2, .col3, .col4{
  width: 21.5%;
	float: left;
	margin: 2%
}
.col1{
	margin-left: 0;
}
.col4{
	margin-right: 0;
}
.cols .head{
	background-color: #01587a;
	color: white;
	text-transform: uppercase;
	text-align: center;
	padding: 5px;
}
.cols .content{
	text-align: center;
    border-bottom: 2px solid #01587a;
    padding: 15px 20px;
    font-size: 16px;
    font-weight: 300;
}
.cols .leesmeer{
	text-align: right;
    padding: 5px 0px;
    font-size: 14px;
    font-weight: 300;
}
.cols .leesmeer a{
	color: #01587a;
	text-decoration: none;
	text-transform: uppercase;
	padding-right: 10px;
	background-image: url(/images/pijltje.png);
	background-repeat: no-repeat;
	background-position: right;
}
#innerbottom {
    width: 100%;
    float: left;
}
#yoo-zoo .items h1.pos-title{
	font-family: 'Roboto', sans-serif;
	font-weight: 600;
	letter-spacing: 1px;
}
#yoo-zoo .items h2.pos-subtitle, .yoo-zoo h3 {
	font-family: 'Roboto', sans-serif;
	font-weight: 600;
	text-transform: none;
	margin: 10px 0px !important;
	font-size: 18px;
	color: black;
	line-height: 160%;
}
.pos-bedrijven span, .pos-omzet span, .pos-tewerk span{
	font-weight: 600;
}
.yoo-zoo h3{
	font-style: italic;
}
#yoo-zoo .items div.teaser-item-bg {
    padding: 0px 0px 40px 0px;
}
#yoo-zoo .items div.teaser-item {
    padding: 0px 7px 40px 7px;
}
.inside #contentWrapper {
    background-color: white;
    margin-top: 60px;
    float: left;
    width: 100%;
}
.inside #contentWrapper .wrapper {
    width: 60%;
    min-width: 830px;
    margin: 0px auto 0 auto;
    position: relative;
}
.leden #yoo-zoo .details div.heading {
    padding-bottom: 5px;
    border-bottom: solid 0px #323232;
    text-align: right;	
}
.leden #yoo-zoo .details div.heading h1{
    font-size: 32px;
    padding-right: 15px;
	font-family: 'Roboto', sans-serif;
}
.breadcrumb{   
	margin-top: -40px;
    margin-left: -10px;
	position: relative;
	padding: 0;
}
.breadcrumb::after{
	width: 20px;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: -15px;
    background-color: #7cbfe9;
    content: "";
}
.breadcrumb a{
	font-weight: 600;
	text-decoration: none;
}
.breadcrumb a:hover, .breadcrumb a:focus{
	color: #7cbfe9;
}
.breadcrumb li{
	display: inline-block;
}
.breadcrumb li .divider{
	font-weight: 800;
    color: yellow;
    margin: 0 10px;
}
.breadcrumb li:first-child{
	display: none;
}
.col3 .pos-adres{
	background-image: url(/images/marker.png);
	background-repeat: no-repeat;
	background-position: 0 5px;
	padding-left: 30px;
}
.col3 .pos-tel{
	background-image: url(/images/phone.png);
	background-repeat: no-repeat;
	background-position: 0 5px;
	padding-left: 30px;
}
.col3 .pos-website{
	background-image: url(/images/web.png);
	background-repeat: no-repeat;
	background-position: 0 6px;
	padding-left: 30px;
}
.col3 .pos-mail{
	background-image: url(/images/mail.png);
	background-repeat: no-repeat;
	background-position: 0px 8px;
	padding-left: 30px;
}
.col3 .pos-website a, .col3 .pos-mail a{
	text-decoration: underline;
}
.col3 .pos-website a:hover, .col3 .pos-mail a:hover{
	color: #325064;
}
.topbar{
	height: 60px;
	background-image: url(/images/topbar.png);
	background-repeat: repeat-x;
	background-position: top;
}
.topbar .topleft{
	float: left;
    font-size: 14px;
    color: white;
    margin: 2px 0;
    width: 100%;
    text-align: right;
	font-weight: 300
}
.topbar .topleft .leftinner{
	max-width: 1500px;
	padding: 0 20px;
	margin: 0 auto;
}
.topbar .topright{
	float: left;
    font-size: 14px;
    background-color: rgba(255,255,255, 0.6);
    margin: 0;
    width: 40%;
    text-align: right;
	height: 60px;
	display: none;
}
.topbar .topleft p{
	margin: 0.2% 2%;
	font-weight: 300
}
.menubar ul li.level1 {
    float: left;
    position: relative;
    margin-right: 10px;
    height: auto;
}
.menubar ul.level1 {
    height: auto;
    list-style: none;
}
#absolute .inner a{
    display: block;
    /* background-color: white; */
    /* padding: 12px 30px; */
    width: 550px;
    font-size: 20px;
    color: #01587a;
    text-decoration: none;
    /* border-bottom: 3px solid #01587a; */
    position: absolute;
    right: 0;
    /* -webkit-box-shadow: 0px 10px 12px -10px rgb(0 0 0 / 48%);
    -moz-box-shadow: 0px 10px 12px -10px rgba(0, 0, 0, 0.48); */
    /* box-shadow: 0px 10px 12px -10px rgb(0 0 0 / 48%); */
    margin-right: 40px;
}
#absolute .inner {
    width: 61%;
    min-width: 830px;
    margin: 0px auto 0 auto;
    position: relative;
}
#absolute{
	position: relative;
    z-index: 9;
}
.pos-content{
	float: right;
    width: 65%;
}
#yoo-zoo .item div.media-right {
    margin: 0;
    float: left;
    width: 20%;
}
#yoo-zoo .item div.media-right img{
	width: 100%;
	height: auto;
}
.floatbox .pos-content {
    float: right;
    width: 75%;
}
.schenking .floatbox .pos-content {
    float: left;
    width: 100%;
}
#yoo-zoo .item div.pos-content .element-itemname{
	margin: 0;
	font-size: 22px;
	color: #01587a;
	font-weight: 400;
}
.yoo-zoo p {
    margin-top: 10px;
    margin-bottom: 15px;
    font-weight: 300;
    font-size: 16px;
}
#yoo-zoo .item div.pos-content .element #bannerR{
	display: none;
}
.contact #main.nosubpage #middle {
    width: 90%;
    float: left;
    margin-top: -160px;
    padding: 4% 5%;
}

.schenking .module{
	float: left;
    width: 100%;
}
.schenking .module > h2{
	    width: 35%;
    float: left;
    background-color: #01587a;
    color: white;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-size: 18px;
    padding: 2px;
    text-align: center;
}
.schenking .module ul{
	width: 60%;
    float: right;
	margin-top: 14px;
}
.schenking .module ul li{
line-height: 25px;
    vertical-align: text-bottom;
    padding: 7px 20px 5px;
    display: block;
    position: relative;
    margin-bottom: 5px;
}
.schenking .module ul li:hover{
line-height: 25px;
    vertical-align: text-bottom;
    padding: 7px 20px 5px;
    display: block;
    position: relative;
    background-color: #edf3f6;
    margin-bottom: 5px;
}
.schenking .module ul li::before{
	content: url(/images/list.png);
	position: absolute;
	display: inline-block
}
.schenking .module ul li a{
	color: #01587a;
	margin-left: 35px;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 300;
}
.backbutton{
	background-color: #01587a;
    color: white;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-size: 18px;
    padding: 10px 30px;
    text-align: center;
    text-decoration: none;
    margin-left: 34%;
    margin-top: 2%;
    float: left;
}
.backbutton:hover{
	background-color: #dddee0;
	color: #01587a;
}
.contact #left {
    width:auto;
    position: absolute;
    top: 200px;
    right: 100px;
	left: auto;
    background-color: transparent !important; 
   
}
.contact #left h2{
	color: #01587a;
	text-transform: uppercase;
	font-family: 'Roboto', sans-serif;
	font-weight: 600;
	    font-size: 18px;
    margin-bottom: 0px;
}
.formResponsive .formHorizontal .formControls {
    display: inline-block;
    padding-left: 20px;
    margin-left: 12%;
    margin-left: 0;
}
.formResponsive .formHorizontal .formControlLabel {
    float: left;
    width: 10%;
    padding-top: 5px;
    text-align: left;
}
.formResponsive input, .formResponsive textarea {
    max-width: 490px !important;
    width: 490px !important;
    font-size: 18px !important;
    padding: 10px !important;
}
.formResponsive > h2{
	font-family: 'Roboto', sans-serif;
	color: #01587a;
	padding-bottom: 15px;
	border-bottom: 2px solid #01587a;
	display: inline-block;
	margin-bottom: 80px;
}
.formResponsive input[type="submit"], .formResponsive button[type="submit"] {
    background-color: #01587a;
    *background-color: #01587a;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    background-repeat: repeat-x;
    border-color: #01587a;
    border-color: #01587a;
    filter: none;
    filter: none;
    color: #ffffff;
    text-shadow: none;
	font-family: 'Roboto', sans-serif;
	text-transform: uppercase;
	    border: none;
    padding: 10px 30px;
    font-size: 18px;
    border-radius: 0;
}
.pos-content {
    float: left;
    width: 100%;
}

// ============================================================================
// TEMPLATE VARIABLES
// ============================================================================
@breakpoint-tablet :  768px;
@breakpoint-phone :   300px;

// Tablet Styles
@media only screen and (max-width: 1024px)    {

body                      {.w(n,640,n); background:#daf0fd; }

  #header           	{ .h(140); .bgc(white);
    #slides        		{.z(-100); .o(none);
      .wk-slideshow		{.h(140);
        .slides     	{height: 140px !important; width: 280px !important;
          * , &>*   	{height: 140px !important; width: 280px !important;}
        }
      }
    }
    
    
      #logo       		{  .w(135); .mp(0); .minw(0); .m(25,20);
          h1       		{  .o(none); }
           img       	{  .w(auto); .h(auto); .maxh(90); }
      p         		{  .mp(0); .fl(none); .o(block);  }
       }
       
       
     #slogan      {  /*.o(none);*/ .ps(absolute); .psl(30%); .pst(25);
      h3          { .mp(0); font-size: 13px !important; top:0 !important; .lh(20); }
      h2, h2 span  {.mp(0); font-size: 18px !important; top:0 !important; .lh(25);}
     }
  }

.menubar          { .w(100%); .ps(relative); .m(0); .of(hidden);
  ul.level1       { .w(70%); .ml(15); }
  .menubar-right  { .ps(absolute,n,-55,n,n);}
}

.sponsors         {
  img             { .maxw(150); .h(auto);}
   a              {.o(inline-block);}
}

#main             {
  .wrapper        { .w(100%);.minw(640);.m(40,auto,0,auto);.ps(relative);}
  #middle         { .w(96%); .m(0 auto); .p(0);}
}

.lang, .social, .register, .video-box, .fair-box { .o(none); }

.lang           { .o(block); .pst(0);}
.social         { .o(block); .s(32);
  p             { .m(0);}
}
.register       { .o(block); .m(-95,5,0,0); .ps(relative); .z(100);}

div.register    { .o(block); .w(50%);.fl(none); .m(0, auto); .ta(center); .ps(relative, 20,n,n,n);
  img           { .w(auto);}
}

.video-box      { .o(block); .m(0,5,0,0); .ps(absolute,-125,0,n,n); .z(100); .w(120);
  img           { .maxw(100%); .h(auto);}
}
.fair-box       { .o(block); .m(0); .ps(relative); .z(100); .w(120); .pst(0); .mt(-160); .psl(-185); }


#main.subpage #middle       {.mp(0,auto,0,0);}
#top                        {.w(96%); .m(0, auto);
  .inner                    { .m(0);}
  ul {.m(0);}
}

#top ul li a.level1         {.fs(15);}

#left                       {.psl(14); .pst(85);}
#content, #innerbottom      {.m(13,3%,0,3%);
  &.noLeft                  {.m(13,0,0);}
}

#pages.frontpage .teaser-item .head .pos-image a { .w(100%); .mp(0);}

}
@media only screen and (max-width: 1550px)    {
	.contact #left {
    width: auto;
    position: absolute;
    top:485px;
    right: 10px;
    left: 50px;
    background-color: transparent !important;
    bottom: 25px;
}
	.contact #main.nosubpage #middle {
    width: 90%;
    float: left;
    margin-top: -160px;
    padding: 4% 5% 15%;
}
}
 
@media only screen and (max-width: 1250px)    {
		#header .grid3 {
    min-width: 35%;
    float: left;
}
	.erfenis #header {
    background-image: url(/images/erfenis.jpg);
    background-position: center right;
}
}
@media only screen and (max-width: 1200px)    {
	.inline-menu {
    float: right;
		background-color: #dddee0;
}
	#header .wrapper.row {
    background-image: none;
}
}
@media only screen and (max-width: 1100px)    {

	#main .wrapper {
    width: 90%;
    min-width: 830px;
    margin: 40px auto 0 auto;
    position: relative;
}
	.cols .content {
    text-align: center;
    border-bottom: 2px solid #01587a;
    padding: 15px 20px;
    font-size: 16px;
    font-weight: 300;
    min-height: 120px;
}
		.contact #left {
    width: auto;
    position: absolute;
    top: auto;
    right: 10px;
    left: 50px;
    background-color: transparent !important;
    bottom: 25px;
}
	.contact #main.nosubpage #middle {
    width: 90%;
    float: left;
    margin-top: -160px;
    padding: 4% 5% 150px;
}
	#slogan {
    min-width: auto;
}
}
@media only screen and (max-width: 1024px)    {
	#header {
    height: 450px;
    background-color: #ffffff;
}
	.menubar ul a.level1 {
    font-size: 16px;
    line-height: 28px;
    color: #01587a;
    letter-spacing: 1px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 15px 20px;
}
	.menubar ul.level1 {
    width: 100%;
    margin-left: 0;
}
	.menubar {
    width: 100%;
    position: relative;
    margin: 0;
    overflow: hidden;
}
	.inline-menu {
    float: right;
    min-width: 50%;
    background-color: #dddee0;
    margin-top: 3%;
		padding-left: 15px;
}
	#header #logo {
    min-width: 35%;
    margin: 0;
    padding: 0;
    margin: 25px 0px 25px 20px;
}
	#header #logo img {
    width: 300px;
    height: auto;
    max-height: 90px;
		margin-left: 0;
}
	.col1, .col2, .col3, .col4 {
    width: 45%;
    float: left;
    margin: 2% !important;
}
	.cols .content {
    text-align: center;
    border-bottom: 2px solid #01587a;
    padding: 15px 20px;
    font-size: 16px;
    font-weight: 300;
    min-height: 65px;
}
	.schenking .module {
    float: right;
    width: 100%;
}
	.contact #main.nosubpage #middle {
    width: 90%;
    float: left;
    margin-top: -100px;
    padding: 4% 5% 150px;
}

}
@media only screen and (max-width: 900px)    {
	.topbar .topright {
    display: none;
}
	.topbar .topleft {
    float: right;
    font-size: 14px;
    color: white;
    margin: 2px 0;
    width: 100%;
    text-align: right;
    font-weight: 300;
}
	.inline-menu {
    float: right;
    min-width: 200px;
    background-color: #dddee0;
    margin-top: 2%;
}
	.menubar ul.level1 {
    width: 50px;
    margin-left: 0;
		float: left;
}
}
// Phone Styles
@media only screen and (max-width: 800px)    {
  body                      {.w(n,0,@breakpoint-tablet); background:#daf0fd; }

  [class^="grid"] { .o(block); .fl(none); .w(100%);}
  #main             {
    .wrapper        { .w(100%);.minw(250);.m(20,auto,0,auto);.ps(relative);}
    #middle         { .w(96%); .m(0 auto); .p(0);}
  }

  .lang, .social, .register, .video-box, .fair-box,   #slides { .o(none); }

  .fair-box { .o(block); .fl(none); .m(0,auto); .pst(0); .w(96%);.ta(center); .bg(rgba(255, 255, 255, 0.6)); .brad(20);
    img {.m(0); .p(15,n); vertical-align: middle; .w(75%); .h(auto);}
  }
  
  div.register {.o(block); .w(100%);.fl(none); .m(0); .pst(0);}

  .lang {    display: block;
    top: 0;
    right: 0;
    position: relative;
    float: right;
    margin-top: -33px;
    margin-right: 10px;
   ul li.lang-active a {.c(white); .fw(bold);}}

  #header     {.h(350);
    .wrapper  { margin: 30px auto !important; float: none}
    #slogan   {.o(inline-block); .bg(n); .minw(0); .ta(center); .p(15,0); .ps(absolute,0,0,n,inherit); .w(60%);
      h2   { font-size:16px !important; .p(0); .lh(20); top:0 !important;}
      /*h3 { .o(none);}*/
    }
    #logo {  .w(275px); .mp(0); .minw(0); .m(50%,auto,0,auto); float: none;
      h1        {  .o(none); }
      img       {  .w(100%); .h(auto); .maxh(90); }
      p         {  .mp(0); .fl(none); .o(block);  }
  }
  }
  

  .menubar-bg   {.o(none);}

  #menubar      {.o(block); .mp(0); .w(100%); .bg(@red);
    ul          { .o(none);}
  }

  #pages.frontpage        {
    .pos-description, .pos-links      { .o(none);}
    .teaser-item .head                { margin: 0 auto;    width: 80%;    height: 50px;    min-width: 0;    max-width: 100%;
      h2.pos-title                    { .ta(right);
         a                            { font-size: 16.5px;    line-height: 22px; .mr(10); .fw(bold);  }
      }
      .pos-image a, .pos-image a:active                    { .w(40%); .mt(-70); .maxw(75);}

      &:hover           {
        .pos-image a    {  .w(40%); .mt(-70); .maxw(75); }
      }
    }
    .grid4:nth-child(2)                 {
      .teaser-item .head                {
        h2.pos-title                    { .ta(left);
           a                            { .ml(10);   }
        }
        .pos-image                      { .ps(relative);}
        .pos-image a                    { .ps(absolute,n,-15,n,n);}
      }

    }
  }
  
  .news.overview { .o(none);}

  .sponsors       { .ta(center);
        a {.o(inline-block); .m(0 auto);   .bs(0,0,20px,10px,white);}
  }

  #menubar {.o(none);}
    #mobile-menubar {.o(block); .mp(0); .bg(#01587a); .w(100%); .c(white); .minh(40); .lh(40);    position: fixed; top: 0; z-index: 99;
    a.mobileToggle { .c(white); .td(none); .fw(bold);
    &:before{ content:''; .o(inline-block); .s(20); background-size:cover; .fl(left); .m(10);
              background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAAkCAYAAAAQC8MVAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkMxMTM5RDJEODdBNzExRTU4MzhBQzA2Qjg2MjU5OTIwIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkMxMTM5RDJFODdBNzExRTU4MzhBQzA2Qjg2MjU5OTIwIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QzExMzlEMkI4N0E3MTFFNTgzOEFDMDZCODYyNTk5MjAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QzExMzlEMkM4N0E3MTFFNTgzOEFDMDZCODYyNTk5MjAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz76K+RRAAAApklEQVR42uyXUQ2AMBBDbwQDs4AFLGABJOBlEkACGpDALEwCkzBuMCQsWZM2abLPl8uu6ZmU0iQim9pKuwrqxSjs3TjoL59hk2AodgIkwtaE9SCs74LlJFgbT4SodgYnDLhghCVsVfUlsmCi69LHCDDYk62LC4YIG0FYg0E7GPlnCUtYwn6tK2sAaF0hwx7qGWCwDql1BaQ/a5kGhC2XggOB3R8BBgAXtji9PAS+ggAAAABJRU5ErkJggg==');
            }
    }
    &.active {
      a.mobileToggle:before { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAAkCAYAAAAQC8MVAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE3RjNFOUY3ODdBOTExRTU4OTNEOEVGM0ZGMjIwMzY0IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE3RjNFOUY4ODdBOTExRTU4OTNEOEVGM0ZGMjIwMzY0Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTdGM0U5RjU4N0E5MTFFNTg5M0Q4RUYzRkYyMjAzNjQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTdGM0U5RjY4N0E5MTFFNTg5M0Q4RUYzRkYyMjAzNjQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4Yv01EAAABcUlEQVR42tTYi23CMBAGYOINsgIrZAU6QleAETqLGQFGOEbwCmEEGMF1JFdKrTzu8cdtLJ1QjLh8itDdxU2M8bCX5Wb22xQ+RcifLeBeXznfTZ1veLJFtCn6+HuFvH9QBhX5XimO0jwcqBVMM/nEYC5UC6aVfCKwBCoFEzMfGyxNzAVL8/USrGbNgUmZ77SG/Sldb0Uh6VJQUYaG65OytD25dfaqvMEYbIHeOdjxY/ZRv16G35K2zlrAm0KnsDXBZO1gtcCkadtLX/r/BF3DbgFWQzlYJNgE5WIRYDN03MHW1tE4eLeIAZ6DtXSmpdYMxyKgMLCrBIWAXUWoGewqQ01g9wdQNdjVGpwh4Fxwb4CCb2kcYet3sKnOZAF3qA42tR4pPoq9i+EVabO/AYFniSAdZAJ4KOGCe+4pT7kRwNOTR0HnRsQAHvM8Aro0zwbwPOqt0CGahZPvcy7aj3wIYV1Dw/nMDeSqOQVq9nRM/y3AAOpIdApp1j4wAAAAAElFTkSuQmCC'); }
    }
  .popup{.o(none);}

  &.active { .ps(fixed);
      .popup {.o(block); background:#daf0fd; .ps(absolute); .z(999); .w(100%); .ta(center); .c(@red);
        ul { .mp(0);
          li{ .bb(1,solid, white); .lst(none); .mp(0);
              a{ .c(@red); .fw(bold); .td(none); .fs(18);}
          }
          }
        .video-box {display: block; .p(15,0);    float: none;    top: 0;    margin: 0 auto;    background: @red;    width: 100%;
          p { .m(0);}
        }
    }
  }
 }

 #left {     width: 100%;    position: relative;    top: 0;    left: 0;
   ul.level2.moved { .bb(15,solid,white);}
 }
#main.subpage #middle {
    padding-left: 0;
}
#mobile-menubar.active .popup ul li a {
    color: #770310;
    font-weight: 400;
    text-decoration: none;
    font-size: 26px;
    padding: 15px;
    display: block;
}
	.erfenis #header {
    background-image: url(/images/erfenis.jpg);
    background-position: 75% 0;
}
table.listings td {   .fs(14);.p(10,9);
  &.col3 {.ta(center); .mb(20);}
}

footer {.menubar {.o(none);}}

.seminars table.listings td { &.col1, &.col2, &.col3 {.o(block); .w(100%);}}

fieldset.formFieldset ol .formCaption, fieldset.formFieldset ol .formBody {.w(100%);}
fieldset.formFieldset ol input[type="text"], fieldset.formFieldset ol textarea { .w(90%);}

.wrapper.row{
  ul.submenu                      { .bg(rgba(119, 3, 16, 0.5)); .mp(0); .vmenu(auto,0,5,level2); .bb(15,solid,white);
    a             { .o(block); .b(1,1,0,1,solid,white); .ff(@tienne); .t(14,20,white); .ta(center); .p(5);
      &:hover,
      &.active            { .bgc(@red); .tr(background-color 0.2s ease-in); }
    }
    .level3               { .o(none); }
  }
}

#main .bgfade { .o(none);}
	#absolute .inner {
    width: 100%;
    min-width: 100%;
    margin: 0px auto 0 auto;
    position: relative;
}
	.col1, .col2, .col3, .col4 {
    width: 96%;
    float: left;
    margin: 2%;
}
	#main {
    position: relative;
    padding-bottom: 50px;
    float: left;
    width: 100%;
    margin-top: -55px !important;
}
	.topbar{display: none; }
	#yoo-zoo .item div.media-right{display: none;}
	#yoo-zoo .item div.pos-content{width: 100%;float: left; margin-top: 50px}
	#footer {
    height: 100px;
    border-bottom: 10px solid #01587a;
    float: left;
    width: 100%;
    padding-bottom: 50px;
}
	#footer > .wrapper {
    height: 40px;
    margin: 5%;
}
	.schenking .module {
    float: right;
    width: 100%;
}
	.schenking .module > h2 {
    width: 100%;
}
	.schenking .module ul {
    width: 100%;
}
	.contact #left {
    width: auto;
    position: absolute;
    top: auto;
    right: 10px;
    left: 35px;
    background-color: transparent !important;
    bottom: 0px;
}
	.contact #main.nosubpage #middle {
    width: 90%;
    float: left;
    margin-top: -160px;
    padding: 4% 5% 25%;
}
	.formResponsive input, .formResponsive textarea {
    max-width: 270px !important;
    width: 100% !important;
    font-size: 18px !important;
    padding: 10px !important;
}
	#g-recaptcha-response{display: none !important}
	.formResponsive .formHorizontal .formControls{
		padding-left: 0 !important;
		display: block !important;
		    width: 100%;
	}
	.formResponsive .formHorizontal .formControlLabel {
    float: left;
    width: 100%;
    padding-top: 5px;
    text-align: left;
    padding-bottom: 10px;
}
	.formResponsive .formHorizontal input, .formResponsive .formHorizontal textarea, .formResponsive .formHorizontal select, .formResponsive .formHorizontal .formValidation, .formResponsive .formHorizontal .uneditable-input, .formResponsive .formHorizontal .input-prepend, .formResponsive .formHorizontal .input-append {
    display: block !important;
    *display: inline;
    margin-bottom: 0;
    *zoom: 1;
}
}
.topbar a{
	color: white !important;
}
.cc-banner.cc-bottom {
    background-color: #01587a !important;
}
.cc-compliance>.cc-btn {
    background-color: #949598 !important;
}
#innerbottom .cols{
	margin-bottom: 30px;
    float: left;
    width: 100%;
}
#innerbottom .moduletable{
	background-color: #dddee0;
    clear: both;
    margin-top: 20px;
    float: left;
    width: ~"calc(98% - 40px)";
    margin-bottom: -20px;
    padding: 20px;
    min-height: 300px;
}
#innerbottom .moduletable h3.testimonial{
	    margin: 0;
    font-size: 22px;
    color: #01587a;
    font-weight: 400;
	font-family: 'Roboto', sans-serif;
	padding-bottom: 15px;
}
.uk-overlay-panel div.uk-text-large::before {
    content: url(voor.png);
    display: block;
    position: absolute;
    margin-right: 50px;
    top: 0;
    left: 0;
}
.uk-overlay-panel div.uk-text-large::after {
    content: url(achter.png);
    display: block;
    position: absolute;
    margin-top: 7px;
    right: -30px;
    bottom: 0;
}
.uk-overlay-panel div.uk-text-large p{
	font-size: 14px;
    color: black;
    font-weight: normal;
    text-align: left;
}
.uk-overlay-panel div.uk-text-large{
	width: 95%;
        margin: 0 0 0 5%;
}
.inner .uk-slider-container li {
    margin-bottom: 10px;
    font-size: 1.2em;
    text-align: justify;
    line-height: 1.8em;
}
.uk-slider, .uk-overlay {
    max-width: 98%;
    overflow: unset;
    min-height: 300px;
	height: auto !important;
}
.uk-overlay-panel h3{
	font-size: 20px;
    color: #01587a;
    font-weight: 400;
    width: 94%;
    font-family: 'Roboto', sans-serif;
    margin: 0 0 0 5%;
}
.uk-slidenav-position .uk-slidenav-next {
    right: -10px;
}
.uk-slidenav-position .uk-slidenav-previous {
    left: -10px;
}
.uk-grid{
	margin-left: 0px;
}
.uk-grid > * {
    padding-left: 40px;
    padding-right: 40px;
}
.mobile{display: none;}
.desktop{display: block;}
.desktop.kantoorbutton img{
	width: 100%;
	padding: 0 0px 20px;
	margin: 0 auto;
}
.uk-scope .uk-panel>:last-child {
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 300;
}
.uk-scope .uk-panel{
	padding: 30px 70px;
}
.uk-scope .uk-margin-remove-top {
    margin-top: 0!important;
    position: absolute;
    bottom: 0;
    right: 70px;
    bottom: 5px;
}
.uk-scope .uk-panel::before {
    content: url(https://staging.spanjenalatenschap.com/templates/e2etpl/less/voor.png);
    display: block;
    position: absolute;
    margin-right: 50px;
    top: 0;
    left: 0;
}
.uk-scope .uk-panel::after {
    content: url(https://staging.spanjenalatenschap.com/templates/e2etpl/less/achter.png);
    display: block;
    position: absolute;
    margin-top: 7px;
    right: -30px;
    bottom: 0;
}
@media only screen and (max-width: 800px){
	.uk-slider, .uk-overlay {
    max-width: 98%;
    overflow: unset;
    min-height: 350px;
	height: auto !important;
}
	#innerbottom .moduletable{
	background-color: #dddee0;
    clear: both;
    margin-top: 20px;
    float: left;
    width: ~"calc(98% - 40px)";
    margin-bottom: -20px;
    padding: 20px;
    min-height: 350px;
}
	.uk-overlay-panel div.uk-text-large {
    width: 92%;
    margin: 0 0 0 8%;
}
}
@media only screen and (max-width: 550px){
	
.uk-overlay-panel div.uk-text-large::before, .uk-overlay-panel div.uk-text-large::after {
    content: none;
}
	.uk-grid > * {
		padding: 0 10px !important;
margin-left: -35px;
width: 350px !important;
}
		.uk-slider, .uk-overlay {
    max-width: 98%;
    overflow: unset;
    min-height: 450px !important;
	height: auto !important;
}
	#innerbottom .moduletable{
	background-color: #dddee0;
    clear: both;
    margin-top: 20px;
    float: left;
    width: ~"calc(98% - 40px)";
    margin-bottom: -20px;
    padding: 20px;
    min-height: 450px !important;
}
			.mobile{display: block;}
.desktop{display: none;}
	.mobile.kantoorbutton img{
	/*max-width: 227px;*/
		max-width: 100% !important;
}
		#main.nosubpage #middle {
    width: 90%;
    float: left;
    margin-top: -195px;
    padding: 25% 5%;
}
			/*------- enkel als de banner niet getoond wordt --------*/
	#main.nosubpage > .relative{
		height: 155px;
	}
		#main.nosubpage #middle {
    width: 90%;
    float: left;
    margin-top: -195px;
    padding: 0% 5%;
}
}
.desktop.kantoorbutton{
	width: 90%;
    text-align: right;
    margin: -30px auto -180px;
	max-width: 1140px;
}
.desktop.kantoorbutton img{
	width: 450px;
	height: auto;
	padding: 0 0px 20px;
	margin: 0 auto;
}
.mobile.kantoorbutton {
    float: right;
    text-align: right;
}
@import "event-booking";
@import "responsive";