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

.product-card {
    max-width: 48%;
}
    .contact-text #pijl {
        display: none;
    }
    .textImage { 
        flex-wrap: wrap-reverse;
    }
    .textImage .textImageText {
        width: 100%;
        padding-right: 0px;
    }
    
    .textImage .imageContainer {
        width: 100%;
    }
}

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

    .product-card {
        max-width: 100%;
    }

    #intro h1 {
        margin-top: 40px;
    }
    
    #splash {
        display: none;
    }

    .product-card .product-image {
        top: -150px;
        transform: scale(60%);
        right: -20px;
    }

    .product-card {
        margin-top: 80px;
    }

    .energetischeTherapie {
        flex-wrap: wrap-reverse;
    }

    

    .logos {
        max-width: 60%;
        margin-top: 20px;
        left: 5%;
    }


    .hamburger-menu {
        font-size: 22px;
        color: white;
        text-decoration: none;
        display: flex;
        position: absolute;
        right: 5%;
        top: 90px;
    }

    .hamburger-menu img {
        margin-left: 10px;
    }

    .mobile-hide {
        display: flex !important;
        flex-direction: column-reverse;
    }


    header nav a {
        color: white;
    }

    .scroll-stop {
        margin: 0; 
        height: 100%; 
        overflow: hidden;
    }

    nav {
        display: none;
        flex-direction: column-reverse;
        margin-bottom: 9999px;
        margin-top: 120px;
    }
    
    nav div a {
        padding: 10px;
    }

    header nav .sub-nav {
        border-bottom: none;
        border-top: 3px dashed #295E60;
        display: flex;
        flex-direction: column;
        justify-content: center;
        
    }
    
    header nav .sub-nav a:link,
    header nav .sub-nav a:visited,
    header nav .sub-nav a:hover,
    header nav .sub-nav a:active {
        color: white;
        text-decoration: none;
        font-weight: 300;
        margin-left: 0px;
        text-align: center;
        font-size: 1.2em;
    }
    header nav .sub-nav a:hover {
        text-decoration: underline;
    }
    
    header nav .main-nav {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: auto;
        margin-bottom: 20px;
        margin-right: auto;
    }
    
    
    header nav .main-nav a:link,
    header nav .main-nav a:visited,
    header nav .main-nav a:hover,
    header nav .main-nav a:active {
        margin-left: 0px;
        font-weight: 300;
        text-decoration: none;
        font-size: 1.8em;
        text-align: center;
    }
    
    header nav .main-nav a:hover {
        text-decoration: underline;
    }

    
    .over-josee {
        flex-direction: column;
    }
    .over-josee p {
        max-width: 100%;
    }
    

    
    .contact-text p {
        margin-bottom: 40px;
        width: 100%;
    }
    
    .contact-text {
        flex-direction: column;
        margin-bottom: 40px;
    }
    
    footer {
        flex-direction: column;
    }
    footer img {
        margin-top: 20px;
    }
    
    .product-details {
        flex-direction: column;
    }

    .content-builder {
        max-width: 100%;
    }
    
    .product-fiche {
        margin: 0;
        padding: 0;
        width: 100%;
        margin-top: 60px;
        padding-top: 60px;
        border-top: 3px dashed #DEE7E7;
        border-left: none;
    }

    header .detail-header-img {
        position: relative;
        max-width: 100%;
        display: block;
        margin-left: auto;
        height: 100%;
    }

    .energetischeTherapie {
        flex-flow: column-reverse;
    }

    .energetischeTherapie img {
        max-width: 50%;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .energetischeTherapie-content {
        display: inline;
    }

    .energetischeTherapie p {
        max-width: 100%;
    }


}


@media only screen and (max-width: 600px) {
    #splash {
        left: -20px;
        top: -40px;
    }

    #ster {
        right: 0px;
        top: -20px;
    }

    header #pijl {
        left: 75%;
        display: none;
    }

    .product-card {
        max-width: 100%;
        
    }

    body .container {
        max-width: 90%;
    }

    .content-builder .content-box {
        padding: 40px;
    }

    .over-josee img {
        margin-top: 40px;
        display: block;
        margin-right: auto;
        margin-left: auto;
        max-width: 80%;
    }

    .contact {
        padding: 40px;
        padding-top: 60px;
    }

    header #intro {
        margin-bottom: 80px;
    }

    header h1 {
    font-size: 2.6em;
    padding-top: 20px;
    }

    h2 {
        font-size: 3em;
    }
}