@font-face {
    font-family: 'Genericons';
    src: url('fonts/genericons/genericons-regular-webfont.eot');
    src: url('fonts/genericons/genericons-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('fonts/genericons/genericons-regular-webfont.woff') format('woff'),
        url('fonts/genericons/genericons-regular-webfont.ttf') format('truetype'),
        url('fonts/genericons/genericons-regular-webfont.svg#genericonsregular') format('svg');
    font-weight: normal;
    font-style: normal;
} 
/* ==========================================================================
    MAIN
========================================================================== */
body {max-width: 1600px; margin: auto; font-size: 16px; line-height: 28px; font-weight: 400; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  -webkit-font-smoothing: subpixel-antialiased;}
.container {padding-left: 5%; padding-right: 5%;}
/*.css-events-list {padding: 0 5%;}*/
a {-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear;transition: all 0.2s linear;}
a:hover {text-decoration: none; opacity: 0.6;}
h1, h2, h3, h4, h5, h6 {font-weight: 800; text-transform: uppercase;}
img {max-width: 100%; height: auto;}
section {padding: 50px 0; float: left; width: 100%; margin: 20px 0;}
section.widget {padding: 0px;}
.gradient { position: absolute; margin: auto; width: 1600px; max-width: 100%;}
.logo-menu {}
.admin-bar .logo-menu {top: 32px;}
footer {float: left; width: 100%;}

/* ==========================================================================
    WOOCOMMERCE 
========================================================================== */
.woocommerce-info::before {color: #f29a00;}
.woocommerce-info {border-top-color: #f29a00;}
.select2-container--default .select2-selection--single, .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {border: 2px solid #002841 !important; height: 60px; padding: 10px;}
.woocommerce ul.products li.product .price {font-size: 100%; font-weight: 700; color: !important;}
.order-details th, .order-details td{width: 30%;}

/* ==========================================================================
    BUTTON
========================================================================== */
.woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,.woocommerce ul.products li.product .button:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .tickera-button:hover, #submitReview:hover, .readmore a:hover, .btn-default:hover, button:hover, input[type="reset"]:hover, input[type="button"]:hover {background-color: #0099af!important;}
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce ul.products li.product .button, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt, .tickera-button, #submitReview, .readmore a, .btn-default, .event-content a.btn , .btn{
    color: #FFFFFF!important;
    background-color: #0099af;
    padding: 5px 16px!important;
    font-size: 20px!important;
    font-weight: 700;
    line-height: 26px!important;
    border-color: white!important;
    border-radius: 0!important;
    -moz-border-radius: 0!important;
    -webkit-border-radius: 0!important;
    text-shadow: none!important;
    -moz-text-shadow: none!important;
    -webkit-text-shadow: none!important;
    border: none!important;
}
 .su-button span {border: none!important;} 
.ticket-quantity .tickera_button {background: none!important;}
.readmore a {background-color: #0097D8;}
.su-button {border-radius: 0!important; border: none!important;}
.readmore a {font-size: 16px!important;}
/* ==========================================================================
    HEADER
========================================================================== */
.logo-menu {float: left; width: 100%;}
.navbar {margin-bottom: 0; padding: 30px 0;}
.navbar-collapse {padding: 30px 15px;}
.navbar-brand {height: auto; padding: 7px 15px;}
.navbar-default {border: none; border-radius: 0; background-color: #ffffff;}
.navbar-default .navbar-nav > li { margin: 0 15px; border-radius: 0px; }
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover,.navbar-default .navbar-nav > .active > a:focus, .subpages ul li a {padding: 10px 15px; border-radius: 0px; color:#666666;}
.navbar-default .navbar-nav li a {text-transform: uppercase; font-weight: 800; letter-spacing: -0.5px; padding: 10px 20px;}
.navbar-default .navbar-nav li.open ul.dropdown-menu li a { background-color: #ffffff !important;}
.navbar .btn-default {margin: 30px 0; float: right; margin-right: 24px;}
.dropdown-menu {padding: 25px 30px 25px 30px;}
.dropdown-menu > li > a {font-size: 60%!important; font-weight: 700!important;}
.dropdown-menu > li > a:hover:before {
    content: "";
    display: inline-block;
    background: url("../img/arrow-right-blue.png") no-repeat top left;
    width: 32px;
    height: 10px;
    position: absolute;
    left: 20px;
    margin-top: 6px;
}
ul.dropdown-menu li:hover {opacity: 1!important;}
.dropdown-menu li:hover {}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {background-color:#fff!important; }
.navbar-nav > li:focus > .dropdown-menu, .navbar-nav > li:hover > .dropdown-menu{background-color:#fff!important; color:#666666!important;}
.navbar-toggle {background-color: #0099af!important; border:none!important;}
.navbar-default .navbar-toggle .icon-bar {background-color: #ffffff;}

/**** 
SPECIALE HEADER WIDGET OPMAAK
****/

/**** 
SPECIALE HEADER WIDGET OPMAAK
****/

/* ==========================================================================
    HERO
========================================================================== */

#hero-area {padding-top: 0;background-repeat:no-repeat;background-attachment:scroll;background-position:center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;color:#fff}
#hero-area .btn, .event-content a.btn, .add_to_cart  { border-radius: 20px!important; background-color: #0099af!important; text-transform: uppercase; padding: 8px 24px!important; font-weight: 600; font-size: 80%;}
#hero-area .btn:hover, .event-content a.btn:hover, .add_to_cart:hover {opacity: 0.8;}
#hero-area img { max-width: 100%;}
#hero-area p { padding: 20px 0;}
#hero-area .row { padding: 50px 0;}
#hero-area h1 {color: #ffffff!important;  font-size: 270%!important;}
#hero-area h2 {color: #0099af!important; margin-bottom: 30px; font-size: 140%!important;}
.hero-inner { position: relative; min-height:475px; top: 25%;}
.hero-inner:before {position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; content: ""; display: block;}
.hero-inner .banner {text-align: center;}

/* ==========================================================================
    CTA
========================================================================== */


/* ==========================================================================
    FONT AWESOME
========================================================================== */



/* ==========================================================================
    CONTENT
========================================================================== */
.pageContent {overflow: hidden; width: 100%; display: inline-block;}

section.full {width: 100%;}
section.orange {background-color: #ffffff; padding: 100px 0; text-align: center;}
section.orange .home-widget {}
section.orange img {max-height: 100px;}
section.orange h3 {color: #0099af!important; font-size: 275%; margin-bottom: 30px;}
section.orange .btn, #openingstijden .btn { border-radius: 20px!important; background-color: #002841!important; color:#ffffff; text-transform: uppercase; padding: 8px 24px!important; font-weight: 600; font-size: 80%!important;}
section.orange .btn:hover, #openingstijden .btn:hover {opacity: 0.8;}

.package-content {padding: 0 50px;}
.package-content h2 {color: #002841; font-size: 250%!important; line-height: 90%; font-weight: 800; margin-top: 10px; height: 80px;}
.package-content h4 {color: #002841; font-size: 125%; width: 85%; height: 80px;}
.package-content h5 {font-size: 90%; line-height: 150%; margin-top: 30px; height: 125px; overflow: hidden;}
.package-content p {font-size: 90%; height: 145px; overflow: hidden;}
.package-content .custom-btn {color:#002841; font-weight: 600;}
.package-content .custom-btn:hover, .package-content .custom-btn:hover:after {text-decoration: none; opacity: 0.8;}
.package-content .custom-btn:after {
    content: "";
    display: inline-block;
    background: url("../img/arrow-right.png") no-repeat top right;
    width: 32px;
    height: 10px;
}
.su-button, .fullwidth .row > div:first-child .package-content .custom-btn { border-radius: 20px!important; background-color: #0099af!important; color:#ffffff; text-transform: uppercase; padding: 8px 24px!important; font-weight: 600; font-size: 80%;}
.fullwidth .row > div:first-child .package-content .custom-btn:after {display: none;}
.su-button span {background-color: transparent!important;}
.metaslider .caption-wrap, .su-slider-slide-title {opacity: 1!important; left:5%!important; text-transform: uppercase; font-weight: 800; bottom: 20%!important;; background: none!important;}
.metaslider .caption-wrap h3 {font-size: 160%;color: #ffffff!important;margin-bottom: 0;}
.metaslider .caption-wrap p {font-size: 90%;color: #ffffff!important;text-transform: none; font-weight: 400;}
.metaslider .caption-wrap p:after{
    content: "";
    display: inline-block;
    background: url("../img/arrow-right-white.png") no-repeat top right;
    width: 32px;
    height: 10px;
}
.flex-control-nav {left: 5%; bottom: 5%!important; text-align: left!important; z-index: 99;}
.flex-control-paging li a {background: rgba(255,255,255,0.5)!important;}
.flex-control-paging li a.flex-active {background: rgba(255,255,255,0.9)!important;}
.ref-posts .su-column-size-1-3 {padding-top: 5%;}
.ref-posts .su-column-size-1-3 h2{font-size: 270%; margin-bottom: 30px;}
.ref-posts {padding-bottom: 0;}
#news-posts {padding-top: 0;padding-bottom: 0;}
section.white {padding-bottom: 0; margin-bottom: 0;}
#latest_posts {margin-left: -40px; margin-right: -40px;}
#news-posts .latest_post {padding: 0 40px;}
#news-posts .latest_post h3{font-size: 100%; height: 65px; overflow: hidden;}
#news-posts .lp_img { height: 120px; overflow: hidden; margin-bottom: 30px;}
#news-posts .lp_img img {width: 100%; height: auto;}
a.newsReadmore, section#0099af a {width:100%; display: inline-block; margin-top: 10px; color: #002841;font-weight: 600; text-transform: lowercase;}
a.newsReadmore:after, section#orange a:after {
    content: "";
    display: inline-block;
    background: url("../img/arrow-right.png") no-repeat top right;
    width: 32px;
    height: 10px;
}
#bottom .widget ul {list-style: none; margin-left: -40px;}
#bottom .widget ul li a {text-transform: uppercase; font-weight: 600; text-decoration: none; padding: 10px 0; font-size: 90%;}
#bottom .widget ul li a:hover:after{
    content: "";
    display: inline-block;
    background: url("../img/arrow-right-white.png") no-repeat top right;
    width: 32px;
    height: 10px;
}
#instagram h3 {padding-left: 5%;}
#instagram {max-width: 1600px; margin:0;}
#instagram .feed {padding: 0;}
#sb_instagram.sbi_fixed_height {overflow: hidden;}
#openingstijden {text-align: center; padding-top: 0; margin-bottom: 0;}
#openingstijden h4 {font-size: 130%;}
#openingstijden img {max-height: 45px;}
#bottom {margin-top: 0; margin-bottom: 0;}
#contact-footer { padding: 20px 0; text-align: left;margin-top: 0; margin-bottom: 0;}
#contact-footer h3 {color: #002841!important; font-size: 100%;}
#contact-footer p {color: #002841; font-size: 80%; text-transform: uppercase; font-weight: 600;}
#contact-footer a {color: #002841; text-decoration: underline;}
#contact-footer a:hover {text-decoration: none;}
#contact-footer i {margin-right: 10px;}

.pageContent h1, .page-header h1{text-align: center; border-bottom: 2px solid #0099af; border-top: 2px solid #0099af; padding: 20px 0; margin: 50px 0;}
.pageContent p, .pageContent li {font-size: 90%;}
.page-header {border: none; padding: 0; margin: 0;}

section#orange {background-color: #0099af;}
section#orange h2{color: #ffffff!important; padding-left: 15px; margin-bottom: 30px;}
section#orange .img-container {width: 100%; max-height: 250px; overflow: hidden; display: inline-block;}
section#orange .img-container img {width: 100%; height: 100%;}

section.testimonials {background-color: #efefef;}

.event-image {height: 500px; overflow: hidden; display: inline-block; position: relative; background-color: #002841;}
.event-title {
    position:absolute;
    top:50%;
    margin: 0;
    text-align:center;
    transform:  translate(0, -50%);
    font-size: 200%;
    color: #fff;
    font-weight: 800;
    text-transform: uppercase;
    width: 100%;
}
.event-title h2 {color:#ffffff!important;}
.event-title span {font-size: 80%; font-weight: 500;}
.event-content {margin: 20px 0 100px 0; text-align: center;}
.event-content p {width: 80%; text-align: center; margin: 10px 10%; height: 80px; overflow: hidden;}
.event-content a.btn {margin-top: 50px;}
.event-content a.btn a {color:#ffffff!important;}
.page-template-template-blogs .agenda-item, .agenda .agenda-item {width: 33%; float: left; padding: 0 2%;}
.page-template-template-blogs .event-image, .agenda .event-image {height: auto; max-height: 170px; background-color: #002841; width: 100%;}
.event-image, .event-image img {width: 100%;}
.event-image img {opacity: 0.8;}
.agenda .event-title {}
.page-template-template-blogs .event-title h2, .agenda .event-title h2 {font-size: 60%;}
.page-template-template-blogs .event-title span, .agenda .event-title span {font-size: 40%; font-weight: 500;}
.page-template-template-blogs .event-content a.btn a, .agenda .event-content a.btn a {font-size: 75%!important;}
#sidebar {padding: 30px;}
#sidebar p, #sidebar label{color: #ffffff; width: 100%;}
.tickera {width: 100%;}
.tickera td, .tickera th {padding: 10px 0;}
.add_to_cart {color: #ffffff!important;}

hr {border-top: 2px solid #0099af}
.css-events-list {margin-top: 40px;}

figure {border: none!important; max-width: 95%;}
figcaption {display: none;}

/* ==========================================================================
    CONTACT
========================================================================== */
.wpcf7-email, .wpcf7-text {border: 2px solid #002841!important; background-color: #ffffff; padding: 10px; height: 60px;border: none; text-transform: uppercase;} 
.wpcf7-textarea {border: 2px solid #002841!important;}
#contact-footer .wpcf7-email, #contact-footer .wpcf7-text {background-color: #002841!important; color: #ffffff; padding: 10px; height: 60px;border: none; text-transform: uppercase;} 
#sidebar .wpcf7-email, #sidebar .wpcf7-textarea, #sidebar .wpcf7-text {background-color: #ffffff!important; color: #002841; padding: 10px; height: 60px;border: none; text-transform: uppercase; width: 100%;-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear;transition: all 0.2s linear;} 
#sidebar .wpcf7-textarea:focus {height: 300px;-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear;transition: all 0.2s linear;}
.wpcf7-submit{
    content: "";
    display: inline-block;
    background:url("../img/send.png") no-repeat center;
    width: 60px;
    height: 60px;
    padding: 10px;
    background-color: #002841!important;
    border: none;
    margin-left: 4px;
    text-indent: -9999em;
    text-transform: uppercase; 
}
.wpcf7-submit:hover {background-color: #002841!important; opacity: 0.8;}
span.wpcf7-not-valid-tip {position: absolute; padding: 10px; background-color: #ffffff;}

/* ==========================================================================
    BLOGS
========================================================================== */



/* ==========================================================================
    SOCIAL NAVIGATION
========================================================================== */
.screen-reader-text {position: absolute; top:-9999em;left:-9999em;}
.social-navigation {display: inline-block; float: right;transition: all 0.5s linear 0s;}
.social-navigation ul {list-style: none;text-align: center;text-align: right;margin-bottom: 0;display: inline-block;padding: 5px 10px;margin-right: 10%;width: 100%;}
.social-navigation ul li {display: inline;margin: 0 0 0 16px;margin: 0 0 0 1rem;}
.social-navigation ul li:first-child {margin: 0;}
.social-navigation a {position: relative;text-decoration: none;padding: 5px 10px;}
.social-navigation a:focus:before,.social-navigation a:hover:before {opacity: 0.75;}
.social-navigation a:before {color: #000;content: "\f1e0"; /* mark unsupported links with generic "share" icon */font-size: 24px!important;font-size: 1.6rem!important;line-height: 1.1;}
.social-navigation a[href^="mailto:"]:before                 { content: "\f003"; color: #000;    }
.social-navigation a[href*="behance.net"]:before         { content: "\f1b4"; color: #000;    }
.social-navigation a[href*="codepen.io"]:before           { content: "\f1cb"; color: #000;    }
.social-navigation a[href*="digg.com"]:before               { content: "\f1a6"; color: #000;    }
.social-navigation a[href*="dribbble.com"]:before       { content: "\f17d"; color: #ea4c89; }
.social-navigation a[href*="dropbox.com"]:before         { content: "\f16b"; color: #007ee5; }
.social-navigation a[href*="facebook.com"]:before       { content: "\f09a"; color: #3b5998; }
.social-navigation a[href*="snapchat.com"]:before       { content: "\f2ab"; color: #3b5998; }
.social-navigation a[href*="flickr.com"]:before           { content: "\f16e"; color: #ff0084; }
.social-navigation a[href*="foursquare.com"]:before   { content: "\f180"; color: #f84777; }
.social-navigation a[href*="plus.google.com"]:before { content: "\f0d4"; color: #dd4b39; }
.social-navigation a[href*="github.com"]:before           { content: "\f09b"; color: #4183c4; }
.social-navigation a[href*="instagram.com"]:before     { content: "\f16d"; color: #3f729b; }
.social-navigation a[href*="last.fm"]:before                 { content: "\f202"; color: #d51007; }
.social-navigation a[href*="linkedin.com"]:before       { content: "\f0e1"; color: #0e76a8; }
.social-navigation a[href*="ok.ru"]:before       { content: "\f263"; color: #f58220; }
.social-navigation a[href*="odnoklassniki.ru"]:before       { content: "\f263"; color: #f58220; }
.social-navigation a[href*="pinterest.com"]:before     { content: "\f0d2"; color: #c8232c; }
/* .social-navigation a[href*="polldaddy.com"]:before     { content: "\f"; color: #bc0b0b; } */
.social-navigation a[href*="getpocket.com"]:before     { content: "\f265"; color: #ee4056; }
.social-navigation a[href*="reddit.com"]:before           { content: "\f1a1"; color: #336699; }
.social-navigation a[href*="skype.com"]:before,
.social-navigation a[href*="skype:"]:before                   { content: "\f17e"; color: #00aff0; }
.social-navigation a[href*="soundcloud.com"]:before   { content: "\f1be"; color: #ff4700; }
.social-navigation a[href*="spotify.com"]:before         { content: "\f1bc"; color: #a9d03f; }
.social-navigation a[href*="stumbleupon.com"]:before { content: "\f1a4"; color: #ff2618; }
.social-navigation a[href*="tumblr.com"]:before           { content: "\f173"; color: #34526f; }
.social-navigation a[href*="twitch.tv"]:before             { content: "\f1e8"; color: #6542a6; }
.social-navigation a[href*="twitter.com"]:before         { content: "\f099"; color: #33ccff; }
.social-navigation a[href*="vimeo.com"]:before             { content: "\f194"; color: #1ab7ea; }
.social-navigation a[href*="vk.com"]:before                   { content: "\f189"; color: #4c75a3; }
.social-navigation a[href*="wordpress.org"]:before,
.social-navigation a[href*="wordpress.com"]:before     { content: "\f19a"; color: #21759b; }
.social-navigation a[href*="xing.com"]:before               { content: "\f168"; color: #015a60; }
.social-navigation a[href*="youtube.com"]:before         { content: "\f167"; color: #c4302b; }
.social-navigation a[href$="/feed/"]:before                   { content: "\f143"; color: #fb9f3b; }
.social-navigation a[href*="documentdialog.com"]:before     { content: url(../img/Document-Dialog-icon.png); color: #0397d6; }
.social-navigation a[href*="engagedialog.eu"]:before               { content: url(../img/Engage-Dialog-icon.png); color: #ef7620; }
.social-navigation a[href*="socialdialog.eu"]:before         { content: url(../img/Social-Dialog-icon.png); color: #cc007b; }
.social-navigation a[href*="ccmmasters.eu"]:before                   { content: url(../img/CCM-Masters-icon.png); color: #77bc1f; }
.social-navigation a[href*="customerid.eu"]:before                   { content: url(../img/CustomerID-icon.png); color: #1eb9ec; }
.author-link:after,
.byline:before,
.cat-links:before,
.comments-link:before,
.content-area a[href$=doc]:before,
.content-area a[href$=docx]:before,
.content-area a[href$=gz]:before,
.content-area a[href$=pdf]:before,
.content-area a[href$=ppt]:before,
.content-area a[href$=pptx]:before,
.content-area a[href$=rar]:before,
.content-area a[href$=xls]:before,
.content-area a[href$=xlsx]:before,
.content-area a[href$=zip]:before,
.content-area .icon-archive-file:before,
.content-area .icon-excel:before,
.content-area .icon-pdf:before,
.content-area .icon-powerpoint:before,
.content-area .icon-word:before,
.edit-link:before,
.entry-content a[target=_blank]:link:after,
.entry-content .more-link:after,
.entry-format:before,
.entry-header .title-comment-meta a:before,
.entry-summary .more-link:after,
.format-aside .entry-format:before,
.format-image .entry-format:before,
.format-link .entry-format:before,
.format-quote .entry-format:before,
.format-status .entry-format:before,
.full-size-link:before,
.icon-webfont,
.posted-on:before,
.tags-links:before,
.author .page-title:before,
.category .page-title:before,
.date .page-title:before,
.error-404 .page-title:before,
.search-no-results .page-title:before,
.search-results .page-title:before,
.sticky .page-title:before,
.tag .page-title:before,
.nav-menu .menu-item-has-children > a:after,
.nav-menu .page_item_has_children > a:after,
.sub-menu .menu-item-has-children > a:after,
.sub-menu .page_item_has_children > a:after,
.nav-next a:after,
.nav-previous a:before,
.pagination .next:after,
.pagination .prev:before,
.post-password-required .entry-title:before,
.status-private .entry-title:before,
.social-navigation a,
.social-navigation a:before,
ul.list-icon-ok li:before,
ul.list-icon-file li:before,
ul.list-icon-hand-right li:before {-moz-osx-font-smoothing: grayscale;-webkit-font-smoothing: antialiased;display: inline-block;font-family: FontAwesome;font-size: 16px;font-size: 1rem;font-style: normal;font-variant: normal;font-weight: normal;line-height: 1;speak: none;text-align: center;text-decoration: inherit;text-transform: none;}
a.icon-webfont,
a .icon-webfont,
a:hover.icon-webfont,
a:hover .icon-webfont,
a:active.icon-webfont,
a:active .icon-webfont,
.entry-content a[target=_blank]:link:after {text-decoration: none!important;}

/*=====================================================
=            Bootstrap 2.3.2 Media Queries            =
=====================================================*/
@media (max-width: 599px) { 
    .mobile-not {display: none;}
    .navbar {padding: 10px 0 0 0;}
    #hero-area h1 {font-size:160%!important;}
    #hero-area .btn, .event-content a.btn {font-size: 85%!important; padding: 8px 15px;}
    section.orange .btn, #openingstijden .btn {font-size: 50%!important; padding: 8px 15px;}
    .ref-posts .su-column-size-1-3 h2 {font-size: 180%!important;}
    .wpcf7-email, .wpcf7-text {width: 70%;}
    .package-content h2 {font-size: 180%;}
    h3 {font-size: 14px;}
    p {font-size: 12px;}
    .col-one-fifth {width: 100%;}
    .content-info {float: left;}
    section.orange h3 {font-size: 200%;}
    .metaslider {display: none;}
    section {padding: 20px 0;}
    .package-content {padding: 0;}
    .navbar-default .navbar-nav li a {font-size: 18px;}
    #hero-area, #hero-area .gradient {height: 350px!important;}
    .hero-inner {top: 0; min-height: 330px;}
    .package-content, .latest_post {padding: 0 0 20px 0; margin-bottom: 20px; border-bottom: 2px solid #f29a00;}
    .package-content h2 {font-size: 200%; margin-top: 0; height: 60px;}
    .package-content h5 {height: 70px;}
    .event-image {height: 320px;}
    .pageContent h1, .page-header h1 {font-size: 28px;}
    #news-posts .latest_post{padding: 0;}
    #latest_posts {margin: 0;}
    .page-template-template-blogs .agenda-item, .agenda .agenda-item {width:100%; padding: 0;}
}

@media (min-width: 600px) and (max-width:899px) { 
    .navbar {padding: 10px 0 0 0;}
    #hero-area h1 {font-size:160%!important;}
    #hero-area .btn, .event-content a.btn {font-size: 50%!important; padding: 8px 15px;}
    section.orange .btn, #openingstijden .btn {font-size: 50%!important; padding: 8px 15px;}
    .ref-posts .su-column-size-1-3 h2 {font-size: 180%!important;}
    .wpcf7-email, .wpcf7-text {width: 70%;}
    h3 {font-size: 18px;}
    .col-one-fifth {width: 100%;}
    section.orange h3 {font-size: 200%;}
    section {padding: 20px 0;}
    .package-content {padding: 0;}
    .navbar-default .navbar-nav li a {font-size: 18px;}
    #hero-area, #hero-area .gradient {height: 350px!important;}
    .hero-inner {top: 0; min-height: 330px;}
    .package-content, .latest_post {padding: 0 0 20px 0; margin-bottom: 20px; border-bottom: 2px solid #f29a00;}
    .package-content h2 {font-size: 200%; margin-top: 0; height: 60px;}
    .package-content h5 {height: 70px;}
    .event-image {height: 320px;}
    .pageContent h1, .page-header h1 {font-size: 28px;}
    #news-posts .latest_post{padding: 0;}
    #latest_posts {margin: 0;}
}

@media (min-width: 900px)  and (max-width:1199px) { 
    .package-content, .latest_post {height: 300px;}
    .col-one-fifth {width: 46%; margin: 0 2%; height: auto;}
        .wpcf7-email, .wpcf7-text {width: 70%;}

}

@media (min-width: 1200px) { 
    .container {width: 1600px; max-width: 100%;} 
    .col-one-fifth {width: 20%; float: left; padding: 0 15px!important; margin: 0;}
    .package-content, .latest_post {border-bottom: 0px}
    section.orange .btn, #openingstijden .btn {}
}

@media (min-width: 1800px) { 

}