/* =Common Styles
-------------------------------------------------------------- */

html, body {
  height: 100%; margin:0; padding:0; font-family: 'Lato', Helvetica, sans-serif;
}

.ContainerSite  { display:block; float:left; width:100%; /*height:100% !important;*/ }


*, *:focus {
  outline: none !important;
}

img {
  max-width: 100%;
}

p                      	{ margin:0 0 1em 0; text-align:justify; font-size:13px; line-height:20px; color:#333333; }
p.center               	{ margin:0 0 1em 0; text-align:center;  font-size:13px; line-height:20px; color:#333333; }
p.ok                   	{ margin:0 0 1em 0; text-align:center; font-size:13px; line-height:20px; color:#333333; }
p.attention            	{ margin:0 0 1em 0; text-align:center; font-size:13px; line-height:20px; color:#0d70bb; }
span.DateVue            { margin:0 0 1em 0; text-align:justify; font-size:11px; line-height:20px; color:#333333; }

a,a:link               	{ color: #0d70bb; text-decoration: none; }
a:hover                	{ color: #333333; text-decoration: none; }

h1, h2, h3, h4, h5, h6 	{ font-weight:normal; color:#0d70bb; letter-spacing:1px;   }
h1                    	{ font-size:22px; margin-bottom:5px; margin-top: -7px; letter-spacing:0px; }
h2                    	{ font-size:14px; margin-bottom:0px; margin-top: 1px; }
h3                     	{ font-size:13px; margin-bottom:5px;}
h4                    	{ font-size:12px; margin-bottom:5px; }
h5                     	{ font-size:11px; margin-bottom:5px; }

span.petit 	 { font-size:11px; color:#333333; }


hr                      { border:none; border-top:1px dotted #333333; color:#333333; height: 1px; width:100%; position:relative; float:left; margin-bottom:17px;  }

img.border	   			{ border: 1px solid #0d70bb; display:block; }
img.Right				{ display:block; margin-left:10px;  float:right;}
img.Left				{ display:block; margin-right:10px; float:left; }
img.RightBorder			{ display:block; margin-left:10px;  float:right; border:1px solid #0d70bb; }
img.LeftBorder			{ display:block; margin-right:10px; float:left; border:1px solid #0d70bb; }
img.marginrightnoborder { display:block; margin-right:10px; }
img.blancandwhite		{ filter: grayscale(100%); -webkit-filter: grayscale(100%);  -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); }

img.blancandwhitehover		{ filter: grayscale(100%); -webkit-filter: grayscale(100%);  -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); -webkit-transition: all 0.7s linear;  -moz-transition: all 0.7s linear;  -o-transition: all 0.7s linear;  transition: all 0.7s linear; }
img:hover.blancandwhitehover		{ filter: grayscale(0%); -webkit-filter: grayscale(0%);  -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); }

.clear { clear:both; }

span.couleur { color: #0d70bb; }

/***************************/
/*HEADER       */
/***************************/
.HeaderTop { display:block; width:100%; display:block; position:relative; margin:0 auto; }
.ContentSite { width:100%; max-width:930px; display:block; position:relative; margin:0 auto; }
.ContentSiteInside { width:96%; display:block; position:relative; margin-left:2%; margin-top:2%; background-color:#ffffff; }

.RSTop { width:30%; display:block; position:relative; float:left; }
.BoutonTop { width:70%; display:block; position:relative; float:left; }
.LienTop { width:100%; display:block; float:left; position:relative; margin:1% 0%; background-color:#ffffff; padding:0px 0px 5px 0px; font-size:10px; }

/***************************/
/*BLOC ACTUALITES          */
/***************************/
.ActualitesBloc { position:relative; float:left; width:100%; display: block; }
.ActualitesBlocInside { position:relative; float:left; width:15%; display: block; }
.ActualitesTxtInside { position:relative; float:left; width:85%; display: block; }

a.BoutonLink, 
a:link.BoutonLink		{ float:right; margin-left:15px; margin-top:-10px; font-size:12px; position: relative; height:30px; padding:8px 8px 8px 39px; display:block; color:#fff; border:1px solid #333; background-color:#333; text-align:left; -webkit-transition: all 0.5s linear;  -moz-transition: all 0.5s linear;  -o-transition: all 0.5s linear;  transition: all 0.5s linear; }
a:hover.BoutonLink		{  background-color:#fff; color:#0d70bb; border:1px solid #0d70bb; }

i.BoutonFontAwesomeA:after { content: "\f1ea"; font-family: 'FontAwesome'; font-style: normal;  text-decoration: inherit; position: absolute; font-size: 20px; color: #fff;  top: 50%;  left: 21px; margin: -11px 0 0 -12px; z-index: 1; }
i.BoutonFontAwesomeB:after { content: "\f1d8"; font-family: 'FontAwesome'; font-style: normal;  text-decoration: inherit; position: absolute; font-size: 20px; color: #fff;  top: 50%;  left: 21px; margin: -12px 0 0 -12px; z-index: 1; }
i.BoutonFontAwesomeC:after { content: "\f04a"; font-family: 'FontAwesome'; font-style: normal;  text-decoration: inherit; position: absolute; font-size: 20px; color: #fff;  top: 50%;  left: 21px; margin: -12px 0 0 -12px; z-index: 1; }


a:hover.BoutonLink i.BoutonFontAwesomeA:after,
a:hover.BoutonLink i.BoutonFontAwesomeB:after,
a:hover.BoutonLink i.BoutonFontAwesomeC:after {color: #0d70bb; }
/***************************/
/*   ACTUALITES      */
/***************************/
.UrlRealisation { display:block; float:left; width:100%; position:relative; }

/* =Actus
-------------------------------------------------------------- */
section.BlocActus { display:block; width:100%; max-width:1170px; margin:0 auto; overflow:hidden; position: relative; }

a img.blancandwhitehover		{ width:100%; filter: grayscale(100%); -webkit-filter: grayscale(100%);  -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%);  -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear;  -o-transition: all 0.5s linear;  transition: all 0.5s linear; }
a:hover img.blancandwhitehover	{ filter: grayscale(0%); -webkit-filter: grayscale(0%);  -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); }


/***************************/
/*   ACTUALITES      */
/***************************/
.UrlRealisation { display:block; float:left; width:100%; position:relative; }

@media (max-width: 640px) {
  .BlocActus { width:98%; }


}

/***************************/
/*      LINKS ICONES       */
/***************************/
a.UrlPDF { padding:7px 0 0 40px; font-size:1.0em; font-weight:bold; position:relative; color:#0d70bb; float:left; display:block; height:30px; background: url("../upload/tinymce/image/icon_pdf.png") no-repeat 0px 0px; }
a:hover.UrlPDF { text-decoration:none; background: url("../upload/tinymce/image/icon_pdf.png") no-repeat 0px -50px; color:#424040; }
a.UrlPhotos { padding:7px 0 0 40px; font-size:1.0em; font-weight:bold; position:relative; color:#0d70bb; float:left; display:block; height:30px; background: url("../upload/tinymce/image/icon_picture.png") no-repeat 0px 0px; }
a:hover.UrlPhotos { text-decoration:none; background: url("../upload/tinymce/image/icon_picture.png") no-repeat 0px -50px; color:#424040; }
a.UrlLinks { padding:7px 0 0 40px; font-size:1.0m; font-weight:bold; position:relative; color:#0d70bb; float:left; display:block; height:30px; background: url("../upload/tinymce/image/icon_link.png") no-repeat 0px 0px; }
a:hover.UrlLinks { text-decoration:none; background: url("../upload/tinymce/image/icon_link.png") no-repeat 0px -50px; color:#424040; }
a.UrlMail { padding:7px 0 0 40px; font-size:1.0m; font-weight:bold; position:relative; color:#0d70bb; float:left; display:block; height:30px; background: url("../upload/tinymce/image/icon_mail.png") no-repeat 0px 0px; }
a:hover.UrlMail { text-decoration:none; background: url("../upload/tinymce/image/icon_mail.png") no-repeat 0px -50px; color:#424040; }


/***************************/
/*ARTICLE SUIV/PREC        */
/***************************/
.ArticlePrecedent   	{ position:relative; float:left; width:50%;  margin:20px 0 20px 0; clear:both; }
.ArticleSuivant 		{ position:relative; float: right; width:50%; margin:20px 0 20px 0; text-align:right; }
a.barrelink 			{ border-bottom:none; display:block; height:48px; padding-right:35px; padding-left:15px; padding-top:0px; background:transparent url(../../../upload/tinymce/image/ZAP/background-link-right.png) right 0 no-repeat; color:#0d70bb; }
a.barrelink:hover 		{ border-bottom:none; background:transparent url(../../../upload/tinymce/image/ZAP/background-link-right.png) right -48px no-repeat; color:#333333; }
a.barrelinkleft 		{ border-bottom:none; display:block; height:48px; padding-left:35px; padding-right:15px; padding-top:0px; background:transparent url(../../../upload/tinymce/image/ZAP/background-link-left.png) left 0 no-repeat; color:#0d70bb; }
a.barrelinkleft:hover 	{ border-bottom:none; background:transparent url(../../../upload/tinymce/image/ZAP/background-link-left.png) left -48px no-repeat; color:#333333; }


/***************************/
/*     FOOTER              */
/***************************/
footer { clear:both; display:block; width:96%; height:120px; display:block; position:relative; margin:0 auto; padding:2%; background-color:#333; }
footer span.petit { color:#fff; }
footer div.urlweb { display:block; width:100%; float:right; text-align:right; }
footer div.urlweb a,
footer div.urlweb a:link { text-align:right; color:#fff; }
footer div.urlweb a:hover { text-align:right; color:#0d70bb; }
footer div.urlrs { float:right; display:block; width:100%; margin:15px 0 15px 15px; }
footer div.urlrs a { float:right; display:block; width:25px; height:25px; margin:0px 0 15px 15px; }

footer div.urlrs a i.Facebook::before,
footer div.urlrs a:link i.Facebook::before  { text-align:right; content: "\f230"; font-family: 'FontAwesome'; font-style: normal;  text-decoration: inherit; font-size: 20px; color: #fff; display:block; width:25px; height:25px; }
footer div.urlrs a i.Youtube::before,
footer div.urlrs a:link i.Youtube::before  { text-align:right; content: "\f166"; font-family: 'FontAwesome'; font-style: normal;  text-decoration: inherit; font-size: 20px; color: #fff; display:block; width:25px; height:25px; }
footer div.urlrs a i.Instagram::before,
footer div.urlrs a:link i.Instagram::before  { text-align:right; content: "\f16d"; font-family: 'FontAwesome'; font-style: normal;  text-decoration: inherit; font-size: 20px; color: #fff; display:block; width:25px; height:25px; }
footer div.urlrs a i.Linkedin::before,
footer div.urlrs a:link i.Linkedin::before  { text-align:right; content: "\f08c"; font-family: 'FontAwesome'; font-style: normal;  text-decoration: inherit; font-size: 20px; color: #fff; display:block; width:25px; height:25px; }

footer div.urlrs a:hover i.Facebook::before,
footer div.urlrs a:hover i.Youtube::before,
footer div.urlrs a:hover i.Instagram::before,
footer div.urlrs a:hover i.Linkedin::before  { color:#0d70bb; }

/***************************/
/*MULTIPAGE                */
/***************************/
.divmultipage td   { font-size:12px; }
a.hrefmultipage, a.hrefmultipage:visited   { text-decoration: none; color: #0d70bb;  border:1px solid #0d70bb; padding:3px 6px; cursor:pointer; font-size:12px; }
a.hrefmultipage:hover        { text-decoration: none; color: #ffffff; border:1px solid #333333; padding:3px 6px; background-color:#333333; cursor:pointer; }
.divmultipage b u { text-decoration: none; color: #ffffff; border:1px solid #0d70bb; padding:3px 6px; background-color:#0d70bb; cursor:pointer;}
.divmultipage {   margin-top:10px; margin-bottom:25px; display:block; }

/***************************/
/*FORMULAIRES              */
/***************************/
/**** advanced input styling ****/
/* placeholder */
#ccab, .ccab 						{ visibility: hidden; display:  none;}


#form ul							{ padding: 0; margin: 0; }
#form ul li							{ list-style-type:none;  }
#form ::-webkit-input-placeholder 	{ font-style: italic; }
#form input:-moz-placeholder,
#form textarea:-moz-placeholder 	{ color: rgb(190, 188, 188); font-style: italic; } 
#form input, select 				{ outline: none; }

.form li 			{ width:49%; float:left; display:block; margin-right:2%; margin-bottom:1%; }
.form li.last 		{ width:49%; float:left; display:block; margin-right:0%; margin-bottom:1%; }
.form li.titre 		{ width:100%; float:left; display:block; margin-right:0%; margin-bottom:1%; font-size:15px; }
.form li.untiers 	{ width:33.3%; float:left; display:block; margin-right:0%; margin-bottom:1%; font-size:14px; }
.form li.unquart 	{ width:25%; float:left; display:block; margin-right:0%; margin-bottom:1%; font-size:14px; }
.form li.sixieme 	{ width: calc(30% - 5px); float:left; display:block; margin-right:1%; margin-top:11px; margin-bottom:15px; padding-left:5px; color:#767676; }
.form li.sixiemea 	{ width:69%; float:left; display:block; margin-right:0%; font-size:12px; margin-top:11px; margin-bottom:15px; }
.form li.note 		{ border: 1px solid #333333; -webkit-appearance: textfield; -webkit-box-sizing: content-box; -moz-box-sizing : content-box; box-sizing : content-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  width: calc(49% - 2px); margin-top:4px; background-color:#fff; height:37px; }

/* all the input except submit and checkbox */
#form input:not([type="checkbox"]) 		 { color:#757575; width: 96%; margin-top: 4px; padding: 10px 2% 10px 2%; border: 1px solid #333333; -webkit-appearance: textfield; -webkit-box-sizing: content-box; -moz-box-sizing : content-box; box-sizing : content-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  -webkit-transition: all 0.2s linear;  -moz-transition: all 0.2s linear;  -o-transition: all 0.2s linear;  transition: all 0.2s linear; }
#form input:not([type="checkbox"]):active,
#form input:not([type="checkbox"]):focus { border: 1px solid #0d70bb; background-color:transparent;  } 

#form input:not([type="checkbox"]).petit	 {  width: 44.4%; }
/* all the textarea */
#form textarea 		 { color:#757575; width: 96%; height:155px; margin-top: 4px; padding: 10px 2% 10px 2%; border: 1px solid #333333; -webkit-appearance: textfield; -webkit-box-sizing: content-box; -moz-box-sizing : content-box; box-sizing : content-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  -webkit-transition: all 0.2s linear;  -moz-transition: all 0.2s linear;  -o-transition: all 0.2s linear;  transition: all 0.2s linear; }
#form textarea:active,
#form textarea:focus { border: 1px solid #0d70bb; background-color:transparent;  } 

/* all the select */
#form select 		{ color:#757575; width: 96%; margin-top: 4px; padding: 10px 2% 8px 2%; color:#757575; border: 1px solid #333333; -webkit-appearance: textfield; -webkit-box-sizing: content-box; -moz-box-sizing : content-box; box-sizing : content-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  -webkit-transition: all 0.2s linear;  -moz-transition: all 0.2s linear;  -o-transition: all 0.2s linear;  transition: all 0.2s linear; }
#form select:active,
#form select:focus  { border: 1px solid #0d70bb; background-color:transparent; color:#0d70bb;  } 


/*styling both submit buttons */
#form li.button input 		{ width: 120px; height:26px; cursor: pointer; background-color:#0d70bb; padding: 8px 5px; color: #fff; font-size: 1.2em; letter-spacing:1px; border: 1px #0d70bb solid; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;  -o-transition: all 0.2s linear;  transition: all 0.2s linear; }
#form li.button input:hover { background-color:#333333; border: 1px solid #333333; }
#form li.button input:active,
#form li.button input:focus { background-color:#0d70bb; border: 1px solid #0d70bb; }


@media only screen and (max-width: 900px) {
.ActualitesTxtInside { float:right; width:83%; }
#form input:not([type="checkbox"]).petit { width: 44%; }
}
@media only screen and (max-width: 700px) {
.ActualitesTxtInside { float:right; width:83%; }
a:link.BoutonLink		{ float:right; margin-left:7px; margin-top:-10px; font-size:12px; position: relative; height:30px; padding:8px 4px 8px 37px; display:block; color:#fff; border:1px solid #333; background-color:#333; text-align:left; -webkit-transition: all 0.5s linear;  -moz-transition: all 0.5s linear;  -o-transition: all 0.5s linear;  transition: all 0.5s linear; }
.BoutonLinkListeActus { display:none; }
#form input:not([type="checkbox"]).petit { width: 43%; }
}
@media only screen and (max-width: 580px) {
.RSTop { width:100%; margin-bottom:20px; }
.BoutonTop { width:100%; margin-bottom: 20px; }
.LienTop { margin:4% 0%; }
.ActualitesTxtInside { float:right; width:81%; }
a:link.BoutonLink		{ float:right; margin-left:10px; margin-top:-10px; font-size:12px; position: relative; height:30px; padding:8px 8px 8px 39px; display:block; color:#fff; border:1px solid #333; background-color:#333; text-align:left; -webkit-transition: all 0.5s linear;  -moz-transition: all 0.5s linear;  -o-transition: all 0.5s linear;  transition: all 0.5s linear; }
.BoutonLinkListeActus { display:block; }
#form input:not([type="checkbox"]).petit { width: 43%; }
}
@media only screen and (max-width: 420px) {
.RSTop { width:100%; margin-bottom:20px; }
.BoutonTop { width:100%; margin-bottom: 20px; }
.LienTop { margin:4% 0%; }
.ActualitesTxtInside { float:right; width:81%; }
a:link.BoutonLink		{ float:left; margin-left:0px; margin-right:15px; font-size:11px; padding:8px 3px 8px 37px; }
a.barrelink 			{ font-size:11px; }
a.barrelinkleft 		{ font-size:11px; }
.BoutonLinkListeActus { display:none; }
#form input:not([type="checkbox"]).petit { width: 41%; }
}