﻿/* Définition des couleurs principales */
:root {
  --color-black: #000000;
  --color-white: #FFFFFF;
  --color-gold: #C6A96C;
  --color-gold-light: #B39355;
  --color-gold-dark: #ad8e4f;
  --color-gray-dark: #333333;
  --color-gray-light: #f5f5f5;
}

/* Services styles */
.halves-services {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.halves-services .half {
  flex: 50%;
  min-height: 350px;
  position: relative;
}

.services-bg-1,
.services-bg-2,
.services-bg-3,
.services-bg-4,
.services-bg-5 {
  width: 100%;
  height: 100%;
  min-height: 350px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

.services-bg-1 {
  background-image: url(../img/serv_1.jpg);
}

.services-bg-2 {
  background-image: url(../img/serv_2.jpg);
}

.services-bg-3 {
  background-image: url(../img/serv_3.jpg);
}

.services-bg-4 {
  background-image: url(../img/serv_4.jpg);
}

.services-bg-5 {
  background-image: url(../img/serv_5.jpg);
}

 
/* 
  1. TEMPLATE BACKGROUNDS
    1.1. single IMG BACKGROUND
    1.2. facts parallax IMG BACKGROUND
    1.3. slick fullscreen and ken burns slideshow IMG BACKGROUND
    1.4. about IMG BACKGROUND
    1.5. works gallery IMG BACKGROUND
    1.6. services IMG BACKGROUND
    1.7. news IMG BACKGROUND
  2. reset
  3. layout
    3.1. upper page
    3.2. lower page
  4. borders
  5. social icons
  6. buttons
  7. testimonials
  8. halves
    8.1. about section halves
    8.2. services section halves
    8.3. all halves BG
  9. home credits
  10. clearfix
  11. hero
    11.1. hero overlay
    11.2. hero container
    11.3. hero bg
    11.4. hero fullscreen FIX
    11.5. hero center container
	11.6. hero home page title
  12. main navigation
    12.1. main navigation link underline
  13. section
  14. about
  15. works
    15.1. works gallery
    15.2. works hover effect
  16. services
  17. facts
    17.1. facts counter
    17.2. facts parallax
  18. contact
  19. scroll indicator
  20. preloader
  21. center container
  22. enllax
  23. link underline
  24. to top arrow
  25. wave
    25.1. wave bottom border
	25.2. wave effect
  26. Slick v1.6.0 CUSTOM
    26.1. slick slide
    26.2. slick slide flickering FIX
    26.3. slick fullscreen slideshow
    26.4. slick navigation
  27. featured news
  28. videos
    28.1. YouTube video
	28.2. Vimeo video	
	28.3. HTML5 video
  29. elements home call
    29.1. main navigation logo home call
    29.2. main navigation home call
    29.3. home credits home call
    29.4. social icons home call
  30. ken burns slideshow
  31. featured news MORE
  32. divider
*/


/* 1. TEMPLATE BACKGROUNDS */
/* 1.1. single IMG BACKGROUND */
.bg-img-SINGLE {
  background-image: url(../img/background/SINGLE-bg.jpg);
  }
  
  .bg-img-SINGLE-WAVE {
  background-image: url(../img/background/SINGLE-WAVE-bg.jpg);
  }
  
  .bg-img-SINGLE-TITLE {
  background-image: url(../img/background/SINGLE-TITLE-bg.jpg);
  }
  
  
  /* 1.2. facts parallax IMG BACKGROUND */
  .parallax-facts {
  background-image: url(../img/background/parallax-facts-bg.jpg);
  }
  
  
  /* 1.3. slick fullscreen and ken burns slideshow IMG BACKGROUND */
  .bg-img-1,
  .kenburns-slide-1 {
  background-image: url(../img/background/hero-bg-1.jpg);
  }
  
  .bg-img-2,
  .kenburns-slide-2 {
  background-image: url(../img/background/hero-bg-2.jpg);
  }
  
  .bg-img-3,
  .kenburns-slide-3 {
  background-image: url(../img/background/hero-bg-3.jpg);
  }
  
  .bg-img-4,
  .kenburns-slide-4 {
  background-image: url(../img/background/hero-bg-4.jpg);
  }
  
  
  /* 1.4. about IMG BACKGROUND */
  .about-bg-1 {
  background-image: url(../img/Visual_Dreamz.jpg);
  }
  
  .about-bg-2 {
  background-image: url(../img/Masud_Ashraf.jpg);
  }
  
  
  /* 1.5. works gallery IMG BACKGROUND */
  .img-fullwidth-works-1 {
  background-image: url(../img/works/works-1.jpg);
  }
  
  .img-fullwidth-works-2 {
  background-image: url(../img/Visual_Dreamz.jpg);
  }
  
  .img-fullwidth-works-3 {
  background-image: url(../img/works/works-3.jpg);
  }
  
  .img-fullwidth-works-4 {
  background-image: url(../img/works/works-4.jpg);
  }
  
  .img-fullwidth-works-5 {
  background-image: url(../img/works/works-5.jpg);
  }
  
  .img-fullwidth-works-6 {
  background-image: url(../img/Visual_Dreamz.jpg);
  }
  
  .img-fullwidth-works-7 {
  background-image: url(../img/works/works-7.jpg);
  }
  
  .img-fullwidth-works-8 {
  background-image: url(../img/works/works-8.jpg);
  }
  
  
  /* 1.6. services IMG BACKGROUND */
  .services-bg-1 {
  background-image: url(../img/serv_1.jpg);
  }
  
  .services-bg-2 {
  background-image: url(../img/serv_2.jpg);
  }
  
  
  /* 1.7. news IMG BACKGROUND */
  .img-fullwidth-featured-carousel-1,
  .panel-left.panel-left-bg-1 {
  background-image: url(../img/featured-news/featured-carousel-1.jpg);
  }
  
  .img-fullwidth-featured-carousel-2,
  .panel-left.panel-left-bg-2 {
  background-image: url(../img/featured-news/featured-carousel-2.jpg);
  }
  
  .img-fullwidth-featured-carousel-3,
  .panel-left.panel-left-bg-3 {
  background-image: url(../img/featured-news/featured-carousel-3.jpg);
  }
  
  .img-fullwidth-featured-carousel-4,
  .panel-left.panel-left-bg-4 {
  background-image: url(../img/featured-news/featured-carousel-4.jpg);
  }
  
  .img-fullwidth-featured-carousel-5,
  .panel-left.panel-left-bg-5 {
  background-image: url(../img/featured-news/featured-carousel-5.jpg);
  }
  
  
  /* 2. reset */
  html, body, div, span, applet, object, 
  iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, 
  abbr, acronym, address, big, cite, code, del, dfn, em, 
  img, ins, kbd, q, s, samp, small, strike, strong, sub, 
  sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, 
  fieldset, form, label, legend, table, caption, tbody, 
  tfoot, thead, tr, th, td, article, aside, canvas, details, 
  embed, figure, figcaption, footer, header, hgroup, menu, nav, 
  output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box;
  }
  
  html, body {
  height: 100%;
  line-height: 170%;
  }
  
  /*body {
  }
  */
  
  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
  }
  
  ol, ul {
  list-style: none;
  }
  
  blockquote, q {
  quotes: none;
  }
  
  blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
  }
  
  table {
  border-collapse: collapse;
  border-spacing: 0;
  }
  
  *:focus {  
  outline: none;
  }
  
  /* remove dotted outline from links,
  button and input element */
  a:focus,
  a:active,
  button::-moz-focus-inner,
  input[type="reset"]::-moz-focus-inner,
  input[type="button"]::-moz-focus-inner,
  input[type="submit"]::-moz-focus-inner {
  border: 0;
  outline: 0;
  }
  
  /* IE10 scrollbar FIX */
  html {
  -ms-overflow-style: scrollbar;
  }
  
  
  /* 3. layout */
  body {
  font-family: 'Raleway', sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  text-align: center;
  background: var(--color-white);
   -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  margin: 0;
  padding: 0;
  }
  
  a {
  text-decoration: none;
  outline: none;
   -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
  -webkit-transition: all 0.5s linear;
     -moz-transition: all 0.5s linear;
      -ms-transition: all 0.5s linear;
       -o-transition: all 0.5s linear;
          transition: all 0.5s linear;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  }
  
  a:hover,
  a:visited,
  a:active,
  a:focus {
  text-decoration: none;
  outline: none;
  -webkit-transition: all 0.5s linear;
     -moz-transition: all 0.5s linear;
      -ms-transition: all 0.5s linear;
       -o-transition: all 0.5s linear;
          transition: all 0.5s linear;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  }
  
  p {
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 2;
   -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  }
  
  p a,
  p a:hover {
  text-decoration: none;
  font-weight: 600;
  outline: none;
  -webkit-transition: all 0.5s linear;
     -moz-transition: all 0.5s linear;
      -ms-transition: all 0.5s linear;
       -o-transition: all 0.5s linear;
          transition: all 0.5s linear;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  }
  
  strong {
  font-weight: bold;
  }
  
  ::-moz-selection {
  color: var(--color-white);
  }
  
  ::selection {
  color: var(--color-white);
  }
  
  .nopadding {
  padding: 0!important;
  margin: 0!important;
  }
  
  
  /* 3.1. upper page */
  .upper-page {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  left: 0;
  top: 0;
  margin: 0;
  }
  
  
  /* 3.2. lower page */
  #about,
  #works,
  #services,
  #facts,
  #news,
  #contact {
  position: relative;
  height: auto;
  min-height: inherit;
  overflow: hidden;
  margin-left: 50px;
  margin-right: 50px;
  background: none;
  }
  
  @media only screen and (max-width: 640px) {
    #about,
    #works,
    #services,
    #facts,
    #news,
    #contact {
      margin-left: 0;
      margin-right: 0;
    }
  }
  
  .halves-about {
  margin-left: 0;
  margin-right: 0;
  }
  
  .works-item {
  position: relative;
  height: 100%;
  min-height: 700px;
  overflow: hidden;
  margin-left: 50px;
  margin-right: 50px;
  background: none;
  }
  
  @media only screen and (max-width: 880px) {
    .works-item {
      height: auto;
      min-height: inherit;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .works-item {
      height: auto;
      min-height: inherit;
    margin-left: 0;
      margin-right: 0;
    }
  }
  
  #services {
  margin-left: 35px;
  margin-right: 35px;
  }
  
  @media only screen and (max-width: 640px) {
    #services {
      margin-left: 0;
      margin-right: 0;
    }
  }
  
  #services-wrapper {
  margin-left: -15px;
  margin-right: -15px;
  }
  
  @media only screen and (max-width: 995px) {
    #services-wrapper {
      margin-left: -12px;
      margin-right: -12px;
    }
  }
  
  #news {
  margin-left: 35px;
  margin-right: 35px;
  }
  
  @media only screen and (max-width: 640px) {
    #news {
      margin-left: 0;
      margin-right: 0;
    }
  }
  
  #featured-news {
  margin-left: 0;
  margin-right: 0;
  }
  
  @media only screen and (max-width: 995px) {
    #featured-news {
      margin-left: -5px;
      margin-right: -5px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    #featured-news {
      margin-left: -45px;
      margin-right: -45px;
    }
  }
  
  
  /* 4. borders */
  .border-top,
  .border-top.top-position,
  .border-top.top-position-primary,
  .border-bottom,
  .border-bottom.bottom-position,
  .border-bottom.bottom-position-primary,
  .border-left,
  .border-left.left-position,
  .border-left.left-position-primary,
  .border-right,
  .border-right.right-position,
  .border-right.right-position-primary {
  position: fixed;
  background: var(--color-white);
  -webkit-transition: all 1.5s ease;
     -moz-transition: all 1.5s ease;
    -ms-transition: all 1.5s ease;
       -o-transition: all 1.5s ease;
          transition: all 1.5s ease;
  z-index: 100;
  }
  
  .border-top.top-position-primary,
  .border-bottom.bottom-position-primary,
  .border-left.left-position-primary,
  .border-right.right-position-primary {
  background: var(--color-gold-light);
  }
  
  .border-top {
  width: 100%;
  height: 110px;
  left: 0;
  top: 0;
  }
  
  @media only screen and (max-width: 768px) {
    .border-top {
      height: 70px;
      display: none; /* Masquer bordure sur petits ecrans */
    }
  }
  
  .border-top.top-position {
  -webkit-transform: translateY(-110px);
     -moz-transform: translateY(-110px);
      -ms-transform: translateY(-110px);
       -o-transform: translateY(-110px);
          transform: translateY(-110px);
  }
  
  @media only screen and (max-width: 768px) {
    .border-top.top-position {
      -webkit-transform: translateY(-70px);
         -moz-transform: translateY(-70px);
          -ms-transform: translateY(-70px);
           -o-transform: translateY(-70px);
              transform: translateY(-70px);
    }
  }
  
  .border-top.top-position-primary {
  -webkit-transform: translateY(-40px);
     -moz-transform: translateY(-40px);
      -ms-transform: translateY(-40px);
       -o-transform: translateY(-40px);
          transform: translateY(-40px);
  }
  
  @media only screen and (max-width: 768px) {
    .border-top.top-position-primary {
      -webkit-transform: translateY(0);
         -moz-transform: translateY(0);
          -ms-transform: translateY(0);
           -o-transform: translateY(0);
              transform: translateY(0);
    }
  }
  
  .border-bottom {
  width: 100%;
  height: 110px;
  left: 0;
  bottom: 0;
  }
  
  @media only screen and (max-width: 768px) {
    .border-bottom {
      height: 50px;
      display: none; /* Masquer bordure sur petits ecrans */
    }
  }
  
  .border-bottom.bottom-position {
  -webkit-transform: translateY(110px);
     -moz-transform: translateY(110px);
      -ms-transform: translateY(110px);
       -o-transform: translateY(110px);
          transform: translateY(110px);
  }
  
  @media only screen and (max-width: 768px) {
    .border-bottom.bottom-position {
      -webkit-transform: translateY(50px);
         -moz-transform: translateY(50px);
          -ms-transform: translateY(50px);
           -o-transform: translateY(50px);
              transform: translateY(50px);
    }
  }
  
  .border-bottom.bottom-position-primary {
  -webkit-transform: translateY(60px);
     -moz-transform: translateY(60px);
      -ms-transform: translateY(60px);
       -o-transform: translateY(60px);
          transform: translateY(60px);
  }
  
  @media only screen and (max-width: 768px) {
    .border-bottom.bottom-position-primary {
      -webkit-transform: translateY(0);
         -moz-transform: translateY(0);
          -ms-transform: translateY(0);
           -o-transform: translateY(0);
              transform: translateY(0);
    }
  }
  
  @media only screen and (max-width: 640px) {
    .border-bottom.bottom-position-primary {
      -webkit-transform: translateY(110px);
         -moz-transform: translateY(110px);
          -ms-transform: translateY(110px);
           -o-transform: translateY(110px);
              transform: translateY(110px);
      display: none; /* Masquer bordure sur petits ecrans */
    }
  }
  
  .border-left {
  width: 110px;
  height: 100%;
  left: 0;
  top: 0;
  }
  
  @media only screen and (max-width: 768px) {
    .border-left {
      width: 50px;
    }
  }
  
  .border-left.left-position {
  -webkit-transform: translateX(-110px);
     -moz-transform: translateX(-110px);
      -ms-transform: translateX(-110px);
       -o-transform: translateX(-110px);
          transform: translateX(-110px);
  }
  
  @media only screen and (max-width: 768px) {
    .border-left.left-position {
      -webkit-transform: translateX(-50px);
         -moz-transform: translateX(-50px);
          -ms-transform: translateX(-50px);
           -o-transform: translateX(-50px);
              transform: translateX(-50px);
    }
  }
  
  .border-left.left-position-primary {
  -webkit-transform: translateX(-60px);
     -moz-transform: translateX(-60px);
      -ms-transform: translateX(-60px);
       -o-transform: translateX(-60px);
          transform: translateX(-60px);
  }
  
  @media only screen and (max-width: 768px) {
    .border-left.left-position-primary {
      -webkit-transform: translateX(0);
         -moz-transform: translateX(0);
          -ms-transform: translateX(0);
           -o-transform: translateX(0);
              transform: translateX(0);
    }
  }
  
  @media only screen and (max-width: 640px) {
    .border-left.left-position-primary {
      -webkit-transform: translateX(-110px);
         -moz-transform: translateX(-110px);
          -ms-transform: translateX(-110px);
           -o-transform: translateX(-110px);
              transform: translateX(-110px);
      display: none; /* Masquer bordure sur petits ecrans */
    }
  }
  
  .border-right {
  width: 110px;
  height: 100%;
  right: 0;
  top: 0;
  }
  
  @media only screen and (max-width: 768px) {
    .border-right {
      width: 50px;
    }
  }
  
  .border-right.right-position {
  -webkit-transform: translateX(110px);
     -moz-transform: translateX(110px);
      -ms-transform: translateX(110px);
       -o-transform: translateX(110px);
          transform: translateX(110px);
  }
  
  @media only screen and (max-width: 768px) {
    .border-right.right-position {
      -webkit-transform: translateX(50px);
         -moz-transform: translateX(50px);
          -ms-transform: translateX(50px);
           -o-transform: translateX(50px);
              transform: translateX(50px);
    }
  }
  
  .border-right.right-position-primary {
  -webkit-transform: translateX(60px);
     -moz-transform: translateX(60px);
      -ms-transform: translateX(60px);
       -o-transform: translateX(60px);
          transform: translateX(60px);
  }
  
  @media only screen and (max-width: 768px) {
    .border-right.right-position-primary {
      -webkit-transform: translateX(0);
         -moz-transform: translateX(0);
          -ms-transform: translateX(0);
           -o-transform: translateX(0);
              transform: translateX(0);
    }
  }
  
  @media only screen and (max-width: 640px) {
    .border-right.right-position-primary {
      -webkit-transform: translateX(110px);
         -moz-transform: translateX(110px);
          -ms-transform: translateX(110px);
           -o-transform: translateX(110px);
              transform: translateX(110px);
      display: none; /* Masquer bordure sur petits ecrans */
    }
  }
  
  
  /* 5. social icons */
  .social-icons-wrapper-share {
  position: fixed;
  display: block;
  visibility: visible;
  right: 20px;
  bottom: 11px;
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  z-index: 1002;
  }
  
  @media only screen and (max-width: 640px) {
    .social-icons-wrapper-share {
      display: none;
    visibility: hidden;
    }
  }
  
  .social-icons-wrapper-share.bottom-position {
  -webkit-transform: translateY(200px);
     -moz-transform: translateY(200px);
      -ms-transform: translateY(200px);
       -o-transform: translateY(200px);
          transform: translateY(200px);
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  }
  
  .social-widgets-wrap {
  position: relative;
  right: 14px;
  top: 0;
  float: right;
  display: none;
  }
  
  .social-widgets {
  float: right;
  }
  
  .social-widgets a {
  display: block;
  }
  
  .social-widgets ul {
  list-style-type: none;
  }
  
  .social-widgets ul li {
  display: inline-block;
  text-align: right;
  }
  
  .social-widgets ul li {
  font-size: 16px;
  width: 16px;
  height: 16px;
  line-height: 16px;
  margin-left: 5px;
  margin-right: 5px;
  margin-top: 3px;
  text-align: center;
  float: right;
  }
  
  .social-widgets ul li:first-child {
  margin-left: 0;
  }
  
  .social-toggle-wrap {
  float: right;
  }
  
  .social-toggle-wrap:hover {
  cursor: pointer;
  }
  
  .social-toggle {
  float: right;
  }
  
  .social-toggle i {
  font-size: 20px;
  color: var(--color-black);
  }
  
  .social-icon a {
  padding: 0;
  color: var(--color-black);
  text-decoration: none;
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -webkit-transition: all 0.5s linear;
     -moz-transition: all 0.5s linear;
      -ms-transition: all 0.5s linear;
       -o-transition: all 0.5s linear;
          transition: all 0.5s linear;
  }
  
  .social-icon a:hover {
  padding: 0;
  color: var(--color-black);
  text-decoration: none;
          opacity: 0.3;
     -moz-opacity: 0.3;
  -webkit-opacity: 0.3;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -webkit-transition: all 0.5s linear;
     -moz-transition: all 0.5s linear;
      -ms-transition: all 0.5s linear;
       -o-transition: all 0.5s linear;
          transition: all 0.5s linear;
  }
  
  
  /* 6. buttons */
  .button-the {
  position: relative;
  display: inline-block;
  text-transform: uppercase;
  text-align: left;
  color: var(--color-black);
  background: none;
  padding: 2px 30px 2px 0;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
      cursor: pointer;
  }
  
  .button-the:before {
  position: absolute;
  content: "";
  top: 50%;
  right: -19px;
  width: 25px;
  height: 1px;
  background: var(--color-black);
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
  }
  
  .button-the:hover {
  background: none;
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
  }
  
  .button-the:hover:before {
  right: -29px;
  }
  
  .button-the-wrapper,
  .button-the-wrapper a,
  .button-the-wrapper a:hover,
  .button-the-wrapper a:visited,
  .button-the-wrapper a:active,
  .button-the-wrapper a:focus {
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: left; text-align: center;
  font-weight: 400;
  letter-spacing: 1px;
  color: var(--color-black);
  }
  
  
  /* 7. testimonials */
  .testimonial {
  background: none;
  }
  
  .testimonial .inner {
  max-width: 940px;
  margin: 0 auto;
  padding: 0;
  }
  
  @media only screen and (max-width: 1200px) {
    .testimonial .inner {
      max-width: 900px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .testimonial .inner {
      max-width: 700px;
    }
  }
  
  @media only screen and (max-width: 880px) {
    .testimonial .inner {
      max-width: 450px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .testimonial .inner {
      max-width: 465px;
    padding: 0 25px;
    }
    
    .testimonial .inner.inner-about {
      max-width: 425px;
    padding: 0;
    }
  }
  
  .testimonial blockquote {
  position: relative;
  font-family: 'Raleway', sans-serif;
  color: var(--color-gray-dark);
  font-size: 20px;
  font-style: italic;
  font-weight: 600;
  line-height: 2;
  margin-bottom: 25px;
  padding: 0;
  z-index: 1;
  }
  
  q,
  blockquote {
  quotes: none;
  }
  
  .testimonial cite {
  position: relative;
  font-size: 16px;
  font-weight: bold;
  color: var(--color-gray-light);
  margin: 0 auto;
  }
  
  .quote-inner a,
  .quote-inner a:hover {
  color: var(--color-black);
  text-decoration: none;
  }
  
  .testimonial blockquote::before {
  content: "";
  position: absolute;
  color: var(--color-gray-light);
  font-family: Georgia, serif;
  font-size: 165px;
  font-style: normal;
  left: 0;
  top: -90px;
  z-index: -10;
  }
  
  @media only screen and (max-width: 640px) {
    .testimonial blockquote::before {
      font-size: 135px;
    top: -70px;
    }
  }
  
  .quote-author {
  letter-spacing: normal;
  }
  
  @media only screen and (max-width: 995px) {
    .quote-author {
      position: relative;
      bottom: -3px;
    }
  }
  
  
  /* 8. halves */
  /* 8.1. about section halves */
  .halves-about {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  }
  
  .halves-about .half-about-1 {
  min-height: 350px;
  -webkit-box-flex: 75%;
          -ms-flex: 75%;
              flex: 75%;
  }
  
  @media all and (min-width: 1920px) {
    .halves-about .half-about-1 {
    min-height: 492px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .halves-about .half-about-1 {
      min-height: 350px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .halves-about {
      -webkit-box-orient: vertical;
              box-orient: vertical;
    -webkit-box-direction: normal;
            box-direction: normal;
    -webkit-flex-direction: column;
          -ms-flex-direction: column;
              flex-direction: column;
    }
  
    .halves-about .half-about-1 {
      -webkit-box-flex: 0;
              -ms-flex: none;
                  flex: none;
    }
  }
  
  .halves-about .half-about-2 {
  min-height: 350px;
  -webkit-box-flex: 25%;
          -ms-flex: 25%;
              flex: 25%;
  }
  
  
  /* 8.2. services section halves */
  .halves-services {
  display: flex;
  }
  
  .halves-services .half {
  min-height: 350px;
  -webkit-box-flex: 50%;
          -ms-flex: 50%;
              flex: 50%;
  }
  
  @media all and (min-width: 1920px) {
    .halves-services .half {
    min-height: 492px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .halves-services .half {
      min-height: 350px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .halves-services {
      -webkit-box-orient: vertical;
              box-orient: vertical;
    -webkit-box-direction: normal;
            box-direction: normal;
    -webkit-flex-direction: column;
          -ms-flex-direction: column;
              flex-direction: column;
    }
  
    .halves-services .half {
      -webkit-box-flex: 0;
              -ms-flex: none;
                  flex: none;
    }
  }
  
  
  /* 8.3. all halves BG */
  .about-bg-1,
  .about-bg-2,
  .services-bg-1,
  .services-bg-2,
  .services-bg-3,
  .services-bg-4,
  .services-bg-5 {
  width: 100%;
  height: 100%;
  min-height: 350px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  display: block;
  }
  
  
  /* 9. home credits */
  .bottom-credits {
  position: fixed;
  display: block;
  visibility: visible;
  width: auto;
  height: 50px;
  left: 20px;
  bottom: -14px;
  font-size: 9px;
  text-transform: uppercase;
  text-align: left;
  letter-spacing: 0.05em;
  font-weight: 600;
   -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  z-index: 1002;
  }
  
  .bottom-credits.bottom-position {
  -webkit-transform: translateY(200px);
     -moz-transform: translateY(200px);
      -ms-transform: translateY(200px);
       -o-transform: translateY(200px);
          transform: translateY(200px);
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  }
  
  .bottom-credits a,
  .bottom-credits a:hover {
  color: var(--color-gray-dark);
  text-decoration: none;
  }
  
  
  /* 10. clearfix */
  .clearfix:after {
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
  }
  
  
  /* 11. hero */
  /* 11.1. hero overlay */
  .overlay:before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
  }
  
  .overlay-dark-60:before,
  .overlay-dark-60-video:before {
  background: rgba(0, 0, 0, .6);
  }
  
  .overlay-dark-40:before,
  .overlay-dark-40-video:before {
  background: rgba(0, 0, 0, .4);
  }
  
  .overlay-dark-60:before,
  .overlay-dark-40:before {
  -webkit-pointer-events: none;
     -moz-pointer-events: none;
          pointer-events: none;
  }
  
  .overlay-dark-60-video:before,
  .overlay-dark-40-video:before {
  -webkit-pointer-events: auto;
     -moz-pointer-events: auto;
          pointer-events: auto;
  }
  
  
  /* 11.2. hero container */ 
  .hero-fullscreen {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
  }
  
  
  /* 11.3. hero bg */
  .hero-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
     -moz-background-size: cover;
      -ms-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
  }
  
  
  /* 11.4. hero fullscreen FIX */ 
  .hero-fullscreen-FIX {
  width: 100%;
  height: 100%;
  }
  
  
  /* 11.5. hero center container */
  .hero-center-container {
  position: relative;
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 100%;
  z-index: 1;
  }
  
  .hero-center-block {
  display: table-cell;
  vertical-align: middle;
  }
  
  
  /* 11.6. hero home page title */
  h1.home-page-title {
  position: relative;
  font-family: 'Oswald', sans-serif;
  font-size: 200px;
  font-weight: 700;
  color: var(--color-white);
  text-shadow: 1px 1px 2px var(--color-black);
  text-align: center;
  text-transform: uppercase;
  letter-spacing: -0.04em;
  line-height: 1;
  margin: 0 auto;
  padding: 0 55px;
  z-index: 1;
  }
  
  @media all and (min-width: 1920px) {
    h1.home-page-title {
      font-size: 300px;
    }
  }
  
  @media only screen and (max-width: 1200px) {
    h1.home-page-title {
      font-size: 150px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    h1.home-page-title {
      font-size: 100px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    h1.home-page-title {
      font-size: 80px;
    }
  }
  
  @media only screen and (max-width: 480px) {
    h1.home-page-title {
      font-size: 70px;
    }
  }
  
  h1.home-page-title-hide,
  h1.home-page-title-show {
  -webkit-transition: all 1.5s ease;
     -moz-transition: all 1.5s ease;
    -ms-transition: all 1.5s ease;
       -o-transition: all 1.5s ease;
          transition: all 1.5s ease;
  }
  
  h1.home-page-title-hide {
          opacity: 0;
     -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  letter-spacing: 0.20em;
  }
  
  @media only screen and (max-width: 480px) {
    h1.home-page-title-hide {
      letter-spacing: 0.10em;
    }
  }
  
  h1.home-page-title-show {
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  letter-spacing: -0.04em;
  }
  
  
  /* 12. main navigation */
  #header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  background: none;
  z-index: 1001;
  }
  
  .logo .logo-dark,
  .main-navigation-bg .logo .logo-dark {
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  height: auto;
  }
  
  .navbar-bg-switch {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  -webkit-transition: all .4s ease-out;
     -moz-transition: all .4s ease-out;
      -ms-transition: all .4s ease-out;
       -o-transition: all .4s ease-out;
          transition: all .4s ease-out;
  z-index: 999;
  }
  
  .main-navigation {
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  }
  
  .main-navigation.top-position {
  -webkit-transform: translateY(-200px);
     -moz-transform: translateY(-200px);
      -ms-transform: translateY(-200px);
       -o-transform: translateY(-200px);
          transform: translateY(-200px);
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  }
  
  .main-navigation .navbar-nav li a {
  position: relative;
  font-family: 'Oswald', sans-serif;
  font-style: normal;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color-gray-dark);
  padding: 26px 15px 0 15px;
  -webkit-transition: all .4s ease-out;
     -moz-transition: all .4s ease-out;
      -ms-transition: all .4s ease-out;
       -o-transition: all .4s ease-out;
          transition: all .4s ease-out;
  cursor: pointer;
  }
  
  @media only screen and (max-width: 768px) {
    .main-navigation .navbar-nav li a {
      padding: 10px 15px;
    }
  }
  
  .main-navigation .navbar-nav li a:hover {
  color: var(--color-gray-dark);
  -webkit-transition: all .4s ease-out;
     -moz-transition: all .4s ease-out;
      -ms-transition: all .4s ease-out;
       -o-transition: all .4s ease-out;
          transition: all .4s ease-out;
  }
  
  .nav li a:focus,
  .nav li a:hover {
  color: var(--color-gray-dark);
  background: none;
  -webkit-transition: all .4s ease-out;
     -moz-transition: all .4s ease-out;
      -ms-transition: all .4s ease-out;
       -o-transition: all .4s ease-out;
          transition: all .4s ease-out;
  }
  
  .main-navigation-bg {
  height: 70px;
  background: none;
  -webkit-transition: all .4s ease-out;
     -moz-transition: all .4s ease-out;
      -ms-transition: all .4s ease-out;
       -o-transition: all .4s ease-out;
          transition: all .4s ease-out;
  }
  
  @media only screen and (max-width: 768px) {
    .main-navigation-bg {
      height: auto;
    min-height: 70px;
      background: rgba(255, 255, 255, 1);
    }
    
    .main-navigation-bg.main-navigation-bg-position-primary {
      background: var(--color-gray-light);
    }
  }
  
  .main-navigation-bg .main-navigation .navbar-nav li a {
  color: var(--color-gray-dark);
  padding: 26px 15px 0 15px;
  -webkit-transition: all .4s ease-out;
     -moz-transition: all .4s ease-out;
      -ms-transition: all .4s ease-out;
       -o-transition: all .4s ease-out;
          transition: all .4s ease-out;
  }
  
  @media only screen and (max-width: 768px) {
    .main-navigation-bg .main-navigation .navbar-nav li a {
      padding: 10px 15px;
    }
  }
  
  .main-navigation-bg .main-navigation .navbar-nav li a:hover {
  color: var(--color-gray-dark);
  }
  
  @media only screen and (max-width: 768px) {
    .navbar-toggle .icon-bar {
      background: var(--color-black);
    margin-top: 63px;
    }
    
    .main-navigation-bg .navbar-toggle .icon-bar {
      background: var(--color-black);
    }
    
    .navbar-toggle {
      margin-top: -45px;
      margin-right: -10px;
      -webkit-transition: all .4s ease-out;
         -moz-transition: all .4s ease-out;
          -ms-transition: all .4s ease-out;
           -o-transition: all .4s ease-out;
              transition: all .4s ease-out;
    }
    
    .main-navigation-bg .navbar-toggle {
      margin-top: -45px;
      margin-right: -10px;
      -webkit-transition: all .4s ease-out;
         -moz-transition: all .4s ease-out;
          -ms-transition: all .4s ease-out;
           -o-transition: all .4s ease-out;
              transition: all .4s ease-out;
    }
    
    .navbar-collapse {
      background: rgba(255, 255, 255, 1);
    }
    
    .navbar-collapse.navbar-collapse-position-primary {
      background: var(--color-gray-light);
    }
  }
  
  .main-navigation-bg .link-underline-menu:before {
  bottom: -5px;
  background: var(--color-black);
  }
  
  .navbar-nav li.active,
  .navbar-nav > .active > a {
  color: var(--color-gold)!important;
  text-decoration: none;
  }
  
  .navbar-nav > .active > a {
  background: none;
  }
  
  .main-navigation-bg .navbar-nav li.active,
  .main-navigation-bg .navbar-nav > .active > a {
  color: var(--color-white)!important;
  }
  
  @media (min-width: 768px) {
    .navbar-nav {
      position: relative;
      right: -50%;
    }
    
    .navbar-nav > li {
      position: relative;
      left: -50%;
    }
    
    .navbar-nav > li a {
      vertical-align: middle;
    } 
  }
  
  
  /* 12.1. main navigation link underline */
  .link-underline-menu {
  position: relative;
  text-decoration: none;
  cursor: pointer;
  }
  
  .link-underline-menu:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: -5px;
  left: 0;
  background: var(--color-black);
  visibility: hidden;
  -webkit-transform: scaleX(0);
     -moz-transform: scaleX(0);
      -ms-transform: scaleX(0);
       -o-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: all 0.4s ease-in-out 0s;
     -moz-transition: all 0.4s ease-in-out 0s;
      -ms-transition: all 0.4s ease-in-out 0s;
       -o-transition: all 0.4s ease-in-out 0s;
          transition: all 0.4s ease-in-out 0s;
  }
  
  .link-underline-menu:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
     -moz-transform: scaleX(1);
      -ms-transform: scaleX(1);
       -o-transform: scaleX(1);
          transform: scaleX(1);
  }
  
  @media only screen and (max-width: 768px) {
    .link-underline-menu:hover:before {
      visibility: hidden;
    }
  }
  
  .link-underline-menu.active:before {
  background: var(--color-gold);
  }
  
  .main-navigation-bg .link-underline-menu.active:before {
  background: var(--color-white);
  }
  
  
  /* 13. section */
  .sections {
  position: relative;
  z-index: 5;
  }
  
  @media only screen and (max-width: 1200px) {
    .sections {
      width: 100%!important;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .sections {
      padding: 0 10px;
    }
  }
  
  section h2.section-heading {
  position: relative;
  font-family: 'Oswald', sans-serif;
  font-size: 80px;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.3;
  text-align: center;
  letter-spacing: -0.08em;
  color: var(--color-black);
  margin: -20px auto -13px auto;
  padding: 0;
  z-index: 1;
  }
  
  @media only screen and (max-width: 995px) {
    section h2.section-heading {
      font-size: 60px;
    margin: -52px auto -10px auto;
    }
  }
  
  @media only screen and (max-width: 880px) {
    section h2.section-heading {
    margin: -2px auto -10px auto;
    }
  }
  
  @media only screen and (max-width: 640px) {
    section h2.section-heading {
      font-size: 50px;
    margin: -58px auto -8px auto;
    }
  }
  
  h2.section-heading.section-heading-facts {
  top: -20px;
  margin-bottom: -34px;
  }
  
  @media only screen and (max-width: 1190px) {
    h2.section-heading.section-heading-facts {
    top: -1px;
      margin-bottom: -16px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    h2.section-heading.section-heading-facts {
    top: 36px;
      margin-bottom: 26px;
    }
  }
  
  @media only screen and (max-width: 880px) {
    h2.section-heading.section-heading-facts {
      top: -14px;
      margin-bottom: -24px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    h2.section-heading.section-heading-facts {
      top: 46px;
      margin-bottom: 38px; 
    }
  }
  
  h2.section-subheading {
  position: relative;
  display: inline-block;
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  margin-top: -5px;
  text-align: center;
  letter-spacing: 0.05em;
  color: var(--color-gold);
  }
  
  .section-subheading {
  margin: -5px auto -6px auto;
  }
  
  h2.section-subheading::after {
  content: "";
  position: absolute;
  width: 25px;
  height: 1px;
  top: 50%;
  left: 100%;
  background-color: var(--color-gold);
  margin-left: 25px;
  }
  
  h2.section-subheading span {
  position: relative;
  display: inline-block;
  padding-right: 0;
  line-height: 1;
  }
  
  h2.section-subheading span:before {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
  right: 0;
  width: 30px;
  height: 0;
  margin-top: -2px;
  border-top: none;
  }
  
  
  /* 14. about */
  .img-fullwidth-wrapper {
  position: relative;
  min-height: 550px;
  }
  
  @media only screen and (max-width: 880px) {
    .img-fullwidth-wrapper {
      min-height: 500px;
    }
  }
  
  .img-fullwidth-wrapper.img-fullwidth-wrapper-all {
  position: relative;
  min-height: 150px;
  }
  
  .img-fullwidth {
  position: absolute;
  height: auto;
  min-height: 550px;
  top: 0;
  bottom: 0;
  }
  
  @media only screen and (max-width: 880px) {
    .img-fullwidth {
      min-height: 500px;
    }
  }
  
  .img-fullwidth-all {
  position: relative;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
     -moz-background-size: cover;
      -ms-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
  }
  
  .img-fullwidth-txt {
  position: relative;
  margin: 0;
  }
  
  @media only screen and (max-width: 1200px) {
    .img-fullwidth-txt {
    margin: 0 auto;
    }
  }
  
  .img-fullwidth-txt-inner {
  margin: 0 90px;
  }
  
  @media all and (min-width: 1920px) {
    .img-fullwidth-txt-inner {
      margin: 0 95px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .img-fullwidth-txt-inner {
      margin: 0 80px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .img-fullwidth-txt-inner {
      margin: 0 25px;
    }
  }
  
  @media only screen and (max-width: 1200px) {
    .about-body {
      margin: 0 50px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .about-body {
      margin: 0 60px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .about-body {
      margin: 0 auto;
    }
  }
  
  .img-fullwidth-txt-services-right {
  position: relative;
  margin: 0 15px 0 0;
  padding: 0 83px;
  }
  
  @media all and (min-width: 1920px) {
    .img-fullwidth-txt-services-right {
    margin: 0 15px 0 0;
    padding: 0 90px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .img-fullwidth-txt-services-right {
       margin: 0 12px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .img-fullwidth-txt-services-right {
       padding: 0 15px;
    }
  }
  
  .img-fullwidth-txt-services-left {
  position: relative;
  margin: 0 0 0 15px;
  padding: 0 83px;
  }
  
  @media all and (min-width: 1920px) {
    .img-fullwidth-txt-services-left {
    margin: 0 0 0 15px;
    padding: 0 90px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .img-fullwidth-txt-services-left {
       margin: 0 12px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .img-fullwidth-txt-services-left {
       padding: 0 15px;
    }
  }
  
  .img-fullwidth-wrapper-news {
  position: relative;
  overflow: hidden;
  height: 100%;
  }
  
  .img-fullwidth-news {
  min-height: 600px;
  }
  
  @media only screen and (max-width: 995px) {
    .img-fullwidth-news {
      min-height: 400px;
    }
  }
  
  @media (min-width: 992px) {
    .img-fullwidth-news {
      position: absolute;
    width: 50vw;
      height: auto;
      top: 0;
      bottom: 0;
    }
  }
  
  .img-fullwidth-all-news {
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
     -moz-background-size: cover;
      -ms-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
  }
  
  .slick-left .blockquote {
  position: relative;
  margin-left: 50px;
  margin-right: 0;
  }
  
  @media only screen and (max-width: 995px) {
    .slick-left .blockquote {
       margin: 0 55px;
    }
  }
  
  .center-container-slick-inner {
  display: table-cell;
  vertical-align: middle;
  padding: 0 65px;
  }
  
  @media all and (min-width: 1920px) {
    .center-container-slick-inner {
      padding: 0 75px;
    }
  }
  
  @media only screen and (max-width: 1200px) {
    .center-container-slick-inner {
    padding: 0 69px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .center-container-slick-inner {
    padding: 0 65px;
    }
  }
  
  @media only screen and (max-width: 880px) {
    .center-container-slick-inner {
    padding: 0 60px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .center-container-slick-inner {
    padding: 0;
    }
  }
  
  
  /* 15. works */
  /* 15.1. works gallery */
  .works-section {
  margin-left: 70px;
  margin-right: 70px;
  }
  
  @media only screen and (max-width: 640px) {
    .works-section {
      margin-left: 20px;
      margin-right: 20px;
    }
  }
  
  .works-section.section-100vh {
  height: -webkit-calc(100vh - 60px);
  height: -moz-calc(100vh - 60px);
  height: calc(100vh - 60px);
  }
  
  @media (max-width: 768px) {
    .works-section.section-100vh {
      height: -webkit-calc(100vh - 40px);
      height: -moz-calc(100vh - 40px);
      height: calc(100vh - 40px);
    }
  }
  
  .works-section:last-child {
  margin-bottom: 0;
  }
  
  .works-section.section-gallery .box-img {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  background: var(--color-white);
  overflow: hidden;
  }
  
  .works-section.section-gallery .works-section-gallery-box {
  position: absolute;
  top: 0;
  left: 0;
  }
  
  .works-section.section-gallery .works-section-gallery-box.img-1 {
  width: 20%;
  height: 40%;
  padding: 0 10px 10px 0;
  }
  
  .works-section.section-gallery .works-section-gallery-box.img-2 {
  left: 20%;
  width: 20%;
  height: 40%;
  padding: 0 10px 10px 10px;
  }
  
  .works-section.section-gallery .works-section-gallery-box.img-3 {
  top: 40%;
  width: 40%;
  height: 60%;
  padding: 10px 10px 0 0;
  }
  
  .works-section.section-gallery .works-section-gallery-box.img-4 {
  left: 40%;
  width: 40%;
  height: 60%;
  padding: 0 10px 10px 10px;
  }
  
  .works-section.section-gallery .works-section-gallery-box.img-5 {
  top: 60%;
  left: 40%;
  width: 20%;
  height: 40%;
  padding: 10px 10px 0 10px;
  }
  
  .works-section.section-gallery .works-section-gallery-box.img-6 {
  top: 60%;
  left: 60%;
  width: 20%;
  height: 40%;
  padding: 10px 10px 0 10px;
  }
  
  .works-section.section-gallery .works-section-gallery-box.img-7 {
  left: 80%;
  width: 20%;
  height: 50%;
  padding: 0 0 10px 10px;
  }
  
  .works-section.section-gallery .works-section-gallery-box.img-8 {
  top: 50%;
  left: 80%;
  width: 20%;
  height: 50%;
  padding: 10px 0 0 10px;
  }
  
  @media (max-width: 1600px) {
    .works-section.section-gallery {
      height: auto;
      padding: 0!important;
    }
    
    .works-section.section-gallery .works-section-gallery-box {
      position: relative;
      float: left;
      height: 50vh!important;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-1 {
      width: 50%;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-2 {
      left: auto;
      width: 50%;
      padding-right: 0;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-3 {
      top: auto;
      width: 100%;
      padding: 10px 0 10px 0;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-4 {
      left: auto;
      width: 50%;
      padding: 10px 10px 10px 0;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-5 {
      top: auto;
      left: auto;
      width: 50%;
      padding: 10px 0 10px 10px;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-6 {
      top: auto;
      left: auto;
      width: 100%;
      padding: 10px 0 10px 0;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-7 {
      left: auto;
      width: 50%;
      padding: 10px 10px 0 0;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-8 {
      top: auto;
      left: auto;
      width: 50%;
      padding: 10px 0 0 10px;
    }
  }
  
  @media (max-width: 768px) {
    .works-section.section-gallery {
      padding: 0;
    }
    
    .works-section.section-gallery .works-section-gallery-box {
      height: 32vh!important;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-1 {
      padding-right: 10px;
      padding-bottom: 10px
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-2 {
      padding-left: 10px;
      padding-bottom: 10px;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-3 {
      padding-top: 10px;
      padding-bottom: 10px;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-4 {
      padding-top: 10px;
      padding-right: 10px;
      padding-bottom: 10px;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-5 {
      padding-top: 10px;
      padding-left: 10px;
      padding-bottom: 10px;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-6 {
      padding-top: 10px;
      padding-bottom: 10px;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-7 {
      padding-top: 10px;
      padding-right: 10px;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-8 {
      padding-top: 10px;
      padding-left: 10px;
    }
  }
  
  @media (max-width: 600px) {
    .works-section.section-gallery .works-section-gallery-box {
      width: 100%!important;
      height: 40vh!important;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-1,
    .works-section.section-gallery .works-section-gallery-box.img-2,
    .works-section.section-gallery .works-section-gallery-box.img-3,
    .works-section.section-gallery .works-section-gallery-box.img-4,
    .works-section.section-gallery .works-section-gallery-box.img-5,
    .works-section.section-gallery .works-section-gallery-box.img-6,
    .works-section.section-gallery .works-section-gallery-box.img-7,
    .works-section.section-gallery .works-section-gallery-box.img-8 {
      padding: 10px 0;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-1 {
      padding-top: 0;
    }
    
    .works-section.section-gallery .works-section-gallery-box.img-8 {
      padding-bottom: 0;
    }
  }
  
  @media (max-width: 1024px) {
    .works-section.section-100vh {
      height: auto;
      padding: 120px 0;
    }
    
    .works-section.section-gallery {
      padding: 0;
    }
  }
  
  @media screen and (min-width: 1600px) and (max-height: 900px) {
    .works-section.section-gallery {
      height: auto;
      padding: 0!important;
    }
  
    .works-section.section-gallery .works-section-gallery-box {
      position: relative;
      float: left;
      height: 60vh!important;
    }
  
    .works-section.section-gallery .works-section-gallery-box.img-1 {
      width: 50%;
    }
  
    .works-section.section-gallery .works-section-gallery-box.img-2 {
      left: auto;
      width: 50%;
      padding-right: 0;
    }
  
    .works-section.section-gallery .works-section-gallery-box.img-3 {
      top: auto;
      width: 100%;
      padding: 15px 0 15px 0;
    }
  
    .works-section.section-gallery .works-section-gallery-box.img-4 {
      left: auto;
      width: 50%;
      padding: 15px 15px 15px 0;
    }
  
    .works-section.section-gallery .works-section-gallery-box.img-5 {
      top: auto;
      left: auto;
      width: 50%;
      padding: 15px 0 15px 15px;
    }
  
    .works-section.section-gallery .works-section-gallery-box.img-6 {
      top: auto;
      left: auto;
      width: 100%;
      padding: 15px 0 15px 0;
    }
  
    .works-section.section-gallery .works-section-gallery-box.img-7 {
      left: auto;
      width: 50%;
      padding: 15px 15px 0 0;
    }
  
    .works-section.section-gallery .works-section-gallery-box.img-8 {
      top: auto;
      left: auto;
      width: 50%;
      padding: 15px 0 0 15px;
    }
  }
  
  @media screen and (min-width: 1025px) and (max-height: 900px) {
    .works-section.section-100vh {
      height: auto;
      padding: 120px 0;
    }
  }
  
  .force-height {
  height: 100%;
  }
  
  .force-height .row,
  .force-height .works-section-col {
  height: 100%;
  }
  
  .row.no-gutter {
  margin-left: 0;
  margin-right: 0;
  }
  
  .row.no-gutter>[class^="col-"],
  .row.no-gutter>[class*=" col-"] {
  padding-left: 0;
  padding-right: 0;
  }
  
  /*
  @media (max-width: 1024px) {
    [class*="col-md"] {
      float: left;
      width: 100%;
      left: auto;
      right: auto;
    }
  }
  */
  
  .no-mrg-pdg {
  margin: 0;
  padding: 0;
  }
  
  
  /* 15.2. works hover effect */
  .image-works {
  position: relative;
  z-index: 5;
  }
  
  .image-works>.hover-effect {
  position: absolute;
  background: rgba(255, 255, 255, 0.95);
          opacity: 0;
     -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-transition: opacity 0.35s ease-out;
     -moz-transition: opacity 0.35s ease-out;
      -ms-transition: opacity 0.35s ease-out;
     -o-transition: opacity 0.35s ease-out;
          transition: opacity 0.35s ease-out;
  width: -webkit-calc(100% - 20px);
  width: -moz-calc(100% - 20px);
  width: calc(100% - 20px);
  height: -webkit-calc(100% - 20px);
  height: -moz-calc(100% - 20px);
  height: calc(100% - 20px);
  top: 10px;
  left: 10px;
  bottom: 10px;
  right: 10px;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  z-index: 1;
  }
  
  .image-works:hover .hover-effect {
          opacity: 0.90;
     -moz-opacity: 0.90;
  -webkit-opacity: 0.90;
  filter: alpha(opacity=90);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
  cursor: pointer;
  }
  
  .pswp__img--placeholder--blank {
  background: var(--color-white);
  }
  
  .description {
  position: absolute;
  padding: 0 15px;
  margin-bottom: 5px;
  bottom: -40px;
  left: 0;
  right: 0;
          opacity: 0;
     -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-transition: all 0.8s ease;
     -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
       -o-transition: all 0.8s ease;
          transition: all 0.8s ease;
  text-align: center;
  -webkit-pointer-events: none;
     -moz-pointer-events: none;
          pointer-events: none;
  z-index: 10;
  }
  
  .description h3 {
  position: relative;
  font-family: 'Oswald', sans-serif;
  font-size: 50px;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: -0.04em;
  color: var(--color-gold);
  line-height: 1;
  margin: -9px auto -1px auto;
  z-index: 10;
  }
  
  @media only screen and (max-width: 640px) {
    .description h3 {
      font-size: 40px;
    margin: -4px auto -1px auto;
    }
  }
  
  .description-second {
  margin: -7px auto -6px auto;
  }
  
  .item-grid-size:hover .description,
  .item-grid-size:focus .description {
  bottom: 5px;
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  
  .item-grid-size {
  position: relative;
  padding: 0;
  width: 100%;
  height: 100%;
  }
  
  .item {
  position: relative;
  margin-bottom: 0;
  float: left;
  }
  
  .item:after {
  content: "";
  display: block;
  clear: both;
  }
  
  .item-wh {
  width: 100%;
  height: auto;
  }
  
  .item:hover .link-wrap {
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  cursor: pointer;
  }
  
  .item:hover .link-wrap span:before,
  .item:hover .link-wrap span:after {
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  
  .item:hover .link-wrap span:nth-child(1):before,
  .item:hover .link-wrap span:nth-child(1):after {
  width: 15px;
  }
  
  .item:hover .link-wrap span:nth-child(2):before,
  .item:hover .link-wrap span:nth-child(2):after {
  height: 15px;
  }
  
  .post-heading-works {
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
  padding: 0;
  text-align: center;
  letter-spacing: 0.05em;
  color: var(--color-black);
  }
  
  .post-heading-works {
  text-align: center;
  margin: 2px auto;
  }
  
  
  /* 16. services */
  .all-heading-wrapper {
  position: relative;
  margin: -42px auto 15px auto;
  }
  
  @media only screen and (max-width: 640px) {
    .all-heading-wrapper {
      margin: -47px auto 9px auto;
    }
  }
  
  .post-txt p {
  position: relative;
  margin: 0;
  }
  
  .services-heading {
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 0.05em;
  color: var(--color-black);
  margin-bottom: 0;
  }
  
  @media only screen and (max-width: 880px) {
    .services-heading-secondary {
      margin-bottom: 67px;
    }
  }
  
  .services-heading {
  padding: 56px 0 0 0;
  }
  
  .services-number-title {
  position: absolute;
  width: 100%;
  height: auto;
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: -0.04em;
  font-size: 65px;
  line-height: 1;
  color: var(--color-gold-light);
  top: 34px;
  z-index: -1;
  }
  
  @media only screen and (max-width: 640px) {
    .services-number-title {
      font-size: 50px;
    top: 42px;
    }
  }
  
  
  /* 17. facts */
  /* 17.1. facts counter */
  .facts-counter-wrapper {
  padding: 0;
  margin: 4px auto 0 auto;
  }
  
  @media only screen and (max-width: 880px) {
    .facts-counter-wrapper {
      font-size: 35px;
    margin-top: -8px;
    }
  }
  
  .facts-counter-number {
  font-family: 'Oswald', sans-serif;
  font-size: 35px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.04em;
  text-align: center;
  color: var(--color-gold);
  }
  
  .facts-counter-number.large {
  font-size: 50px;
  margin-top: -15px;
  }
  
  @media only screen and (max-width: 880px) {
    .facts-counter-number.large {
      font-size: 35px;
    margin-top: 0;
    }
  }
  
  .facts-counter-description {
  color: var(--color-black);
  text-align: center;
  text-transform: uppercase;
  }
  
  @media only screen and (max-width: 880px) {
    .facts-counter-description.facts-counter-description-primary {
      margin-bottom: 55px;
    }
  }
  
  .facts-counter-description-img {
  display: block;
  font-size: 25px;
  text-align: center;
  color: var(--color-black);
  margin: 22px 0 23px 0;
  }
  
  @media only screen and (max-width: 880px) {
    .facts-counter-description-img {
      font-size: 20px;
    margin: 20px 0 10px 0;
    }
  }
  
  .facts-counter-description-img.large {
  font-size: 40px;
  margin: 15px 0 23px 0;
  }
  
  @media only screen and (max-width: 880px) {
    .facts-counter-description-img.large {
      font-size: 20px;
    margin: 20px 0 10px 0;
    }
  }
  
  .facts-counter-title {
  font-size: 11px;
  letter-spacing: 0.05em;
  }
  
  @media only screen and (max-width: 880px) {
    .facts-counter-title {
      font-size: 10px;
    }
  }
  
  .facts-counter-title.large {
  font-size: 12px;
  }
  
  @media only screen and (max-width: 880px) {
    .facts-counter-title.large {
      font-size: 10px;
    }
  }
  
  
  /* 17.2. facts parallax */
  .parallax-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, .6);
  z-index: 0;
  }
  
  .parallax {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 147px 0 141px 0;
  }
  
  @media only screen and (max-width: 880px) {
    .parallax {
      padding: 97px 0 91px 0;
    }
  }
  
  .parallax-facts {
  position: relative;
  background-repeat: no-repeat;
  background-position: center center;
      -webkit-background-size: cover;
         -moz-background-size: cover;
          -ms-background-size: cover;
           -o-background-size: cover;
              background-size: cover;
  border: none;
  z-index: 1;
  }
  
  @media only screen and (max-width: 880px) {
    .parallax-facts {
      -webkit-background-size: cover;
         -moz-background-size: cover;
          -ms-background-size: cover;
           -o-background-size: cover;
              background-size: cover;
    }
  }
  
  
  /* 18. contact */
  .contact-info-wrapper {
  margin-top: -15px;
  }
  
  .contact-info-description {
  font-family: 'Raleway', sans-serif;
  color: var(--color-black);
  text-align: center;
  text-transform: none;
  }
  
  .contact-info-description-img {
  display: block;
  font-size: 40px;
  text-align: center;
  color: var(--color-black);
  margin: 15px 0 15px 0;
  padding-bottom: 10px;
  }
  
  @media only screen and (max-width: 880px) {
    .contact-info-description-img-secondary {
      margin-top: 60px;
    }
  }
  
  .contact-info-text a,
  .contact-info-text a:hover {
  text-decoration: none;
  font-weight: 600;
  }
        
        
  /* 19. scroll indicator */
  .scroll-indicator-wrapper {
  position: absolute;
  width: 1px!important;
  height: 100%;
  left: 0;
  right: 0;
  bottom: 110px;
  margin-left: auto;
  margin-right: auto;
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible;
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  }
  
  @media only screen and (max-width: 768px) {
    .scroll-indicator-wrapper {
      bottom: 50px;
    }
  }
  
  .scroll-indicator-wrapper.scroll-indicator-wrapper-position-secondary {
          opacity: 0;
     -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
  -webkit-transform: translateY(200px);
     -moz-transform: translateY(200px);
      -ms-transform: translateY(200px);
       -o-transform: translateY(200px);
          transform: translateY(200px);
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  }
  
  .scroll-indicator {
  position: absolute;
  bottom: 50px;
  left: 50%;
  -webkit-transform: translate(-50%, 50%);
     -moz-transform: translate(-50%, 50%);
      -ms-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
  z-index: 1005;
  }
  
  @media all and (min-width: 1920px) {
    .scroll-indicator {
      bottom: 60px;
    }
  }
  
  .scroll-line {
  display: block;
  width: 1px;
  height: 50px;
  background: none;
  }
  
  @media all and (min-width: 1920px) {
    .scroll-line {
      height: 60px;
    }
  }
  
  .scroll-line::before {
  content: "";
  display: block;
  width: 1px;
  height: 50%;
  top: 0;
  background-color: var(--color-white);
  -webkit-animation: scroll-down 2s ease-in-out infinite;
      -ms-animation: scroll-down 2s ease-in-out infinite;
        animation: scroll-down 2s ease-in-out infinite;
  }
  
  @-webkit-keyframes scroll-down {
    0% {
      height: 0;
    }
    50% {
      height: 100%;
    }
    70% {
      height: 100%;
      transform: scaleY(0.5);
      transform-origin: bottom;
    }
    100% {
      height: 100%;
      transform: scaleY(0);
      transform-origin: bottom;
    }
  }
  @-ms-keyframes scroll-down {
    0% {
      height: 0;
    }
    50% {
      height: 100%;
    }
    70% {
      height: 100%;
      transform: scaleY(0.5);
      transform-origin: bottom;
    }
    100% {
      height: 100%;
      transform: scaleY(0);
      transform-origin: bottom;
    }
  }
  @keyframes scroll-down {
    0% {
      height: 0;
    }
    50% {
      height: 100%;
    }
    70% {
      height: 100%;
      transform: scaleY(0.5);
      transform-origin: bottom;
    }
    100% {
      height: 100%;
      transform: scaleY(0);
      transform-origin: bottom;
    }
  }
  
  
  /* 20. preloader */
  .preloader-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.5); /* Modifier ici pour rendre le fond transparent */
  z-index: 999999;
  }
  
  #preloader {
  position: fixed;
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.5); /* Modifier ici pour rendre le fond transparent */
  z-index: 999999;
  }
  
  #preloader-status {
  display: table-cell;
  vertical-align: middle;
  }
  
  .preloader-position {
  position: relative;
  margin: 0 auto;
  text-align: center;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
       -o-box-sizing: border-box;
          box-sizing: border-box;
  }
  
  .loader {
  position: absolute;
  width: 45px;
  height: 45px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-animation: rotate 1s infinite linear;
     -moz-animation: rotate 1s infinite linear;
      -ms-animation: rotate 1s infinite linear;
       -o-animation: rotate 1s infinite linear;
          animation: rotate 1s infinite linear;
  border: 5px solid rgba(198, 169, 108, 0.1);
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
      -ms-border-radius: 50%;
       -o-border-radius: 50%;
          border-radius: 50%;
  }
  
  .loader span {
  position: absolute;
  width: 45px;
  height: 45px;
  top: -3px;
  left: -3px;
  border: 5px solid transparent;
  border-top: 5px solid var(--color-gold);
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
      -ms-border-radius: 50%;
       -o-border-radius: 50%;
          border-radius: 50%;
  }
  
  @-webkit-keyframes rotate {
    0% {
      -webkit-transform: rotate(0deg);
    }
    100% {
      -webkit-transform: rotate(360deg);
    }
  }
  @keyframes rotate {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  
  
  /* 21. center container */
  .center-container {
  position: relative;
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 100%;
  }
  
  .center-block {
  display: table-cell;
  vertical-align: middle;
  }
  
  
  /* 22. enllax */
  .enllax-all {
  position: absolute;
  top: -60px;
  font-family: 'Oswald', sans-serif;
  font-size: 400px;
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1.3;
  text-align: center;
  letter-spacing: -0.04em;
  color: var(--color-gold-light);
  white-space: nowrap;
  -webkit-pointer-events: none;
     -moz-pointer-events: none;
          pointer-events: none;
  z-index: -1;
  }
  
  @media only screen and (max-width: 995px) {
    .enllax-all {
      top: -31px;
      font-size: 300px;
    }
  }
  
  @media only screen and (max-width: 768px) {
    /* Styles pour titres enllax sur mobile */
    .enllax-all {
      position: static !important;
      top: auto !important;
      font-size: 120px !important;
      text-align: center !important;
      margin: 20px auto !important;
      white-space: normal !important;
      color: #ad8e4f !important;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .enllax-all {
      top: -1px;
      font-size: 120px !important;
    }
  }
  
  
  /* 23. link underline */
  .link-underline {
  position: relative;
  display: inline-block;
  }
  
  .link-underline::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--color-black);
  -webkit-transform-origin: right center;
     -moz-transform-origin: right center;
      -ms-transform-origin: right center;
          transform-origin: right center;
  -webkit-transform: scale(0, 1);
     -moz-transform: scale(0, 1);
      -ms-transform: scale(0, 1);
       -o-transform: scale(0, 1);
          transform: scale(0, 1);
  -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
     -moz-transition: -moz-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      -ms-transition: -ms-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
       -o-transition: -o-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
          transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  }
  
  .link-underline:hover::before {
  -webkit-transform-origin: left center;
     -moz-transform-origin: left center;
      -ms-transform-origin: left center;
          transform-origin: left center;
  -webkit-transform: scale(1, 1);
     -moz-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
       -o-transform: scale(1, 1);
          transform: scale(1, 1);
  }
  
  
  /* 24. to top arrow */
  .to-top-arrow {
  position: fixed;
  right: 70px;
  bottom: -10px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  cursor: pointer;
  font-size: 16px;
  text-align: center;
  color: var(--color-white);
  background: var(--color-black);
          opacity: 0;
     -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-transform: translateY(40px);
     -moz-transform: translateY(40px);
      -ms-transform: translateY(40px);
       -o-transform: translateY(40px);
          transform: translateY(40px);
  -webkit-transition: all .7s;
     -moz-transition: all .7s;
      -ms-transition: all .7s;
       -o-transition: all .7s;
          transition: all .7s;
  z-index: 105;
  }
  
  @media only screen and (max-width: 640px) {
    .to-top-arrow {
      right: 20px;
    } 
  }
  
  .to-top-arrow.show {
  bottom: 50px;
  -webkit-transform: translateY(-20px);
     -moz-transform: translateY(-20px);
      -ms-transform: translateY(-20px);
       -o-transform: translateY(-20px);
          transform: translateY(-20px);
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  
  @media only screen and (max-width: 640px) {
    .to-top-arrow.show {
      bottom: 0;
    }
  }
  
  .to-top-arrow:hover {
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  
  
  /* 25. wave */
  /* 25.1. wave bottom border */
  .border-bottom-wave,
  .border-bottom-wave.bottom-position,
  .border-bottom-wave.bottom-position-primary {
  position: fixed;
  background: var(--color-white);
  -webkit-transition: all 1.5s ease;
     -moz-transition: all 1.5s ease;
    -ms-transition: all 1.5s ease;
       -o-transition: all 1.5s ease;
          transition: all 1.5s ease;
  z-index: 100;
  }
  
  .border-bottom-wave.bottom-position-primary {
  background: var(--color-gold-light);
  }
  
  .border-bottom-wave {
  width: 100%;
  height: 0;
  left: 0;
  bottom: 0;
  }
  
  @media only screen and (max-width: 640px) {
    .border-bottom-wave {
      height: 50px;
      display: none; /* Masquer bordure sur petits ecrans */
    }
  }
  
  .border-bottom-wave.border-bottom-wave-secondary {
  height: 50px;
  }
  
  .border-bottom-wave.bottom-position {
  -webkit-transform: translateY(50px);
     -moz-transform: translateY(50px);
      -ms-transform: translateY(50px);
       -o-transform: translateY(50px);
          transform: translateY(50px);
  }
  
  .border-bottom-wave.bottom-position-primary {
      -webkit-transform: translateY(0);
         -moz-transform: translateY(0);
          -ms-transform: translateY(0);
           -o-transform: translateY(0);
              transform: translateY(0);
      display: none; /* Masquer bordure sur petits ecrans */
  }
  
  @media only screen and (max-width: 640px) {
    .border-bottom-wave.bottom-position-primary {
      -webkit-transform: translateY(110px);
         -moz-transform: translateY(110px);
          -ms-transform: translateY(110px);
           -o-transform: translateY(110px);
              transform: translateY(110px);
      display: none; /* Masquer bordure sur petits ecrans */
    }
  }
  
  
  /* 25.2. wave effect */
  #wave {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  bottom: 0;
  left: 0;
  -webkit-pointer-events: none;
     -moz-pointer-events: none;
          pointer-events: none;
  z-index: 100;
  }
  
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    #wave {
      z-index: 10;
    }
  }
  
  @media only screen and (max-width: 640px) {
    #wave {
      display: none;
    }
  }
  
  #wave,
  #wave.bottom-position,
  #wave.wave-position-secondary {
  -webkit-transition: all 1.5s ease;
     -moz-transition: all 1.5s ease;
    -ms-transition: all 1.5s ease;
       -o-transition: all 1.5s ease;
          transition: all 1.5s ease;
  }
  
  #wave.bottom-position,
  #wave.wave-position-secondary {
  -webkit-transform: translateY(300px);
     -moz-transform: translateY(300px);
      -ms-transform: translateY(300px);
       -o-transform: translateY(300px);
          transform: translateY(300px);
  }
  
  
  /* 26. Slick v1.6.0 CUSTOM */
  /* 26.1. slick slide */
  .slick-slide {
  height: 100%;
  background: none;
  }
      
  .slick-slider {
  margin-bottom: 0;
  margin-top: 0;
  cursor: auto;
  }
  
  
  /* 26.2. slick slide flickering FIX */
  .slick-track,
  .slick-list {
  -webkit-perspective: 2000;
          perspective: 2000;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  }
  
  
  /* 26.3. slick fullscreen slideshow */
  .slick-fullscreen-img-fill {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  }
  
  .slick-fullscreen-img-fill img {
  position: relative;
  display: inline-block;
  min-width: 100%;
  max-width: none;
  min-height: 100%;
  }
  
  .slick-fullscreen .slick-fullscreen-item .slick-fullscreen-img-fill,
  .slick-fullscreen-slideshow .slick-fullscreen-item .slick-fullscreen-img-fill {
  height: 100vh;
  background: none;
  }
  
  .slick-fullscreen .slick-fullscreen-item .slick-fullscreen-img-fill .bg-img,
  .slick-fullscreen-slideshow .slick-fullscreen-item .slick-fullscreen-img-fill .bg-img {
  position: relative;
  width: auto;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
     -moz-background-size: cover;
      -ms-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
  }
  
  .slick-fullscreen .slick-dots,
  .slick-fullscreen-slideshow .slick-dots {
  position: absolute;
  width: 100%;
  height: 5px;
  left: 0;
  bottom: 0;
  margin: 0;
  padding: 0;
  background: rgba(255, 255, 255, .25);
  list-style-type: none;
  }
  
  .slick-fullscreen .slick-dots li button,
  .slick-fullscreen-slideshow .slick-dots li button {
  display: none;
  }
  
  .slick-fullscreen .slick-dots li,
  .slick-fullscreen-slideshow .slick-dots li {
  position: absolute;
  float: left;
  width: 0;
  height: 5px;
  left: -5px;
  background: var(--color-white);
  }
  
  .slick-fullscreen .slick-dots li.slick-active,
  .slick-fullscreen-slideshow .slick-dots li.slick-active {
  width: 100%;
  -webkit-animation: progressDots 4s both;
     -moz-animation: progressDots 4s both;
      -ms-animation: progressDots 4s both;
       -o-animation: progressDots 4s both;
          animation: progressDots 4s both;
  }
  
  @-webkit-keyframes progressDots {
    from {
      width: 0;
    }
    to {
      width: 100%;
    }
  }
  @keyframes progressDots {
    from {
      width: 0;
    }
    to {
      width: 100%;
    }
  }
  
  .slick-fullscreen,
  .slick-fullscreen-slideshow {
  background: none;
  }
  
  .slick-fullscreen .slick-slide,
  .slick-fullscreen-slideshow .slick-slide {
  display: none;
  float: left;
  height: 100%;
  }
  
  .slick-initialized .slick-slide {
  display: block;
  }
  
  
  /* 26.4. slick navigation */
  .slick-prev:before,
  .slick-next:before {
  font-size: 15px;
  color: var(--color-black);
  }
  
  
  /* 27. featured news */
  .cd-section-txt p {
  position: relative;
  text-align: center;
  margin: -20px auto;
  }
  
  @media only screen and (max-width: 880px) {
    #bar {
      display: none;
      visibility: hidden;
    }
  }
  
  .cd-author img,
  .cd-author .cd-author-info {
  display: inline-block;
  vertical-align: middle;
  list-style: none;
  cursor: pointer;
  }
  
  .cd-author img {
  width: 60px;
  height: 60px;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
  -webkit-background-size: cover;
     -moz-background-size: cover;
      -ms-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
  margin-right: 30px;
  }
  
  @media only screen and (max-width: 880px) {
    .cd-author img {
    display: block;
    text-align: center;
    margin: 0 auto;
    }
  }
  
  h3.cd-featured-name {
  position: relative;
  font-family: 'Oswald', sans-serif;
  font-size: 50px;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: -0.04em;
  color: var(--color-black);
  line-height: 1;
  margin: -5px 0 0 0;
  z-index: 10;
  }
  
  @media all and (min-width: 1920px) {
    h3.cd-featured-name {
      font-size: 65px;
      margin: -8px 0 -1px 0;
    }
  }
  
  @media only screen and (max-width: 995px) {
    h3.cd-featured-name {
      margin: -5px 0 0 0;
    }
  }
  
  @media only screen and (max-width: 640px) {
    h3.cd-featured-name {
      font-size: 40px;
    margin: -4px 0 -1px 0;
    }
  }
  
  .cd-author .cd-author-info {
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
  padding: 0;
  text-align: center;
  letter-spacing: 0.05em;
  color: var(--color-white);
  margin: 5px auto 0 auto;
  }
  
  .cd-author .cd-author-info li:first-child {
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
  padding: 0;
  text-align: center;
  letter-spacing: 0.05em;
  color: var(--color-black);
  }
  
  @media only screen and (max-width: 995px) {
    .cd-author .cd-author-info li:first-child {
      text-align: center;
    }
  }
  
  .cd-author .cd-author-info li:last-child {
  font-family: 'Raleway', sans-serif;
  font-size: 13px;
  font-weight: 400;
  text-transform: none;
  margin-bottom: 5px;
  color: var(--color-black);
  }
  
  @media only screen and (max-width: 995px) {
    .cd-author .cd-author-info li:last-child {
      font-size: 11px;
    text-align: center;
    }
  }
  
  .center-container-slick {
  position: relative;
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 100%;
  background: none;
  padding: 0;
  z-index: 1;
  }
  
  .center-block-slick {
  display: table-cell;
  vertical-align: middle;
  }
  
  .slick-slide {
  height: 642px;
  background: none;
  text-align: center;
  }
  
  @media all and (min-width: 1920px) {
    .slick-slide {
    height: 609px;
    }
  }
  
  @media only screen and (max-width: 1200px) {
    .slick-slide {
    height: 675px;
    }
  }
  
  @media only screen and (max-width: 1190px) {
    .slick-slide {
    height: 706px;
    }
  }
  
  @media only screen and (max-width: 995px) {
    .slick-slide {
      height: 100%;
    }
  }
    
  .slick-slider {
  margin-bottom: 0;
  margin-top: 0;
  cursor: default;
  }
  
  .slick-left {
  width: 100%;
  height: auto;
  }
  
  .slick-left p {
  padding: 20px;
  }
  
  .slick-right {
  width: 100%;
  height: auto;
  }
  
  .slick-bottom.slick-slider {
  position: relative;
  margin-top: 20px;
  bottom: -10px;
  }
  
  @media only screen and (max-width: 880px) {
    .slick-bottom.slick-slider {
      margin-top: 70px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .slick-bottom.slick-slider {
    max-width: 555px;
    margin: 80px auto 0 auto;
    text-align: center;
    bottom: 20px;
    }
  }
  
  @media only screen and (max-width: 480px) {
    .slick-bottom.slick-slider {
    max-width: 355px;
    }
  }
  
  .slick-bottom.slick-slider .slick-slide { 
  height: 122px;
  }
  
  @media only screen and (max-width: 880px) {
    .slick-bottom.slick-slider .slick-slide { 
      height: 170px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .slick-bottom.slick-slider .slick-slide { 
      height: 150px;
    }
  }
  
  
  /* 28. videos */
  /* 28.1. YouTube video */
  .YT-bg {
  display: none;
  }
  
  @media only screen and (max-width: 880px) {
    .YT-bg {
      position: relative;
      height: 100%;
      background-image: url(../img/background/YT-bg.jpg);
      background-repeat: no-repeat;
      background-position: center;
      -webkit-background-size: cover;
         -moz-background-size: cover;
          -ms-background-size: cover;
           -o-background-size: cover;
              background-size: cover;
        /* uncomment the following to show an image for mobile devices */
              /* display: block; */
    }
  }
  
  #videoContainment {
  position: absolute;
  display: block;
  width: 100%!important;
  height: 100%!important;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background: var(--color-black);
  z-index: 0;
  }
  
  
  /* 28.2. Vimeo video */
  .vimeo-bg {
  display: none;
  }
  
  @media only screen and (max-width: 880px) {
    .vimeo-bg {
      position: relative;
      height: 100%;
      background-image: url(../img/background/vimeo-bg.jpg);
      background-repeat: no-repeat;
      background-position: center;
      -webkit-background-size: cover;
         -moz-background-size: cover;
          -ms-background-size: cover;
           -o-background-size: cover;
              background-size: cover;
        /* uncomment the following to show an image for mobile devices */
              /* display: block; */
    }
    
    #vimeo-videoContainment {
      display: none;
    }
  }
  
  #vimeo-videoContainment {
  position: absolute;
  display: block;
  width: 100%!important;
  height: 100%!important;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background: var(--color-black);
  z-index: 0;
  }
  
  #vimeo-videoContainment iframe,
  #vimeo-videoContainment object,
  #vimeo-videoContainment embed {
  border: none;
  }
  
  
  /* 28.3. HTML5 video */
  .html5-bg {
  display: none;
  }
  
  @media only screen and (max-width: 880px) {
    .html5-bg {
      position: relative;
      height: 100%;
    background-image: url(../img/background/html5-bg.jpg);
      background-repeat: no-repeat;
      background-position: center;
      -webkit-background-size: cover;
         -moz-background-size: cover;
          -ms-background-size: cover;
           -o-background-size: cover;
              background-size: cover;
        /* uncomment the following to show an image for mobile devices */
              /* display: block; */
    }
  }
  
  .html5-videoContainment {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  min-width: 100%;
  height: auto;
  min-height: 100%;
  background: var(--color-black);
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 0;
  }
  
  
  /* 29. elements home call */
  /* 29.1. main navigation logo home call */
  .logo,
  .logo.logo-home-call {
  margin: -8px auto 0 auto;
  }
  
  @media only screen and (max-width: 768px) {
    .logo,
    .logo.logo-home-call {
      margin: 3px 0 0 -10px;
    }
  }
  
  
  /* 29.2. main navigation home call */
  .main-navigation {
  padding: 20px 0 0 0;
  }
  
  .main-navigation.main-navigation-home-call {
  padding: 0;
  }
  
  @media only screen and (max-width: 768px) {
    .main-navigation,
    .main-navigation.main-navigation-home-call {
      padding: 0 4px 0 0;
    }
  }
  
  
  /* 29.3. home credits home call */
  .bottom-credits {
  left: 40px;
  bottom: 16px;
  }
  
  @media only screen and (max-width: 768px) {
    .bottom-credits {
      left: 20px;
      bottom: -14px;
    }
  }
  
  .bottom-credits.bottom-credits-home-call {
  left: 20px;
  bottom: -14px;
  }
  
  
  /* 29.4. social icons home call */
  .social-icons-wrapper-share {
  right: 40px;
  bottom: 39px;
  }
  
  @media only screen and (max-width: 768px) {
    .social-icons-wrapper-share {
      right: 20px;
      bottom: 11px;
    }
  }
  
  .social-icons-wrapper-share.social-icons-wrapper-share-home-call {
  right: 20px;
  bottom: 11px;
  }
  
  
  /* 30. ken burns slideshow */
  .kenburns-slide-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
  }
  
  .kenburns-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
          opacity: 0;
     -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-animation: KenBurnsSlideShow 24s linear infinite 0s;
     -moz-animation: KenBurnsSlideShow 24s linear infinite 0s;
      -ms-animation: KenBurnsSlideShow 24s linear infinite 0s;
       -o-animation: KenBurnsSlideShow 24s linear infinite 0s;
          animation: KenBurnsSlideShow 24s linear infinite 0s;
  }
  
  .kenburns-slide-1,
  .kenburns-slide-2,
  .kenburns-slide-3,
  .kenburns-slide-4 {
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
     -moz-background-size: cover;
      -ms-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
  }
  
  .kenburns-slide-1 {
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  
  .kenburns-slide-2 {
  -webkit-animation-delay: 6s;
     -moz-animation-delay: 6s;
      -ms-animation-delay: 6s;
       -o-animation-delay: 6s;
          animation-delay: 6s;
  }
  
  .kenburns-slide-3 {
  -webkit-animation-delay: 12s;
     -moz-animation-delay: 12s;
      -ms-animation-delay: 12s;
       -o-animation-delay: 12s;
          animation-delay: 12s;
  }
  
  .kenburns-slide-4 {
  -webkit-animation-delay: 18s;
     -moz-animation-delay: 18s;
      -ms-animation-delay: 18s;
       -o-animation-delay: 18s;
          animation-delay: 18s;
  }
  
  @-webkit-keyframes KenBurnsSlideShow {
    0% {
      opacity: 0;
      -webkit-transform: scale(1);
    }
   5% {
      opacity: 1
    }
   25% {
      opacity: 1;
    }
   30% {
      opacity: 0;
      -webkit-transform: scale(1.1);
    }
   100% {
      opacity: 0;
      -webkit-transformm: scale(1);
    }
  }
  
  @-moz-keyframes KenBurnsSlideShow {
    0% {
      opacity: 0;
      -moz-transform: scale(1);
    }
   5% {
      opacity: 1
    }
   25% {
      opacity: 1;
    }
   30% {
      opacity: 0;
      -moz-transform: scale(1.1);
    }
   100% {
      opacity: 0;
      -moz-transform: scale(1);
    }
  }
  
  @-o-keyframes KenBurnsSlideShow {
    0% {
      opacity: 0;
      -o-transform: scale(1);
    }
   5% {
      opacity: 1
    }
   25% {
      opacity: 1;
    }
   30% {
      opacity: 0;
      -o-transform: scale(1.1);
    }
   100% {
      opacity: 0;
      -o-transform: scale(1);
    }
  }
  
  @keyframes KenBurnsSlideShow {
    0% {
      opacity: 0;
        transform: scale(1);
      -ms-transform: scale(1);
    }
   5% {
      opacity: 1
    }
   25% {
      opacity: 1;
    }
   30% {
      opacity: 0;
        transform: scale(1.1);
      -ms-transform: scale(1.1);
    }
   100% {
      opacity: 0;
        transform: scale(1);
      -ms-transform: scale(1);
    }
  }
  
  
  /* 31. featured news MORE */
  .panel-left {
  position: absolute;
  width: 50%;
  height: 100vh;
  overflow: hidden;
  top: auto;
  left: -100%;
  background: var(--color-white);
  -webkit-transition: all .8s ease-out;
     -moz-transition: all .8s ease-out;
      -ms-transition: all .8s ease-out;
       -o-transition: all .8s ease-out;
          transition: all .8s ease-out;
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  z-index: 99;
  }
  
  @media only screen and (max-width: 995px) {
    .panel-left {
      display: none;
    visibility: hidden;
    }
  }
  
  .panel-left.open {
  left: 0;
  }
  
  .panel-left-bg-all {
  position: absolute;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
     -moz-background-size: cover;
      -ms-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
  }
  
  .panel-right {
  position: absolute;
  width: 50%;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  top: auto;
  right: -100%;
  background: var(--color-white);
  -webkit-transition: all .8s ease-out;
     -moz-transition: all .8s ease-out;
      -ms-transition: all .8s ease-out;
       -o-transition: all .8s ease-out;
          transition: all .8s ease-out;
          opacity: 1;
     -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  z-index: 99;
  }
  
  @media only screen and (max-width: 995px) {
    .panel-right {
      width: 100%;
    }
  }
  
  @media only screen and (max-width: 480px) {
    .panel-right {
    margin-top: 100px;
    }
  }
  
  .panel-right.open {
  right: 0;
  }
  
  .news-content {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
     -ms-flex-align: center;
        align-items: center!important;
  -webkit-box-pack: center;
     -ms-flex-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
  background: var(--color-white);
  }
  
  .news-content .news-content-inner {
  position: relative;
  width: 100%;
  padding: 0 135px 0 85px;
  text-align: center;
  }
  
  @media all and (min-width: 1920px) {
    .news-content .news-content-inner {
    padding: 0 145px 0 95px;
    }
  }
  
  @media only screen and (max-width: 1200px) {
    .news-content .news-content-inner {
      padding: 0 120px 0 70px;
    }  
  }
  
  @media only screen and (max-width: 880px) {
    .news-content .news-content-inner {
      padding: 0 35px;
    }  
  }
  
  .news-content-inner p {
  padding: 20px 0;
  }
  
  @media only screen and (max-width: 995px) {
    .news-content-inner p {
    padding: 20px 90px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .news-content-inner p {
    padding: 20px 0;
    }
  }
  
  .height-correction {
  position: relative;
  width: 100%;
  height: auto;
  margin-top: 0;
  }
  
  
  /* 32. divider */
  .dividerOT.out-top,
  .dividerOT.out-bottom,
  .dividerOT.dividerOT-inner,
  .inner-divider-half,
  .inner-divider-half-post,
  .inner-divider-post,
  .inner-divider-news,
  .inner-divider-in-post {
  position: relative;
  width: 100%;
  margin: 0 auto;
  background: none;
  z-index: -1;
  }
  
  .dividerOT.out-top,
  .dividerOT.out-bottom,
  .dividerOT.dividerOT-inner {
  height: 150px;
  }
  
  @media only screen and (max-width: 880px) {
    .dividerOT.out-top,
    .dividerOT.out-bottom,
    .dividerOT.dividerOT-inner {
      height: 100px;
    }
  }
  
  .dividerOT.out-bottom.out-bottom-last {
  height: 200px;
  }
  
  @media only screen and (max-width: 880px) {
    .dividerOT.out-bottom.out-bottom-last {
      height: 150px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .dividerOT.out-bottom.out-bottom-last {
      height: 100px;
    }
  }
  
  .inner-divider-half {
  height: 40px;
  }
  
  .inner-divider-half-post {
  height: 20px;
  }
  
  @media all and (min-width: 1920px) {
    .inner-divider-half-post {
      height: 40px;
    }
    
    .inner-divider-half-post.inner-divider-half-post-works {
      height: 20px;
    }
  }
  
  .inner-divider-post,
  .inner-divider-news,
  .inner-divider-in-post {
  height: 80px;
  }
  
  @media all and (min-width: 1920px) {
    .inner-divider-in-post {
    height: 90px;
    }
  }
  
  @media only screen and (max-width: 880px) {
    .inner-divider-in-post {
    height: 100px;
    }
  }
  
  .visible-mobile-devices {
  display: none;
  visibility: hidden;
  }
    
  @media only screen and (max-width: 995px) {
    .visible-mobile-devices {
      display: block;
      visibility: visible;
    }
  }
  
  .hidden-mobile-devices {
      display: block;
      visibility: visible;
  }
  
  @media only screen and (max-width: 995px) {
    .hidden-mobile-devices {
      display: none;
      visibility: hidden;
    }
  }
  
  /* Logo size adjustment */
  .logo .logo-dark {
    opacity: 1;
    -moz-opacity: 1;
    -webkit-opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    height: auto;
    max-width: 80px; /* Taille maximale du logo */
    width: auto;
  }
  
  /* Ajustement pour les ecrans plus petits */
  @media only screen and (max-width: 768px) {
    .logo .logo-dark {
      max-width: 60px; /* Taille reduite pour mobile */
    }
  }
  
  /* Ajustement pour les tres grands ecrans */
  @media all and (min-width: 1920px) {
    .logo .logo-dark {
      max-width: 100px; /* Taille plus grande pour les grands ecrans */
    }
  }
  
  /* Centrage vertical du logo */
  .navbar-nav > li.hidden-xs a.logo {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 15px 0 15px;
  }

  .home-page-title-hide {
    display: none; /* Cache le texte */
  }

  .home-page-title-show {
    display: block; /* Affiche le texte */
    /* Ajoutez d'autres styles d'animation si nécessaire */
  }


/* Contact form */

  .hidden {
    display: none;
  }
  
  #response-message {
    margin-bottom: 15px;
    padding: 12px;
    border-radius: 6px;
    text-align: center;
    font-weight: bold;
  }
  
  #response-message.success {
    background-color: #d4edda;
    color: #155724;
  }
  
  #response-message.error {
    background-color: #f8d7da;
    color: #721c24;
  }
  
  /* Styles pour le formulaire de réservation */
  .reservation-form {
    max-width: 800px;
    width: 90%;
    margin: 50px auto;
    padding: 40px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    position: relative;
  }
  
  @media only screen and (max-width: 995px) {
    .reservation-form {
      width: 80%;
      padding: 30px;
      margin: 40px auto;
    }
  }
  
  @media only screen and (max-width: 768px) {
    .reservation-form {
      width: 70%;
      padding: 25px;
      margin: 30px auto;
    }
  }
  
  @media only screen and (max-width: 480px) {
    .reservation-form {
      width: 70%;
      padding: 20px;
      margin: 20px auto;
    }
  }
  
  .reservation-form::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 5px;
    height: 100%;
    background: var(--color-gold);
    background: linear-gradient(to bottom, var(--color-gold), var(--color-gold-dark));
  }
  
  .reservation-form h2 {
    text-align: center;
    margin-bottom: 20px;
    color: var(--color-gold-dark);
    font-size: 26px;
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: uppercase;
  }
  
  .reservation-form label {
    display: block;
    margin-bottom: 6px;
    color: var(--color-gray-dark);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-align: left;
    padding-left: 3px;
    position: relative;
  }
  
  .reservation-form label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 2px;
    height: 80%;
    background-color: var(--color-gold);
    opacity: 0.6;
  }
  
  .reservation-form input[type="text"],
  .reservation-form input[type="email"],
  .reservation-form input[type="date"],
  .reservation-form input[type="time"],
  .reservation-form select {
    width: 100%;
    padding: 10px 12px;
    margin-bottom: 15px;
    border: 1px solid rgba(198, 169, 108, 0.3);
    border-radius: 3px;
    font-size: 14px;
    transition: all 0.3s ease;
    background-color: rgba(255, 255, 255, 0.8);
  }
  
  .reservation-form input[type="text"]:focus,
  .reservation-form input[type="email"]:focus,
  .reservation-form input[type="date"]:focus,
  .reservation-form input[type="time"]:focus,
  .reservation-form select:focus {
    border-color: var(--color-gold);
    box-shadow: 0 0 5px rgba(198, 169, 108, 0.3);
    outline: none;
    background-color: #fff;
  }
  
  .reservation-form .g-recaptcha {
    margin: 15px 0;
    display: flex;
    justify-content: center;
    transform: scale(0.9);
    transform-origin: center;
  }
  
  .reservation-form button {
    width: 100%;
    padding: 12px;
    background: linear-gradient(to right, var(--color-gold-dark), var(--color-gold), var(--color-gold-dark));
    color: white;
    border: none;
    border-radius: 3px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 15px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(173, 142, 79, 0.2);
  }
  
  .reservation-form button:hover {
    background: linear-gradient(to right, var(--color-gold), var(--color-gold-dark), var(--color-gold));
    box-shadow: 0 6px 12px rgba(173, 142, 79, 0.3);
    transform: translateY(-2px);
  }
  
  @media only screen and (max-width: 768px) {
    .reservation-form {
      max-width: 85%;
      padding: 20px 25px;
      padding-bottom: 50px;
    }
    
    .reservation-form h2 {
      font-size: 22px;
      margin-bottom: 15px;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .reservation-form {
      max-width: 90%;
      padding: 15px 20px;
      padding-bottom: 40px;
    }
    
    .reservation-form h2 {
      font-size: 20px;
      margin-bottom: 10px;
    }
    
    .reservation-form label {
      font-size: 13px;
      margin-bottom: 4px;
    }
    
    .reservation-form input[type="text"],
    .reservation-form input[type="email"],
    .reservation-form input[type="date"],
    .reservation-form input[type="time"],
    .reservation-form select {
      padding: 8px 10px;
      margin-bottom: 12px;
      font-size: 13px;
    }
    
    .reservation-form button {
      padding: 10px;
      font-size: 13px;
    }
  }
  
  @media only screen and (max-width: 480px) {
    .reservation-form {
      max-width: 92%;
      padding: 12px 15px;
      padding-bottom: 30px;
    }
    
    .reservation-form h2 {
      font-size: 18px;
      margin-bottom: 8px;
    }
    
    .reservation-form input[type="text"],
    .reservation-form input[type="email"],
    .reservation-form input[type="date"],
    .reservation-form input[type="time"],
    .reservation-form select {
      padding: 7px 8px;
      margin-bottom: 10px;
      font-size: 12px;
    }
    
    .reservation-form .g-recaptcha {
      transform: scale(0.8);
      transform-origin: center;
      margin: 5px 0;
    }
    
    .reservation-form button {
      padding: 9px;
      font-size: 12px;
      margin-top: 8px;
    }
  }
  
  .reservation-form select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: 
      linear-gradient(45deg, transparent 50%, var(--color-gold-dark) 50%),
      linear-gradient(135deg, var(--color-gold-dark) 50%, transparent 50%),
      linear-gradient(to right, rgba(198, 169, 108, 0.1), rgba(198, 169, 108, 0.05));
    background-position: 
      calc(100% - 20px) calc(1em + 2px),
      calc(100% - 15px) calc(1em + 2px),
      0 0;
    background-size: 
      5px 5px,
      5px 5px,
      100% 100%;
    background-repeat: no-repeat;
    padding-right: 30px !important;
    cursor: pointer;
    border: 1px solid rgba(198, 169, 108, 0.4);
    border-radius: 3px;
    transition: all 0.3s ease;
    color: var(--color-gray-dark);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05);
  }
  
  .reservation-form select:hover {
    border-color: var(--color-gold);
    box-shadow: 0 0 3px rgba(198, 169, 108, 0.2);
  }
  
  .reservation-form select:focus {
    background-image: 
      linear-gradient(45deg, var(--color-gold) 50%, transparent 50%),
      linear-gradient(135deg, transparent 50%, var(--color-gold) 50%),
      linear-gradient(to right, rgba(198, 169, 108, 0.15), rgba(198, 169, 108, 0.05));
    background-position: 
      calc(100% - 15px) calc(1em + 2px),
      calc(100% - 20px) calc(1em + 2px),
      0 0;
    border-color: var(--color-gold);
    box-shadow: 0 0 5px rgba(198, 169, 108, 0.3);
  }
  
  .reservation-form select option {
    background-color: #fff;
    color: var(--color-gray-dark);
    padding: 10px;
    font-size: 14px;
  }
  
  .reservation-form select option:hover,
  .reservation-form select option:checked {
    background-color: rgba(198, 169, 108, 0.1);
    color: var(--color-gold-dark);
  }
  
  /* Styles pour optimiser l'affichage des images du blog */
  .blog-image-container {
    width: 70%;
    height: 70%;
    margin: 5% auto 5% 10%;
    overflow: hidden;
    position: relative;
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  }
  .blog-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .img-fullwidth-wrapper-news {
    position: relative;
    overflow: hidden;
    height: 100%;
  }
  .img-fullwidth-wrapper-news img {
    width: 70% !important;
    height: 70% !important;
    object-fit: cover;
    margin: 5% auto 5% 15%;
    display: block;
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  }
  @media (max-width: 768px) {
    .blog-image-container {
        width: 75%;
        height: 75%;
        margin: 2.5% auto 2.5% 5%;
    }
    .img-fullwidth-wrapper-news img {
        width: 75% !important;
        height: 75% !important;
        margin: 2.5% auto 2.5% 10%;
    }
  }
  
  @media only screen and (max-width: 640px) {
    .dividerOT.out-bottom.out-bottom-last {
      height: 100px;
    }
    
    /* Reduction supplementaire pour les telephones mobiles */
    .dividerOT.out-bottom {
      height: 50px;
    }
  }
  
  /* Classe pour masquer des elements sur mobile */
  .mobile-hidden {
    display: block;
  }

  @media only screen and (max-width: 768px) {
    .mobile-hidden {
      display: none !important;
      height: 0 !important;
      padding: 0 !important;
      margin: 0 !important;
    }
  }
  