@import url('https://fonts.googleapis.com/css2?family=Ubuntu');

body {
    font-size:12px;
    color:#000;
    font-family: ubuntu, arial;
    /*background-color: #696767;*/
}

.row {
    /*padding:0;*/
    margin: 0;
}

h1::first-letter {
    font-weight: bold;
    text-transform: uppercase;
    font-size:25px;
    color:#EB0029;
}

h1 {
    font-family: ubuntu, arial;
    font-size:20px;
    color:#00AA3F;
    border-bottom:2px solid #00AA3F;
    margin-bottom: 25px;
    width:200px;
}

h2 {
    font-family: ubuntu, arial;
    font-size:25px;
}

a:hover  {
    text-decoration: none;
    font-style: normal;
}

.gray {
    border-top: 1px solid lightgray;
}

.bouton {
    height:40px;
    background-color: #3ba626;
    text-align: center;
    color:#FFF;
    font-size: 20px;
    border-radius: 5px;
    padding-top:5px;
    cursor: pointer;
}

.bouton:hover {
    background-color: #696767;
}

.important {
    color:#3ba626;
    font-weight: bold;
    font-size: 35px;
}

#clear {
    clear:both;
}

/************************************** MENU ***********************************/

#menu {
    height: 42px;
    background-color: #E80025;
    padding: 5 0 5 0;
    /*position: relative;*/
    position: fixed;
    z-index: 3;
    width:100%;
    /*border-bottom: 1px solid #FFF;*/
}

#logo {

    width: 100px;
    float: left;
    margin-right: 40px;
}

#logo img {
    padding-top: 5px;
    width: 100%;
}

.menu-item {
    position: relative;
    height: 32px;
    width: 32px;
    float:left;
    margin-right: 20px;
    cursor: pointer;
    /*border: 1px solid #000;*/
}

.menu-item img {
    width:100%;
}

#nb-cart {
    position: absolute;
    width:30px;
    height:30px;
    background-color: #3ba626;
    text-align: center;
    color:#FFF;
    font-weight: bold;
    border-radius: 30px;
    top:1px;
    left:30px;
    font-size: 15px;
    padding-top:4px;
    border: 1px solid #FFF;
}

#search-bar-menu {
    width: 250px;
    float: left;
    margin-left: 100px;
    /*border: 1px solid #000;*/
}

#search-bar-menu input {
    height:25px;
    border-radius: 2px;
    border: 1px solid #696767;
    width: 100%;
    margin-top: 3px;
}

#search-bar-menu-button {

    width: 30px;
    float: left;
    margin-left: 10px;
    background-color: #696767;
    color:#FFF;
    cursor: pointer;
    text-align: center;
    padding: 4px;
    margin-top: 5px;
    font-size: 10px;
}

#search-bar-menu-button:hover {

    background-color: #FFF;
    color:#696767;
}

#shop-name-menu {
    position: absolute;
    right: 180px;
    top:2px;
    width: 300px;
    float: left;
    margin-left: 0px;
    font-family: ubuntu, arial;
    color:#FFF;
    font-size: 18px;
    /*border: 1px solid #696767;*/
    text-align: right;
}

#my-account-menu {
    position: absolute;
    right: 70px;
    width: 100px;
    height: 20px;
    float: left;
    margin-left: 100px;
    font-family: ubuntu, arial;
    font-size: 12px;
    margin-top: 5px;
    background-color: #3ba626;
    border: solid 1px #FFF;
    text-align: center;
}

#my-account-menu a {
    color:#FFF;
}

#my-account-menu:hover {
    background-color: #696767;
    cursor: pointer;
}

#log-out-menu {
    position: absolute;
    /*border: 1px solid #FFF;*/
    right: 5px;
}


/************************************** CART PREVISU ***********************************/

#cart-previsu {
    position: fixed;
    top:50px;
    left:300px;
    width: 300px;
    /*height: 250px;*/
    border: 1px solid #696767;
    background-color: #FFF;
    padding:5px;
    display: none;
    z-index: 3;
}

.cart-previsu-img {
    height:50px;
    width:20%;
    border-bottom:1px dotted lightgray;
    margin-top:5px;
    float: left;
}

.cart-previsu-img img {
    height: 45px;
    width: 45px;
    border:1px solid lightgray;
}

.cart-previsu-composition {
    height:50px;
    width:40%;
    border-bottom:1px dotted lightgray;
    margin-top:5px;
    font-size: 10px;
    padding-left: 5px;
    padding-top: 10px;
    float: left;
}

.cart-previsu-composition span {
    clear: both;
}

.cart-previsu-qty {
    height:50px;
    width:15%;
    border-bottom:1px dotted lightgray;
    margin-top:5px;
    font-size: 15px;
    text-align: center;
    padding-top: 12px;
    float: left;
}

.cart-previsu-price {
    height:50px;
    width:25%;
    border-bottom:1px dotted lightgray;
    margin-top:5px;
    font-size: 15px;
    text-align: center;
    padding-top: 12px;
    float: left;
}

/************************************** FIRST TIME LOGIN ***********************************/

#bienvenue {
    font-family: ubuntu, arial;
    font-size: 30px;
    color:#3ba626;
    text-align: center;
}

#premiere-connexion {

    font-family: ubuntu, arial;
    font-size: 20px;
    color:#000;
    text-align: center;
    margin-top:100px;
}

#nom-magasin {

    font-family: ubuntu, arial;
    font-size: 20px;
    color:#696767;
    text-align: center;
    margin-top:100px;
}

#form-first-time-login {
    /*border: lightgray 1px solid;*/
    width:50%;
    margin-left:25%;
    margin-top: 25px;
}

.form-first-time-login-txt {
    /*border: lightgray 1px solid;*/
    margin-top: 20px;
    height:30px;
    float:left;
    font-family: ubuntu, arial;
    font-size: 15px;
    color:#696767;
    width:40%;
}

.form-first-time-login-input {
    /*border: lightgray 1px solid;*/
    margin-top: 20px;
    height:30px;
    float:left;
    font-family: ubuntu, arial;
    font-size: 15px;
    color:#696767;
    width:60%;
}

.form-first-time-login-input input {
    width:100%;
}

.bouton-first-login {
    clear: both;
    width:40%;
    margin-left: 30%;
    margin-top:50px;
}

/************************************** LOGIN CHECK ***********************************/



#form-login-check {
    width:30%;
    margin-left: 35%;
    border: solid 1px #696767;
    padding: 2%;
    border-radius: 5px;
}

#icon-code-check {
    width:80px;
    margin-left: calc(50% - 40px);
    margin-bottom: 30px;
}

#icon-code-check img {
    width:100%;
}

#form-login-check h1 {
    width: 100%;
    font-size: 20px;
    text-align: center;
    margin-bottom: 30px;
}

#form-login-check p {

    width: 100%;
    font-size: 15px;
    text-align: center;
    margin-bottom: 30px;
}

#form-login-check input {
    margin-left: 30%;
    width: 40%;
    font-size: 40px;
    margin-bottom: 30px;
    color:darkblue;
    text-align: center;
}

.number-code-check {
    width:30%;
    margin-left: 1.5%;
    margin-right: 1.5%;
    background-color: #3ba626;
    float:left;
    text-align: center;
    color:#FFF;
    margin-bottom: 5px;
    height: 30px;
    font-size: 20px;
    border-radius: 5px;
    font-family: impact;
    padding-top: 1px;
}


.number-code-check img {
    height: 20px;
    margin-top:4px;
}

.number-code-check:hover {
    cursor: pointer;
}

#cadran {

    margin-left: 20%;
    width: 60%;
    height: 100px;
}

#display-code {
    text-align: center;
    color:darkblue;
    font-size: 40px;
    height:60px;
    margin-bottom: 30px;

    margin-left: 25%;
    width: 50%;
    border:solid 1px gray;
}

#contacts-bug {
    width:100%;
    margin-left:10%;
    clear: both;
    /*border:solid 1px black;*/
    margin:0;
    margin-top:250px;
}

.contacts-bug {
    float:left;
    height:300px;
    width:30%;
    margin-left:1.5%;
    margin-right:1.5%;
    /*border:solid 1px black;*/
    text-align: center;
}

.contacts-bug-col-gauche {
    width: 40%;
    float: left;
    /*border:solid 1px black;*/
}

.contacts-bug-col-gauche p {
    width: 200px;
    height:200px;
    border-radius: 100px;
    background-color: #00AA3F;
    color: #FFF;
    font-family: ubuntu;
    font-size: 22px;
    margin-left: calc(50% - 100px);
}

.contacts-bug-col-droite {
    width: 60%;
    float: left;
    /*border:solid 1px black;*/
}

.contacts-bug-col-droite p {
    height:200px;
    font-family: Ubuntu;
    font-size: 15px;
    text-align: justify;
    font-weight: 900;
}

/************************************** HOME ***********************************/

#home-menu {
    width:100%;
    /*border: 1px solid #696767;*/
    padding: 0;
    padding-bottom:200px;
}

#home-menu-name {
    width:100%;
    height: 50px;
    /*border: 1px solid #696767;*/
    padding: 0;
}

.categorie-menu-item {
    height: 130px;
    /*border: 1px solid #696767;*/
    color:#FFF;
    margin-top: 80px;
    padding-top: 2px;
    width:14.2%;
    float:left;
}

.categorie-menu-name {
    height: 20px;
    /*border: 1px solid #696767;*/
    color:#696767;
    text-align: center;
    font-weight: bold;
    width:100%;
    font-size: 18px;
}

.categorie-menu-name:hover {
    color:#000;
}

.categorie-menu-item img {
    margin-left: 25%;
    width:50%;
}

#menu-item-total-cart {
    padding-top:5px;
    font-size: 15px;
    color: #FFF;
}

#search-bar {
    /*border: 1px solid #696767;*/

}

#search {
    border: 1px solid #696767;
    width: 75%;
    height: 41px;
    float: left;
    font-family: ubuntu;
    color:#696767;
    font-size:20px;
}

#search-bar img {
    width: 40px;
    float: left;
    margin-right: 10px;
}

#search-ok {
    width:10%;
    margin-left: 2%;
    background-color:#3ba626; 
    padding:10px;
    font-size:15px;
    color:#FFF;
    text-align: center;
    float: left;
    cursor: pointer;
}

#search-ok:hover {
    background-color:#696767; 
}

/************************************** SEARCH BAR ***********************************/

#search-result {
    margin-top: 100px;
    /*border: 1px solid #696767;*/
    width: 80%;
    margin-left: 10%;
}

#search-result-nb {
    margin-top: 10px;
    /*border: 1px solid #696767;*/
    width: 80%;
    margin-left: 10%;
    font-size: 20px;
}

#search-result-txt {
    font-family: ubuntu;
    color:#3ba626; 
    font-size: 25px;
    font-weight: bold;
}

#search-result-search-txt {
    font-family: ubuntu, arial;
    color:#696767; 
    font-size: 25px;
}

/************************************** SEARCH BAR ***********************************/

#home-search {
    height:100px;
    /*background-color: lightgray;*/
    padding-top:40px;
}

#home-list {
    height:100px;
    width:40%;
    margin-left:30%;
    margin-top:20px;
    margin-bottom:50px;
    /*border:1px solid lightgray;*/
}

#home-list-select {
    height:50px;
    margin-top:25px;
    width:80%;
    margin-left: 10%;
    font-size: 30px;
    color:#696767;
    border-radius: none;
}

#home-search-content {
    height:80px;
    background-color: white;
    border: 1px solid lightgray;
    width: 80%;
    margin-left: 10%;
}

#home-search-content p, #home-search-content input {
    float: left;
}

#home-search-content p {
    margin-top:20px;
    font-size: 25px;
    margin-left: 10%;
    width:20%;
    text-align: right;
    color:#696767;
    padding-right:5px;
}

#home-search-content input {
    margin-top:20px;
    width:60%;
    height:35px;
    border:1px solid #696767;
    padding:10px;
    font-size:18px;
    color:#696767;
    text-align: center;
}

/************************************** CATEGORIE ***********************************/

#home-category {
    padding-top: 50px;
    width:150px;
    margin-left:calc(50% - 75px);
}

#home-category img {
    width:100%;
}

#home-category-title {
    text-align: center;
    font-size: 25px;
    color:#696767;
}

#home-result {
    /*border:1px solid #696767;*/
    margin-bottom:50px;
    padding-bottom:200px;
}

.home-result-item {
    /*height:400px;*/
    /*border:1px solid #696767;*/
    padding:15px;
    padding-left:30px;
    padding-right:30px;
}

.home-result-item-content {
    /*height:400px;*/
    /*border:1px solid #696767;*/
    margin-top:50px;
}

.home-result-item-img {
    /*border:1px solid #696767;*/
    width:100%;
}

.home-result-item-img img {
    width:100%;
    /*border:solid 1px #CCC;*/
}

.home-result-item-name {
    /*border:1px solid #696767;*/
    font-family: ubuntu;
    font-size: 22px;
    font-weight: bold;
    margin-top:15px;
    width:100%;
    float: left;
    /*height:30px;*/
}

.home-result-item-composition {
    /*border:1px solid #696767;*/
    height: 200px;
    width:100%;
    font-size: 15px;
}

.home-result-item-price {
    font-size: 35px;
    font-weight: bold;
    color:#3ba626;
    width:70%;
    float:left;
}

.home-result-item-button {
    height: 40px;
    background-color: #E80025;
    font-size: 25px;
    color:#FFF;
    text-align: center;
    padding:7px;
    width:30%;
    float:left;
    border-radius: 5px;
}

.home-result-item-button:hover {
    background-color: #696767;
}

.cadre-home-result-red-circle {
    height:200px;

    /*border:solid 1px black;*/
}

.home-result-red-circle {
    width:150px;
    height:150px;
    background-color: red;
    color:#FFF;
    border-radius: 100px;
    float:left;
    text-align: center;
    font-size: 35px;
    font-weight: bold;
    margin-top:70px;
    margin-right: 20px;
    cursor: pointer;

}

.home-result-red-circle-2 {
    margin-right: 200px;
}

.home-result-red-circle a {
    color:#FFF;
}

.home-result-red-circle-txt {
    width:150px;
    height: 150px;
    font-size: 25px;
    padding-right: 5px;
    padding-left: 5px;
    text-align: center;

    display: table-cell;
    vertical-align: middle;
}

.home-result-red-circle-small-txt {
    height: 150px;
    width:150px;
    font-size: 17px;
    padding-right: 5px;
    padding-left: 5px;

    display: table-cell;
    vertical-align: middle;
}

/************************************** KIT VERSION ***********************************/

#kit-version {
    padding-bottom: 200px;
}

.kit-version {
    /*height:1000px;*/
    /*border:1px solid #696767;*/
    margin-top:20px;
    margin-bottom:20px;
}

.kit-version h2 {
    margin-left: 120px;
}

.kit-version-img img {
    margin-left:5%;
    width:90%;
}

.kit-version-nom-kit {
    margin-left:5%;
    margin-top:15px;
    width:45%;
    float:left;
    font-family: ubuntu, arial;
    font-size: 18px;
}

.kit-version-metre-kit {
    margin-left:5%;
    width:45%;
    float:left;
    font-family: ubuntu, arial;
    font-size: 35px;
}

#kit-version-content {
    margin-left:8.33%;
    width:91%;
}

#kit-version-content h2 {
    margin:0;
}

/************************************** PRODUCT ***********************************/

#product {
    padding-top:0px;
    padding-bottom:200px;
}

#product-image {
    /*border: solid 1px #000;*/
}

#product-description {
    /*border: solid 1px #000;*/
    margin-bottom: 100px;
}

#product-image-content {
    position: relative;
    border: 1px solid lightgray;
    text-align: center;
    width:100%;
}

#product-image-content img {
    width:100%;
}

#product-image-zoom {
    position: absolute;
    bottom:10px;
    left:calc(50% - 20px);
    /*border: solid 1px #000;*/
    text-align: center;
    font-size: 20px;
    color:#FFF;
    margin:auto;
}

#product-image-zoom-button {
    margin-top: 10px;
    background-color: #3ba626;
    width: 40px;
    height: 40px;
    margin-left: calc(50% - 25px);
    border-radius: 40px;
    padding-top: 8px;
}

.galerie-image-bloc {
    width:19%;
    margin-right:1%;
    float: left;
    margin-top:10px;
    margin-bottom:10px;
    border:1px solid lightgray;
}

.galerie-image-bloc img {
    width: 100%;
}

.galerie-image-bloc img:hover {
    cursor: pointer;
}

#product-image-zoom-button:hover {
    cursor: pointer;
    background-color: #696767;
}

#product-description-name {
    height:50px;
    /*border: solid 1px #000;*/
    padding-top:8px;
    font-size: 25px;    
}

#composition-du-kit {
    font-family: ubuntu, arial;
    font-size: 35px;
    margin-bottom: 40px;
}

.product-description-planogramme {
    /*border: solid 1px #000;*/
    height:250px;
    width:60%;
    float: left;   
}

.product-description-planogramme-long {
    /*border: solid 1px #000;*/
    height:500px;
    width:60%;
    float: left;   
    font-weight: 300;
}

.product-description-planogramme-name {
    /*border: solid 1px #000;*/
    padding-top:8px;
    font-size: 15px;    
}

.product-description-planogramme-composition {
    /*border: solid 1px #000;*/
    padding-top:3px;
    font-size: 18px;    
}

.product-description-qty {
    height:75px;
    /*border: solid 1px #000;*/
    font-size: 50px;  
    color:#3ba626;       
    padding-top: 5px;
    width:40%;
    float: left;   
}

#product-description-planogramme-qty-texte-left {
    float: left; 
    width:60%; 
    height:30px; 
    /*border:solid 1px black;*/
}

#product-description-planogramme-qty-texte-right {
    float: left; 
    /*border: solid 1px #000;*/
    height: 30px;
    font-size: 18px;
    text-align: center;
    width:40%;
}   

.product-description-qty-texte {
    /*border: solid 1px #000;*/
    width:100%;
    font-size: 15px;
    color:#000;
    margin-bottom: 5px;
    text-align: center;
}

.product-description-qty-minus, .product-description-qty-plus {
    /*border: solid 1px #000;*/
    width:30%;
    float: left;
    text-align: center;
    font-size: 25px;
    color:#000;
    margin-top:3px;
}

.product-description-qty-minus {
    margin-left:5%;
}

.product-description-qty-minus:hover, .product-description-qty-plus:hover {
    cursor: pointer;
    color:#3ba626;
}

.product-description-qty-nb {
    width:30%;
    height:40px;
    float: left;
    text-align: center;
    font-size: 25px;
    background-color:#3ba626;
    color:#FFF;
    border-radius: 40px;
    padding-top: 2px;
}

#product-description-price {
    margin-top:50px;
    height:75px;
    /*border: solid 1px #000;*/
    font-size: 50px;  
    color:#3ba626;      
    width:90%;
    text-align: right;
    padding-right:50px;
    float: left;   
}

#product-description-ht {
    width:10%;
    color:#000;
    font-size: 14px;
    padding-top:90px;
    text-align: left;
    float: left;   
}

#product-description-frais-de-port {
    width:100%;
    color:#000;
    font-size: 12px;
    margin-bottom:20px;
    clear: both;   
    text-align: right;
}

#product-description-support {
    width: 100%;
}

#product-description-plv {
    background-color: #DEDEDE; 
    /*border-radius: 5px;*/
    width: 100%;
}

#product-description-support {
    /*border: solid 1px #000;*/
    padding-top:10px;
    font-size: 25px; 
    color:#FFF;           
    clear: both;
    margin-bottom: 50px;
}

#product-description-no-support {
    height:100px;
    /*border: solid 1px #000;*/
    clear: both;
}

.product-description-support-texte {
    height:25px;
    /*border: solid 1px #000;    */
    color:#000;
    font-size: 15px;
    padding-left: 15px;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 10px;
}

.product-description-support-help {
    height:20px;
    /*border: solid 1px #000;    */
    color:#FFF;
    font-size: 15px;
    padding-left: 15px;
    font-weight: bold;
    margin-bottom: 10px;
    background-color: #990000;
    visibility: hidden;
}

.product-description-support-composition, .product-description-support-le-comptoir {
    height:35px;
    /*border: solid 1px #000;    */
    color:#000;
    font-size: 15px;
    padding-left: 15px;
    float: left;    
}

.product-description-support-le-comptoir {
    width:100%;
}

.product-description-support-composition {
    width:78%;
    margin-bottom: 20px;
}

.product-description-support-composition-texte {
    font-family: ubuntu;
    /*font-size: 15px;*/
    line-height: 25px;
}

.product-description-support-le-comptoir {
    margin-top: 20px;
    margin-bottom: 10px;
    color:#3ba626;
}

.product-description-support-le-comptoir p {

    float:left;
    font-size: 14px;
    margin-right: 10px;
}

.product-description-support-le-comptoir img {

    width:100px;
    float:left;
    margin-right: 10px;
}

.product-description-support-composition-2 {
    height:35px;
    width:22%;
    float: left;    
    /*border: solid 1px #000;  */
    padding-top:12px;
}

.product-description-support-button {
    color:#FFF;
    font-size: 18px;
    width:80%;
    height:40px;
    margin-left: 10%;
    text-align: center;
    background-color:#3ba626;
    padding-top:7px;
}

.product-description-support-button:hover {
    cursor: pointer;
    background-color:#696767;
}

#product-description-plv {
    margin-top:10px;
    /*border: solid 1px #000;*/
    height: 150px;
    padding-top:10px;
    font-size: 25px; 
    color:#FFF;           
}

#checked_support, #checked_plv {
    height: 45px;
    background-image: url(../picto/checked.png);
    background-repeat: no-repeat;
    background-size: 40px 40px;
    background-position: top center;
    display: none;
}

#checked_support:hover, #checked_plv:hover {
    /*background-image: url(../picto/cancel.png);*/
    cursor: pointer;
}

.product-description-support-minus {
    height:20px;
    width:35%;
    color:#000;
    text-align: center;
    /*border: solid 1px #000;*/
    font-size: 25px;
    line-height: 15px;
    float: left;
}

.product-description-support-minus:hover {
    cursor: pointer;
}

.product-description-support-qty {
    height:20px;
    width:30%;
    color:#FFF;
    background-color: #3ba626;
    border-radius: 20px;
    text-align: center;
    font-size: 15px;
    float: left;
}

#product-description-cart {

    height:100px;
    padding-top:40px;
    font-size: 15px;      
}

#product-description-cart-button {
    width:30%;
    height:50px;
    margin-left: 35%;
    background-color: #E80025;
    color:#FFF;
    text-align: center;
    font-size: 25px;
    padding-top:7px;
    border-radius: 5px;
}

#product-description-cart-button span {
    margin-right:10px;
}

#product-description-cart-button:hover {
    cursor: pointer;
    background-color: #696767;
}

#product-order-supplier {
    color:#000;
    font-size: 18px;
    /*border: solid 1px black;*/
    margin-top: 40px;
    clear: both;
}

#previsualisation {
    position: fixed;
    top: 50px;
    left:5%;
    width:90%;
    border:1px solid #696767;
    background-color: #FFF;
    z-index: 2;

    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;

    display: none;
}

#previsualisation-cross {
    position: fixed;
    top: 55px;
    right:calc(5% + 10px);
    z-index: 3;
    font-size: 50px;
    color:#696767;
}

#previsualisation-cross:hover {
    cursor: pointer;
}

#shipping-text {
    /*border:solid 1px #000;*/
    margin-bottom: 15px;
    color:#696767;
    font-style: italic;
    font-family: arial;
    display: none;
}

#caracteres_restants {
    width: 100%;
    height:20px;
    clear: both;
    color: green;
}

#comment {
    width: 100%;
    height:100px;
}

/************************************** VENDEURS MUETS ***********************************/

.prix-unitaire {
    font-size: 15px;
}

/************************************** SUCCESS ***********************************/

#success {
    padding-top:100px;
}

#success-img {
    /*border-top: 1px solid lightgray;*/
    /*border-left: 1px solid lightgray;*/
    /*border-bottom: 1px solid lightgray;*/
    padding:5px;
    width:25%;
    height: 110px;
    float:left;
    text-align: center;
}

#success-img img {
    height: 100px;
    width: 100px;
    border:solid 1px lightgray;
}

#success-text {
    text-align: center;
    /*border-top: 1px solid lightgray;*/
    /*border-right: 1px solid lightgray;*/
    /*border-bottom: 1px solid lightgray;*/
    width:75%;
    height: 110px;
    font-size: 25px;
    padding-top:26px;
    padding-left:10px;
    padding-right:10px;
    float:left;
}

.success-buttons {
    margin-top:10px;
    /*border:solid 1px black;*/
    height: 50px;
}

.success-button {
    width:80%;
    background-color: #3ba626;
    color:#FFF;
    font-size: 20px;
    padding-top: 10px;
    height: 50px;
    margin-left:10%;
    border-radius: 5px; 
    height: 50px;
    text-align: center;
}

.success-button:hover {
    background-color: #696767;
    cursor: pointer;
}

/************************************** ACCOUNT ***********************************/

#account {
    padding-top:100px;
    padding-bottom: 200px;
}

#account-title {
    /*border: 1px solid black;*/
    height:50px;
    text-align: center;
    font-size: 25px;
    padding-top:7px;
}

#account-form {
    /*border:solid 1px black;*/
    width:50%;
    margin-left: 25%;
    margin-top: 50px;
    height: 600px;
}

.ligne-account-form {
    /*border:solid 1px black;*/
    width:100%;
    margin-bottom: 20px;
    height: 50px;
}

.txt-account-form {
    float: left;
    width:30%;
    text-align: left;
    height:50px;
    padding-top: 3px;

    font-family: ubuntu, arial;
    font-size: 20px;
}

.input-account-form {
    float: left;
    width:70%;
    height:50px;
    
}

.input-account-form input {
    width:100%;
    height: 35px;
    font-family: arial;
    font-size: 20px;
    color:darkblue;
}

.bouton-new-account {
    width: 50%;
    margin-left: 25%;
}

/************************************** CART ***********************************/

#cart {
    padding-top:100px;
    padding-bottom: 200px;
}

#cart-title {
    /*border: 1px solid black;*/
    height:50px;
    text-align: center;
    font-size: 25px;
    padding-top:7px;
}

#cart-title2 {
    /*border: 1px solid black;*/
    height:50px;
    text-align: center;
    font-size: 25px;
    padding-top:7px;
    margin-top:20px;
}

#cart-title3 {
    /*border: 1px solid black;*/
    height:50px;
    text-align: center;
    font-size: 25px;
    padding-top:7px;
    margin-top:20px;
}

.cart-img {
    background-color: lightgray;
    height:100px;
    margin-top: 25px;
    text-align: center;
    padding:5px;
}

.cart-img img {
    height: 100%;
}

.cart-img-square {
    width:90px;
    height :90px;
    background-color: #FFF;
}

.cart-composition {
    background-color: lightgray;
    height:100px;
    margin-top: 25px;
    text-align: justify;
    padding:5px;
}

.cart-price {
    background-color: lightgray;
    height:100px;
    margin-top: 25px;
    text-align: right;
    padding:5px;
    padding-top:37px;
    font-size: 15px;
}

.cart-delete {
    background-color: lightgray;
    height:100px;
    margin-top: 25px;
    text-align: center;
    padding:5px;
    padding-top:35px;
    font-size: 25px;
}

.cart-delete a {
    color: #E80025;
}

.cart-delete a:hover {
    color: #696767;
    cursor: pointer;
}

.cart-composition-name {
    font-size: 15px;
    padding-top:20px;
}

.cart-composition-name a {
    color:#000;
}

.cart-composition-support {
    width:200px;
    margin-top:5px;
    padding:5px;
    background-color: #696767;
    color:#FFF;
}

.cart-composition-name2 {
    font-size: 15px;
    padding-top:40px;
    padding-left: 10px;
}

.fa-check {
    margin-top:2px;
    float:right;
}

#cart-total {
    height:30px;
    margin-top: 25px;
    text-align: right;
    padding:5px;
    padding-top:35px;
    padding-right:8%;
    font-size: 15px;
    color:#696767;
}

#cart-total-shipping {
    height:150px;
    margin-top: 25px;
    text-align: right;
    padding:5px;
    padding-top:35px;
    padding-right:8%;
    font-size: 20px;
    color:#3ba626;
}

#cart-shipping-text {
    height:20px;
    text-align: right;
    padding-right:15%;
    font-size: 12px;
    color:#000;
    font-style: normal;
}

#cart-total-number {
    font-size: 25px;
}

#cart-total-shipping-number {
    font-size: 35px;
}

#cart-empty {
    height:100px;
    margin-top: 25px;
    text-align: center;
    padding:5px;
    padding-top:35px;
    font-size: 20px;
    color:#696767;
}

#cette-commande-vaut-acceptation {

    margin-top: 100px;
    text-align: center;
}


/************************************** BIND ORDER ***********************************/

#bind-order {
    padding-top:150px;
    padding-bottom: 200px;
}

#bind-order-text {
    width: 35%;
    height: 50px;
    padding-top: 5px;
    float: left;
    font-family: ubuntu, arial;
    font-size: 25px;
    /*background-color: lightgray;*/
    text-align:right;
}

#bind-order-input {
    width: 65%;
    height: 50px;
    float: left;
    /*background-color: gray;*/
}

#bind-order-input select {
    width: 50%;
    height: 50px;
    margin-left: 25%;
    font-family: lato, arial;
    font-size: 25px;
}

#bind-and-quit, #bind-and-sent {
    padding-top: 200px;
    height: 250px;
    width: 50%;
    float: left;
    /*background-color: lightgray;*/
}

#bind-and-quit-button, #bind-and-sent-button {

    width: 40%;
    height: 50px;
    margin-left: 30%;
    background-color: #00AA3F;
    border-radius: 5px;
    color: #FFF;
    font-family: ubuntu, arial;
    font-size: 20px;
    text-align: center;
    padding-top: 10px;
}

#bind-and-quit-button:hover, #bind-and-sent-button:hover {

    cursor: pointer;
    background-color: #696767;
}

#space {
    height: 100px;
    width: 100%;
}

/************************************** SHOP ***********************************/

#modify-shop {

    margin-top: 25px;
}

#info-shop {
    margin-top: 10px;
    /*border:solid 1px black;*/
}

.info-shop-line {
    height: 35px;
    /*border:solid 1px black;*/
}

.info-shop-txt {
    width: 15%;
    height: 35px;
    float: left;
    font-family: ubuntu, arial;
    font-size: 15px;
    /*border:solid 1px black;*/
}

.info-shop-txt2 {
    width: 85%;
    height: 35px;
    float: left;
    font-family: ubuntu, arial;
    font-size: 15px;
    /*border:solid 1px black;*/
}

#shop {
    padding-top:100px;
    padding-bottom: 200px;
}

#shop-account {
    font-family: ubuntu, arial;
    font-size: 25px;
    text-align: center;
}

.shop-cart-count {
    font-family: ubuntu, arial;
    font-size: 25px;
    margin-bottom: 75px;
    margin-top: 100px;
}

.shop-cart-saved {
    color:#FFF;
    font-size:20px;
    padding:7px;
}

.shop-cart-saved-title {
    padding:10px;
}

.shop-cart-saved-number {
}

.shop-cart-saved-date {
}

.shop-cart-saved-amount {
    text-align:right;
}

.shop-cart-saved-cart-in {
    text-align:center;
    font-size: 28px;
}

.shop-cart-saved-cart-in:hover, .shop-cart-saved-show:hover {
    cursor: pointer;
} 

.shop-cart-saved-show {
    text-align:center;
    font-size: 28px;
}

.shop-cart-saved-show a {
    color:#FFF;
}

.shop-cart-saved-cart-in a {
    color:#FFF;
}

.shop-cart-saved-content {
    padding:10px;
    display: none;
}

.shop-cart-saved-content-line {
    color:#000;
    font-size:18px;
    padding:7px;
/*    border-top: solid 1px lightgray;
    border-bottom: solid 1px lightgray;*/
}

.shop-cart-saved-content-line-plv {
    color:#696767;
    font-size:14px;
    padding:2px 7px 2px 7px;
}

.shop-cart-left {
    text-align: right;
}

.panierEnCours {
    background-color: #3ba626;
}

.commandePassee {
    background-color: #696767;
}

/************************************** MESSAGE SENT ***********************************/

#message-sent {
    /*border:solid 1px #000;*/
    height:50px;
    font-size:25px;
    color:#3ba626;
    text-align: center;
    padding-top: 7px;
}

#message-sent-picture {    
    /*border:solid 1px #000;*/
    height:150px;
    text-align: center;
    padding-top:50px;
}

#message-sent-texte {
    /*border:solid 1px #000;*/
    height:30px;
    font-size:15px;
    color:#696767;
    text-align: center;
    padding-top: 5px;

}

/************************************** LOG ***********************************/

#log {
    margin-top: 0px;
    padding-top:100px;
    height:1000px;
    /*background-image: url(../picto/background-login.png);*/
    background-size: 70%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: 100% 150px;
}

.rond {
    margin-bottom: 75px;
    text-align: center;
    width:400px;
    margin-left: calc(50% - 200px);
}

.rond img {
    width: 100%;
}

.log-txt-input {
    width: 30%;
    height: 150px;
    margin-left: 35%;
    /*border:solid 1px black;*/
}

.log-txt-input-2 {
    width: 30%;
    height: 100px;
    margin-left: 35%;
    /*border:solid 1px black;*/
}

#choisissez-enseigne {
    font-size: 35px;
    text-align: center;
    margin-bottom: 20px;
    font-family: ubuntu;
}

#logoMB, #logoLC {
    float: left;
    margin-bottom: 20px;
    width: 40%;
    margin-left: 5%;
    margin-right: 5%;
    text-align: center;
    cursor: pointer;
}

#logoMB img, #logoLC img{
    width:100%;
}

.log-txt {
    width:30%;
    font-size: 20px;
    height:50px;
    text-align: right;
    float: left;
    /*border:solid 1px black;*/
}

.log-input {
    width:68%;
    height:50px;
    padding-left: 15px;
    float: left;
    /*border:solid 1px black;*/
}

.log-input input {
    width:100%;
    height:30px;
    font-size: 20px;
}

.log-input select {
    width:100%;
    height:30px;
    font-size: 20px;
}

.bouton-log {
    width:50%;
    margin-left: 25%;
    clear: both;
}

#no-account {
    text-align: center;
    margin-top:100px;
    font-size: 20px;
    clear: both;
}

#log-error {
    height:37px;
    background-color: #E80025;
    margin-bottom:50px;
    color: #FFF;
    font-size: 20px;
    text-align: center;
    width:40%;
    margin-left: 30%;
    border-radius: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

@media screen and (max-width: 1300px) {

    .log-txt-input {
        width: 40%;
        margin-left: 30%;
    }

    #account-form {
        width:60%;
        margin-left: 20%;
    }

    #home-menu {
        height: 1300px;
    }

    .categorie-menu-item {
        margin-top: 60px;
        margin-bottom: 60px;
        width:32%;
    }

    .categorie-menu-name {
        font-size: 20px;
    }

    #home-search-content p {
        margin-left: 0%;
        width:30%;
    }

    #home-search-content input {
        width:60%;
    }

    .product-description-support-composition {
        padding-top: 7px;
        font-size: 11px;
    }

    .home-result-item-name {
        font-size: 18px;
    }

    #success-text {
        font-size: 20px;
        padding-top:35px;
    }

    .important {
        font-size: 30px;
    }

    .success-button {
        width:80%;
        margin-left:10%;
    }
}

@media screen and (max-width: 1050px) {

    #menu {
        height: 80px;
    }

    #shop-name-menu {
        top:38px;
    }

    #my-account-menu {
        top:38px;
    }

    #log-out-menu {
        top:35px;
    }


    #form-login-check {
        width:80%;
        margin-left: 10%;
        margin-top: 30px;
    }

}

@media screen and (max-width: 991px) {
    
    #form-first-time-login {
        width:90%;
        margin-left:5%;
        margin-top: 25px;
    }

    #log {
        height: 750px;
    }
    
    .log-txt-input {
        width: 50%;
        margin-left: 25%;
    }

    #account-form {
        width:90%;
        margin-left: 5%;
    }

    .categorie-menu-item img {
        margin-left: 10%;
        width:80%;
    }

    #home-search-content p {
        font-size: 15px;
        margin-top: 28px;
    }

    #home-menu {
        height: 1500px;
    }

    #home-list {
        width:80%;
        margin-left:10%;
    }

    #home-list-select {
        width:80%;
        margin-left: 10%;
    }

    .categorie-menu-item {
        margin-bottom: 100px;
    }

    .categorie-menu-name {
        font-size: 20px;
    }

    .product-description-support-composition {
        padding-top: 10px;
        font-size: 10px;
    }

    #nom_prenom {
        padding-top: 5px;
        font-size: 12px;
    }

    .home-result-item-name {
        font-size: 20px;
    }

    #kit-version {
        margin-left: 0px;
        text-align: center;
    }

    #kit-version h2 {
        margin-left: 0;
    }

    #log-error {
        width:80%;
        margin-left: 10%;
    }

    #cadran {
        margin-left: 30%;
        width: 40%;
    }
}

@media screen and (max-width: 765px) {

    .contacts-bug {
        width:90%;
        margin-left:5%;
        margin-right:5%;
        margin-bottom: 30px;
    }

    #shop-name-menu {
        font-size: 15px;
        padding-top: 5px;
    }

    #log {
        height: 650px;
    }

    .log-txt-input {
        width: 90%;
        margin-left: 5%;
    }

    #account-form {
        width:100%;
        margin-left: 0;
    }

    .menu-item {
        margin-right: 10px;
        /*border: 1px solid #000;*/
    }

    #search-bar-menu {
        margin-left: 30px;
        width: 150px;
        /*border: 1px solid #000;*/
    }

    #search {
        width: 60%;
    }

    #search-ok {
        width:20%;
    }

    .bouton-log {
        width:30%;
        margin-left: 35%;
    }

    #home-category {
        padding-top: 100px;
    }

    #home-category-title {
        padding-top: 120px;
    }

    .log-input input {
        width:100%;
    }

    .log-input select {
        width:100%;
    }

    .log-txt-input-2 {
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
    }

    .log-txt {
        width:35%;
    }

    .log-input {
        width:65%;
    }


    #home-menu {
        height: 2500px;
    }

    #home-menu-name {
        display: none;
    }

    #home-category {
        height:90px;
    }

    #home-list {
        width:90%;
        margin-left:5%;
    }

    #home-list-select {
        width:90%;
        margin-left: 5%;
    }

    .categorie-menu-item {
        margin-bottom: 50px;
        width:50%;
    }

    .product-description-support-composition {
        padding-top: 7px;
        font-size: 12px;
    }

    .product-description-planogramme {
        height:250px;
    }

    .product-description-planogramme-long {
        height:350px;
    }

    #product-description-cart-button {
        width:90%;
        margin-right: 5%;
        margin-left: 5%;
    }

    #success-text {
        font-size: 18px;
        padding-top:37px;
    }

    .important {
        font-size: 25px;
    }

    #nom_prenom {
        padding-top: 7px;
        font-size: 10px;
    }

    #cadran {

        margin-left: 20%;
        width: 60%;
    }

    .cart-composition-name2 {
        padding-top: 20px;
    }

    #cart-title, #cart-title2 {
        height:100px;
    }
}

@media screen and (max-width: 650px) {



    #choisissez-enseigne {
        font-size: 18px;
    }
    
    .form-first-time-login-txt {
        width:50%;
    }

    .form-first-time-login-input {
        width:50%;
    }

    #cart-previsu {
        left:150px;
        width: 300px;
    }

    #home-menu {
        height: 2000px;
    }

    #menu-item-total-cart {
        font-size: 10px;
        padding-top:10px;
    }

    .categorie-menu-item {
        padding-top: 20px;
    }

    .categorie-menu-item {
        margin-top: 50px;
    }

    #home-search-content {
        width: 96%;
        margin-left: 2%;
    }

    .home-result-item {
        padding-left:15px;
        padding-right:15px;
    }

    #product-image-content {
        min-height: 50px;
    }

    .cart-composition-name {
        font-size: 12px;
    }

    .cart-composition-support {
        width:100px;
    }

    .cart-price {
        padding-top:40px;
        font-size: 12px;
    }

    .shop-cart-saved {
        font-size:12px;
        height: 55px;
    }

    .shop-cart-saved-content-line {
        font-size:14px;
    }

    .shop-cart-saved-content-line-plv {
        font-size:12px;
    }

    .shop-cart-saved-cart-in {
        font-size: 21px;
    }

    .shop-cart-saved-show {
        font-size: 21px;
    }

    .info-shop-txt {
        width: 30%;
    }

    .info-shop-txt2 {
        width: 70%;
    }

}

@media screen and (max-width: 570px) {

    .product-description-planogramme {
        height:350px;
    }

    .product-description-planogramme-long {
        height:450px;
    }

    #menu-item-total-cart {
        display: none;
    }

    #cadran {

        margin-left: 10%;
        width: 80%;
    }
}

@media screen and (max-width: 500px) {


    #search-bar-menu {
        width: 100px;
        margin-left: 10px;
    }

    .bouton-log {
        width:80%;
        margin-left: 10%;
    }

    #nom_prenom span {
        display: none;
    }

    #cart-previsu {
        left:10px;
        width: calc(100% - 10px);
    }

    #home-search-content p {
        font-size: 12px;
        margin-top: 30px;
    }


    #search-bar-menu {
        display: none;
    }

    #search-bar-menu-button {
        display: none;
    }
}
