@charset "utf-8";
body{
        font-family: Arial, monospace, sans-serif;
        background-color: blue;
        background: url("../img/css_bg.jpg");
        background-repeat: repeat;
        line-height: 150%;
        font-family: Verdana, Arial, Helvetica, sans-serif;
}

.footer{
        background-color: #343A40;
        color:white;
}

.fond_1{
        background-color: #FFFFF1;
        border-radius: 6px;
        border-width:2px; 
        border-style:solid; 
        border-color:black;
}

.fond_2{
        background-color: #D6D6FF;
        border-radius: 6px;
        border-width:2px; 
        border-style:solid; 
        border-color:black;
}

.mini_logo{
        height:25px;
        border-radius: 6px;
        vertical-align: middle;
}
/* ================ MAIN TITLE ============== */
h1 {
        font-size:130%;
        text-decoration:none;
        text-align: center;
        color:white;
        padding:10px;
        background-color: #2B2B2B;
        font-variant: small-caps;
        border: none;
        border-radius: 3px;
}
h1:before {
        content: "";

}
h1:after{
        content: "";
}
h2:before { 
        content: "";
}
h2{
        font-size:120%;
        margin-top:10px;
        color:white;
        font-variant: small-caps;
        border: none;
        border-radius: 3px;
        display: table;
        padding:5px;
        background:#4D788F;
}
h3:before {
        content: "";
}
h3{
        font-size:110%;
        margin-top:10px;
        color:white;
        background-color: #BDBFC3;
        border-radius: 3px;
        display: table;
        padding:5px;
}



/* ================ MAIN LINK ============== */
a:before {
        content: "";
}
a:link, a:active, a:visited{
        color:#000000;
        text-decoration: none;
        --font-weight: bold;
        --font-weight: bolder;
}
a:hover, a:focus{
        --color:#000000;
        color:red;
        text-decoration: none;
        font-style: italic;
        --font-weight: bold;
        --font-weight: bolder;
}

a.no_class, a.no_class:link, a.no_class:hover, a.no_class:focus, a.no_class:before {
        text-decoration: none;
        content: "";
}

/* ================ MAIN TABLE============== */
.table_defaut, tr, td {
        border-width:1px; 
        border-style:solid; 
        border-color:black;
        border-collapse:collapse;
}

.table_pair {
        background:#A8DBFE;
}
.table_impair {
        background:#CFEAFD;
}

.table_inv, tr_inv, td_inv {
        border-width:0px; 
        --border-style:solid; 
        --border-color:black;
        border-collapse:collapse;
}
/* ================ ALL FORM============== */
input[type=submit] {
        font-size: 1.1em;
        font-weight: bold;
        border-radius:8px;
}
input[type="checkbox"]:checked+label{
        font-weight: bold;
        color:MediumBlue; 
        background-color:white;
        display:inline-block;
}
input[type="radio"]:checked+label{
        font-weight: bold;
        color:MediumBlue; 
        background-color:white;
        display:inline-block;
}
label:before {
        content:"✗";
        border:solid;
        border-radius:4px;
        padding: 0 0.15em;
        border:2px solid black;
}
label {
        padding: 0 1em;
}
input:checked + label:before {
        content:"✓";
}
[type="checkbox"] {
        position:fixed;
        left:-9999px;
}
[type="radio"] {
        position:fixed;
        left:-9999px;
}
.textarea{
        width:98%;
        height: 300px;
        align:center;
}
.textarea2{
        width:98%;
        height: 100px;
        align:center;
}

/* ================ DIV FLEX============== */

.flex-a{
        max-width:100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: left;
align:center;
}
.flex-b{
        width:120px;
        margin:4px;
        padding:2px;
        vertical-align: middle;
        flex-wrap: wrap;
        border:1px solid black;
        word-break: break-all;
        box-shadow: 10px 5px 6px black;
}

.flex-c{
        --width:120px;
        margin:4px;
        padding:25px;
        vertical-align: middle;
        flex-wrap: wrap;
        border:1px solid black;
        box-shadow: 10px 5px 6px black;
}
/* ================ DIV SPEC ============== */

.link_full_div{
        text-decoration: none;
        display:block;
        width:100%;
        height:100%;
}

.div_forum_index{
        display: inline-block;
        width: 95%;
        height: 5%;
        text-align: left;
        border:2px solid red;
        border-radius: 2px;
}
.div_forum_index:hover{
        --background-color: #EAEAEA;
        border:2px solid orange;
        border-radius: 8px;
}

.div_forum_index_userid{
        display: inline-block;
        width: 95%;
        height: 5%;
        text-align: left;
        border:2px solid blue;
        border-radius: 2px;
}
.div_forum_index_userid:hover{
        --background-color: #D6FFFF;
        border:2px solid cyan;
        border-radius: 8px;
}
/* ================ PHOTO SPEC ============== */
.photo25{
        max-width:25px;
        max-height:25px;
}
.photo50{
        max-width:50px;
        max-height:50px;
}
.photo100{
        max-width:100px;
        max-height:100px;
        border-radius: 10px;
}
.photo200{
        max-width:200px;
        max-height:200px;
        border-radius: 20px;
}
.photo300{
        max-width:300px;
        max-height:300px;
        border-radius: 30px;
}
.photo400{
        max-width:400px;
        max-height:400px;
        border-radius: 40px;
}
.photo500{
        max-width:500px;
        max-height:500px;
        border-radius: 50px;
}

.span_red{
        color:red;
}
.span_blue{
        color:blue;
}
.span_yellow{
        color:yellow;
}
.span_orange{
        color:orange;
}
.span_green{
        color:green;
}
.span_purple{
        color:purple;
}
.span_grey{
        color:grey;
} 
	
	/* ================ DEBUT PETIT ============== */
@media (orientation: portrait) {
/* ================ FONT MIN ============== */

.full_body{
        background-color: #FFFFFF;
        width: 95%;
        margin: 0 auto;
}

.topban_maxi{
        display: none;
}
.topban_mini{
        width: 95%;
        vertical-align: middle;
        border-radius: 3px;
        margin-left: auto;
        margin-right: auto;
        display: block;
}
         body{
                 font-size: 1.4rem;
        }
.div_chapeau{
        width: 100%;
        min-height:100px;
        text-align: center;  
        background-color: #FFFFFF;
        border:1px solid #FFFFFF;
        border-bottom: 1px solid orange;
}
.block_chapeau{
        display: inline-block;
        min-width: 19%;
        text-align: center;
        border:1px solid #FFFFFF;
        line-height:98px;
        margin-right:5px;
}
.block_chapeau:hover{
        background-color: #FFFFFF;
        border:1px solid #FFFFFF;
}
} 
	
	/* ================ DEBUT GRAND  ============== */
@media (orientation: landscape) {
/* ================ DIV CHAPEAU ============== */

.full_body {
        background-color: #FFFFFF;
        width: 70%;
        margin: 0 auto;
}

.topban_maxi{
        width: 70%;
        vertical-align: middle;
        border-radius: 3px;
        margin-left: auto;
        margin-right: auto;
        display: block;
}

.topban_mini{
        display: none;
}
         body{
                 font-size:0.9rem;
        }
.div_chapeau{
        width: 100%;
        min-height:40px;
        text-align: center;  
        background-color: #FFFFFF;
        border:1px solid #FFFFFF;
        border-bottom: 1px solid orange;
}
.block_chapeau{
        display: inline-block;
        width: 19%;
        text-align: center;
        border:1px solid #FFFFFF;
        line-height:38px;
        margin-right:5px;
}
.block_chapeau:hover{
        background-color: #FFFFFF;
        border:1px solid #FFFFFF;
}

}