/*----------------------joueurs----------------*/
a.joueur { color: #600;}

a.joueur-to-play { color: #900; font-weight: bold; }

a.joueur-abandon{ text-decoration: line-through; }

a.joueur-defie{  color: #900; font-style: italic; }

a.joueur-attente{ font-style: italic; }

a.joueur-chef { 
    border-bottom:1px solid darkred;
}

a.joueur:hover, a.joueur-abandon:hover, a.joueur-attente:hover, a.joueur-to-play:hover, a.joueur-defie:hover { color: #168; }

.right {
    text-align: right;
}
.center {
    text-align: center;
}
.left {
    text-align: left;
    }
.contributeur {
    font-weight:bold;
}
textarea {
    font-family:courier;
}

html {
    }

body { 
       background: #fed url("/static/images/sepsgrille.png") no-repeat top right;
       font-family: "Verdana","Geneva","Lucida Sans Unicode", "Lucida Grande", sans-serif;
       font-size:16px;
       color: #024;
       padding: 0;
       }
h1, h2, h3, h4, h5, h6 {
       font-family:"Comic Sans MS", cursive, sans-serif;
    }

p#on_page {
    position:absolute;
    top:60px;
}
.navbar {
    font-size:16px;
    }
.navbar-nav  li  a, .navbar-brand {
    color:#200 !important;
    padding-top:4px !important; 
    padding-bottom:0 !important;
    height: 28px;
}
.navbar {min-height:28px !important;}

p.navbar-text {
    margin:0px;
    }

big {
    font-size:120%;
}
small {
    font-size:80%;
}
a img { 
        border: 0; 
        }

a {
    color:#600 ;
    background-color: transparent;
    text-decoration: none; 
    }

a:hover {
          text-decoration: none;
          color:#168 ; 
          }

.souligne a {
    color: #600;
    background-color: transparent;
    text-decoration: underline; 
    }

.souligne a:hover {
          text-decoration: underline;
          color: #168; 
          }

/*==============MENU===================*/

.menu-h {
    font-weight:bold;
}
.li-multi {
    display: inline-flex !important;
}
    
.navbar {
    margin-right:150px;
    margin-bottom:0px;
    }
.logos { 
         border-top: 3px solid #c22;
         border-bottom: 5px solid #fa6;         
         margin: 10px 0 10px 0px;
         padding: 4px 0 7px 10px;
         background-color: #fc9;      
         }

.hebergepar { 
              text-align:center;
              font-size: 80%;            
              color: #168;
              padding: 5px;
              border: 1px solid #fff;
              margin: 0 0 30px 0;
              }

.hebergepar a{
               background-color: transparent;
               color: #e81;
               }

.hebergepar a:hover{
                     color: #c22;
                     }

/*________________Jouer / rencontrer / infos / _______________*/

.jouer, .rencontrer, .infos {  
                              border-top: 3px solid #c22;
                              border-bottom: 4px solid #fa6;
                              margin: 10px 0 0 0;
                              padding: 0 0 15px 0;
                              background-color: #fc9;
                              }

.jouer h2, .rencontrer h2, .infos h2{ 
                                      margin: 0px 0 4px 0;
                                      padding: 0;
                                      height: 30px;
                                      }

.jouer h2{
           background: url(/static/images/jouer.png) top left no-repeat;
          }

.rencontrer h2{
                background: url(/static/images/rencon.png) top left no-repeat;
                }

.infos h2{
          background: url(/static/images/infos.png) top left  no-repeat;
          }

#menu h2 span{
               display: none;
               }

/*------------MENU--listes-----------*/

#menu ul{
          margin-bottom: 1.5em;
          margin-top: 0.5em;
          padding:0;
          margin:0;
          }

#menu li{
          display: inline;
          list-style: none;
          }

#menu a{
         color: #600;
         display: block;
         text-decoration: none;
         background: transparent url('/static/images/puce1.png') no-repeat 0 5px;
         padding: 0 0 1px 7px;
         margin: 0 0 0 10px;
         }

#menu a:hover{
               background: transparent url('/static/images/puce2.gif') no-repeat 0 5px;
               color: #168;

               }

/*=================PAGES===================*/
div.page {        
          margin: 10px;
           /*text-align: justify;*/
           padding-bottom: 30px;
           background:  url('/static/images/petit4.png') no-repeat bottom right;
           }

.pagechat {  background: #fed url("/static/images/petitseps.jpg") no-repeat top left;
            margin: 0;
            text-align: center;
            padding: 0;
            }

/*===================BLOC-en-HAUT===============*/

.title h1{ 
           color: #036;
           text-align:center;
           }

.ident { 
         text-align:center; 
          }

/*==============TEXTE================*/

.bloc { 
        margin: 0;
        background: transparent url('/static/images/blanc.jpg') repeat-x  bottom;
        }

.spacer {
          clear: both;
          }
      
.bloccv { 
          margin: 1em 0 1em 0;
          text-align: center;
          }

.bloc span, .pagechat span, .bloccv span { 
             color: #168;
             }
.commenter {
    margin:0px;
    padding:0px;
    }
.note_journal {
    font-size:80%;
    float:right;
    text-align:right;
}
/*span.joueur, span.joueur-to-play { color: #c22; }*/

.bloc ul li { 
              margin: 0 0 10px 0;
              }

/*--------BLOC-------titres------------*/
.bloc h2, .bloccv h2 { 
              font-size: 120%;
              border: 1px solid white;
              text-align: center;
              letter-spacing: 2px;
              margin: 10px 0 10px 0;
              }

.bloc h3, .bloc h5 { 
              font-size: 130%;
              border-bottom: 2px solid #e81;
              text-align: center;
              margin: 10px 0 0 0;
              padding: 5px;
              color: #168;
              }

 .bloc h5 a { 
              color: #036;
              }

 .bloc h5 a:hover { 
              color: #168;
              }

.bloc h4 { 
           background: #fa6;
           border-bottom: #c22 solid 5px;
           text-align: center;
           padding: 3px;
           font-weight: normal;
           letter-spacing: 1px;
           }

.bloc h4 a {  font-variant: small-caps;
              color: #900;
              }

 .bloc h4 a:hover { 
              color: #168;
              }


/*-------Bloc--------paragraphes spéciaux------------*/
.petit { 
         margin: 10px 0 20px 0;
         font-size: 80%;
         text-align: center;   
         }

.intro { 
         margin: 10px 0 20px 0;
         padding: 10px 50px 10px 50px;
         text-align: center;
         background: #fff;
         border: #e81 solid 2px;
         }
.info { 
         text-align: center;
         background: #fff;
         border: #e81 solid 2px;
 }

div.news { 
           margin-top: 20px;
           padding: 0 10px 2px 10px;
           border-left: 2px solid #e81;
           }

div.news span.date { 
                     font-weight: bold;
                     }

span.auteur { 
          color: #168;
          font-size: 80%;
          font-style: italic;
          }

.cv { 
      float: left;
      margin: 0 20px 10px 0;
      padding: 1px 5px 5px 5px;
      background-color: #fff;
      width: 300px
                }
.cv a {
    font-size:90%;
    }

/*_______________________SONDAGE___________*/
.sondage-question {
         margin: 10px 0 20px 0;
         padding: 10px 50px 10px 50px;
         text-align: left;
         background: #fff;
         border: #e81 solid 2px;
}
.sondage-liste {
         margin: 10px 0 20px 0;
         font-size: 80%;
         text-align: left;   

}

/*_______________________FORUM_____________*/

div.mail-bloc form table {
    width:100%;
    }
div.forum-fil, div.mail-bloc {
                background-color: #fc9; 
                padding: 0 5px 10px 0;
                }

div.forum-fil ul {
                   list-style-type: None; 
                   padding: 5px 0 0 5px;                   
                   margin: 0;
                   }

div.forum-fil li { color: #025;
                   padding: 0px 0px 0px 4px;
                   border-left: 1px solid #e81;
                   }

span.forum-title, span.mail-title { 
                   font-weight: bold;
                   color: #036;
                   }

span.forum-person { 
                    color: #168;
                    }

div.forum-body, div.mail-body { 
                 background-color: #fed;
                 border:1px solid #168;
                 padding: 2px;
                 }


div.forum-body td{
    border:1px outset black;
    padding:2px;
    padding-left:4px;
    padding-right:4px;
    }

div.forum-body table {
    border-collapse: collapse;
    border:1px outset black;
    }
div.forum-body th {
    border:1px outset black;
    padding-left:4px;
    padding-right:4px;
}
.forum-new { 
                 color: red;
                 font-size: 90%;
                 font-weight: bold;
                font-style: italic;
                text-align: center;
                 }

.forum-com-non-lu {
    text-align:center;
    color:darkred;
    font-weight:bold;
    background-color:lightgrey;
    border:1px solid black;
    margin-top:5px;
}
.forum-journal {
    padding:10px;
}
.forum-fil-new { 
                 color: red;
                 font-size: 90%;
                 font-weight: bold;
                font-style: italic;
                 }
.sujet a { 
    color: #600;
           text-decoration: none;
           }

.sujet a:hover { 
           color: #168;
           text-decoration: none;
           }

.sujet-obso a {
    color: #999;
    text-decoration: none;
    }

.sujet-obso a:hover { 
           color: #168;
           text-decoration: none;
           }

.sujet-epingle a {
    color: #600;
    text-decoration: none;
    }

.sujet-epingle a:hover { 
           color: #168;
           text-decoration: none;
           }

.article-brut {
    background: white;
    border:1px inset black;
}

.lettres { padding: 0 0 10px 0 }

.lettres  a { color: #900; padding: 0 5px 0 0; }

 .lettres  a:hover { color: #168; }

div.rubriques {
    width:300px;
    position: absolute;
    top: 0px;
    right: 0px;
    margin: 0px;
    float: right;
    background:#fc9;
    border:1px solid black;
}
div.rubriques h3 {
    margin:0px;
}
.rubriques-lien {
    border:1px solid black; 
    width:100%; 
    display:block; 
    background-color:white; 
    text-align:center
}
div.intro-rubrique { 
                 background-color: #ffe;
                 border:1px solid #ccd;
                 padding: 0px;
                 margin-left: 30px;
                 }
div.intro-rubrique p {
    padding: 0px;
    margin: 0px;
}

/*----------------------TABLE------------------*/

table.tableborder {  
                    background-color:#fc9;                 
                    border: 0;
                    width: 100%;
                    padding: 2px 5px 10px 5px; 
                    border-collapse:separate;
                    }

table.tableborder td { 
                       border-top: 4px solid #fed;
                       border-bottom: 2px solid #168;
                       border-right: 1px dashed #168;
                       padding: 2px 5px 2px 5px; 
                       margin: 0; 
                       background-color:#fed;
                       vertical-align: text-top;
                       }

table.tableborder thead{
                         text-align: center;
                         font-weight: bold; 
                         }

table.tableborder .alphabet{ 
                             background-color: transparent; 
                             border-bottom: 2px solid #168;
                             border-top:0;
                             border-right:0;                           
                             }

.alphabet a{ 
             color:#900;
             font-weight: bold;
             }

.alphabet a:hover { 
                    color:#e81; 
                    }

/*------------------DIAPO-------------------*/
.diapo { 
         border-bottom: #e81 solid 2px; 
         border-left: #e81 dashed 2px;
         padding:  0 5px 5px 5px;
         margin: 2px 0 20px 0;
        }

.presentation_diapo { 
                      margin: 0;
                      padding: 0;
                      }

.presentation_diapo a{
                      font-size: 110%;
                      font-weight: bold;
                      }

.image_diapo { 
               text-align: left;
               margin: 0;
               padding: 0;
               }

/*----------------------autres----------------*/
.marque { 
          margin-top: 50%;
          border-top:3px solid #e81;
          text-align: right;
          padding: 0 20px 0 0;
          }

.submit { 
          border: 1px outset #c22;
          background-color: #fa6;
          color: #036;
          font-variant: small-caps; 
          letter-spacing: 1px;
          padding: 3px 7px 3px 3px;
          }


.submit:hover { 
                color: #c22;
                background-color: #fc9;
                }


div.footer {
             clear: both;
             width: 100%;
             text-align: right;
             font-size: 100%;
             border: 1px solid transparent;
             }

input { 
        border: 1px inset #e81;
        color: #036; 
        text-align: left;
        letter-spacing: 1px;
        margin: 0;
        }
input[type=submit], input[type=button] {
    padding:5px;
    border: 2px outset #e81;
    border-radius:10px;
}

iframe { 
         color: #036; 
         padding: 0;
         margin : 0;
         border: 3px #e81 solid;
         background-color: #fa6;
         }


/*--------------------parties-----------------*/
.parties {
    background-color:#fc9;
    padding:10px;
 }
.option-lib { 
                  font-weight: bold;
                  color:red;
}
p.dico-libre, span.dico-libre { 
                  font-weight: bold;
                  color: red;
}
span.mot-libre {
    color: red;
}

/*--------------cnil---------------*/
div.cnil { 
           font-size: 80%;
           color: #aaa;
}

/*-----------------Tournois-------------------------*/
div.tournoi-inscription {
    text-align: center;
                    background-color:#fc9;                 
                    border: 0;
                    width: 100%;
                    padding: 2px 5px 10px 5px; 
    }
div.tournoi-article {
    overflow: auto;
    height: 200px;
    }
.tournoi-termine {
    font-style: italic;
    color: grey;
}
.tournoi-termine a {
    color: grey;
}

#actu {
    margin-right:150px;
    background: #fc9;
    border-bottom: 1px solid orange;
    }
#actu a {
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left:10px;
    padding-right:10px;
    }
#actu .dropdown a {
    color:#600;
    border:0px;
    display:inline-block;
    }
div.msgs {
    display:none;
    margin: 0px;
    padding: 0px;
}
span.formy_field_err {
    color:red;
}

div.photo {
    position: absolute; 
    text-align:right; 
    top:0px; 
    right:0px; 
    text-align: center;
    /*
      opacity:0.1;
    filter:alpha(opacity=10);
*/
}
a.payplug {
    border:2px outset black;
    padding:5px;
    background:#eee;
}
.mot-existe { 
              color: #074;
 }
.mot-inconnu { 
               color: #c22;
}

.fogrid {
    display:grid;
    grid-template-columns: auto auto;
    row-gap: 2px;
}

#notif-info {
    color:#200;
    font-weight:bold;
}
#notif-info a {
    color:#600;
    font-weight:bold;
}

.parties-cours {
    display:grid;
    grid-template-columns: repeat(auto-fit,minmax(200px,1fr));
}
.table-partie {
    display:grid;
    border:1px solid grey;
    margin-bottom:20px;
    background-color:#ffe;
    grid-template-columns: 1fr 1fr 2fr;
}
.table-partie-comment {
    grid-column: 1/4; 
    border-top:1px dotted grey;
    margin-top: 5px;
    padding-top: 5px;
}
@media (max-width: 800px) {
    .table-partie {
        grid-template-columns: 1fr;
    }
    .table-partie-comment {
        grid-column: 1/1; 
    }
}