body {
    font-family: 'source code pro', Calibri, serif;
    margin: 0;
    padding: 0;
}

nav {
    width: 100%;
    background-color: #424558;
}

nav > ul {
    margin: 0;
    padding: 0;
    list-style-type: none; /*por les puce chiante */
}
.cartecontact{
    max-width: 500px;
    max-height: 500px;
}
.tableaucontact{
    width:40%;
    border:solid  5px;
    border-color: rgb(0, 199, 86);
    border-collapse:collapse;
    text-align:center;
    margin-left:auto;
    margin-right:auto;
    margin-top: 200px;

}

.tableaucontact td {
    border:solid rgb(0, 199, 86) 2px;
    text-align: left;
}
.equipe {
    text-align: center;
}

.homebody{
      margin:0; 
      font-family: 'source code pro', Calibri, serif;
      background:#f8f9fc; /* Couleur fond claire */
      
    }


    .homeheader{
      background:rgb(0,199,86);
      color:white; /* Couleur  txt */
      padding:24px 48px; 
      display:flex; 
      justify-content:space-between; /* Espacement */
      align-items:center; 
    }
    .homeheader .logo{
      font-size:28px; 
      font-weight:800; 
      color:white;
    }


    .textebvn{
      position:relative; 
      text-align:center; 
      padding:160px 20px; 
      color:white; 
      background-image: url(batA.png) ;  /* Image de fond */
      background-size:cover; 
      background-position:center;
    }

    /* Dégradé + flou  */
    .textebvn::before{
      content:""; 
      position:absolute;
      top:0; left:0; right:0; bottom:0; /* Recouvre toute la section */
      background:linear-gradient(135deg,rgba(0,199,86,0.9),rgba(100,250,137,0.9)); /* Dégradé */

    }

    .textebvn h1,.textebvn p{
      position:relative;
      z-index:1; /* texte par desu */
    }

    /* titre prncipal */
    .textebvn h1{
      font-size:56px;
      margin-bottom:24px;
      font-weight:800;
    }

    .textebvn p{
      font-size:22px;
      max-width:800px;
      margin:0 auto 32px;
    }

nav > ul::after {
    content: "";
    display: block;
    clear: both;
}

nav > ul > li {
    float: left;
    position: relative;
    list-style-type: none;
    padding: 0;
}

nav > ul > li:hover > a {
    padding: 15px 30px 20px 30px;
}

nav a {
    display: block;
    text-decoration: none;
    color: rgb(255, 255, 255);           /*couleur ecriture du haut*/
    padding: 20px 30px;
    transition: padding 0.3s ease, background-color 0.15s ease; /* pour une transi moins sec*/
}

.submenu {
    display: none;
}

nav li:hover .submenu {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    padding: 0;
    z-index: 100;
}

.submenu li {
    border-bottom: 1px solid #CCC;
    list-style-type: none; /* enleve les puces de con*/
}

.submenu li a {
    display: block;
    padding: 15px 30px;
    font-size: 13px;
    color: #222538;          
    width: 270px;
}

.menu-html:hover {                                                        /*debut*/
    border-top: 5px solid rgb(9, 187, 54);
    background-color: rgba(220, 220, 220, 0.15);
}

.menu-economie:hover {
    border-top: 5px solid rgb(9, 187, 54);
    background-color: rgba(220, 220, 220, 0.15);
}

.menu-ecologie:hover {
    border-top: 5px solid rgb(9, 187, 54);
    background-color: rgba(220, 220, 220, 0.15);
}

.menu-contact:hover {
    border-top: 5px solid rgb(9, 187, 54);
    background-color: rgba(220, 220, 220, 0.15);
}                                                                         /*fin barre du dessus*/

.menu-html .submenu {
    background-color: rgb(9, 187, 54);
}

.menu-economie .submenu {
    background-color: rgb(9, 187, 54);
}

.menu-ecologie .submenu {
    background-color: rgb(9, 187, 54);
}

.menu-contact .submenu {
    background-color: rgb(9, 187, 54);
}

.submenu li:hover a {
    color: #000000;                        /*ecriture du bas si je dis pas de la merde a verif mais normalement c'est ça*/
    font-weight: bold;
}

.menu-html .submenu li:hover {
    background-color: rgb(100, 250, 137);    /*couleur souris*/
}

.menu-economie .submenu li:hover {
    background-color: rgb(100, 250, 137);
}

.menu-ecologie .submenu li:hover {
    background-color: rgb(100, 250, 137);
}

.menu-contact .submenu li:hover {
    background-color: rgb(100, 250, 137);
}


video{
    height: 750px;
    width: 100%;
    justify-content: center;
    align-items: center;

}

div {
    margint: 10px;
}