body{
    margin: 0;
    padding: 0;
}

/* Fonts */

@font-face {
    font-family: BebasNeue-Bold;
    src: url(/fonts/BebasNeue-Bold.otf);
}

/* Navbar */

/*.navbar{*/
/*    z-index:9;*/
/*}*/

nav{
    /*background-image: url("/images/background-code.jpg");*/

}

/* Header */

header{
    margin-bottom: 1.5vw;
}

.header-title{
    font-family: BebasNeue-Bold;
    color: white;
    font-size: 5vw;
}

.header-title-mobile{
    display: none;
}

.header-desc{
    font-family: BebasNeue-Bold;
    color: white;
}

#header-container {
    display: flex;
}

.header-child {
    margin: auto;
}

/*.carousel-caption{*/
/*    bottom: 35% !important;*/
/*}*/

/*#carouselExampleSlidesOnly{*/
/*    position:absolute;*/
/*    width:100%;*/
/*    top:0;*/
/*}*/

/* Main content container */

main{
    padding: 0;
    margin: 0;
}

/* Bedrijfs takken */

.bedrijfs-onderdelen {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    padding: 0;
    margin: 0;
    list-style: none;
    margin-top: 2vw;
}

.bedrijfs-onderdelen-item {
    /*margin-top: 2vw;*/
    padding: 0.5vw;
}

.bedrijfs-onderdelen-item svg{
    font-size: 6vw;
    color: #4894CE;
}

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

.bedrijfs-onderdelen-item p{
    padding: 0;
    margin: 0;
}

/* Krijg Hulp */

.hulp-vraag{
    background-image: url("/images/background-code.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.hulp-vraag h2{
    padding: 1vw;
    color: white;
}

/* Het team(idee) */

.het-team{
    width: 20%;
    height: auto;
    margin: 0 auto;
}

.het-team h3{
    padding: 0.5vw;
}

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

/* Bedrijfs uitleg boxes */
@media screen and (min-width: 600px) {

    .design-box {
        padding: 2vw;
        width: 60%;
        height: auto;
        /*background-color: #42DBCC;*/
    }

    .development-box {
        padding: 2vw;
        margin-right: 0px;
        margin-left: auto;
        width: 60%;
        height: auto;
        /*background-color: #42DBCC;*/

    }
}

.boxes{
    margin-top: 9vw;
}

/* Footer */

.footer-content{
    background-color: #3f83f8;
    color: white;
}

.footer-content a{
    color: white;
}

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

.footer-copyright{
    background-color: #45CAE6;
    color: white;
}

.footer-copyright p{
    padding: 0;
    margin: 0;
}

footer img{
    padding: 0.5vw;
}

.footer-certificate{
    padding: 0.5vw;
    font-size: 3vw;
}

/*.copyright{*/
/*    background-color: #45CAE6;*/
/*    color: white;*/
/*}*/

/*.copyright p{*/
/*    padding: 0.5vw;*/
/*}*/

/*.copyright a{*/
/*    color: white;*/
/*}*/

/*.copyright a:hover{*/
/*    color: black;*/
/*    text-decoration: none;*/
/*}   */

/*footer{*/
/*    margin: 0;*/
/*    padding: 0;*/
/*    position: absolute;*/

/*}*/

/*footer p{*/
/*    margin: 0;*/
/*    padding: 0;*/
/*}*/

.social-footer{
    font-size: 150%;
}

/* Load screen(idee) */

.load-screen{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: white;

}

.load-spinner{
    margin-top: 25%;
    display: flex;
    justify-content: center;
    align-content: center;
    color: #4894CE;
}

/* Blink effect */

blink {
    -webkit-animation: 2s linear infinite condemned_blink_effect; /* for Safari 4.0 - 8.0 */
    animation: 2s linear infinite condemned_blink_effect;
}

/* for Safari 4.0 - 8.0 */
@-webkit-keyframes condemned_blink_effect {
    0% {
        visibility: hidden;
    }
    50% {
        visibility: hidden;
    }
    100% {
        visibility: visible;
    }
}

@keyframes condemned_blink_effect {
    0% {
        visibility: hidden;
    }
    50% {
        visibility: hidden;
    }
    100% {
        visibility: visible;
    }
}


span.caret{
    border-right: .05em solid;
    -webkit-animation: caret 1s steps(1) infinite;
    animation: caret 1s steps(1) infinite;
}

/* blog card */

.blog-card a{
    color: black;
}

.blog-card a:hover{
    color: #4894CE;
    text-decoration: none;
}


/* contact pagina */
.social-contact a{
    color: black;
    font-size: 2vw;
}

.social-contact a:hover{
    color: #3f83f8;
}

.full-with{
    background-color: #edf2f7;
}

.contact-onderdelen {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
    padding: 0;
    margin: 0;
    list-style: none;
    /*margin-top: 2vw;*/
}

.contact-onderdelen-item {
    margin-top: 2vw;
    /*max-width: 10vw;*/
}

.contact-onderdelen-item svg{
    font-size: 6vw;
    color: #4894CE;
}

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

.contact-onderdelen-item p{
    padding: 0;
    margin: 0;
}

.icon-contact{
    font-size: 2vw;
    color: #569BD2;
}



/*.card-title{*/
/*    background-color: #9fa6b2;*/
/*    opacity: 0.5;*/
/*}*/

/* wordpress pagina */

.img-wordpress img{
    width: 20vw;
    height: auto;
}



@media only screen and (max-width: 600px) {
    /* wordpress pagina */

    .img-wordpress img{
        width: 50vw;
        height: auto;
    }

    /* header */

    .header-title{
        font-family: BebasNeue-Bold;
        color: white;
        font-size: 10vw;
        /*margin-top: 20vw;*/
    }

    .carousel-caption{
        bottom: -5vw !important;
    }

    .header-title-show{
        display: none !important;
    }

    /* bedrijfs boxes */
    /*.design-box{*/
    /*    padding: 2vw;*/
    /*    width: 60%;*/
    /*    height: auto;*/
    /*    !*background-color: #42DBCC;*!*/
    /*}*/

    /*.development-box{*/
    /*    padding: 2vw;*/
    /*    !*margin-right: 0px;*!*/
    /*    !*margin-left: auto;*!*/
    /*    width: 60%;*/
    /*    height: auto;*/
    /*    !*background-color: #42DBCC;*!*/

    .bedrijfs-onderdelen-item svg{
      font-size: 10vw;
        margin-bottom: 2vw;
    }

    #development{
        margin-top: 3vw;
    }

    /*}*/

    .achternaam-mob{
        margin-top: 2vw;
    }

    .contact-onderdelen-item {
        margin-top: 4vw;
        width: 50vw;
        /*max-width: 10vw;*/
    }
    
    .social-media-mob{
        display: none;
    }

    .contact-icon{
        font-size: 8vw;
        margin-top: 2vw;
    }

    .text-center-mob{
        text-align: center;
    }

    .icon-contact{
        font-size: 8vw;
    }

    /*   footer  */

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

    .footer-certificate{
        padding: 0.5vw;
        font-size: 10vw;
        margin-bottom: 4vw;
    }

}