html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}


body {
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	position:fixed;
	margin:0;
	padding:0;
	background-color:#EEE;
	background-image: url("images/fondpetitdej250.jpg");
    background-repeat: repeat;
}

b { 
    font-weight: bold;
}

i {
	font-style: italic;	
}

p {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
	font-weight: normal;
	line-height: 1.3em;
}

h1 { 
    display: block;
    font-size: 2em;
    font-weight: bold;
	line-height: 1.5em;
}

h2 {
    display: block;
    font-size: 1.5em;
    font-weight: normal;
	line-height: 1.4em;
}

h1 {
	margin:0.2em;
	font-size:1.6em;
}

h2 {
	margin:0.1em;
	 font-style: italic;
	 font-size:1.2em;
}

#divcadre {
	position:absolute;
	padding:0;
	margin:0;
}

.divpanel {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	/*background-color:green;*/
}

.ombrecadre {
	background-color:#FFFFFF;
	box-shadow: 0px 0px 5em 1em #888;
}

.bouton {
	margin: 0 auto;
	font-size:1em;
    background-color: #666666; 
    border: none;
    color: white;
    padding: 0.5em 1em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	border-radius: 1em;
	cursor:pointer;
}

.conteneurbouton {
	text-align:center;
	position:absolute;
	width:100%;
	bottom:1em;	
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.tablecarac {margin:1em;}

.tablecarac tr { line-height: 3em; }

.tablesport {margin:1em;}
.tablesport tr { height: 3.5em;margin-bottom:1em; }

.tableplat tr { line-height: 1.5em; }
.tableplat {margin:1em;font-size:0.9em;}

input[type="text"]{
	font-size:1em;
	background-color:white;
}

input[type="number"]{
	font-size:1em;
	width:4em;
	background-color:white;
}

input[type="checkbox"]{
	font-size:1em;
	width:1em;
	height:1em;
}


.checkboxWrapper input[type="checkbox"] {
    display: none;
}
/*when unchecked*/ 
.checkboxWrapper span {
	transform: translate(0, 0.15em);
    display:block;
    width: 0.8em; 
    height: 0.8em; 
	background:white;
    border-radius: 0.2em; 
    border: 1px solid #555; 
    color: #fff;
	cursor:pointer;
}
/*when checked*/
.checkboxWrapper input:checked + span {
	transform: translate(0, 0.15em);
    display:block;
    width: 0.8em; 
    height: 0.8em; 
	background-image: url("images/tick.png");
	background-size: contain;
    border-radius: 0.2em; 
    border: 1px solid #555; 
	color: #fff;
	cursor:pointer;
}

.radiobuttonWrapper input[type="radio"] {
    display: none;
}

.radiobuttonWrapper {
	cursor:pointer;
}

/*when unchecked*/ 
.radiobuttonWrapper span {
	transform: translate(0, 0.15em);
    display:inline-block;
    width: 0.8em; 
    height: 0.8em; 
	background:white;
    border-radius: 0.4em; 
    border: 1px solid #555; 
    color: #fff;
	cursor:pointer;
}
/*when checked*/
.radiobuttonWrapper input:checked + span {
	transform: translate(0, 0.15em);
    display:inline-block;
    width: 0.8em; 
    height: 0.8em; 
	background-image: url("images/dot.png");
	background-size: contain;
    border-radius: 0.4em; 
    border: 1px solid #555; 
	color: #fff;
	cursor:pointer;
}

sup { 
    vertical-align: super;
    font-size: 0.7em;
}

small {
	font-size: 0.7em;
}

.listerepas a:visited, a:link, a:active {
	color:black;
	text-decoration:none;
}

.listerepas a:hover {
	color:black;
	text-decoration:none;
	background-color:#FFA;
}

.logocat {
	margin-left:1.15em;
	width:1.5em;
	height:1.5em;
	background-size: contain;
	background-repeat:no-repeat;
}

.tdcat {
	font-size:0.45em;
	min-width:8em;
	text-align:center;
}

.tableinfonut {
	border:1px solid black;
	border-collapse: collapse;
	font-size:0.8em;
	background-color:white;
}

.tableinfonut td {
	text-align:center;
	border:1px solid black;
	padding:0.5em;
}

[tooltip]:before {
    /* needed - do not touch */
    content: attr(tooltip);
    position: absolute;
    opacity: 0;
    
    /* customizable */
	z-index:99;
	font-size:0.6em;
    transition: all 0.15s ease;
    padding: 1em;
    color: #333;
	border:1px solid  rgba(100,100, 100, 0.5);
    border-radius: 1em;
    box-shadow: 0.25em 0.25em 0.1em silver;    
}

[tooltip]:hover:before {
    /* needed - do not touch */
    opacity: 1;
    
    /* customizable */
    background: rgba(255,255, 150, 0.8);
    margin-top: 3em;
    margin-left: 2em;    
}

[tooltip]:not([tooltip-persistent]):before {
    pointer-events: none;
} 