@font-face {
    font-family: 'MaPolice';
    src: url(../polices/GreatVibes-Regular.otf);
}
h1, h2 {
    font-family: "MaPolice", Arial, serif;
    font-size: 2.5em;
}
ul {
    width: 100%;
}
.logo {
    width: 100%;
    height: 100%;
}
.logo1 {
    width: 75%;
    height: 75%;
}
.separateur {
    display: flex;
    width: 100%;
    border: 3px solid white;
    border-radius: inherit;
    background: linear-gradient(to right, red, purple);
}
.separateur1 {
    height: 7px;
    margin: auto;
    background: linear-gradient(to right, red, purple);
}
.titre {
    text-align: center;
    text-decoration: underline;
}
.titre1 {
    text-align: left;
    margin-left: 15%;
}
.titre2 {
    text-align: right;
    margin-right: 15%;
}
.imgatelier {
    width: 90%;
    height: 90%;
}
.paragraphe {
    height: 50%;
    width: 50%;
    margin: auto;
    font-size: 70%;
}
.texte {
    font-family: "MaPolice", Arial, serif;
    font-size: 2em;
    border-image: url(../images/Bordures/bordure1.png) 20%;
    border-width: 80px;
    border-style: solid;
    width: 50%;
    height: 50%;
    text-align: center;
    margin: auto;
}
a:hover {
    text-decoration: underline;
}
.monCarousel, .monCarousel3 {
    margin: auto;
    width: 40%;
    height: 40%;
}
.monCarousel2 {
    margin: auto;
    width: 25%;
    height: 25%;
}
.monCarousel4 {
    margin: auto;
    width: 30%;
    height: 30%;
}
h5 {
    text-align: center;
    margin-bottom: 10%;
    font-family: "MaPolice", Arial, serif;
    font-size: 2em;
}
.imageflottante {
    margin-left: 5%;
    margin-right: 5%;
    float: left;
    border-image: url(../images/Bordures/bordure4.webp) 20%;
    border-width: 80px;
    border-style: solid;
    width: 45%;
}
.titreQui {
    border-image: url(../images/Bordures/bordure1.png) 20%;
    border-width: 80px;
    border-style: solid;
    width: 45%;
    text-align: center;
    margin: auto;
}
.texte2 {
    font-family: "MaPolice", Arial, serif;
    font-size: 1.8em;
    margin-left: 5%;
    margin-right: 5%;
    text-align: center;
}
.logoflottant {
    margin-left: 3%;
    margin-right: 3%;
    float: left;
    width: 50%;
}
.logoflottant:hover {
    border: 3px solid black;
}
.logoflottant2 {
    width: 20%;
    margin-left: 13%;
}
.texte3 {
    font-family: "MaPolice", Arial, serif;
    font-size: 1.5em;
    margin-left: 3%;
    margin-right: 3%;
}
h3 {
    font-family: "MaPolice", Arial, serif;
    text-align: center;
    font-size: 1.8em;
}
.imagecontact {
    margin-left: 30%;
    width: 40%;
    height: 40%;
}
.textecontact {
    text-align: center;
    margin: auto;
}
.texte4 {
    overflow: auto;
    display: inline-block;
    text-align: center;
}
.texte4 img {
    float: right;
    width: 50%;
    height: 50%;
}
.liste {
    width: 80%;
    margin: auto;
}
.col-md-4, .col-md-6 {
    margin: auto;
    text-align: center;
}
.col-md-4 img, .col-md-6 img {
    width: 30%;
    height: 30%;
}
.banniere {
    border: 3px solid red;
    border-radius: inherit;
    background: linear-gradient(to right, red, purple);
    display: flex;
    position: fixed;
    width: 100%;
    height: 30%;
    bottom: 0;
    left: 0;
    justify-content: space-around;
}
.text-banniere {
    font-size: large;
    width: 60%;
    margin-top: 5%;
    left: 5%;
}
.button-banniere {
    margin-top: 5%;
}
.button-banniere2 {
    margin-top: 5%;
}
.button-banniere a {
    border: solid 1px darkblue;
    padding: 15px;
    background: darkblue;
    border-radius: 7px;
    color: white;
}
.button-banniere2 a {
    border: solid 3px darkred;
    padding: 15px;
    background: transparent;
    border-radius: 7px;
    color: white;
}
.button-banniere-general {
    width: 50%;
    margin-left: 25%;
}
@media only screen and (max-width: 750px) {
    .texte {
        font-family: "MaPolice", Arial, serif;
        font-size: 1.8em;
        border-image: url(../images/Bordures/bordure1.png) 20%;
        border-width: 80px;
        border-style: solid;
        width: 90%;
        height: 90%;
        text-align: center;
        margin: auto;
    }
    .paragraphe {
        height: 90%;
        width: 90%;
        margin: auto;
        font-size: 70%;
    }
    .monCarousel, .monCarousel3, .monCarousel4 {
        margin: auto;
        width: 90%;
        height: 90%;
    }
    .monCarousel2 {
        margin: auto;
        width: 70%;
        height: 70%;
    }
    .logoflottant {
        margin-left: 3%;
        margin-right: 3%;
        width: 90%;
        margin-bottom: 10%;
    }
    .texte3 {
        font-family: "MaPolice", Arial, serif;
        font-size: 1.5em;
        margin-left: 3%;
        margin-right: 3%;
        margin-top: 5%;
    }
    .imagecontact {
        margin-left: 20%;
        width: 60%;
        height: 60%;
    }
    .container {
        width: auto;
    }
    .text-banniere {
        font-size: large;
        width: 60%;
        margin-top: 5%;
        margin-left: 1%;
    }
    .button-banniere {
        margin-top: 10%;
    }
    .button-banniere2 {
        margin-top: 10%;
    }
}
@media only screen and (max-width: 600px) {
    .text-banniere {
        font-size: large;
        width: 50%;
        margin-top: 1%;
        margin-left: 1%;
    }
    .button-banniere {
        margin-top: 15%;
    }
    .button-banniere2 {
        margin-top: 15%;
    }
    .button-banniere a {
        border: solid 1px darkblue;
        padding: 5px;
        background: darkblue;
        border-radius: 7px;
        color: white;
    }
    .button-banniere2 a {
        border: solid 3px darkred;
        padding: 5px;
        background: transparent;
        border-radius: 7px;
        color: white;
    }
}
@media only screen and (max-width: 1000px) {
    .titreQui {
        border-image: url(../images/Bordures/bordure1.png) 20%;
        border-width: 60px;
        border-style: solid;
        width: 75%;
        text-align: center;
        margin: auto;
    }
    .imageflottante {
        margin-left: 5%;
        margin-right: 5%;
        border-image: url(../images/Bordures/bordure4.webp) 20%;
        border-width: 60px;
        border-style: solid;
        width: 90%;
    }
}