@font-face{font-family: 'algerian';src:url('./fonts/Algerian-Regular.ttf');}
@font-face{font-family: 'courgette';src:url('./fonts/Courgette-Regular.ttf')}
@font-face {font-family: 'caveat';src: url('./fonts/Caveat-VariableFont_wght.ttf');}
@font-face {font-family: 'marker';src: url('./fonts/PermanentMarker-Regular.ttf');}
body{margin:0px; padding: 0px;}
/*** generalités ***/
.jus-cent{justify-content: center; align-items: center;}
.row{display: flex; flex-direction: row;}
.container-fluid-white{background-color: white; text-align: center; padding: 15px;}
.colonne{flex-direction: column;}
.space{justify-content: space-around;}
em{color:rgb(222,62,40);font-weight: bold;}
strong{font-size: 1.2em;}
.font{font-size: 1.4em;}
span{color: rgb(39, 127, 77);}
/*** traits couleur**/
.legere-ombre{display: flex;width: 25%; margin: auto;border:1px solid rgb(222, 62, 40); box-shadow: 2px 5px 2px grey;}
.legere-rouge{width: 200px; margin: auto; height: 10px; /*background-color: rgb(222, 62, 40);*/background-image: url('./images/fond-rouge.PNG');}
.legere-vert{width: 200px; margin: auto; height: 3px; background-color: rgb(39, 127, 77);}
.legere-verte-ombre{width: 400px; margin: auto; height: 6px; background-image: url('./images/fond-vert.PNG'); box-shadow: 2px 5px 2px grey;}
.legere-rouge-ombre{width: 400px; margin: auto; height: 6px; background-image: url('./images/fond-rouge.PNG'); box-shadow: 2px 5px 2px grey;}
.ligne{width: 200px; margin: auto; height: 5px; background-color: rgb(222, 62, 40);}
.active-sans-bordure{border-bottom: 1px solid grey; box-shadow: 2px 3px 2px 3px grey;}
/*** bandeau cookies **/
.message-cookies{display: flex;background-color: rgb(39, 127, 77); background-attachment: fixed; left: 200px; padding-bottom: 5px;}
.texte-cookie p{margin: 10px; font-size: 0.8em;}
.bouton-cookie{background-color: white; width: 100px; margin: auto; padding:10px; border-radius: 15px;cursor:pointer;}
/*** Navbar ****/
.logos{display: flex;}
a.navbar-actived{color:rgb(39, 127, 77); text-decoration: none;}
/** acccueil ***/
.banniere{text-align: center;}
.banniere img{width: 100%; height: auto; background-size: cover; z-index: 2;}
.carte{background-color:rgb(247, 237, 224); padding-top: 10px; padding-bottom: 10px; margin-top: 10px;}
.carte h2{width: 150px; margin:auto;font-family: 'courgette',Georgia, sans-serif; border-bottom: 4px solid rgb(39, 127, 77);}
a{text-decoration: none;}
.bouton-ascenseur{width: 40px;height:40px;border: 5px solid rgb(39, 127, 77);border-radius: 10px;position:fixed;right:3px;top:410px;z-index:2;text-align: center;}
.bouton-ascenseur p{color:rgb(39, 127, 77);font-size: 2em; margin:0px!important; padding-top: 3px;}
a.actived{color:rgb(63, 238, 63);}
.presentation, .pizzeria{margin-top: 10px;}
.presentation a{color:rgb(39, 127, 77)!important;}
.presentation h1{font-family: 'courgette',Georgia, 'Times New Roman', Times, serif; width: 400px; margin: auto; border-bottom: 4px solid rgb(222,62,40);}
#bouton-appel p{background-color: rgb(39, 127, 77);color:white!important;padding:2px; border: 2px solid rgb(39, 127, 77);width: 200px; margin: auto;border-radius: 5px;}
.pizzeria h2{font-family: 'courgette',Georgia, 'Times New Roman', Times, serif; width: 200px; margin: auto; border-bottom: 4px solid rgb(222, 62, 40);padding-top: 10px;}
p{font-size: 1.2em; font-family: Arial, Helvetica, sans-serif;}
.pizzeria h3{font-family:'algerian' ,Georgia, 'Times New Roman', Times, serif;}
.produits h2{font-family: 'courgette',Georgia, 'Times New Roman', Times, serif; width: 200px; margin: auto; border-bottom: 4px solid rgb(39, 127, 77);padding-top: 10px;}
.produits h3{font-family:'algerian' ,Georgia, 'Times New Roman', Times, serif;}
.image-map img{border: 1px solid rgb(39, 127, 77)}
/*** carte ***/
.carte-pizzas h1{font-family:'algerian' ,Verdana, Geneva, Tahoma, sans-serif;}
/*** boutons menu couleur ***/
.boutons-menu{display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap;}
.bouton-classique, .bouton-fromagere, .bouton-calzone, .bouton-specialite{width: 200px; margin: 10px;font-family: 'algerian',Georgia, sans-serif;box-shadow: 2px 5px 2px grey;}
/*.active{border-radius: 15px;box-shadow: 2px 5px 2px gray;}*/
.bouton-classique, .bouton-calzone{border: 2px solid rgb(222,62,40); border-radius: 10px;color:white;background-image: url('./images/fond-rouge.PNG');background-size: cover;}
.bouton-fromagere, .bouton-specialite{border: 2px solid rgb(39, 127, 77); border-radius: 10px; color:white;background-image: url('./images/fond-vert.PNG');background-size: cover;}
.texte-bouton p{font-family: 'caveat',Georgia, sans-serif; font-weight: bold;color:white;}
.small{font-size: 0.8em;}

/** titre type de pizza  **/
.carte-pizzas h2{width: 290px!important;}
.carte-pizzas  a{color: white;}
h2.pizza-classique, h2.calzone{font-family: 'caveat', Georgia, 'Times New Roman',sans-serif; width: 220px;margin: auto; color:white;background-image: url('./images/fond-rouge.PNG'); border-radius: 15px 0px; padding:15px; background-size: cover; }
h2.fromage, h2.specialite{font-family: 'caveat', Georgia, 'Times New Roman',sans-serif; width: 220px; margin: auto;color:white; background-image: url('./images/fond-vert.PNG'); border-radius: 15px 0px; padding:15px; background-size: cover;}
.classique, .fromages, .specialites{display: flex; flex-direction: row;}
.pizza-classique h2{border-bottom: 5px solid rgb(222, 62, 40);}
/***titre duo ***/
.image-duo{margin-bottom: 10px;}
.image-duo img{border-radius: 15px;}
.titre-duo{margin-top: 20px;}
.titre-duo h3{margin-top: 20px; font-family: 'algerian'!important;}
.titre-bambino h3,.titre-duo h3{width: 200px; margin:auto;border-bottom: 3px solid rgb(39, 127, 77);}
/*** nom pizza h3  **/
.titre h3, .titre-calzone h3{font-family: 'marker', 'Times New Roman',sans-serif; font-size: 1.5em; font-weight: bold;}
.titre-calzone h3{width: 30%;margin:auto;font-family: 'marker', 'Times New Roman',sans-serif; font-size: 1.5em; font-style: italic; margin-top: 15px;}
/** texte **/
.titre{width: 40%;}
/*** prix ***/
.bloc-prix{display: flex; flex-direction: row;}
.prix-calzone{font-weight: bold;}


/**** pizzeria ****/
.lapizzeria h1{font-family:'algerian' ,Verdana, Geneva, Tahoma, sans-serif;}
.img-duo{display: flex; flex-direction: row; justify-content: space-around;}
.duo-from img, .duo-chorizo img{width: 75%; height: 75%; border-radius: 15px;}
.pizzeria-dist img{width: 55%; height: 55%; border-radius: 15px;}
video{width: 70%; height: 70%; border-radius: 15px;}
/**** nos produits ***/
.nosproduits h1{font-family:'algerian' ,Verdana, Geneva, Tahoma, sans-serif;}
.nosproduits h2{font-family: 'caveat', Georgia, 'Times New Roman',sans-serif; width: 220px;margin:auto;}
/*** contact ***/
.contact{margin-bottom: 10px;}
/*** footer ****/
.footer{background-color:rgb(247, 237, 224); padding-top: 20px;}
.entité a{color:rgb(39, 127, 77);}
.icone-reseau{display: flex; flex-direction: row; justify-content: space-around; background-color: rgb(247, 237, 224);}
a.icone-reseau{display: block;}
.icone-reseau p{background-color: rgb(247, 237, 224);}
.mentions p{padding:2px; border: 2px solid rgb(39, 127, 77);width: 200px; margin: auto;border-radius: 5px;}
a.mentions{color: rgb(39, 127, 77);}

                /******      responsive       *******/
@media all and (min-width:300px) and (max-width:499px){
    #bar-large, #bar-moyen{display:none;}
    #bar-portable{display:flex; background-color:white; width: 100%; height: 100px; padding:5px;}
    .bloc-logo{padding:10px;}
    .bloc-logo img{width: 85%; height: 85%;}
    #menu{background-color: white; display:none; z-index: 1;}
    ul a{color:black;}
    ul.barre{list-style-type: none; width: 100%; padding:0px!important}
    li.actived a{color: rgb(39, 127, 77);}
    .presentation h1{font-family: 'courgette',Georgia, sans-serif; width: 200px!important; margin: auto; border-bottom: 4px solid rgb(222,62,40);}
    .pizzeria img{width: 50%; height: 50%;}
    .image-calzone img{width: 65%!important; height: 65%!important;}
    .image-chorizo img{width: 50%; height: 50%; border-radius: 15px;}
    .carte{width: 100%;}
    .images img{width: 70%; height: 70%;}
    .image1 img, .image2 img{width: 70%; height: 70%;}
    #image-rond.img-footer{width: 50%; margin: auto; }
    .img-footer img{width: 50%; height: 50%;border-radius: 20%;}
    /*** carte ***/
    .bloc-prix{display: flex; flex-direction: row;justify-content: space-around;}
    .legere-ombre{display: none;}
    .legere-verte-ombre, .legere-rouge-ombre{width: 300px;}
    .prix{width:50%;}
    .titre{width: 100%;} .titre-calzone h3{width: 100%;}
    .classique, .fromages, .specialites{display: flex; flex-direction: column!important;}
    .image-duo img{width: 50%; height: 50%;}
    /*.legere-vert{width: 200px; margin: auto; border: 1px solid rgb(39, 127, 77);}
    .legere-rouge{width: 200px; margin: auto; border: 1px solid rgb(222,62,40);}*/
    .titre-bambino h3, .titre-duo h3{font-family: Georgia, 'Times New Roman',sans-serif; font-size: 1.5em;}
    
    
    /*** pizzeria***/
    video{width: 80%; height: 80%; border-radius: 15px;}
}
@media all and (min-width:500px) and (max-width:799px){
    /**accueil**/
    #bar-large, #bar-moyen{display:none;}
    #bar-portable{display:flex; background-color:white; width: 100%; height: 115px; padding-top:5px;}
    .bloc-logo{padding:10px;}
    #menu{background-color: floralwhite; display:none; z-index: 1;}
    ul a{color:black;}
    ul.barre{list-style-type: none; width: 100%; padding:0px!important}
    li.actived a{color: rgb(39, 127, 77);}
    .legere-vert{width: 200px; margin: auto; border: 1px solid rgb(39, 127, 77);}
    .legere-rouge{width: 200px; margin: auto; border: 1px solid rgb(222,62,40);}
    #navigation{width: 80%;margin: auto;}
    #image-rond.img-footer{width: 50%; margin: auto; }
    .img-footer img{width: 50%; height: 50%;border-radius: 20%;}
    .pizzeria img{width: 55%; height: 55%;}
    .image-chorizo img{width: 50%; height: 50%; border-radius: 15px;}
    /***carte***/
    .carte-pizzas h2{font-family: 'caveat', Georgia, 'Times New Roman',sans-serif; width: 220px; margin: auto;}
    .image-duo img{width: 50%; height: 50%;}
    .classique, .fromages, .specialites{display: flex; flex-direction: column!important;}
   
    .legere-ombre{display: none;}
    .bloc-prix{display: flex; flex-direction: row; width: 100%; justify-content: space-around;}
    /*** pizzeria  **/
    video{width: 80%; height: 80%; border-radius: 15px;}
}
@media all and (min-width:800px) and (max-width:1200px){
    #bar-large, #bar-portable{display:none;}
    #bar-moyen{display:flex; background-color:white; width: 100%; height: 220px;}
    .bloc1 img{background-color:white; padding:5px;}
    .sous-bloc{width: 200px; padding: 5px; font-family: 'courgette'; font-size: 1.3em;}
    .sous-bloc a{color: black;}
    a.navbar-actived{color:rgb(39, 127, 77); text-decoration: none;}
    .pizzeria img{width: 50%; height: 50%;}
    #image-rond.img-footer{width: 40%; margin: auto; }
    .img-footer img{width: 40%; height: 40%;border-radius: 20%;}
    .titre-bambino h3, .titre-duo h3{font-family: 'caveat', Georgia, 'Times New Roman',sans-serif; font-size: 1.4em;}
    .classique, .fromages, .specialites{display: flex; flex-direction: row!important;}
    .titre-calzone h3{font-family: 'marker', 'Times New Roman',sans-serif; font-size: 1.5em; font-style: italic;}
    .titre{width: 40%;} .prix{width: 30%;}
    .image-duo img{width: 50%; height: 50%;}
  
    .image-chorizo img{width: 50%!important; height: 50%!important; border-radius: 15px;}
    /*** carte  **/
    .bloc-prix{display: flex; flex-direction: row; width: 100%; justify-content: space-around;}
}
@media all and (min-width:1201px){
    /***Navbar **/
    #bar-large{display:flex;background-color:white; width: 100%; height: 120px;}
    #bar-moyen, #bar-portable{display:none;}
    .bloc{width: 200px;text-align: center; font-family: 'courgette'; font-size: 1.3em;}
    a.navbar{text-decoration: none; color:black;}
    a.navbar-actived{color:rgb(39, 127, 77); text-decoration: none;}
    .bloc-logo{padding:5px;}
    .bloc-logo img{width: 90%; height: 90%;}
    /***corps ***/
    .pizzeria img{width: 40%; height: 40%;}
    .classique, .fromages, .specialites{display: flex; flex-direction: row;}
    .titre{width: 40%;} .prix{width: 30%;}
    .titre h3, .titre-calzone h3{font-family: 'marker', 'Times New Roman',sans-serif; font-size: 1.3em; font-weight: bold;}
    .titre-bambino h3, .titre-duo h3{font-family: 'caveat', Georgia, 'Times New Roman',sans-serif; font-size: 1.4em;}
    .image-duo img{width: 50%; height: 50%;}
    .image-fromage img{width: 30%; height: 30%;}
   
    .image-calzone img{width: 50%; height: 50%; margin-top: 10px;}
    .image-chorizo img{width: 50%!important; height: 50%!important; border-radius: 15px;}
    /** carte  */
    .bloc-prix{display: flex; flex-direction: row; width: 100%; justify-content: space-around;}
    /** footer*/
    #image-rond.img-footer{width: 40%; margin: auto; }
    .img-footer img{width: 40%; height: 40%;border-radius: 20%;}
}



