@font-face {
	font-family: "raleway";
	src: url(../includes/font/Raleway-Regular.ttf);
}
@font-face {
	font-family: "raleway-semibold";
	src: url(../includes/font/Raleway-SemiBold.ttf);

}
@font-face {
	font-family: "raleway-light";
	font-weight: lighter;
	src: url(../includes/font/Raleway-Light.ttf);
}
@font-face {
	font-family: "raleway-medium";
	src: url(../includes/font/Raleway-Medium.ttf);
}
@font-face {
	font-family: "raleway-bold";
	src: url(../includes/font/Raleway-Bold.ttf);
    font-weight: bold;
}
h1{
    font-size: 3.5rem;
    font-family: "raleway-medium";
    color: #404040;
}
h2{
    font-size: 3.2rem;
    font-family: "raleway-medium";
     color: #404040;
}

h3{
    font-size: 3.4rem;
    font-family: "raleway-medium";
    color: #666666;
}
html, body{font-size:62.5%}

body{
    font-family: "raleway";
    background-color: #eeedeb;
  padding-right: 0px !important;
    
}
.modal-open {
    padding-right: 0px !important;
}
.container-fluid {
   background-color: #eeedeb;
}



.admin{
    background-color: #343434;
    height: 30px;


}

.espace {
    position: absolute;
    right: 0;
    z-index: 999;
    margin-right: 10%;
   

}
.espace .btn {
    font-size: 1.5rem !important;
    position: relative;
    font-family: "raleway-medium";
    border-radius: 1px !important;
    box-shadow: 1px 1px 2px 2px  rgba(3, 3, 3, 0.5);
}
.btn {
    border-radius: 1px !important;
}
.admin .btn {
    font-size: 1.3rem !important;
    position: relative;
    font-family: "raleway-medium";
    border-radius: 1px !important;
}
.btn-primary {
    color: #fff;
    background-color: #bd9027 !important;
    border-color: #bd9027 !important;
    float: right;
    margin-right: 15%;

}
.gamme .btn-primary {
    color: #fff;
    background-color: #bd9027 !important;
    padding-top: 6px;
    padding-bottom: 7px;
    font-size: 1.2rem;

}

.btn-primary:hover {
    background-color:#fff !important;
    border-color: #fff !important;
    color: #bd9027 !important;

}


/************* PICTO ************/
.picto{
    text-align: center;
    margin-bottom: 20px;
    margin-top: -65px}


.picto h1{
    font-size: 1.5rem;
    font-family: "raleway";
    color: #747474;
    margin-bottom: 15px;
    text-transform: uppercase;

    
    
}


.picto1{

        background-color:#fff;
        z-index: 999;
        box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.1);
        width: 80px;
        margin: auto;

}

.picto1 img{
        width: 100%
}

.picto2{

  background-color:#fff;
    z-index: 999;
    box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.1);
    width: 80px;
    margin: auto;

}

.picto2 img{
width: 100%
}

.picto3{

  background-color:#fff;
    z-index: 999;
    box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.1);
    width: 80px;
    margin: auto;

}

.picto3 img{
width: 100%
}

/************* FIN PICTO************/

.fond{
    background-color: #fff;
    height: 80px;
    position: absolute;
    box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.1);
}

/*************  MENU   ************/ 
.menu{
    background-color:#fff;
    z-index: 3;
    box-shadow:2px 2px 2px 1px rgba(0, 0, 0, 0.1);
    position: relative;
}
.menu a{
    color: #191919;
    font-size: 1.4rem;
    font-family: "raleway";
    padding-bottom: 20px !important;
    text-transform: uppercase;
}

.menu ul li a:hover{
    text-decoration: none;
    color: #daa83b;
    font-family: "raleway-semibold";
}
.menu ul li a:focus{
    text-decoration: none;
     color: #daa83b;
}
.menu li{
    margin-bottom: 20px;
}



.menu img{
     margin-top: -15px;
    margin-left: -6%;
        box-shadow: 0px 3px 4px 3px  rgba(0, 0, 0, 0.1);
}
.navbar-nav {
    float: right;
}
.navbar-light .navbar-toggler {
    border-color: rgba(0,0,0,.1);
    margin-top: 20px;
}

/*************  FIN MENU   ************/ 



/**************** VISUEL *************/

.visuel{

    background-image: url(../images/site-plein_champ.png);
    width: 100%;
    height: 590px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center ;
}



/**************** FIN VISUEL *************/

/**************** PRESENTATION *************/

.cross {
  background-color: #daa83b;
  height: 55px;
  position: relative;
  width: 11px;
  margin-left: 5%;
  margin-left: 5%;
}
.cross:after {
background-color: #daa83b;
  content: "";
  height: 11px;
  position: absolute;
  width: 55px;
}
          


.presentation{
    margin-top: 50px;
    margin-bottom: 5%;
    font-family: "raleway-medium";
}
.presentation1{
    background-color:#fff; 
    margin-left: 7%;
    margin-right: 7%;
    padding-top: 6%;
    padding-bottom: 6%;
    margin-bottom: 4%;
}
.presentation1 h1{
  font-size: 4.3rem;
    letter-spacing: 2px;
    color: #545454;
font-family: "raleway-bold";
    margin-top: -1%;
}

.presentation1 p{
    margin-left: 10%;
    margin-right: 10%;
    font-size: 1.7rem;
    color: #797979;
    margin-top: 5%;

}

.presentation1 strong{
    color: #484848;

}

.presentation1 h1{
    margin-left: 10%;
    margin-right: 10%;
    margin-bottom: 6%;
}

.presentation2{
    margin-right: 7%;
    margin-left: 7%;
}

.presentation2 p{
  font-size: 3rem;
    margin-right: 10%;
      margin-left: 10%;
    color: #545454;
	font-family: "raleway-semibold";
    margin-top: 2%;
      margin-bottom: 6%;
}

.presentation_photo{
    background-size: cover;
    background-image: url(../images/presentation-viseul.png);
    background-position: center;
    background-repeat: no-repeat;
    height: 400px;
    width: 100%;
}
.presentation_btn{
    text-align: center;
    margin: auto;
    background-color: #fff;
    padding-top: 2%;
    padding-bottom: 7%;
    margin-top: 5%;
    
}



.cliquez-ici{
    background-color: #daa83b;
    padding-top: 2%;
    padding-bottom: 2%;
    padding-right: 10%;
    padding-left: 10%;    
    transition: all 0.3s ease 0s;
    
}

.cliquez-ici:hover {
     background-color: #404040;
}
.presentation_btn a{
    text-decoration: none !important; 
    color: #fff;
    font-size: 2rem;
  font-family: "raleway-medium";
}
.presentation_btn a:hover{
    text-decoration: none !important; 
    color: #fff;
}
.presentation_btn a:focus{
    text-decoration: none !important; 
    color: #fff;
}
/**************** FIN PRESENTATION *************/

/**************** PRESENTATION *************/


/**************  GALLERIE ***************/
.gallerie {
    text-align: center;
    margin: auto;
    display: block;
    margin-top: 15px;
    

    
}
.gallerie img{
width: 100%;



}
.gallerie em{
    text-align: center;
    margin: auto;
    display: block;
    font-style: normal;
    color: #646464;
    font-size: 1rem;
    letter-spacing: 4px;
    font-family: "raleway";
    margin-bottom: 5%;
}

.gallerie h1{
    font-size:3rem;
    font-family: "raleway-medium";
    color: #404040;
        margin-top: 50px;
    margin-bottom: 9px;
    letter-spacing: 6px;
}
.picture_left {
    height: 170px;
    width: 100%;
    overflow: hidden;
      margin-top: 15px;
}

.picture_right {
    height: 170px;
  margin-top: 15px;
    width: 100%;
    overflow: hidden;
}
.picture_left2 {
    height: 170px;
    width: 100%;
    overflow: hidden;
    
}


.picture_left3 {
    height: 170px;
    width: 100%;
    overflow: hidden;
    
}

.picture_right3 {
    height: 170px;
    width: 100%;
    overflow: hidden;
      margin-top: 15px;
}

.gallerie4{
    margin-top: 10px;
    height: 170px;
    width: 100%;
     overflow: hidden;
      margin-top: 15px;
     
}
.gallerie3{
   margin-top: 2%;
    height: 170px;
    width: 100%;
    overflow: hidden;
      margin-top: 15px;
}

/*************  FIN GALLERIE ************/



/************* GALLERIE TEXTES ************/
.titre-gallerie h3{
    font-size: 3.4rem;
	font-family: "raleway-medium";
    color: #fff;
    margin-top: 3%;
    margin-left: 3%;
    text-align: left;
}

.picture_right {
    display: inline-block;
    position: relative;
}

.picture_right:hover .titre-gallerie {
        opacity: 1;
    }

.picture_right .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.titre-gallerie h3{
    font-size: 3.4rem;
	font-family: "raleway-medium";
    color: #fff;
    margin-top: 3%;
    margin-left: 3%;
    text-align: left;
}

.picture_left {
    display: inline-block;
    position: relative;
}

.picture_left:hover .titre-gallerie {
        opacity: 1;
    }

.picture_left .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.picture_left2 {
    display: inline-block;
    position: relative;
}

.picture_left2:hover .titre-gallerie {
        opacity: 1;
    }

.picture_left2 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height:300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.picture_left3 {
    display: inline-block;
    position: relative;
}

.picture_left3:hover .titre-gallerie {
        opacity: 1;
    }

.picture_left3 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height:300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.picture_right3{
    display: inline-block;
    position: relative;
}

.picture_right3:hover .titre-gallerie {
        opacity: 1;
    }

.picture_right3 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}


.gallerie3{
    display: inline-block;
    position: relative;
}

.gallerie3:hover .titre-gallerie {
        opacity: 1;
    }

.gallerie3 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.gallerie4{
    display: inline-block;
    position: relative;
}

.gallerie4:hover .titre-gallerie {
        opacity: 1;
    }

.gallerie4 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}


/************* FIN GALLERIE TEXTES ************/


/************* FOOTER ************/
.footer {
    margin-top: 5%;
    padding-top: 3%;
    padding-bottom: 3%;
    color: #fff;
    background-color: #343434;
    font-family: "raleway";
    border-top: solid 2px #daa83b;
    text-decoration: none;
    list-style: none;
    clear: both;

}
.footer li{
    text-decoration: none;
    list-style: none;

}

.footer a{
    color: #fff;
    font-family: "raleway";
    text-decoration: none;
    text-transform: none;
}
.footer a:hover{
    color: #cccccc;
    font-family: "raleway";
    text-decoration: none;
    text-transform: none;
}
.footer a:focus{
    color: #cccccc;
    font-family: "raleway";
    text-decoration: none;
    text-transform: none;
}



.widget1{
    text-decoration: none;
    list-style: none;

}
.widget1 h5{
font-size: 1.9rem;
    margin-left: 4%;

}

.widget1 li{
font-size: 1.1rem;
    margin-left: 4%;
    

}
.widget3 h5{
font-size: 1.9rem;

}
.widget2 {

margin-top: 4%;
}
.widget3 {
margin-left: 4%;
margin-top: 4%;
}

.widget2{
    text-decoration: none;
    list-style: none;

}
.widget2 h5{
font-size: 1.9rem;
    margin-left: 4%;

}

.widget2 li{
font-size: 1.1rem;
    margin-left: 4%;

}


/************* FIN FOOTER ************/
.contenu {
    margin-top: 75px;
    margin-bottom: 5%;
    background-color:#fff; 
    padding-bottom: 2%;
    padding-top: 2%;
	font-size: 1.6rem;
	padding:2%;

}
.contenu  h1{
    margin-bottom: 30px;
    font-size: 2.8rem;
    font-family: "raleway-medium";
    color: #525252;
    margin-left: 2%;
    margin-right: 2%;
    text-align: center;
}

.contenu  h3{
    margin-bottom: 2%;
    font-size: 2.3rem;
    font-family: "raleway-semibold";
    color: #525252;
        margin-left: 2%;
    margin-right: 2%;
}
.contenu  h2{
    margin-bottom: 2%;
    font-size: 2.3rem;
    font-family: "raleway-semibold";
    color: #525252;
        margin-left: 2%;
    margin-right: 2%;
}


.contenu  p{
    font-size: 1.3rem;
    font-family: "raleway";
    color: #525252;
    margin-left: 2%;
    margin-right: 2%;
}
.contenu  img{
    margin-bottom: 1%;
    margin-right: 1%;
}


.texte-gamme {
    font-size: 1.4rem;
    background-color:#fff; 
    margin-right: 0%;
    padding-bottom: 2%;
    margin-bottom: 0%;
    margin-top: 3%;

}
.texte-gamme p{
       margin-left: 1%;
       margin-right:1%;
    margin-top: 2%;
    }
.gamme {
    margin-top: 60px;
    margin-bottom: 4%;

}
.gamme h1{
    font-size:30px;
    font-family: "raleway-medium";
    color: #404040;
        margin-top: 5px;
    margin-bottom: 50px;
    letter-spacing: 6px;
}


.gamme h2{
    margin-bottom: 2%;
    font-size: 2.5rem;
    font-family: "raleway-semibold";
    color: #525252;
}

.gamme h3{
    margin-bottom: 2%;
    font-size: 2.3rem;
    font-family: "raleway-semibold";
    color: #525252;
}


.gamme p{
    font-size: 1.5rem;
    font-family: "raleway";
    color: #525252;
}
.gamme2 {
    margin-top: 4%;

}
.marque {
   margin-left: 4%;
    margin-top: 5%;

}
.btn-info {
    color: #fff;
    background-color: #bd9027 !important;
    border-color: #bd9027 !important;}

.btn-info:hover {
    color: #fff;
    background-color: #404040 !important;
    border-color: #404040 !important;
    
}


.btn-xs, .btn-group-xs>.btn {
    background-color: #daa83b;
    color:#fff;
    border-radius: 5px !important;
    margin-left: 1%;
}
.btn-xs:hover, .btn-group-xs>.btn:hover {
    background-color: #daa83b;
    color:#fff;
}
.btn-xs:focus, .btn-group-xs>.btn:focus {
    background-color: #daa83b;
    color:#fff;
}
.btn-xs, .btn-group-xs>.btn {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.type-gamme{
    margin-top: 2%;


}

.type-gamme .btn{
    margin-top: 10px;


}

.type-gamme .btn-xs, .type-gamme .btn-group-xs>.btn {
    background-color: #404040;
    color:#fff;
    border-radius: 5px !important;
    margin-left: 1%;
}
.type-gamme .btn-xs:hover, .type-gamme .btn-group-xs>.btn:hover {
    background-color: #404040;
    color:#fff;      
}
.type-gamme .btn-xs:focus, .type-gamme .btn-group-xs>.btn:focus {
    background-color: #404040;
    color:#fff;
}

td{
    font-size: 1rem;
    font-family: "raleway";
    

}
td span{
    font-size: 1.3rem;
 font-family: "raleway-bold";
    color: #daa83b;

}
th{
    font-size: 1.1rem;
    color: #525252;
    font-family: "raleway-semibold";
}
.gamme2{
    background-color:#fff; 
    margin-right: 0%;
    padding-top:4%;
    padding-bottom: 80px;
}

.gamme2 h2{
    margin-left: 5%;
    letter-spacing: 2px;
    color: #545454;
	font-family: "raleway-bold";
}
.gamme2 h3{
    margin-left: 5%;
    letter-spacing: 2px;
    color: #545454;
	font-family: "raleway-bold";

}

.gamme2 p{
    margin-left: 5%;
    margin-right: 10%;
    font-size: 1.4rem;
    line-height: 26px;
    color: #797979;
    margin-top: 5%;

}

.catalogue_titre {
    margin-top: 0;
    margin-bottom: 4%;
    text-align: center;
    
}
.catalogue_titre h1{
    font-size: 3.5rem;
    font-family: "raleway-medium";
    color: #404040;
}

.catalogue_picture {
    margin-top: 5%;
    background-color: #fff;
	margin-right:1%;
}
.catalogue_picture2 {
    height: 176px;
    overflow: hidden;

}
.titre-catalogue{
	padding:1%;
	color: #404040!important;
    font-size: 1.2rem;
}
.titre-catalogue h2{
    font-size: 1.8rem;
    font-family: "raleway-semibold";
    color: #404040;
    margin-top: 2%;
    margin-left: 1%!important;
   
}
.titre-catalogue h3{
    font-size: 1.7rem!important;
    font-family: "raleway-semibold";
    color: #404040;
    margin-top: 2%;
    margin-left: 1%!important;
   
}
.titre-catalogue p{
    font-size: 1.6rem;
    font-family: "raleway";
    color: #404040!important;
    margin-left: 1%!important;
    margin-top: 3%;
    margin-right: 4%;
    padding-bottom: 3%;
}

.catalogue_picture img {
	height:250px;
	width:280px!important;
}

.catalogue_picture h2{
	color:#404040!important;
}

.catalogue_picture .titre-catalogue {

}

.plus-info{
    background-color: #daa83b;
    padding-top: 2%;
    padding-bottom: 2%;
    padding-right: 7%;
    padding-left: 7%;    
    transition: all 0.3s ease 0s;
    
}

.plus-info:hover {
     background-color: #404040;
}
.catalogue_btn {
float: right;
    margin-right: 5%;
    width: 300px;
}
.catalogue_btn a{
    text-decoration: none !important; 
    color: #fff;
    font-size: 1.2rem;
  font-family: "raleway-medium";
    margin-right: 2%;
    float: right;
}
.catalogue_btn a:hover{
    text-decoration: none !important; 
    color: #fff;
}
.catalogue_btn a:focus{
    text-decoration: none !important; 
    color: #fff;
}
    
    .contact{
    margin-top:70px !important;
    
    }
form.formulaire {
    font-size: 1.4rem;
    font-weight: 500;
    color: #979797;
    font-weight: lighter;

}
form.formulaire label{
    font-weight: normal;

}

form-group input{
    color: #343434;
    padding-left:3px;
    outline-color: #bd9027 !important;
    

}

form.formulaire input{
    color: #343434;
    padding-left:3px;
    outline-color: #bd9027 !important;
    width: 250px !important;
    

}
form.formulaire input#submit {
    color: #fff;
    padding-top: 1%;
    padding-bottom: 1%;
    padding-right: 5%;
    padding-left: 4%;
    transition: all 0.3s ease 0s;
    font-size: 1.7rem;
}
form.formulaire input#submit {
    color: #fff;
    padding-top: 1%;
    padding-bottom: 1%;
    padding-right: 5%;
    padding-left: 4%;
    transition: all 0.3s ease 0s;
    font-size: 1.7rem;
}
form {
  margin: 2% auto;
  padding: 1em;
  padding-bottom: 2%;
  color: #aaa;
  background-color: #fff;
  padding-left: 47px !important;
  padding-top: 25px !important;
  box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.1);    
}
.name {width: 100%;}
.name input,
.submit input,
select,
textarea {
color: #454545;
  width: 80%;
  margin-top: 5%;    
  height: 3em;
  text-indent: .5em;
  border: .1em solid #ddd;
  outline-color: #bd9027 !important;
max-height: 200px;
    
}

textarea {
font-size: 1.6rem;
min-height:  100px;
    
}
.name input[name="surname"] {float: right;}
.name input[type="mail"] {
  margin-top: 1em;
  width: 200%;
}
.radio,
.dropdown,
.message,
.check,
.submit {margin-top: 1em;}
.dropdown select,
.message textarea,
.submit input {width: 100%;}
.dropdown select {color: #aaa;}
.message textarea {height: 8em;}
.radio input,
.check input {position: relative;top: 1px;}
.radio input:before,
.check input:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1em;
  background: #e9e9e9;
  transition: all .35s ease;
}
.radio input:before {
  border-radius: 50%;
}
.radio input:checked:before {
  top: -.1em;
  left: -.1em;
  width: .5em;
  height: .5em;
  border: .35em solid #e9e9e9;
  background: #1abc9c;
}
.check input:before {left:-.1px;}


.formulaire_btn{
    text-align: center;
    margin: auto;
    background-color: #fff;
   margin-top: 5%;
    margin-bottom: 3%;
}

.formulaire .btn-primary:hover {
    background-color:#343434 !important;
    border-color: #343434 !important;
    color: #fff !important;

}
.formulaire .btn-primary {
     margin-top: 10px

}

.formulaire_btn a{
    text-decoration: none !important; 
    color: #fff;
    font-size: 1.6rem;
  font-family: "raleway-medium";
}
.formulaire_btn a:hover{
    text-decoration: none !important; 
    color: #fff;
}
.formulaire_btn a:focus{
    text-decoration: none !important; 
    color: #fff;
}
 .form-group {
    margin-bottom: 1rem;
     margin-right: 41px;
 
 }   
.form-control{
outline-color: #bd9027 !important;
}
@media screen and (min-width: 576px) {
    form.formulaire input{
    color: #343434;
    padding-left:3px;
    outline-color: #bd9027 !important;
    width: 250px !important;
    

    }
    .menu img{
     margin-top: -15px;
    margin-left: 20px;
}
    .contact{
    margin-top: 10%;
    
    }
form {
  margin: 2% auto;
  padding: 1em;
  padding-bottom: 2%;
  width: 80%;
  color: #aaa;
  background-color: #fff;
  border: .1em solid #ddd;
}
.name {width: 100%;}
.name input,
.submit input,
select,
textarea {
  width: 90%;
  margin-top: 5%;    
  height: 3em;
  text-indent: .5em;
  border: .1em solid #ddd;
  outline-color: #bd9027 !important;
max-height: 200px;
}
.name input[name="surname"] {float: right;}
.name input[type="mail"] {
  margin-top: 1em;
  width: 100%;
}
.radio,
.dropdown,
.message,
.check,
.submit {margin-top: 1em;}
.dropdown select,
.message textarea,
.submit input {width: 100%;}
.dropdown select {color: #aaa;}
.message textarea {height: 8em;}
.radio input,
.check input {position: relative;top: 1px;}
.radio input:before,
.check input:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1em;
  background: #e9e9e9;
  transition: all .35s ease;
}
.radio input:before {
  border-radius: 50%;
}


.check input:before {left:-.1px;}


.formulaire_btn{
    text-align: center;
    margin: auto;
    background-color: #fff;
   margin-top: 5%;
    margin-bottom: 3%;
}



.formulaire_btn a{
    text-decoration: none !important; 
    color: #fff;
    font-size: 1.6rem;
  font-family: "raleway-medium";
}
.formulaire_btn a:hover{
    text-decoration: none !important; 
    color: #fff;
}
.formulaire_btn a:focus{
    text-decoration: none !important; 
    color: #fff;
}
    
       .widget3 {
margin-left: 0%;
margin-top: 0%;
} 
        .widget2 {
margin-left: 0%;
margin-top: 0%;
} 
 .picto{
    text-align: center;
}


.picto h1{
font-size: 2rem;
    font-family: "raleway";
    color: #747474;
   text-transform: uppercase;
    
    
}


.picto1{

  background-color:#fff;
    z-index: 999;
    box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.2);
    width: 130px;
    margin: auto;

}

.picto1 img{
width: 100%
}

.picto2{

  background-color:#fff;
    z-index: 999;
    box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.2);
    width: 130px;
    margin: auto;

}

.picto2 img{
width: 100%
}

.picto3{

  background-color:#fff;
    z-index: 999;
    box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.2);
    width: 130px;
    margin: auto;

}

.picto3 img{
width: 100%
}   
   
#contenu, #texte{
	font-size:1.6rem;
}

}
@media screen and (min-width: 768px) {
    .gamme h1{
    font-size:45px;
    font-family: "raleway-medium";
    color: #404040;
        margin-top: 40px;
    margin-bottom: 60px;
    letter-spacing: 6px;
    text-align: center;
}
   
.catalogue_picture {
    margin-top: 5%;
    width: 49%!important;
    background-color: #fff;
	margin-right:1%;
}
.catalogue_picture2 {
    height: 250px;
    overflow: hidden;
    width: 100%;
}
    
.catalogue_titre {
    margin-top: 0;
    margin-bottom: 4%;
    text-align: center;
    
}
.catalogue_titre h1{
    font-size: 3.5rem;
    font-family: "raleway-medium";
    color: #404040;
}

.catalogue_picture {
    height: 250px;
    overflow: hidden;
    width: 100%;
}

.titre-catalogue h3{
    font-size: 2.3rem;
    font-family: "raleway-semibold";
    color: #404040;
     margin-top: 4%;
    margin-left: 4%;
   
}
.titre-catalogue p{
    font-size: 1.3rem;
    font-family: "raleway";
    color: #404040;
    margin-left: 4%;
     margin-top: 2%;
    margin-right: 4%;
}

.catalogue_picture img {
    width: 100%;

}

.catalogue_picture{
    display: inline-block;
    position: relative;
}

.catalogue_picture .titre-catalogue {
    color: #FFF;
    width: 50%;
    height: 250px;
    background-color: #fff;
    margin: 0 auto;
    top: 0;
    opacity: 1;
    right: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}    
    
    
    
.gallerie img{
width: 140%;



}

.presentation{
    margin-top: 50px;
    margin-bottom: 5%;
    font-family: "raleway-medium";
}
.presentation1{
    background-color:#fff; 
    margin-left: 4%;
    margin-right: 0%;
    padding-top: 6%;
    padding-bottom: 9%;
    margin-bottom: 0%;
    height: 875px;
    overflow: hidden;
}
.presentation1 h1{
  font-size: 2.5vw;
    letter-spacing: 2px;
    color: #545454;
font-family: "raleway-bold";
    margin-top: -1%;
}

.presentation1 p{
    margin-left: 10%;
    margin-right: 10%;
    font-size: 1.5rem;
    line-height: 26px;
    color: #797979;
    margin-top: 20px;

}
.presentation2{
    margin-right: 4%;
    margin-left: 0%;
    height: 875px;
    overflow: hidden;
}

.presentation2 p{
  font-size: 2.6rem;
    margin-right: 10%;
      margin-left: 10%;
    color: #545454;
	font-family: "raleway-semibold";
    margin-top: 30px;
      margin-bottom: 5%;
}

.presentation_photo{
    background-size: cover;
    background-image: url(../images/presentation-viseul.png);
    background-repeat: no-repeat;
    width: 100%;
    height: 645px;
}
.presentation_btn{
    text-align: center;
    margin: auto;
    background-color: #fff;
    padding-top: 1%;
    padding-bottom: 10%;
    margin-top: 35px;
    height: 200px;
    
}




.cliquez-ici{
    background-color: #daa83b;
    padding-top: 2%;
    padding-bottom: 2%;
    padding-right: 10%;
    padding-left: 10%;    
    transition: all 0.3s ease 0s;
    
}

.cliquez-ici:hover {
     background-color: #404040;
}
.presentation_btn a{
    text-decoration: none !important; 
    color: #fff;
    font-size: 1.6rem;
  font-family: "raleway-medium";
}
.presentation_btn a:hover{
    text-decoration: none !important; 
    color: #fff;
}
.presentation_btn a:focus{
    text-decoration: none !important; 
    color: #fff;
}
    
.picture_left {
    height: 330px;
    width: 100%;

}

.picture_right {
    height: 330px;
    margin-left: -20px;
width: 100%;
}
.picture_left2 {
    height: 470px;
    width: 100%;
}

.picture_right2 {
    height: 470px;
    width: 100%;
     margin-left: -10px;
}


.picture_left3 {
    height: 300px;
    width: 100%;
    
}

.picture_right3 {
    height: 300px;
    width: 100%;
     margin-left: -20px;
    margin-top: 0%;
}
    
.gallerie3{
   margin-top: 0%;
height: 240px;
    width: 100%;
        
} 
  
    .gallerie4{
    margin-top: 20px;
    height: 218px;
    width: 100%;
     overflow: hidden;
     
}
.gallerie3{
    height: 228px;
    width: 100%;
    overflow: hidden;
}
   
    .picture_right {
    display: inline-block;
    position: relative;
}

.picture_right:hover .titre-gallerie {
        opacity: 1;
    }

.picture_right .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 350px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.titre-gallerie h3{
    font-size: 3.4rem;
	font-family: "raleway-medium";
    color: #fff;
    margin-top: 3%;
    margin-left: 3%;
    text-align: left;
}

.picture_left {
    display: inline-block;
    position: relative;
}

.picture_left:hover .titre-gallerie {
        opacity: 1;
    }

.picture_left .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 350px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.picture_left2 {
    display: inline-block;
    position: relative;
}

.picture_left2:hover .titre-gallerie {
        opacity: 1;
    }

.picture_left2 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height:480px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.picture_left3 {
    display: inline-block;
    position: relative;
}

.picture_left3:hover .titre-gallerie {
        opacity: 1;
    }

.picture_left3 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height:300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.picture_right3{
    display: inline-block;
    position: relative;
}

.picture_right3:hover .titre-gallerie {
        opacity: 1;
    }

.picture_right3 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 300px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}


.gallerie3{
    display: inline-block;
    position: relative;
}

.gallerie3:hover .titre-gallerie {
        opacity: 1;
    }

.gallerie3 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 240px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
.gallerie4{
    display: inline-block;
    position: relative;
}

.gallerie4:hover .titre-gallerie {
        opacity: 1;
    }

.gallerie4 .titre-gallerie {
    color: #FFF;
    width: 100%;
    height: 220px;
    background: rgba(0, 0, 0, 0.5);
    margin: 0 auto;
    top: 0;
    opacity: 0;
    display: block;
    position: absolute;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
}
    
    
 .picto{
    text-align: center;
    
}


.picto h1{
font-size: 2rem;
     text-transform: uppercase;
    font-family: "raleway";
    color: #747474;

    
    
}


.picto1{

  background-color:#fff;
    z-index: 999;
    box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.2);
    width: 150px;
    margin: auto;

}

.picto1 img{
width: 100%
}

.picto2{

  background-color:#fff;
    z-index: 999;
    box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.2);
    width: 150px;
    margin: auto;

}

.picto2 img{
width: 100%
}

.picto3{

  background-color:#fff;
    z-index: 999;
    box-shadow: 1px 1px 2px 2px  rgba(0, 0, 0, 0.2);
    width: 150px;
    margin: auto;

}

.picto3 img{
width: 100%
}   
    
.gamme2 {
margin-top: 0%;

} 
td{
    font-size: 1.4rem;
    font-family: "raleway";

}
td span{
    font-size: 1.6rem;
 font-family: "raleway-bold";
    color: #daa83b;

}
th{
    font-size: 1.5rem;
    color: #525252;
    font-family: "raleway-semibold";
}
    
}

@media screen and (min-width: 576px) {

       .widget3 {
margin-left: 0%;
margin-top: 0%;
}    
   
    
}




@media screen and (min-width: 992px) {
 .gallerie em{
    text-align: center;
    margin: auto;
    display: block;
    font-style: normal;
    color: #646464;
    font-size: 0.9vw;
    letter-spacing: 4px;
    font-family: "raleway";
    margin-bottom: 5%;
}

.gallerie h1{
    font-size:3.5vw;
    font-family: "raleway-medium";
    color: #404040;
        margin-top: 50px;
    margin-bottom: 9px;
    letter-spacing: 6px;
}

    .menu{
    height: 60px;
    
    }
.menu ul li a:hover{
    text-decoration: none;
    border-bottom: solid 2px #daa83b;
    font-family: "raleway";
}
.menu ul li a:focus{
    text-decoration: none;
    border-bottom: solid 2px #daa83b;
}
.menu li{
    margin-left: 40px;
    margin-bottom: 0%;
}
    
.visuel{

    background-image: url(../images/site-plein_champ.png);
    width: 100%;
    height: 50vw;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

 .presentation1{
    background-color:#fff; 
    margin-left: 4%;
    margin-right: 0%;
    padding-top: 6%;
    padding-bottom: 9%;
    margin-bottom: 0%;
    height: 750px;
    overflow: hidden;
}

.presentation2{
    margin-right: 4%;
    margin-left: 0%;
    height: 750px;
    overflow: hidden;
}   
    
.presentation_photo{
     height: 490px;
    
    }    
.presentation_btn {
    height: 230px;
    } 
.presentation2 p {
    margin-top: 50px;  
    }
}

@media screen and (min-width: 1280px) {

	.gallerie3 h1{
	font-size:120px;
			
	}
	.gallerie3 em{
	font-size:120px;
			
	}


}

.row label
{
	width: 150px;
}

form .row
{
	margin-bottom: 15px;
}

.center
{
	text-align: center;
	margin: 0 auto;
}




@media screen and (max-height: 575px){
    #rc-imageselect,
    .g-recaptcha {
        transform:scale(0.77);
        transform-origin:0;
        transform:scale(0.77);
        transform-origin:0 0;
        -webkit-transform:scale(0.77);
        transform:scale(0.77);
        -webkit-transform-origin:0 0;
        transform-origin:0 0;
    }
}