body {
    margin: 0;
}

/* forme generale */

.header {
    background-color: #6B8E23;
    text-align: right;
    font-family: Verdana, sans-serif;
    padding: 12px 14px;
    text-decoration: none;
}

h1 a {
    color: white;
    text-decoration: none;
}

.navbar {
    overflow: hidden;
    background-color: #333;
}

.navbar a {
    float: left;
    display: block;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    color: white;
    font-family: Verdana, sans-serif;
}

.navbar a:hover {
    background-color: #ddd;
    color: black;
}

.content {
    text-align: center;
    font-family: Verdana, sans-serif;
    font-size: 20px;
    width: 80%;
    margin: auto;
    padding: 0px 15px;
}


/* page d acceuil*/

.content_home p {
    text-align: center;
    margin: auto;
    width: 66.6%;
    font-size: 50px;
    padding: 0px 15px;
    font-family: Verdana, sans-serif;
}


/* page de login et creation de compte*/

.formulaire {
    font-family: Verdana, sans-serif;
    text-align: center;
    border-radius: 5px;
    background-color: #333;
    padding: 20px;
    width: 375px;
    margin: auto;
    position: relative;
    top: 80px;
}

.formulaire label {
    color: white;
}

.formulaire input {
    width: 100%;
    padding: 6px 10px;
}

.formulaire .button {
    font-family: Verdana, sans-serif;
    text-align: center;
    background-color: #6B8E23;
    border-radius: 10px;
    border: none;
    padding: 20px;
    font-size: 20px;
    font-weight: bold;
    color: white;
}

.formulaire .button:hover {
    background-color: #006400;
}

/* page de vente */

.products {
    margin-top: -850px;
    margin-right: 33%;
    margin-left: 15%;
    font-family: Verdana, sans-serif;
}

.products table {
    text-align: left;
    margin-left: 100px;
}

.formulaire_vente {
    font-family: Verdana, sans-serif;
    background-color: red;
    margin-left: 73%;
    margin-top: 15px;
    margin-right: 30px;
    margin-bottom: 10px;
    background-color: #333;
    padding: 15px;
    border-radius: 5px;
}

.formulaire_vente .sample {
    font-family: Verdana, sans-serif;
    text-align: center;
    background-color: #6B8E23;
    border-radius: 10px;
    border: none;
    padding: 20px;
    font-size: 20px;
    font-weight: bold;
    width: 100%;
    margin-top: 15px;
    color: white;
}

.formulaire_vente .sample:hover {
    background-color: #006400;
}


.formulaire_vente legend {
    color: white;
}

.formulaire_vente label {
    color: white;
}

.formulaire_vente .description {
    width 100%;
    padding: 6px 10px
}

/* apercu */
    
.apercu {
    margin-left: 40%;
    margin-top: 100px;
    font-family: Verdana, sans-serif;
    text-align: center;
}

.NewPost {
    font-family: Verdana, sans-serif;
    text-align: center;
    background-color: #6B8E23;
    border-radius: 10px;
    border: none;
    padding: 20px;
    font-size: 20px;
    font-weight: bold;
    color: white;
    margin-top: 10px;
    margin-left: 44%;
}

.NewPost:hover {
    background-color: #006400;
}


/* achat */

.products_to_buy {
    margin-top: -700px;
    margin-right: 33%;
    margin-left: 15%;
    font-family: Verdana, sans-serif;
}

.products_to_buy table {
    text-align: left;
    margin-left: 100px;
}

.products_sample {
    margin-top: 0px;
    margin-right: 33%;
    margin-left: 40%;
    font-family: Verdana, sans-serif;
}

.products_sample table {
    text-align: left;
    margin-left: 100px;
}


.achat {
    background-color: #333;
    color: white;
    font-family: Verdana, sans-serif;
    margin-top: 20px;
    margin-left: 75%;
    margin-right: 70px;
    padding: 10px;
    border-radius: 10px;
}

.achat .button {
    background-color: #6B8E23;
    font-family: Verdana, sans-serif;
    border: none;
    border-radius: 5px;
}

.achat .button:hover {
    background-color: #006400;
}

.recherche {
    font-family: Verdana, sans-serif;
    background-color: red;
    margin-left: 73%;
    margin-top: 15px;
    margin-right: 30px;
    margin-bottom: 10px;
    background-color: #333;
    padding: 15px;
    border-radius: 5px;
}

.recherche .sample {
    font-family: Verdana, sans-serif;
    text-align: center;
    background-color: #6B8E23;
    border-radius: 10px;
    border: none;
    padding: 20px;
    font-size: 20px;
    font-weight: bold;
    width: 100%;
    margin-top: 15px;
    color: white;
}

.recherche .sample:hover {
    background-color: #006400;
}


.recherche legend {
    color: white;
}

.recherche label {
    color: white;
}