@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600;1,700;1,800&display=swap');
@import url('https://fonts.cdnfonts.com/css/avenir-next-lt-pro');

/*
POLICE D'ÉCRITURE
 */

.ft-garamond{
    font-family: 'EB Garamond', serif;
}

.ft-avenir{
    font-family: 'Avenir Next LT Pro', sans-serif;
}

/*
COULEUR D'ARRIÈRE PLAN
 */
.bg-green{
    background-color: #929872;
}

.bg-beige{
    background-color: #FFF9EF;
}
/*
COULEURS DE TEXTE
 */
.text-green{
    color: #929872;
}
strong{
    font-weight: 600 !important;
}
/*
ANIMATION AU SURVOL
 */
.nav-link-hover:hover{
    font-weight: bold;
}

.pointer{
    cursor: pointer;
}

/*
STRUCTURE DES BLOCS
 */
body{
    margin-top: 45px;
    overflow-x: hidden;
    background-image: url("../../src/img/path/leaf-left.svg"), url("../../src/img/path/leaf-right.svg");
    background-repeat: no-repeat,no-repeat;
    background-position: top 100vh left 0px, top 180vh right 0px;
}
.navbar{
    min-height: 45px;
}
.mainPage{
    height: 500px;
}

.list-group-item{
    background-color: inherit;
}
/*
CACHER LES BLOCS
 */
.hidden {
    display: none;
}
/*
BOUTON
 */
.myButton {
    box-shadow:inset 0px 34px 0px -15px #929872;
    background-color:#929872;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family: 'EB Garamond', serif;
    padding:9px 50px;
    text-decoration:none;
    text-shadow:0px -1px 0px #929872;
}
.myButton:hover {
    background-color:#929872;
}
.myButton:active {
    position:relative;
    top:1px;
}

/*
RESPONSIVE
 */
@media screen and (max-width: 900px) {
    /*
PARALLAX
 */
    .parallax-index {
        background-image: url("../../src/img/gite-047-paysage.webp");
        min-height: 100vh;
        background-position: right 0px bottom 0px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .parallax-histoire {
        background-image: url("../../src/img/gite-053.webp");
        min-height: 50vh;
        background-position: right 0px bottom 0px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .parallax-gite {
        background-image: url("../../src/img/gite-009.webp");
        min-height: 50vh;
        background-position: right 0px bottom 0px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .parallax-contact {
        background-image: url("../../src/img/gite-051.webp");
        min-height: 50vh;
        background-position: left 0px bottom 0px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .myButtonFloat {
        box-shadow:inset 0px 34px 0px -15px #929872;
        background-color:#929872;
        display:inline-block;
        position: fixed;
        top: 20%;
        right: 0;
        z-index: 9999;
        cursor:pointer;
        color:#ffffff;
        font-family: 'EB Garamond', serif;
        padding:9px 50px;
        text-decoration:none;
        text-shadow:0px -1px 0px #929872;
    }
    .myButtonFloat:hover {
        background-color:#929872;
    }
}
@media screen and (min-width: 901px) {
    /*
PARALLAX
 */
    .parallax-index {
        background-image: url("../../src/img/gite-047-paysage.webp");
        min-height: 100vh;
        background-attachment: fixed;
        background-position: right 0px bottom 0px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .parallax-histoire {
        background-image: url("../../src/img/gite-053.webp");
        min-height: 50vh;
        background-attachment: fixed;
        background-position: right 0px bottom 0px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .parallax-gite {
        background-image: url("../../src/img/gite-009.webp");
        min-height: 50vh;
        background-attachment: fixed;
        background-position: right 0px bottom 80px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .parallax-contact {
        background-image: url("../../src/img/gite-051.webp");
        min-height: 50vh;
        background-attachment: fixed;
        background-position: left 0px bottom 200px;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .myButtonFloat {
        box-shadow:inset 0px 34px 0px -15px #929872;
        background-color:#929872;
        display:inline-block;
        position: fixed;
        top: 20%;
        right: 0;
        z-index: 9999;
        cursor:pointer;
        color:#ffffff;
        font-family: 'EB Garamond', serif;
        padding:9px 50px;
        text-decoration:none;
        text-shadow:0px -1px 0px #929872;
    }
    .myButtonFloat:hover {
        background-color:#929872;
    }
}