/* 
    Created on : 22 jul. 2024, 11:07:07
    Author     : amolier
*/


:root {
    --brown: #793740;
}

/*
 * The Typekit service used to deliver this font or fonts for use on websites
 * is provided by Adobe and is subject to these Terms of Use
 * http://www.adobe.com/products/eulas/tou_typekit. For font license
 * information, see the list below.
 *
 * rafaella:
 *   - http://typekit.com/eulas/0000000000000000774f2f8c
 *   - http://typekit.com/eulas/0000000000000000774f2f8d
 * rafaella-shadow:
 *   - http://typekit.com/eulas/0000000000000000774f2f8b
 *   - http://typekit.com/eulas/0000000000000000774f2f8e
 *
 * © 2009-2024 Adobe Systems Incorporated. All Rights Reserved.
 */
/*{"last_published":"2024-07-22 12:53:08 UTC"}*/

@import url("https://p.typekit.net/p.css?s=1&k=zwb2xay&ht=tk&f=53230.53231.53232.53233&a=9061193&app=typekit&e=css");

@font-face {
    font-family:"rafaella";
    src:url("https://use.typekit.net/af/1c2b1b/0000000000000000774f2f8c/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/1c2b1b/0000000000000000774f2f8c/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/1c2b1b/0000000000000000774f2f8c/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
    font-display:auto;
    font-style:normal;
    font-weight:400;
    font-stretch:normal;
}

@font-face {
    font-family:"rafaella";
    src:url("https://use.typekit.net/af/5a00e7/0000000000000000774f2f8d/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/5a00e7/0000000000000000774f2f8d/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/5a00e7/0000000000000000774f2f8d/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
    font-display:auto;
    font-style:normal;
    font-weight:700;
    font-stretch:normal;
}

@font-face {
    font-family:"rafaella-shadow";
    src:url("https://use.typekit.net/af/b6a1c2/0000000000000000774f2f8b/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/b6a1c2/0000000000000000774f2f8b/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/b6a1c2/0000000000000000774f2f8b/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
    font-display:auto;
    font-style:normal;
    font-weight:400;
    font-stretch:normal;
}

@font-face {
    font-family:"rafaella-shadow";
    src:url("https://use.typekit.net/af/85e88f/0000000000000000774f2f8e/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/85e88f/0000000000000000774f2f8e/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/85e88f/0000000000000000774f2f8e/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
    font-display:auto;
    font-style:normal;
    font-weight:700;
    font-stretch:normal;
}

.tk-rafaella {
    font-family: "rafaella",sans-serif;
}
.tk-rafaella-shadow {
    font-family: "rafaella-shadow",sans-serif;
}

@font-face {
    font-family: Nohemi-Bold;
    src: url('../fonts/Nohemi-Bold.otf') format('opentype');
}

@font-face {
    font-family: Nohemi-Medium;
    src: url('../fonts/Nohemi-Medium.otf') format('opentype');
}

@font-face {
    font-family: Nohemi-Black;
    src: url('../fonts/Nohemi-Black.otf') format('opentype');
}

.proportional-fontsize, .content-frontpage {
    font-size: 20px;
}

body {
    background-color: #dcd6b4;
    color: var(--brown);
}

p {
    font-family: Nohemi-Medium;
}

.row-1 {
    margin-top: 2em;
    margin-bottom: 0em;
}

.row-1 .pb-col-2 {
    padding: 0 4em;
}

.row-1 h1 {
    color: white;
    text-decoration: underline;
    font-family:"rafaella";
    font-size: 1.5em;
    margin-bottom: 1em;
}

.row-logo-groot {
    position: relative;

}

.video-still {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url('../img/vamos_still.png');
    background-size: cover;
    background-position: center center;
    border: 2px solid white;

}

.logo-groot-video {
    top: 0px;
    position: relative;
    border: 2px solid white;
    /*visibility: hidden;*/


}

.start-movie-btn-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.start-movie-btn {
    display: inline-block;
    font-family: Nohemi-Black;
    font-size: 2em;
    line-height: 1.3em;
    padding: 4px 10px 2px;
    color: var(--brown);
    background-color: white;
    border-radius: 10px;
    text-transform: uppercase;
}

.start-movie-btn:hover {
    color: black;
}

.prijs {
    display: inline-block;
    width: 230px;
    height: auto;
    margin-right: 0em;
    margin-left: 1em;
    transition: transform .2s;
}

.prijs:hover {
    transform: scale(1.1);
}

.koop-nu h2{
    display: inline-block;
    font-family: Nohemi-Black;
    font-size: 1.1em;
    line-height: 1em;
    color: var(--brown);
    background-color: #FFF;
    padding: .5em 1em;
    border-radius: .5em;
    border: 1px solid var(--brown);
    transition: transform .2s;
}


.koop-nu h2:hover {
    transform: scale(1.1);
}

.row-2 {
    margin-top: 2em;
}

.video-txt-1 {
    position: absolute;
    color: white;
    font-family: Nohemi-Black;
    font-size: 1.2em;
    width: 12em;
    left: -7em;
    top: -1.5em;
    z-index: 10;
    text-shadow: 2px 2px 2px var(--brown);
    /*text-shadow: -1px 0 var(--brown), 0 1px var(--brown), 1px 0 var(--brown), 0 -1px var(--brown);*/
    /*text-shadow: -2px 0 var(--brown), 0 2px var(--brown), 2px 0 var(--brown), 0 -2px var(--brown);*/
}

.vamos-logo {
    position: absolute;
    right: -2.2em;
    bottom: -3.5em;
    width: 350px;
    height: auto;
}

.vamos-logo-mobile {
    width: 250px;
    height: auto;
    display: none;
}



footer {
    text-align: center;
    background-color: var(--brown) !important;
    padding: 2em 3em 2em;
    margin-top: 5em;
    color: white;
}

footer .footer-first .textwidget {

}

footer .socials a{
    color: white;
}

.socials {
    color: white;
}

.socials a {
    display: inline-block;
    /*    height: 8em;
        width: 8em;*/
    margin: 0 1em;
}

.socials i {
    font-size: 3em;
    position: relative;
    bottom: 0em;
    line-height: 1.5em;
}

.fa-facebook-f {
    /*width: 115px;*/
}

footer .pb-col-1 img{
    width: 110px;
    margin: 0 1.5em;
}


footer .footer-third .textwidget, footer .footer-fourth .textwidget {
    font-family: Nohemi-Bold;
    color: var(--purple);
    font-size: 1em;
    text-transform: uppercase;
}

footer .footer-third .textwidget a{
    color: white;
}

footer .footer-fourth .textwidget a{
    color: var(--purple);
}

.footer-fourth {
    margin-top: 1em;
}

.volume-controls {
    padding-left: 10px;
}

.volume-controls a {
    color: var(--brown);
}

@media screen and (max-width: 1400px) {

    .video-txt-1 {
        position: relative;
        left: -5em;
        top: 0em;
        margin-bottom: 20px;
    }

    .vamos-logo {
        width: 250px;
        bottom: -2em;
    }
}

@media screen and (max-width: 992px) {

    .prijs {
        margin-bottom: 10px;
    }

    .row-1 .pb-col-2 {
        padding: 0 3rem;
    }
    
    .row-2 .pb-col-1 {
        padding: 0 3rem;
    }

    .row-2 {
        margin-top: 1em;
    }

    .row-logo-groot {
        /*padding: 0 15px 0 15px;*/
    }

    .koop-nu {
        margin-right: 15px;
    }

    .video-txt-1 {
        position: relative;
        left: 0;
        top: 0em;
        margin-bottom: 20px;
    }

    .vamos-logo {
        width: 200px;
        bottom: -1em;
        right: 0;
    }
    
    footer .pb-col-1 img {
        margin: 0 1.5em;
        width: 90px;
    }

}

@media screen and (max-width: 768px) {

    .prijs {
        width: 160px;
        margin-bottom: 10px;
    }


    .vamos-logo-mobile {
        display: inline-block;
        margin: 0 20px 20px 20px;
    }

    .vamos-logo {
        width: 150px;
        right: 1em;
        bottom: -1em;
        display: none;
    }

    footer .pb-col-1 img {
        margin: 0 1em;
        width: 70px;
    }
}

@media screen and (max-width: 500px) {

    .prijs {
        width: 110px;
    }

    .content-frontpage, footer  {
        font-size: 14px;
    }

    .vamos-logo-mobile {
        width: 200px;
    }

    .vamos-logo {
        width: 110px;
        bottom: 0em;
    }

    footer {
        padding: 2em 0;
    }

    .socials i {
        font-size: 2em;
    }

    footer .pb-col-1 img {
        margin: 0 .5em;
        width: 40px;
    }



}