@charset "UTF-8";
/* CSS Document */

/*#841713*/
@font-face {
    font-family: 'blackboardregular';
    src: url('blackboard/blackboard-webfont.woff2') format('woff2'),
         url('blackboard/blackboard-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

/*css reset Eric Meyer*/
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;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block; 
} 
body {
	line-height: 1;
	background: url(../images/bieresGrand.jpg) no-repeat center 0 fixed #0f0a06;
}
.cc_btn_accept_all{
	background: rgb(132, 23, 19) !important;
	color: white!important;
}
.cc_more_info{
	color: rgba(132, 23, 19,0.7) !important;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {  
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
hr {
	clear: both;
	visibility: hidden;
	margin:0;
}
h5{
	position: fixed;
	width: 100%;
	padding: 10em 0;
	background:white;
	color:#666;
	z-index: 40;
	font-size:1.5em;
	text-align: center;

}
.title .gridLogo{
	width: 100px;
	margin: 0 1.515151515152% 0 !important;
}
h3, p, a {
	font-family: 'Asap', sans-serif;
}

a {
	-webkit-transition:background 1s ease;
	        transition:background 1s ease;
	text-decoration: none;
	color:#999;
}
a:hover{
	color:#999;
}
footer{
	position: absolute;
	bottom:0;
	width:100%;
	background: rgba(132, 23, 19,0.8);
	color:white;
	padding: 1em 0 4em;
}
footer h3, footer p{
	padding:0.5em 2em;
	float:left;
}
.taille3,.taille6,.taille7,.taille9{
	width: 33.33333333333333% !important;
}
.taille4,.taille8{
	width: 24.9% !important;
}
.taille5{
	width: 20% !important;
}

.container{
	margin-bottom: 8em !important;
}
.btn{
	font-size:0.9em;
	background:#841713;
	color:white;
	padding:0.5em;
	border-radius:4px;
	margin:1em 0;

}
.btn:hover{
	background:#D33731;
	color:white;

}
.affiche{
	display:block !important;
}
.bouton{
	width: 200px;
	margin: 0 auto 1em;
	text-align: center;
	font-size: 1.2em;
}
.grid-2 .bouton{
	width: 200px;
	margin: 1.5em auto 1em;
	text-align: center;
	font-size: 1.2em;
}
.grid-4 .bouton{
	width: 200px;
	margin: 5em auto 1em;
	text-align: center;
	font-size: 1.2em;
}
h2 span{
	font-size:0.8em;
	width: auto;
	color:#841713;
}
.title {
	position:fixed;
	color:#666;
	width:100%;
	background: rgb(132, 23, 19);
	top: 0;
	padding: 0.5em 0;
		z-index: 10;
}

	


#agenda1 p:not(.choixDate),#agenda2 p:not(.choixDate) {
	padding: 0.5em 0 1em;
}
.logo {
	float: left;
	width: 100%;
	max-width: 100px !important;
}


.titraille {
	margin-top:0.5em;
	margin-left: 1em;
	width: 40%;	
	float:left;
	min-width: 615px;
}

h1 {
	font-size:1.3em;
	font-family: 'Asap', cursive;
	text-align: left;
	color:#fff;
}
.region {
	font-size:1em;
	font-family: 'Lobster', cursive;
	text-align: left;
	color:#fff;
}

.topMarge {
	margin-top:8em !important;
}

.fullImage {
	width: 100%;
	padding-bottom:30%;
}
.menu{
	width: 35%;
float: right;
}
.menu li {
	width: 24%;
	margin: 1em 1em 0 0;
	float:left;
	text-align: center;
	padding: 0.5em;
	background: #D33731;
	-webkit-transition:background 1s ease;
	        transition:background 1s ease;
	border-radius: 4px;

}
.menu li a{
	color: white; 
	font-size: 0.9em;
}
.menu li:hover{
	background: #841713;
}
.marqueB {
	width: auto;
	margin: 1em auto;
}
.asap{
	font-family: 'Asap', sans-serif;
	color:white;
}
.marqueB li {
	float:left;
	text-align: center;
	font-size: 1.5em;
	color:#D33731;
	font-family: 'Lobster', sans-serif!important;
	cursor:pointer;
}
.marqueB li .note {
	position: relative;
	top: 0;
	left:0;
	z-index: 5;
	display:none;
}
.marqueB li .note .description{
	font-size: 0.6em;
color: #666;
font-family: 'Asap', sans-serif;
background: white;
padding:1em;
top: -150px;
position: absolute;
left: 1.5em;
line-height: 1.6;
 border-radius: 8px;
}
table{
	margin:0.5em auto;
	width:90%;
	border:3px solid #841713;
	border-collapse: separate;
    border-spacing: 0;
	 border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  background: white;
}



.centre {
	width: 150px;
	margin: 0 auto;
}


/*pour faire une ligne colorée sur deux */ 

th{
	font-family: 'Asap', sans-serif;
	font-size:0.8em;
	color:#FFF;
	background:#841713;
	padding:1em 0;
	text-align:center;	
	width: 14.28571428571429%;
	border-left:white 1px solid;
}

tbody tr{
	border-bottom:#ccc 1px solid;
}

td{
	font-family: 'Asap', sans-serif;
	font-size:0.9em;
	color:#999;
	text-align:center;	
	padding: 0.5em;
	border-left:#ccc 1px solid;
	background: white;
	border-bottom: #ccc 1px solid;
		line-height: 1.8;
}
.inactif{
	background: #e0e0e0 !important;
}
tr th:first-of-type{
border-left:none;
}
tr:last-of-type td:last-of-type{
border-right: #ccc 1px solid;
}
tr:last-of-type td:nth-of-type(7){
border-right:none !important;
}
tr:last-of-type td:first-of-type{
border-bottom-left-radius: 7px;
}
tr:last-of-type td{
border-bottom:none;
}
tr td:first-of-type{
	border-left:none;
}
td a{
	font-family: 'Asap', sans-serif;
	font-size:1.1em;
	color:#666;
	text-align:center;	
	font-weight: 700;
	cursor:pointer;
	width: 100%;
}
td a:hover{
	color:#333;
}
.we{

	background:#423C47;
	color:white !important;
	font-weight: normal;
	cursor: help;

}
td.we{
	vertical-align: middle;
	line-height: 1;
}
.dateAct:hover{
	background:#f9d9d6;
}
.agendaDiv .grid-full{
		margin-top: 1em;
		margin-bottom:1em;
		padding-top: 1em;
}
#messDate{
	position:absolute;
	z-index: 20;
	width: 150px;
	background:white;
	color:#666;
	padding: 1em;
	left:75%;
	margin-top: -5em;
	border-radius: 8px;
	border:3px #841713 solid;
}
.agendaDiv{

		/*background: url(../images/black.png) repeat center top ;*/
		border-radius: 8px;
	background:#393745;
}
.agendaDiv h2{
	 font-family: 'blackboardregular';
	 color:white;
	text-align: center;
	font-size:2em;
	padding: 0 1em;
}
#repere1 h3{
	color: white;
text-align: center !important;
font-size: 1.3em;
width: 90%;
margin: 0 5% 1em;
}
.marque {
	padding:2em 0 30%;
	font-family: 'Lobster', sans-serif!important;
	font-size: 1.4em !important;
	color:#fff;
	font-weight: normal;
	width:300px !important;
	text-align: center;
	background: url("../images/black.png") repeat center 0px;
	position:absolute;
	top: -2em;
	right: -30px;
	z-index: 20;
	line-height: 1.5 !important;
	-webkit-transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	-o-transform: rotate(5deg);
	writing-mode: lr-tb;
}

.agendaDiv  h3{
	font-size:1em;
	text-align: center;
	width: 50%;
	float:left;
	padding: 0.5em 0;
	color:#666;
}
.centrage{
	text-align: center !important;
}
.prix {
	border-radius: 4px;
	padding: 0.5em;
	color: white !important;
	background: #D7352D;
	width: 90px !important;
	margin: 1em auto;
	height: 22px;
	font-weight: bold;
	float: none;
	line-height: 1;
	font-size: 1.3em;
}	

 .texte{
font-size: 1em;
margin: 1em 5%;
color:white;
text-align: justify;
width: 90%;

}
.texteSite{

font-size: 1.2em;
margin: 1em auto;
color:white !important;
text-align: justify;
    padding: 0 1em;
}
.choixDate{
	font-size: 1.3em;
	color:#fff;
	text-align: center;
}
.intro {
	font-size: 1.2em;
	text-align: justify;
	width: 100%;
}
.cercle{
		font-family: 'Lobster', sans-serif!important;
	margin:0.5em auto;
	border-radius:50%;
	background:#841713;
	width: 0.6em;
	height:0.6em;
	padding:0.3em 0.5em 0.5em;
	color:white;
	font-size:1.5em; 
	   text-align: center;
	   line-height: 0.8;
}
.jourPresent{
	margin:0 auto;
	width: 70%;
	text-align: center;
	font-size:1.2em; 
}
.jourPresent .dropdown{
	width: 45% !important;
	min-width: 200px;
	float: none !important;
	margin: 0.5em auto 1em !important;
	font-family: 'Asap', sans-serif;
	font-size: 1em;
	padding: 0.2em 0;
}
.grid-2 .dropdown {

	width: 66% !important;
	margin: 0 17% 1em!important;	
	font-size: 0.9em;
	font-family: 'Asap', sans-serif;
}
.detail{
	text-align: center;
	color: #666;

}
.jourPresent > * {
	color:white;
}
.trait{
	visibility: visible;
	margin: 1em 0 1.5em;
	  border: 0;
    height: 1px;
    background: #999;
    background-image: -webkit-linear-gradient(left, #fff, #999, #fff);
    background-image: linear-gradient(to right, #fff, #999, #fff);
}
#agenda3.agendaDiv {
    background: url(../images/black.png) repeat center top;
}
iframe{
	margin: 1em 0;
width: 100%;
height: 205px;
}
.grise > *{
	opacity: 0.5;
}
form {
	width:100%;
}
form p {
	width: 100%;
}
.vig{
	width:80%;
    max-width: 80px;
	margin: 1em 0 0.3em 0.3em ;
	border:#ccc 3px solid;
	border-radius: 50px;
	float: left;
}
.vig2{
	width: 100px;

	border-radius:50px;
	height:100px;
	margin:0.5em auto 0 ;
	border:#ccc 3px solid;
}
.marqueDiv{
	padding: 1em 0.5em 0;
	float: left;
}

.hcentre{
	text-align: center!important;
}
.desc2 {
	padding:1em;
	font-size: 1em;
	width: 100%;
	text-align: center;
}

.couleurLi {
font-family: 'Architects Daughter', cursive;
	color:#fff;
	font-size: 0.8em;
}
.marqueDiv .desc{
	font-size: 1.2em;
	margin:1.5em auto 0.5em;
	text-align: center;
}
.marqueDiv .desc2{
	padding:0.5em 1em 0.5em 0 ;
	font-size: 0.8em !important;
	font-family:'Asap', cursive;
	width: 90%;
	color: white;
	float: right;
	text-align: right;
}

#goFut{
	width: 50%;
	margin:1em 25%;
	font-size:1em;
	padding: 0.5em;
	background:#841713;
	font-family:'Asap', cursive;
	color: white;
	border-radius: 4px;
	border: none;
	-webkit-transition:background 1s ease;
	        transition:background 1s ease;
}
#annul1,#annul2,#annul3,#annul4,#annul5,#annul6,#annul7,#annul8,#annul9,#annul10,#annul11{
	float:none;
	width: 50%;
	margin:1em 25%;
	font-size:0.8em;
	padding: 0.3em;
	background:#841713;
	font-family:'Asap', cursive;
	color: white;
	border-radius: 4px;
	border: none;
	-webkit-transition:background 1s ease;
	        transition:background 1s ease;
}
#goFut:hover,#annul1:hover,#annul2:hover,#annul3:hover,#annul4:hover,#annul5:hover,#annul6:hover,#annul7:hover,#annul8:hover,#annul9:hover,#annul10:hover,#annul11:hover{
	background:#D33731;
}
.total{
	font-size:1.5em !important;
	width: 100% !important;
}
.cvg{
	font-size:1.1em !important;
	padding: 0.5em 0;
	width: 100% !important;
}
.selection {
	background:#f2f2f2;
	padding:0.5em 0.5em 0;
	margin:0 !important;
}
.rouge {
	color:#841713;
}
.qte{
	font-size:0.7em;
	text-align: center;
	padding: 0.5em;
	width: 90%;
	float: left;
}
.qte2{
	text-align: center;
position: relative;
z-index: 5;
}
.qte2 span{
	width: 100%;
	display:none;
		padding:1em 0.1em;
		font-size:0.8em;
		color:red;
position: absolute;
top: -115px;
left:0;

	}
.bordure {
	padding:0 0.5em 0;
	margin:0 !important;
}
.explic {
	    margin: 0.5em auto 1em;
    width: 92%;
    color: white;
    float: none
}
.etiquette{
	border-radius:8px !important;
	background: white;

}
.etiquette .cercle{
	margin: 0.5em auto;
	float: none;

}
.etiquette p{
	color :#666;
	text-align: center;
}
.etiquette h2{
	color :#D33731;
	text-align: center;
}
.texteCom{

	margin: 0 1.5em;
 font-size:1.1em;
}
.com{
 font-family: 'Architects Daughter', cursive;
 color :#D33731;
 font-size:1.5em;
}

.ruban {
	border-top-left-radius: 8px;
border-top-right-radius: 8px;
   width: 100%;
 	float:left;
	background:#841713;
	padding: 0;

   }
 #hor1,#horaire2,#horaire1{
 	 font-family: 'Architects Daughter', cursive;
 	 font-size:1.5em ;
 }
.ruban p {
	   font-family: 'Architects Daughter', cursive;
   font-size: 1.1em!important;
   color: #fff;
   margin:0px;
   padding: 15px 1em 0 0;
   width: 90%;
   	text-align: right;

   }
   .ruban h3{
	    font-size: 1.2em;
     width: 90%;
    padding: 0.5em 1em 0.2em 0 ;
	line-height: 1.1!important;
	font-weight: 700;
	color:#fff;
	text-align: right;
}
.col {
	width: 60%;
	float: left;
}
.annonce{
	text-align: center;
	
	font-size: 1.2em;
margin: 1em auto 0.5em;
width: 70%;
}
#valid1 span{
	width:auto;
	float:left;
	text-align: center;
}
#heure1,#heure2{
	width:80%;
	float: left;
	margin: 1em 10%;
	padding: 0.3em 0;
	font-size: 1em;
	font-family:'Asap', cursive;
	border-radius: 4px;
	border:none;
	text-align: center;
}
#coords{
	font-size:1.2em; 
}
#goH1{
	-webkit-transition:background 1s ease;
	        transition:background 1s ease;
	font-size: 1em;
	width:100%;
	float: left;
	margin: 4.7em 0 0;
	padding: 0.3em 0;
	font-family:'Asap', cursive;
	border-radius: 4px;
	background:#D33731;
	color: white;
	border:none;
}
#goH1:hover, #goH2:hover{
	background:#841713;
}
.fait{
	color:white;
	font-size:2em;
	font-family: 'Architects Daughter', cursive;
	text-align: center;
	float:none;
	margin: 0 auto;
}
.faitDroit{
	color:white;
	font-size:1.5em;
	font-family: 'Architects Daughter', cursive;
	text-align: center;

}
.impos{
	background:#D33731;
	line-height: 1;
	color:white;
	vertical-align: middle;
		padding:0.2em;
}
.jourFer{
	background:#d2d0e0;
	line-height: 1;
	padding:0.2em;
	vertical-align: middle;
}
#desinscription,#modif,#connexion{
	margin-bottom:8em;
	display:none;
}
#cb{
	width:200px;
	margin: 1em auto;
	font-family:'Asap', cursive;
}
#insc,#connex{
	width:60%;
	margin: 1em auto;
	font-family:'Asap', cursive;
	display:none;
}
#des,#mod,#connex2,.oub{
	width:60%;
	margin: 1em auto;
	font-family:'Asap', cursive;
}
#insc input,#connex input,#des input,#mod input,#connex2 input,.oub input,#cb input{
	font-family:'Asap', cursive;
	width: 100%;
	margin:1em 0;
	padding: 0.5em 0;
	border-radius:4px;
	border: #ccc 1px solid;
	font-size:1.1em;
	 text-align: center;
}
#insc label,#connex label,#des label,#mod label,#connex2 label,.oub label{
	width: 100%;
	margin:1em 0;
	padding: 0.5em 0;
	color:white;
	font-size: 1.1em;
	}
#insc textarea,#connex textarea,#des textarea,#mod textarea,#connex2 textarea{
	padding: 0.5em 0 ;
		width: 70%;
	margin:1em 15%;
	border-radius:4px;
	border: #ccc 1px solid;
	 text-align: center;
}
.inscH{
	display:none;
}
/* Cachons la case à cocher */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
 
/* on prépare le label */
[type="checkbox"]:not(:checked) + .labChec,
[type="checkbox"]:checked + .labChec {
  position: relative; /* permet de positionner les pseudo-éléments */
  padding: 0 0 0 25px !important; /* fait un peu d'espace pour notre case à venir */
  cursor: pointer;    /* affiche un curseur adapté */
  margin: 0 !important;
width: auto !important;
}
/* Aspect des checkboxes */
/* :before sert à créer la case à cocher */
[type="checkbox"]:not(:checked) + .labChec:before,
[type="checkbox"]:checked + .labChec:before {
  content: '';
  position: absolute;
  left:0; top: 2px;
  width: 17px; height: 17px; /* dim. de la case */
  border: 1px solid #aaa;
  background: #f8f8f8;
  border-radius: 3px; /* angles arrondis */
  box-shadow: inset 0 1px 3px rgba(0,0,0,.3) /* légère ombre interne */
}
 
/* Aspect général de la coche */
[type="checkbox"]:not(:checked) + .labChec:after,
[type="checkbox"]:checked + .labChec:after {
  content: '✔';
  position: absolute;
  top: 0; left: 4px;
  font-size: 14px;
  color: #09ad7e;
  -webkit-transition: all .2s;
          transition: all .2s; /* on prévoit une animation */
}
/* Aspect si "pas cochée" */
[type="checkbox"]:not(:checked) + .labChec:after {
  opacity: 0; /* coche invisible */
  -webkit-transform: scale(0);
          transform: scale(0); /* mise à l'échelle à 0 */
}
/* Aspect si "cochée" */
[type="checkbox"]:checked + .labChec:after {
  opacity: 1; /* coche opaque */
  -webkit-transform: scale(1);
          transform: scale(1); /* mise à l'échelle 1:1 */
}
/* aspect désactivée */
[type="checkbox"]:disabled:not(:checked) + .labChec:before,
[type="checkbox"]:disabled:checked + .labChec:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
/* styles de la coche (si cochée/désactivée) */
[type="checkbox"]:disabled:checked + .labChec:after {
  color: #999;
}
/* on style aussi le label quand désactivé */
[type="checkbox"]:disabled + .labChec {
  color: #aaa;
}
 
/* aspect au focus de l'élément */
[type="checkbox"]:checked:focus + .labChec:before,
[type="checkbox"]:not(:checked):focus + .labChec:before {
  border: 1px dotted blue;
}
#go,#goCon,#goCompte,#goDes,#goMod,#goCon2,#goOub{
	width: 104% !important;
	background:#841713;
	-webkit-transition:background ease 1s;
	        transition:background ease 1s;
	color: white;
	font-size: 1.2em;
	border-radius: 4px;
	border: none !important;
}
#goCb{
	cursor:pointer;
	width: 100% !important;
	background:#841713;
	-webkit-transition:background ease 1s;
	        transition:background ease 1s;
	color: white;
	font-size: 1.2em;
	border-radius: 4px;
	border: none !important;
}
#go:hover,#goCon:hover,#goCompte:hover,#goDes:hover,#goMod:hover,#goCon2:hover,#goOub:hover{
	background:#D33731;
}
.error-message {
	font-family:'Asap', cursive;
	color:#D33731;
	    text-align: center;
    font-size: 1.2em;
}
.message {
	text-align: center;
	
	background:white;
	padding: 2em 0;
	color:#666; 
	font-size:1.2em;
	width: 80%;
}
#agenda5 .bouton {
    width: 100%;
    margin: 1em 0;
    text-align: center;
    float: left;
    font-size: 1.3em;
}
#agenda5 {
	display:none ;
}
#pp{
	width:50%;
	min-width: 200px;
	margin:1em auto;
}
#menu_bar{
		display:none;
	}
.lien{
	font-size:0.8em;
}
@media (max-width:1270px){
	.menuResp{
		width: 300px;
		position:absolute;
		right:-3.5em;
		display:block;
		top:0;
	}
	.menuResp li{
		width: 71%;

		text-align: center;
		background:#D33731;
		padding: 0.2em ;
-webkit-transition:background ease 1s;
	    transition:background ease 1s;
	}
	.menuResp li:last-of-type{
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	padding: 0.2em 0.2em 0.4em;
}
	.menuResp li a{
		color:white;
	}
	.menuResp li:hover{
		background:#841713;
	}
	.menu {
		display:none;
	}
	#menu_bar{
		display:block;
		position: absolute;
		width: 100px;
		padding-top:0.5em;
	-webkit-transition:opacity ease 1s;
	        transition:opacity ease 1s;
	        right: 0;
	}
	#menu_bar:hover{
		opacity:0.5;
		cursor:pointer;
	}
	#menu_bar img{
		float:right;
		margin-right:1em;
	}
}
@media (max-width:900px){
	.ruban .grid-2{
		margin: 0 auto !important;
		float: none;
		width: 100px;
	}
	.ruban .grid-4 >*{
		text-align: center;
		padding: 0.2em 0;
		width: 100%;
		float: left;
	}
	.ruban .grid-4{
		width: 100%;
		margin: 0 auto !important;
		float: none;
	}

}
@media (max-width:870px){
		.largeGrid {
	    margin: 0px auto 1em !important;
	}
	.largeGrid .bouton{
		margin-top:8em;
	}
	.menuResp{
		width: 100%;
		float:left;
		position: initial;
		margin: 1em 0 0;
	}
	.menuResp li{
		width: 100%;
	}
	.title .gridLogo{
		display:none;
	}
}
@media (max-width:770px){
	.explic {
	    margin: 1em;
	}
	.texte {
	    margin: 1em;
	}
	.taille3,.taille4,.taille5,.taille6,.taille7,.taille8 {
		    width: 50% !important;
	    margin-top: 1em;
	}
	
		.largeGrid {
	    float: none!important;
	}
	.titraille{
		width: 80%;
		min-width: initial;
	}
	.titraille h1{
		font-size:1.2em;
	}
	.gridLogo{
		margin: 0.5em auto !important;
		width: 100px !important;
		float: none !important;
	}

	.message{
		width: auto;
	}
}
@media (max-width:630px){
	.title {
    position: inherit;
}
	#goH1{
		margin: 0 10% 1em !important;
    	width: 80%;
	}
	#insc, #connex {
	    width: 80%;
	}
	.topMarge {
	    margin-top: 1.5em !important;
	}

}

@media (max-width:520px){
	.marqueB li .note .description{
		left:1em;
	}
	.titraille{
		width: 75%;
	}
	.titraille h1 {
	    font-size: 1.1em;
	    margin :0 !important;
	}
	.titraille h2 {
	    margin :0 !important;
	}
	.choixDate{
		width: auto !important;
	}
	footer{
		position: inherit !important;
		    padding: 1em 0 2em;
		    text-align: center;
	}
	.paye{
		margin-top: 2em !important;
	}
	#go, #goCon, #goCompte, #goDes, #goMod, #goCon2 {
    width: 90% !important;
    margin: 1em 5%!important;
    padding: 5%!important;
    background: #841713;
    -webkit-transition: background ease 1s;
    transition: background ease 1s;
    color: white;
    font-size: 1.2em;
    border-radius: 4px;
    border: none !important;
}
#insc input, #connex input, #des input, #mod input, #connex2 input {
    font-family: 'Asap', cursive;
    width: 80%;
    margin: 1em 5%;
    padding: 5% 0;
    border-radius: 4px;
    border: #ccc 1px solid;
    font-size: 1.1em;
    text-align: center;
}
#insc label, #connex label, #des label, #mod label, #connex2 label {
    width: 80%;
    margin: 1em 5%;
    padding: 5% 0;
    color: white;
    font-size: 1.1em;
    text-align: center;
}
	.title{
		position:inherit;

	}
	.topMarge {
	    margin-top: 1em !important;
	}
	table{
		width: 95%;
	}
	td,th{
		font-size:0.6em;
	}
	.etiquette {
	    margin: 1em 0.5em;
	}

}
@media (max-width:450px){
	.taille3,.taille4,.taille5,.taille6,.taille7,.taille8 {
		    width: 100% !important;
	}
	#menu_bar img{
		width:40px;
	}
	.title {
    position: inherit;
    background: rgba(132, 23, 19,1);
}
	body{
		background:#595766;
	}
	.titraille h1 {
	    font-size: 1em;
	    width: 100%;
	}
	.titraille {
	    width: 100%;
	    margin-left:0;
	}

}
@media (max-width:430px){
	.titraille {
	    width: 90%;
	    margin:0 5%;
	}
	.titraille h1 {
	    font-size: 1.1em;
	   text-align: center;

	}
	.titraille h2 {
	   text-align: center;
	}
	#menu_bar img {
    width: 80%;
    float: none;
    margin: 0 10%;
}
	#menu_bar {
    top: 8.5em;
    right: 2em;
    background: #841713;
    width: 50px;
    border-radius: 4px;
}
	#titre.menuResp{
		display:block !important;
	}
}