/* cmsms stylesheet: Ijsclub Vosbergen - Reset modified: woensdag 28 oktober 2026 09:20:23 */
html, body, p, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn,  font, img, ins, kbd, q, s, samp,
small, strike, 
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}

.clear	{ clear: both; }
/* cmsms stylesheet: Ijsclub Vosbergen - Main modified: donderdag 29 oktober 2026 14:33:02 */
/* Ijsclub Vosbergen Heerde */
/* Realisatie Bonfix */
/* Blauw: #298ff8; - Donkergrijs: #3c3c3c; Lijnkleur: #d0d0d0; */

@font-face { font-family: 'Eagle'; src: url('/fonts/Eagle-Book.woff2') format('woff2'), url('/fonts/Eagle-Book.woff') format('woff'); font-weight: 500; font-style: normal;}

body,html { padding: 0; margin: 0; font-family: "Arial",verdana,sans-serif; line-height: 24px; color: #3c3c3c; font-size: 14px; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/backgr-mainnav.jpg') top repeat-x; }

h1,h2,h3 { font-family: 'BenchNine', sans-serif; text-transform: uppercase; padding-bottom: 5px; }
h1,h2.news { font-size: 38px; font-weight: 700; color: #298ff8; line-height: 35px; }
h2.news { color: #3c3c3c !important; padding-left: 0 !important; }
h2 { font-size: 24px; color: #3c3c3c; font-weight: 700; }
h3.album-title { font-size: 24px; font-weight: 700; }
h3.news-large-title { font-size: 28px; font-weight: 700; padding: 10px 0 0 5px; }
h3.guestbook { padding: 15px 0; margin-top: 10px; font-size: 28px; color: #3c3c3c; }

a { color: #298ff8; text-decoration: underline; }
a.lidworden-btn { font-family: 'BenchNine', sans-serif; font-size: 46px; display: block; margin: 130px 0 0; padding: 23px 20px 20px; text-decoration: none; color: #fff; float: right; background: #ea0a0a; }
a.lidworden-btn:hover { background: #ff0000;  }

a.reserveren-btn { font-family: 'BenchNine', sans-serif; font-size: 46px; display: block; margin: 130px 5px 0 5px; padding: 23px 20px 20px; text-decoration: none; color: #fff; float: right; background: #228c22; }
a.reserveren-btn:hover { background: #0CBB06;  }

p { margin-bottom: 20px; }
p strong,strong { font-weight: normal; color: #298ff8; }

.error_message {color:red; font-weight:bold;border: 1px solid red; background-color: #fcf8e3;}
.center { width: 980px; margin: 0 auto; }

#container { border-bottom: 1px solid #d0d0d0; overflow: hidden; }

.open-or-closed { width: 187px; height: 163px; position: absolute; top: 0; right: 0; }

table.ui-datepicker-calendar,
table.ui-datepicker-header { font-size: 11px !important; }

#container .open-or-closed { width: 187px; height: 163px; position: absolute; top: 0; right: 0; }

#container .mainnav { font-family: 'BenchNine',arial,sans-serif; color: #fff; font-size: 16px; text-transform: uppercase; overflow: hidden; }
#container .mainnav ul { list-style: none; margin: 0; padding: 0; }
#container .mainnav ul li { float: left; display: inline; }
#container .mainnav ul li a:first-child { margin: 0; }
#container .mainnav ul li a { height: 50px; line-height: 50px; display: block; padding: 0 12px; float: left; margin: 0 10px; text-decoration: none; color: #fff; }
#container .mainnav ul li a:hover,
#container .mainnav ul li a.menuactive { background-color: #fff; color: #298ff8; }

#container .hdr-img { height: 225px; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/backr-header.jpg') top no-repeat; }

#container .content { padding-top: 15px; margin-top: 30px; margin-bottom: 30px; position: relative; overflow: hidden; }
#container .content.home { background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/backgr-content-home.jpg') left repeat-y; }
#container .content .intro { float: left; padding: 0 20px 10px 0; }
#container .content .intro.small {  width: 330px; }
#container .content .intro.wide { width: 700px; }

#container .gallery.details { padding-top: 20px; }

#container .content .news { width: 260px; float: left; padding-left: 40px; }
#container .content a.news-item-compact { padding: 10px 10px; display: block; clear: both; border-bottom: 1px solid #d0d0d0; text-decoration: none; color: #3c3c3c; line-height: 16px; }
#container .content a.news-item-compact:hover { border-bottom-color: #cbdbe4; background-color: #f5fafd; }
#container .content a.news-item-compact .news-title { font-weight: bold; }
#container .content a.news-item-compact .news-date { padding-left: 15px; font-size: 12px; color: #717171; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/icon-calendar.gif') center left no-repeat; }
#container .content a.news-readall { display: block; float: right; padding: 6px 12px; margin: 15px 0; border: 1px solid #ccc; text-decoration: none; }
#container .content a.news-readall:hover { border-color: #cbdbe4; background-color: #f5fafd; }
#container .content .news-item-expanded { margin-top: 15px; }
#container .content .news-item-expanded .subinfo { font-size: 12px; color: #717171; padding: 0 5px 5px 5px; border-bottom: 1px solid #d0d0d0; }
#container .content .news-item-expanded .txt p { margin-bottom: 10px; }
#container .content .news-item-expanded .txt { padding: 0 5px; margin-bottom: 20px;}
#container .content .news-item-expanded .txt.summary { font-weight: bold; font-size: 14px; margin: 15px 0 5px; }
#container .content .news-item-expanded .bijlagen a { display: block; border: 1px solid #d0d0d0; color: #717171; text-decoration: none; padding: 4px 28px; margin-top: 5px; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/icon-download.png') left center no-repeat; }
#container .content .news-item-expanded .bijlagen a:hover { border-color: #cbdbe4; background-color: #f5fafd; }
#container .content .back-btn a { display: block; position: absolute; top: 10px; right: 280px; border: 1px solid #ccc; padding: 6px 12px 6px 40px; text-decoration: none; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/go-back.png') 3px 2px  no-repeat; }
#container .content .back-btn a:hover { border-color: #cbdbe4; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/go-back.png') #f5fafd 3px 2px no-repeat; }

#container .photo-mask { width: 250px; height: 420px; position: relative; float: right; }
#container .photo-mask .mask { width: 250px; height: 420px; position: absolute; top: 0; right: 0; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/image-snow-mask.png') no-repeat; }

#container .guestbook-form { font-size: 12px; }
#container .guestbook-form table { padding: 1px 0; }
#container .guestbook-form table tr td input[type="text"],
#container .guestbook-form table tr td textarea { font-family: 'Arial',verdana,sans-serif; font-size: 14px; padding: 8px 8px; }
#container .guestbook-form table tr td { padding: 3px 6px; }
#container .guestbook-form table tr td:first-child { width: 140px; }
#container .guestbook-form .cms_textarea { width: 515px; height: 100px; }
#container .guestbook-form .error { font-size: 14px; padding: 4px 8px 4px 26px; margin-top: 15px; border: 1px solid #ff9e9e; color: #9f1010; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/icon-stop.png') #fce4e4 left center no-repeat; }

#container .guestbook-comments { font-size: 12px; line-height: 18px; border: 1px solid #cbdbe4; padding: 6px 0; margin: 5px 6px 10px 0; background: #f5fafd; }
#container .guestbook-comments .comment-headerline { border-bottom: 1px solid #cbdbe4; padding: 0 6px 5px; margin: 0 6px 0; }
#container .guestbook-comments .comment-headerline strong { color: #298ff8; font-weight: normal; }
#container .guestbook-comments .comment-txt { font-style: italic; padding: 0 6px 0 20px; margin: 10px 10px 5px; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/icon-comment.png') 0 2px no-repeat; }

#container .contact-form { font-size: 12px; }
#container .contact-form table tr td { padding: 3px 6px; }
#container .contact-form table tr td:first-child { width: 140px; }
#container .contact-form table tr td input[type="text"],
#container .contact-form table tr td input[type="email"],
#container .contact-form table tr td textarea { width: 271px !important; font-family: 'Arial',verdana,sans-serif; font-size: 14px; padding: 8px 8px; }
#container .contact-form table tr td textarea { width: 515px !important; height: 100px !important; }

#container .top-border { border-top: 1px solid #d0d0d0; }

#container .social-media { margin-top: 30px; margin-bottom: 30px; overflow: hidden; background: url('https://site.ijsclubvosbergen.nl/uploads/images/website/twitter-logo-transp.png') bottom right no-repeat; }
#container .social-media .facebook { width: 350px; float: left; }
#container .social-media .twitter { width: 590px; float: right; }

#footer { font-size: 11px; color: #949494; padding: 10px 0; line-height: 20px; margin-bottom: 25px; }
#footer div:first-child { font-size: 14px; }
#footer div a { color: #298ff8; text-decoration: none; }

.ice-thickness {float:right;}
.ice-thickness h2 {font-size: 38px; padding-bottom:15px;}
.ice-thickness .body {position: relative;}
.ice-tooltips {position: absolute; top:0; left: 0;}
.ice-tooltips div {line-height:16px; font-size:14px; padding-right: 10px;  font-family: 'Eagle', sans-serif; text-transform: uppercase; z-index:99; position: absolute; text-align: right; color:#74b0cf;  left: -300px; width:290px}
.ice-tooltips div.showhide {display:none}


  .sponsor {
        border:1px solid #ccc;
        float:left;
        width:650px;
        margin: 10px;
        height:180px;
        box-shadow: rgba(99, 99, 99, 0.2) 0 2px 8px 0;
        overflow: hidden;
        position: relative;
    }
   .sponsor:hover {
        border: 1px solid #aaa;
    }
    .sponsor.small {
        height: 50px;
        padding-top: 5px;
    }
    .sponsor h3 {
        border-bottom: 1px solid #cbdbe4;
        text-align: center;
        padding: 10px 0;
        display: block;
        font-size: 2em;
    }
    .sponsor.small h3 {
        border-bottom: 0;
    }
                    
    .sponsor .l {width: 40%; float: left;  padding-top: 10px;}
    .sponsor .r {width: 60%; float: left;  padding-top: 10px;}

    .sponsor .imgholder {
        padding: 0 20px;
        text-align: center;
    }

    .sponsor .textholder {
        padding: 0 20px;
        text-align: left;
    }

    .sponsor img  {
        width: 100%;
        height: auto;
    }

    .sponsor .linkholder {
        position: absolute;
        display: block;
        bottom: 0;
        width: 100%;
        text-align: right;
    }

    .sponsor .linkholder  a{
        padding: 10px 5px;
        text-decoration: none;
    }

.nieuwsoverzicht .news-item-compact {
    margin: 0;
    padding: 10px;
    line-height: 20px;
}

.nieuwsoverzicht .news-date,
.nieuwsoverzicht .news-title {
    margin: 0;
    padding: 0;
}

/* Albumtitel op de fotodetailpagina */
.gallery h3 {
    font-family: 'BenchNine', sans-serif;
    font-size: 28px;
    line-height: 1.2;
    color: #3c3c3c;
    margin: 10px 0;
}



/* Algemene SmartForms vormgeving */
.smart-form {
    width: 100%;
    max-width: 650px;
    margin: 25px 0 35px;
    font-family: Arial, sans-serif;
    color: #3c3c3c;
}

.smart-form .form-heading {
    font-family: 'BenchNine', sans-serif;
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 25px;
    color: #3c3c3c;
}

.smart-form .form-field {
    margin-bottom: 22px;
}

.smart-form label {
    display: block;
    margin-bottom: 7px;
    font-size: 14px;
    font-weight: bold;
}

.smart-form .required-mark {
    color: #d63838;
}

.smart-form .form-control {
    display: block;
    width: 100%;
    padding: 12px 14px;
    box-sizing: border-box;
    border: 1px solid #cbd2d9;
    border-radius: 6px;
    background: #fff;
    color: #3c3c3c;
    font: inherit;
    font-size: 15px;
    line-height: 1.5;
    transition: border-color .2s, box-shadow .2s;
}

.smart-form .form-control:focus {
    border-color: #298ff8;
    outline: none;
    box-shadow: 0 0 0 3px rgba(41,143,248,.14);
}

.smart-form textarea.form-control {
    min-height: 150px;
    resize: vertical;
}

.smart-form .form-control::placeholder {
    color: #929aa3;
}

.smart-form .form-actions {
    margin-top: 25px;
}

.smart-form button[type="submit"] {
    padding: 13px 30px;
    border: none;
    border-radius: 5px;
    background: #298ff8;
    color: white;
    font: inherit;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color .2s;
}

.smart-form button[type="submit"]:hover {
    background: #1677db;
}

.smart-form button[type="submit"]:focus-visible {
    outline: 3px solid #8ac1ff;
    outline-offset: 3px;
}

.smart-form .form-note {
    margin-top: 15px;
    font-size: 12px;
    color: #777;
}

.smart-form-errors {
    padding: 12px 15px;
    margin: 0 0 20px;
    border: 1px solid #e4a0a0;
    border-radius: 5px;
    background: #fff5f5;
    color: #a22121;
}

@media (max-width: 600px) {
    .smart-form {
        max-width: 100%;
    }

    .smart-form button[type="submit"] {
        width: 100%;
    }
}


.ice-thickness .ice-tooltips .showhide {
    display: none;
}

.ice-thickness .body {
    position: relative;
}

.ice-thickness .body {
    position: relative;
}

.ice-thickness .ice-tooltips {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 301px;
    pointer-events: none;
}

.ice-thickness .ice-tooltips > div {
    position: absolute;
}

.ice-thickness .ice-tooltips .showhide {
    display: none;
}

/* YouTube-video onder de ijsdiktemeter */
.ice-video {
    clear: both;
    width: 100%;
    max-width: 300px;
    margin: 25px auto 0;
}

.ice-video-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 8px;
    background: #222;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12);
}

.ice-video-frame iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}




/* ============================================
   RESPONSIVE - IJSCLUB VOSBERGEN
   ============================================ */

/* Basis: voorkom te brede afbeeldingen */
img,
video,
iframe {
    max-width: 100%;
}

.ice-column {
    float: right;
    width: 300px;
    max-width: 100%;
}

/* ============================================
   TABLET - tot 1024px
   ============================================ */

@media (max-width: 1024px) {

    .center {
        width: auto;
        max-width: 980px;
        margin-left: 20px;
        margin-right: 20px;
    }

    #container .mainnav {
        min-height: 50px;
        overflow: visible;
    }

    #container .mainnav ul {
        display: flex;
        flex-wrap: wrap;
    }

    #container .mainnav ul li {
        float: none;
    }

    #container .mainnav ul li a {
        float: none;
        margin: 0 4px;
        padding: 0 10px;
    }

    #container .hdr-img {
        background-position: center top;
        background-size: cover;
    }

    /* Homepage */
    #container .content.home {
        display: flex;
        flex-wrap: wrap;
        gap: 25px;
        background: none;
    }

    #container .content.home .intro.small {
        float: none;
        flex: 1 1 300px;
        width: auto;
        min-width: 0;
        padding: 0;
    }

    #container .content.home .news {
        float: none;
        flex: 1 1 260px;
        width: auto;
        min-width: 0;
        padding: 0;
    }

    #container .content.home .photo-mask,
    #container .content.home .ice-column {
        float: none;
        flex: 0 0 250px;
        margin-left: auto;
        margin-right: auto;
    }

    #container .content.home .ice-column {
        flex-basis: 300px;
    }

    /* Overige pagina's */
    #container .content .intro.wide {
        width: 100%;
        max-width: 700px;
        float: none;
        box-sizing: border-box;
    }

    #container .content .back-btn a {
        right: 10px;
    }

    /* Sponsoren */
    .sponsor {
        float: none;
        width: 100%;
        max-width: 650px;
        box-sizing: border-box;
        margin: 10px 0;
    }

    /* Social media */
    #container .social-media {
        display: flex;
        flex-wrap: wrap;
        gap: 25px;
        background: none;
    }

    #container .social-media .facebook,
    #container .social-media .twitter {
        float: none;
        flex: 1 1 300px;
        width: auto;
        min-width: 0;
    }

    #footer {
        box-sizing: border-box;
    }
}

/* ============================================
   MOBIEL - tot 767px
   ============================================ */

@media (max-width: 767px) {

    html,
    body {
        min-width: 0;
        background-image: none;
    }

    .center {
        width: auto;
        max-width: none;
        margin-left: 15px;
        margin-right: 15px;
    }

    /* Navigatie: overzichtelijk over meerdere regels */
    #container .mainnav {
        width: auto;
        margin: 0;
        padding: 8px;
        background: #298ff8;
        font-size: 18px;
    }

    #container .mainnav ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 3px;
    }

    #container .mainnav ul li {
        float: none;
        display: block;
    }

    #container .mainnav ul li a {
        display: block;
        float: none;
        height: auto;
        min-height: 42px;
        line-height: 42px;
        margin: 0;
        padding: 0 10px;
        white-space: nowrap;
    }

    /* Header */
    #container .hdr-img {
        height: 170px;
        background-position: center top;
        background-size: cover;
        position: relative;
    }

    #container .hdr-img a.lidworden-btn,
    #container .hdr-img a.reserveren-btn {
        float: right;
        margin: 100px 10px 0 0;
        padding: 12px 14px;
        font-size: 30px;
        line-height: 1;
    }

    /* Status ijsbaan: geen overlap met menu */
    #container .open-or-closed {
        position: relative;
        top: auto;
        right: auto;
        margin: 10px auto;
        max-width: 100%;
    }

    /* Content */
    #container .content {
        margin-top: 15px;
        margin-bottom: 25px;
        padding-top: 10px;
    }

    #container .content.home {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 30px;
    }

    #container .content.home .intro.small,
    #container .content.home .news {
        display: block;
        flex: none;
        float: none;
        width: 100%;
        max-width: 100%;
        padding: 0;
        box-sizing: border-box;
    }

    #container .content.home .news {
        border-top: 1px solid #d0d0d0;
        padding-top: 20px;
    }

    #container .content.home .photo-mask {
        flex: none;
        float: none;
        align-self: center;
        width: 250px;
        max-width: 100%;
        margin: 0 auto;
    }

    #container .content.home .ice-column {
        flex: none;
        float: none;
        align-self: center;
        width: 300px;
        max-width: 100%;
        margin: 0 auto;
    }

    .ice-column .ice-thickness {
        float: none;
        margin: 0 auto;
    }

    .ice-column .ice-video {
        max-width: 100%;
    }

    /* Nieuws */
    #container .content .news-item-expanded,
    #container .content .news-item-expanded .txt {
        max-width: 100%;
    }

    #container .content .back-btn a {
        position: static;
        display: inline-block;
        margin-bottom: 15px;
    }

    /* Sponsoren */
    .sponsor {
        width: 100%;
        height: auto;
        min-height: 180px;
        padding-bottom: 40px;
    }

    .sponsor.small {
        min-height: 0;
        height: auto;
        padding: 10px 0 35px;
    }

    .sponsor .l,
    .sponsor .r {
        float: none;
        width: 100%;
        box-sizing: border-box;
        padding: 10px 0;
    }

    .sponsor .imgholder {
        max-width: 240px;
        margin: 0 auto;
    }

    /* Social media */
    #container .social-media {
        display: flex;
        flex-direction: column;
        gap: 25px;
    }

    #container .social-media .facebook,
    #container .social-media .twitter {
        width: 100%;
        max-width: 100%;
        flex: none;
    }

    /* Formulieren */
    .smart-form {
        width: 100%;
        max-width: 100%;
    }

    .smart-form .form-control {
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Footer */
    #footer {
        text-align: center;
        padding: 20px 15px;
        margin-left: 0;
        margin-right: 0;
    }

    /* Tabellen */
    .content table {
        max-width: 100%;
    }
}

/* ============================================
   KLEINE SMARTPHONES - tot 400px
   ============================================ */

@media (max-width: 400px) {

    h1,
    h2.news {
        font-size: 32px;
        line-height: 1.1;
    }

    #container .hdr-img {
        height: 145px;
    }

    #container .hdr-img a.lidworden-btn {
        font-size: 25px;
        margin-top: 85px;
    }

    #container .mainnav ul li a {
        font-size: 16px;
        padding: 0 8px;
    }
}