html {font-family: 'Roboto', sans-serif}
body{background-color: #fff}
a:hover {text-decoration: none}
p {font-size: 1.2rem;line-height: 2}
.container {max-width: 1320px}
.container-fluid {max-width: 100%}
/*
font-family: 'Lobster', cursive;
font-family: 'Roboto Condensed', sans-serif;

  0 - BASE
  1 - ACCUEIL
  2 - INFOS & SERVICES
  3 - LA BOUTIQUE
  4 - CONTACT
  
  /*
  =======================
  breakpoint-xs => 0
  breakpoint-sm => 768px
  breakpoint-md => 1024px
  breakpoint-lg => 1154px
  breakpoint-xl => 1366px
  =======================
  @media (max-width:1920px){}
  @media (max-width:1600px){}
  @media (max-width:1366px){}
  @media (max-width:1154px){}
  @media (max-width:1024px){}
  @media (max-width:768px){}
  @media (max-width:640px){}
  @media (max-width:360px){}
  */

/*

/*====================================
      MODAL
====================================*/
.modal {border: 0px;text-align: center}
.modal .modal-header{background-color: #10589a;padding:10px 20px;color:#fff;border-radius: 0px;border: none}
.modal .modal-header button {color:#FFF}
.modal .modal-header strong {text-transform: uppercase}
.modal .modal-body {padding:0px}
.modal .modal-body p {padding:5px 30px 10px 30px}
.modal .modal-body .carousel {margin-bottom: 25px}
.modal .carousel-inner {background: #000;margin: 0 auto}
.modal a.carousel-control-prev {background:#10589a;display: block;margin-top: 220px;padding-top: 25px;height:70px;width: 50px;margin-left: 0px;-webkit-transition: all 0.25s;transition: all 0.25s}
.modal a.carousel-control-next {background:#10589a;display: block;margin-top: 220px;padding-top: 25px;height:70px;width: 50px;margin-right: 0px;-webkit-transition: all 0.25s;transition: all 0.25s}
.modal-lg {max-width: 50%}
@media (max-width: 1920px) {
  .modal-lg {max-width: 60%}
}
@media (max-width: 1480px) {
  .modal-lg {max-width: 75%}
}
@media (max-width: 1200px) {
  .modal-lg {max-width: 90%}
}


/*
================================================== NAVBAR
*/
.navbar {margin: 0;padding: 0;}
/* toggler */
button.custom-toggler {outline: none;position: absolute;right:16px;top:16px;z-index: 999;-webkit-transition: all 0.25s;transition: all 0.25s}
.custom-toggler.navbar-toggler {border-color: #333;border-radius: 0px;padding: 15px;background-color:#444}
.custom-toggler .navbar-toggler-icon {background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='4' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E")}
.nav-responsive {display: none}
.brand-main {display: inline}
/* Main Nav ACCUEIL */
#mainav {width:100%;background: #ffffff;text-align: left}
#mainav .active {background: rgba(255,255,255,.25)}
#mainav.fixed {position: fixed;padding:0;height: 80px;z-index: 999;top:0;}
#mainav ul {list-style: none;margin: 0 auto}
#mainav ul li {display: inline-block;padding:0;margin:0;font-size: 1rem}
#mainav ul li a {padding: 27px 20px;text-transform: uppercase;color:#1d6a88;font-weight: 800;letter-spacing: .5px;-webkit-transition: all 0.25s;transition: all 0.25s}
#mainav ul li a:hover {background: rgba(255,255,255,.1)}
#mainav #mainav-logo a {padding: 0;margin: 0;text-align: left}
#mainav #mainav-logo a:hover {background: none}
#mainav #mainav-logo a img{height: 80px;padding: 0 80px 0 20px;margin: 0}
@media (max-width: 1480px) {
  .navbar .container {max-width: 100%}  
  #mainav ul li a {font-size: .9rem}
  #mainav #mainav-logo a img{height: 70px;padding: 0 50px 0 20px}
}
@media (max-width: 1200px) {
  #mainav ul li a {padding: 27px 17px;font-size: .8rem}
  #mainav #mainav-logo a img{height: 50px;padding: 0 20px 0 10px}
}
@media (max-width: 992px) {
  #mainav.fixed {position: absolute;padding:0;height: auto;z-index: 999;top:0;}
  #mainav ul li {width: 100%}
  #mainav #mainav-logo a img{height: 80px;padding: 0;margin: 9px 0}
}


/*
================================================== SLIDER
*/
@keyframes fade {
  0%   {opacity:1}
  33.333% { opacity: 0}
  66.666% { opacity: 0}
  100% { opacity: 1}
}
@keyframes fade2 {
  0%   {opacity:0}
  33.333% { opacity: 1}
  66.666% { opacity: 0 }
  100% { opacity: 0}
}
@keyframes fade3 {
  0%   {opacity:0}
  33.333% { opacity: 0}
  66.666% { opacity: 1}
  100% { opacity: 0}
}

.slider-middle {margin: 0px auto;position: relative;z-index: 5;text-align: center}
.slide1 {z-index: -1}
.slide1 {width: 100%;height: 700px;background: url(../img/accueil/slider/fond.jpg)no-repeat;background-position: center center;background-size: cover}
.slide1 .homcasque {float:right;height: 700px}
.slider-titre {position: absolute;width: 500px;left: 50%;margin-left: -250px;top:150px;z-index: 9}
.slider-titre span {text-transform: uppercase;color:#d5f29c;font-size: 2rem;margin-left: 5px}
.slider-titre h1 {font-size: 5rem;font-weight: 700;color:#fff;margin: 0px 0 20px;line-height: 1;letter-spacing: -1px; font-size: 4em;}
.slider-titre hr {height: 2px;width: 300px;background-color: #d5f29c;margin-left: 100px}
.slider-titre h2 {font-size: 1.5rem;margin-left:5px;text-transform: uppercase;font-weight: 700;color:#fff}
.slider-actu {position: absolute;left:5%;top:45%;background: url(../img/nos-actualites/bureau-interieur.jpg) no-repeat center;background-size:cover;padding: 150px 20px 20px 20px;width: 450px;font-size: 1.2rem;text-align: left;z-index: 1}
.slider-actu span {display: block;background: #222;padding: 10px;color:#fff;}
.slider-actu a {color:#9cbd5c;padding: 5px 0}     
@media (max-width: 1480px) {
  .slider-actu {width: 25%}
}
@media (max-width: 1088px) {
  .slider-actu {display:none;}
}

/*
================================================== SECTION 1
*/
#acc-sect-1 {background: #f1f1f1;padding: 0;margin: 0;color:#555}
#acc-sect-1 .container {background: #fff;margin: -50px auto;position: relative;z-index: 99;padding: 90px 90px 80px 90px;max-width: 1500px}
#acc-sect-1 h3 {font-size: 3.2rem;font-weight: 700;margin-bottom: 10px;line-height: 1;letter-spacing: -1px;margin-bottom: 20px}
#acc-sect-1 h4 {font-size: 1.2rem;color: #9cbd5c;text-transform: uppercase;margin-bottom: 25px}
#acc-sect-1 hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-left: 5px;margin-bottom: 60px}
#acc-sect-1 hr.hr-signature {margin-left: 180px;margin-top: -60px;margin-bottom: 0px}
#acc-sect-1 p {text-align: justify;margin-bottom: 40px}
#acc-sect-1 figure img {display: inline-block;height:80px;margin-bottom: 25px}
#acc-sect-1 a {float: right;font-size: 1.2rem;text-align: center;background-color: #9cbd5c;color:#fff;font-weight: 700;padding: 15px 60px;text-transform: uppercase;-webkit-transition: all 0.25s;transition: all 0.25s}
#acc-sect-1 a:hover {background-color: #10589a}
@media (max-width:1366px){
  #acc-sect-1 .container {padding: 90px 5% 80px 5%;max-width: 100%}
}
@media (max-width:1154px){
  #acc-sect-1 .container {text-align: center}
  #acc-sect-1 hr {margin: 0 auto 40px auto}
  #acc-sect-1 figure {text-align: center}
  #acc-sect-1 p {margin-top: 20px}
}

/*
================================================== SECTION 2
*/
#section-2 {background: url(../img/accueil/bg-section-2.webp) no-repeat center top;background-size: cover;padding: 120px 0;text-align: center}
#section-2 h2 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#fff}
#section-2 hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-bottom: 80px}
#section-2 .content {cursor: pointer}
#section-2 figure {background: rgb(0,0,0,.25);padding: 20px 5px;margin-top:15px;-webkit-transition: all 0.25s;transition: all 0.25s}
#section-2 figure:hover {background: #10589a}
#section-2 figure img {width: 120px}
#section-2 figure figcaption {font-size: 1.1rem;text-transform: uppercase;color:#fff;font-weight: 700;padding:15px 0 15px 0;}
@media (max-width:767px){
  #section-2 h2 {font-size: 2.5rem}
}
/*
================================================== SECTION 3
*/

#section-3 {background: #fff;padding: 120px 0;z-index: 99;text-align: left}
#section-3 h2 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#555}
#section-3 h2 span {color:#9cbd5c}
#section-3 hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-top:40px;margin-bottom:80px;margin-left: 0}
#section-3 p {margin-top: 80px;color:#555}
#section-3 h3 {color:#333;font-weight: 700;letter-spacing: -.5px;font-size: 2rem}
#section-3 h4 {color:#9cbd5c;text-transform: uppercase;font-size: 1rem;font-weight: 700}
#section-3 .item {padding: 0 10px}
#section-3 .item .item-content{background-color:#9cbd5c;padding: 0 20px;height: 100%;width: 100%}
#section-3 .item .item-content {text-align: center;padding-top: 40px}
#section-3 .item .item-content h5 {color:#fff;font-weight: 700;letter-spacing: -.5px;font-size: 1.8rem;margin-top: 20px}
#section-3 .item .item-content ul {list-style: none;padding: 0;color:#fff;font-size: 1.2rem;border-top: 1px solid #f1f1f1;margin-top: 40px}
#section-3 .item .item-content ul li {border-bottom: 1px solid #f1f1f1;padding: 20px 0}
/* responsive */
@media (max-width: 1200px) {
  #section-3 {padding: 80px 20px}
  #section-3 hr {margin-left: auto}
  #section-3 h2 {text-align: center}
  #section-3 .item {padding: 0 10px}
  #section-3 .item .item-content ul {padding-bottom: 50px}
  
}
@media (max-width: 1153px){
  #section-3 img.img-fluid,#section-3 p,#section-3 h3,#section-3 h4 {display: none}
}
@media (max-width:767px){
  #section-3 h2 {font-size: 2.5rem}
}
#section-3 .col-md-12,#section-3 .col-sm-12,#section-3 .col-xs-12 {margin-top: 20px}
/*
================================================== LA SOCIETE
*/
#histoire {background: #fff url(../img/la-societe/background.jpg) no-repeat center bottom;background-size: cover;padding: 180px 0 150px 0}
#histoire h2 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#555}
#histoire h2 span {color:#9cbd5c}
#histoire hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-top:40px;margin-bottom: 40px;margin-left: 0}
#histoire p {color:#555;padding-right:50px;text-align: justify;}
#histoire h3.date {line-height: 1;margin-top: 40px;font-weight: 700;letter-spacing: -1px;color: #9cbd5c}
#histoire p.desc {margin-top: 30px}
#slider-portfolio {padding:20px 0px 0 0px;-webkit-transition: all 0s;transition: all 0s}
#slider-portfolio .carousel-inner {width: 100%;height:600px;background: #000;margin: 0 auto}
#slider-portfolio a.carousel-control-prev {background:#10589a;display: block;margin-top: 265px;padding-top: 25px;height:70px;width: 50px;margin-left: 0px;-webkit-transition: all 0.25s;transition: all 0.25s}
#slider-portfolio a.carousel-control-next {background:#10589a;display: block;margin-top: 265px;padding-top: 25px;height:70px;width: 50px;margin-right: 0px;-webkit-transition: all 0.25s;transition: all 0.25s}
#equipe {background: #e5ebf0;padding: 50px 10% 120px 158px}
#equipe .team {padding: 0px 80px 0 0}
#equipe img.img-equipe {margin-top: 50px;padding: 0;}
#equipe h2 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#9cbd5c}
#equipe hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-top:40px;margin-bottom: 40px;margin-left: 0}
#equipe p {color:#555;padding-right:50px;text-align: justify;font-weight: 400}
#equipe .personne {margin-top: 30px;padding: 0px;text-align: center}
#equipe .personne h3 {font-weight: 700;font-size: 1.2rem;color: #333;margin-top: 15px}
#equipe .personne small {color: #9cbd5c;font-size: .9rem;text-transform: uppercase;letter-spacing: -.2px;font-weight: 700}
#equipe .personne img {height: 150px}

/* responsive */
@media (max-width: 1480px) {
  #histoire {padding: 150px 20px 120px 20px}
  #histoire p {padding-right:20px}
  #slider-portfolio .carousel-inner {margin-top: 30px}
  #equipe .personne img {height: 120px}
  #equipe .personne h3 {font-size: 1.2rem}
  #equipe .personne small {font-size: .8rem}
}
@media (max-width: 1199px) {
  #histoire {text-align: center;padding: 80px 20px 0px 20px}
  #histoire hr {margin-left: auto}
  #histoire p {text-align: justify;text-align-last: center;padding:0px 20% 40px 20%}
  #histoire h3.date {margin-top: 0px;text-align: right}
  #histoire .content-desc {text-align: left;text-align-last: left}
  #histoire p.desc {margin-top: 0px;padding: 0 30% 10px 0;text-align: justify;text-align-last: left}
  #slider-portfolio {padding:20px 10% 0 10%}
  #equipe {padding: 80px 0 0 0}
  #equipe .team {padding: 20px;margin: 0}
  #equipe .members {padding: 20px 50px;text-align: center}
  #equipe hr {margin-left: auto}
  #equipe p {text-align: justify;text-align-last: center;padding:0px 20% 40px 20%}
}
@media (max-width:767px){
  #histoire p {padding:0px}
  #histoire h3.date {text-align: left}
  #histoire p.desc {padding: 0}
  #slider-portfolio {padding:20px 0}
  #equipe p {padding:0px}
}

/*
================================================== NOS COMPETENCES
*/
#competences {overflow: hidden;background: url(../img/competences/background.jpg) no-repeat center center;background-attachment: fixed;background-size: cover;padding: 0px 0 150px 0}
#competences .content-comp {background: #fff;padding:180px 0px 30px 110px}
#competences h1 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#555}
#competences h1 span {color:#9cbd5c}
#competences hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-top:40px;margin-bottom: 40px;margin-left: 0;-webkit-transition: all 0.25s;transition: all 0.25s}
#competences .content-comp p {color:#555;padding-right:50px;padding-left: 70px;text-align: justify;margin-bottom: 60px;line-height: 2}
#competences p strong {font-size:1.5rem;}
#competences p span {font-weight: 300;color: #9cbd5c;font-size: 1.5rem}
#competences .container-fluid {max-width: 1560px}
#competences .compet {margin-top: 20px;padding: 20px;text-align: left}
#competences .compet .compet-content {background: rgba(255,255,255,.9);padding: 40px 40px 40px 40px;height: 100%;width: 100%;cursor: pointer;-webkit-transition: all 0.25s;transition: all 0.25s}
#competences .compet .compet-content:hover {background: #fff}
#competences .compet .compet-content:hover .fleche{opacity: 1;right:60px}
#competences .compet .compet-content:hover hr {width: 50px}
#competences .compet .compet-content .fleche {position: absolute;bottom: 50px;right:80px;opacity: 0;-webkit-transition: all 0.25s;transition: all 0.25s}
#competences .compet .compet-content .fleche img {width:50px;opacity: .5}
#competences .compet .compet-content-img {background: #9cbd5c;padding: 10px;text-align: center;border-radius: 50% 50%;width: 120px;height: 120px;}
#competences .compet .compet-content-img img {width: 80px;margin-top:10px }
#competences .compet .compet-content h2 {font-weight: 700;font-size: 1.3rem;text-transform: uppercase;letter-spacing: -.5px;display: block;width: 100%;margin-top:20px;color:#555}
#competences .compet .compet-content hr {margin-top:20px}
#competences .compet .compet-content p {color:#555;padding-right:0px;text-align: justify;margin-bottom: 60px;line-height: 2}
#competences .compet .compet-content p b {color:#9cbd5c;}

@media (max-width:1153px){
 #competences .content-comp {padding-top:100px}
 #competences .content-comp p {padding-left: 0px}
}
@media (max-width:767px){
  #competences .content-comp {padding: 100px 0 0px 5%}
}


/*
================================================== NOS REALISATIONS
*/
#realisations {background: #fff url(../img/realisations/background.jpg) no-repeat center bottom;background-size: cover;padding: 180px 0;text-align: center}
#realisations h1 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#555}
#realisations h1 span {color:#9cbd5c}
#realisations hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-top:40px;margin-bottom: 40px}
#realisations .item:hover .img-fluid{-webkit-filter: grayscale(50%);filter: grayscale(50%);cursor: pointer;opacity: .8}
#realisations .img-fluid {margin-top: 30px;-webkit-filter: grayscale(0%);filter: grayscale(0%);-webkit-transition: all 0.25s;transition: all 0.25s}
#realisations h2 {background: #222;color:#f1f1f1;text-transform: uppercase;font-size: 1.2rem;text-align: center;padding: 10px 5px }
@media (max-width: 1480px) {
  #realisations {padding: 150px 0}
}
@media (max-width: 1199px) {
  #realisations {padding: 100px 0}
}
/*
================================================== ACTUALITES
*/
#actu-titre {padding: 180px 0 0 0;text-align: center}
#actu-titre h1 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#555}
#actu-titre h1 span {color:#9cbd5c}
#actu-titre hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-top:40px;margin-bottom: 50px}
#actu {background: url(../img/la-societe/background.jpg) no-repeat center bottom;background-size: cover;padding: 20px 0 150px 0;text-align: left}
#actu h1 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#555}
#actu h1 span {color:#9cbd5c}
#actu hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-top:40px;}
#actu .lien {text-align: center;background-color: #9cbd5c;color:#fff;font-weight: 700;padding: 15px 60px;margin-top: 20px;text-transform: uppercase;letter-spacing: -.5px;-webkit-transition: all 0.25s;transition: all 0.25s}
#actu .lien:hover {background-color: #10589a;cursor: pointer}
#actu #lightgallery0 {margin-top: 20px}
#actu .row {margin-bottom:60px;padding:50px;border-bottom: 3px solid #9cbd5c ;background: #f8f8f8}
#actu .row:last-child {margin-bottom:30px}
#actu .row .date {position: absolute;background-color: #9cbd5c;color:#fff;font-weight: 700;font-size: 1rem;padding: 10px;z-index: 66;}
#actu img.img-actu {padding: 12px 0}
#actu .content-actu {padding: 30px 30px;text-align: justify}
#actu .content-actu h2 {color:#444;text-transform: uppercase;font-weight: 700;font-size: 1.5rem;letter-spacing: -.5px;}
#actu .content-actu small {color:#9cbd5c;font-size: 1.3rem;font-weight: 400}
#actu .content-actu p {color:#555;text-align: justify;line-height: 1.8;padding:0;margin-top: 20px}
#actu .content-actu a {color:#f0f0f0;display: block;padding: 20px}
#actu .content-actu ul {list-style-position: outside;}
#actu .content-actu ul li {font-size: 1.2rem;line-height: 2;color:#555}
#actu .content-actu ul li span {font-weight: 300;color: #9cbd5c;font-size: 1.5rem}
#actu .content-actu img.internet {height: 30px;margin-right: 10px}
@media (max-width: 1480px) {
  #actu-titre {padding: 150px 0 0 0}
}
@media (max-width: 1199px) {
  #actu-titre {padding: 100px 0 0 0}
}
@media (max-width: 521px) {
  #actu .row {padding:2%}
}

/*
================================================== CONTACTEZ-NOUS
*/
#contact {background: url(../img/contact/background.jpg) no-repeat center center;background-attachment: fixed;background-size: cover;padding: 0px 0 150px 0;overflow: hidden}
#contact .contact-comp {background: rgba(255,255,255,.8);padding:180px 0px 30px 110px;margin-top: -20px}
#contact img.logo {background-color: #fff;padding: 20px 40px;margin-left: 70px;margin-bottom: 60px}
#contact h1 {font-size: 3rem;font-weight: 700;margin-bottom: 20px;line-height: 1;letter-spacing: -1px;color:#555}
#contact h1 span {color:#9cbd5c}
#contact hr {height: 2px;width: 90px;background-color: #9cbd5c;margin-top:40px;margin-bottom: 40px;margin-left: 0;transition: all 0.25s}
#contact .contact-comp p {color:#555;padding-right:50px;padding-left: 70px;text-align: justify;margin-bottom: 60px;line-height: 2}
#contact p span {font-weight: 300;color: #9cbd5c;font-size: 1.5rem}
#contact .container-fluid {max-width: 1560px}
#contact #sendMessageButton {text-align: center;background-color: #9cbd5c;color:#fff;font-weight: 700;padding: 15px 60px;margin-top: 20px;text-transform: uppercase;letter-spacing: -.5px;-webkit-transition: all 0.25s;transition: all 0.25s}
#contact #sendMessageButton:hover {background-color: #10589a;cursor: pointer}
#contact .formulaire {width :100%;text-align: left;display: inline-block;vertical-align: top}
#contact .formulaire h4 {color:rgba(255,255,255,.9);background: #9cbd5c;display: inline;padding: 20px 35px;margin:0px 0;display: block;border-radius: 10px;font-weight: 700;font-size: 18px}
#contact .formulaire h4 small {font-weight: 300;color: #504242}
#contact .formulaire form {margin-top: 50px}
#contact .formulaire form label {display: block;color:#504242;margin-bottom: -10px;margin-top:20px;font-size: 1rem;margin-left: 0%}
#contact .formulaire form label span {color:#cc3333}
#contact .formulaire form input[type=text] {border: 1px solid #9cbd5c;border-radius: 5px;transition:all .2s;background: rgba(255,255,255,.5);font-size: 1rem;width: 100%;padding:12px;margin-left: 0%}
#contact .formulaire form input[type=text]:focus {border: 1px solid #fff;outline: none;background: rgba(255,255,255,.8)}
#contact .formulaire form textarea {padding: 12px;border: 1px solid #9cbd5c;border-radius: 5px;background: rgba(255,255,255,.5);font-size: 1rem;box-sizing: border-box;max-width: 100%;margin-left: 0%;transition:all .2s;}
#contact .formulaire form textarea:focus {border: 1px solid #fff;background: rgba(255,255,255,.8);outline: none}
#contact .formulaire .button {color: rgba(255,255,255,.9);background: #504242;display: block;width: 100%;border: 1px solid #504242;border-radius: 10px;padding: 20px 40px;font-size: 16px;font-weight:900;text-transform: uppercase;margin-top: 60px;transition:all .2s}
#contact .formulaire .button:hover {color: #9cbd5c;background: #000;cursor: pointer}
#contact .formulaire p {padding:0}
#ajaxResponseFail {display:none;width:100%;padding: 20px;margin-top: 20px;margin-bottom: 20px;margin-left: 0%;text-align: center;border: 1px solid #cc3333;border-radius: 3px;background: #ffcccc;color:#cc3333}
#ajaxResponseSuccess {display:none;width:100%;padding: 20px;margin-top: 20px;margin-bottom: 20px;margin-left: 0%;text-align: center;border: 1px solid #669933;border-radius: 3px;background: #ccff99;color:#669933}
#ajaxResponseFail a {color:#cc3333;font-size: 1.1rem}
.map-content {padding: 0px 70px}
#map{height:550px;width:100%}
#contactForm{margin-top:60px}
#contactForm label{color:#9cbd5c;font-size: 1.5rem}
.floating-label-form-group{position:relative;margin-bottom:20px;background: rgba(255,255,255,1);padding: 20px 20px 0 20px}
.floating-label-form-group input,.floating-label-form-group textarea{background-color:#fff;z-index:1;position:relative;padding-right:0;padding-left:10px;border:none;border-radius:0;font-size:1.5em;background:none;-webkit-box-shadow:none !important;box-shadow:none !important;resize:none}
.floating-label-form-group::not(:first-child){padding-left:14px;border-left:1px solid #000}
.floating-label-form-group-with-value label{top:0;opacity:1;color:#333}
.floating-label-form-group-with-focus label{color:#333}
p.help-block.text-danger {padding: 0 !important;margin-bottom: 20px !important}
/* responsive */
@media (max-width: 1480px) {
  #contact h1 {font-size: 2.5rem}
  #contact .contact-comp {padding:150px 0px 30px 110px}
}
@media (max-width: 1199px) {  
  #contact h1 {font-size: 2.5rem}
  #contact .contact-comp {padding:150px 0px 30px 100px}
  #contact .contact-comp p {padding-right:20px;padding-left: 70px} 
  #map{height:500px}
}

@media (max-width: 992px) {
  #contact .contact-comp {padding: 110px 20px}
  #contact .info-contact {text-align: center}
  #contact img.logo {margin-top: 40px;margin-left: 0px}
  #contact .contact-comp p {padding-left: 0px;text-align: center}
}

@media (max-width: 521px) {
  .map-content {padding: 0px 0px}
}
/*
================================================== FOOTER
*/
footer {background: #222;margin:0;padding: 40px 0 80px 0}
footer h3 {color:#9cbd5c;font-weight: 400;font-size: 1.0rem;letter-spacing: .5px;text-transform: uppercase;margin-top: 15px}
footer p {color:#f1f1f1;margin-top: 20px;text-align: justify;padding-right: 20%}
footer p span,footer b {color:#f1f1f1}
footer .foot-1 {margin-top: 40px}
footer .foot-2 {color:#9d9d9d;margin-top: 60px;font-size: 1.2rem;line-height: 2}
footer .foot-2 strong {color:#f0f0f0;text-transform: uppercase;font-weight: 400;letter-spacing: 1px;display: block;font-size: 1.2rem;}
footer .foot-2 hr {background: #9cbd5c;width: 50px;margin:20px 0 55px 0}
.copyright {background-color: #111;text-align: center;padding: 10px 20px 20px 20px;font-size: 1rem;color:#9d9d9d;letter-spacing: 1px}
.copyright .mentions a{color:#f0f0f0}
.copyright .webmaster a {color: #f0f0f0}
footer a {color:#9cbd5c;}
@media (max-width:1366px){
  footer {padding: 40px 20px 80px 20px}
}
@media (max-width:1153px){
  footer {text-align: center}
  footer p {text-align: center;padding: 0%}
  footer .foot-2 hr {margin:20px auto 40px auto}
}

/* ========== SCROLL-TOP ========== */
.scrollToTop,.scrollToTop:focus {color:#fff;font-size: 25px;font-weight: 300;width:50px;height:50px;padding:10px;text-align:center;text-decoration: none;position:fixed;bottom:65px;margin-right:20px;z-index: 999;background-color: #10589a;border-radius: 2px;-webkit-transition:all .2s ease-in-out; transition:all .2s ease-in-out;cursor: pointer}
.scrollToTop:hover{text-decoration:none;background-color: #9cbd5c;color:#fff}
.top-on {right:10px;opacity: 1}
.top-off {right:-50px;opacity: 0}

#error {text-align: center;padding: 10% 0 20% 0;background: url(../img/contact/background.jpg)no-repeat center;background-size:cover;}
#error .container {background: rgba(255,255,255,.8);padding: 50px 0}
#error .container h1 {color:#10589a;font-size: 8rem}
#error .container h2 {color:#10589a;font-size: 2rem}
#error .container p {padding-bottom: 50px}
#error .container .link a {background: #9cbd5c;padding: 10px 20px;margin-right: 10px;font-weight: 400;color:#fff;font-size: 1.2rem}