/*
    Feuille de style pour les pages ESAS
 */

/*
    Nos styles
 */

body.esas {
    padding: 60px 0;

    a {
        color: #182b55;
        text-decoration: none;
    }

    h1 {
        padding-bottom: 30px;
    }

    h2 {
        padding-bottom: 20px;
    }

    .form-group + .form-group buttonf[type=submit] {
        margin-top: 30px;
    }

    div.form-action {
        margin-top: 2rem;
    }

    /*
        Pour les formulaires qui sont dans un tableau
     */

    .form-group + table.table-quizz {
        margin-top: 60px;
    }

    table.table-quizz {
        margin-bottom: 60px;

        thead {
            th {
                text-align: center;

                &.question {
                    text-align: left;
                }

            / / hyphens: auto;
            }
        }

        tbody {
            th {
                font-weight: normal;
            / / On enlève le bold width: 60 %;
            / / On normalise leur taille
            }

            td {
                width: 10%;
            / / On normalise leur taille text-align: center;

                label {
                    display: none;
                    margin-bottom: 0;
                }
            }
        }

    / / On affiche différement sur mobile @media screen and (max-width: 767 px) {
    / / On ne veut plus de tableau (plus de colonnes) &, tbody, thead, tr, th, td {
        display: block;
    }

        thead {
            th.option {
                display: none;
            }
        }

        tbody {
            th {
                width: 100%;
            }

            td {
                width: 100%;
                padding-left: 30px;
                text-align: left;

                label {
                    display: inline-block !important;
                    margin-bottom: .5rem;
                }
            }
        }
    }
    }

    table.table-consommation {
        margin-bottom: 60px;

        thead {
            th {
                text-align: center;
            }
        }

        tbody {
            label {
                display: none;
            }
        }

    / / On affiche différement sur mobile @media screen and (max-width: 767 px) {
    / / On ne veut plus de tableau (plus de colonnes) &, tbody, thead, tr, th, td {
        display: block;
    }

        thead {
            display: none;
        }

        tbody {
            th {
                width: 100%;
            }

            td {
                width: 100%;
                padding-left: 30px;
                text-align: left;

                label {
                    display: inline-block !important;
                }
            }
        }
    }
    }

    .step-help {
        font-style: italic;
        margin-bottom: 30px;
    }


    .btn {
        margin-bottom: 1rem;
    }

    .explain {
        color: gray;
        font-style: italic;
    }

    .logo_store {
        height: 50px;
        margin-top: 1rem;
        margin-right: 1rem;
    }


}