* {
    font-family: Garamond;
    margin: 0;
    padding: 0;
    color: black;
    list-style: none;
    text-decoration: none;
}
.underlined {
    text-decoration: underline;
}
body {
    min-height: 100vh;
    overflow-y: scroll;
}




@media only screen and (min-width:1025px) {
    /* Ecran d'ordinateur */
    /* Général */
    html {
        background-color: #dda15e;
    }






    /* Navbar */
    header {
        background-color: #faedcd;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px 30px;
    }
    header hr {
        display: none;
    }
    .navbar {
        display: flex;
    }
    .navbarLogo {
        display: flex;
        align-items: center;
    }
    .navbarLogoImage img {
        width: 100px;
        margin-right: 10px;
    }
    .navbarLogo h1, .navbarLogo h2 {
        color: #18243c;
    }
    .navbarBurger {
        display: none;
    }
    .navbarOptions {
        display: flex;
        justify-content: flex-end;
    }
    .navbarOptions a {
        display: flex;
        align-items: center;
        margin-left: 20px;
        padding: 10px;
        font-size: 1.1vw;
        font-weight: bold;
        border-radius: 10px;
        transition: 0.3s ease-in-out;
    }
    .navbarOptions a:hover {
        background-color: #a7c957;
        transition: 0.3s ease-in-out;
    }
    .navbarOptions a span {
        margin-right: 5px;
    }





    footer {
        display: flex;
        top: 100%;
        position: sticky;
        flex-direction: column;
        background-color: #faedcd;
        padding: 20px 10%;
        padding-bottom: 0px;
    }
    .upperFooter {
        display: flex;
        justify-content: space-between;
    }
    .footerLogo {
        display: flex;
        align-items: center;
    }
    .footerLogo img {
        height: 100px;
    }
    .footerLogo h3 {
        color: #18243c;
        font-size: 1.5rem;
    }
    .footerLogo p {
        color: #18243c;
        font-size: 1.2rem;
        font-weight: bold;
    }
    .footerCertifications {
        display: flex;
    }
    .footerCertifications img {
        height: 100px;
        margin-left: 10px;
    }
    .footerSeparation {
        background-color: #18243c;
        height: 2px;
        display: block;
        margin: 10px 0px;
    }
    .middleFooter {
        display: flex;
        justify-content: space-around;
    }
    .lowerFooter p {
        text-align: center;
        margin: 10px 0;
    }








    /* Content */
    .content {
        margin: 100px 15vw;
        background-color: #faedcd;
        padding: 15px;
        border-radius: 10px;
    }
    .contentTitle {
        font-size: 2.7rem;
        text-align: center;
        margin: 40px 0px;
    }
    .paragraphOne {
        display: flex;
        align-items: center;
        margin-top: 20px;
        width: 100%;
    }
    .paragraphText {
        width: 50%;
    }
    .paragraphTitle {
        font-size: 2rem;
        margin: 30px;
        text-align: center;
    }
    .paragraphText p {
        font-size: 1.5rem;
        margin: 20px;
        text-align: justify;
    }
    .paragraphImage {
        width: 50%;
        height: 100%;
    }
    .paragraphImage img {
        width: 100%;
        border-radius: 5px;
        object-fit: cover;
        height: 100%;
    }
    .paragraphTwo {
        margin-top: 20px;
        display: flex;
        align-items: center;
        flex-direction: row-reverse;
    }





    /* Produits */
    .productName {
        font-size: 2rem;
        margin-top: 20px;
    }
    .productCategory {
        width: 100%;
    }
    .productCategorySeparation {
        display: block;
        background-color: black;
        height: 2px;
        width: 100%;
        margin: 10px 0px;
    }
    .productList {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }
    .product {
        width: 20%;
        margin-bottom: 20px;
        margin-right: 1%;
        margin-left: 1%;
    }
    .product img {
        width: 100%;
        height: 200px;
        border-radius: 10px;
        overflow: hidden;
        object-fit: cover;
    }
    .product p {
        text-align: center;
        font-weight: bold;
    }





    /* Où trouver les produits */
    .places {
        display: flex;
        flex-direction: column;
    }
    .place {
        display: flex;
        margin-bottom: 10px;
    }
    .place img {
        height: 150px;
    }
    .place p {
        font-size: 1.2rem;
        margin-left: 10px;
    }




    /* Index */
    .indexPresentation {
        position: relative;
        width: 100%;
        height: 25vw;
    }
    .indexPresentationImage {
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: brightness(60%);
        transition: left 1s ease-in-out;
        top: 0;
    }
    .indexPresentationText {
        position: absolute;
        top: 50%;
        width: 100%;
        text-align: center;
        z-index: 99;
    }
    .indexPresentationFirst {
        font-size: 3vw;
        color: white;
        font-weight: bold;
        text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
    }
    .indexPresentationSecond {
        font-size: 2vw;
        color: white;
        text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
    }
    .followUs {
        display: flex;
        flex-direction: column;
    }
    .followUs a {
        display: flex;
        justify-content: center;
    }
    .followUs a img {
        width: 20%;
    }
    .followUs iframe {
        width: 100%;
        height: 300px;
    }
    .explore {
        display: flex;
        flex-wrap: wrap;
    }
    .exploreCategory {
        width: 50%;
        position: relative;
        margin-bottom: -5px;
    }
    .exploreCategoryFull {
        width: 100%;
    }
    .exploreCategory:hover {
        z-index: 5;
    }
    .exploreCategory:hover img {
        filter: brightness(80%);
        transform: scale(1.1);
        transition: 0.3s ease-in-out;
        border-radius: 10px;
    }
    .exploreCategory img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        overflow: hidden;
        filter: brightness(60%);
        transition: 0.2s ease-in-out;
    }
    .exploreCategory h4 {
        position: absolute;
        top: 50%;
        text-align: center;
        width: 100%;
        font-size: 2.5rem;
        transform: translateY(-50%);
        color: white;
        text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
    }





    /* Articles */
    .article {
        display: flex;
        flex-direction: column;
    }
    .articleTitle {
        font-size: 2rem;
        text-align: center;
        margin: 30px;
        margin-top: 45px;
    }
    .articleOneContent {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .articleContent p {
        font-size: 1.5rem;
        margin: 0px 20px;
    }
    .articleContent .imageCredit {
        font-size: 1rem;
        text-align: center;
    }
    .articleContentImg {
        display: flex;
        justify-content: space-around;
        margin: 0px 15px;
        width: 50%;
    }
    .articleContentImg div {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .articleContentImg div img {
        width: 100%;
    }
    .articleContentImgOne {
        width: 100%;
        margin-top: 10px;
    }
    .articleContentImgOne div {
        width: 30%;
    }
    .articleContentImgOne img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        overflow: hidden;
        object-position: center center;
    }
    .articleContentImg img {
        display: flex;
        object-fit: cover;
        overflow: hidden;
    }






    .articleTwoContent {
        display: flex;
        justify-content: center;
    }
    .articleTwoContent p {
        width: 50%;
    }
    .articleContentImgTwo {
        width: 50%;
    }
    .articleContentImgTwo img {
        width: 100%;
    }


    .articleThreeContent {
        display: flex;
        justify-content: center;
        flex-direction: row-reverse;
    }
    .articleThreeContent p {
        width: 50%;
    }
    .articleContentImgThree {
        width: 50%;
    }
    .articleContentImgThree img {
        width: 100%;
    }





    /* Contact */
    .contactContent {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .contactImage {
        width: 70%;
        border-radius: 10px;
    }
    .contactInfo {
        margin: 15px 0px;
    }
    .contactInfo p {
        font-weight: bold;
    }
    .contactContent iframe {
        width: 70%;
        border-radius: 10px;
    }





    /* Login Page */
    .loginForm {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .loginForm input {
        font-size: 1.2rem;
        margin-bottom: 10px;
        padding: 2px 5px;
    }
    .loginForm img {
        width: 10%;
    }





    /* Administration */
    .administrationElements {
        display: flex;
        justify-content: space-around;
    }
    .administrationElement {
        background-color: #c2e773;
        font-size: 1.5rem;
        font-weight: bold;
        padding: 10px;
        border-radius: 10px;
        transition: 0.3s ease-in-out;
    }
    .administrationElement:hover {
        transition: 0.3s ease-in-out;
        background-color: #a7c957;
    }





    /* Articles */
    .articlePageName {
        font-size: 1.5rem;
        margin-top: 15px;
    }
    .newArticleButton {
        padding: 10px;
        background-color: #8ac926;
        color: white;
        font-weight: bold;
        font-size: 1.2rem;
        border: solid 2px black;
        border-radius: 5px;
    }
    .negative {
        background-color: #f6aa1c;
    }
    .articleList {
        margin-top: 30px;
    }
    .articlePreview a {
        display: flex;
        align-items: end;
        justify-content: space-between;
    }
    .articlePreview:hover{
        background-color: #c2e773;
    }
    .articlePreview a {
        font-size: 1.2rem;
    }





    /* Nouvel article */
    .newArticleForm {
        display: flex;
        flex-direction: column;
    }
    .newArticleForm input {
        font-size: 1.5rem;
        font-weight: bold;
        padding: 3px;
        border: solid 1px black;
    }
    .newArticleForm textarea {
        font-size: 1.2rem;
        resize: vertical;
        padding: 3px;
    }
    .newArticleForm * {
        margin-bottom: 5px;
        background-color: #f5cb9a;
    }
    .uploadImage {
        font-size: 1.2rem;
    }





    /* Edit Article */
    .editImages {
        display: flex;
        justify-content: space-evenly;
        margin-bottom: 20px;
    }
    .editImageElement {
        width: 20%;
        height: 10%;
    }
    .confirmChange {
        display: flex;
        align-items: center;
        border: solid 1px black;
        padding: 2px;
        margin-top: 20px
    }
    .confirmChange input {
        margin-right: 10px;
    }
    .alerte {
        background-color: transparent;
        margin-top: 20px;
    }





    /* Products */
    .newMarketLink {
        margin-top: 17px;
    }
    .marketRedirection {
        text-align: center;
        width: 100%;
        font-size: 1.5rem;
    }





    /* Autre */
    .editButtons {
        flex-wrap: wrap;
        display: flex;
    }
    .editButtons a {
        margin-right: 10px;
    }
    .displayPartners {
        display: flex;
        align-items: center;
        margin-top: 20px;
    }
    .displayPartners input[type="submit"] {
        margin-left: 10px;
        padding: 2px;
    }
    .checkboxPermission {
        display: flex;
        align-items: center;
        padding-top: 5px;
        padding-left: 5px;
        border: 1px solid black;
    }
    .permissionError {
        color: red;
        width: 100%;
        text-align: center;
        font-weight: bold;
        margin-top: 20px;
    }
    .editImagesDiv {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 30%;
    }
    .editImagesDiv img {
        width: 100%;
        height: 200px;
        object-fit: cover;
    }
    .content h4 {
        font-size: 2rem;
        margin-top: 50px;
        margin-bottom: 10px;
    }
}





























@media only screen and (max-width:1025px) {
    /* Ecran de téléphone / tablette */
    /* Général */
    html {
        background-color: #dda15e;
        height: 100%;
    }




    /* Navbar */
    header {
        background-color: #faedcd;
        position: sticky;
        top: 0;
        z-index: 100;
    }
    .navbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0px 20px;
    }
    .navbarLogo {
        display: flex;
        align-items: center;
    }
    .navbarLogoImage img {
        width: 150px;
    }
    .navbarLogoText h1 {
        font-size: 3rem;
        color: #18243c;
    }
    .navbarLogoText h2 {
        font-size: 2rem;
        color: #18243c;
    }
    .navbarBurger {
        width: 84px;
        height: 62px;
        cursor: pointer;
        position: relative;
    }
    .navbarBurger span {
        width: 84px;
        height: 7px;
        background-color: #18243c;
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        transition: background-color 0.5s ease-in-out;
    }
    .navbarBurger span::before, .navbarBurger span::after {
        content: '';
        position: absolute;
        width: 100%;
        height: 7px;
        background-color: #18243c;
        transition: transform 0.5s ease-in-out;
    }
    .navbarBurger span::before {
        transform: translateY(-27px);
    }
    .navbarBurger span::after {
        transform: translateY(27px);
    }
    .navbarBurger.active span {
        background-color: transparent;
    }
    .navbarBurger.active span::before {
        transform: translateY(0px) rotateZ(45deg);
    }
    .navbarBurger.active span::after {
        transform: translateY(0px) rotateZ(-45deg);
    }
    .navbarOptions {
        display: flex;
        height: 0;
        flex-direction: column;
        transition: 0.6s ease-in-out;
    }
    .navbarActive {
        padding: 100px 30px;
        height: 100vh;
        transition: 0.6s ease-in-out;
        transition-duration: 0.7s;
    }
    .navbarOptions a {
        margin-bottom: 10%;
        font-size: 3rem;
        visibility: hidden;
        color: transparent;
        transition: 0.3s ease-in-out;
        /* transition-delay: 0.5s; */
    }
    .navbarActive a {
        visibility: visible;
        color: #18243c;
        transition: 0.3s ease-in-out;
        transition-delay: 0.5s;
    }
    .navbarOptions a span {
        visibility: hidden;
        color: transparent;
        font-size: 3rem;
        margin-right: 10px;
        transition: 0.3s ease-in-out;
        /* transition-delay: 0.5s; */
    }
    .navbarActive a span {
        visibility: visible;
        color: #18243c;
        transition: 0.3s ease-in-out;
        transition-delay: 0.5s;
    }





    /* Footer */
    .footer {
        position: sticky;
        top: 100%;
        background-color: #faedcd;
        display: flex;
        flex-direction: column;
        padding: 10px 30px;
    }
    .upperFooter {
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .footerLogo {
        display: flex;
        align-items: center;
    }
    .footerLogo img {
        height: 150px;
    }
    .footerLogo h3 {
        font-size: 2rem;
        color: #18243c;
    }
    .footerLogo p {
        font-size: 1.5rem;
        color: #18243c;
    }
    .footerCertifications {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-evenly;
        width: 100%;
    }
    .footerCertifications img {
        margin-left: 10px;
        height: 150px;
    }
    .footerSeparation {
        display: block;
        height: 2px;
        background-color: #18243c;
        margin: 10px 0   ;
    }
    .middleFooter {
        display: flex;
        justify-content: space-between;
    }
    .middleFooter a {
        font-size: 2rem;
    }
    .lowerFooter {
        margin: 10px 0px;
    }
    .lowerFooter p {
        font-size: 1.8rem;
        text-align: center;
    }





    /* Content */
    .content {
        background-color: #faedcd;
        margin: 50px 10%;
        padding: 15px;
        border-radius: 10px;
    }
    .content a.underlined {
        font-size: 2rem;
    }
    .contentTitle {
        width: 100%;
        text-align: center;
        font-size: 3.5rem;
        margin: 50px 0px;
        margin-top: 60px;
    }
    .paragraphOne {
        display: flex;
        flex-direction: column;
        margin: 40px 0px;
    }
    .paragraphTitle {
        text-align: center;
        margin: 10px 10%;
        font-size: 2rem;
    }
    .paragraphText p {
        font-size: 1rem;
    }
    .paragraphImage img {
        margin-top: 10px;
        border-radius: 10px;
        width: 100%;
    }
    .paragraphTwo {
        display: flex;
        flex-direction: column;
        margin: 40px 0px;
    }
    /* Contenu des pages */
    .articleTitle {
        text-align: center;
        margin-top: 20px;
    }
    .articleContent p {
        margin: 5px 0px;
    }
    .articleContentImg img {
        width: 100%;
    }
    .imageCredit {
        font-size: 0.7rem;
    }




    /* Pruduits */
    .productCategory {
        width: 100%;
    }
    .productName {
        font-size: 2.7rem;
    }
    .productCategorySeparation {
        display: block;
        background-color: black;
        height: 2px;
        width: 100%;
        margin-bottom: 10px;
    }
    .product {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 20px;
    }
    .product img {
        width: 70%;
        height: 500px;
        overflow: hidden;
        object-fit: cover;
        border-radius: 10px;
    }
    .product p {
        font-size: 2.5rem;
        text-align: center;
        font-weight: bold;
    }





    /* Où trouver les produits */
    .places {
        display: flex;
        flex-direction: column;
    }
    .place {
        display: flex;
        margin-bottom: 20px;
    }
    .place img {
        height: 150px;
    }
    .place p {
        margin-left: 10px;
        font-size: 1.5rem;
    }





    /* Index */
    .indexPresentation {
        width: 100%;
        position: relative;
    }
    .indexPresentationImage {
        width: 100%;
        height: 300px;
        overflow: hidden;
        object-fit: cover;
        filter: brightness(60%);
        transition: left 1s ease-in-out;
        top: 0;
    }
    .indexPresentationText {
        position: absolute;
        top: 50%;
        text-align: center;
        width: 100%;
        z-index: 99;
        transform: translateY(-50%);
    }
    .indexPresentationFirst {
        color: white;
        font-size: 5vw;
        text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
        font-weight: bold;
    }
    .indexPresentationSecond {
        color: white;
        font-size: 3vw;
        text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
        font-weight: bold;
    }
    .followUs {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .followUs iframe {
        width: 100%;
    }
    .followUs a {
        display: flex;
        justify-content: center;
        width: 100%;
    }
    .followUs a img {
        width: 50%;
    }
    .explore {
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    .exploreCategory {
        display: flex;
        position: relative;
        margin: -1px;
    }
    .exploreCategory img {
        width: 100%;
        height: 200px;
        filter: brightness(60%);
        object-fit: cover;
        overflow: hidden;
    }
    .exploreCategory h4 {
        position: absolute;
        top: 50%;
        text-align: center;
        width: 100%;
        transform: translateY(-50%);
        font-size: 3rem;
        color: white;
        text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
        font-weight: bold;
    }





    /* Contact */
    .contactContent {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .contactImage {
        width: 80%;
        border-radius: 10px;
    }
    .contactInfo {
        margin: 15px 0px;
        width: 80%;
    }
    .contactInfo p {
        font-weight: bold;
        font-size: 1.2rem;
        text-align: center;
    }





    .loginForm {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .loginForm input {
        width: 50%;
        font-size: 2rem;
        padding: 2px 5px;
        margin-bottom: 10px;
    }
    .loginLogo {
        width: 50%;
    }





    /* Administration */
    .administrationElements {
        display: flex;
        flex-direction: column;
    }
    .administrationElements li {
        margin-bottom: 20px;
        background-color: #a7c957;
        padding: 10px;
        width: 50%;
        display: flex;
        justify-content: center;
        border-radius: 10px;
    }
    .administrationElements {
        font-size: 3rem;
        align-items: center;
    }





    /* Articles */
    .newArticleButton {
        font-weight: bold;
        background-color: limegreen;
        color: white;
        padding: 10px;
        border: solid 2px black;
    }
    .articleList {
        margin-top: 20px;
    }
    .articlePageName {
        font-size: 3rem;
        margin-top: 30px;
    }
    .articleName {
        font-weight: bold;
    }
    .articleDate {
        font-size: 0.8rem;
    }
    .articlePreview {
        margin-bottom: 20px;
    }





    /* New article */
    .newArticleForm {
        display: flex;
        flex-direction: column;
    }
    .newArticleForm * {
        background-color: #f5cb9a;
        margin-bottom: 10px;
    }
    .newArticleForm input {
        font-size: 3rem;
    }
    .newArticleForm textarea {
        font-size: 2.5rem;
    }
    .newArticleForm select {
        font-size: 2.5rem;
    }





    /* Edit article */
    .editImages {
        width: 100%;
    }
    .editImageElement {
        width: 100%;
    }
    .deleteArticleButton {
        font-size: 3rem;
    }





    /* Produits */
    .newMarketLink {
        margin-top: 10px;
    }
    .editButtons {
        display: flex;
        flex-direction: column;
    }
    .negative {
        background-color: #f6aa1c;
    }
    .editButtons a {
        font-size: 2rem;
        margin-top: 10px;
    }
    .articlePreview p {
        font-size: 1.6rem;
    }




    /* Autre */
    .contactInfo p {
        font-size: 1.5rem;
    }
    .displayPartners {
        display: flex;
        align-items: center;
        margin-top: 10px;
    }
    .displayPartners p {
        font-size: 3em;
        margin: 0px 10px;
    }
    .displayPartners input {
        font-size: 3rem;
        padding: 10px;
    }
    .displayPartners input[type="checkbox"] {
        height: 30px;
        width: 30px;
    }
    .articlePrev p {
        font-size: 1.9rem;
    }
    .newArticleForm input {
        padding: 10px;
    }
    .checkboxPermission {
        display: flex;
    }
    .checkboxPermission p {
        font-size: 2rem;
    }
    .checkboxPermission input[type="checkbox"] {
        height: 30px;
        width: 30px;
        margin-right: 10px;
    }
}