@font-face {
    font-family: LakkiReddy-Regular;
    src: url(../fonts/LakkiReddy-Regular.ttf);
}

@font-face {
    font-family: Paper-Flowers;
    src: url(../fonts/Paper_Flowers.ttf);
}

body{
    background-image: url("../images/background.png");
    background-repeat: repeat;
    position: relative;
}

/*.c-background{*/
/*    background-color: #fff;*/
/*}*/

.footer {
    /*position: fixed;*/
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: #F24E4E;
    /*color: white;*/
    margin-top: 2vw;
}

.navbar-nav.navbar-center {
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
}

.title-size{
    font-size: 2.5vw;
}

.container-margin{
    margin-top: 2vw;
}

.navbar-text{
    color: #F0F059 !important;
    font-weight: bold;font-family: LakkiReddy-Regular;
    text-shadow: 0px 3px 6px #4a5568;
}

.sponsors{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    padding: 0;
    margin: 0;
    list-style: none;
}

.sponsors-img{
    width: 100%;
    height: auto;
}

.flex-item {
    width: 100px;
    height: 100px;
    margin-top: 10px;
    margin-right: 10px;
    margin-left: 10px;
}

/*FOOTER*/

footer {
    background: #16222A;
    background: -webkit-linear-gradient(59deg, #3A6073, #16222A);
    background: linear-gradient(59deg, #3A6073, #16222A);
    color: white;
    margin-top:10vw;
}

footer a {
    color: #fff;
    font-size: 14px;
    transition-duration: 0.2s;
}

footer a:hover {
    color: #FA944B;
    text-decoration: none;
}

/*.copy {*/
/*    font-size: 12px;*/
/*    padding: 10px;*/
/*    border-top: 1px solid #FFFFFF;*/
/*}*/

.footer-middle {
    padding-top: 2em;
    color: white;
}

.footer-contact{
    padding: 0;
    margin: 0;
}

.footer-link a{
    color: white;
}

.footer-link a:active{
    text-decoration: none;
}

.footer-link a:hover{
    text-decoration: none;
    color: black;
}

.col-md-2{
    padding: 0 !important;
    margin: 0 !important;
}

.footer-logo{
    max-width: 20vw;
    height: auto;
    margin-left: 3vw;
}

.footer-social{
    font-size: 2vw;
}

.footer-email-small{
    display: none;
}

.content-title{
    font-weight: bold;
    text-align: center;
    padding: 1vw;
}

.content-text{
    padding: 1vw;

}

.content-text p{

}

.contact-card{
    margin-left: 10vw;
    margin-right: 10vw;
}

.contact-card img{
    float: right;
    margin-left: 10%;
    width: 10vw;
    height: auto;
}

.contact-button p{
    text-align: center;
}

.tekening-vdd{
    background-color: #C3793C;
    padding: 1vw;
    float: right;
    margin-left: 1vw;
}

.tekening-vdd img{
    max-width: 10vw;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.tekening-vdd h4{
    font-weight: bold;
    color: #F0F059;
}

.video-pos{
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2vw;
}

.video{
    width: 50vw;
    height: auto;
}

.video-item{
    width: 20vw;
    height: auto;
}

.video-list{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    padding: 0;
    margin: 0;
    list-style: none;
}

.video-list li{
    margin-top: 2vw;
    margin-right: 2vw;
    margin-left: 2vw;
}

.video-link a{
    color: black;
}

.video-link a:active{
    text-decoration: none;
}

.video-link a:hover{
    text-decoration: none;
    color: cornflowerblue;
}

.tekenen-list{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    padding: 0;
    margin: 0;
    list-style: none;
}

.tekenen-list li{
    margin-top: 10px;
    margin-right: 10px;
    margin-left: 10px;
}

.alinea{
    padding: 1vw;
}

.logo-404{
    display: block;
    width: 60vw;
    height: auto;
    margin-left: -5vw;
}

.logo-modal{
    max-width: 20vw;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.page-video-haven{
    width: 40vw;
    height: auto;
}

.href-opmaak a{
    color: #F0F059;
}

.href-opmaak a:hover{
    text-decoration: none;
}

.href-opmaak a:hover{
    text-decoration: none;
    color: black;
}

.content-404{
    margin: auto;
}

.content-404 a{
    margin: auto;
    width: 50%;
}

.content-404 p{
    font-size: 2vw;
}

.content-404 img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 40vw;
    height: auto;
}

.robohost{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.video-size{
    width: 40vw;
    height: 23vw;
}

.youtube{
    width: 40vw;
    height: 22vw;
}

.application-logo{
    width: 20vw;
    height: auto;
}

.authentication-card-logo{
    width: 15vw;
    height: auto;
}

.application-mark{
    width: 5vw;
    height: auto;
}

.content p{
    font-family: Paper-Flowers;
    font-size: 2vw;
}

.gallery{
    display: inline-block;
    margin-top: 20px;
}

.img-responsive{
    width: 10vw;
    height: auto;
}

.tekeningen{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    padding: 0;
    margin: 0;
    list-style: none;
}

.tekeningen a{
    text-decoration: none;
    color: black;
}

.tekeningen-items{
    margin-top: 10px;
    margin-right: 10px;
    margin-left: 10px;
}

.tekeningen-card{
    width: 15vw;
    height: auto;
}

.shadow-text {
    text-shadow: 1px 1px 1px white;
}

@media only screen and (width: 768px){
    .navbar-nav.navbar-center {
        top: 1.5vw;
    }
}

@media only screen and (max-width: 600px) {
    body{
        background-color: white !important;
        background-image: url();
    }

    .title-size{
        font-size: 4vw;
        margin-left: 1%;
    }

    .container-padding{
        margin-left: 2%;
    }

    .navbar-nav.navbar-center {
        position: absolute;
        left: 50%;
        transform: translatex(-50%);
        top: 3.5vw;
    }

    .navbar-toggler{
        padding: 0.1vw 1vw !important;
    }

    .footer{
        text-align: center;
    }

    .footer-logo{
        display: none;
    }

    .footer-social{
        font-size: 6vw;
    }

    .footer-email-big{
        display: none;
    }

    .footer-email-small{
        display: block;
    }

    .tekening-vdd img{
        max-width: 30vw;
        height: auto;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .contact-card img{
        float: right;
        margin-left: 10%;
        width: 20vw;
        height: auto;
    }

    .video{
        width: 90vw;
        height: auto;
    }

    .video-pos{
        margin-bottom: 4vw;
    }

    .logo-modal{
        display: none
    }

    .page-video{
        width: 40vw;
        height: auto;
    }

    .page-video-haven{
        width: 80vw;
        height: auto;
    }

    .youtube{
        width: 40vw;
        height: 22vw;
    }

    .c-background{
        background-color: #fff;
        max-width: 100%;
        height: auto;
    }

    .content p{
        font-family: Paper-Flowers;
        font-size: 6vw;
    }
}

@media only screen and (max-width: 321px){
    .navbar-nav.navbar-center {
        top: 4vw;
    }

    .title-size{
        font-size: 3vw;
        margin-left: 1%;
    }
}