html, body, h1, h2, h3, h4, h5 {font-family: "Open Sans", sans-serif}

tr.article-row {
  cursor: pointer;
}
tr.article-row:hover td {
  background: #f1f1f1;
}


#monBouton {
    background-color: transparent;
    color: #000000;     /* Couleur du texte */
    padding: 5px 5px;   /* Espacement du texte à l'intérieur du bouton */
    border: none;       /* Supprime le bord du bouton */
    cursor: pointer;    /* Curseur de la souris en forme de main au survol */
}

#loginForm {
    width:360px;
    margin:auto;
    margin-top:40px;
}

#loginForm form {
    padding: 30px;
    border: 1px solid #f1f1f1;
    background: #fff;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
    text-align: left;
    color: black;
}

#loginForm input[type=text], input[type=password] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

#loginForm input[type=submit] {
    background-color: #18344d;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
}

#loginForm input[type=submit]:hover {
    background-color: white;
    color: #18344d;
    border: 1px solid #18344d;
}


/* Google Sing-in button */
.google-sign-in-button {
    cursor: pointer;
    transition: background-color .3s, box-shadow .3s;
        
    padding: 12px 16px 12px 42px;
    border: none;
    border-radius: 3px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .25);
    
    color: #757575;
    font-size: 14px;
    font-weight: 500;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
    
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=);
    background-color: white;
    background-repeat: no-repeat;
    background-position: 12px 11px;
}

.google-sign-in-button:hover {
    box-shadow: 0 -1px 0 rgba(0, 0, 0, .04), 0 2px 4px rgba(0, 0, 0, .25);
}

.google-sign-in-button:active {
    background-color: #eeeeee;
}

.google-sign-in-button:active {
    outline: none;
        box-shadow: 
        0 -1px 0 rgba(0, 0, 0, .04),
        0 2px 4px rgba(0, 0, 0, .25),
        0 0 0 3px #c8dafc;
}

.google-sign-in-button:disabled {
    filter: grayscale(100%);
    background-color: #ebebeb;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .25);
    cursor: not-allowed;
}

.container {
    display: flex;
}

.box {
    flex: 1;
}

.box a {
    height: 100%;
    vertical-align: middle;
}

/* Rendre les tableaux responsive sur smartphone */
@media screen and (max-width: 768px) {
    table.responsive-table {
        width: 100%;
        table-layout: fixed; /* Force le tableau à respecter sa largeur */
        word-wrap: break-word; /* Coupe les mots trop longs */
        white-space: normal; /* Force le retour à la ligne automatique */
    }

    table.responsive-table td,
    table.responsive-table th {
        word-wrap: break-word;
        overflow-wrap: break-word;
        white-space: normal;
        padding: 8px; /* Optionnel pour améliorer l’espacement */
    }

    /* Ajuste également les images dans les cellules du tableau */
    table.responsive-table img {
        max-width: 100%;
        height: auto;
    }
}

button, input[type='submit'], input[type='button'] {
    white-space: normal;
    word-break: break-word;
    max-width: 100%;
    box-sizing: border-box;
}

ccro-color,.ccro-hover-color,:hover{border-color:#0f1e2c!important}