/* 

                            imaginesite.fr css file



*/

.topnav {

    font-weight: bold;

    font-size: 0.8em;

    color: white;

    background-color: rgba(20, 50, 60, 0.5);;

    border: 0px #00009C solid;

    padding: 0.5em;

}

.display-block {

    border: 2px solid gray;

    border-radius: 2px;

}





#filariane a:link,

#filariane a:visited,

#filariane a:hover,

#filariane a:active{

    color:white;

}

/*

#idgrad {

    height: auto;

    background-color: #cccccc;

    background-image: linear-gradient(gray, white, gray);

}

*/

.hero-image {
    background-image: url("../image/body.png");
    background-color: #cccccc;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    height: auto;

}





.id_grad {

    height: auto;

    width: auto;

    background-image: radial-gradient(white, black);

}





.head-style {

    /*

        margin: 1rem 1rem 1rem 1rem;

        padding: 0.25rem 0.25rem 0.25rem 0.25rem;

    */

    color: black;

    font-size: 135%;

    font-weight: bold;

}



.head-is-01 {

    color: black;

    font-size: 50%;

    font-weight: bold;

}



.head-is-06 {

    color: #1d2124;

    font-size: 70%;

    font-weight: bold;

}



.is-header{

    margin-top: 1rem;

}



.is-default-width {

    max-width: 100rem;

    /* permet de centrer*/

    margin-right: auto;

    margin-left: auto;

}





.is-padding-all {

    padding: 1rem;

}



.is-width-welcome {

    /* On ajoute une marge sur les cotés de l'écran

    padding-right: 1rem;

    padding-left: 1rem;

    /* Et on centre

    margin-top: 1rem;

    margin-bottom: 1rem;

    margin-right: auto;

    margin-left: auto;

    */

    max-width: 50rem;

    margin-right: auto;

    margin-left: auto;

}





.col-centered {

    float: none;

    margin: 0 auto;

}



.middle {

    margin-right: auto;

    margin-left: auto;

}



.choice {

    max-width: 200px;

}



.vertical-center {

    min-height: 100%; /* Fallback for browsers do NOT support vh unit */

    min-height: 100vh; /* These two lines are counted as one 🙂       */

    display: flex;

    align-items: center;

}



.image-container {

    /* On ajoute une marge sur les cotés de l'écran */

    padding-top: 0.4rem;

    padding-bottom: 0rem;

    padding-right: 0.1rem;

    padding-left: 0.1rem;



    /* Et on centre */

    margin-right: auto;

    margin-left: auto;

}



/*

.panel-default{

    margin: 0.5rem;

    width: 100%;

}

*/



.is-card {
    margin: 0.5rem;
}

.is-card-video {
    padding: 0.1rem;
    margin: .5rem 2rem 2rem 2rem;
    max-width: 100rem;
    height: auto;
}

.is-card-video-mini {
    padding: 0.1rem;
    margin: .3rem 2rem 2rem 2rem;
    max-width: 15rem;
    height: auto;
}



.is-card-mini {

    margin: 0.5rem;

    width: 9rem;

    height: 9rem;

}



.is-card-mini-2l {

    margin: 0.5rem;

    width: 11rem;

    height: 9rem;

}



.is-card-medium {

    margin: 0.5rem;

    width: 40rem;

}



.is-card-maxi {

    margin: 0.5rem;

    width: 180rem;

    max-width: 180rem;

}



.is-background-lightgray {

    background-color: rgba(225, 225, 225, 1);

}



.image-card-top {

    padding: 10px;

    /* Et on centre */

    margin-right: auto;

    margin-left: auto;

    max-width: 120px;

}



.card-header {

    padding: 1rem;

    font-size: 100%;

    font-weight: bold;

}





.title-header {

    width: auto;

    padding: 0rem;

    margin-right: auto;

    margin-left: auto;

    font-size: 115%;

    font-weight: bold;

    color: black;

}



/*

style="width:auto;height:80px;border:0px;"

*/

.bottom-left {

    position: absolute;

    bottom: 8px;

    left: 16px;

}



.top-left {

    position: absolute;

    top: 8px;

    left: 16px;

}



.top-right {

    position: absolute;

    top: 8px;

    right: 16px;

}



.bottom-right {

    position: absolute;

    bottom: 8px;

    right: 16px;

}



.centered {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

}



.centered-horizontal {

    position: relative;

    top: 0%;

    left: 50%;

    transform: translate(-50%, 0%);

}





.bottom {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, 0%)

}





.footer {

    position: fixed;

    left: 0;

    bottom: 0;

    width: 100%;

    background-color: gray;

    color: white;

    text-align: center;

}



.margin-x-small {

    margin: 0.1rem 0.1rem 0.1rem 0.1rem;

}



.margin-normal {

    margin: 3rem 3rem 3rem 3rem;

}



.margin-small {

    margin: 1rem 1rem 1rem 1rem;

}



.margin-normal {

    margin: 3rem 3rem 3rem 3rem;

}



.is-input-little-box {

    margin: 0.5rem;

    max-width: 3rem;

}



.is-input-large-box {

    margin: 0.5rem;

    max-width: 8rem;

}



.is-font-white {

    color: white;

    text-shadow: 0px 0px 5px black;

}



.is-filename {

    text-align: left;

    font-size: 80%;

    color: yellow;

}











#scrolltable { margin-top: 20px; height: 500px; overflow: auto; }

#scrolltable table { border-collapse: collapse; }

#scrolltable tr:nth-child(even) { background: #EEE; }

#scrolltable th div { position: absolute; margin-top: -20px; }



.is-chat-body {

    width: 80%;

    /* permet de centrer*/

    margin-right: auto;

    margin-left: auto;



}



.is-chat-table {

    width: 100%;

}



.is-online-width {

    width: 20%;

    /* permet de centrer*/

    margin-right: auto;

    margin-left: auto;



}