:root {
    --vti-oranje: #EDA274;
    --vti-black: #000000;
    --vti-white: #FFFFFF;
}
.dot {
    height: 15px;
    width: 15px;
    border-radius: 50%;
    display: inline-block;
    margin-left: 10px !important;
}
@font-face {
    font-family: "KGSolid";
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url(/fonts/KGSecondChancesSolid.ttf) format("truetype")
}
@font-face {
    font-family: "KGSketch";
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url(/fonts/KGSecondChancesSketch.ttf) format("truetype")
}
body {
    margin: 0;
    background-color: var(--vti-oranje);
    min-height: 100%;
    font-family: "KGSolid", helvetica, arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.site__nav {
    display: block;
    position: static;
    flex: 1 1 100%;
    min-width: 256px;
    max-width: 400px;
    margin-top: -200px;
}
.site__nav__small {
    display: none;
    position:fixed;
    width:55px;
    height:70px;
    top: 400px;
    color: var(--vti-white);
    cursor: pointer;
    z-index: 10000;
}

.site__footer {
    width: 100vw;
}

.pos_headerNfo {
    font-size: 19px;
}
.vti_wedstrijd {
    margin-left:400px;float:left;width: 450px;font-size: 40px;
    color: var(--vti-black);
}
.vti_inschrijven {
    float:left;width: 450px;font-size: 40px;
    color: var(--vti-black);
}
.svg--desktop {
    display: block;
    width: 100%;
    height: 2500px;
}

@media (max-height: 899px) {
    .navigation__logo {
        display: none;
    }
    .navigation__sections {
        margin-top: -10px;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 768px) {
    body {
        width: 406px !important;
    }
    .pos_headerNfo {
        font-size: 7px !important;
        line-height: 12px;
    }
    .svg--desktop {
        height: 960px !important;
    }
    .site__header {
        background-image: url(/img/header_vti_roeselare_2021.png);
        background-size: cover;
        height: 280px;
        background-repeat: no-repeat;
        background-position: center;
        margin-bottom: -100px;
        margin-top: 10px;
    }
    .site__content {
        min-width: 100% !important;
    }
    .svgs {
        top: 130px !important
    }
    .site__main {
        position: static;
        display: flex;
        height: 1980px;
    }
    .site__nav {
        display: none !important;
    }
    .site__nav__small {
        display: block !important;
        top: 160px !important;
    }
    .navigation__logo {
        width: 140px !important;
    }
    .navigation__number {
        font-size: 26px !important;
        line-height: 28px !important;
        font-weight: 700;
        letter-spacing: -.03em;
        margin-bottom: 0;
        color: var(--vti-black);
    }
    .navigation__panel {
        padding: 17px 5px 30px 30px !important;
        width: 275px !important;
    }
    .pos_headerNfo {
        top: 130px !important;
        left: 240px !important;
        width: 175px !important;
        height: 84px !important;
        border-radius: 5px !important;
        padding: 10px;
        font-size:10px;
    }

    .footer {
        display: block !important
    }
    .vti_wedstrijd {
        width:100% !important;
        text-align: right;
        font-size: 70px !important;
        color: var(--vti-black);
        float: none;
        line-height: 40px;
        margin-left: 0px;
    }
    .vti_wedstrijd a, .vti_inschrijven a{
        padding-right: 10px;

    }
    .vti_inschrijven {
        width:100% !important;
        text-align: center;
        font-size: 50px !important;
        color: var(--vti-black);
        float: none;
    }

    .pos_pen{position:absolute;top: 35px ;left: 150px;width: 65px;height:65px;border: 1px solid white !important}
    .pos_afin{position:absolute;top: 185px ;left: 60px;width: 65px;height:65px;}
    .pos_ddafin{position:absolute;top: 115px ;left: 315px;width: 65px;height:65px;}

    .pos_video1 {position:absolute;top: 85px;left: 90px ;width:362px;}
    .pos_video1 iframe{width:233px;height:175px}
    .pos_nfo1 {position:absolute;top: 770px;left: 700px;width:400px;}

    .pos_Duiding {position:absolute;top: 317px;left: 100px ;width:362px;}
    .pos_Duiding iframe{width:170px;height:124px}

    .pos_TitelMech h2, .pos_TitelBouw h2, .pos_TitelHout h2, .pos_TitelSED h2 {font-size: 15px !important;line-height: 19px;}
    .pos_TitelMech  {position:absolute;top: 497px;left: 23px;width:150px;color: var(--vti-black) !important;}
    .pos_TitelBouw  {position:absolute;top: 567px;left: 23px;width:150px;color: var(--vti-black) !important;}
    .pos_TitelHout  {position:absolute;top: 620px;left: 23px;width:150px;color: var(--vti-black) !important;}
    .pos_TitelSED  {position:absolute;top: 672px;left: 23px;width:150px;color: var(--vti-black) !important;}

    #vti-brochure-nfo {
        position: absolute;
        top: 50px;
        left: 220px;
        width: 480px;
    }
    #vti-afin-nfo {
        position: absolute;
        top: 182px;
        left: 324px;
        width: 400px;
    }
    #vti-ddafin-nfo {
        position: absolute;
        top: 260px;
        left: 88px;
        width: 400px;
    }

    #vti-digi-nfo {
        position: absolute;
        top: 451px;
        left: 150px;
        width: 220px;
    }
    #vti-milo-nfo {
        position: absolute;
        top: 675px;
        left: 170px;
        width: 200px;
    }
    #vti-ewout-nfo {
        position: absolute;
        top: 500px;
        left: 325px;
        width: 200px;
    }
    #vti-ees-nfo {
        position: absolute;
        top: 800px;
        left: 150px;
        width: 200px;
    }
    #vti-eddy-nfo {
        position: absolute;
        top: 995px;
        left: 230px;
        width: 200px;
    }
    #vti-roeselare-getuigenis-1 {
        position: absolute;
        top: 529px;
        left: 261px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-2 {
        position: absolute;
        top: 706px;
        left: 189px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-3 {
        position: absolute;
        top: 829px;
        left: 54px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-4 {
        position: absolute;
        top: 1023px;
        left: 129px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-1 iframe,#vti-roeselare-getuigenis-2 iframe,#vti-roeselare-getuigenis-3 iframe,#vti-roeselare-getuigenis-4 iframe{
        width: 128px;
        height: 93px;
    }
    #vti-roeselare-zorg {
        position: absolute;
        top: 1267px;
        left: 14px;
        width: 262px;
    }
    .pos_nfo_zorg {position:absolute;top: 1395px;left: 125px;width:350px;}
    #vti-roeselare-feestzaal {
        position: absolute;
        top: 1552px;
        left: 86px;
        width: 262px;
    }
    .pos_nfo_feestzaal {position:absolute;top: 1525px;left: 215px;width:350px;}
    #vti-roeselare-zorg iframe,#vti-roeselare-feestzaal iframe{
        width: 171px;
        height: 125px;
    }

    h2 {
        font-size: 11px !important;
        line-height: 15px !important;
    }
    h3 {
        margin-top: -10px !important;
        font-size: 11px !important
    }

    /*
     * Mechanica/ elektriciteit
     */
    .pos_BEI {position:absolute;top: 737px;left: 234px ;width:142px;}
    .pos_BEI iframe{width:135px;height:107px}
    .pos_nfoBEI {position:absolute;top: 860px;left: 268px;width:150px;}

    .pos_BAM {position:absolute;top: 880px;left: 60px ;width:142px;}
    .pos_BAM iframe{width:135px;height:107px}
    .pos_nfoBAM {position:absolute;top: 981px;left: 185px;width:150px;}

    .pos_SET {position:absolute;top: 1219px;left: 60px ;width:142px;}
    .pos_SET iframe{width:135px;height:107px}
    .pos_nfoSET {position:absolute;top: 1323px;left: 15px;width:150px;}

    .pos_SMT {position:absolute;top: 1597px;left: 22px ;width:142px;}
    .pos_SMT iframe{width:135px;height:107px}
    .pos_nfoSMT {position:absolute;top: 1700px;left: 15px;width:150px;}

    .pos_TEA {position:absolute;top: 1946px;left: 75px ;width:142px;}
    .pos_TEA iframe{width:135px;height:107px}
    .pos_nfoTEA {position:absolute;top: 2054px;left: 78px;width:150px;}

    .pos_TEM {position:absolute;top: 2192px;left: 225px ;width:142px;}
    .pos_TEM iframe{width:135px;height:107px}
    .pos_nfoTEM {position:absolute;top: 2315px;left: 230px;width:150px;}

    .pos_STEMIW {position:absolute;top: 2289px;left: 7px ;width:142px;}
    .pos_STEMIW iframe{width:135px;height:107px}
    .pos_nfoSTEMIW {position:absolute;top: 2416px;left: 47px;width:150px;}

    /*
     * Bouw
     */
    .pos_BBO {position:absolute;top: 1036px;left: 172px ;width:142px;}
    .pos_BBO iframe{width:135px;height:107px}
    .pos_nfoBBO {position:absolute;top: 1150px;left: 250px;width:150px;}

    .pos_SBT {position:absolute;top: 1426px;left: 200px ;width:142px;}
    .pos_SBT iframe{width:135px;height:107px}
    .pos_nfoSBT {position:absolute;top: 1364px;left: 230px;width:150px;}

    .pos_TBH {position:absolute;top: 2726px;left: 224px ;width:142px;}
    .pos_TBH iframe{width:135px;height:107px}
    .pos_nfoTBH {position:absolute;top: 2850px;left: 179px;width:150px;}

    /*
     * Hout
     */
    .pos_BHT {position:absolute;top: 1770px;left: 225px ;width:142px;}
    .pos_BHT iframe{width:135px;height:107px}
    .pos_nfoBHT {position:absolute;top: 1870px;left: 225px;width:150px;}

    .pos_SHT {position:absolute;top: 2486px;left: 97px ;width:142px;}
    .pos_SHT iframe{width:135px;height:107px}
    .pos_nfoSHT {position:absolute;top: 2596px;left: 41px;width:150px;}

    /*
     * Schilderen en decoreatie
     */
    .pos_BSD {position:absolute;top: 2872px;left: 29px ;width:142px;}
    .pos_BSD iframe{width:135px;height:107px}
    .pos_nfoBSD {position:absolute;top: 2802px;left: 28px;width:150px;}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    body {
        width: 768px !important;
    }
    .site__header {
        background-image: url(/img/header_vti_roeselare_2021.png);
        background-size: cover;
        height: 520px;
        background-repeat: no-repeat;
        background-position: center;
        margin-bottom: -170px;
        margin-top: 10px;
    }
    .svg--desktop {
        height: 2500px;
    }
    .svgs {
        top: 330px !important
    }
    .site__main {
        position: static;
        display: flex;
        height: 3750px;
    }
    .site__nav {
        display: none !important;
    }
    .site__nav__small {
        display: block !important
    }
    .pos_headerNfo {
        top: 260px !important;
        left: 400px !important;
        width: 325px !important;
        height: 184px !important;
        padding: 10px;
        border-radius: 10px;
    }

    .footer {
        display: block !important
    }
    .vti_wedstrijd {
        width:100% !important;
        text-align: right;
        font-size: 30px !important;
        color: var(--vti-black);
        float: none;
        line-height: 40px;
        margin-left: 0px;
    }
    .vti_wedstrijd a, .vti_inschrijven a{
        padding-right: 10px;

    }
    .vti_inschrijven {
        width:100% !important;
        text-align: center;
        font-size: 30px !important;
        color: var(--vti-black);
        float: none;
    }

    .pos_pen{position:absolute;top: 125px ;left: -60px;width: 135px;height:135px;border: 1px solid white !important}
    .pos_afin{position:absolute;top: 475px ;left: -220px;width: 135px;height:135px;}
    .pos_ddafin{position:absolute;top: 270px ;left: 315px;width: 135px;height:135px;}

    .pos_video1 {position:absolute;top: 246px;left: -119px ;width:362px;}
    .pos_video1 iframe{width:444px;height:331px}
    .pos_nfo1 {position:absolute;top: 580px;left: 230px;width:400px;}

    .pos_Duiding {position:absolute;top: 701px;left: -102px ;width:362px;}
    .pos_Duiding iframe{width:328px;height:239px}


    .pos_TitelMech  {position:absolute;top: 1045px;left: -240px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelBouw  {position:absolute;top: 1164px;left: -240px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelHout  {position:absolute;top: 1262px;left: -240px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelSED  {position:absolute;top: 1350px;left: -240px;width:230px;color: var(--vti-black) !important;}

    #vti-brochure-nfo {
        position: absolute;
        top: 188px;
        left: 90px;
        width: 480px;
    }
    #vti-afin-nfo {
        position: absolute;
        top: 222px;
        left: 344px;
        width: 400px;
    }
    #vti-ddafin-nfo {
        position: absolute;
        top: 610px;
        left: -232px;
        width: 400px;
    }

    #vti-digi-nfo {
        position: absolute;
        top: 930px;
        left: -30px;
        width: 450px;
    }
    #vti-milo-nfo {
        position: absolute;
        top: 1035px;
        left: 170px;
        width: 200px;
    }
    #vti-ewout-nfo {
        position: absolute;
        top: 1370px;
        left: 255px;
        width: 200px;
    }
    #vti-ees-nfo {
        position: absolute;
        top: 1820px;
        left: -40px;
        width: 250px;
    }
    #vti-eddy-nfo {
        position: absolute;
        top: 1968px;
        left: 150px;
        width: 200px;
    }
    #vti-roeselare-getuigenis-1 {
        position: absolute;
        top: 1085px;
        left: 203px;
        width: 244px;
    }
    #vti-roeselare-getuigenis-2 {
        position: absolute;
        top: 1419px;
        left: 69px;
        width: 244px;
    }
    #vti-roeselare-getuigenis-3 {
        position: absolute;
        top: 1654px;
        left: -187px;
        width: 244px;
    }
    #vti-roeselare-getuigenis-4 {
        position: absolute;
        top: 2021px;
        left: -45px;
        width: 244px;
    }
    #vti-roeselare-getuigenis-1 iframe,#vti-roeselare-getuigenis-2 iframe,#vti-roeselare-getuigenis-3 iframe,#vti-roeselare-getuigenis-4 iframe{
        width: 244px;
        height: 179px;
    }
    #vti-roeselare-zorg {
        position: absolute;
        top: 2479px;
        left: -264px;
        width: 327px;
    }
    .pos_nfo_zorg {position:absolute;top: 2710px;left: -105px;width:350px;}
    #vti-roeselare-feestzaal {
        position: absolute;
        top: 3019px;
        left: -126px;
        width: 327px;
    }
    .pos_nfo_feestzaal {position:absolute;top: 2970px;left: 125px;width:350px;}
    #vti-roeselare-zorg iframe,#vti-roeselare-feestzaal iframe{
        width: 327px;
        height: 239px;
    }

    h2 {
        font-size: 22px !important;
    }
    h3 {
        margin-top: -5px !important;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    body {
        width: 992px !important;
    }
    .site__header {
        background-image: url(/img/header_vti_roeselare_2021.png);
        background-size: cover;
        height: 670px;
        background-repeat: no-repeat;
        background-position: center;
        margin-bottom: -220px;
        margin-top: 20px;
    }
    .svgs {
        top: 430px !important
    }
    .site__main {
        position: static;
        display: flex;
        height: 4760px;
    }

    .site__nav {
        display: none !important;
    }
    .site__nav__small {
        display: block !important
    }

    .pos_headerNfo {
        top: 360px !important;
        left: 600px !important;
        width: 325px !important;
        height: 184px !important;
        border-radius: 11px;
        padding: 10px;
    }
    .footer {
        display: block !important
    }
    .vti_wedstrijd {
        width:100% !important;
        text-align: right;
        font-size: 40px;
        color: var(--vti-black);
        float: none;
        line-height: 60px;
        margin-left: 0px;
    }
    .vti_wedstrijd a, .vti_inschrijven a{
        padding-right: 10px;

    }
    .vti_inschrijven {
        width:100% !important;
        text-align: center;
        font-size: 80px !important;
        color: var(--vti-black);
        float: none;
    }

    .pos_pen{position:absolute;top: 185px ;left: 340px;width: 155px;height:155px;}
    .pos_afin{position:absolute;top: 555px ;left: 120px;width: 145px;height:145px;}
    .pos_ddafin{position:absolute;top: 415px ;left: 780px;width: 145px;height:145px;}

    .pos_video1 {position:absolute;top: 316px;left: 248px ;width:362px;}
    .pos_video1 iframe{width:574px;height:430px}
    .pos_nfo1 {position:absolute;top: 770px;left: 700px;width:400px;}

    .pos_Duiding {position:absolute;top: 904px;left: 270px ;width:362px;}
    .pos_Duiding iframe{width:423px;height:309px}


    .pos_TitelMech  {position:absolute;top: 1362px;left: 90px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelBouw  {position:absolute;top: 1514px;left: 90px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelHout  {position:absolute;top: 1650px;left: 90px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelSED  {position:absolute;top: 1765px;left: 90px;width:230px;color: var(--vti-black) !important;}

    #vti-brochure-nfo {
        position: absolute;
        top: 80px;
        left: 270px;
        width: 480px;
    }
    #vti-afin-nfo {
        position: absolute;
        top: 340px;
        left: 827px;
        width: 400px;
    }
    #vti-ddafin-nfo {
        position: absolute;
        top: 700px;
        left: 10px;
        width: 400px;
    }

    #vti-digi-nfo {
        position: absolute;
        top: 1212px;
        left: 380px;
        width: 450px;
    }
    #vti-milo-nfo {
        position: absolute;
        top: 1762px;
        left: 490px;
        width: 400px;
    }
    #vti-ewout-nfo {
        position: absolute;
        top: 1330px;
        left: 800px;
        width: 400px;
    }
    #vti-ees-nfo {
        position: absolute;
        top: 2060px;
        left: 370px;
        width: 470px;
    }
    #vti-eddy-nfo {
        position: absolute;
        top: 2540px;
        left: 580px;
        width: 400px;
    }
    #vti-roeselare-getuigenis-1 {
        position: absolute;
        top: 1400px;
        left: 665px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-2 {
        position: absolute;
        top: 1833px;
        left: 491px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-3 {
        position: absolute;
        top: 2135px;
        left: 161px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-4 {
        position: absolute;
        top: 2609px;
        left: 344px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-1 iframe,#vti-roeselare-getuigenis-2 iframe,#vti-roeselare-getuigenis-3 iframe,#vti-roeselare-getuigenis-4 iframe{
        width: 315px;
        height: 230px;
    }
    #vti-roeselare-zorg {
        position: absolute;
        top: 3201px;
        left: 61px;
        width: 262px;
    }
    .pos_nfo_zorg {position:absolute;top: 3495px;left: 345px;width:350px;}
    #vti-roeselare-feestzaal {
        position: absolute;
        top: 3899px;
        left: 238px;
        width: 262px;
    }
    .pos_nfo_feestzaal {position:absolute;top: 3835px;left: 525px;width:350px;}
    #vti-roeselare-zorg iframe,#vti-roeselare-feestzaal iframe{
        width: 424px;
        height: 310px;
    }

    h3 {
        margin-top: 5px !important;
    }
}

/* Extra large devices (large desktops, 1200px and up)  */
@media (min-width: 1200px) {
    body {
        width: 1200px !important;
    }
    .site__header {
        background-image: url(/img/header_vti_roeselare_2021.png);
        background-size: cover;
        height: 820px;
        background-repeat: no-repeat;
        background-position: center;
        margin-bottom: -280px;
        margin-top: 20px;
    }
    .svgs {
        top: 560px !important
    }
    .site__main {
        position: static;
        display: flex;
        height: 3860px;
    }
    .site__nav {
        display: block !important;
    }
    .site__nav__small {
        display: none !important
    }
    .pos_headerNfo {
        top: 360px !important;
        left: calc(949px - 150px) !important;;
        width: 325px !important;
        height: 184px !important;
        color: var(--vti-black);
        border-radius: 11px;
        padding: 10px;
        background: var(--vti-white);
        border-radius: 10px;
    }

    .pos_pen{position:absolute;top: 155px ;left: 410px;width: 145px;height:145px;}
    .pos_afin{position:absolute;top: 555px ;left: 250px;width: 145px;height:145px;}
    .pos_ddafin{position:absolute;top: 415px ;left: 780px;width: 145px;height:145px;}

    .pos_video1 {position:absolute;top: 286px;left: 344px ;width:362px;}
    .pos_video1 iframe{width:462px;height:346px}
    .pos_nfo1 {position:absolute;top: 640px;left: 700px;width:400px;}

    .pos_Duiding {position:absolute;top: 761px;left: 362px ;width:362px;}
    .pos_Duiding iframe{width:341px;height:250px}


    .pos_TitelMech  {position:absolute;top: 1121px;left: 220px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelBouw  {position:absolute;top: 1250px;left: 220px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelHout  {position:absolute;top: 1350px;left: 220px;width:230px;color: var(--vti-black) !important;}
    .pos_TitelSED  {position:absolute;top: 1440px;left: 220px;width:230px;color: var(--vti-black) !important;}

    #vti-brochure-nfo {
        position: absolute;
        top: 80px;
        left: 270px;
        width: 480px;
    }
    #vti-afin-nfo {
        position: absolute;
        top: 340px;
        left: 820px;
        width: 400px;
    }
    #vti-ddafin-nfo {
        position: absolute;
        top: 690px;
        left: 270px;
        width: 400px;
    }

    #vti-digi-nfo {
        position: absolute;
        top: 1000px;
        left: 450px;
        width: 450px;
    }
    #vti-milo-nfo {
        position: absolute;
        top: 1442px;
        left: 490px;
        width: 400px;
    }
    #vti-ewout-nfo {
        position: absolute;
        top: 1090px;
        left: 810px;
        width: 400px;
    }
    #vti-ees-nfo {
        position: absolute;
        top: 1700px;
        left: 540px;
        width: 470px;
    }
    #vti-eddy-nfo {
        position: absolute;
        top: 2060px;
        left: 580px;
        width: 400px;
    }

    #vti-roeselare-getuigenis-1 {
        position: absolute;
        top: 1161px;
        left: 680px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-2 {
        position: absolute;
        top: 1510px;
        left: 539px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-3 {
        position: absolute;
        top: 1754px;
        left: 274px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-4 {
        position: absolute;
        top: 2135px;
        left: 422px;
        width: 262px;
    }
    #vti-roeselare-getuigenis-1 iframe,#vti-roeselare-getuigenis-2 iframe,#vti-roeselare-getuigenis-3 iframe,#vti-roeselare-getuigenis-4 iframe{
        width: 253px;
        height: 185px;
    }
    #vti-roeselare-zorg {
        position: absolute;
        top: 2614px;
        left: 193px;
        width: 262px;
    }
    .pos_nfo_zorg {position:absolute;top: 2855px;left: 345px;width:350px;}
    #vti-roeselare-feestzaal {
        position: absolute;
        top: 3176px;
        left: 336px;
        width: 262px;
    }
    .pos_nfo_feestzaal {position:absolute;top: 3110px;left: 525px;width:350px;}
    #vti-roeselare-zorg iframe,#vti-roeselare-feestzaal iframe{
        width: 341px;
        height: 249px;
    }

    h3 {
        margin-top: 5px !important;
    }
}





a, span{
    color: var(--vti-black);
    cursor: pointer;
}
iframe, object {
     border:2px solid #FFFFFF;
     border-radius: 20px !important;
     background: white;
 }

.navigation__sections a.active,.navigation__sections span.active {
    color: var(--vti-white);
    background-color: var(--vti-black);
}
.nfo {
    color: var(--vti-white);
}
.navigation__sections a, .navigation__sections span{
    text-decoration: none;
    display: inline-block;
    padding: 5px 5px 3px;
    border-radius: 999999px;
}

@media (min-width: 1024px) {
    .navigation__section-title {
        font-size: 22px;
        line-height: 28px;
    }
}
@media (min-width: 768px){
    .navigation__section-title {
    font-size: 20px;
    line-height: 24px;
    }
}

.navigation__section-title {
font-size: 16px;
line-height: 18px;
letter-spacing: -.03em;
display: block;
font-weight: 700;
margin-bottom: 0;
text-transform: uppercase;
}

@media (min-width: 1024px) {
    .navigation__sections {
        margin-bottom: 40px;
    }
}

.navigation__sections {
list-style: none;
padding-left: 0;
min-width: 195px;
max-width: 95%;
margin-bottom: 20px;
}

@media (min-width: 1024px) {
    .navigation__number {
        font-size: 72px;
        line-height: 66px;
    }
}

@media (min-width: 768px) {
    .navigation__number {
        font-size: 62px;
        line-height: 58px;
    }
}

.navigation__number {
    font-size: 36px;
    line-height: 38px;
    font-weight: 700;
    letter-spacing: -.03em;
    margin-bottom: 0;
    color: var(--vti-black);
}


@media (min-width: 1024px){
    .h2, h2 {
    margin-bottom: 8px;
    }
}
@media (min-width: 768px) {
    .h2, h2 {
        margin-bottom: 11px;
    }
}
@media (min-width: 1024px) {
    .h2, h2 {
        font-size: 42px;
        line-height: 42px;
    }
}
@media (min-width: 768px) {
    .h2, h2 {
        font-size: 36px;
        line-height: 34px;
    }
}
.h2, h2 {
font-size: 32px;
line-height: 30px;
font-weight: 700;
letter-spacing: -.03em;
margin-bottom: 3px;
}
.u-visually-hidden {
    border: 0;
    clip: rect(0 0 0 0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap;
}

.container {
    padding-left: 128px;
    max-width: 80%;
}

.svgs {
    display: flex;
    position: absolute;
    top: 505px;
    bottom: 0;
    left: 0;
    right: 0;
    pointer-events: none;
    width:inherit !important;

}




.rotate {
    transform: rotate(-90deg);


    /* Legacy vendor prefixes that you probably don't need... */

    /* Safari */
    -webkit-transform: rotate(-90deg);

    /* Firefox */
    -moz-transform: rotate(-90deg);

    /* IE */
    -ms-transform: rotate(-90deg);

    /* Opera */
    -o-transform: rotate(-90deg);

    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

.svg--desktop {
    display: block
}


@media (max-width: 1279px) {
    .container {
        padding-left: 96px;
        max-width: 768px;
    }

    .svgs::before {
        min-width: 0px;
        max-width: calc(100% - 1024px / 2);
    }
}
@media (min-width: 1279px) {

    .svgs::before {
        display: block;
        content: '';
        position: static;
        flex: 1 1 100%;
        min-width: 256px;
        max-width: 400px;
    }
}
@media (min-width: 1281px) {

    .svgs::before {
        display: block;
        content: '';
        position: static;
        flex: 1 1 100%;
        min-width: 256px;
        max-width: 400px;
    }
}
@media(max-width: 992px) {
    .svg--desktop {
        display: block
    }

    .container {
        max-width: 320px;
        padding: 0 24px 0 40px;
        padding-left: 40px;
        margin: 0 auto;
    }
}

.site__content {
    flex: 1 1 100%;
    min-width: 1006px;
    overflow: hidden;
}

.svgs__inner {
    flex: 1 1 100%;
    min-width: 1024px;
    position: relative;
}

.navigation__panel {
    z-index: 1;
    top: 700px;
    bottom: 0;
    box-shadow: 15px 15px 10px rgba(0, 0, 0, .15);
    width: 440px;
    height: 100vh;
    transform: none;
    padding: 37px 5px 30px 30px;
    z-index: 1;
    background: #ffffff;
    border-radius: 0 35px 35px 0;
    overflow-y: scroll;
    scrollbar-width: none;
    will-change: transform;
    scroll-behavior: smooth;
    -ms-overflow-style: none;
    overflow: hidden;
}
.navigation__panel__small {
    z-index: 1;
    top: 700px;
    bottom: 0;
    box-shadow: 15px 15px 10px rgba(0, 0, 0, .15);
    width: 55px;
    height: 40px;
    transform: none;
    padding: 37px 5px 30px 5px;
    z-index: 1;
    background: #ffffff;
    border-radius: 0 35px 35px 0;
    overflow-y: scroll;
    scrollbar-width: none;
    will-change: transform;
    scroll-behavior: smooth;
    -ms-overflow-style: none;
    overflow: hidden;
    color: var(--vti-black);
    display: block !important;
}

.site__footer {
    background: #fff;
}

.footer {
    display: flex;
    text-align: center;
    padding: 75px 0 100px;
}

.navigation__logo {
    width: 192px;
}

.aos-init {
    opacity: 0;
}

.aos-animate {
    opacity: 1;
    -webkit-animation: fadeInFromNone 0.5s ease-in;
    -moz-animation: fadeInFromNone 0.5s ease-in;
    -o-animation: fadeInFromNone 0.5s ease-in;
    animation: fadeInFromNone 0.5s ease-in;
}

@-moz-keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0;
    }

    1% {
        display: block;
        opacity: 0;
    }

    100% {
        display: block;
        opacity: 1;
    }
}

@-o-keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0;
    }

    1% {
        display: block;
        opacity: 0;
    }

    100% {
        display: block;
        opacity: 1;
    }
}

@keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0;
    }

    1% {
        display: block;
        opacity: 0;
    }

    100% {
        display: block;
        opacity: 1;
    }
}
.pos_headerNfo {
    position: absolute;
    top: 360px;
    left: calc(949px - 150px);
    width: 325px;
    height: 184px;
    color: var(--vti-black);
    border-radius: 11px;
    padding: 10px;
    background: var(--vti-white);
    border-radius: 10px;
}
.pos_kuA211 iframe {
    border-radius: 0px !important;
    border-top-left-radius: 20px !important;
    border-bottom-left-radius: 20px !important;
}
.pos_kuB211 iframe {
    border-radius: 0px !important;
    border-top-right-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
}
.pos_kuA iframe,.pos_kuB iframe {
    border-radius: 15px !important;
    background: transparent !important;
    border: 4px solid white;
}
.pos_pen, .pos_avond, .pos_brochure, .pos_afin, .pos_ddafin {border-radius: 8px;border: 4px solid white;z-index:10}
.footer .material-icons {
    font-size: inherit !important;
}
.vti_chat {
    position: fixed;
    bottom: 0px;
    right: 10px;
    width: 250px;
    height: 188px;
    z-index: 10000;
}
.vti_chat_box {
    position:absolute;
    top:10px;
    left:10px;
    width:90%;
    height:90%;
    color: var(--vti-black);
}
.vti_chat_box span {
    font-size: 40px;
    top: 40px;
    position: relative;
    color: green;
    left: 5px;
}
#chat_open {
    text-align: center;
}
#chat_open sup{
    font-size: 14px;
    color: var(--vti-black) !important;
    text-decoration: underline;
}
#chat_close, #chat_open {
    display:none;
}
.pos_kuA,.pos_kuB {
    padding: 5px;
}
.pos_kuA li,.pos_kuB li {
    line-height: 25px;
    color: var(--vti-black);
}
.navigation__header {
    display: none;
}
.pos_headerNfo span {
    font-family: "KGSketch", helvetica, arial, sans-serif !important;
}