/*
 * HTML5 Boilerplate
 *
 * What follows is the result clubviva_logoof much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
progress {
  color: #5ee86a;
  border: 1px solid #000000;
  background:#ffffff;
}
progress::-moz-progress-bar { background: #5ee86a; }
progress::-webkit-progress-bar { background: #ffffff; }
progress::-webkit-progress-value { background: #5ee86a; }
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
input[type=checkbox] {
  /* All browsers except webkit*/
  transform: scale(1.5);
    font-family: Arial, Helvetica, Times New Roman,  sans-serif;
    font-size:24px;

  /* Webkit browsers*/
  -webkit-transform: scale(1.5);
}
select
{
    font-family: Arial, Helvetica, Times New Roman,  sans-serif;
    font-size:22px;
    height:30px;
}
html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-family: Arial, Helvetica, Times New Roman,  sans-serif;
    font-size:18px;
    width:100%;
    height:100%;
}
object {
   scroll:no;
}
/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0;
    background: #ccc;
    color: #000;
    padding: 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

footer
{
    height:30px;
    width:1366px;
    background-color: #0e056c;
    overflow: hidden;
    margin-left:auto;
    margin-right:auto;
    margin-top:0px;
    position:relative;
}
header
{
    height:30px;
    width:1366px;
    margin-left: auto;
    margin-right: auto;
    background-color: #0e056c;
}
nav
{
    height:108px;
    width:1366px;
    background-color: #dff1ff;
    margin:auto;
    position:relative;
}
section
{
    margin:auto;
    position:relative;
    width:1366px;
    overflow: hidden;
    background-color: #dff1ff;
    
}
aside
{
    margin:auto;
    position:relative;
    width:320px;
    height:520px;
    background-color: #dff1ff;        
    overflow: visible;
}
outils
{
    width:130px;
    height:520px;
    margin:auto;
    background-color: #dff1ff; 
    position:relative;

}

#clubviva_top {
        width: 100%;
        height: 100%;
}
#clubviva_nom {
    padding-top:2px;
	text-align:center;
        font-weight:bolder;
        color:white;
}
#clubviva_logo {
}
#clubviva_tchat {
	margin-right:360px;
	width:64px;
	float:right;	
}
#clubviva_date{
	text-align:right;
        color:#dff1ff;
	font-weight:bolder;
}
#clubviva_fete{
    padding-top:2px;
	text-align:center;
        font-weight:bolder;
        color:#dff1ff;
}
#clubviva_texte{
	font-size:36px;
        color:#008CDC;
	text-align:center;
}
#infosPied h1 {
	margin-top: 6px;
        text-align: center;
	font-size:14px;
	color: white;
}
#infosPied a {
	letter-spacing: 1px;
        text-align: center;
	font-size:14px;
	color: yellow;
}

.table_bandeau
{
    margin-left: auto;
    margin-right: auto;
    width: 66%;
    height: 100px;
}
.btn_selection
{
    width:220px;  
    height:36px;  
    background-color:#4474e4;

    -webkit-border-radius: 48px;
    -moz-border-radius: 48px;
    border-radius: 48px;
    -moz-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: 3px 3px 0px 0px #0c0c3f;
    box-shadow: 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);

    font-weight: bold;
    text-align:center;
    color: #FFFFFF;
    text-shadow: 1px 1px 3px #000000;
    font-size: 18px;
    border: solid #1f478c 0px;
    text-decoration: none;
    margin: 4px;
}

.btn_selection:hover
{
   background-color:#5ee86a;
    color: #0c0c3f;
    text-shadow: 1px 1px 3px #FFFFFF;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -moz-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);
}

.btn_sans_selection
{
    width:220px;  
    height:36px;  
    background-color:#4474e4;

    -webkit-border-radius: 48px;
    -moz-border-radius: 48px;
    border-radius: 48px;
    -moz-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: 3px 3px 0px 0px #0c0c3f;
    box-shadow: 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);

    font-weight: bold;
    text-align:center;
    color: #FFFFFF;
    text-shadow: 1px 1px 3px #000000;
    font-size: 18px;
    border: solid #1f478c 0px;
    text-decoration: none;
    margin: 4px;
}

.btn_deselection
{
     width:220px;  
    height:36px;  
    background-color:#5ee86a;
    text-shadow: 1px 1px 3px #FFFFFF;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -moz-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);
    color: #0c0c3f;
    font-weight: bold;
    text-align:center;
    font-size: 18px;
    border: solid #1f478c 0px;
    text-decoration: none;
    margin: 4px;
}

.btn_autre_deselection:hover
{
    background-color:#4474e4;
    color: #FFFFFF;
    text-shadow: 1px 1px 3px #000000;

    -webkit-border-radius: 48px;
    -moz-border-radius: 48px;
    border-radius: 48px;
    -moz-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: 3px 3px 0px 0px #0c0c3f;
    box-shadow: 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);

}

.btn_emoji
{
    width:36px;  
    height:36px;  
    background-color:#4474e4;
    -webkit-border-radius: 48px;
    -moz-border-radius: 48px;
    border-radius: 48px;
    -moz-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: 3px 3px 0px 0px #0c0c3f;
    box-shadow: 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);
    color: #FFFFFF;
    border: solid #1f478c 0px;
}

.btn_emoji:hover
{
   background-color:#5ee86a;
    color: #0c0c3f;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -moz-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);
}

.btn_outils
{
    margin-left:20px;
}

.zoom_btn_outils
{
    position:absolute;
    top:0px;
    left:0px;
    width:100px;
    height:100px;
    padding-top:5px;
    padding-left:5px;
    background-color:#5ee86a;
    color: #0c0c3f;
    text-shadow: 1px 1px 3px #FFFFFF;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -moz-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);
    display: none;

}
.pub_gauche
{
    background-color:white;
    height:130px;
    width:110px;
    margin-left:10px;
    margin-right: 10px;
    padding:2px auto;
    -moz-box-shadow: inset 0px 0px 2px 0px #656565;
    -webkit-box-shadow: inset 0px 0px 2px 0px #656565;
    -o-box-shadow: inset 0px 0px 2px 0px #656565;
    box-shadow: inset 0px 0px 2px 0px #656565;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=315, Strength=2);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    position:relative;
    margin-top:0px;
}

.pub
{
    background-color:white;
    height:400px;
    widht:110px;
    margin-left:10px;
    margin-right: 10px;
    padding:2px auto;
 -moz-box-shadow: inset 0px 0px 2px 0px #656565;
-webkit-box-shadow: inset 0px 0px 2px 0px #656565;
-o-box-shadow: inset 0px 0px 2px 0px #656565;
box-shadow: inset 0px 0px 2px 0px #656565;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=315, Strength=2);
-webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
    position:relative;
    overflow: auto;

}

.btn_proposition
{
    width:220px;  
    height:36px;  
    background-color:#4474e4;

    -webkit-border-radius: 48px;
    -moz-border-radius: 48px;
    border-radius: 48px;
    -moz-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: 3px 3px 0px 0px #0c0c3f;
    box-shadow: 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);

    font-weight: bold;
    text-align:center;
    color: #FFFFFF;
    text-shadow: 1px 1px 3px #000000;
    font-size: 22px;
    border: solid #1f478c 0px;
    text-decoration: none;
    margin: 4px;
}

.btn_proposition_inverse
{
    background-color:#5ee86a;
    text-shadow: 1px 1px 3px #FFFFFF;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -moz-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -webkit-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    -o-box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    box-shadow: inset 3px 3px 0px 0px #0c0c3f;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#0c0c3f, Direction=134, Strength=0);
    color: #0c0c3f;
    font-weight: bold;
    text-align:center;
    font-size: 22px;
    border: solid #1f478c 0px;
    text-decoration: none;
    margin: 4px;
}