@charset "UTF-8";
body {
background-color: #FEFEE2;
background-size: 100% 10px;
background-attachment:fixed;
margin-top: 0px;
margin-right: auto;
margin-left: auto;
text-align: left;
font-family: Arial,Helvetica,sans-serif,Verdana;
font-size: 14px;
}
::placeholder {
  font-family:Arial,Verdana,sans-serif;
  text-transform:lowercase;
} 
.linear-gradient {
  background: linear-gradient(to right, cyan, white);
}
fieldset {
position: relative;
border: 1px solid #000;
margin: 0;
padding: 0px 5px 5px;
font-weight:bold;
color:maroon;
background-color: #FFFFF0;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
}
h1 {
font-size: 28px;
font-family: 'Helvetica', sans-serif;
color:#996633;
border-bottom : 1px solid #996633;
text-align:center;
font-weight:normal;
}
h2 {
font-size: 32px;
font-family: 'Helvetica', sans-serif;
color:#a52a2a;
text-align:center;
font-weight:normal;
}
h3 {
font-size:18px;
font-family: Arial,Helvetica,sans-serif,Verdana;
font-weight: bold;
text-align:center;
color:maroon;
margin:0 0 15px 0px;
}
label { font-weight:bold; }

div.t600 {
width: 600px;
margin: auto;
}
div.t1015 {
width: 1015px;
margin: auto;
}
div.t400 {
width: 500px;
margin: auto;
border-collapse:collapse;
border:1px solid black;
}
#global {
margin-left: auto;
margin-right: auto;
min-width:400px;
width: 600px;
text-align: justify;
}

table, th, td {
  /* border: 1px solid black; */
  border-collapse;
}
th {text-align:center;}
tr:hover {background-color: #DFF2FF;}

a:link { text-decoration: underline; color: navy; }
a:visited {  text-decoration: underline; color:maroon; }
a:hover {  text-decoration: underline; color:#cc9966; }

.button1 {background-color: #4CAF50;} /* Green */
.button2 {background-color: #008CBA;} /* Blue */

.bouton {
text-decoration:none;
background-color:gold;
max-width:50%;
height:40px;
padding:3px;
margin:5px 0 10px 0;
border:3px solid navy;
border-radius:  0 10px 0 10px;
font-family:Arial,Verdana,sans-serif;
color:#686464;
font-size:16px;
}
.bouton2 {
text-decoration:none;
background-color:lightblue;
max-width:50%;
height:40px;
padding:3px;
margin:5px 0 10px 0;
border:3px solid navy;
border-radius:  0 10px 0 10px;
font-family:Arial,Verdana,sans-serif;
color:#686464;
font-size:16px;
}
.tab0 {  /* Bandeau */
background-color: #f5f5f5;
box-shadow: 8px 8px 12px #3f1200;
border-radius:10px;
padding:4px 4px 4px 4px;
color:#3f1200;
width:100%;
margin:auto;
}
.tab100 {	/* Menu */
width:50%;
margin:10px auto;
border-collapse:collapse;
}
.decolle { /* décoller les boutons sous le tableau */
margin-top:12px;
border-collapse:separate;
border-spacing: 8px 0px;
}
#degrade {  /* cadre de la bannière CG22 */
border-radius:10px;
background-image:url('f_jaune.gif');
background-repeat:repeat-x;
background-size: 50% 100%;
height:10px;
}
.bandeau {
background-color: #A2DED0;
background-image:url('frise.jpg');
font-size: 60px;
color:maroon;
border-radius:10px;
width:100%;
height:100px;
margin:auto auto;
}
.toggle {
  position: fixed;
  top: 5px;
  right:5px;
  width: 100px;
  margin: 0 auto;
  background: #ccc;
  padding: 5px;
}

.barmenu {
background: #ccc;
padding-top:10px; padding-bottom:10px;
padding-left:10px; padding-right:10px;
border-radius:5px 15px 15px 5px;
font-size:14px;
color:white;
font-weight:bold;
text-align:center;
}
.menu {
background: #a3e4d7;
padding-top:10px; padding-bottom:10px;
padding-left:10px; padding-right:10px;
border-radius:5px 15px 15px 5px;
color:#996633;
font-weight:bold;
text-align:center;
}
.menu:hover {
background-color:#FF7F50;
color:#ffffff;
transition-property: background-color,color;
transition-duration: 0.5s;
}
.menu:hover #smenu {
display: block;
}
.menu:hover a {
color:#fff;
}
#smenu {
display: none;
position:absolute;
text-align:left;
background-color:#FF7F50;
margin-top:6px;
padding:15px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.ligne{
display:flex;
flex-direction:row;
justify-content:flex-start;
align-items:center;
flex-wrap:wrap;
width:100%;
font-size:14px;
}
input.invalid {
	border:red solid 3px;
}
.ligne>input:not([type=submit]),.ligne>select{
height:40px;
margin: 0 1px 0 1px;
padding:1px;
flex:1;
}
input[type=button]{
background-color: gold;
font-family:Arial,Verdana,sans-serif;
border:1px solid lightblue;
color:#686464;
text-align:center;
font-weight:bold;
}
.dupl>input[type=button]{
background-color: gold;
border:0px;
height:10px;
width:8px;
padding:0 0 0 0;
margin:0 0 0 0;
font-size:7px;
}
.plus1>input[type=button]{
background-color: gold;
border:0px;
height:10px;
width:8px;
padding:0 0 0 0;
margin:0 0 0 0;
font-size:7px;
}
.navig>input[type=button]{
height:20px;
padding:2px;
margin:1px 0 2px 0;
font-size:12px;
}
.rue {
font-family:Arial,Verdana,sans-serif;
text-transform:capitalize;
background-color:#54F98D;
color:black;
font-weight:bold;
}

input[type=button]:hover {
background-color: navy;
color:#fff;
transition-property: background-color;
transition-duration: 0.5s;
}
input[type=text],input[type=password],input[type=email]{
background-color: #fff;
height:30px;
padding:2px;
margin:1px 0 1 0;
font-family:Arial,Verdana,sans-serif;
border:3px solid lightblue;
color:#686464;
font-size:16px;
}
textarea{
width:100%;
background-color: #fff;
height:100px;
padding:3px;
margin:2px 0px 0px 2px;
color:#686464;
font-family:Arial,Verdana,sans-serif;
border:3px solid lightblue;
}
select {
background-color: #fff;
height:200px;
padding:2px;
margin:1px 0 1px 0;
color:#686464;
font-family:Arial,Verdana,sans-serif;
font-size:16px;
border:3px solid lightblue;
}
.qr>input[type=submit] {
height:25px;
font-size:12px;
border-radius: 0 0 0 0;
padding:1px;
}
input[type=checkbox] {
 /* Double-sized Checkboxes */
-ms-transform: scale(1.5); /* IE */
-moz-transform: scale(1.5); /* FF */
-webkit-transform: scale(1.5); /* Safari and Chrome */
 -o-transform: scale(1.5); /* Opera */
 padding: 10px;
}
input[type=submit] {
background-color:lightblue;
height:40px;
padding:1px;
margin:2px 0 3px 0;
border:3px solid navy;
border-radius:  0 20px 0 20px;
font-family:Arial,Verdana,sans-serif;
color:#686464;
font-size:16px;
}

input[type=submit]:hover {
background-color: navy;
color:#fff;
transition-property: background-color;
transition-duration: 1s;
}
input[type=reset] {
background-color: lightblue;
height:40px;
padding:3px;
margin:2px 0 3px 0;
border:3px solid navy;
border-radius:  0 20px 0 20px;
font-family:Arial,Verdana,sans-serif;
color:#686464;
font-size:16px;
}
input[type=reset]:hover {
background-color: navy;
color:#fff;
transition-property: background-color;
transition-duration: 1s;
}

.pop{
position:fixed;
top:75px;
left:50%;
display:none;
}
.pop:target{
z-index:1200;
display:block;
}
.pop > div{
display:flex;
flex-direction:row;
justify-content:flex-start;
align-items:flex-end;
max-width:550px;
padding:5px;
border-radius:10px;
border:5px ridge navy;
background: linear-gradient(to right, #E0FFFF, 20%, white);
}
.aide{
color:#fff;
border-radius:20px;
font-size:16px;
width:20px;
height:20px;
text-align:center;
padding:2px;
margin:0 2px 0 4px;
}
