/* 
   Nom du fichier : front.css 
   Description : Feuille de style pour le site web STUDIO BS | Alexandre Boni.
   Auteur : Alexandre Boni 
*/

/*@media (max-width: 1280px) {

    a.btn-bleu, a.btn-turquoise {
        padding: 10px 20px;
    }

    .contenu .premiere-page .colonne-gauche .bloc-haut h1 {
        font-size: 2rem;
    }

    .contenu .premiere-page .colonne-gauche .bloc-haut {
        height: 55%;
    }

    .contenu .premiere-page .colonne-gauche .bloc-bas {
        height: 45%;
    }

    .contenu .bloc-chiffres .bloc-chiffre .chiffre {
        font-size: 7rem;
    }

    .contenu .bloc-plaisir  h2,
    .contenu .bloc-instagram  h2,
    .contenu .bloc-contact  h2,
    .contenu .bloc-evenement  h2,
    .contenu .deuxieme-page .colonne-droite h2 {
        font-size: 1.3rem;
    }

    .contenu .bloc-plaisir  h3,
    .contenu .bloc-instagram  h3,
    .contenu .bloc-contact  h3,
    .contenu .bloc-evenement  h3,
    .contenu .deuxieme-page .colonne-droite h3{
        font-size: 2rem;
    }

    .contenu .bloc-chiffres .bloc-chiffre .chiffre::after {
        bottom: 30px;
    }

    .contenu .bloc-plaisir header.icone {
        min-height: 115px;
    }
}

@media (max-width: 576px) {

    .full-height-s {
        min-height: 100vh;
    }

    .contenu .premiere-page .colonne-gauche .bloc-bas {
        height: 500px;
    }

    .contenu .bloc-plaisir::before {
        background-size: 120%;  Agrandit l'image 
        background-position: -100% 5%;  Positionne plus haut 
    }
}



 MENU TABLETTE 
@media (min-width: 1024px){
    .menu-responsive-menu {
        width: 30%;
    }
}

@media (min-height: 768px) {
    .contenu .premiere-page .colonne-droite {
        background-size: 200%;
    }
    .contenu .deuxieme-page .colonne-gauche.bloc-photo {
        background-size: 130%;
    }
}


@media (max-height: 768px) {
    .contenu .premiere-page .colonne-gauche .bloc-haut h1 {
        font-size: 3rem;
    }

    .contenu .premiere-page .colonne-gauche .bloc-haut {
        height: 55%;
    }

    .contenu .premiere-page .colonne-gauche .bloc-bas {
        height: 45%;
    }
}*/


@media screen and (max-height: 768px) {
    .contenu .premiere-page .colonne-gauche .bloc-haut {
        height: 55%;
    }

    .contenu .premiere-page .colonne-gauche .bloc-bas {
        height: 45%;
    }

    a.btn-bleu, a.btn-turquoise, a.btn-noel {
        padding: 10px 20px;
    }
}

@media screen and (max-height: 1024px) {
    .contenu .premiere-page .colonne-gauche .bloc-haut h1 {
        font-size: 2.8rem;
    }
}

@media screen and (max-height: 1180px) {
    .contenu .premiere-page .colonne-gauche .bloc-haut h1 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 360px) {
    a.btn-bleu, a.btn-turquoise, a.btn-noel {
        padding: 10px 20px;
    }
}

@media screen and (max-width: 431px) {
    .contenu .premiere-page .colonne-gauche .bloc-bas {
        height: 480px;
    }
}

@media screen and (min-height: 786px) {
    .contenu .premiere-page .colonne-droite {
        background-size: 200%;
    }
}

@media screen and (max-width: 1420px) {
    .contenu .deuxieme-page .colonne-gauche.bloc-photo {
        background-size: 160%;
    }
}

@media screen and (max-width: 1200px) {
    .contenu .bloc-plaisir  h2,
    .contenu .bloc-instagram  h2,
    .contenu .bloc-contact  h2,
    .contenu .bloc-evenement .bloc  h2,
    .contenu .deuxieme-page .colonne-droite h2 {
        font-size: 1.3rem;
    }

    .contenu .bloc-plaisir  h3,
    .contenu .bloc-instagram  h3,
    .contenu .bloc-contact  h3,
    .contenu .bloc-evenement .bloc  h3,
    .contenu .deuxieme-page .colonne-droite h3{
        font-size: 2rem;
    }
}

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

    .contenu .bloc-evenement .bloc::before {
        background-size: 70%;
        background-position: 100% 100%;
    }
}

@media screen and (min-width: 768px) {
    .menu-responsive-menu {
        width: 35%;
    }
}