/* 
    Author     : Servlinks Communication
*/



body, html {
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5 {
    font-family: 'Cabin', sans-serif;
}
p {
    font-family: 'Cabin', sans-serif; font-weight: 400;
}
hr {
    border: solid 1px white;
    margin: 40px 0;
    
}
footer {
    width: 100%;
    background: #63717a url(../images/scratch_footer.png) no-repeat top center;
    
}
#footerConteneur {
    width: 1000px;
    padding: 200px 50px 140px;
    margin: 0 auto;
    display: flex; /* or inline-flex */
    justify-content: space-between;
    
}

#footerConteneur h4{
    color: white;
    font-size: 48px;  
    margin: 60px 0 50px;
}
#footerConteneur h5{
    color: #d2d6d8;
    font-size: 36px;  
    margin: 72px 0 50px;       
}
#footerConteneur p{
    color: white;
    font-family: 'Cabin', sans-serif; font-weight: 400;
    font-size: 18px; 
    line-height: 30px;
}

#item01 {
    width: 356px;
    order: 0; /* default is 0 */
}
#item02 {
    width: 596px;
    order: 1; /* default is 0 */
    
}
.mail{
 color: #bfc1c2; 
 font-size: 30px; 
 text-decoration: none;
 margin: 34px 0 24px;
 display: inline-block;
}

.mail:hover{
 color: white; 
 text-decoration: underline;
	-webkit-transition: all 0.4s ease;-ms-transition: all 0.4s ease;transition: all 0.4s ease;
}

.facebook{
    -webkit-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.facebook:hover{
opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
    -webkit-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.copyright{
 color: #9ba0a3; 
 font-size: 18px; 
 text-decoration: none;

}
.copyright:hover{
 color: white; 
 text-decoration: underline;
	-webkit-transition: all 0.4s ease;-ms-transition: all 0.4s ease;transition: all 0.4s ease;

}
  
.grey {
      color: #acb2b5 !important; 
 }
 input {
     color: white;
     font-size: 16px;
     font-family: 'Open Sans', sans-serif; font-weight: 400;
     background: #8b969c;
     width: calc(100% - 20px);
     border: none;
     height: 40px;
     padding: 0 10px 0 10px;
     margin: 0 0 18px;
 }
  select {
     color: white;
     font-size: 16px;
     font-family: 'Open Sans', sans-serif; font-weight: 400;
     background: #8b969c;
     width: 100%;
     border: none;
     height: 40px;
     padding: 0 10px 0 10px;
     margin: 0 0 18px;
 }

 
  textarea {
     color: white;
     font-size: 16px;
     font-family: 'Open Sans', sans-serif; font-weight: 400;
     background: #8b969c;
     width: calc(100% - 20px);
     border: none;
     height: 150px;
     padding: 0 10px 0 10px;
 }
 
 .submit {
  font-family: 'Cabin', sans-serif; font-weight: 400;
  color: white;
  font-size: 30px;
  background: #be0839;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
  width: 100%;
  margin: 18px 0 0;
  height: 54px;
}

.submit:hover {
  background: #585e65;
  text-decoration: none;
	-webkit-transition: all 0.4s ease;-ms-transition: all 0.4s ease;transition: all 0.4s ease;
}
select option {
    padding: 20px 0;
    color: #000;
    font-size: 10px;
}

#item02 input::-webkit-input-placeholder, #item02 textarea::-webkit-input-placeholder  { /* Chrome/Opera/Safari */
    color: white;
}
#item02 input::-moz-placeholder, #item02 textarea::-moz-placeholder  { /* Firefox 19+ */
    color: white;
    opacity: 1;
                                                                               }
#item02 input:-ms-input-placeholder, #item02 textarea:-ms-input-placeholder  { /* IE 10+ */
    color: white;
}
#item02 input:-moz-placeholder, #item02 textarea:-moz-placeholder  { /* Firefox 18- */
    color: white;
    opacity: 1;
}
#item02 input:placeholder, #item02 textarea::placeholder {
    color: white;
}    


.services {
    width: 100%;
    margin: 0 auto;
    display: flex; /* or inline-flex */
    justify-content: center;
	position:relative;
	height:665px;
        display: block;
        overflow: hidden;
    
}
.serviceConteneur {
    width: 1100px;
    margin: 0 auto;
    position: relative;
}
.services h3 {
    font-family: 'Open Sans', sans-serif; font-weight: 700;
    font-size: 40px;
    color: #be0839;
    padding: 0;
    margin: 60px 0 0;
    line-height: 40px;
}
.services  h4 {
    font-family: 'Open Sans', sans-serif; font-weight: 600;
    font-size: 24px;
    color: #63717a;
    padding: 0;
    margin: 0;
}
.services  p {
    color: #020000;
    line-height: 30px;
    margin: 30px 0 50px;
    
    
} 
.imageService01Right {
	background-image: url(../images/services01.jpg);
	background-position: left center;
	background-size: cover;
	background-repeat: no-repeat;
	position:absolute;
	left:50%;
	right:0;
	height: 100%;
}
.imageService02Left {
	background-image: url(../images/services02.jpg);
	background-position: right center;
	background-size: cover;
	background-repeat: no-repeat;
	position:absolute;
	left:0;
	right:50%;
	height: 100%;
}
.imageService03Right {
	background-image: url(../images/services03.jpg);
	background-position: left center;
	background-size: cover;
	background-repeat: no-repeat;
	position:absolute;
	left:50%;
	right:0;
	height: 100%;
}
.imageService04Left {
	background-image: url(../images/services04.jpg);
	background-position: right center;
	background-size: cover;
	background-repeat: no-repeat;
	position:absolute;
	left:0;
	right:50%;
	height: 100%;
}




.item03 {
    width: 50%;
    padding: 0 0 0 20px;
    order: 0; /* default is 0 */
	left:0;
}
.item04 {
    width: calc(50% - 80px);
    padding: 0 40px;
    order: 1; /* default is 0 */
    float:right;
}

.item05 {
    width: 50%;
    padding: 0 20px;
    order: 0; /* default is 0 */
	left:0;
}
.item06 {
    width: calc(50% - 80px);
    padding: 0 40px;
    order: 1; /* default is 0 */
    float:left;
}



 .btnRouge {
  font-family: 'Cabin', sans-serif; font-weight: 400;
  color: white;
  font-size: 20px;
  background: #be0839;
  padding: 10px 80px 10px 80px;
  text-decoration: none;
  
  margin: 40px 0 0;
  height: 36px;
}

 .btnRouge:hover {
  background: #585e65;
  text-decoration: none;
	 -webkit-transition: all 0.4s ease;-ms-transition: all 0.4s ease;transition: all 0.4s ease;
}

.btnGris {
  font-family: 'Cabin', sans-serif; font-weight: 400;
  color: white;
  font-size: 20px;
  background: #be0839;
  padding: 10px 80px 10px 80px;
  text-decoration: none;
  
  margin: 40px 0 0;
  height: 36px;
}

 .btnRouge:hover {
  background: #585e65;
  text-decoration: none;
	 -webkit-transition: all 0.4s ease;-ms-transition: all 0.4s ease;transition: all 0.4s ease;
}

#dixAns {
    background: #edeeed;
    width: 100%;
    margin: 0 auto;

    display: block;
    overflow: hidden;  
}

#dixAnsConteneur {
    width: 1100px;
    margin: 0 auto;
    display: flex; /* or inline-flex */
    justify-content: space-evenly;
}

#item07 {
    width: 400px;
    order: 0; /* default is 0 */
    margin: 110px 0 0;
}
#item08 {
    width: 400px;
    order: 1; /* default is 0 */
    margin: 120px 0 0;
    
}

#item08 h3{
    color: #63717a;
    font-family: 'Cabin', sans-serif; font-weight: 400;
    line-height: 40px;  
    font-size: 30px;
    
}

#citation {
    background: #be0839;
    width: 100%;
    margin: 0 auto;
    display: block;
    overflow: hidden;
    min-height: 400px;
}
#citationContenu {
    width: 1050px;
    margin: 0 auto;
    font-family: 'Cabin', sans-serif; font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    
}
#citationContenu .italic {
    font-family: 'Cabin', sans-serif; font-weight: 700;
    color: white;
    width: 860px;
    margin: 0 auto;
    text-align: right;
    display: block;
}
blockquote {
      
	max-width: 800px;
	margin: 0;
	width: 90%;
	padding: 100px 0 40px;
        color: white;	
	position: relative;
	text-align: justify;
	margin: 30px auto 0 !important;
}
blockquote::before,
blockquote::after {
	font-size: 650%;
	font-family: arial;
	display:block;
	position: absolute;
}
blockquote::before {
	content: "\201C";
	left: -40px;
    line-height: 40px;
}
blockquote::after {
	content: "\201D";
	right: -40px;
    line-height: 60px;
}
#etapes {
    background: url(../images/scratch_rouge.png) no-repeat center top;
    
    width: 100%;
    margin: 0 auto;
    
    overflow: hidden;  
}
#etapesContenu {
    width: 1100px;
    margin: 0 auto;
    font-family: 'Cabin', sans-serif; font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    min-height: 1000px;
    display: flex; /* or inline-flex */
    justify-content: space-between;
    
}
#etapesContenu img {
    margin: 0;
    padding: 0;
    line-height: 0;
	bottom: 0;
	position: absolute;
}
#etapesContenu h2 {
     color: #be0839;
     font-size: 48px;
     line-height: 48px;
     
}
#etapesContenu h3 {
     color: #020000;
     font-size: 18px;
     line-height: 48px;
     margin: 0;
     padding: 0;
}
#etapesContenu p {
     color: #020000;
     margin: 0;
     padding: 0 0 30px;
}
#item9 {
    width: 50%;
    order: 0; /* default is 0 */
    margin: 160px 0 100px;
}
#item10 {
	width: 50%;
	order: 1;
	margin: 0;
	vertical-align: bottom;
	position: relative;
}
header {
    width: 100%;
    min-height: 996px;
    background: url(../images/slide01.jpg) no-repeat center bottom;   
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    overflow: hidden;
}
#menu {
    width: 100%;
    height: 130px;
    background: rgba(255, 255, 255, 0.6);
    
}

#headerContenu {
    width: 1076px;
    margin: 0 auto;
    font-family: 'Cabin', sans-serif; font-weight: 400;
    padding: 24px 0 0;
    position: relative;
    
}
nav {
    text-align: right;
    width: 750px;
    float: right;
    display: inline;
    margin: 50px 0 0;
} 
nav a {
    
    color: #63717a;
    font-size: 20px;
    line-height: 20px;
    text-decoration: none;
    margin: 0 16px;
    padding: 3px 8px 5px;
    
}
#btn-menu, #facebook_mobile {display:none;}
nav a:hover {
    
    color: #fff;
    background: #be0839;
	-webkit-transition: all 0.4s ease;-ms-transition: all 0.4s ease;transition: all 0.4s ease;
    
    
}
.logo {
    float: left;
}
#tel {
    font-family: 'Cabin', sans-serif; font-weight: 400;
    color: #be0839;
    position: absolute;
    width: 200px;
    height: 10px;
    padding: 0;
    margin: 0;
    right: 0;
    top:0;
}
#phone {
    position: absolute;
    width: 75px;
     right: 0;
    top:0;
}
#logosTop {
    position: absolute;
    width: 75px;
     right: 22px;
    top:0;
}
#logosTop img {
    margin: 10px 0 0 10px;
    
}
#wrapTitre {
    width: 1100px;
    margin: 0 auto;
}

#wrapTitre h1 {
    font-family: 'Cabin', sans-serif; font-weight: 700;
    color: #63717a;
    font-size: 65px;
    margin: 270px 0 0;
    
}
#wrapTitre h2 {
    font-family: 'Cabin', sans-serif; font-weight: 400;
    color: #be0839;
    font-size: 40px;
    margin: -10px 0 0;
}

#propos {
    background-color: transparent;
    background: url(../images/scratch_haut.png) no-repeat center top;
    width: 100%;
	margin: -197px auto 0;
    
    
}
#proposContenu {
    
    width: 1100px;
    margin: 0 auto;
    font-family: 'Cabin', sans-serif; font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    
    display: flex; /* or inline-flex */
    justify-content: space-between;
    
}
#proposContenu h2 {
     color: #e5eff9;
     font-size: 45px;
     line-height: 48px;
     margin: 0;
     
}
#proposContenu h3 {
     color: white;
     font-family: 'Cabin', sans-serif; font-weight: 700;
     font-size: 22px;
     line-height: 44px;
     margin: 0 0 10px;
     padding: 0;
}
#proposContenu p {
     color: white;
     margin: 0;
     padding: 0 0 30px;
}
#item11 {
    width: 50%;
    order: 1; /* default is 0 */
    margin: 200px 0 100px;
}
#item12 {
   
    width: 50%;
    order: 0; /* default is 0 */
    margin: 50px 0 0;
    padding: 0;
}
#propos #item12 img {vertical-align:bottom;}
.services .image-mobile {display:none;}
#footerConteneur form div {
   width: calc(100% - 40px);
   color: black;
   background-color: white;
   padding: 10px 20px;
   margin-bottom: 20px;
   text-align: center;
	font-family: 'Cabin', sans-serif;
}
.submit {cursor:pointer;}