

@font-face{
    font-family: 'exoThin';
    src: url('../../fonts/Exo2-0-Thin.eot');
    src: url('../../fonts/Exo2-0-Thin.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/Exo2-0-Thin.woff') format('woff'),
         url('../../fonts/Exo2-0-Thin.ttf') format('truetype'),
         url('../../fonts/Exo2-0-Thin.svg#webfont') format('svg');
}
@font-face{
    font-family: 'exoRegular';
    src: url('../../fonts/Exo2-0-Regular.eot');
    src: url('../../fonts/Exo2-0-Regular.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/Exo2-0-Regular.woff') format('woff'),
         url('../../fonts/Exo2-0-Regular.ttf') format('truetype'),
         url('../../fonts/Exo2-0-Regular.svg#webfont') format('svg');
}
@font-face{
    font-family: 'exoBold';
    src: url('../../fonts/Exo2-0-Bold.eot');
    src: url('../../fonts/Exo2-0-Bold.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/Exo2-0-Bold.woff') format('woff'),
         url('../../fonts/Exo2-0-Bold.ttf') format('truetype'),
         url('../../fonts/Exo2-0-Bold.svg#webfont') format('svg');
}





@media screen and (min-width: 420px) {

    #form_passage label.error {
        left:0;
    }

    .bouton {
        max-width:400px;
        margin-left:auto;
        margin-right:auto;
        -moz-box-sizing:border-box;
        -webkit-box-sizing:border-box;
        box-sizing:border-box;
    }

    #section_passage_client .btn_enregistrer {
        margin: 20px 0;
    }

    input, textarea, .fond, .un_acces, #nouvel_acces, #note_moyenne, #les_avis, #section_contenus #edit_contenus > form, #section_contenus #edit_contenus > .zone_galerie, #section_passage_client > div {
        max-width:400px;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    #saisie_numero_telephone {
        width:100%;
    }

    #form_promo {
        max-width:40%;
        margin:0 auto;
    }

    #section_passage_client #form_passage input[type='tel'] {
        width:100%;
    }

    #section_passage_client #form_passage input[type='tel']#nombre_produits {
        width: calc(100% - 100px);
    }

}

@media screen and (min-width: 600px) {

    #les_avis {
        max-width:1000px;
    }

    #les_avis > div {
        margin: 0 1%;
        -moz-box-sizing:border-box;
        -webkit-box-sizing:border-box;
        box-sizing:border-box;
        width:48%;
        float:left;
    }

    #les_avis > div:nth-of-type(2n+1) {
        clear:left;
    }

    #section_passage_client {
        text-align:center;
    }

    #section_passage_client > div {
        display:inline-block;
        margin: 0 0.5% !important;
        vertical-align:top;
        width:23.5%;
        text-align:left;
    }
}

@media screen and (min-width: 800px) {

    #les_avis > div {
        width:31.33%;
    }

    #les_avis > div:nth-of-type(2n+1) {
        clear:none;
    }
    #les_avis > div:nth-of-type(3n+1) {
        clear:left;
    }

    #section_contenus #edit_contenus > form, #section_contenus #arbo_libelles, #section_contenus #edit_contenus > .zone_galerie {
        width:50%;
    }

    #section_contenus #arbo_libelles {
        float:left;
        margin:0;
    }
    #section_contenus #edit_contenus > form, #section_contenus .zone_galerie {
        float:right;
        margin:0;
        -moz-box-sizing:border-box;
        -webkit-box-sizing:border-box;
        box-sizing:border-box;
        padding:0 15px;
        clear:right;
    }

    section#menu {
        height:100px;
        top:0;
    }

    section#menu nav a  {
       height:100% !important;
       width:7.1% !important;
    }
    section#menu nav a:first-of-type  {
       margin-left:0 !important;
    }

    section#menu nav a p {
        bottom:5px;
        font-size:10px;
    }
    section#menu nav a strong {
        font-size: 20px;
    }

    section#menu nav a:before {
        top:0 !important;
        margin-top:0 !important;
    }
    section#menu nav a:last-of-type:before {
        top:5px !important;
    }

    section:not(#menu) {
        padding-top:140px;
    }

    #section_compte #boutons_compte {
        display:table;
        width:100%;
    }

    #section_compte #boutons_compte .bouton {
        display:table-cell;
        width:25%;
        border:1px solid #f9f9f9;
    }

    #section_compte form fieldset {
        display:inline-block;
        vertical-align:top;
        padding:0;
    }

    #section_compte form.triple fieldset {
        width:32.9%;
    }

    #section_compte form.double fieldset {
        width:49%;
    }

    #section_compte form, #section_contenus .zone_galerie {
        margin:0 auto;
    }

    #section_compte form.double {
        max-width:900px;
    }

    #section_compte form.triple {
        max-width:1350px;
    }

    #les_acces {
        width:32%;
        float:left;
        margin-left:1%;
        margin-right:1%;
    }

    #acces_restreint form {
        float:right;
        width:66%;
    }

    #ajouter_acces {
        float:right;
        width:65%;
        margin-right:1%;
    }

}




@media screen and (min-width: 950px) {


    #section_contenus #edit_contenus > form, #section_contenus #arbo_libelles, #section_contenus #edit_contenus > .zone_galerie {
        width:33.33%;
    }

    #section_contenus #edit_contenus > form, #section_contenus .zone_galerie {
        float:left;
    }




    #section_achat_sms form > div.fond, #section_achat_sms form > div.fond:first-of-type {
        display:inline-block;
        width:27%;
        margin:0 1% !important;
        vertical-align:middle;
    }
    #section_achat_sms form > h3.grand {
        display:inline-block;
        width:3%;
        margin:0 1% !important;
        vertical-align:middle;
    }
    #section_achat_sms form > h3:not(.grand) {
        margin-top:20px;
    }

}

@media screen and (min-width: 1250px) {


    #edit_contenus {
        margin:0 auto;
    }


}

@media screen and (min-width: 1450px) {

    #les_acces {
        margin-right:0;
        width:45%;
    }
    .un_acces {
        width:47.5% !important;
        margin-right:1% !important;
        display:inline-block;
        vertical-align:top;
    }
    #acces_restreint form {
        width:54%;
    }


}

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

    #section_passage_client > div {
        width:48%;
    }

}



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


    #liste_promos {
        float: none;
        width: 96%;
        margin:20px auto;
    }

    #form_promo {
        margin:0 auto !important;
        float:none !important;
    }

}

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


    #blocs_compte label {
        font-size:14px;
    }

    .bouton {
        font-size:14px;
    }

    #section_passage_client .une_info p, #section_compte .une_info p, body {
        font-size:12px;
    }

    h2 {
        font-size:18px;
    }

    input, textarea {
        font-size:16px;
    }

}

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

    #section_passage_client > div {
        margin: 0 auto !important;
        width:100%;
    }
}

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


    #liste_factures th, #liste_promos th {
        font-size:10px;
        padding:5px;
    }

    #liste_factures td, #liste_promos td {
        font-size:10px;
        padding:5px;
    }

}

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


    #contenu_promo textarea, #form_sms_client textarea {
        width:94%;
    }

}
