/* ---------------------------------------------------------------------------------------------
/* ------------------------------------------- VARIABLE ----------------------------------------
-------------------------------------------------------------------------------------------- */
/* ----------------------------------
/* ------------ FONT-FACE ----------
------------------------------------- */
@font-face {
  font-family: 'Open Sans';
  src: url("OpenSans.eot");
  src: url("OpenSans.eot?#iefix") format("embedded-opentype"), url("OpenSans.woff") format("woff"), url("OpenSans.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'Open Sans';
  src: url("OpenSans-Semibold.eot");
  src: url("OpenSans-Semibold.eot?#iefix") format("embedded-opentype"), url("OpenSans-Semibold.woff") format("woff"), url("OpenSans-Semibold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal; }
@font-face {
  font-family: 'Pacifico-Regular';
  src: url("Pacifico-Regular.eot?#iefix") format("embedded-opentype"), url("Pacifico-Regular.woff") format("woff"), url("Pacifico-Regular.ttf") format("truetype"), url("Pacifico-Regular.svg#Pacifico-Regular") format("svg");
  font-weight: normal;
  font-style: normal; }
/* ---------------------------------------------------------------------------------------------
/* ------------------------------------------- MIXIN -----------------------------------------
-------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------
/* ------------------------------------------- CORPS DU SCSS -----------------------------------------
-------------------------------------------------------------------------------------------- */
/* ----------------------------------
/* ------------ ENTETE ----------
------------------------------------- */
*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

body {
  background: #fff;
  margin: 0;
  padding: 0;
  max-width: 100%;
  width: 100%; }

div, td {
  color: #404040;
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 22px;
  margin: 0;
  padding: 0;
  -moz-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s  ease-in-out;
  -o-transition: all 0.5s  ease-in-out;
  -ms-transition: all 0.5s  ease-in-out;
  transition: all 0.5s  ease-in-out; }
  @media only screen and (max-width: 479px) {
    div, td {
      font-size: 14px; } }
  @media only screen and (max-width: 359px) {
    div, td {
      font-size: 13px; } }

a {
  text-decoration: none;
  color: #253bb2;
  -moz-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s  ease-in-out;
  -o-transition: all 0.5s  ease-in-out;
  -ms-transition: all 0.5s  ease-in-out;
  transition: all 0.5s  ease-in-out; }

img {
  border: none;
  display: block;
  margin: 0 auto; }

p {
  padding: 10px 0;
  margin: 0; }

h1, h2, h3, h4 {
  font-weight: normal;
  margin: 0;
  padding: 0; }

h1 {
  color: #404040;
  font-size: 60px;
  line-height: 55px;
  font-weight: normal;
  text-align: center;
  font-family: 'Pacifico-Regular'; }
  @media only screen and (max-width: 1279px) {
    h1 {
      font-size: 45px;
      line-height: 40px; } }
  @media only screen and (max-width: 979px) {
    h1 {
      font-size: 35px;
      line-height: 30px; } }
  @media only screen and (max-width: 719px) {
    h1 {
      font-size: 30px;
      line-height: 25px; } }
  @media only screen and (max-width: 599px) {
    h1 {
      font-size: 25px; } }

h2 {
  color: #fff;
  font-size: 22px;
  font-weight: normal;
  padding: 10px 0;
  font-family: 'Pacifico-Regular'; }

ul h3 {
  display: inline; }

address, menu {
  margin: 0;
  padding: 0;
  font-style: normal; }

input[type="text"], input[type="email"], input[type="tel"], input[type="mobile"], input[type="fax"], input[type="password"], textarea, select {
  font-family: Trebuchet MS,Tahoma,sans-serif,Verdana;
  font-size: 13px;
  color: #3C3F3B;
  max-width: 100%;
  width: 100%;
  border: 1px solid #2F2F2F;
  display: inline-block;
  background: #FFF; }

.menu-nav ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0; }

.photos ul {
  list-style: none;
  margin: 0;
  padding: 0; }
.photos a {
  display: block; }
.photos img {
  max-width: 100%;
  height: auto; }

.none {
  display: none; }

.center, #center {
  text-align: center; }

.url {
  display: inline-block; }

.num {
  font-size: 16px;
  font-weight: 500;
  display: inline-block; }

.clearfix:after {
  content: "";
  display: table;
  clear: both; }

.container {
  margin: 0 auto;
  max-width: 1550px;
  padding: 0 15px;
  width: 100%; }

.wrapper {
  margin: 0 auto;
  max-width: 1824px;
  padding: 0 15px;
  width: 100%; }

.row {
  margin-left: -15px;
  margin-right: -15px; }

/*CONTACT*/
.form-group {
  margin: 0 0 10px 0; }

.form-group label, .form-group input.form-input, textarea.form-textarea {
  width: 99%;
  display: block;
  margin: 0 auto; }

input[type="text"], textarea, select {
  padding: 8px 5px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.btn-form {
  margin: 10px 0 0 0; }

.btn-submit-1, .btn-submit-2 {
  background: #000;
  border-color: #0073aa;
  -webkit-box-shadow: inset 0 1px 0 rgba(120, 200, 230, 0.5), 0 1px 0 rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 1px 0 rgba(120, 200, 230, 0.5), 0 1px 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-decoration: none;
  width: 200px;
  padding: 10px 16px;
  font-size: 15px;
  border: 1px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  margin: 10px 0 0 0;
  cursor: pointer;
  text-transform: capitalize; }

/*PLAN D'ACCES*/
.map-google {
  width: 100%;
  margin: 0 auto; }

.map-google iframe {
  margin: 0;
  padding: 0;
  border: none;
  width: 100%;
  height: 600px; }

/*REALISATIONS*/
p.titre-diapo {
  text-transform: uppercase;
  font-weight: bold; }

#diapo-container ul, #diapo-container ul li {
  margin: 0;
  padding: 0;
  list-style: none; }

#diapo-container .nav-diapo ul li {
  border-bottom: 1px solid #eee; }

#diapo-container .nav-diapo ul li:first-child {
  border-top: 1px solid #eee; }

#diapo-container .nav-diapo ul li a {
  display: block;
  padding: 10px 0 10px 5px;
  text-transform: uppercase; }

#diapo-container .nav-diapo ul li.link-play a, #diapo-container .nav-diapo ul li a:hover {
  background: #1b9bff;
  color: #fff; }

#diapo-container .nav-diapo ul li a:hover {
  opacity: 0.8; }

#diapo-container .nav-diapo ul {
  padding-left: 5px; }

.nav-diapo {
  width: 28%;
  float: left;
  display: none; }

#diapo-inner {
  width: 60%;
  margin: 0 auto; }
  @media only screen and (max-width: 1279px) {
    #diapo-inner {
      width: 70%; } }
  @media only screen and (max-width: 1023px) {
    #diapo-inner {
      width: 90%; } }
  @media only screen and (max-width: 899px) {
    #diapo-inner {
      width: 100%; } }

.nav-diapo .link-disable {
  cursor: not-allowed;
  opacity: 0.4; }

@media screen and (max-width: 767px) {
  #smartnav {
    display: block; }

  #nav {
    display: none; } }
/* ----------------------------------
/* ------------ HEADER ----------
------------------------------------- */
#pageweb {
  margin: 0 auto;
  max-width: 1920px;
  overflow: hidden;
  width: 100%; }

header #header {
  position: relative; }
  header #header #flash img {
    max-width: 100%;
    height: auto;
    width: 100%; }
  header #header .head {
    background: rgba(0, 0, 0, 0.8);
    position: absolute;
    max-width: 100%;
    width: 100%;
    top: 0;
    z-index: 20; }
    @media only screen and (max-width: 799px) {
      header #header .head {
        position: relative; } }
    header #header .head .top-one {
      display: -webkit-box;
      display: flex;
      -webkit-box-pack: justify;
      justify-content: space-between;
      -webkit-box-align: center;
      align-items: center;
      padding: 30px 15px; }
      @media only screen and (max-width: 899px) {
        header #header .head .top-one {
          flex-wrap: wrap; } }
      header #header .head .top-one #logo {
        max-width: 34%;
        width: 100%; }
        @media only screen and (max-width: 899px) {
          header #header .head .top-one #logo {
            max-width: 100%;
            padding-bottom: 25px; } }
        @media only screen and (max-width: 479px) {
          header #header .head .top-one #logo a img {
            max-width: 100%;
            width: 100%;
            height: auto; } }
      header #header .head .top-one .coord {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        max-width: 34%;
        width: 100%;
        -webkit-box-pack: justify;
        justify-content: space-between; }
        @media only screen and (max-width: 1279px) {
          header #header .head .top-one .coord {
            max-width: 40%; } }
        @media only screen and (max-width: 979px) {
          header #header .head .top-one .coord {
            max-width: 46%; } }
        @media only screen and (max-width: 899px) {
          header #header .head .top-one .coord {
            max-width: 100%;
            -webkit-box-pack: center;
            justify-content: center;
            padding: 25px 0;
            background: #253bb2; } }
        @media only screen and (max-width: 479px) {
          header #header .head .top-one .coord {
            flex-wrap: wrap; } }
        header #header .head .top-one .coord .tel {
          color: #FFF;
          text-align: right;
          background-image: url(../images/tel.png);
          background-position: right;
          background-repeat: no-repeat;
          padding-right: 38px; }
          @media only screen and (max-width: 899px) {
            header #header .head .top-one .coord .tel {
              margin: 0 15px; } }
          @media only screen and (max-width: 479px) {
            header #header .head .top-one .coord .tel {
              margin: 10px 15px; } }
          header #header .head .top-one .coord .tel p {
            padding: 0;
            text-transform: uppercase;
            font-weight: 600; }
          header #header .head .top-one .coord .tel a {
            font-size: 25px;
            color: #FFF; }
        header #header .head .top-one .coord .adress {
          color: #FFF;
          text-align: right;
          background-image: url(../images/ad.png);
          background-position: right;
          background-repeat: no-repeat;
          padding-right: 38px; }
          @media only screen and (max-width: 899px) {
            header #header .head .top-one .coord .adress {
              margin: 0 15px; } }
          @media only screen and (max-width: 479px) {
            header #header .head .top-one .coord .adress {
              margin: 10px 15px; } }
          header #header .head .top-one .coord .adress p {
            padding: 0; }
            header #header .head .top-one .coord .adress p:first-child {
              text-transform: uppercase;
              font-weight: 600; }
    header #header .head .top-two {
      background: #253bb2; }
      @media only screen and (max-width: 979px) {
        header #header .head .top-two {
          display: none; } }
      header #header .head .top-two .blocs-menu ul {
        list-style: none;
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        padding: 0;
        margin: 0; }
        header #header .head .top-two .blocs-menu ul li {
          padding: 20px 20px;
          border-right: dashed 1px #FFF; }
          header #header .head .top-two .blocs-menu ul li:last-child {
            border: none; }
          header #header .head .top-two .blocs-menu ul li:hover {
            background: #FFF; }
          header #header .head .top-two .blocs-menu ul li a {
            padding: 20px 20px;
            color: #FFF;
            font-size: 18px;
            font-weight: 600;
            text-transform: uppercase; }
            header #header .head .top-two .blocs-menu ul li a:hover {
              color: #404040; }
            @media only screen and (max-width: 1151px) {
              header #header .head .top-two .blocs-menu ul li a {
                padding: 20px 10px; } }
            @media only screen and (max-width: 1049px) {
              header #header .head .top-two .blocs-menu ul li a {
                font-size: 16px; } }

/* ----------------------------------
/* ------------ CORPS ----------
------------------------------------- */
#corps {
  min-height: 400px; }
  #corps .ttl {
    padding: 60px 10px 40px; }
    #corps .ttl p {
      text-align: center;
      font-size: 14px; }
  @media only screen and (max-width: 1279px) {
    #corps #section1 {
      padding-left: 15px; } }
  #corps #section1 .range-one {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center; }
    @media only screen and (max-width: 899px) {
      #corps #section1 .range-one {
        flex-wrap: wrap-reverse; } }
    #corps #section1 .range-one .photo1 {
      max-width: 40%;
      width: 100%; }
      @media only screen and (max-width: 899px) {
        #corps #section1 .range-one .photo1 {
          max-width: 100%; } }
      #corps #section1 .range-one .photo1 img {
        max-width: 100%;
        height: auto; }
    #corps #section1 .range-one .texte1 {
      max-width: 60%;
      width: 100%; }
      @media only screen and (max-width: 1439px) {
        #corps #section1 .range-one .texte1 {
          padding-left: 25px; } }
      @media only screen and (max-width: 899px) {
        #corps #section1 .range-one .texte1 {
          max-width: 100%;
          padding-left: 0; } }
      #corps #section1 .range-one .texte1 h2 {
        background: #253bb2;
        padding: 5px 0 5px 20px; }
      #corps #section1 .range-one .texte1 p {
        max-width: 882px;
        width: 100%; }
        @media only screen and (max-width: 1439px) {
          #corps #section1 .range-one .texte1 p {
            padding: 10px 10px 10px 0; } }
  #corps #section2 {
    background-image: url(../images/para.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 300px;
    margin-top: 35px; }
  #corps #section3 {
    background: #253bb2;
    min-height: 375px;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center; }
    #corps #section3 .range-two {
      position: relative;
      -webkit-box-pack: center;
      justify-content: center;
      display: -webkit-box;
      display: flex; }
      #corps #section3 .range-two .texte2 {
        max-width: 942px;
        width: 100%;
        margin: 0 auto;
        padding: 0 15px; }
        #corps #section3 .range-two .texte2 h2 {
          text-align: center;
          padding: 55px 0 45px; }
          @media only screen and (max-width: 532px) {
            #corps #section3 .range-two .texte2 h2 {
              padding: 20px 0; } }
        #corps #section3 .range-two .texte2 p {
          color: #FFF; }
      #corps #section3 .range-two .pic-ab {
        position: absolute;
        z-index: 10;
        bottom: -17%; }
        @media only screen and (max-width: 767px) {
          #corps #section3 .range-two .pic-ab {
            bottom: -28%; } }
        @media only screen and (max-width: 532px) {
          #corps #section3 .range-two .pic-ab {
            bottom: -15%; } }
        @media only screen and (max-width: 479px) {
          #corps #section3 .range-two .pic-ab {
            bottom: -22%; } }
        @media only screen and (max-width: 532px) {
          #corps #section3 .range-two .pic-ab img {
            max-width: 60%;
            width: 100%;
            height: auto; } }
  #corps #section4 {
    padding: 120px 15px 35px; }
    #corps #section4 h2 {
      color: #404040;
      font-size: 40px;
      text-align: center;
      padding-bottom: 25px; }
    #corps #section4 .galerie ul {
      list-style: none;
      display: -webkit-box;
      display: flex;
      -webkit-box-pack: center;
      justify-content: center;
      padding: 0; }
      @media only screen and (max-width: 359px) {
        #corps #section4 .galerie ul {
          flex-wrap: wrap; } }
      #corps #section4 .galerie ul li {
        padding: 0 10px; }
        @media only screen and (max-width: 532px) {
          #corps #section4 .galerie ul li {
            padding: 0 3px; } }
        @media only screen and (max-width: 359px) {
          #corps #section4 .galerie ul li {
            padding: 10px 0; } }
        #corps #section4 .galerie ul li img {
          max-width: 100%;
          height: auto; }

#smartnav {
  display: none; }
  @media only screen and (max-width: 979px) {
    #smartnav {
      display: block; } }

.texte {
  padding-bottom: 30px; }

/* ----------------------------------
/* ------------ FOOTER ----------
------------------------------------- */
#footer {
  background: #000;
  padding: 25px 0; }
  #footer .foot {
    display: -webkit-box;
    display: flex; }
    @media only screen and (max-width: 979px) {
      #footer .foot {
        -webkit-box-pack: center;
        justify-content: center; } }
    #footer .foot .left {
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      flex-direction: column;
      -webkit-box-align: start;
      align-items: flex-start; }
      @media only screen and (max-width: 979px) {
        #footer .foot .left {
          -webkit-box-align: center;
          align-items: center; } }
      #footer .foot .left .logo-foot img {
        max-width: 100%;
        width: 100%;
        height: auto; }
      #footer .foot .left .social {
        padding: 15px 0; }
    #footer .foot .link {
      padding-left: 50px; }
      @media only screen and (max-width: 979px) {
        #footer .foot .link {
          display: none; } }
      #footer .foot .link ul {
        list-style: none;
        text-transform: uppercase;
        font-weight: 600;
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap;
        line-height: 40px; }
        #footer .foot .link ul li {
          border-right: dashed 1px #FFF; }
          #footer .foot .link ul li:hover {
            background: #253bb2; }
          #footer .foot .link ul li:last-child {
            border: none; }
          #footer .foot .link ul li a {
            padding: 0 20px;
            color: #FFF; }
            @media only screen and (max-width: 1049px) {
              #footer .foot .link ul li a {
                font-size: 14px; } }