

/* =Common Styles
-------------------------------------------------------------- */

html, body {
  height: 100%; margin:0; padding:0; font-family: 'Lato', Helvetica, sans-serif;
}






*, *:focus {
  outline: none !important;
}

img {
  max-width: 100%;
}

p                      	{ font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:13px; color:#000000; margin:0 0 1em 0; line-height:16px; }
p.center               	{ font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:13px; color:#000000; margin:0 0 1em 0; text-align:center; line-height:16px; }
p.ok                   	{ font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:13px; color:#000000; margin:0 0 1em 0; text-align:center; line-height:16px; }
p.attention            	{ font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:13px; color:#e20025; margin:0 0 1em 0; text-align:center; line-height:16px; }

a,a:link               	{ color: #e20025; text-decoration: none; }
a:hover                	{ color: #000000; text-decoration: none; }

a.desk,a:link.desk             { color: #000000; text-decoration: none; margin-bottom:5px; }
a:hover.desk               	{ color: #000000; text-decoration: none; }
a.desk::before { content: ""; display:block; float:left; background-image:url(../upload/tinymce/image/barre-desk.jpg); width:28px; height:2px; margin-top: 10px; margin-right: 10px; }

h1, h2, h3, h4, h5, h6 	{ color:#000000; letter-spacing:1px;   font-family:'Roboto',verdana,sans-serif; font-weight:500;  }
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:#000000; }


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 #e20025; 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 #e20025; }
img.LeftBorder			{ display:block; margin-right:10px; float:left; border:1px solid #e20025; }
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: #e20025; }






.ContainerSite  { display:block; float:left; width:100%; clear:both; position:relative; /*height:100% !important;*/ }

.header { position:relative; width:100%; height:auto !important; display:block; left:0; top:0; float:left; background-color:#253c57; }
.picture { width:100%; max-width:1200px; margin:0 auto; z-index:2; position:relative; background-color:#253c57; }
.picture img { width:100%; height:auto !important; display:block; float:left; }


.Content { width:100%; display:block; position:relative; float:left;  clear:both; }
.ContentSite { width:100%; max-width:800px; display:block; position:relative; margin:0 auto 0 auto; }
.ContentSiteInside { width:100%; display:block; position:relative; float:left; background-color:#ffffff; margin:25px auto 0 auto; }

.rowcol {   position:relative;   float:left; display: flex;  width:100%; }
.Col50A { width:47.5%; margin-right:2.5%; position:relative; display:block;  float:left; clear:both; margin-top:40px; margin-bottom:40px; flex: 1;   }
.Col50B { width:47.5%; margin-left:2.5%; position:relative;display:block;  float:left; margin-top:40px; margin-bottom:40px; flex: 1; }

.Col50A h2 { font-family:'Roboto',verdana,sans-serif; font-weight:500; font-size:23px; color:#000000; position:absolute; bottom:30px; left:0; clear:both;  width:100%; display:block; float:left; }
.Col50A h2 div { color:#969eae;letter-spacing:1px;   font-family:'Roboto',verdana,sans-serif; font-weight:700; width:100%; display:block; float:left; font-size:18px; line-height: 30px; }
.Col50A span { position:absolute; bottom:0px; left:0;  border:3px solid #e20025; width:60px; display:block; float:left; }

.RSTop { width:30%; display:block; position:relative; float:left; margin-top:20px; }
.BoutonTop { width:70%; display:block; position:relative; float:left; }
.LienTop { font-family:'Roboto',verdana,sans-serif; font-weight:400; width:100%; display:block; float:left; position:relative; margin:1% 0%; background-color:#ffffff; padding:0px 0px 5px 0px; font-size:12px; }

/***************************/
/*BLOC ACTUALITES          */
/***************************/
.ActualitesBloc { position:relative; float:left; width:100%; display: block; margin-bottom:25px; }
.ActualitesBlocInside { position:relative; float:left; width:40%; display: block; margin-right:3%; }
.ActualitesTxtInside { position:relative; float:left; width:57%; display: block; }
.ActualitesTxtInside p { font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:13px; color:#000000; margin-top:5px; line-height:16px; }
.ActualitesTxtInside h2 { font-family:'Roboto',verdana,sans-serif; font-weight:500; font-size:18px; color:#000000; margin-top:10px; }
.ActualitesTxtInside a, .ActualitesTxtInside a:link  { color: #000000; text-decoration: none; padding-bottom:4px; border-bottom:2px solid #000; font-family:'Roboto',verdana,sans-serif; font-weight:500; font-size:12px; margin-top:8px;display: block; float: left; }
.ActualitesTxtInside a:hover { color: #000000; text-decoration: none; border-bottom:2px solid transparent; }
span.DateVue            { font-family:'Roboto',verdana,sans-serif; font-weight:300; text-align:left; font-size:12px; color:#000000; }

.RSNews { color:#253c57; text-align: left; font-family:'Roboto',verdana,sans-serif; font-size:0.8em; font-weight:700; }
a.BoutonLink, 
a:link.BoutonLink		{ font-family:'Roboto',verdana,sans-serif; border-radius:7px; float:right;  margin-top:30px; margin-left:15px; font-size:0.8em; font-weight:700; position: relative; height:30px; padding:12px 8px 12px 39px; display:block; color:#fff; border:1px solid #253c57; background-color:#253c57; 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:#e20025; border:1px solid #e20025; }

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: "\f137"; 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: #e20025; }

#colA {
  clear:both;
column-count: 1;
  margin-top: 20px;
display: block;
float: left;
width: 100%;
  }
#col {
  clear:both;
column-count: 2;
  column-gap: 5%;
  margin-top: 20px;
display: block;
float: left;
  }
#colA p,
#col p { font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:14px; color:#000000; margin-top:5px; line-height:20px; }
#colA p.chapeau, #col p.chapeau { font-family:'Roboto',verdana,sans-serif; font-weight:500; font-size:14px; color:#000000; margin-top:5px; line-height:20px; }

/**** pagination ****/
.pagination-wrapper {
  text-align: center;
  margin-top: 30px;
  margin-bottom: 30px;
  width: 100%;
  float: none;
  clear: both;
  float:left;
}

@media (max-width: 991px) {
  .pagination-wrapper {
    text-align: left;
  }
}

.pagination-wrapper .pg-pagination {
  display: inline-block;
  overflow: hidden;
  list-style-type: none;
  text-align: center;
}

.pagination-wrapper .pg-pagination li {
  float: left;
  margin-right: 10px;
}

@media (max-width: 767px) {
  .pagination-wrapper .pg-pagination li {
    margin-right: 5px;
  }
}

.pagination-wrapper .pg-pagination li:last-child {
  margin-right: 0;
}

.pagination-wrapper .pg-pagination li a {
  font-family:'Roboto',verdana,sans-serif; 
  font-weight:300;
  background-color: transparent;
  width: 22px;
  height: 22px;
  line-height: 22px;
  font-size: 12px;
  color: #253c57;
  border: 1px solid #253c57;
  display: block;
  border-radius: 0;
}

@media (max-width: 991px) {
  .pagination-wrapper .pg-pagination li a {
    width: 22px;
    height: 22px;
    line-height: 21px;
    font-size: 12px;
  }
}

.pagination-wrapper .pg-pagination .active a,
.pagination-wrapper .pg-pagination li a:hover {
  background: #e20025;
  border-color: #e20025;
  color: #fff;
}

.pagination-wrapper .pg-pagination .fi:before {
  font-size: 11px;
}

.pagination-wrapper-left {
  text-align: left;
}

.pagination-wrapper-right {
  text-align: right;
}

@media screen and (min-width: 1200px) {
  .pagination-wrapper-right {
    padding-right: 50px;
  }
}

@media (max-width: 991px) {
  .pagination-wrapper-right {
    margin-top: 45px;
    text-align: left;
  }
}

.pagination-wrapper-center {
  text-align: center;
}



/***************************/
/*HEADER       */
/***************************/
.HeaderTop { display:block; width:100%; display:block; position:relative; margin:0 auto; }

/***************************/
/*   ACTUALITES      */
/***************************/
.UrlRealisation { display:block; float:left; width:100%; position:relative; }

/***************************/
/*      LINKS ICONES       */
/***************************/
a.UrlPDF { padding:7px 0 0 40px; font-size:1.0em; font-weight:bold; position:relative; color:#e20025; 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:#e20025; 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:#e20025; 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:#e20025; 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   	{ color:#000; font-family:'Roboto',verdana,sans-serif; font-weight:500; font-size:15px; position:relative; float:left; width:47%;  margin:20px 0 60px 0%; clear:both; overflow:visible; }
.ArticleSuivant 		{ color:#000;font-family:'Roboto',verdana,sans-serif; font-weight:500; font-size:15px;position:relative; float: right; width:47%; margin:20px 0% 60px 0; text-align:right; overflow:visible; }
a.barrelink 			{ border-bottom:none; display:block; height:48px; padding-right:60px; padding-left:15px; padding-top:10px; background:transparent url(../upload/tinymce/image/background-link-right.png) right 0px no-repeat; color:#000000;  -webkit-transition: all 0.5s linear;  -moz-transition: all 0.5s linear;  -o-transition: all 0.5s linear;  transition: all 0.5s linear; }
a.barrelink:hover 		{ border-bottom:none; color:#000000; padding-right:70px;}
a.barrelinkleft 		{ border-bottom:none; display:block; height:48px; padding-left:60px; padding-right:15px; padding-top:10px; background:transparent url(../upload/tinymce/image/background-link-left.png) left 0px no-repeat; color:#000000;  -webkit-transition: all 0.5s linear;  -moz-transition: all 0.5s linear;  -o-transition: all 0.5s linear;  transition: all 0.5s linear; }
a.barrelinkleft:hover 	{ border-bottom:none; color:#000000; padding-left:70px; }
.ArticlePrecedent span    	{ font-family:'Roboto',verdana,sans-serif; font-weight:500; font-size:15px; font-style:italic; display:block; margin-top:-10px; }
.ArticleSuivant span 		{ font-family:'Roboto',verdana,sans-serif; font-weight:500; font-size:15px; font-style:italic; display:block;  margin-top:-10px; }
.ArticlePrecedent .petitmobile,
.ArticleSuivant .petitmobile { display:none; }
@media only screen and (min-width: 0px) and (max-width: 990px) {
.ArticlePrecedent { margin: 20px 0 60px 0%; }
.ArticleSuivant { margin: 20px 0% 60px 0; }
}

/***************************/
/*     FOOTER              */
/***************************/
footer { clear:both; display:block; width:96%; display:block; position:relative; margin:0 auto; padding:3% 2% 1% 2%; background-color:#253c57; }

footer img.imgfooter {
max-width: 100%;
margin: 0 auto;
display: block;
}

footer a.linkfooter { font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:25px; color:#fff; text-decoration:none; }
footer a.linkfooter:hover { color:#fff; text-decoration:none; }

footer p.copyright { font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:13px; color:#fff; text-decoration:none; text-align:center; margin-top:30px; margin-bottom:0; }
footer p.copyright a { font-family:'Roboto',verdana,sans-serif; font-weight:300; font-size:13px; color:#fff; text-decoration:none; }
footer p.copyright a:hover { color:#fff; text-decoration:none; }
/***************************/
/*MULTIPAGE                */
/***************************/
.divmultipage td   { font-size:12px; }
a.hrefmultipage, a.hrefmultipage:visited   { text-decoration: none; color: #e20025;  border:1px solid #e20025; 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 #e20025; padding:3px 6px; background-color:#e20025; 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 #e20025; background-color:transparent;  } 

#form input:not([type="checkbox"]).petit	 {  width: 44%; }
/* 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 #e20025; 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 #e20025; background-color:transparent; color:#e20025;  } 


/*styling both submit buttons */
#form li.button input 		{ width: 120px; height:26px; cursor: pointer; background-color:#e20025; padding: 8px 5px; color: #fff; font-size: 1.2em; letter-spacing:1px; border: 1px #e20025 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:#e20025; border: 1px solid #e20025; }








@media (max-width: 800px) {
.ContentSite { width:96%; max-width:800px; padding:0 2%; display:block; position:relative; margin:0 auto 0 auto; }

.header { background-color:transparent; }
.picture { width:96%; padding:0 2%; max-width:1200px; margin:0 auto; z-index:2; position:relative; }
#form input:not([type="checkbox"]).petit { width: 44%; }
}

@media (max-width: 768px) {

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 (max-width: 600px) {
.RSTop { width:100%; margin-bottom:20px; }
.BoutonTop { width:100%; margin-bottom: 20px; }
.LienTop { margin:4% 0%; }
a:link.BoutonLink		{ float:left; margin-left:0px; margin-right:15px; font-size:11px; padding:8px 3px 8px 37px; }
.BoutonLinkListeActus { display:block; }
#form input:not([type="checkbox"]).petit { width: 43%; }
#col {
  column-count: 1;
}

}

@media (max-width: 480px) {
.RSTop { width:100%; margin-bottom:20px; }
.BoutonTop { width:100%; margin-bottom: 20px; }
.LienTop { margin:4% 0%; }

.ActualitesBlocInside { width:100%; margin-right:0%; margin-bottom:2%; }
.ActualitesTxtInside { width:100%; }

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%; }


footer { padding:5% 2%; }
}


@media (max-width: 320px) {

}
