/*
@font-face {
	font-family: "DIN";
	src: url('DIN Alternate Bold.ttf');
}
*/

:root {
  --mikro-color: rgb(5,47,95);

  --mikro-colorgreen: #63b694;
  --mikro-colorgreen2: rgb(6,214,160);
  --mikro-bgcolor: rgb(248,248,248);   /*  #f8f8f8 */
}

body {
      /* font: 400 15px/1.8 Lato, sans-serif; */
      color: rgb(5,47,95);
      position: relative;
  }

.grecaptcha-badge { z-index: -3; opacity:0 !important; position:fixed !important;}
section{ background: #fff; }

.h4{
  font-size: 20px;
  margin-top: 11px;
  margin-bottom: 11px;
  font-weight: 500;
  line-height: 1.1;
  color: inherit;
}

.chapoTemoignages{
    background: #63b694 !important;
    color: #fff;
    padding: 20px 10px;
    margin-bottom: 30px;
}


#addtohome{ font-size: 13px; color: #63b794; font-weight: 600; }
.navbar.navbar-default .container-fluid{ max-width:970px; }


.navbar-collapse.collapse.in{

}

.navbar { min-height:70px; }
.navbar-brand { height: 70px; }

.navbar.navbar-nav .container-fluid .current{
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    background: #fff;
    border-bottom: 6px solid #63b794;
}


@media (min-width: 1200px){

  .nav>li {
    position: relative;
    display: block;
    border-left: 1px solid #ddd;
    margin-left: -1px;
    border-right: 1px solid #ddd;
    position: relative;
  }

  .navbar-nav>li>a {
      padding: 25px 12px 23px 12px;
  }


  .navbar-nav>li:hover:after,
  .navbar-nav>li.active:after{
    content: '';
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 5px;
    background: #63b794;
  }
  .socialMenu{ display:none; }
}






.mikrotext {
	/* font: 400 15px/1.8 Lato, sans-serif; */
	/* font-family: "DIN"; */
}
.bold {
	font-weight: bold;
}

.text-left{ text-align:left; }
.text-white{ color:#fff; }

.ml-0{ margin: 0px; }
.ml-10{ margin-left: 10px; }


.d-flex, .row-flex, .row-flex > div[class*='col-'] {
    display: -webkit-box !important;
    display: -moz-box !important;
    display: -ms-flexbox !important;
    display: -webkit-flex !important;
    display: flex !important;
    flex:1 1 auto !important;
}

.align-items-stretch {
    -ms-flex-align: stretch!important;
    align-items: stretch!important;
}


.row-flex-wrap {
  -webkit-flex-flow: row wrap;
  align-content: flex-start;
  flex:0;
}
.container-flex > div[class*='col-'] div,.row-flex > div[class*='col-'] div {
  width:100%;
  height:100%;
}

.align-self-center{
  -ms-flex-item-align: center!important;
  align-self: center!important;
}

.p-0{ padding:0 !important; }

.w-100{ width:100% !important; }

body{ font-family: 'Lato', sans-serif;; }

.mikrotext{
  font-size: 19px;
  font-weight: 400;
}

.m-0{ margin:0 !important; }
.text-black{ color:#000 !important; }

h1.mikrotext,
h2.mikrotext,
h3.mikrotext{
    /* font-family: "DIN";
    color: var(--mikro-color); */
    line-height: 1.42857143;
    font-size: 19px;
}

h2.strong-like{
    font-size: 22px;
}

.green{ color: #63b694 !important; }

.mikrotext strong{
  font-weight: bold;
}

#myvideo{ z-index:1; }

.topHeader{
    height: 90vh;
    background: url(img/bkgHp.png) no-repeat;
    display: block;
    background-size: cover;
    background-position: center;
    /* font-family: "Roboto"; */
    position: relative !important;
    width: 100% !important;
    text-align: center !important;
    z-index: -1;
    margin: 0 !important;
    left: 0 !important;
}
.topHeader.mobile{
  background: url(img/bkgHpMobile2.jpg) no-repeat;
  background-size: cover !important;
  background-position: right;
}
.topHeader .baseline-desktop{
  font-family: 'Roboto', sans-serif;
  font-weight: 900;
  color: white;
  font-size: 45px;
  letter-spacing: 2px;
  margin-bottom: 50px;
}
.topHeader .btn-baseline{
  font-size: 30px;
  border: none;
  border-radius: 35px;
  padding: 20px 30px;
  text-transform: uppercase;
  background: #63b694;
  color: #fff;
  font-family: 'Roboto', sans-serif;;
  font-size: 23px;
  font-weight: bold;
  font-weight: 500 !important;
  padding: 20px 55px;
}

div.containerf {
    position: relative;
    width: 100%;
    overflow: hidden;
}
div.containerf div.align {
    position: relative;
    width: 3000px;
    left: 50%;
    margin: 0 0 0 -1500px;
    text-align: center;
    /* z-index:-1; */
}

.img-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
}
.img-overlay-xs {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
}
.img-overlay-sm {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
}
.img-overlay:before {
  content: ' ';
  display: block;
  /* adjust 'height' to position overlay content vertically */
  height: 40%;
}
.img-overlay-xs:before {
  content: ' ';
  display: block;
  /* adjust 'height' to position overlay content vertically */
  height: 35%;
}
.img-overlay-sm:before {
  content: ' ';
  display: block;
  /* adjust 'height' to position overlay content vertically */
  height: 57%;
}

.baseline-mobile {
  /* font: 400 21px/1.8 Lato, sans-serif; */
  color: white;
  color: white;
  font-size: 18px;
  /* margin-top: 58px; */
}

/* h3, h4 {
margin: 10px 0 30px 0;
letter-spacing: 10px;
font-size: 20px;
color: #111;
} */

/*
@media (max-width: 700px) {
.myvideo {
display: none;  Hide the carousel text when the screen is less than 600 pixels wide
}
}
*/

.bg-1 {
  background: #2d2d30;
  color: #bdbdbd;
}
.bg-1 h3 {color: #fff;}
.bg-1 p {font-style: italic;}
.list-group-item:first-child {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.list-group-item:last-child {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.thumbnail {
  padding: 0 0 15px 0;
  border: none;
  border-radius: 0;
}
.thumbnail p {
  margin-top: 15px;
  color: #555;
}


.btn {
padding: 10px 20px;
background-color: rgb(5,47,95);
border-color: rgb(5,47,95);
color: #f1f1f1;
border-radius: 3;
transition: .2s;
}
.btn:hover, .btn:focus /*,  .btn:active */ {
    /* border: 0px solid #333; */
    background-color: rgb(5,47,95);
    color: white;
}
.btn:active {
    border: 1px solid #333;
    background-color: rgb(5,47,95);
    color: #f1f1f1;
}

.btn-baseline {
    padding: 10px 20px;
    background-color: white;
    border-color: #000;
    color: rgb(5,47,95);
    border-radius: 3;
    transition: .2s;
}
.btn-baseline:hover{
    background-color: #fff;
    color: rgb(5,47,95);
}

/*
  .modal-header, h4, .close {
      background-color: #333;
      color: #fff !important;
      text-align: center;
      font-size: 30px;
  }
  .modal-header, .modal-body {
      padding: 40px 50px;
  }
  */

.open .dropdown-toggle {
  color: #fff;
  background-color: #555 !important;
}
.dropdown-menu li a {
  color: #000 !important;
}
.dropdown-menu li a:hover {
  background-color: red !important;
}


footer {
  background-color: #f2f2f2;
  padding-bottom: 30px;
}
footer hr{
    margin-top: 0;
    margin-bottom: 10px;
    border: 0;
    border-top: 1px solid #a1a9b8;
}
footer, footer small, footer a {
  text-decoration: none;
  color:#1a385e !important;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}
.form-control {
  border-radius: 0;
}
textarea {
  resize: none;
}

/*
// #myVideo {
// background-color: White ;
// }
*/


#page {
    padding: 110px 0 40px 0;
    background-color: rgb(248,248,248) ;
}
#page .accroche{margin-bottom:10px;}
#page .subTitle{
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 23px;
    margin-bottom: 50px;
}
#page.temoignages .subTitle{ margin-left: 145px; }
#page .blocTemoignage{
  margin-bottom:100px;
}
#page .mikrotext{
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}
#page .imgBorderVert{
  -webkit-box-shadow: 10px -10px 0px 0px rgba(99,182,148,1);
  -moz-box-shadow: 10px -10px 0px 0px rgba(99,182,148,1);
  box-shadow: 10px -10px 0px 0px rgba(99,182,148,1);
}
#page .temoignageImg{
  margin-top: 8px;
}
#page .legende{
  font-size: 13px;
  font-weight: 700;
  margin-top:13px;
}
#page .r, #page .q{
  font-size: 16px;
  font-weight: 400;
}
#page .q{
  margin: 20px 0;
  font-weight: 700
}

#page .btnVert{
    font-size: 13px;
    font-weight: 500 !important;
    margin-right: 10px;
    padding: 12px 35px;
    margin-top:30px;
}

#pitch {
    background-color: rgb(248,248,248);
    padding: 30px 0 60px;
}

.accroche{
  font-weight: 600;
  font-size: 35px;
  font-weight: 600;
  font-size: 40px;
  /* margin-top: 40px; */
  margin-bottom: 40px;
}
.accroche span{ font-weight: 300; font-size: 37px; }
.center{ text-align: center !important; }

.roundedImgHolder{
  text-align: center;
  margin-bottom: 20px;
}
.roundedImgHolder img{
  border-radius: 50%;
  display: inline-block;
  margin: 0 25px;
}

#lesPlus{
  padding: 0px 0 0px 60px;
  background: #f2f2f2;
  background-color: #f2f2f2;
  background-image: linear-gradient(125deg, #f2f2f2 63%, #8f9bac 0%);
}
#lesPlus .h2{
  margin-top: 40px !important;
}
#lesPlus .container .content{
  padding-bottom: 35px;
}
#lesPlus .pictoHolder{
  font-family: 'Lato', sans-serif;
  font-weight: 900;
}
#lesPlus .pictoHolder img{
  display:inline-block;
  width:80%;
}
#lesPlus .pictoHolder div{
    display: inline-block;
    font-size: 19px;
    color: #000;
    font-weight: 500;
    padding:0;
    margin-bottom:5px;
}
/* #lesPlus .pictoHolder div.d-flex{ margin-bottom:10px; } */


#lesPlus .blocBleu{
    background: #1a385e;;
    color: #fff;
    padding: 10px 28px 28px;
    border-radius: 10px;
    text-align: center;
    margin: 60px 0px 0px 0px;
    width: 395px;
    font-family: 'Lato', sans-serif;
}
#lesPlus .blocBleu h3{
  margin-bottom: 25px;
  font-weight: 700;
}

#lesPlus .blocBleu h3 strong{
    font-size: 35px;
    margin-bottom: -5px;
    display: block;
    font-weight: 900;
}
#lesPlus .blocBleu .txt{
    font-size: 18px;
    font-weight: 100;
    color: #a5b5cb;
    font-weight: 300;
}
#lesPlus .blocBleu .txt strong{
  color:#fff;
  font-weight: 700;
}

#demande {
  margin-bottom: 50px;
}
#demande .accroche{
    padding: 40px 0 20px;
    position: relative;
    margin-bottom: 0;
}

#demande #formdemande .mikrotext{
  font-size: 18px;
}

.glyphicon-remove{
  font-size: 23px !important;
  background: #63b694;
  color: #fff;
  padding: 9px;
  border-radius: 50px;
}
#demande .fermeDevisJS{
  display:none;
}
#demande .ouvreDevisJS{
  margin-bottom: 20px;
  font-weight: 400 !important;
}

#demande .accroche .glyphicon-remove{
  position: absolute;
  right:30px;
  top:50%;
  margin-top:-20px;
}

  #demande #montantDevis h1{
    font-size: 21px;
    background: #4fbd9a;
    color: #fff;
    padding: 12px;
    border-radius: 10px;
    margin-bottom: 30px;
    line-height: 1.3;
    text-align:center;
  }

.btnVert{
  border: none;
  border-radius: 35px;
  background: #63b694;
  color: #fff;
  font-family: 'Roboto', sans-serif;;
  font-size: 19px;
  padding: 10px 30px;
  font-weight: 100 !important;
  margin-top: 40px;
  text-decoration: none;
  cursor: pointer;
}
.btnVertBig{
    font-size: 23px;
    padding: 20px 55px;
    font-weight: 300 !important;
    display: inline-block;
}
.btnVert:hover{
  background: rgb(6,214,160);
  text-decoration: none;
  color:#fff;
}


.submitDevis{
  width: 100% !important;
  font-weight: 400 !important;
}

#demande .formDevisContent{
  display:none;
}

#service {
    padding: 20px 0 40px 0;
    background-color: rgb(248,248,248);
}
#service .mikrotext{
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}
#service .visus{
  margin:40px 0;
}
#service .visus img{
    display: inline-block;
    width: 10%;
    box-shadow: 2px 3px 5px rgba(0, 0, 0, .1);
    border-radius: 50%;
    margin: 0 7px;
}
#service .collectons{
  font-family: 'Lato', sans-serif;
  font-weight: 400;
  font-size: 18px;
}
#service .collectons p{
  margin-top:10px;
}
#service .collectons strong{
  font-weight: 900;
}



#service2{
  padding: 40px 0 20px;
}
#service2 .accroche{
    margin-bottom: 40px;
}
#service2 .mikrotext{
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}
#service2 .mikrotext strong{ font-weight: 700; }
#service2 img{
    /* width: 70%; */
    border-radius: 50%;
}

#service2 .fas{
  color: #63b694;
  font-size: 20px;
}
#service2 .blocsHolder{
    margin-top: 40px;
}

.blueBkg{
  background: #1d325a;
}

#service2 .blocB{
    background: #1d325a;
    color: #fff;
    padding: 25px 20px;
    border-radius: 10px;
    text-align: center;
    height:100%;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
}
#service2 .blocB .btnVert{
  font-family: 'Roboto', sans-serif;
  font-size: 13px;
}

#service2 .blocB img{
  /* width:70%; */
  display: inline-block;
  border-radius: 0 !important;
}
#service2 .blocB .blocTxt{
  width:79%;
  display: inline-block;
  font-size: 17px;
  text-align: left;
}
#service2 .blocB .blocTxt .num{
    font-size: 39px;
    font-weight: 400;
}


#service2 .btnVert{
    border-radius: 10px;
    font-size: 15px;
    padding: 7px 0;
    font-weight: 500 !important;
    width: 100%;
    display: block;
    text-align: center;
    margin-top: 13px;
    margin-bottom: 5px;
}


#service2 .small{
  width: 100%;
  display: block;
  text-align: left;
  margin-top: 20px;
  font-size: 13px;
  font-family: 'Lato', sans-serif;
}

#faq{
  padding: 20px 0;
}
#faq h2.accroche{margin-bottom: 50px;}

#faq .panel, #faq .panel-body{
  -webkit-box-shadow: none;
  box-shadow: none;
  border:none;
}

#faq .panel-group .panel-heading {
  border-bottom: 0;
  background: #f2f2f2;
  padding-left: 28px;
  margin-bottom: 10px;
  cursor:pointer;
}
#faq .panel-group .panel-heading.collapsed{
  background: #f8f8f8;
}
#faq .panel-group .panel-heading:hover {
    background: #f2f2f2;
}

#faqAccordion h4 a{
  color: #63b694;
  text-decoration: none;
  font-weight: 400;
  font-family: 'Lato', sans-serif;
}
#faqAccordion h4:hover a{
  /* color: var(--mikro-colorgreen2); */
}

#faqAccordion h4.panel-title a:before{
    width: 12px;
    height: 12px;
    display: block;
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    font-family: "Font Awesome 5 Pro";
    content: "\f078";
    margin-left: -13px;
    margin-right: 25px;
    /* transform: translateY(2px);
    font-size: 20px;
    margin-right: 14px;  */
}

#faqAccordion .collapsed h4.panel-title a:before{
  content: "\f054";
}

#faqAccordion .panel-body {
    padding: 35px 15px;
    font-weight: 400;
    font-size: 17px;
}

#contact {
    /* background-color: white; */
    background-color: #f2f2f2;
    background-image: linear-gradient(0deg, #f2f2f2 75%, #ffffff 0%);
    padding-bottom: 20px;
}

#contact .contactBloc{
  padding: 15px 35px;
}

#contact .contactBloc h2{
  font-size: 25px;
}
#contact form.container{
  width:100%;
  margin-top: 25px;
}

#contact .label{
    text-align: left;
    padding: 0;
    line-height: 2.5;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Lato', sans-serif;
}

#contact .blocNewsletter{
  padding: 10px 0 10px 10px;
}


.blocNewsletter #name{ /* hney pot */
  visibility: hidden;
  height: 0 !important;
  overflow: hidden;
  padding: 0;
}


#contact .blocNewsletter p {
    font-weight: 700;
    font-family: 'Lato', sans-serif;
}
#contact .blocNewsletter form input,
#contact .blocNewsletter form button {
    border: 0;
    height:38px;
    font-size: 14px;
}

#contact .contactBloc ::-webkit-input-placeholder {
  /* WebKit browsers */
   color: transparent !important;
}
#contact .contactBloc :-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
   color: transparent !important;
}
#contact .contactBloc ::-moz-placeholder {
  /* Mozilla Firefox 19+ */
   color: transparent !important;
}
#contact .contactBloc :-ms-input-placeholder {
  /* Internet Explorer 10+ */
   color: transparent !important;
}
#contact .contactBloc input::placeholder {
   color: transparent !important;
}
#contact .contactBloc  textarea::-webkit-input-placeholder {
  /* WebKit browsers */
   color: transparent !important;
}
#contact .contactBloc  textarea:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
   color: transparent !important;
}
#contact .contactBloc  textarea::-moz-placeholder {
  /* Mozilla Firefox 19+ */
   color: transparent !important;
}
#contact .contactBloc  textarea:-ms-input-placeholder {
  /* Internet Explorer 10+ */
   color: transparent !important;
}
#contact .contactBloc  textarea::placeholder {
   color: transparent !important;
}

#contact .submit{
  background-color: #63b694;
  width:100%;
  border-radius: 0;
}
#contact .submit:hover{
  background-color: rgb(6,214,160);
}
#contact .equipeImg{
  -webkit-box-shadow: 20px -20px 0px 0px rgba(99,182,148,1);
  -moz-box-shadow: 20px -20px 0px 0px rgba(99,182,148,1);
  box-shadow: 20px -20px 0px 0px rgba(99,182,148,1);
  margin-bottom: 12px;
}

.breyBkg{
  background-color: rgb(248,248,248);
}



up-arrow {
  color: rgb(5,47,95);
}
.liensSociaux{ float:right; margin-top: 10px; }
.liensSociaux a {margin: 0 7px;  }
.liensSociaux a i{ font-size:20px; }
.liensSociaux a i{ color:rgb(5,47,95); }
.liensSociaux a:hover i{ color:#337ab7; }

optgroup {
    background-color: rgb(5,47,95);
    color: white;
}

option {
    background-color: white;
    color: rgb(5,47,95);
}

.flip {
  -webkit-perspective: 800;
  perspective: 800;
  position: relative;
  text-align: center;
}
.flip .card.flipped {
  -webkit-transform: rotatey(-180deg);
  transform: rotatey(-180deg);
}
.flip .card {
    width: 270px;
    height: 178px;
    -webkit-transform-style: preserve-3d;
    -webkit-transition: 0.5s;
    transform-style: preserve-3d;
    transition: 0.5s;
    background-color: #fff;
}
.flip .card .face {
  -webkit-backface-visibility: hidden ;
  backface-visibility: hidden ;
  z-index: 2;
}
.flip .card .front {
 position: absolute;
 width: 270px;
 z-index: 1;
}
.flip .card .img {
 position:relative;
 width: 270px;
 height: 178px;
 z-index: 1;
 border: 2px solid #000;
}
.flip .card .back {
  padding-top: 10%;
  -webkit-transform: rotatey(-180deg);
  transform: rotatey(-180deg);
}
.inner{margin:0px !important;}

body {
  margin:0;
  padding:0;
  /* background: url(bg2.jpg) no-repeat center fixed; */
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

label.cameraButton {
  display: inline-block;
  margin: 0em 0;

  /* Styles to make it look like a button */
  padding: 0.5em;
  border: 2px solid #666;
  border-color: #EEE #CCC #CCC #EEE;
  background-color: #DDD;
}

/* Look like a clicked/depressed button */
label.cameraButton:active {
  border-color: #CCC #EEE #EEE #CCC;
}

/* This is the part that actually hides the 'Choose file' text box for camera inputs */
label.cameraButton input[accept*="camera"] {
  display: none;
}

.toggle.ios, .toggle-on.ios, .toggle-off.ios {
  border-radius: 40px;
  padding: 10px 40px !important;
}
.toggle.ios .toggle-handle {
  border-radius: 40px;
  background: #fff !important;
}
.toggle.btn, .toggle.btn:hover {
    border-color: rgb(5,47,95) !important;
    padding: 10 20px 24px !important;
}
.toggle-group .btn{
    line-height: 1;
    padding: 8px !important;
}
.toggle-off.btn {
    padding-left: 10px !important;
    border: 1px solid #e6e6e6 !important;
}
.toggle-on.btn {
    padding-right: 10px !important;
    border: 1px solid #062f5f !important;
}

.datepicker table tr td.active:active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .open > .dropdown-toggle.datepicker table tr td.active, .open > .dropdown-toggle.datepicker table tr td.active.highlighted {
    background-color: #FF0000;
    background-image: repeating-linear-gradient(45deg, transparent, transparent 1px, rgba(255,255,255,.9) 1px, rgba(255,255,255,.1) 4px);
    border-color: #285e8e;
}

#overlay {
    background: #ffffff;
    color: #666666;
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 5000;
    top: 0;
    left: 0;
    float: left;
    text-align: center;
    padding-top: 25%;
}

.pointer {
 cursor: pointer;
}

.onlyMobile{ display:none !important; }

@media (max-width: 1200px) {

  #myNavbar .socialMenu{ text-align:center; }
  #myNavbar .socialMenu i {
    color: #5e6769;
    font-size: 22px;
    margin: 5px;
    margin-bottom: 40px;
  }
  .navbar-toggle,
  .navbar-toggle[aria-expanded="false"]{ background-color: #fff !important; }
  .navbar-toggle[aria-expanded="true"]{ background-color: #4fbd9a !important; }
  .navbar-toggle[aria-expanded="true"] .icon-bar{ background-color: #fff !important; }


  .navbar{ min-height: 70px; }

  .navbar-collapse.collapse.in{
    max-height:70vh;
  }
  .navbar-default .navbar-collapse, .navbar-default .navbar-form{
    border: 7px solid rgb(79, 189, 154);
  }

  .navbar .closeBar{
    margin-top: 20px;
    font-size: 19px;
    color: #848484;
  }

  .navbar a.headerBtn {
    float: right;
    height: 100%;
    display: block;
    line-height: 2.2;
    font-size: 22px;
    padding: 13px 19px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    margin-left: -1px;
    color: #ccc;
  }


  .navbar-header{ height:70px; }

  .navbar-toggle {
    margin-right: 0;
    padding: 7px 20px;
    margin-top: 0;
    margin-bottom: 0;
    border: 0;
    border-left: 1px solid transparent;
    border-radius: 0;
    height: 100%;
    display: block;
  }

  .nav.navbar-nav{
    font-family: 'Lato', sans-serif;
    text-transform: uppercase;
    font-weight: 300;
    font-size: 20px;
    text-align: center !important;
    margin-top: 70px;
    border-top: 1px solid #ddd;
    margin-bottom: 40px;
  }
  .nav.navbar-nav>li{
    border-bottom:1px solid #ddd;
  }
  .navbar-default .navbar-toggle{
    border: none;
    border-radius: 0;
  }



}

@media (max-width: 767px) {


  .onlyMobile{ display:block !important; }
  .onlyDesktop{ display:none !important; }

  .w-mobile-100{ width:100% !important; }


  #myNavbar .socialMenu{ text-align:center; }
  #myNavbar .socialMenu i {
    color: #5e6769;
    font-size: 22px;
    margin: 5px;
    margin-bottom: 40px;
  }
  .navbar-toggle,
  .navbar-toggle[aria-expanded="false"]{ background-color: : #fff !important; }
  .navbar-toggle[aria-expanded="true"]{ background-color: #4fbd9a !important; }
  .navbar-toggle[aria-expanded="true"] .icon-bar{ background-color: #fff !important; }


  .navbar{ min-height: 70px; }

  .navbar-collapse.collapse.in{
    max-height:70vh;
  }
  .navbar-default .navbar-collapse, .navbar-default .navbar-form{
    border: 7px solid rgb(79, 189, 154);
  }

  .navbar .closeBar{
    margin-top: 20px;
    font-size: 19px;
    color: #848484;
  }

  .navbar a.headerBtn {
    float: right;
    height: 100%;
    display: block;
    line-height: 2.2;
    font-size: 22px;
    padding: 13px 19px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    margin-left: -1px;
    color: #ccc;
  }


  .navbar-header{ height:70px; }

  .navbar-toggle {
    margin-right: 0;
    padding: 7px 20px;
    margin-top: 0;
    margin-bottom: 0;
    border: 0;
    border-left: 1px solid transparent;
    border-radius: 0;
    height: 100%;
    display: block;
  }

  .nav.navbar-nav{
    font-family: 'Lato', sans-serif;
    text-transform: uppercase;
    font-weight: 300;
    font-size: 20px;
    text-align: center !important;
    margin-top: 70px;
    border-top: 1px solid #ddd;
    margin-bottom: 40px;
  }
  .nav.navbar-nav>li{
    border-bottom:1px solid #ddd;
  }
  .navbar-default .navbar-toggle{
    border: none;
    border-radius: 0;
  }

  .baseline-mobile{
      font-family: 'Roboto', sans-serif;
      font-weight: 900;
      color: white;
      font-size: 27px;
      letter-spacing: 1px;
      margin-bottom: 20px;
  }

  .topHeader .btn-baseline {
      font-size: 16px;
      font-weight: 400 !important;
      padding: 10px 30px;
  }

  #page .subTitle{
    margin-left: 0 !important;
  }
  #page .col-sm-5{
    margin-bottom: 20px !important;
  }
  #page h3{
    font-family: 'Roboto', sans-serif;;
  }


  #page.temoignages .btnsHolder{
    text-align: center;
  }

  #pitch{
    margin-bottom:30px;
    background: #fff;
    padding-bottom: 0;
  }

  #pitch h2.accroche{
    font-size: 23px;
    font-weight: 500;
    margin-top:0;
    margin-bottom: 20px;
  }
  #pitch h2.accroche br{ display:none; }
  #pitch h2.accroche span{
    font-size: 23px;
    font-weight: 500;
  }
  #pitch .roundedImgHolder img {
    width: 27%;
    margin: 0 5px;
  }

  #pitch h2.mikrotext{
    margin-bottom: 20px !important;
    margin-top: 10px !important;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
  }

  #pitch .mikrotext{ font-size: 14px; }
  #pitch .mikrotext br{ display:none; }
  #pitch .mikrotext strong {
    font-weight: bold;
    width: 100%;
    display: block;
    margin-top: 10px;
  }

  #lesPlus{
    background: none;
    padding-left:0;
    padding-right:0;
    background-color: rgb(248,248,248);
  }
  #lesPlus .h2{
    font-size: 30px;
    text-align: center;
    margin-top: 30px !important;
  }
  #lesPlus .row.d-flex.content{ display: block !important; flex: none !important; }
  #lesPlus .row.d-flex.content .col-sm-2{ width: 25%; }
  #lesPlus .row.d-flex.content .col-sm-10{ width: 75%; }
  #lesPlus .pictoHolder{ padding-left: 15px; padding-right: 15px; margin-bottom: 20px; }
  #lesPlus .col-sm-6.text-left{ padding-left: 15px; padding-right: 15px; }
  #lesPlus .pictoHolder img { width: 70%; }
  #lesPlus .col-sm-6.align-self-center{ background:#8f9bac; padding:20px 15px; }
  #lesPlus .blocBleu{
    width:100%;
    width: 100%;
    padding: 8px 12px 28px;
    margin: 15px 0;
  }
  #lesPlus .blocBleu h3{ font-size: 25px; }
  #lesPlus .blocBleu .txt { font-size: 17px; color: #fff; }
  #demande{ margin-bottom: 10px; }
  #demande .accroche {
    padding-top: 0px;
    padding-bottom: 10px;
    position: relative;
    margin-bottom: 0;
    font-size: 23px;
  }
  #demande .accroche span{ font-size: 25px; line-height: 2; }
  #demande .ouvreDevisJS {
    margin-bottom: 20px;
    font-weight: 400 !important;
    margin-top: 10px;
    font-size: 15px;
    padding: 10px 35px;
  }
  #demande .accroche .glyphicon-remove { position: relative; right: 0px; }

  #demande #formdemande .col-form-legend { font-size: 18px; }
  #demande label { padding-right: 0; }

  #demande .selectMobilier select{
    font-size: 14px;
    /* padding: 0; */
    padding-left: 5px;
  }


  #service{ padding: 20px 0 20px 0; }
  #service .accroche{ font-size: 30px; width:100%; }
  #service .accroche span{ font-size: 30px; width:100%; }
  #service .mikrotext{ font-size: 16px; width:100%; }
  #service .visus img { width: 20%; margin: 7px; }
  #service .visus { margin: 20px 0; }
  #service .collectons p { margin-top: 10px; font-size: 14px; }

  #service2 .accroche{
    font-size: 30px;
    width:100%;
    margin-bottom:0;
  }
  #service2 .accroche span{ font-size: 30px; width:100%; }

  #service2 .visuMobile{ margin: 20px auto; }

  #service2 .col-sm-10{ width:100%; }
  #service2 .col-sm-1{ display:none; }
  #service2 .col-sm-7{
      width: 100%;
      padding: 0 15px;
      font-size: 16px;
  }
  #service2 .mikrotext strong {
      font-weight: 700;
      width: 100%;
      display: block;
      font-size: 16px;
  }
  #service2 .blocsHolder .col-sm-1{ display:none; }
  #service2 .blocsHolder .row.d-flex{
    display: block !important;
  }
  #service2 .blocsHolder .d-flex .col-sm-6{ width:100%; margin: 0 0 10px; }

  #faq{
    background: #f8f8f8;
  }

  #faq .accroche, #faq .accroche span{
    font-size: 25px;
    margin-bottom:30px !important;
  }
  #faq .faqContainer{
    padding:0;
  }
  #faq .panel-heading{
    border-radius:0;
  }
  #faq .panel-group .panel-heading {
    border-bottom: 0;
    background: #fff !important;
    padding: 10px 15px !important;
    margin-bottom: 5px !important;
  }
#faq .panel-group .panel-heading,
#faq .panel-group .panel-heading.collapsed,
#faq .panel-group .panel-heading:hover{
  background: #fff;
}




  #faqAccordion h4 a,
  #faqAccordion h4.panel-title a{
      /* font-weight: 300 !important; */
  }
  #faqAccordion h4.panel-title a:before{
    margin-left:-6px;
    margin-right: 10px;
  }
  #faqAccordion .panel-body {
      padding: 10px 15px;
      font-weight: 400;
      font-size: 16px;
      padding-left: 33px;
      font-weight: 300;
  }
  #faqAccordion h4.panel-title a:before {
      margin-left: -6px;
      margin-right: 10px;
      font-size: 12px;
      transform: translateY(-1px);
  }

  #contact .contactBloc {
      padding: 15px;
  }
  #contact #formdemande{  }
  #contact #formdemande .row{  }
  #contact #formdemande .col-sm-2.label{
    width: 22%;
    display: inline-block;
    font-size:13px;
    font-weight:400;
  }
  #contact #formdemande .col-sm-10.form-group{
      width: 76%;
      display: inline-block;
      margin: 0;
      padding: 0;
  }

  #contact .equipeImgHolder{ padding:20px 20px 0 10px !important; }

  #contact .blocNewsletter { padding: 15px; }

}






/*
.selectwrap{position: relative;float: left;}
.selectwrap:after{
  text-align: center;
  position: absolute;
  width: 30px;
  height: 34px;
  background: #e6e6e6;
  right: 1px;
  top: 1px;
  pointer-events: none;
  border-left: 1px solid #ccc;
  color: #1a385e;
  font-weight: 900;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 2.2;
  font-family: "Font Awesome 5 Pro";
  content: "\f078";
}
#tableau_produits .selectwrap:after{
  line-height: 1.9;
}
*/

@media (max-width: 321px) {


  body{
    overflow-x: hidden;
    width: 100%;
  }

  .navbar-brand img{
    height: 50px !important;
    margin-top: 10px;
  }


  .topHeader .btn-baseline {
    padding: 10px 12px !important;
  }

  #demande .accroche{ font-size: 20px; }
  #demande .accroche span{ font-size: 23px; }
  #demande .ouvreDevisJS {
    font-size: 17px;
    padding: 10px 15px;
  }

  .datepicker-dropdown { margin-left:-41px; }
  .datepicker-dropdown:before,
  .datepicker-dropdown:after{ left:50% !important; }

  .submitDevis{
    font-size: 18px;
    text-align: center;
    padding: 10px 0;
  }

  .blocTemoignage h2{
    font-size: 27px !important;
  }

  .blocTemoignage .btnVertBig{
    font-size: 18px !important;
  }
  #page .btnVert{ margin-top: 10px !important; }

  #service .visus img {
    width: 29% !important;
    margin: 7px 15px !important;
  }

  footer .container{ text-align: center; }
  footer hr, footer .liensSociaux, footer span{ width:100%; text-align: center }
  footer .liensSociaux{ margin-bottom: 15px; }


}