/*
*@colors
*/
:root{
  --doriole-black:#101114;
  --doriole-bleu1:#1C3661;
  --doriole-bleu4:#004876;
  --doriole-bleu2:#00765D;
  --doriole-bleu3:#00AE42;
  --doriole-gris:#747474;
}
/* Gutenberg classes */
.has-doriole-black-color { color: var(--doriole-black); }
.has-doriole-black-background-color { background-color: var(--doriole-black); }

.has-doriole-bleu1-color { color: var(--doriole-bleu1); }
.has-doriole-bleu1-background-color { background-color: var(--doriole-bleu1); }

.has-doriole-bleu2-color { color: var(--doriole-bleu4); }
.has-doriole-bleu2-background-color { background-color: var(--doriole-bleu4); }

.has-doriole-vert1-color { color: var(--doriole-bleu2); }
.has-doriole-vert1-background-color { background-color: var(--doriole-bleu2); }

.has-doriole-vert2-color { color: var(--doriole-bleu3); }
.has-doriole-vert2-background-color { background-color: var(--doriole-bleu3); }

.has-doriole-gris-color { color: var(--doriole-gris); }
.has-doriole-gris-background-color { background-color: var(--doriole-gris); }
/*
  ####  ###### #    # ###### #####    ##   #
 #    # #      ##   # #      #    #  #  #  #
 #      #####  # #  # #####  #    # #    # #
 #  ### #      #  # # #      #####  ###### #
 #    # #      #   ## #      #   #  #    # #
  ####  ###### #    # ###### #    # #    # ######
*/


body{
  color:var(--doriole-black);
  font-family: 'Catamaran', sans-serif;
  background: url('../images/background-logo-h.jpg') repeat-y top 180px right, url('../images/background-logo-h.jpg') repeat-y bottom left;
}

a{
  color:var(--doriole-bleu2);
  border-bottom:2px solid transparent;
  text-decoration: none;
  transition: 0.3s all;
}
a:hover{
  color:var(--doriole-bleu2);
  border-color:inherit;
}
a.no-hover{
  border-color:transparent !important;
}
h1 b,h1 strong,
h2 b,h2 strong,
h3 b,h3 strong{
  color:var(--doriole-bleu3);
}
h2{
  text-transform: uppercase;
  position: relative;
  margin-bottom:30px;
}
h2:after{
  content:"";
  position: absolute;
  width:60px;
  max-width: 100%;
  height:3px;
  background: var(--doriole-bleu3);
  left:0;
  bottom: -10px;
}
h2.text-center:after,
.text-center h2:after{
  left:calc(50% - 60px/2);
}
.home h3{
  text-transform: uppercase;
  margin-bottom: 15px;
}
.wp-block-button__link{
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
}
.btn-doriole,
.wp-block-button__link,
.wp-block-button__link:active, .wp-block-button__link:focus, .wp-block-button__link:hover, .wp-block-button__link:visited{
  border-radius: 0;
  border:2px solid var(--doriole-bleu3);
  color:var(--doriole-black);
}
.btn-doriole:hover,
.wp-block-button__link:hover{
  background: var(--doriole-bleu3);
  border-color: var(--doriole-bleu3);
  color:#fff;
}

.wp-block-image img{
  max-width: 100%;
  height: auto;
}
/*

 #####  #####  ###### #    #   ##   #    #
 #    # #    # #      ##   #  #  #  #    #
 #    # #    # #####  # #  # #    # #    #
 #####  #####  #      #  # # ###### #    #
 #      #   #  #      #   ## #    #  #  #
 #      #    # ###### #    # #    #   ##
*/
.prenav{
  background: #fff;
}
.prenav #searchsubmit{
  /* display: none; */
}
.prenav .container{
  border-bottom:1px solid var(--doriole-black);
}
.prenav ul{
  margin-bottom:0;
}

.prenav a{
  color: var(--doriole-black);
}
.prenav .form-control,
.prenav .btn{
  border-radius: 0;
  border-color:var(--doriole-black);
}
.prenav .btn{
  color:#fff;
  background: var(--doriole-black);
}
.prenav .btn:hover{
  background: transparent;
  color:var(--doriole-black);
}

.prenav ul li{
  display: inline-block;
  margin-left:10px;
}
.prenav ul li a{
  margin-bottom:0;
}
/*
 #    # ###### #    # #    #
 ##  ## #      ##   # #    #
 # ## # #####  # #  # #    #
 #    # #      #  # # #    #
 #    # #      #   ## #    #
 #    # ###### #    #  ####
*/

.nav-link,
.nav-link:hover{
  color: var(--doriole-black);
  text-transform: uppercase;
  font-weight: bold;
}
.navbar{
  background: #fff;
  z-index: 3;
}

/*

  ####  #      # #####  ###### #####
 #      #      # #    # #      #    #
  ####  #      # #    # #####  #    #
      # #      # #    # #      #####
 #    # #      # #    # #      #   #
  ####  ###### # #####  ###### #    #
*/

.slider-title{
  font-weight: 700;
}
.slider-title p{
  margin: 0;
}
.slider-title b,
.slider-title strong{
  color:var(--doriole-bleu3);
}

/*
  ####   ####  #    # ##### ###### #    # #    #
 #    # #    # ##   #   #   #      ##   # #    #
 #      #    # # #  #   #   #####  # #  # #    #
 #      #    # #  # #   #   #      #  # # #    #
 #    # #    # #   ##   #   #      #   ## #    #
  ####   ####  #    #   #   ###### #    #  ####
*/

.formations{
  background: #f5f5f5;
}
blockquote.wp-block-quote{
  border-left:2px solid var(--doriole-bleu3);
  padding-left:15px;
}
blockquote.wp-block-quote cite{
  margin-left:5px;
}
/*

 ######  ####  #####  #    #   ##   ##### #  ####  #    #  ####
 #      #    # #    # ##  ##  #  #    #   # #    # ##   # #
 #####  #    # #    # # ## # #    #   #   # #    # # #  #  ####
 #      #    # #####  #    # ######   #   # #    # #  # #      #
 #      #    # #   #  #    # #    #   #   # #    # #   ## #    #
 #       ####  #    # #    # #    #   #   #  ####  #    #  ####
*/
.formations .col-4{
  margin-bottom:30px;
}
.service{
  height: 100%;
  background: var(--doriole-bleu1);
  color:#fff;
  padding: 20px;
  text-transform: uppercase;
  font-weight: bold;
  font-size:13px;
  /* -webkit-hyphens: auto; */
  /* -ms-hyphens: auto; */
  /* hyphens: auto; */
  position: relative;
}

/*

   ##    ####  ##### #    #  ####
  #  #  #    #   #   #    # #
 #    # #        #   #    #  ####
 ###### #        #   #    #      #
 #    # #    #   #   #    # #    #
 #    #  ####    #    ####   ####
*/

.actualites .actu-col:nth-child(2) .actualite, .actualites .actu-col:nth-child(6) .actualite{
  background: var(--doriole-bleu1);
}
.actualites .actu-col:nth-child(2) .actualite .btn, .actualites .actu-col:nth-child(6) .actualite .btn{
  color:#fff;
}
.actualites .actu-col:nth-child(3) .actualite, .actualites .actu-col:nth-child(7) .actualite{
  background: var(--doriole-bleu4);
}
.actualites .actu-col:nth-child(3) .actualite .btn,.actualites .actu-col:nth-child(7) .actualite .btn{
  color:#fff;
}
.actualites .actu-col:nth-child(4) .actualite,.actualites .actu-col:nth-child(8) .actualite{
  background: var(--doriole-bleu2);
}
.actualites .actu-col:nth-child(4) .actualite .btn,.actualites .actu-col:nth-child(8) .actualite .btn{
  color:#fff;
  border-color:#fff;
}
.actualites .actu-col:nth-child(5) .actualite,.actualites .actu-col:nth-child(9) .actualite{
  background: var(--doriole-bleu3);
}
.actualites .actu-col:nth-child(5) .actualite .btn,.actualites .actu-col:nth-child(9) .actualite .btn{
  color:#fff;
  border-color:#fff;
}
.actualites .actu-col:nth-child(5) .actualite .btn:hover,.actualites .actu-col:nth-child(9) .actualite .btn:hover{
  background: #fff;
  color:var(--doriole-bleu3);
}

.actualite{
  padding: 20px;
  height: 100%;
  text-align: center;
  color: #fff;
  display: flex;
}
.actu-wrapper{
  margin: auto;
}

/*

  ####  #      # #####  ###### #####
 #      #      # #    # #      #    #
  ####  #      # #    # #####  #    #
      # #      # #    # #      #####
 #    # #      # #    # #      #   #
  ####  ###### # #####  ###### #    #
*/

.doriole-slider{
  padding-left: 5vw;
  padding-right: 5vw;
}
.doriole-slider-image{
  position: relative;
}
.doriole-slider-image:after{
  content:"";
  position: absolute;
  top:0;bottom:0;right:0;left:0;
  background: #000;
  opacity: 0.4;
  z-index: 2;
  pointer-events: none;
}
.slider-content{
  position: absolute;
  top: 0;
  bottom: 40px;
  right: 0;
  left: 0;
  display: flex;
  color:#fff;
  z-index:3;
  text-transform: uppercase;
}
.slider-content .btn{
  color:#fff;
}
.slider-content-wrapper{
  margin: auto;
  text-align: center;
}
.slick-dots{
  left: 0;
  bottom:10px;
}
.slick-dots li button:before {
  background-color: var(--doriole-bleu3);
  border: 2px solid var(--doriole-bleu3);
  border-radius: 50%;
  display: inline-block;
  height: 20px;
  width: 20px;
  color: transparent !important;
  opacity: 1 !important;
}
.slick-dots li.slick-active button:before {
  opacity: 1 !important;
  background-color: #fff;
  border-color: #fff;
}

/*****************************/
/******** OUTILS & LIENS ********/
/*****************************/



.tableoutils img{
	width:40%;
}


/*****************************/
/********* Form **********/
/*****************************/

.nf-form-layout .nf-form-content{
	margin : 0;
}


/*
 ######  ####   ####  ##### ###### #####
 #      #    # #    #   #   #      #    #
 #####  #    # #    #   #   #####  #    #
 #      #    # #    #   #   #      #####
 #      #    # #    #   #   #      #   #
 #       ####   ####    #   ###### #    #
*/

ul li a{
  display: inline-block;
  margin-bottom: 3px;
}
.widget_title{
  text-transform: uppercase;
}
.site__sidebar__widget .menu{
  padding-left: 0;
  list-style: none;
}
.footer-doriole{
  border-top:2px solid #f5f5f5;
}

/*
 #####  ######  ####  #####   ####  #    #  ####  # #    # ######
 #    # #      #      #    # #    # ##   # #      # #    # #
 #    # #####   ####  #    # #    # # #  #  ####  # #    # #####
 #####  #           # #####  #    # #  # #      # # #    # #
 #   #  #      #    # #      #    # #   ## #    # #  #  #  #
 #    # ######  ####  #       ####  #    #  ####  #   ##   ######
*/

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .service{
    font-size: 1em;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  #service-entreprises{
    position: relative;
  }
  #service-entreprises:before{
    content:"";
    position: absolute;
    top:6px;
    left:calc(-15px / 2);
    background: url('../images/dot-spacer.png') repeat-y;
    width:8px;
    height: 100%;
  }
}
