/************* MAP CSS *****************
1 - Reset CSS
2 - Font face
3 - hacks joomla
4 - Structure site
5 - Header
6 - Accueil / blog
7 - Menu top
8 - Blocs top - acces rapide
9 - footer
10 - ariane
11 - article
*****************************************/
/** COULEURS **/
/** bleu foncé : rgb(35,52,68) **/
/** bleu moyen : rgb(143,163,174) **/
/** bleu clair : rgb(190,218,230) **/
/**************************************************************** 1 - Reset CSS **/
/**** boutons template ****/
/***************************** categorie image **/

.nav-toggle:checked ~ nav {
  display: block;
}

.customdeco {
  text-align: right;
}
.customdeco p {
  margin: 0;
  font-weight: bold;
  color: #fff;
}
.pn-res-recherche {
  float: right;
}

.login-greeting {
  font-size: 15px;
  font-weight: bold;
}

#appli li a span {
  font-size: 1em;
  font-weight: normal;
}
.bouton-template {
  position: absolute;
  top: 0px;
}
li.print-icon {
  display: none;
}
.bouton-template form {
  margin: 0;
  padding: 0;
}
.bouton-template button {
  color: #333;
  background: rgb(143, 163, 174);
  padding: 3px 20px;
  cursor: pointer;
  font-weight: bold;
}
.bouton-template button:hover,
.bouton-template button:focus {
  background: rgb(190, 218, 230);
}
*:before,
*:after,
* {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html,
body {
  padding: 0;
  margin: 0;
  height: 100%;
  font-size: 1em;
  line-height: 1.5;
  font-family: robotoregular, arial, sans-serif;
  color: #333;
}
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
h2 {
  font-size: 1.5em;
  margin: 0.75em 0;
}
h3 {
  font-size: 1.2em;
  margin: 0.83em 0;
}
h4 {
  font-size: 1em;
  margin: 1.12em 0;
}
h5 {
  font-size: 0.83em;
  margin: 1.67em 0;
}
h6 {
  font-size: 0.75em;
  margin: 1.67em 0;
}
ul ul,
ul ol,
ol ol,
ol ul,
p,
blockquote,
ul,
fieldset,
form,
ol {
  margin: 1em 0;
}
li {
  line-height: 1.5;
  list-style-position: inside;
}
legend {
  font-size: 1em;
}
a img {
  border: none;
}
button,
input,
textarea {
  background: none;
  padding: 0;
  margin: 0;
  border-radius: 0;
  box-shadow: 0 0 0 0;
  border: 0;
} /** edition front **/
@font-face {
  font-family: "IcoMoon";
  src: url("../../../media/jui/fonts/IcoMoon.eot");
  src: url("../../../media/jui/fonts/IcoMoon.eot?#iefix")
      format("embedded-opentype"),
    url("../../../media/jui/fonts/IcoMoon.woff") format("woff"),
    url("../../../media/jui/fonts/IcoMoon.ttf") format("truetype"),
    url("../../../media/jui/fonts/IcoMoon.svg#IcoMoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"]::before,
[class*=" icon-"]::before {
  font-family: "IcoMoon";
  font-style: normal;
  margin-right: 6px;
}
.icon-calendar::before {
  content: "\43";
}
.icon-file-add::before,
.icon-file-plus::before {
  content: "\29";
}
.icon-share-alt::before,
.icon-out::before {
  content: "\26";
}
.icon-address::before {
  content: "\70";
}
.icon-file-add::before,
.icon-file-plus::before {
  content: "\29";
}
.icon-pictures::before,
.icon-images::before {
  content: "\30";
}
.icon-save-copy::before,
.icon-copy::before {
  content: "\e018";
}
.icon-publish::before,
.icon-save::before,
.icon-ok::before,
.icon-checkmark::before {
  content: "\47";
}
.icon-unpublish::before,
.icon-cancel::before {
  content: "\4a";
}
.icon-archive::before,
.icon-drawer-2::before {
  content: "\50";
}
.icon-eye-open::before,
.icon-eye::before {
  content: "\3c";
}
.icon-delete::before,
.icon-remove::before,
.icon-cancel-2::before {
  content: "\49";
}
.edit.item-page .btn,
.edit.item-page input,
.edit.item-page textarea,
.edit.item-pagecat-image .btn,
.edit.item-pagecat-image input,
.edit.item-pagecat-image textarea {
  border: 1px solid #999;
  padding: 8px;
}
.tab-pane {
  position: absolute;
  left: -9999em;
}
.tab-pane.active {
  left: auto;
  position: static;
}
#com-content-formTabs {
  padding: 0;
  margin: 0;
  list-style: none;
}
#com-content-formTabs li {
  display: inline-block;
  margin-right: 2px;
}
#com-content-formTabs li a {
  display: block;
  background: rgb(35, 52, 68);
  color: #fff;
  text-decoration: none;
  padding: 6px;
}
#com-content-formTabs li a:hover {
  opacity: 0.8;
}
#com-content-formTabs li.active a {
  background: rgb(143, 163, 174);
}
.edit.item-page .btn,
.edit.item-pagecat-image .btn {
  cursor: pointer;
}
.edit.item-page .modal.btn,
.edit.item-pagecat-image .modal.btn {
  background: rgb(35, 52, 68);
  color: #fff;
  text-decoration: none;
  padding: 6px;
  margin-left: 10px;
}
#editor-xtd-buttons.pull-left {
  float: none;
  width: auto;
}
#editor-xtd-buttons .btn {
  display: inline-block;
}
.edit.item-page .btn-toolbar .btn,
.edit.item-pagecat-image .btn-toolbar .btn {
  text-decoration: none;
  padding: 6px;
  margin-right: 10px;
  display: block;
}
.edit.item-page .btn:hover,
.edit.item-pagecat-image .btn:hover {
  opacity: 0.8;
}
.edit.item-page .btn-toolbar .btn-group,
.edit.item-pagecat-image .btn-toolbar .btn-group {
  display: inline-block;
}
.edit.item-page .btn.hasTooltip,
.edit.item-pagecat-image .btn.hasTooltip {
  text-decoration: none;
  padding: 6px;
}
.media-preview.add-on {
  display: inline-block;
  cursor: pointer;
}
.dropdown-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: right;
}
/*****/
img {
  vertical-align: top;
}
a {
  color: rgb(35, 52, 68);
}
a:hover,
a:focus {
  color: rgb(0, 51, 102);
  /**** color:rgb(143,163,174) ****/
}
.body-nuit :is(a:hover, a:focus){
  color: rgb(180, 180, 180);
}
/********************************************************************* 2 - Font face **/

@font-face {
  font-family: "robotoblack";
  src: url("../fonts/roboto-black.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "robotobold";
  src: url("../fonts/roboto-bold.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "robotolight";
  src: url("../fonts/roboto-light.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "robotoregular";
  src: url("../fonts/roboto-regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "robotothin";
  src: url("../fonts/roboto-thin.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "robotocondensed-bold";
  src: url("../fonts/robotocondensed-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

body.sombre {
  background: rgb(35, 52, 68);
  color: #fff;
}
/********************************************************************* 3 - Hacks Joomla **/

.chzn-container-single .chzn-single span,
.time.time-hours {
  width: 60px !important;
}
.article-info-term {
  display: none;
}
.img_caption:empty {
  display: none;
}
.article-info.muted {
  display: none;
}

.element-invisible {
  position: absolute;
  left: -9999em;
}
input[type="text"]:focus {
  background: rgb(190, 218, 230);
  color: rgb(35, 52, 68);
}
/********************************************************************* 4 - structure du site **/
.table-site {
  display: table;
  height: 100%;
  width: 100%;
}
.wrapper-header,
.wrapper-main,
.wrapper-footer {
  display: table-row;
  vertical-align: top;
  width: 100%;
}
.wrapper-main {
  height: 100%;
}
.large-header,
main,
footer {
  max-width: 1180px;
  margin: auto;
  overflow: hidden;
}
main {
  padding-bottom: 20px;
}
.barre-top-main {
  display: none;
}
.barre-top-main.rapide,
.barre-top-main.der {
  display: block;
}
/********** Page 404 **********/
.body {
  max-width: 1180px;
  margin: auto;
}
.body .container .header,
.footer .container,
.body .container hr,
.body .container hr + *,
.body .container blockquote {
  display: none;
}
.body .container .search {
  overflow: hidden;
}
.body #mod-search-searchword {
  border: 1px solid rgb(190, 218, 230);
  padding: 6px 0 4px 6px;
}
.body a.btn {
  font-weight: bold;
}
/******************************************************************* 5 - Header **/
.titre-logo-recherche {
  overflow: hidden;
  margin-top: 10px;
}
.wrapper-header {
  background-color: rgb(35, 52, 68);
}
.wrapper-footer {
  background-color: rgb(35, 52, 68);
}
.bordure {
  background: rgb(190, 218, 230);
  height: 10px;
}
.FlashInfos{
  /* height: 25px; */
  margin-top: 15px;
  margin-bottom: 10px;
  line-height: 30px !important;
  /* border-top: 1px solid rgba(35, 52, 68, 0.1); */
  /* border-bottom: 1px solid rgba(35, 52, 68, 0.1); */
  background-color: rgb(231, 231, 231);
  color: #FF0000;
  overflow: hidden;
  white-space: nowrap;
  margin-left: 20px !important;
  padding-left: 5px;
  /* width: 98% !important; */
  border-left: 1px solid rgba(35, 52, 68, 0.1);
  border-right: 1px solid rgba(35, 52, 68, 0.1);
  margin-right: 20px !important;
}

.FlashInfos h3{
  font-size: 0.9em;
  margin: 0em;
  width:100px;
  float:left;

}

.FlashInfos h3 {
  animation-duration: 3s;
  animation-name: slidein;
}
.FlashInfos p{
  margin: 0em;
}

.FlashInfos a{
  animation-duration: 6s;
  animation-name: slidein;
}

@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%;
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}




.FlashInfos div h3 div.custom {
  font-size: 0.9em;
  color: #233444;
}



.FlashInfos ul{
  padding: 0;
  margin: 0;
  list-style: none;
}

.FlashInfos ul li{
  float: left;
  margin: auto;
  padding: 0;
}

.FlashInfos ul li a{
  display: block;
  text-decoration: none;
  padding: 0 8px;
  font-size: 1.1em;
}



.titre {
  overflow: hidden;
  float: left;
  margin-left: 80px;
  padding-left: 20px;
  margin-top: 40px;
}

.titre .titre-site {
  padding-top: 0;
}
.titre h1 {
  text-transform: uppercase;
  font-size: 2.4em;
  
  line-height: 1;
}
.titre-jour-div {
  border-left: 1px solid #333;
}
.titre-jour * {
  color: #233444;
}
.titre-nuit-div {
  border-left: 1px solid rgb(143, 163, 174);
}
.titre-nuit * {
  color: rgb(143, 163, 174);
}
.titre h2 {
  font-size: 1.1em;
}
.titre h1,
.titre h2 {
  margin: 0;
}
.body-nuit .menu-top-header a {
  color: rgb(255, 255, 255);
}
.body-nuit header :is(a, h1, h2) {
  color: rgb(255, 255, 255);
}

/******************* menu top header **/
.menu-top-header {
  overflow: hidden;
}
.menu-top-header ul {
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: left;
  margin-top: 0.45rem;
}
.menu-top-header li {
  display: inline-block;
  vertical-align: top;
  margin-left: 8px;
}
.menu-top-header a {
  font-size: 0.9em;
  font-weight: bold;
  vertical-align: bottom;
}
.body-jour .menu-top-header a {
  color: #233444;
}
.menu-top-header a img {
  vertical-align: middle;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 3px;
}
.menu-top-header .li-recherche {
  display: none;
  padding-top: 3px;
}
.titre-site {
  padding-top: 50px;
}
.lien-accueil {
  text-decoration: none;
}
.lien-accueil img {
  float: left;
  margin-right: 20px;
  width: 200px;
}
.menu-top-header a.loupe img {
  width: 25px;
}
.menu-top-header a.cadenas img {
  width: 25px;
  height: 25px;
}
.moduletable.responsive {
  /* display: none; */
}
.loupe {
  display: none;
}
.menu-top-header a:hover,
.menu-top-header a:focus {
  text-decoration: underline;
  color: rgb(190, 218, 230);
}

.menu-top-header a[href^="https://www.facebook.com"] img
{
  margin-right: 0;
}



/******************* titre logo **/
#logo:hover h1,
#logo:focus h1 {
  color: rgb(143, 163, 174);
}
.titre-header h1 {
  padding: 0;
  margin: 0;
  text-transform: uppercase;
  color: rgb(190, 218, 230);
  font-size: 2.8em;
  line-height: 0.9;
  font-family: robotobold;
}
.titre-header h2 {
  padding: 0;
  margin: 0;
  text-transform: uppercase;
  font-weight: normal;
  color: rgb(255, 255, 255);
  font-size: 1em;
  line-height: 1.3;
}
.titre-header a {
  text-decoration: none;
  display: block;
  overflow: hidden;
}
.logo-mi {
  display: table-cell;
  width: 80px;
  height: auto;
  vertical-align: top;
  margin-right: 20px;
}
.logo-pn {
  padding-top: 30px;
  text-align: right;
  padding-bottom: 30px;
}
.logo-pn img {
  width: 200px;
  max-width: 100%;
  height: auto;
}
header {
  overflow: hidden;
  max-width: 1170px;
  margin: auto;
}
#logo {
  display: table-cell;
  vertical-align: top;
  text-decoration: none;
}
.form-inline {
  margin: 0;
  padding: 0;
}
/******************** Module recherche **/
.recherche {
  float: right;
}
.recherche input,
.search input {
  background: rgb(255, 255, 255);
  color: #666;
  float: left;
  min-width: 200px;
  padding: 7px 0 7px 7px;
  font-size: 0.8em;
}
.recherche button,
.logout-button button,
.search button {
  /*background: rgb(190, 218, 230);*/
  background: rgb(143, 163, 174);
  padding: 8px;
  cursor: pointer;
  margin: 0;
  border-collapse: collapse;
  color: #fff;
}
button:hover,
button:focus {
  background: rgb(110, 110, 110);
}

/********************************************************************* 6 - Accueil - blog **/

.titre-actu + .blog-featured {
  margin: 0 -20px;
}
.blog-featured .items-row {
  padding: 0 10px;
}
.items-row {
  overflow: hidden;
}
.span3 {
  width: 25%;
  padding: 10px;
  float: left;
}
.span3 img {
  max-width: 100%;
  height: auto;
}
.cols-1 .pull-none {
  float: left;
  width: 25%;
  margin-right: 20px;
}
.cols-1 .pull-none img {
  max-width: 100%;
  height: auto;
}
.cols-1 {
  margin-bottom: 20px;
}
.row-0 .span12 .pull-none.item-image {
  margin-left: -25px;
}
/************************************************************************** 7 - Menu top **/
/* .nav-top{
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  margin: 0;
  height: 40px;
  float: left;
  width: 100%;
  z-index: 9999 !important;
  position: absolute !important;
}

.nav-top .nav.menu.mod-list > .active > a, .nav-top .nav.menu.mod-list > .active > a:hover, .nav-top .nav.menu.mod-list > .active > a:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.nav-top.sticky{
  position: fixed !important;
  top: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  left: 0 !important;
  height: 36px;
  background-color: #233444 !important;
  min-height: 35px !important;
}

.nav-top.sticky .moduletable{
  width: 100% !important;
  margin-left: 0px !important;
  height: 35px;
  min-height: 35px !important;
}

.moduletable{
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  background-color: white;
  background-image: none;
  border: none;
  padding: 0;
  height: 35px;
  width: 100% !important;
}

.moduletable {
  margin-left: 25px;
}

.moduletable.in{
  margin-left: 0px;
  overflow: visible;
}

.moduletable .nav.menu.mod-list {
  color: #FFFFFF;
  margin: 0 !important;
}

.moduletable .nav.menu.mod-list > li > a{
  color: #233444;
  font-weight: bold;
  font-size: 12pt;
  text-shadow: none;
  text-transform: uppercase;
  height: 35px;
  line-height: 35px;
  vertical-align: middle;
  border-radius: 0;
  float: left;
  padding: 0 0 0 10px !important;
  letter-spacing: 1px;
  border-left: 1px solid #233444;
}

.moduletable .nav.menu.mod-list {
  line-height: 35px;
}

.moduletable .nav.menu.mod-list > li {
  display: block;
  height: 35px;
  background-color: white;
  margin-right: 5px;
}

.moduletable .nav.menu.mod-list > li.active > a{
  background-color: white !important;
  color: #2d81ce !important
}

.moduletable .nav.menu.mod-list > li > a > .fa {
  font: initial !important;
  font-family: "FontAwesome" !important;
  font-size: 9pt !important;
  margin-top: -7px;
}

.moduletable .nav.menu.mod-list > li > a:focus, .moduletable .nav.menu.mod-list > li > a:hover{
  background-color: transparent;
  color: #233444;
}

.moduletable .nav.menu.mod-list > li > a.icons:before {
  color: #233444;
  font-size: 16pt;
  line-height: 35px;
  vertical-align: top;
}

.moduletable .nav.menu.mod-list > li.active > a.icons:before {
  color: #BEDAE6 !important;
}

.moduletable .nav.menu.mod-list > li.active > a.icons {
  color: transparent !important;
}

.moduletable .nav.menu.mod-list > li > a.icons {
  color: transparent !important;
  width: 20px;
  border: none;
  margin-right: 10px;
}

.moduletable .nav.menu.mod-list li ul {
  display: none;
  background-color: transparent;
  width: auto;
  min-width: 150px;
  position: absolute;
  z-index: 9000;
}

.moduletable .nav.menu.mod-list > li > ul {
  margin-top: 35px;
}

.moduletable .nav.menu.mod-list li ul li {
  background-color: transparent;
  width: auto;
  float: none !important;
  padding-left: 15px;
  border-top: none;
  border-bottom: none;
  border-left: 1px solid black;
  border-right: 1px solid black;
  box-shadow: 3px 0px rgba(0, 0, 0, .3),-3px 0px rgba(0, 0, 0, .3);
}

.moduletable .nav.menu.mod-list li ul li:first-child {
  border-top: 1px solid black !important;
}

.moduletable .nav.menu.mod-list li ul li:last-child {
  border-bottom: 1px solid black !important;
  box-shadow: 3px 0px rgba(0, 0, 0, .3),0px 3px rgba(0, 0, 0, .3),-3px 0px rgba(0, 0, 0, .3) !important;
}

.moduletable ul, .moduletable ol{
  #margin: 0 !important;
}

.moduletable .nav.menu.mod-list li ul li {
  height: auto;
  line-height: 18px;
  vertical-align: middle;
  border-radius: 0;
  background-color: white;
  padding: 5px 20px 5px 0px;
  z-index: 9000;
  white-space: nowrap;
}

.moduletable .nav.menu.mod-list > li > ul > li > a {
  color: #233444;
  font-weight: bold;
  font-size: 9pt;
  text-transform: uppercase;
  padding: 5px;
  z-index: 9000;
  padding-left: 25px;
}

.moduletable .nav.menu.mod-list > li > ul > li > ul > li > a{
  color: #BEDAE6;
  font-weight: bold;
  font-size: 9pt;
  text-transform: uppercase;
  padding: 5px;
  z-index: 9000;
  margin-left: 50px;
}

.moduletable .nav.menu.mod-list li a:focus > ul, .moduletable .nav.menu.mod-list li:hover > ul{
  display: block !important;
}

.moduletable .nav.menu.mod-list li a:focus > ul, .moduletable .nav.menu.mod-list li a:hover > ul{
  display: block !important;
}

.moduletable .nav.menu.mod-list li ul:focus, .moduletable .nav.menu.mod-list li ul:hover{
  display: block !important;
} */
.nav-top {
  max-width: 1170px;
  margin: auto;
}
#sticker {
  left: 0;
  right: 0;
  background: rgb(35, 52, 68);
  width: auto !important;
}
.is-sticky #sticker {
  border-bottom: 10px solid rgb(190, 218, 230);
}
.nav-top ul {
  padding: 0;
  margin: 0;
  list-style: none;
  padding-bottom: 28px;
}
.nav-top li {
  float:left;
  margin:auto;
  padding:0;
}

.nav-top li a {
  display:block;
  /* color:#233444; */
  text-decoration:none;
  }
.nav-top li a:hover {
  color:#233444;
  }
.nav-top ul li ul {
  display:none;
  z-index: 1;
  }
.nav-top ul li:hover ul {
  display:block;
  }
.nav-top li:hover ul li {
  float:none;
  }
.nav-top li ul {
  position:absolute;
  }
.nav-top ul li ul li{
  background: transparent;
  width: auto;
  float: none !important;
  padding-left: 15px;
  border-top: none;
  border-bottom: none;
  border-left: 1px solid black;
  border-right: 1px solid black;
  box-shadow: 3px 0px rgba(0, 0, 0, .3), -3px 0px rgba(0, 0, 0, .3);
  }

.nav-top ul li ul li{
  height: auto;
  line-height: 18px;
  vertical-align: middle;
  border-radius: 0;
  background-color: white;
  padding: 5px 20px 5px 0px;
  z-index: 9000;
  white-space: nowrap;

}

.nav-top li:first-child {
  border: 0;
}
.nav-top a {
  text-decoration: none;
  display: block;
  padding: 0 8px;
  text-transform: uppercase;
  font-size: 1.1em;
  font-weight: bold;
}

.jour-link {
  color: #233444;
  border-left: 1px solid #233444;
  cursor: pointer;
}
 

.nuit-link {
  color: rgb(255, 255, 255);
  border-left: 1px solid rgb(143, 163, 174);
}


/*
.nav-top ul li:first-child a {
  border: none;
}
 .nav-top ul li:first-child a:hover,
.nav-top ul li:first-child a:focus,
.nav-top ul li:first-child.active a {
  background: url(../images/maison-hover.png) no-repeat;
}
.nav-top ul li:first-child a:hover img,
.nav-top ul li:first-child a:focus img,
.nav-top ul li:first-child.active a img {
  display: none;
} */
.jour-link:hover,
.jour-link:focus {
  color: rgb(143, 163, 174);
}
.nuit-link:hover {
  color: rgb(110, 110, 110);
}
.nav-top li.active a {
  color: rgb(35, 52, 68);
  background: rgb(143, 163, 174);
}
.search .form-inline {
  display: table;
  margin: 1em .3em;
}
#mod-search-searchword {
  border: 1px solid rgb(190, 218, 230);
  background-color: #fff;
  padding: 7px 5px;
  margin: 0;
  width: 225px;
  color: #233444;
}


/* .nav-top ul {
  margin:0;
  padding:0;
  list-style-type:none;
  text-align:center;
  }
 .nav-top li {
  float:left;
  margin:auto;
  padding:0;
  background-color:black;
  }
 .nav-top li a {
  display:block;
  width:100px;
  color:white;
  text-decoration:none;
  padding:5px;
  }
 .nav-top li a:hover {
  color:#FFD700;
  }
.nav-top ul li ul {
  display:none;
  }
.nav-top ul li:hover ul {
  display:block;
  }
.nav-top li:hover ul li {
  float:none;
  }
.nav-top li ul {
  position:absolute;
  } */



/* .nav-top ul li {
  color: #233444;
  height: 40px;
  line-height: 40px;
  cursor: pointer;
  font-size: 17px;
}

 .nav-top ul li ul {
  transform: scale(0);
  transform-origin: top center;
  transition: all 300ms ease-in-out;

}
.nav-top ul li ul li {
  font-size: 14px;
  background: rgba(0, 0, 0, 0.8);
  padding: 8px 0;
  color: #233444;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  transform: scale(0);
  transform-origin: top center;
  transition: all 300ms ease-in-out;
}
.nav-top ul li ul li:last-child {
  border-bottom: 0;
}
.nav-top ul li ul li:hover {
  background: black;
}

.nav-top ul li > li:hover .nav-top ul li ul li {
  transform: scale(1);
}

.nav-top ul li > li:hover .nav-top ul li ul {
  transform: scale(1);
} */

/************************************************************** 8 - Blocs top - acces rapide **/
.barre-top-main {
  overflow: hidden;
  max-width: 1180px;
  margin: auto;
  /* margin-top: 50px; */
}
.barre-top-main .galerie-crs{
  height: 186.667px;
}
.barre-top-main .com-crs{
  height: 186.667px;
}

.bloc-top ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.bloc-top {
  float: left;
}
.bloc-top {
  width: 75%;
  margin-left: -10px;
}
.bloc-top li {
  float: left;
  width: 33.33%;
  padding: 0 10px;
}
.bloc-top img {
  width: 100%;
  height: auto;
  display: block;
}

.bloc-top .slider, .bloc-top ul{
  float: right;
  /* width: 260px; */
}

.bloc-top a {
  text-decoration: none;
}
.bloc-top a span {
  display: block;
  text-align: center;
  text-transform: uppercase;
  font-family: robotobold;
  font-size: 1.2em;
  
  line-height: 1.4;
  margin-top: 8px;
}
.body-jour .bloc-top a span {
    color: rgb(35, 52, 68);
}

.body-nuit .bloc-top a span {
    color: rgb(255, 255, 255);
}
/*** Slider ****/

.slider {
  width: 260px;
  height: 326px;
  overflow: hidden;
  /* margin: 5px; */
}
.slides {
  width: calc(260px * 4);
  animation: glisse 20s infinite;
}
.slide {
  float: left;
}
.slider .title {
  margin-top: 324px;
  margin-left: 65px !important;
  padding-left: 5px;
}

.slider span {
  position: absolute;
  display: block;
  text-align: center;
  text-transform: uppercase;
  font-family: robotobold;
  font-size: 1.2em;
  line-height: 1.4;
  /* margin-top: 8px; */
}

@keyframes glisse {
  0% {
  transform: translateX(0);
  }
  25% {
  transform: translateX(-260px);
  }
  50% {
  transform: translateX(-520px);
  }
  75% {
  transform: translateX(-780px);
  }
  100% {
  transform: translateX(0)
  }
}

/****************** acces rapide **/
.acces-rapide {
  width: 25%;
  padding-left: 10px;
  float: left;
}
.acces-rapide .moduletable {
  min-height: 240px;
  margin-right: -20px;
  background: rgb(143, 163, 174);
}
.acces-rapide .moduletable h3 {
  margin: 0;
  padding: 10px 0 10px 20px;
  text-transform: uppercase;
  color: rgb(35, 52, 68);
}
.acces-rapide ul {
  margin: 0;
  padding: 10px 10px 10px 20px;
  list-style: none;
}
.acces-rapide li {
  margin-bottom: 10px;
  padding-right: 20px;
  color: rgb(35, 52, 68);
}
.acces-rapide a {
  padding: 8px 8px 8px 0;
  color: rgb(35, 52, 68);
  font-family: robotobold;
  text-decoration: none;
  font-size: 1.1em;
}
.acces-rapide li:last-child {
  /* text-align:right; */
  list-style: none;
}
.acces-rapide li:last-child a {
  font-size: 1em;
}
.acces-rapide .der-article li:last-child {
  text-align: left;
}
.acces-rapide li:last-child a {
  font-size: 1.1em;
}
.acces-rapide a:hover,
.acces-rapide a:focus {
  text-decoration: underline;
  color: rgb(143, 163, 174);
}
.barre-top-main.der .acces-rapide {
  width: 52%;
  padding: 0;
  margin: 0 -40px 0 0;
}
.barre-top-main.der .acces-rapide .moduletable {
  padding: 10px;
  float: left;
  width: 50%;
  margin: 0;
  background: none;
  padding-top: 0;
}
.barre-top-main.der .bloc-top {
  width: 50%;
}
.barre-top-main.der .bloc-top li {
  width: 100%;
}
.bloc-top a:hover {
  text-decoration: underline;
}
.bloc-top a:hover span {
  color: rgb(190, 218, 230);
}

.barre-top-main.der .acces-rapide .moduletable h3,
.barre-top-main.der .acces-rapide .moduletable ul {
  background: rgb(190, 218, 230);
}

/******** titres accueil **/
.menu-outils,
.menu-appli,
.menu-ddsp {
  max-width: 1180px;
  margin: auto;
  margin-top: 40px;
}
.titre-actu {
  margin-top: 50px;
  margin-bottom: 10px;
}
/***************************** lien actu **/
.titre-actu ul {
  text-align:right;
  list-style:none;
  padding:0;
  margin:0;
}
.titre-actu a {
/**  text-decoration:none;**/
  font-weight:bold;
  font-size:1.1em
}
.titre-actu a.haut-page{
  text-decoration:none;
    font-weight:normal;
    font-size:1em
  }
.titre-actu h3,
.menu-outils h3,
.menu-appli h3,
.menu-ddsp h3 {
  background: rgb(35, 52, 68);
  color: rgb(255, 255, 255);
  text-transform: uppercase;
  font-size: 2.1em;
  font-family: robotobold;
  position: relative;
  padding-left: 50px;
  font-weight: normal;
  margin: 0;
  z-index: -1;
}
.menu-outils h3,
.menu-appli h3,
.menu-ddsp h3 {
  margin-bottom: 10px;
}
.titre-actu h3::before,
.menu-outils h3::before,
.menu-appli h3::before,
.menu-ddsp h3::before {
  content: "";
  position: absolute;
  border-left: solid 8px rgb(255, 255, 255);
  border-right: solid 8px rgb(255, 255, 255);
  background: rgb(35, 52, 68);
  width: 24px;
  left: 10px;
  top: 0;
  bottom: 0;
}
.readmore a {
  font-weight: bold;
}
.item-title a {
  text-decoration: none;
}
.item-title a:hover {
  text-decoration: underline;
  color: rgb(143, 163, 174);
}
h4.item-title {
  margin: 8px 0 5px 0;
  padding: 0;
  font-size: 1.2em;
  line-height: 1.2;
}
.published {
  color: #333;
  font-weight: bold;
  font-size: 0.7em;
  text-transform: uppercase;
}
.span3 p {
  margin-bottom: 0;
  line-height: 1.2;
}
p.readmore {
  margin: 0;
  padding: 0;
  margin-top: 8px;
  font-size: 0.9em;
}
.menu-accueil {
  overflow: hidden;
}
.menu-accueil ul {
  padding: 0;
  list-style: none;
  overflow: hidden;
  margin: 0 -10px;
}
.menu-accueil ul li {
  /**float:left;**/
  /* vertical-align: top; */
  width: 25%;
  padding: 10px;
  display: inline-block;
}
.menu-accueil ul li img {
  display: block;
  width: 100%;
}
.menu-accueil a {
  text-decoration: none;
}
.menu-accueil a span {
  display: block;
  text-align: center;
  text-transform: uppercase;
  font-family: robotobold;
  font-size: 1.2em;
  color: rgb(35, 52, 68);
  line-height: 1.4;
  margin-top: 5px;
}
.menu-accueil a:hover,
.menu-accueil a:hover span,
.menu-accueil a:focus,
.menu-accueil a:focus span,
.bloc-top a:hover,
.bloc-top a:hover span,
.bloc-top a:focus,
.bloc-top a:focus span {
  color: rgb(143, 163, 174);
}
.menu-accueil a:hover img,
.menu-accueil a:focus img,
.bloc-top a:hover img,
.bloc-top a:focus img {
  opacity: 0.7;
}
.menu-appli.menu-accueil {
  margin-bottom: 50px;
}
.menu-appli.menu-accueil ul {
  list-style: inherit;
}
.menu-appli.menu-accueil li {
  color: rgb(35, 52, 68);
}
.menu-appli.menu-accueil a {
  font-weight: bold;
  font-size: 1.2em;
}

.menu-background ul li:nth-child(odd) a {
  background: rgb(143, 163, 174);
  display: block;
}
.menu-background ul li:nth-child(even) a {
  background: rgb(190, 218, 230);
  display: block;
}
.menu-background ul li:nth-child(even) a span,
.menu-background ul li:nth-child(odd) a span {
  background: #fff;
}

/************************************************************** 9 - Menu footer **/
footer {
  line-height: 140px;
  overflow: hidden;
}
footer ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
footer li {
  display: inline-block;
}
footer li a {
  color: rgb(255, 255, 255);
  text-decoration: none;
  border-left: 1px solid rgb(255, 255, 255);
  padding: 0 10px;
  text-transform: uppercase;
  font-family: robotobold;
  font-size: 0.9em;
  font-weight: normal;
}
footer ul li:first-child a {
  border: none;
}
footer li a:hover,
footer li a:focus {
  text-decoration: underline;
  color: rgb(190, 218, 230);
}
footer .logo-dcsp {
  float: right;
  margin: 20px 50px 20px 0;
}
/************************************************************ 10 - ariane **/
.ariane {
  margin-bottom: 20px;
}
.ariane ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
.ariane ul li {
  display: inline-block;
  vertical-align: middle;
  margin-top: 15px;
  font-size: 0.9em;
}
.ariane ul li span {
  padding: 0 3px;
}
/*********** blog **/
.blog {
}
.item-page h1,
.page-header h2,
.item-page h3,
.item-page h4,
.item-page h5,
.item-page h6 {
  font-family: robotobold;
  font-weight: normal;
  color: rgb(35, 52, 68);
}
.blog .item-page {
  overflow: hidden;
}
.blog .article-body *:first-child {
  margin-top: 0;
}
.blog .titre-article {
  margin-top: 0;
}
.blog .titre-article a {
  text-decoration: none;
}
.blog .pull-none {
  /* float: left; */
  width: 25%;
  margin-right: 20px;
  margin-bottom: 20px;
}
.blog .pull-none img {
  max-width: 100%;
  height: auto;
}
/*********************************************************************** 11 - article **/
/************* sommaire article **************/
.article-index ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
.article-index li {
  display: inline-block;  
  vertical-align: top;
  margin-right: 10px;
  margin-bottom: 10px;
}
.pager ul {
  list-style: none;
  padding: 0;
  text-align: center;
}
.pager li {
  display: inline-block;
  margin-right: 8px;
}
.article-index a {
  display: block;
  text-decoration: none;
  padding: 8px;
  background: rgb(190, 218, 230);
  font-weight: bold;
}
.article-index .toclink.active,
.article-index .toclink.active:focus {
  background: rgb(143, 163, 174);
  color: #333;
}
.item-page h1,
.item-page h2,
.item-page h3,
.item-page h4,
.item-page h5,
.item-page h6,
.content-category h2 {
  font-family: robotobold;
  font-weight: normal;
  color: rgb(35, 52, 68);
}
.item-page {
  overflow: hidden;
}
.article-body *:first-child {
  margin-top: 0;
}
.titre-article {
  margin-top: 0;
}
.titre-article a {
  text-decoration: none;
}
.pull-left {
  float: left;
  width: 50%;
  margin-right: 20px;
  margin-bottom: 20px;
}
.pull-left img {
  max-width: 100%;
  height: auto;
}
a.wf_file::before {
  content: url(../images/trombone-fonce.svg);
  display: inline-block;
  vertical-align: middle;
  width: 18px;
  height: 18px;
  margin-right: 8px;
}
.wf_file_text {
  font-weight: bold;
}
.article-body table {
  width: 100%;
  border-collapse: collapse;
}
.article-body table th,
.article-body table td {
  border: 1px solid rgb(35, 52, 68);
  padding: 8px;
}
.article-body table p {
  margin: 0;
  padding: 0;
}
.article-body table caption {
  font-style: italic;
}
.article-body table tr,
.article-body table thead tr:nth-child(odd) {
  background: rgb(190, 218, 230);
}
.article-body table tr:nth-child(odd) {
  background: rgb(143, 163, 174);
}

/*** formulaire contact ***/
#myTabTabs {
  margin: 0;
  padding: 0;
  list-style: none;
}
#myTabTabs li {
  display: inline-block;
  vertical-align: top;
  margin-right: 3px;
}
#myTabTabs a {
  display: block;
  text-align: center;
  padding: 8px 18px;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
  background: rgb(143, 163, 174);
  color: rgb(35, 52, 68);
}
.accordion-toggle,
#slide-contact > div:first-child .accordion-heading.open .accordion-toggle {
  text-align: center;
  padding: 8px 18px;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
  background: rgb(143, 163, 174);
  color: rgb(35, 52, 68);
}
.accordion-body {
  margin-top: 20px;
}
#myTabTabs a:focus,
#myTabTabs li:hover a,
.accordion-toggle:focus,
#slide-contact > div:first-child .accordion-heading .accordion-toggle:hover,
#slide-contact > div:first-child .accordion-heading .accordion-toggle:focus {
  background: rgb(143, 163, 174);
  color: #fff;
}
.accordion-toggle:focus,
.accordion-toggle:hover {
  background: rgb(143, 163, 174);
  color: #fff;
}
#myTabTabs li.active a {
  background: rgb(190, 218, 230);
  color: rgb(35, 52, 68);
}
#slide-contact > div:first-child .accordion-heading .accordion-toggle {
  background: rgb(190, 218, 230);
  color: rgb(35, 52, 68);
}
#slide-contact > div:last-child .accordion-heading.open .accordion-toggle {
  background: rgb(190, 218, 230);
  color: rgb(35, 52, 68);
}
#myTabContent .tab-pane {
  display: none;
}
#myTabContent .tab-pane.tab-active {
  display: block;
}
.accordion-body.collapse {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0s;
}
.accordion-body.collapse.in,
.open + .accordion-body.collapse {
  max-height: 200em;
  transition: max-height 0.8s;
}
.accordion-body {
  overflow: hidden;
}
.open + .accordion-body.collapse.in {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0s;
}
.accordion-body.collapse.in {
  margin-bottom: 20px;
}
.tooltip,
.popover {
  display: none !important;
}
.dl-horizontal {
  overflow: hidden;
}
dl,
dt,
dd {
  margin: 0;
  padding: 0;
}
form,
form p:first-child {
  margin-top: 0;
}
#myTabContent {
  margin-top: 20px;
}
.ul-contact {
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
.ul-contact ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
}
.ul-contact > li {
  padding: 10px;
  display: flex;
  flex-direction: column;
  width: 33.333%;
}
.ul-contact,
.ul-contact ul li {
  margin-bottom: 5px;
}
dic.contact-category {
  padding: 0 20px;
}
/*** recherche ***/
#limit_chzn {
  display: none !important;
}
.span-cache {
  position: absolute;
  left: 9999em;
}
.only input,
.phrases input {
  float: none;
  min-width: inherit;
}
.phrases input {
  margin-right: 8px;
}
.only label,
.phrases label {
  margin-right: 20px;
}
.phrases-box {
  margin-bottom: 20px;
}
#limit {
  display: inline-block !important;
}
.btn-toolbar {
  overflow: hidden;
}
.search .pull-left {
  width: auto;
  margin-right: 0;
  border: 1px solid rgb(190, 218, 230);
}
.search-results a {
  font-weight: bold;
  text-decoration: none;
}
.search-results .result-created,
.search-results .result-category {
  color: #333;
  font-weight: bold;
  font-size: 0.7em;
  text-transform: uppercase;
}
.search-results li {
  margin-bottom: 20px;
}
.pagination {
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
}
.pagination li {
  display: inline-block;
  margin: 0 5px;
}
.haut-page {
  display: block;
  text-align: right;
}
.menu-appli.menu-accueil a.haut-page {
  font-size: 1em;
  font-weight: normal;
}

/**************************** page contact **/
.badge.badge-info.tip.hasTooltip {
  display: none;
}
.contacts,
.contacts ul {
  margin: 0;
  list-style: none;
  /* padding: 0; */
}
.contacts ul {
  margin-left: 20px;
  margin-top: 20px;
}
.contacts ul ul {
  margin-top: 0;
}
.cat-children .contacts {
  margin-top: 20px;
}
.cat-children .contacts ul {
  margin-top: 0;
}
.cat-children .contacts ul li:last-child {
  margin-bottom: 20px;
}
.contacts a {
  font-weight: bold;
  text-decoration: none;
  font-size: 1.4em;
}
.contacts ul a {
  font-size: 1.3em;
}
.contacts ul ul a {
  font-size: 1.2em;
}
.contacts li {
  overflow: hidden;
}
.cat-children h3 {
  display: none;
}
.contact-thumbnail,
.thumbnail img {
  max-width: 120px;
  float: left;
  height: auto;
  margin-right: 20px;
}
form .contacts li {
  float: left;
  width: 25%;
  padding: 20px;
}
.nom-contact {
  font-weight: bold;
}
.contact-category form {
  overflow: hidden;
}
.cat-children {
  border-top: 3px solid rgb(190, 218, 230);
}
.contact-div {
  overflow: hidden;
}
.contact .page-header + h3 {
  display: none;
}
.contact-div dl {
  margin: 0;
  overflow: hidden;
}
.contact-div dd,
.contact-div dt {
  margin: 0;
}
.contact-position dd,
.contact-address dd {
  margin-bottom: 5px;
}
.list-title span:first-child,
.contact span span:first-child {
  font-weight: bold;
  display: block;
}
.contact-position {
  font-weight: bold;
}
.contact input[type="text"],
.contact textarea,
.contact input[type="email"] {
  border: solid rgb(143, 163, 174) 1px;
  width: 50%;
}
.contact input[type="text"]:hover,
.contact textarea:hover,
.contact input[type="email"]:hover,
.contact input[type="text"]:focus,
.contact textarea:focus,
.contact input[type="email"]:focus {
  border: solid rgb(35, 52, 68) 1px;
  background: none;
}
.contact button {
  background: rgb(35, 52, 68);
  padding: 5px 10px;
  cursor: pointer;
  text-transform: uppercase;
  color: #fff;
  font-weight: bold;
}
.contact button:hover,
.contact button:focus {
  background: rgb(143, 163, 174);
}
.control-group span {
  font-style: italic;
  color: #666;
  font-size: 0.9em;
}
.control-group {
  margin: 10px 0;
}
/**** plan de site ****/
.collapse.fade {
  margin-left: 20px;
}
.categories-list h3 {
  /* margin-bottom: 0; */
  float:right;
  margin-right: 380px;
  width: 250px;
}
.item-title {
  font-size: 1.3em;
}
ul .item-title {
  font-size: 1em;
}
.collapse.fade h3 {
  margin-top: 0;
  font-size: 1.1em;
}
.collapse.fade .collapse.fade h3 {
  font-weight: normal;
}
/*** gloassaire ***/
.letter-disabled {
  color: #999;
}
.fsf_glossary_text p {
  margin-top: 0 !important;
}
.fsf_glossary_text {
  padding-top: 0 !important;
}
.fsf_glossary_title {
  padding-bottom: 0 !important;
}
/********************* FAQ **/

.sp-accordion.sp-accordion-style4 .toggler,
.sp-accordion.sp-accordion-style4 .toggler span,
.sp-accordion.sp-accordion-style4 .toggler span span {
  cursor: pointer;
  display: block;
  height: auto;
  line-height: normal;
}
.sp-accordion-item {
  margin-bottom: 8px;
}
.sp-accordion.sp-accordion-style4 .toggler span,
.sp-accordion.sp-accordion-style4 .toggler span span {
  font-size: 1.1em;
  padding: 5px;
  background: none;
}
.sp-accordion.sp-accordion-style4 .sp-accordion-inner {
  background: none;
  padding: 10px;
}
.sp-accordion-inner p {
  line-height: 1.4em;
}
.sp-accordion.sp-accordion-style4 .toggler {
  background: rgb(143, 163, 174) url(triangle2.png) no-repeat 99% 50%;
  border-bottom: 0;
  transition: background, color 0.5s;
  padding-right: 30px;
}
.sp-accordion.sp-accordion-style4 .toggler.active {
  background: rgb(190, 218, 230) url(triangle1.png) no-repeat 99% 50%;
}
/******************* page archive **/
.archive fieldset {
  border: rgb(143, 163, 174) 1px solid;
}
legend {
  text-transform: uppercase;
  font-size: 1.1em;
  font-weight: bold;
}
#month,
#year,
#limit {
  display: inline-block !important;
}
#month_chzn,
#year_chzn {
  display: none;
}
.archive button {
  background: rgb(190, 218, 230);
  color: rgb(35, 52, 68);
  text-transform: uppercase;
  padding: 4px 8px;
  font-weight: bold;
  font-size: 0.8em;
  cursor: pointer;
}
.archive button:hover,
.archive button:focus {
  background: rgb(143, 163, 174);
}
.archive select {
  width: 80px;
}

/****categorie liste ****/

.categories-list h2{
  display: none;
}

/***************************** categorie image **/


.categories-listcat-image .cat-image {
  display:inline-block;
  vertical-align:top;
  padding:10px;
  width:25%;
}

.categories-listcat-image .cat-image img {
  display:inline-block;
}

.cat-image .cat-image img, .cat-image h3 {
  /* float: right; */
  /* list-style: none;
  margin:0;  */
  padding:30px;
}

.categories-listcat-image {
  width: 100%;
}

.cat-image {
  vertical-align: top;
  padding: 20px;
  /* width: 25%; */
  

}

.categories-listcat-image .cat-image {
  display: inline-block;
}

.bloc-cat-image {
  /* font-size: 0;
  text-indent: 25px;
  width: 200px;
  color: #233444;
  background: #ecf9ff; */
  width: 895px;
  padding: 30px;
  float: right;
  margin-top: -50px;
}
.bloc-cat-image .cat-image {
  font-size: 16px;
}
.categories-listcat-image .cat-image a {
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  text-align: center;
}
.cat-image img {
  width: 150px;
  height: 150px;
}
.categories-listcat-image .cat-image a:hover img,
.categories-listcat-image .cat-image a:focus img {
  opacity: 0.7;
}
.categories-listcat-image .cat-image h3 {
  margin: 0;
  padding: 0;
}
.blogcat-image img {
  display: none;
}
.categories-listcat-image .bloc-cat-image {
  overflow: hidden;
  margin: 0 -10px;
}
.categories-listcat-image .bloc-cat-image div:nth-child(odd) a {
  background: rgb(143, 163, 174);
  display: block;
}
.categories-listcat-image .bloc-cat-image div:nth-child(even) a {
  background: rgb(190, 218, 230);
  display: block;
}
.bloc-cat-image h3 {
  /* background: #fff; */ 
}
.category-desc.base-desc {
  text-align: right;
}

.category-desc img{
  width: 150px;
  height: 150px;
  display: none;
}

/** Page Historique CRS **/
.categories-list .bloc-cat-image .bloc-cat-image{
  display: none;
}
.blog .page-header{
  /* visibility: hidden; */
  display: none;
}


/*** Nouvelle position pour un menu sous une page ***/

.menu-left {
  float:left;
  /* width:230px; */
  margin:0 20px 0 0
}
.logo {
    margin-top:20px;
}

.logo img {
  width:150px;
  height: 150px;
  display:block;
  margin:auto
}
.logo p {
  margin:0;
  margin-bottom:8px
}
.bloc-menu {
  background:#ecf9ff;
  /* padding:10px; */
  position: sticky
}

.bloc-menu .is-sticky{
  position: fixed;
  top: 10px;
}

.bloc-menu ul{
  padding: 0;
  margin: 0;
  list-style: none;
}
.bloc-menu h3{
  text-align: center;
}
.menu-left a {
  display:block;
  padding: 3px;
  text-decoration:none;
}
/*
.menu-left a.current,
.active.current.parent, li.active {
  background:rgb(217, 236, 243)
}
.active.current.parent li, li.current {
  background: rgb(234, 238, 240);
}*/

/**.menu-left .current.parent a {
  background:rgb(217, 236, 243);
}**/
.menu-left li.current > a {
  background:rgb(35,52,68);
  color:#fff
}

/*** page connexion ***/
.login input[type="password"],
.login input[type="text"] {
  border: solid 1px rgb(143, 163, 174);
  padding: 8px 3px;
}
.login button {
  background: rgb(190, 218, 230);
  color: rgb(35, 52, 68);
  text-transform: uppercase;
  float: left;
  padding: 6px;
  font-weight: bold;
  font-size: 0.8em;
  cursor: pointer;
}
.login button:hover,
.login button:focus {
  background: rgb(143, 163, 174);
}
.profile dt {
  font-weight: bold;
  margin-top: 8px;
}
.profile dt::after {
  content: " :";
  display: inline-block;
}
/******** DEBUT RESPONSIVE *********/

/************************************************************* icones jour / nuit  **/
.icon-template {
  display: none;
}

.jour {
  background: url(../images/sun.svg) no-repeat left 3px;
  background-size: 20px 20px;
  height: 25px;
}

.nuit {
  background: url(../images/moon.svg) no-repeat left 3px;
  background-size: 20px 20px;
  height: 25px;
}

.icon-template ul {
  list-style: none;
  text-align: left;
}

.icon-template li {
  display: inline-block;
  vertical-align: top;
}

.icon-template li:hover .jour {
  background: url(../images/sun-hover.png) no-repeat;
}

.icon-template li:hover .nuit {
  background: url(../images/moon-hover.png) no-repeat;
}

.icon-template {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
}

.icon-template button {
  cursor: pointer;
  font-weight: bold;
  height: 25px;
  width: 25px;
}

.icon-template button:hover {
  background: transparent;
}

/************************************************************* icones menu reseaux **/
.menu-top-reseaux {
  overflow: hidden;
  display: none;
  margin-top: 13px;
}
.menu-top-reseaux ul {
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: right;
}
.menu-top-reseaux li {
  display: inline-block;
  vertical-align: top;
  margin-left: 8px;
}
.menu-top-reseaux a {
  color: rgb(255, 255, 255);
  text-decoration: none;
  font-size: 0.9em;
  font-weight: bold;
  padding-left: 20px;
}
.menu-top-header .responsive a {
  /* padding-left: 20px; */
}
.menu-top-header .responsive a[href*="https://twitter"]
{
  background: url(../images/lien-twitter.png) no-repeat left top;
  background-size: 20px 20px;
}
.menu-top-header .responsive a[href*="https://www.facebook"]
{
  background: url(../images/lien-facebook.png) no-repeat left top;
  background-size: 18px 18px;
  /* padding-left: 18px; */
}
.menu-top-header .responsive a[href*="http://www.police-nationale"]
{
  background: url(../images/lien-web.png) no-repeat left center;
  background-size: 18px 18px;
}
.menu-top-header .responsive a[href*="connexion"] {
  background-size: 18px 18px;
  /**display:none;**/
}
.menu-top-header .responsive a[href*="recherche"] {
  background: url(../images/loupe.png) no-repeat left bottom;
  background-size: 35px 24px;
  font-size: 0;
  width: 34px;
  height: 22px;
  display: none;
  margin-top: 5px;
  /**display:none;**/
}

/************************************************************* menu burger **/
/* Icon 1 */
#nav-icon1 {
  display: none;
}

#nav-icon1 {
  width: 40px;
  height: 45px;
  position: relative;
  margin: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  cursor: pointer;
}

#nav-icon1 span {
  display: block;
  position: absolute;
  height: 5px;
  width: 100%;
  background: rgb(190, 218, 230);
  border-radius: 2px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

#nav-icon1:hover span {
  background: rgb(143, 163, 174);
}

#nav-icon1 span:nth-child(1) {
  top: 0px;
}

#nav-icon1 span:nth-child(2) {
  top: 10px;
}

#nav-icon1 span:nth-child(3) {
  top: 20px;
}

#nav-icon1.open span:nth-child(1) {
  top: 10px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
  background: #5a5e6b;
}

#nav-icon1.open span:nth-child(2) {
  opacity: 0;
  left: 0;
}

#nav-icon1.open span:nth-child(3) {
  top: 10px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
  background: #5a5e6b;
}

/************************************************************* loupe recherche **/

#arrow {
  margin-top: 2px;
  margin-left: -15px;
  display: none;
  cursor: pointer;
}
.path.color,
.polygon.color {
  fill: #5a5e6b;
}
.path.hover,
.polygon.hover {
  fill: rgb(143, 163, 174);
}

#arrow.rotation {
  transform: rotate(-90deg);
}
.menu-top-header .responsive a[href*="recherche"] {
  display: none;
}

/************************************************************* media queries **/
@media all and (max-width: 1180px) {
  .header {
    padding: 0 10px;
  }
  .barre-top-main {
    padding: 0 10px 0 10px;
  }
  .titre-actu + .blog-featured {
    margin: 0 -20px;
  }
  main {
    padding: 10px;
  }
  .menu-appli .menu-accueil ul {
    padding: 0 10px;
  }
  
  .menu-outils,
  .menu-appli,

  .menu-ddsp {
    padding: 0 10px;
    max-width: 1180px;
  }
  .categories-listcat-image .cat-image {
    width: 33.333%;
  }
  .barre-top-main.der .bloc-top {
    width: auto;
    overflow: hidden;
    margin-bottom: 20px;
    margin-left: -520px;
  }
  .barre-top-main.der .bloc-top li {
    width: 100%;
    padding: 0 10px;
  }
  .slides{
    width: calc(260px*4);
    animation: glisse 20s infinite;
  }
  .slider{
    width: 25%;
    padding: 0 10px;

  }
  .bloc-top .slider, .bloc-top ul{
    float: right;
    /* width: 260px; */
  }
}

@media all and (max-width: 1128px) {
  .menu-left {
    float: none;
    width: auto;
    margin: 10px 0;
    position:static!important
	}
  .component {
    padding:0 10px
  }
  
  .menu-left ul {
    columns :100px 3
  }
}


@media all and (max-width: 1061px) {
  
  .titre-site {
    padding-top: 50px;
  }
  .titre h1 {
    margin: 10px 0;
  }
  .titre h2 {
    display: none;
  }
  .titre {
    margin-bottom: 20px;
  }
  .nav-top a {
    font-size: 1em;
  }
  .menu-top-header .moduletable {
    display: none;
  }
  .menu-top-header .moduletable.responsive {
    display: block;
  }
  .bouton-template {
    display: none;
  }
  .icon-template {
    display: block;
    background-color: #233444;
  }
  .menu-top-reseaux {
    display: block;
  }
  .menu-top-header .responsive a[href*="connexion"] {
    background: none;
    padding-left: 0;
  }
  .menu-top-header .responsive a[href*="connexion"] img {
    width: 23px;
    height: 23px;
  }


  .nav-top {
    margin-top: 10px;
  }
  .menu-top-header .responsive a[href*="recherche"] img {
    width: 36px;
    height: 26px;
  }
  .titre-site {
    /* padding-top: 30px; */
  }
  .titre {
    /* margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 0; */
  }
  
  .menu-top-header .responsive a[href*="recherche"] {
    display: block;
    /* margin-left: -14px;
    padding-left: 13px; */
    margin-top: 1px;
  }

  .contact input[type="text"],
  .contact textarea,
  .contact input[type="email"] {
    min-width: 100%;
  }
  .bloc-top a span {
    font-size: 0.9em;
  }
  .pull-none.item-image {
    max-height: inherit; 
  }
  .row .span12 .pull-none.item-image {
    width: 37.5%;
  }
  .row-0 .span12 .pull-none.item-image {
    margin-left: 0px;
  }
  .menu-accueil ul li {
    /* width: 50%; */
  }
  .span3 {
    /* width: 50%; */
  }
  .span3 img {
    width: 100%;
  }
  header {
    margin-top: 20px;
  }
  .barre-top-main.der .moduletable h3 {
    margin: 0;
  }
  .titre-header h2 {
    display: none;
  }
  .lien-accueil img {
    /* float: left;
    margin-right: 20px;
    width: 30vw; */
  }
  .logo-pn {
    /* float: none;
    margin-top: 0;
    padding: 0;
    text-align: initial;
    margin-left: auto;
    margin-right: 0; 
    width: 130px;*/
  }
  .acces-rapide ul,
  a.lien-tg {
    display: none;
  }
  .logo-mi,
  #logo {
    float: left;
  }
  .acces-rapide ul,
  a.lien-tg {
    width: auto;
  }
  .logo-dcsp {
    width: 100px;
    height: 100px;
  }
  .acces-rapide .rotate + ul {
    display: block !important;
  }
  .rotate ~ a.lien-tg {
    display: block;
  }
  .titre-site {
    margin: 5px 0;
  }
  .titre-header h1 {
    font-size: 2em;
    margin-top: 18px;
  }
  .barre-top-main.der .bloc-top {
    width: auto;
    overflow: hidden;
    margin-bottom: 20px;
    margin-left: -290px;
  }
  .barre-top-main.der .bloc-top li {
    width: 100%;
    padding: 0 10px;
  }
  .slides{
    width: calc(260px*4);
    animation: glisse 20s infinite;
  }
  .slider{
    width: 25%;
    padding: 0 10px;

  }
  .menu-accueil ul li {
    /* vertical-align: top; */
    padding: 10px;
    display: inline-block;
  }

  .barre-top-main.der .acces-rapide {
    margin: 20px -10px 0 -10px;
    padding: 0;
    width: auto;
    padding-top: 20px;
  }

  .bloc-top {
    margin: 0 -10px;
  }

  .acces-rapide {
    float: none;
    width: auto;
  }

  .menu-accueil a span {
    font-size: 1em;
  }
  footer li a {
    border: none;
    padding-left: 8px;
  }
  footer {
    padding-top: 8px;
  }
  .categories-list.cat-image .cat-image {
    width: 50%;
  }
  .categories-list.cat-image .cat-image h3 {
    font-size: 1em;
  }
  .barre-top-main.der .acces-rapide .moduletable {
    padding-bottom: 5px;
    width: 100%;
    display: inline-block;
  }
  .acces-rapide {
    margin-top: 20px;
  }
  .bloc-top {
    /* float: none; */
    overflow: hidden;
    width: auto;
  }
  .acces-rapide .moduletable {
    margin-right: 0;
    margin-left: -10px;
    background: none;
    min-height: inherit;
  }
  .acces-rapide .moduletable h3 {
    padding: 10px;
    background: rgb(143, 163, 174);
  }
  .acces-rapide .moduletable ul {
    background: rgb(143, 163, 174);
    position: absolute;
    left: -9999em;
  }
  .acces-rapide .moduletable h3.rotate + ul {
    position: static;
    display: block !important;
  }
  .menu-top-reseaux {
    display: block;
    margin-right: 15px;
    margin-bottom: 5px;
  }

  #loupe {
    display: inline-block;
  }

  footer li {
    display: block;
    margin-bottom: 8px;
  }

  .acces-rapide h3:after {
    content: url(../images/fleche.svg);
    margin-left: 15px;
    display: inline-block;
    cursor: pointer;
    transition: transform 0.4s;
  }

  .acces-rapide h3.rotate::after {
    transform: rotate(180deg);
  }
  .titre-actu {
    margin-top: 0;
  }
  main {
    padding-top: 0;
  }

  .menu-left {
    float: none;
    width: auto;
    margin: 10px 0;
    position:static!important
	}
  .component {
    padding:0 10px
  }
  
  .menu-left ul {
    columns :100px 3
  }
  
}

@media all and (max-width: 911px) {
  .menu-left {
    float: none;
    width: auto;
    margin: 10px 0;
    position:static!important
	}
  .component {
    padding:0 10px
  }
  
  .menu-left ul {
    columns :100px 3
  }
  .cat-image .cat-image img, .cat-image h3{
    margin: 27px;
    margin-right: 200px;
}

  .bloc-cat-image {
    width: 100%;
    padding: 30px;
    float: right;
    margin-top: -50px;
  }
  .cat-image img {
    width: 75px;
    height: 75px;
  }
  .cat-image h3 {
    font-size: 0.95em;
    margin: 0.1em;
    margin-right: 250px;
    margin-top: -10px;
  }
}

@media all and (max-width: 800px) {
  .nav-top {
    margin-top: 10px;
  }
  .menu-top-header .responsive a[href*="recherche"] img {
    width: 36px;
    height: 26px;
  }
  .titre-site {
    padding-top: 30px;
  }
  .titre {
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 0;
  }
  
  .menu-top-header .responsive a[href*="recherche"] {
    display: block;
    /* margin-left: -14px;
    padding-left: 13px; */
    margin-top: 1px;
  }

  .contact input[type="text"],
  .contact textarea,
  .contact input[type="email"] {
    min-width: 100%;
  }
  .bloc-top a span {
    font-size: 0.9em;
  }
  .pull-none.item-image {
    max-height: inherit;
  }
  /* .row .span12 .pull-none.item-image {
    width: 50%;
  } */
  .row-0 .span12 .pull-none.item-image {
    margin-left: 0px;
  }
  .menu-accueil ul li {
    width: 50%;
  }
  .span3 {
    width: 50%;
  }
  .span3 img {
    width: 100%;
  }
  header {
    margin-top: 20px;
  }
  .barre-top-main.der .moduletable h3 {
    margin: 0;
  }
  .titre-header h2 {
    display: none;
  }
  .lien-accueil img {
    float: left;
    margin-right: 20px;
    width: 30vw;
  }
  .logo-pn {
    float: none;
    margin-top: 0;
    padding: 0;
    text-align: initial;
    margin-left: auto;
    margin-right: 0;
    width: 130px;
  }
  .acces-rapide ul,
  a.lien-tg {
    display: none;
  }
  .logo-mi,
  #logo {
    float: left;
  }
  .acces-rapide ul,
  a.lien-tg {
    width: auto;
  }
  .logo-dcsp {
    width: 100px;
    height: 100px;
  }
  .acces-rapide .rotate + ul {
    display: block !important;
  }
  .rotate ~ a.lien-tg {
    display: block;
  }
  .titre-site {
    margin: 5px 0;
  }
  .titre-header h1 {
    font-size: 2em;
    margin-top: 18px;
  }
  .barre-top-main.der .bloc-top {
    width: auto;
    overflow: hidden;
    margin-bottom: 20px;
    margin-left: -390px;
  }
  .barre-top-main.der .bloc-top li {
    width: 100%;
    padding: 0 10px;
  }
  .slides{
    width: calc(260px*4);
    animation: glisse 20s infinite;
  }
  .slider{
    width: 25%;
    padding: 0 10px;

  }
  .menu-accueil ul li {
    /* vertical-align: top; */
    padding: 10px;
    display: inline-block;
  }

  .barre-top-main.der .acces-rapide {
    margin: 20px -10px 0 -10px;
    padding: 0;
    width: auto;
    padding-top: 20px;
  }

  .bloc-top {
    margin: 0 -10px;
  }

  .acces-rapide {
    float: none;
    width: auto;
  }

  .menu-accueil a span {
    font-size: 1em;
  }
  footer li a {
    border: none;
    padding-left: 8px;
  }
  footer {
    padding-top: 8px;
  }
  .categories-list.cat-image .cat-image {
    width: 50%;
  }
  .categories-list.cat-image .cat-image h3 {
    font-size: 1em;
  }
  .barre-top-main.der .acces-rapide .moduletable {
    padding-bottom: 5px;
    width: 100%;
    display: inline-block;
  }
  .acces-rapide {
    margin-top: 20px;
  }
  .bloc-top {
    /* float: none; */
    overflow: hidden;
    width: auto;
  }
  .acces-rapide .moduletable {
    margin-right: 0;
    margin-left: -10px;
    background: none;
    min-height: inherit;
  }
  .acces-rapide .moduletable h3 {
    padding: 10px;
    background: rgb(143, 163, 174);
  }
  .acces-rapide .moduletable ul {
    background: rgb(143, 163, 174);
    position: absolute;
    left: -9999em;
  }
  .acces-rapide .moduletable h3.rotate + ul {
    position: static;
    display: block !important;
  }
  .menu-top-reseaux {
    display: block;
    margin-right: 15px;
    margin-bottom: 5px;
  }

  #loupe {
    display: inline-block;
  }

  footer li {
    display: block;
    margin-bottom: 8px;
  }

  .acces-rapide h3:after {
    content: url(../images/fleche.svg);
    margin-left: 15px;
    display: inline-block;
    cursor: pointer;
    transition: transform 0.4s;
  }

  .acces-rapide h3.rotate::after {
    transform: rotate(180deg);
  }
  .titre-actu {
    margin-top: 0;
  }
  main {
    padding-top: 0;
  }

  .menu-left {
    float: none;
    width: auto;
    margin: 10px 0;
    position:static!important
	}
  .component {
    padding:0 10px
  }
  
  .menu-left ul {
    columns :100px 2
  }
  .cat-image h3 {
    font-size: 0.95em;
    margin: 0.1em;
    margin-right: 190px;
    margin-top: -10px;
  }
}
@media all and (max-width: 600px) {
  .titre-site {
    margin: 5px 0;
  }
  
  header {
    margin-top: 0;
  }
  .lien-accueil img {
    float: left;
    margin-right: 0px;
    margin-left:.2em;
    width: 30vw;
    margin-top: 40px;
  }
  .titre {
    margin-left: 1em;
    margin-top: 40px;
    font-size: .7em;
  }
  
 
  .logo-pn {
    float: none;
    margin-top: 0;
    padding: 0;
    text-align: initial;
    margin-left: auto;
    margin-right: 0;
    width: 130px;
  }
  #searchForm label {
    display: block;
  }
  .nav-top {
    display: none;
  }
  #nav-icon1 {
    display: block;
    top: 10px;
  }
  .nav-top li {
    display: block;
    float: left;
    width: 301px;
    height: 35px;
    padding: 5px;
  }
  .nav-top ul li:first-child {
    /* border-left: 1px solid #233444 */
  }
  .loupe {
    display: block;
  }
  .titre-logo-recherche {
    margin-top: 0;
  }
  header {
    /* margin-top: 20px; */
  }
  .titre-header h2 {
    display: none;
  }
  .logo-mi {
    width: 70px;
  }
  .titre-header h1 {
    font-size: 2.3em;
  }
  .barre-top-main.der .bloc-top {
    width: auto;
    overflow: hidden;
    margin-bottom: 20px;
    margin-left: 175px;
  }
  .bloc-top .slider, .bloc-top ul {
    float: left;
    width: 260px;
    margin-top: 50px;
  }
  .cat-image h3 {
    font-size: 0.95em;
    margin: 0.1em;
    margin-right: 0px;
    margin-top: -10px;
  }
  .slides{
    width: calc(260px*4);
    animation: glisse 20s infinite;
  }
  .slider{
    width: 25%;
    padding: 0 10px;

  }
  .article-body img {
    width: 200px;
  }

  .article-body table img {
    width: 100px;
  }
  .ul-contact > li {
    padding: 10px;
    display: flex;
    flex-direction: column;
    width: 50%;
  }
}
@media all and (max-width: 451px) {
  .bloc-top li {
    float: none;
    width: auto;
    margin-bottom: 20px;
  }
  .pn-res-recherche {
    /* float: left !important; */
  }
  .menu-accueil ul li {
    width: auto;
    display: block;
    float: none;
  }
  .bloc-top img {
    width: 100%;
  } 
  .bloc-top a span {
    font-size: 1em;
  }
  .titre-actu h3,
  .menu-outils h3,
  .menu-appli h3,

  .menu-ddsp h3 {
    font-size: 1.3em;
  }
  .menu-top-header a.cadenas {
    display: block;
  }
  .logo-mi {
    margin-right: 10px;
  }
  .menu-top-header .moduletable.responsive {
    /*margin-top: 30px;*/
  }
  #logo h1 {
    font-size: 1.7em;
  }
  .logo-mi {
    width: 50px;
  }
  .logo-pn {
    width: 100px;
  }
  .span3 {
    width: auto;
    float: none;
  }
  .barre-top-main.der .bloc-top li {
    width: 100%;
    /* padding: 10px; */
  }
  .cat-image h3 {
    font-size: 0.95em;
    margin: 0.1em;
    margin-right: -90px;
    margin-top: -10px;
  }
  .FlashInfos a {
    font-size: 00.9em;
  }
  .barre-top-main.der .bloc-top {
    width: auto;
    overflow: hidden;
    margin-bottom: 20px;
    margin-left: 50px;
  }
  .barre-top-main {
    margin-top: 0px;
  }
  .bloc-top .slider, .bloc-top ul {
    float: left;
    width: 260px;
    margin-top: 50px;
  }
  .FlashInfos p{
    font-size: 0.8em;
  }
  .bandeau{
   width: 1180x;
   height: 200px;
   background-image: url("../images/header-1180X200.png");
   background-position: center;
   background-size: cover;
   max-width: 100%;
   display: block;
   
   }
 
  .banniere {
     width: 200px;
     background-color: var(--cl-light);
     margin-top: 1em;
     background-position: center;
     background-size: cover;
     max-width: 100%;
     display: block;
     margin-left: -160px;
     margin-right: auto;
     margin-bottom: 1em;
     }

}

/******** FIN RESPONSIVE *********/