/* TEST */ // LOAD LIBARY @import "lib/source"; @import "settings"; @import url('https://fonts.googleapis.com/css?family=Arvo|Barlow:300,300i,600,600i,800&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: 18px;line-height: 140%; font-family: 'Barlow', sans-serif; background-image: url(/images/back.png); background-position: top center; background-repeat: no-repeat; } // 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 { .c(@red); &:hover, &:active, &:focus { outline: 0; } &:hover, { .c(@orange); } 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%; .wrapper { .w(100%); margin: 0 auto !important; max-width: 1200px; } .wrapper, [class^="grid"], .inner { .m(0); } } #header .wrapper.row{height: 120px; position: relative;} #header .grid3{width: auto;} // logo #logo { .w(n,250); margin-top: 25px !important; a { .o(block); .ta(center); } h1 { .notext(); .m(0); } p { .m(0); .pt(24);padding-top: 24px; display: table; float: left; margin: 0 0 0 0; } img { width: 250px;} &:hover { .op(0.85); .tr(opacity 0.2s ease-in); } } // slogan #slogan { .w(n,660); margin: 55px 20px 0px 175px!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(left); .hmenu(@menubar,10,8,level1);.pl(16); .m(0); a.level1 { .t(16,@menubar,black); .ls(1.4); .lh(26); font-weight: 300; &:hover, &.active { text-decoration: underline;} } } .menubar-right { .fl(left); .s(35%,@menubar); .hgrad(@red,rgba(256,256,256,0)); } } .inline-menu{ float: right; } // 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(@footer); float: left; width: 100%; .wrapper { .w(60%,830); .m(40,auto,0,auto); .ps(relative); } #middle { .bg(fade(white,60)); .clf(); .p(20,35,0,100); &.noLeft { .pl(20);} } #content h1 { .mt(0); } .bgfade { .h(60); .vgrad(fade(white,80),fade(white,0)); .mb(35); } &.nosubpage #middle { .brad(20,20,0,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(40); background-color: #325064; float: left; width: 100%;; /*.footerbottom { .bgc(@red); .h(@footer - @menubar); }*/ .wrapper{max-width: 1200px; margin: 0 auto; position: relative; .blokje{position: absolute; right: 0; bottom: 0;} .copyright{float: right; margin: 0; position: absolute; bottom: 12px; right: 120px; width: 290px; text-align: right; color: white; 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) } } // ============================================================================ // 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);} } // Phone Styles @media only screen and (max-width: 640px) { 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(auto); .wrapper { overflow: hidden;} #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(30%); .mp(0); .minw(0); .m(25,0,25,10); 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);} #header { height: 220px; } .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(#325064); .w(100%); .c(white); .minh(40); .lh(40); 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(relative); .popup {.o(block); background:#fff; .ps(relative); .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; } 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);} } .language-wrapper{ float: right; margin-top: 0px; margin-right: 0px; position: absolute; right: 10px; top: 15px; } .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; } .language-wrapper .lang-active a{ color: yellow; } .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: 100%; float: left; margin-top: 30px; } #main #right.grid3{ float: right; width: 30%; margin-top: 115px; } #main #right.grid3 .inner h2{ font-family: 'Barlow', 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{ width: 14%; margin: 1% !important; float: left; } .col2{ width: 46%; margin: 1% 2% !important; float: left; } .col3{ width: 26%; margin: 1% !important; float: right; background-color: #f9f9f9; padding: 2% 3% 3% !important; font-size: 15px; } #yoo-zoo .items h1.pos-title{ font-family: 'Barlow', sans-serif; font-weight: 600; letter-spacing: 1px; } #yoo-zoo .items h2.pos-subtitle, .yoo-zoo h3 { font-family: 'Barlow', 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: 'Barlow', 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; } .cc-banner .cc-btn:last-child { background-color: #325064 !important; } .cc-banner.cc-bottom { background-color: #7cbfe9 !important; } div.mod-languages ul.lang-inline li { display: inline-block; } #main #bottom .grid12 .inner .uk-overlay-fade { width: 100%; height: auto; } .uk-grid>* { padding-left: 0 !important; } @media only screen and (max-width: 1024px) { body { background: #fff !important; } } @media only screen and (max-width: 640px) { #header { height: 200px; } #header #logo { width: 60%; margin: 0; padding: 0; min-width: 0; margin: 38px -30%; margin-top: 38px; top: 25px; position: absolute; left: 50%; } #header #slogan { display: inline-block; background-image: url(/templates/e2etpl/img/n); min-width: 0; text-align: center; padding: 15px 0; position: absolute; right: 0; left: inherit; width: 100%; top: 50px; } #header .wrapper.row { height: 150px; position: relative; overflow: unset; } #mobile-menubar { background-color: #325064; margin-top: 25px; } .frontpage #main.nosubpage #middle { width: 90%; float: left; margin-top: 30px; padding: 0 5%; } #main #right.grid3 { float: right; width: 100%; margin-top: 30px; } .inside #contentWrapper .wrapper { width: 90%; min-width: auto; margin: 0px 5%; position: relative; } #main #middle.noLeft { padding-left: 0px; } .col1 { width: 30%; margin: 1% !important; float: left; } .col2 { width: 96%; margin: 1% 2% !important; float: left; } .col3 { width: 96%; margin: 1% 2% !important; float: left; background-color: #f9f9f9; padding: 20px !important; font-size: 15px; } } @import "event-booking"; @import "responsive";