@charset "UTF-8";


@media screen and (max-width: 767px) {

    @import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600&family=Dosis:wght@200;300;400;500;600&family=Orbitron:wght@400;500;600&family=Oswald:wght@200;300;400;500&display=swap');

@import url('https://db.onlinewebfonts.com/c/fbe20f6c42a52efdca315763a8cee03b?family=BC+Alphapipe+L');


@font-face {
  font-family: "BC Alphapipe L Regular";
  src: url("../fonts/BC Alphapipe L Regular.eot"); /* IE9*/
  src: url("../fonts/BC Alphapipe L Regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../fonts/BC Alphapipe L Regular.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/BC Alphapipe L Regular.woff") format("woff"), /* chrome、firefox */
  url("../fonts/BC Alphapipe L Regular.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/BC Alphapipe L Regular.svg#BC Alphapipe L Regular") format("svg"); /* iOS 4.1- */
}



.demo {
    font-family:"BC Alphapipe L Regular" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
}
    
body html {
    margin: 0 auto; 	/* élimine les marges intempestives du navigateur */
	padding: 0 auto; 
    overflow-x: hidden;
    }
     
body {
    margin: 0 auto; 	/* élimine les marges intempestives du navigateur */
	padding: 0 auto; 
    overflow-x: hidden;
        
    }
    
    .union-jack {
        position: absolute;
        width: 40px;
        height: auto;
        float: right;
        margin-top: -38px;
        margin-left: 20px;
        
        
      }

.logo-index {
    position: absolute;
    padding: 0 auto;
    padding-top: 20px;
    margin: 0 auto;
    margin-top: -40%;
   margin-left: -35%;
    width: 20%;
    padding-bottom: 5%; 
    z-index: 20;
    
    }

#slide-inside1-logis-bis {
    position: absolute;
    width: 300px;
    height: 250px;
    margin: -100px 100px 100px 230px;
    opacity: 0;
    left:-100px;
    /*background: rgba(255,255,255,.7);*/
    color: white;
   margin-top: -50%;  /* -25%*/
    /*border-top: solid 4px #b38d95;
    border-bottom: solid 2px #b38d95;*/
    z-index: 50;
    opacity: 0;
    
    
}

.h1-index-0-bis { 
    font-family: 'Darker Grotesque', serif;
    font-size: 1.5em;
    padding-top: 30px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 30px;
    line-height: 1.3;
    color: #fff;/* */
    text-align: left;
    text-shadow: 2px 2px 3px #666;
    border-bottom: solid 2px #fff;
    
    text-transform: inherit;
    font-weight: 100;
   }
.h1-index-0-bis .span-titre {
    font-family: 'Cormorant Garamond', serif;
    border-top: solid 2px #fff;
    font-size: 0.8em;
    color: #bfe0e9;
    padding-right: 5%;
    text-transform: uppercase;
    
}

.h1-index-0-bis span {
    margin-left: -2px;
    font-size: 0.8em;
font-family: 'dosis', serif;
}

.h2-index-1-logis-index { 
            font-family: 'dosis', cursive;
            font-size: 1em;
            font-weight: 300;
            padding-top: 5%;
             margin-right: 5%;
            line-height: 1;
            color: #9e8347;/*  #c3a005 #053a59*/
            text-align: justify;
            text-shadow: 2px 2px 3px #666;
            padding-bottom: 40px;
           
            }

/*#slide-inside1-logis-bis {
    position: absolute;
    padding: 0 auto;
    padding-top: 20px;
    margin: 0 auto;
    margin-top: -40%;
   margin-left: -35%;
    width: 20%;
    padding-bottom: 5%; 
  opacity: 1;
   color: white;
    z-index: 20;
    
    
}*/

    
.logo-menu {
    width: 40px;
    height: auto;
    float: left;
    margin-top: 10px;
    margin-left: 5%;
}

.nav1 {
    float: right;
    margin-top: 0;
    margin-bottom: 0;
    }



header {
    min-width: 100%;
    display: none;
    opacity: 1;
    position: fixed;
    z-index: 9999999999999999;
    background-color: #e3e8e9; /*#00547a*/
    border-bottom: 2px solid #76acc4;
}
header nav ul { 		
	list-style: none; 
	margin: 0;
	padding: 0;
	
	}
header nav ul li { 		
	list-style: none;	
	display: block;	
	margin: 0;
	padding: 0;
	float: left;
    z-index: 9999999999999;
	}


header nav ul li a { 
	display: inline-block;
	zoom: 1;		
	margin: 0;
	padding: 5px 5px;
	background-color: none;
	font-size: 1.2em;
    font-family: 'dosis', sans-serif;
    font-weight: 300;
	line-height: 2.3;	
	white-space: nowrap;	
	color: #a5c8cc;
	transition: all 0.5s ease;	
   
	}
header nav ul li a:link, header nav ul li a:visited {
	background-color: none;
	color: #a5c8cc; 
	text-decoration: none;
	}
header nav ul li a:hover, header nav ul li a:active {
    background-color: rgba(99,129,145,.8);
	color:#fff;

	}        
        
/* lien hypertexte normal */
a:link, a:visited { color: #EEBF00; text-decoration: none;}
a:hover, a:active { color: #505c74 ; text-decoration: none; } 

/* ====================== [ Start Overlay ] ====================== */
[data-overlay-dark],
[data-overlay-light] {
  position: relative; }

[data-overlay-dark] #bg-vid,
[data-overlay-light] #bg-vid {
  position: relative;
  z-index: 2; }

[data-overlay-dark]:before,
[data-overlay-light]:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1; }

[data-overlay-dark]:before {
  background: #02050b; }

[data-overlay-light]:before {
  background: #fff; }

[data-overlay-dark] h1,
[data-overlay-dark] h2,
[data-overlay-dark] h3,
[data-overlay-dark] h4,
[data-overlay-dark] h5,
[data-overlay-dark] h6,
[data-overlay-dark] span,
.bg-dark h1,
.bg-dark h2,
.bg-dark h3,
.bg-dark h4,
.bg-dark h5,
.bg-dark h6,
.bg-dark span,
.bg-color h1,
.bg-color h2,
.bg-color h3,
.bg-color h4,
.bg-color h5,
.bg-color h6,
.bg-color span {
  color: #fff; }

[data-overlay-dark] p,
.bg-dark p,
.bg-color p {
  color: #dad6d6; }

[data-overlay-dark="0"]:before,
[data-overlay-light="0"]:before {
  opacity: 0; }

[data-overlay-dark="1"]:before,
[data-overlay-light="1"]:before {
  opacity: .1; }

[data-overlay-dark="2"]:before,
[data-overlay-light="2"]:before {
  opacity: .2; }

[data-overlay-dark="3"]:before,
[data-overlay-light="3"]:before {
  opacity: .3; }

[data-overlay-dark="4"]:before,
[data-overlay-light="4"]:before {
  opacity: .4; }

[data-overlay-dark="5"]:before,
[data-overlay-light="5"]:before {
  opacity: .5; }

[data-overlay-dark="6"]:before,
[data-overlay-light="6"]:before {
  opacity: .6; }

[data-overlay-dark="7"]:before,
[data-overlay-light="7"]:before {
  opacity: .7; }

[data-overlay-dark="8"]:before,
[data-overlay-light="8"]:before {
  opacity: .8; }

[data-overlay-dark="9"]:before,
[data-overlay-light="9"]:before,
[data-overlay-color="9"]:before {
  opacity: .9; }

[data-overlay-dark="10"]:before,
[data-overlay-light="10"]:before {
  opacity: 1; }



    

.scroll-bas {
    width: 20px;
    height: 16px;
    position: absolute;
    left: 50%;
    margin-left: -10px;
    top: 90%;
    z-index: 9999;
    opacity: 0;
    

}       
.scroll-bas-video {
    width: 20px;
    height: 16px;
    position: absolute;
    left: 50%;
    margin-left: -10px;
    top: 90%;
    z-index: 999;
    opacity: 0;
    

}

.scroll-bas-projet {
    width: 40px;
    height: 28px;
    position: absolute;
    left: 50%;
    margin-left: -40px;
    bottom: 10%;
    opacity: 0;
    
} 
        
.bouton-menu {
    position: relative;
    margin-right: 0;
	display: none;
    
	zoom: 1;
	margin: 0; 	/* pour repousser (ou pas) les boutons entre eux */ /* Block en ligne pour consolider les paddings limités par la hauteur du texte */
	padding: 5px 5px;
    margin-top: 0px;
    margin-right: 0%;
	background-color: #EEBF00;
	font-family: 'dosis', sans-serif; 
	font-weight: 200;
	font-size: 0.6em;
	color: #2b3f47;
	vertical-align: middle;	/* permet l'alignement vertical sur la ligne de texte (images, icones, etc.) */
	/*border: 2px solid #000;*/
    cursor: pointer;
    text-align: center;
    
	}
.bouton-menu:link, .bouton-menu:visited { 
	background-color: none; 
	color: #2b3f47;
	text-decoration: none; 
	transition: 0.2s ease-out; 
	}
.bouton-menu:hover, .bouton-menu:active { 
	background-color: rgba(40,48,61,.8);  
	color: #8ed2ed;
	text-decoration: none; 
	transition: 0.2s ease-in;
    box-shadow: 0 10px 5px rgba(40,48,61,.2);
	}
        
 .slide-bouton6-index {
       margin-left: 5%;
        margin-right: 0%;
     margin-bottom: 5%;
    }
.slide-bouton5 {
    padding-top: 5%;
        padding-bottom: 10%;
    }
    
.slide-bouton6-index-bis {
    margin-top: -85%;
       margin-right: 5%;
        margin-left: 0%;
    margin-bottom: 5%;
    } 
.bouton6-index {
    position: relative;
    margin-right: 0;
	display: inline-block;
	zoom: 1;
	margin: 15px; 	/* pour repousser (ou pas) les boutons entre eux */ /* Block en ligne pour consolider les paddings limités par la hauteur du texte */
	padding: 10px 10px;	 
	background-color: #EEBF00;
	font-family: 'Dosis', sans-serif; 
	/*font-weight: bold;*/
	font-size: 1.1em;
	color: #19291f;
    border-radius: 5px;
	vertical-align: middle;	/* permet l'alignement vertical sur la ligne de texte (images, icones, etc.) */
	/*border: 2px solid #000;*/
    cursor: pointer;
    z-index: 999;
    
	}
.bouton6-index:link, .bouton6-index:visited { 
	background-color: none; 
	color: #1a1a1a;
	text-decoration: none; 
	transition: 0.2s ease-out; 
	}
.bouton6-index:hover, .bouton6-index:active { 
	background-color: rgba(40,48,61,.8);  
	color: #dfe8ec;
	text-decoration: none; 
	transition: 0.2s ease-in;
    box-shadow: 0 10px 5px rgba(40,48,61,.2);
	}       
 
/*  MENU


.open {
  position: fixed;
  top: 10px;
  right: 40px;
  width: 50px;
  height: 50px;
  display: block;
  cursor: pointer;
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
    z-index: 999999;
}
.open:hover {
  opacity: 0.8;
}
.open span {
  display: block;
  float: left;
  clear: both;
  height: 4px;
  width: 40px;
  border-radius: 40px;
  background-color: #a5c8cc; 
  position: absolute;
  right: 3px;
  top: 3px;
  overflow: hidden;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.open span:nth-child(1) {
  margin-top: 10px;
  z-index: 9;
}
.open span:nth-child(2) {
  margin-top: 25px;
}
.open span:nth-child(3) {
  margin-top: 40px;
}

.sub-menu {
  -webkit-transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  height: 0;
  width: 0;
  right: -5%;
  top: 0;
  position: absolute;
  background-color: rgba(0, 44, 73, 0.54);
  border-radius: 50%;
  z-index: 18;
  overflow: hidden;
}
.sub-menu li {
  display: block;
  float: right;
  clear: both;
  height: auto;
  margin-right: 0px;
  -webkit-transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.sub-menu li:first-child {
  margin-top: 180px;
}
.sub-menu li:nth-child(1) {
  -webkit-transition-delay: 0.05s;
}
.sub-menu li:nth-child(2) {
  -webkit-transition-delay: 0.10s;
}
.sub-menu li:nth-child(3) {
  -webkit-transition-delay: 0.15s;
}
.sub-menu li:nth-child(4) {
  -webkit-transition-delay: 0.20s;
}
.sub-menu li:nth-child(5) {
  -webkit-transition-delay: 0.25s;
}
.sub-menu li a {
  color: #fff;
  font-family: 'Josefin Sans', Arial, Helvetica, sans-serif;
    font-weight: 300;
  font-size: 16px;
  width: 100%;
  display: block;
  float: left;
  line-height: 40px;
text-decoration: none;
}

.oppenned .sub-menu {
  opacity: 1;
  height: 450px;
  width: 450px;
}
.oppenned span:nth-child(2) {
  overflow: visible;
}
.oppenned span:nth-child(1), .oppenned span:nth-child(3) {
  z-index: 100;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.oppenned span:nth-child(1) {
  -webkit-transform: rotate(45deg) translateY(12px) translateX(12px);
          transform: rotate(45deg) translateY(12px) translateX(12px);
}
.oppenned span:nth-child(2) {
  height: 450px;
  width: 420px;
  right: -160px;
  top: -160px;
  border-radius: 50%;
  background-color: rgba(15, 110, 142, 0.54);
}
.oppenned span:nth-child(3) {
  -webkit-transform: rotate(-45deg) translateY(-10px) translateX(10px);
          transform: rotate(-45deg) translateY(-10px) translateX(10px);
}
.oppenned li {
  margin-right: 168px;
}

    ================================================== */   
        
.nav-toggle {
    padding: 0;
    border: 0;
    outline: 0;
    background: none;
    position: fixed;
     z-index: 9999999999999999999;
    top: 6%;
    right: 8%;
}
  
.button {
    background-color: #5e777c; /* rgba(244,142,120,1)*/
    font-family: 'sarpanch-regular'; 
    color: #fff;
    border: none;
    margin-left: -15%;
    position: relative;
    height: 60px;
    font-size: 0.8em;
    cursor: pointer;
    transition: 600ms ease all;
    outline: none;
    float: none;
    display: block;
    width: 100%;
}
        

    
 .h2proj-titre {
    font-weight: 300;
    color: #607b93;  /* #19291f #3b4061 #dbdbdb #95a781  #1a1a1a*/
    font-size: 1.5em;
     padding-top: 30%;
    padding-bottom: 0;
    margin-top: 25%;
    margin-bottom: 2%;

    }

.h2proj-titre .span-deco-1 {
    color: #a68184;
        }

.h2proj-titre .span-deco-2 {
    color: #EEBF00;
        } 
        
.h2proj-titre-index-web {
    font-family: 'bc alphapipe l regular', sans-serif;
    font-weight: 300;
    color: #607b93;  /* #19291f #3b4061 #dbdbdb #95a781  #1a1a1a*/
    font-size: 1.5em;
    padding-top: 30%;
    padding-bottom: 0px;
    margin-top: 20%;
    margin-bottom: -5%;

    }
        
.h2proj {
   color: #19291f ;/* #1d2d4e #dbdbdb   #507279*/
    font-size: 1.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    padding: 0px 0px 20px 0px;
    margin-top: 1%;
    margin-bottom: 0 auto;
    line-height: 1;
    margin-left: 2%;
        /*border: 2px solid #dceff7;
  background-color: white;*/
   
    }

.h2proj .span-templet-1 {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    margin-left: 15%;
    font-size: 1.2em;
    text-transform: uppercase;
}
        
.fond-bleu-box1 {
    max-width: 100%;
    min-height: auto;
    padding-bottom: 40%;
    background-color: #6a7e7c;
    }
    
.fond-bleu-box2 {
    max-width: 100%;
    min-height: auto;
    padding-bottom: 40%;
    background-color: #b4c1ba; 
    
    }
    
.fond-bleu-box3 {
    max-width: 100%;
    min-height: auto;
    padding-bottom: 40%;
    background-color: #86a2a2 ;
    }
    
.slide-top-3 {
    margin-top: 6%;
   margin-left: 5%;
}


.slide-top-3-bis {
    margin-top: 6%;
    margin-right: 5%;
}
        
.fond-blanc-bis { 
    background-color: #ffffff;
    padding-top: 10%;
    padding-bottom: 10%;
        
        }
        
.case70 {
        width: 100%;
        height: 25%; /* vertical height vh "min-height" permet de ralonger le div et voir tout le texte voir max-height aussi */
        float: none;
        padding: 20px 20px 20px 20px;
  }

.case30 {
        width: 100%;
        height: 25%; /* vertical height vh "min-height" permet de ralonger le div et voir tout le texte voir max-height aussi */
       float: none;
        
    } 
        
.case70-bis {
        width: 100%;
        height: 32%; /* vertical height vh "min-height" permet de ralonger le div et voir tout le texte voir max-height aussi */
        float: none;
       padding: 20px 20px 20px 20px;
  }

.case30-bis {
        width: 100%;
        height: 25%; /* vertical height vh "min-height" permet de ralonger le div et voir tout le texte voir max-height aussi */
        float: none;
    margin-top: -5%;
        
    }
        
.case50 {
        width: 100%;
        height: auto; /* vertical height vh "min-height" permet de ralonger le div et voir tout le texte voir max-height aussi */
        float: none;
        padding-bottom: 4%;
        padding-left: 2%;
        padding-right: 2%;
        
    }
.case50-bis {
       
        padding-bottom: 4%;
        padding-left: 2%;
        padding-right: 2%;
        
    }
        
.img-icone-lit {
    width: 20%;
    height: auto;
   margin-left: 40%;
    margin-bottom: 2%;
    margin-top: 2%;
}
        
        
.p1-bis-1 {
    font-family: 'dosis', sans-serif;
   font-weight: 300;
    color:#19291f;
    font-size: 1.1em;
   line-height: 1.5;
    margin-top: 1%;
    margin-bottom: 2%;
    padding-left: 5%;
  

}

.p1-bis-1 .span-texte-1 {
     color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.4em;
    line-height: 1.5;
}
        

        
 
    
#menu2 { display: none; 
        }

            
        
.caption2 {
	position: absolute;
    height: 45vh;
    width: 100%;
    top:0;
	left: 0;
    bottom: 0;
	color: #ffffff;
    opacity: 1;
	background: rgba(28,31,36,0.5);
    overflow: hidden;
	transition: all 0.5s ease;
   
}
    
.caption1 .span3 h4 {
    padding-top: 20%;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    font-size: 1.4em;
    line-height: 0.9;
    
}
    
.caption1 .span3 .h6proj {
   line-height: normal;
    font-family: 'dosis', sans-serif;
    font-size: 0.8em;
    line-height: 0.9;
    
}
    

        
        
.caption1 {
	position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #a09fa7;
    opacity: 1;
	background: rgba(28,31,36,0.6);
    overflow: hidden;
	transition: all 0.5s ease;
    
   
}
.caption1 span { 
    position: absolute;
    display: block;
    bottom: 43%;
    left: 0;
    right: 0;
    padding-left: 5%;
    }
.caption1 span .h4-templet {
    color: #EEBF00;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    font-size: 1.6em;
    line-height: 1;
    font-weight: 300;
    /*text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.50);*/
}
.caption1 span .h6proj {
    font-family: 'dosis', sans-serif;
    font-size: 1em;
    line-height: 1;
    color: #dee9ec;
    padding: 0;
    padding-bottom: 5%;
    
}
.caption1:hover {
    opacity: 1;
    transition: all 0.5s ease;
   
}        

        
.caption1 span h4 {
    color: #EEBF00;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    padding-top: 70px;
    font-size: 1.2em;
    line-height: 0.8;
    
}
    
.caption1 span h6 {
    font-family: 'dosis', sans-serif;
    color: #dee9ec;
    padding-top: 70px;
    font-size: 0.6em;
    line-height: 0.8;  
    }
  
        
.span2 h4 {
    margin-top: -130px;
    font-size: 1.8em;
   
}
        
.slidedeco {
    padding-top: 52%;
    padding-bottom: 0;
    margin: 0;
}
        

    
        
.superpose3 {
	position: absolute;
     width: 60px;
	top: 5%;
    left: 50%;
    margin-left: -30px;
    cursor: pointer;
    z-index: 99999;		
	}
    
        
.laptop-bm {
    width: 150px;
    height: auto;
    padding-top: 12%;
    padding-bottom: 10%;
    padding-right: 5%;
}
        

.fond-blanc1 { 
    background-color: #ffffff; 
    margin: 0 auto; 
    margin-top: 5%;
    } 
        
.h2deco {
    margin: 0;
    padding-top: -2%;
    color: #1a1A1A;/*#dbdbdb*/
    font-size: 1.8em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    
    }
      
       

.p1 {
    font-family: 'dosis', sans-serif;
    color: #505c74; /* #857a80 */
    font-size: 0.7em;
    padding-left: 5%;
    padding-right: 10%;
    vertical-align: inherit;
    line-height: normal;
    

}
        
.p1-deco {
     line-height: 1.2;
    font-family: 'dosis', sans-serif;
    color: #505c74; /* #857a80 */
    font-size: 1.6em;
    padding-left: 5%;
    padding-right: 10%;
    margin-top: 5%;
    margin-bottom: 5%;
    vertical-align: center;
    

}
        
.h6deco-texte { 
    font-size: 1.2em;
    color: #505c74;
    margin-left: 5%;
    margin-right: 5%;
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 5%;
    }
        
.h6-page-gite { 
    font-size: 1.2em;
    color: #505c74; /*  #1d2d4e */
    margin-left: 5%;
    margin-right: 5%;
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 5%;
    text-align: justify;
    }
        
        


.h6jeux { 
    color: #42616e;
    font-size: 1em;
    line-height: normal;
    font-family: 'dosis', sans-serif;
    padding-bottom: 2%;
    padding-left: 2%;
           
    }
        
.h6jeux-box { 
    color: #e1e7ea;
    font-size: 1em;
    line-height: normal;
    font-family: 'dosis', sans-serif;
    padding-bottom: 2%;
    padding-right: 2%;
           
    }

.h6jeuxbis { 
    color: #30648c;
    font-size: 0.8em;
   line-height: normal;
    font-family: 'dosis', sans-serif;
    padding-bottom: 5%;
           
    }
        
   /*///////////// projet art deco //////////////////*/ 
    


.h2-artdeco {
    padding-top: 10%;
    padding-left: 2%;
    padding-right: 2%;
    font-size: 1.5em;
    color: #43646B;/*#dbdbdb*/
    font-family: 'BC Alphapipe L Regular', sans-serif;
    padding-bottom: 2%;
    }
    
.h2-artdeco3 {
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #43646B;/* #83999E #dbdbdb*/
    padding-top: 5%;
    padding-left: 5%;
    font-size: 2em;
    text-transform: uppercase;
    line-height: normal;
    }
        
        

.fond-projet-f-bis {
    background-color: #5c7373; 
    z-index: 5; 
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
    padding-bottom: 5%;
    }
        
.fond-page-shopping-text {
    padding-bottom: 5%;
    background-color: #9B8188;
} 
.fond-page-shopping-broc {
    padding-bottom: 5%;
    background-color: #DECED2;
}
    
.fond-page-electra-2 { 
    background-color: #268396;
    padding-bottom: 5%;
    }

.p1-artdeco {
    font-family: 'dosis', sans-serif;
    color:#fff;
    font-size: 1.2em;
    padding-left: 0;
    padding-right: 0;
    vertical-align: inherit;
    line-height: normal;
    margin-bottom: 5%;
    }
        
        
 /*//////////////// projet riva /////////////////*/  
        
.h2-titre {
    margin: 0;
   margin-top: 10%;
    margin-bottom: 0;
    color: #EEBF00;    /*# dbdbdb  #1d2d4e*/
    font-size: 2.3em;
    font-family: 'bc alphapipe l regular', sans-serif; /*'BC Alphapipe L', sans-serif;*/
    font-weight: 300;
    text-transform: uppercase;
   
    }
        
.h2-titre-page-deco-2022 {
    margin: 0;
   padding-top: 3%;
    margin-left: 5%;
    margin-right: 5%;
    margin-bottom: 0;
    color: #EEBF00;    /*# dbdbdb  #1d2d4e*/
    font-size: 1.8em;
    font-family: 'bc alphapipe l regular', sans-serif; /*'BC Alphapipe L', sans-serif;*/
    font-weight: 300;
    text-transform: uppercase;
   
    }
        
.h2-titre-index {
    margin: 0;
    margin-top: 10%;
    margin-bottom: 0;
    color: #EEBF00;    
    font-size: 1.8em;
    font-family: 'bc alphapipe l regular', sans-serif; 
    font-weight: 300;
    text-transform: uppercase;
   
    }
    
    
.h2-titre-index .span-titre-index {
    margin: 0 auto;
    padding: 0 auto;
    font-family: 'dosis', sans-serif;
    color: #607b93; 
    font-size: 0.8em;
    text-transform: none;
    }
        
.p2-bis {
    font-family: 'dosis', sans-serif;
   font-weight: 300;
     color: #d3d6e5;
    font-size: 1.3em;
   line-height: 1.3;
    margin-top: 2%;
    margin-bottom: 2%;
    padding-left: 5%;
    padding-right: 5%;
  

}
        
.p2-bis-index {
    font-family: 'dosis', sans-serif;
   font-weight: 300;
     color: #505c74;
    font-size: 1.2em;
   line-height: 1.5;
    margin-top: 1%;
    margin-bottom: 2%;
    padding-left: 5%;
    padding-right: 5%;
    text-align: justify;
  

}
        
.slide-caption-page-web {
    margin-top: 5%; 
        }
        
.p2-bis .span-texte-1 {
     color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.4em;
    line-height: 1.5;
}
        
.slide-left {
    margin-left: -8%; 
    margin-right: 5%;
        }
        

.slideriva {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 130%;
}

.h1riva {
    font-family: 'bc alphapipe l regular', sans-serif; 
    margin-top: 0;
    padding-top: 10%;
     color: #43646B;
    padding-bottom: 10%;
    font-size: 2em;
    text-transform: uppercase;
    }

.h2riva {
     font-size: 1.2em;
    color: #e0e5ef; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 5%;
    margin-top: 2%;
    text-align: center;
    padding-right: 15%;
    font-weight: 200;
    font-size: 1em;
     }
.h2riva span {
    font-size: 1.8em;
    color: #e0e5ef; 
    text-transform: uppercase;
}
    
.fond-bleu4-bis {
    padding-bottom: 10%;
    background-color: #598394;
   
    }
    
.fond-flex-box-1 { 
    background-color: #91a09f;
    padding-bottom: 10%;
    margin: 0;
    }

        
@import url(https://fonts.googleapis.com/css?family=Istok+Web);
@keyframes slidy {
  0% {
    left: 0%;
  }
  20% {
    left: 0%;
  }
  25% {
    left: -100%;
  }
  45% {
    left: -100%;
  }
  50% {
    left: -200%;
  }
  70% {
    left: -200%;
  }
  75% {
    left: -300%;
  }
  95% {
    left: -300%;
  }
  100% {
    left: -400%;
  }
}
    
* {
  box-sizing: border-box;
}

figure {
  margin: 0;
  font-family: Istok Web, sans-serif;
  font-weight: 100;
}
div#captioned-gallery {
  width: 90%;
  overflow: hidden;
    margin-left: 5%;
}
figure.slider {
  position: relative;
  width: 500%;
  font-size: 0;
  animation: 20s slidy infinite;
}
figure.slider figure {
  width: 20%;
  height: auto;
  display: inline-block;
  position: inherit;
}
figure.slider img {
  width: 100%;
  height: auto;
}
figure.slider figure figcaption {
  position: absolute;
  bottom: 0;
  background: rgba(0, 0, 0, 0.4);
  color: #fff;
  width: 100%;
  font-size: 2rem;
  padding: 0.6rem;
}
    
.img-ombre {
      -webkit-box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.55);
  -moz-box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.55);
  box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.55);
        
    }  
    
.titre-galery-home-staging-bis {
   
    margin: 0;
    margin-top: 5%;
    padding-bottom: 5%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.6em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    text-transform: uppercase;
    z-index: 99999;
    }
        
.slide-home-staging {
    margin-top: 0;
    margin-left: 20%;
    }
        
.slide40 { 
	padding-top: 40px;
    padding-bottom: 40px;
	
	}
        
        
#prenom-page-contact {
    position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding:0; 
    top: 13%;
    color: #bbc3d8; 
    font-size: 2em; 
    font-family: 'Orbitron', sans-serif;
    font-weight: 100;
    opacity: 1;
    z-index: 13;
    } 
#webdesigner-contact {
     position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding:0; 
    top: 20%;
    color: #95a781; 
    font-size: 1.5em; 
    font-family: 'BC Alphapipe L Regular', sans-serif; 
    font-weight: 100;
    text-transform: uppercase;
    text-align: center;
    opacity: 1;
    z-index: 14;
    }
    
#prenom {
    position: absolute; 
    width: 100%; 
    text-align: center;
    top: 15%; 
    font-size: 2em; 
     opacity: 1;
    z-index: 13;
    }

#prenom-page-index {
    position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding:0; 
    top: 12%;
    color: #bbc3d8; 
    font-size: 2em; 
    font-family: 'Orbitron', sans-serif;
    font-weight: 100;
    opacity: 1;
    z-index: 13;
    }
        
#prenom-page-deco-2022 {
    position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding:0; 
    top: 12%;
    color: #bbc3d8; 
    font-size: 1.8em; 
    font-family: 'Orbitron', sans-serif;
    font-weight: 100;
    opacity: 1;
    z-index: 13;
    }
        
#prenom-page-web {
    position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding:0; 
    top: 15%;
    color: #bbc3d8; 
    font-size: 2em; 
    font-family: 'Orbitron', sans-serif;
    font-weight: 100;
    opacity: 1;
    z-index: 13;
    }

#webdesigner {
     position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding:0; 
    top: 18%;
    color: #95a781; 
    font-size: 1em; 
    font-family: 'BC Alphapipe L Regular', sans-serif; 
    font-weight: 200;
    text-transform: uppercase;
    text-align: center;
    opacity: 1;
    z-index: 14;
    }
    
#webdesigner .span-bis-web {
    font-size: 1.2em;
     font-weight: 200;
    color: #EEBF00;
    margin-left: 0;
   
    
}
        
#webdesigner-bis {
     position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding:0; 
    top: 22%;
    color: #95a781; 
    font-size: 1.4em; 
    font-family: 'BC Alphapipe L Regular', sans-serif; 
    font-weight: 100;
    text-transform: uppercase;
    text-align: center;
    opacity: 1;
    z-index: 14;
    }
#motiondesign {
     position: absolute; 
    width: 1100px;
    height: auto;
    left: -100%;
    /*left:50%;
    margin-left: -250px;*/
    text-align: center;
    margin: 0; 
    padding: 0 10px 0 10px; 
    top: 25%;
    color:#fff; 
    font-size: 2vw; 
    font-family: 'bc alphapipe l regular', sans-serif; 
    opacity: 1;
    z-index: 15;
    }
        
 #motiondesign .span-contact-titre {
    padding: 0;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    font-size: 2em;
     margin-left: -2%;
     
    
        
    } 
    
#motiondesign-contact {
     position: absolute; 
    width: 1100px;
    height: auto;
     left: -100%;
    /*left:50%;
    margin-left: -250px;*/
    text-align: center;
    margin: 0; 
    padding:0;  
    top:68%;
    color:#fff; 
    font-size:2vw; 
    font-family: 'BC Alphapipe L Regular', sans-serif; 
    margin-top: 2%;
    opacity: 0;
    z-index: 15;
    }
#motiondesign-contact .span-contact-titre {
    padding: 0;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    font-size: 1.6em;
    
        
    } 
    
#diapo1 { 
    width: 80%;
	margin: 10px;
	padding: 10px;
	background-color: #eaebed; /*  #e6dbe5   222,218,111, 0.05 / rgba(52,76,81, 0.8) rgba(255,255,255,0.6) */
	border: 1px solid #a68184;
    margin-bottom: 8%;
    margin-left: 8%;
    margin-right: 0%;
    float: inherit;
    
	}
#diapo1 ul { margin-left: -20px; 
	}
#diapo1 li { 
	margin: 20px;
	width: 180px;
	list-style: none; 	/* pour enlever les puces sur IE7 */
	zoom: 1; 		/* hack pour IE<8 qui ne comprend pas les inline-block */
	display: inline;	/* hack pour IE<8 qui ne comprend pas les inline-block */
	display: inline-block; 
	
	}

#diapo1 li a {	
	text-decoration: none;
	} 
#diapo1 li a img {
	border: none; 
	max-width: 100%; /* force la taille image à la dimension du li */
    max-height: 100%;
	box-shadow: 2px 3px 6px rgba(0,0,0, 0.75);
    
	}
#diapo1 img {
    width: 180px;
	border: none; 
	float: inherit;
    z-index: 900;
   
	}


#diapo2 { 
   width: 80%;
	margin: 10px;
	padding: 10px;
	background-color: #d3d6e5; /* 222,218,111, 0.05 / rgba(52,76,81, 0.8) rgba(255,255,255,0.6) */
	border: 1px solid #a68184;
    margin-bottom: 2%;
     margin-left: 8%;
    margin-right: 0%;
   float: inherit;
    
	}
#diapo2 ul { margin-left: -20px; 
	}
#diapo2 li { 
	margin: 20px;
	width: 180px;
	list-style: none; 	/* pour enlever les puces sur IE7 */
	zoom: 1; 		/* hack pour IE<8 qui ne comprend pas les inline-block */
	display: inline;	/* hack pour IE<8 qui ne comprend pas les inline-block */
	display: inline-block; 
	
	}

#diapo2 li a {	
	text-decoration: none;
	} 
#diapo2 li a img {
	border: none; 
	max-width: 100%; /* force la taille image à la dimension du li */
    max-height: 100%;
	box-shadow: 2px 3px 6px rgba(0,0,0, 0.75);
    
	}
#diapo2 img {
    width: 180px;
	border: none; 
	float: inherit;
     z-index: 900;
	}
        
        

#diapo3 { 
    width: 80%;
	margin: 10px;
	padding: 10px;
	background-color: #bbc3d8; /*  #e6dbe5   222,218,111, 0.05 / rgba(52,76,81, 0.8) rgba(255,255,255,0.6) */
	border: 1px solid #a68184;
    margin-bottom: 5%;
    margin-left: 8%;
    margin-right: 0%;
   float: inherit;
    
	}
#diapo3 ul { margin-left: -30px; 
	}
#diapo3 li { 
	margin: 20px;
	width: 180px;
	list-style: none; 	/* pour enlever les puces sur IE7 */
	zoom: 1; 		/* hack pour IE<8 qui ne comprend pas les inline-block */
	display: inline;	/* hack pour IE<8 qui ne comprend pas les inline-block */
	display: inline-block; 
	
	}

#diapo3 li a {	
	text-decoration: none;
	} 
#diapo3 li a img {
	border: none; 
	max-width: 100%; /* force la taille image à la dimension du li */
    max-height: 100%;
	box-shadow: 2px 3px 6px rgba(0,0,0, 0.75);
    
	}
#diapo3 img {
    width: 180px;
	border: none; 
	float: left;
    z-index: 900;
   
	}


#diapo4 { 
   width: 80%;
	margin: 10px;
	padding: 10px;
	background-color: #9ba6bc; /* 222,218,111, 0.05 / rgba(52,76,81, 0.8) rgba(255,255,255,0.6) */
	border: 1px solid #a68184;
    margin-bottom: 5%;
     margin-left: 8%;
    margin-right: 0%;
   float: inherit;
    
	}
#diapo4 ul { margin-left: -30px; 
	}
#diapo4 li { 
	margin: 20px;
	width: 180px;
	list-style: none; 	/* pour enlever les puces sur IE7 */
	zoom: 1; 		/* hack pour IE<8 qui ne comprend pas les inline-block */
	display: inline;	/* hack pour IE<8 qui ne comprend pas les inline-block */
	display: inline-block; 
	
	}

#diapo4 li a {	
	text-decoration: none;
	} 
#diapo4 li a img {
	border: none; 
	max-width: 100%; /* force la taille image à la dimension du li */
    max-height: 100%;
	box-shadow: 2px 3px 6px rgba(0,0,0, 0.75);
    
	}
#diapo4 img {
    width: 180px;
	border: none; 
	float: left;
     z-index: 900;
	}

#anim-texte-page-deco-1 {opacity: 0;}
#anim-texte-page-shopping {opacity: 0;}
#anim-texte-page-shopping-1 {opacity: 0;}
#anim-texte-broc-1 {opacity: 0;}
#anim-prix-shopping-broc {opacity: 0;}
#anim-texte-page-conception {opacity: 0;}

#anim-projet-deco-1 {opacity: 0;}
#anim-projet-deco-2 {opacity: 0;}
#anim-projet-deco-3 {opacity:0;}
#anim-projet-1-img-4 {opacity:0;}

#anim-texte-vignette-web {opacity: 0;}
#anim-texte-conception-1 {opacity: 0;}
#anim-page-deco-1 {opacity: 0;}
#anim-prix-deco {opacity: 0;}

#anim-page-conception-text-1 {opacity: 0;}
#anim-page-conception-text-2 {opacity: 0;}
#anim-text-home-staging-1 {opacity: 0;}
    
#anim-vignette-index-1 {opacity: 0;}
#anim-vignette-index-2 {opacity: 0;}    

#anim-vignette-deco-1 {opacity: 0;}
#anim-vignette-deco-2 {opacity: 0;}
#anim-vignette-deco-3 {opacity: 0;}
#anim-vignette-deco-4 {opacity: 0;}


/* ----------------  page decorateur fin  --------------------  */


#bienvenue {opacity: 0;}

#anim-texte-electra {opacity: 1;}
#anim-texte-electra-1 {opacity: 0;}

#anim-texte-templet {opacity: 0;}
#anim-texte-templet-index {opacity: 0;}
#anim-texte-templet-index-bis {opacity: 0;}

#anim-texte-templet-index-deco-1 {opacity: 0;}
#anim-texte-templet-index-deco-2 {opacity: 0;}

#anim-texte-offre {opacity: 0;}
#anim-texte-offre-a {opacity: 0;}
#anim-texte-offre-b {opacity: 0;}
#anim-p2-bis {opacity: 0;}

#anim-texte-offre-atria {opacity: 0;}
#anim-texte-offre-a-atria {opacity: 0;}
#anim-texte-offre-b-atria {opacity: 0;}

#anim-texte-offre-electra {opacity: 0;}
#anim-texte-offre-a-electra {opacity: 0;}
#anim-texte-offre-b-electra {opacity: 0;}
#anim-page-templet-3-electra {opacity: 0;}
#anim-forfait-titre-electra {opacity: 0;}
#anim-forfait-1-electra {opacity: 0;}
#anim-forfait-2-electra {opacity: 0;}

#anim-prestation-titre-electra {opacity: 0;}
#anim-prestation-1-electra {opacity: 0;}
#anim-prestation-2-electra {opacity: 0;}

#anim-texte-page-home-staging-1 {opacity: 0;}
#anim-texte-page-home-staging {opacity: 0;}
#anim-prix-home-staging {opacity: 0;}
#anim-prix-shopping {opacity: 0;}
#anim-prix-shopping-1 {opacity: 0;}

#anim-forfait-titre {opacity: 0;}
#anim-forfait-titre-atria {opacity: 0;}
#anim-forfait-1 {opacity: 0;}
#anim-forfait-2 {opacity: 0;}
#anim-forfait-1-atria {opacity: 0;}
#anim-forfait-2-atria {opacity: 0;}

#anim-forfait-titre-index {opacity: 0;}
#anim-forfait-index-1 {opacity: 0;}
#anim-forfait-index-2 {opacity: 0;}
#anim-forfait-index-3 {opacity: 0;}
#anim-forfait-index-4 {opacity: 0;}
#anim-forfait-index-5 {opacity: 0;}
#anim-forfait-index-6 {opacity: 0;}
#anim-forfait-index-7 {opacity: 0;}
#anim-forfait-index-8 {opacity: 0;}
#anim-forfait-index-9 {opacity: 0;}

#anim-prestation-titre-alhena {opacity: 0;}
#anim-prestation-titre {opacity: 0;}
#anim-prestation-titre-atria {opacity: 0;}
#anim-prestation-1 {opacity: 0;}
#anim-prestation-2 {opacity: 0;}
#anim-prestation-1-atria {opacity: 0;}
#anim-prestation-2-atria {opacity: 0;}

#anim-presentation-moi-1 {opacity: 0;}
#anim-presentation-moi-2 {opacity: 0;}
#anim-presentation-moi-3 {opacity: 0;}
#anim-presentation-moi-4 {opacity: 0;}
#anim-presentation-moi-5 {opacity: 0;}


#anim-page-deco-img-renov-leclos-1 {opacity: 0;}
#anim-page-deco-img-renov-leclos-2 {opacity: 0;}
#anim-page-deco-img-renov-leclos-3 {opacity: 0;}
#anim-page-deco-img-renov-leclos-4 {opacity: 0;}
#anim-page-deco-img-renov-leclos-5 {opacity: 0;}
#anim-page-deco-img-renov-leclos-6 {opacity: 0;}


#anim-page-deco-img-renov-villa-1 { opacity: 0;}
#anim-page-deco-img-renov-villa-2 { opacity: 0;}
#anim-page-deco-img-renov-villa-3 { opacity: 0;}
#anim-page-deco-img-renov-villa-4 { opacity: 0;}
#anim-page-deco-img-renov-villa-5 { opacity: 0;}
#anim-page-deco-img-renov-villa-6 { opacity: 0;}

#section-1-galerie {opacity: 0;}
#section-2-galerie {opacity: 0;}
#section-3-galerie {opacity: 0;}
#section-4-galerie {opacity: 0;}
#section-5-galerie {opacity: 0;}
#section-6-galerie {opacity: 0;}
#section-7-galerie {opacity: 0;}
#section-8-galerie {opacity: 0;}

#section-9-galerie {opacity: 0;}
#section-10-galerie {opacity: 0;}
#section-11-galerie {opacity: 0;}
#section-12-galerie {opacity: 0;}
#section-13-galerie {opacity: 0;}
#section-14-galerie {opacity: 0;}
#section-15-galerie {opacity: 0;}
#section-16-galerie {opacity: 0;}

#anim-templet-1 {opacity:0;}
#anim-templet-2 {opacity:0;}
#anim-templet-3 {opacity:0;}
#anim-templet-4 {opacity:0;}

#anim-video-electra-1 {opacity:0;}
#anim-video-electra-2 {opacity:0;}
#anim-video-electra-3 {opacity:0;}
#anim-video-electra-4 {opacity:0;}
#anim-video-electra-5 {opacity:0;}
#anim-video-electra-6 {opacity:0;}


#anim-page-templet-1-video1{opacity:0;}
#anim-page-templet-1 {opacity: 0;}
#anim-page-templet-1-bis {opacity: 0;}
#anim-page-templet-2 {opacity: 0;}
#anim-page-templet-3 {opacity: 0;}
#anim-page-templet-3-atria {opacity: 0;}
#anim-page-colombier {opacity: 0;}
#anim-page-colombier-1 {opacity: 0;}
#anim-page-colombier-2 {opacity: 0;}
#anim-page-colombier-3 {opacity: 0;}
#anim-page-colombier-4 {opacity: 0;}

#anim-page-servannaise-1 {opacity: 0;}
#anim-page-servannaise-2 {opacity: 0;}

#anim-texte-1 {opacity:0;}
#anim-texte-2 {opacity:0;}
#anim-texte-3 {opacity:0;}
#anim-texte-4 {opacity:0;}
#anim-texte-5 {opacity:0;}
#anim-texte-5-bis {opacity:0;}


#bouton-anim-1 {opacity:0;}
#bouton-anim-2 {opacity:0;}
#bouton-anim-1-atria {opacity:0;}
#bouton-anim-2-atria {opacity:0;}
#bouton-anim-3 {opacity:0;}

#anim-texte-index-1 {opacity:0;}

#anim-projet-0 {opacity:0;}
#anim-projet-1 {opacity:0;}
#anim-projet-2 {opacity:0;}
#anim-projet-3 {opacity:0;}
#anim-projet-4 {opacity:0;}
#anim-projet-5 {opacity:0;}
#anim-projet-6 {opacity:0;}

    
#anim-page-templet-cv {opacity: 0;}
#anim-cv-immo-1 {opacity: 0;}
#anim-page-templet-cv-1 {opacity: 0;}
#anim-page-templet-cv-1-bis {opacity: 0;}
#anim-page-templet-cv-2 {opacity: 0;}
#anim-page-templet-cv-2-bis {opacity: 0;}

#anim-texte-cv {opacity: 0;}
#anim-cv-1 {opacity: 0;}
#anim-cv-2 {opacity: 0;}
#anim-cv-3 {opacity: 0;}
#anim-cv-4 {opacity: 0;}

#anim-projet-titre-2 {opacity:0;}

#bgVid1-bis {opacity: 0;}
#bgVid1-bis-index {opacity: 0;}
#bgVid1-index {opacity: 0;}
#bgVid2-index {opacity: 0;}
    
#bgVid1-electra {
    padding-top: 0;
    padding-bottom: 0;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 50%;
    height: auto;
    z-index: -1;
    opacity: 0;
    }
    
#bgVid1 {
    padding-top: 0;
    padding-bottom: 0;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 50%;
    height: auto;
    z-index: -1;
    opacity: 0;
    }

#anim-text-contact-1 {opacity:0;}
#anim-text-contact-2 {opacity:0;}
#anim-text-contact-3 {opacity:0;}
#anim-text-contact-4 {opacity:0;}
#anim-text-contact-5 {opacity:0;}
#anim-text-contact-6 {opacity:0;}
#anim-text-contact-7 {opacity:0;}
#anim-text-contact-8 {opacity:0;}
#anim-text-contact-9 {opacity:0;}
#anim-text-contact-10 {opacity:0;}
#anim-text-contact-11 {opacity:0;}
#anim-text-contact-12 {opacity:0;}
#anim-text-contact-13 {opacity:0;}
        
.slide10 {margin-top: -20%;}
        

.body-cv { 
	margin: 0 auto; 	
	padding: 0 auto;  	
	 background-color: #ddeded;
	font-family: 'Dosis', sans-serif; 
	color: #000; 
	line-height: 1.5;
	
    overflow-x: hidden;
    
  }  


       
.img-moi {
    position: relative;
    width: 35%; 
    height: auto;
    margin-left: 0;
    margin-top: 55%;
    padding-bottom: -2%;

}   
        
.slide-phone {
        margin-top: 5%;
        }
        
.h2proj-moi {
   
    color: #1d2d4e; /*#dbdbdb   #507279*/
    font-size: 1.8em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 2%;
    margin-top: 2%;
    margin-bottom: 0 auto;
    line-height: 1;
    margin-left: 0%;
    }
        
        
.p-moi-1 {
    font-size: 1.1em;
    color: #1d2d4e; /* #dceff8 #4b4764*/
    line-height: 1.5;
    font-family: 'dosis', sans-serif;
    font-weight: 100;
   padding: 0px 0px 40px 0px;
    padding-top: 2%;
    padding-left: 2%;
    padding-right: 2%;
    padding-bottom: 2%;
}
        

        
.case70-bis-moi {
        width: 100%;
        max-height: 100%; /* vertical height vh "min-height" permet de ralonger le div et voir tout le texte voir max-height aussi */
       padding: 20px 20px 20px 20px;
  }

.case30-bis-moi {
        width: 100%;
        min-height: 25%; /* vertical height vh "min-height" permet de ralonger le div et voir tout le texte voir max-height aussi */
        padding: 20px 20px 20px 20px;
    }
        
.p-qui2-moi {
    font-size: 1.2em;
    color: #1d2d4e;
    line-height: normal;
    font-family: 'dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 2%;
   margin-top: 2%;
    padding-left: 5%;
    padding-right: 5%;
}
        
.p-qui2-moi-bis {
    font-size: 2em;
    color:#1d2d4e;
    line-height: normal;
    font-family: 'dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    padding-top: 5%;
   margin-top: 0%;
    padding-left: 5%;
    padding-right: 5%;
    text-align: center;
}

.p-qui2-diapo {
    font-size: 1em;
    color:#1d2d4e;
    line-height: normal;
    font-family: 'dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 2%;
    padding-top: 2%;
    padding-left: 5%;
    padding-right: 5%;
}
        
        
 .h2proj2 {
    font-family: 'dosis', sans-serif;
    font-weight: 300;
    color: #507279; /*#dbdbdb #95a781  #1a1a1a  #EEBF00*/
    font-size: 1.5em;
   }       
        
        
.h2proj1 {
    font-family:'voorregular', arial, voltaire, serif; 
    color: #867983;/*#dbdbdb*/
    padding-top: 0;
    padding-bottom: 0px;
    margin-top: 0%;
    

    }
        
.h2deco {
    margin: 0;
    margin-top: 0%;
    color: #607b93;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    }
.h2deco .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.3em;
}

.h2deco .span-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1em;
    
}
    
.h2deco-forfait {
    margin: 0;
    margin-top: 2%;
    color: #607a93;   /* #4b4764  #1d2d4e  #dbdbdb*/
    font-size: 1.4em;
    font-family:  'BC Alphapipe L Regular', sans-serif;
    
    }
.span-prix-conception {
     color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    margin-left: 20%;
    
}

.h2deco-forfait .span-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1em;
    
} 
    
.fond-blanc { background-color: #ffffff;}
    
.fond-blanc-bis-2 { 
    background-color: #ffffff;
    margin-top: 10%;
    margin-bottom: 10%;
}
        
.slide-top-offre {
    margin-top: 5%;
}
        
.slide-top-offre-phone {
    margin-top: -60%;
}
        
.h2proj2-index {
    font-family: 'dosis', sans-serif;
    font-weight: 300;
    color: #507279; /*#dbdbdb #95a781  #1a1a1a  #EEBF00*/
    font-size: 1.4em;
   margin-top: -45%;
    margin-bottom: -25%;

    }
        
.h2proj2-moi {
    font-family: 'dosis', sans-serif;
    font-weight: 300;
    color: #EEBF00; /*#dbdbdb #95a781  #1a1a1a #507279 */
    font-size: 2em;
  padding-top: -10%;
    margin-bottom: 5%;

    }
        
.h2deco3 {
    padding-top: 10%;
    padding-left: 5%;
    color: #fff;/*#dbdbdb*/
    font-size: 2em;
    font-family: 'bc alphapipe l regular', sans-serif;
    text-transform: uppercase;
    line-height: normal;
    }
        
        
  .slide70 {
	padding-top: 20px;
	
	}      

    
.h6deco-forfait { 
    width: 200px;
    height: auto;
    font-size: 0.6em;
    color: #505c74; /* #1d2d4e*/
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 5%;
    margin-top: 2%;
    text-align: left;
    margin-left: 10%;
 }
   
 .span-forfait {
    color: #EEBF00;
    font-size: 1.2em;
    text-transform: uppercase;
    
}       
.slide-bottom-2 {
    margin-bottom: 0; 
    margin-left: 0;  
}
        

#bgVid1-index {
    padding-top: 0;
    padding-bottom: 0;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: white;
    max-width: 50%;
    height: auto;
    z-index: -1;
    opacity: 0;
    }

#bgVid1-bis-index {
    padding-top: 0;
    padding-bottom: 0;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: white;
    max-width: 30%;
    height: auto;
    z-index: -1;
    opacity: 0;
    margin-left: 10%;
    }

.slide-left-slider-img-touch {
        margin-left: 1%;
    margin-bottom: 5%;
    }
        
.slide-left-video {
    margin-left: -28%;
    }
        
.h2-page-contact {
    margin: 0;
    margin-top: 0%;
    color: #fff ;  /* #43646B #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 1.6em;
    font-family: 'dosis', sans-serif;
   padding-top: 10%;
    text-align: center;
    padding-bottom: 2%;
    font-weight: 200;
    text-transform: uppercase;
    padding-left: 10%;
    padding-right: 10%;
    }
        
.h2-page-contact-bis {
     padding: 0;
    padding-left: 2%;
    margin-top: 5%;
    font-size: 1em;
    float: left;
    font-family: 'dosis', sans-serif;
    font-weight: 100;
     color: #fff;
     z-index: 99999999;
    
    }
        
.h2-page-contact-bis-1 {
    padding: 0;
    margin-left: 15%;
    padding-top: 8%;
    font-size: 1em;
    float: right;
    font-family: 'dosis', sans-serif;
    font-weight: 100;
    color: #fff;
     z-index: 99999999;
    
    }
    
.img-contact { 
    width: 70%; 
    height: auto;
    margin-bottom: -1%;

    
    }
        
.img-contact-logo {
    float: right;
    width: 40%; 
    height: auto;
    margin-right: 15%;
    margin-top: 10%;
    }

.h2-titre-bis {
    margin: 0;
    margin-top: 5%;
    margin-bottom: 2%;
     color: #607b93;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif; /*'BC Alphapipe L', sans-serif;*/
    font-weight: 300;
   
    } 

.h2deco-bis {
    margin: 0;
    padding-top: 5%;
    margin-top: 0;
    color: #fff;/*#dbdbdb  @1d2d4e*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
    text-transform: uppercase;
    text-align: center;
    }
        

#bgVid2 {
    padding-top: 0;
    position:inherit;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
     background-color: white;
    max-width: 30%;
    height: auto;
    z-index: -1;
    opacity: 0;
    float: right;
    margin-right: 10%;
        }
        
#bgVid1-bis {
    padding-top: 0;
    padding-bottom: 0;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: white;
    max-width: 30%;
    height: auto;
    z-index: -1;
    opacity: 0;
    margin-left: 10%;
        }
        
        
#bgVid2-electra {
    padding-top: 0;
    position:inherit;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
     background-color: white;
    max-width: 30%;
    height: auto;
    z-index: -1;
    opacity: 0;
    float: right;
    margin-right: 10%;
        }
        
#bgVid1-bis-electra {
    padding-top: 0;
    padding-bottom: 0;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: white;
    max-width: 30%;
    height: auto;
    z-index: -1;
    opacity: 0;
    margin-left: 10%;
        }        


#bgVid2-index {
    padding-top: 0;
    position:inherit;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
     background-color: white;
    max-width: 30%;
    height: auto;
    z-index: -1;
    opacity: 0;
    float: right;
    margin-right: 10%;
    }
        
.scroll-bas {
    width: 20px;
    height: 16px;
    position: absolute;
    left: 50%;
    margin-left: -10px;
    bottom: -25%;
    

}

.slide5 {
   padding-top: 60%;
}
        
.slide5-deco {
   padding-top: 5%;
}        
.slide5-bouton {
   margin-top: 10%;
}
        
.copy-r { font-size: 0.5em;}

     

img {
   padding: 0;
    margin: 0;
	border: none; 	
   }



.img-electra {
    width: 300px;
    height: auto;
    float: right;
    z-index: 99999;
	position: absolute;	
	top: 10%;		
    left: 30%;
    
   
   
}
    

.h6deco-contact { 
    font-size: 1.2em;
    color: #fff; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
   margin-top: 2%;
     padding-left: 10%;
    padding-right: 10%;
    text-align: justify;
    
    
     }

.h6deco-contact-bis { 
    font-size: 1.2em;
    color: #fff; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    margin-top: 2%;
     padding-left: 10%;
    padding-right: 10%;
    text-align: justify;
    }        

.h4-contact {
    font-size: 2em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    text-transform: uppercase;
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
    
}   
        
.h3-gite {
    margin: 0;
    margin-top: 0%;
    color: #43646B;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'dosis', sans-serif;
    padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    text-transform: uppercase;
    font-weight: 200;
    line-height: 1;
    }
.span-gite {
    font-size: 0.4em;
    line-height: 0.1;
    
}
        

.h2deco-servannaise {
    margin: 0;
    color: #43646B;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.6em;
    font-family: 'dosis', sans-serif;
    text-align: center;
    padding-bottom: 2%;
    font-weight: 200;
    text-transform: uppercase;
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 5%;
    }
        
        


.span2-colombier h1 {
    position: absolute;
    width: 800px;
    padding-left: 5%;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    padding-top: 25%;
    font-size: 3em;
    line-height: 1;
    opacity: 1;
   
}

.h6proj-colombier { 
    position: absolute;
    width: 600px;
     font-family: 'dosis', sans-serif;
    font-weight: 100;
    color: #dcf0f4;
    padding: 0;
    margin-top: 55%;
    padding-left: 5%;
    font-size: 1.6em;
    float: left;
    line-height: 0.9;
            
    }        
        
  .video-iframe-gite {
	position: relative;
    width: 350px;
    height: 250px;
     vertical-align: middle;
      margin-top: 5%;
      margin-bottom: 5%;
	}
    
.h2deco-video {
    margin: 0;
    margin-top: 2%;
    color: #fff;/*#dbdbdb  #1d2d4e*/
    font-size: 2.2em;
    font-family: 'dosis', sans-serif;
    font-weight: 200;
    text-align: center;
    padding-left: 2%;
    padding-right: 2%;
    } 
    
.img-affiche {
    width: 80%;
    margin-left: 12%;
    margin-bottom: 2%;
    margin-top: 2%;
}
        
.img-affiche-bis {
    width: 80%;
    margin-left: -10%;
    margin-bottom: 2%;
    margin-top: 2%;
}
        

.h1-electra {
    position: absolute;
    width: 400px;
    padding-left: 5%;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    margin-top: -50%;
    font-size: 3em;
    line-height: 1;
    opacity: 1;
    z-index: 999999;
   
}

.h1-electra .span-contenu-prix {
    font-family: 'BC Alphapipe L Regular', sans-serif;
    font-size: 0.5em;
    line-height: 1;
    opacity: 1;
   
}



.h6proj-electra {
    position: absolute;
    width: 700px;
    height: auto;
    padding: 0;
   margin-left: 5%;
    margin-top: -20%;
    font-size: 1.2em;
    float: left;
    font-family: 'dosis', sans-serif;
    font-weight: 100;
    color: #dcf0f4;
     z-index: 999999;
    }

.h1-electra-qui-suis-je {
    position: absolute;
    width: 400px;
    padding-left: -600px;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    margin-top: -45%;
    padding-left: 5%;
    font-size: 2em;
    line-height: 1;
    opacity: 1;
    z-index: 99999999;
    text-shadow: 4px 4px 5px #666;
   
   
}
        
.h1-electra-qui-suis-je .span-contenu-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.5em;
} 
  
    
.h1-cv {
   position: absolute;
    width: 400px;
    padding-left: -600px;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    margin-top: -48%;
    padding-left: 2%;
    font-size: 2em;
    line-height: 1;
    opacity: 1;
    z-index: 99999;
    text-shadow: 4px 4px 5px #666;
   
   
}

.h1-cv .span-contenu-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.3em;
}
        
      
@keyframes slidy {
  0% {
    left: 0%;
  }
  20% {
    left: 0%;
  }
  25% {
    left: -100%;
  }
  45% {
    left: -100%;
  }
  50% {
    left: -200%;
  }
  70% {
    left: -200%;
  }
  75% {
    left: -300%;
  }
  95% {
    left: -300%;
  }
  100% {
    left: -400%;
  }
}


div#slider {
    display: block;
 margin-top: -15%;
    margin-bottom: 15%;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.6);
  overflow: hidden;
    padding: 0 auto;
    z-index: 99999999;
    
}
div#slider figure img {
  width: 20%;
    height: auto;
  float: left;
    
}
div#slider figure {
  position: relative;
    width: 500%;
  margin: 0;
  left: 0;
  text-align: left;
  font-size: 0;
  animation: 25s slidy infinite;
   
    
}
        
.h3-cv {
    margin: 0;
    margin-top: 0%;
    color: #689aad;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    padding-left: 2%;
    padding-right: 2%;
    }
.h3-cv .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1em;
}

.h3-cv .span-contenu-cv {
    color: #689aad; 
    padding:0; 
    margin:0;
    font-size: 0.5em;
    
} 
        
.h6deco-page-amenagement {
    font-size: 1em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    margin-top: 2%;
    padding-left: 10%;
    padding-right: 10%;
    text-align: justify;
    
     }
        
.h1-page-deco-titre-deco {
    position: absolute;
    width: 500px;
    left: 5%;
    padding-left: -600px;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    margin-top: -50%;
    font-size: 2em;
    line-height: 1;
    opacity: 1;
    z-index: 9999999;
   
   
}
.h1-page-deco-titre-deco .span-contenu-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.5em;
}
.h1-page-contact {
    position: absolute;
    width: 350px;
    left: 38%;
    margin-left: -10px;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #43646B;
    margin-top: 40%;
    font-size: 1.6em;
    line-height: 1;
    opacity: 0;
    z-index: 99999999;
    border-left: 4px solid #EEBF00;
   }
    
.h1-page-contact .span-contenu-contact {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.5em;   
    }
        
.titre-galery-conception {
    margin: 0;
    margin-top: -5%;
    padding-bottom: 5%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 3em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    text-transform: uppercase;
    z-index: 99999;
    }
        
.titre-galery-shopping {
    margin: 0;
    margin-top: 5%;
    padding-bottom: 0%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    text-transform: uppercase;
    z-index: 99999;
    }
        
    
.titre-galery-home-staging {
   margin: 0;
    padding-top: 5%;
    padding-bottom: 5%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 3em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    text-transform: uppercase;
    z-index: 99999;
    }
    
.body-conception { 
	margin: 0 auto; 	
	padding: 0 auto;  	
	 background-color: #e7e2e2;
	font-family: 'Dosis', sans-serif; 
	color: #000; 
	line-height: 1.5;
	font-size: 100%;	
    overflow-x: hidden;
    min-width: 100%;
    min-height: 100%;
    padding-bottom: 5%;
  }
        
.body-page-home-staging { 
	margin: 0 auto; 	
	padding: 0 auto;
     padding-bottom: 10%;
	 background-color: #e8e1e2;
	font-family: 'Dosis', sans-serif; 
	color: #000; 
	line-height: 1.5;
	font-size: 100%;	
    overflow-x: hidden;
    min-width: 100%;
    min-height: 100%;
  } 
    
.fond-texte-home-stag-1 {
   background-color: #786B6E;
}
    
.fond-contact-contact {
        background-color: #6d8383;
    }
    
.fond-conception-img {
    background-color: #e7e2e2;
    }
    
.body-page-shopping { 
	margin: 0 auto; 	
	padding: 0 auto;
    padding-bottom: 15%;
	 background-color: #E8D8DC;
	font-family: 'Dosis', sans-serif; 
	color: #000; 
	line-height: 1.5;
	font-size: 100%;	
    overflow-x: hidden;
    min-width: 100%;
    min-height: 100%;
  }
    
.body-page-deco-int { 
	margin: 0 auto; 	
	padding: 0 auto; 
    padding-bottom: 5%;
	 background-color: #F7E4E8;
	font-family: 'Dosis', sans-serif; 
	color: #000; 
	line-height: 1.5;
	font-size: 100%;	
    overflow-x: hidden;
    min-width: 100%;
    min-height: 100%;
  }
        
 .slide-top-galery-tablet {
        margin-top: 5%;
     margin-bottom: 5%;
    }
        
 .slide-top-galery-phone-shop {
        margin-top: 25%;
     margin-bottom: 0;
    }
        
.slide-top-galery-phone-conception {
        margin-top: 10%;
     margin-bottom: 5%;
    }
.slide-70 {margin-top: 0;}    


.h6proj-electra-qui-suis-je {
    position: absolute;
    width: 400px;
    height: auto;
    padding: 0;
    padding-left: 5%;
    margin-top: -20%;
    font-size: 0.6em;
    float: left;
    font-family: 'dosis', sans-serif;
    font-weight: 100;
    color: #dcf0f4;
     z-index: 99999999;
    }



.superpose-electra {
	position: absolute;
    width: 60px;
	top: 3%;		
    left: 50%;
    margin-left: -25px;
    cursor: pointer;
    z-index:2;		
	}
        
 .triangle-code-1 {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 50vh solid transparent;
 border-bottom : 400px solid #3a5560; /*  #689aad */
border-color: transparent transparent #3a5560 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}       
        
.triangle-code-2 {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 50vh solid transparent;
 border-bottom : 400px solid #5c7373; /*  #689aad */
border-color: transparent transparent #5c7373 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.57));
/*box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-webkit-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-moz-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);*/
    z-index: 0;
}       

.triangle-site-colombier {
    position: absolute; 
 display : block;
	width: 0;
	height: 0;
    margin-left: 58%;
	border-width: 0 250px 314px 0;
	border-color: transparent #a09fa7 transparent transparent;
	border-style: solid;
	filter: drop-shadow(0px 5px 4px #A3A3A3);
} 
        
.triangle-site-stmalo {
    position: absolute; 
 display : block;
	width: 0;
	height: 0;
    margin-left: 58%;
	border-width: 0 250px 314px 0;
	border-color: transparent #a68184 transparent transparent;
	border-style: solid;
	filter: drop-shadow(0px 5px 4px #A3A3A3);
}
        
.h4-affiche { 
    font-size: 2.5em;
    padding-top: 5%;
    color: #fff;
    font-family: 'BC Alphapipe L Regular', sans-serif;
}

.h4-affiche-bis { 
    font-size: 2.5em;
    padding-top: 2%;
    margin-left: 0%;
    color: #fff;
    font-family: 'BC Alphapipe L Regular', sans-serif;
}
        
        
.h4-phone {
    opacity: 0;
        }
        
        
        
.h2deco-titre-electra {
    margin: 0;
    margin-top: 0%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    }
.h2deco-titre-electra .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.4em;
}
        
        
.triangle-page-deco-2022-1 {
 position: absolute; 
 display : block;
 height : 0;
 width : 0;
margin-top: 24.5%;
margin-left: 42%;
border-width: 0 0 260px 220px;
	border-color: transparent transparent #a2afab transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}



.triangle-page-deco-2022-2 {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 30vh solid transparent;
 border-bottom : 350px solid #5c7373; /*  #689aad  3a5560*/
border-color: transparent transparent #5c7373 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
}
    
.video-index-deco {
    position: absolute;
    width: 200px;
    height: auto;
    margin-top: -80%;
    margin-left: -12%;
    z-index: 9999;
    /*box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);*/
    padding: 0 auto;
    border: 0;
    border-radius: 0px;
    }
 
.triangle-code-erakis-bis {
    position: absolute; 
    display : block;
    height : 0;
    width : 0;
    margin-top: 24.5%;
    margin-left: 42%;
    border-width: 0 0 260px 220px;
	border-color: transparent transparent #689aad transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}        
        
        
.triangle-code-erakis {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #3a5560; /*  #689aad */
border-color: transparent transparent #3a5560 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.57));
/*box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-webkit-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-moz-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);*/
    z-index: 0;
}

      
        
.h2deco-titre-erakis {
    margin: 0;
    margin-top: 0%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-left: 2%;
    padding-right: 2%;
    }
.h2deco-titre-erakis .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.4em;
}
        
        
.h2deco-erakis {
    margin: 0;
    margin-top: 0%;
    color: #689aad;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.8em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    }
.h2deco-erakis .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.4em;
}

.h2deco-erakis .span-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.3em;
    
} 
 
 .triangle-code-electra-bis {
    position: absolute; 
    display : block;
    height : 0;
    width : 0;
    margin-top: 24.5%;
     margin-left: 42%;
     border-width: 0 0 260px 220px;
	border-color: transparent transparent #268396 transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}        
        
        
.triangle-code-electra {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #256470; /*  #689aad */
border-color: transparent transparent #256470 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.57));
/*box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-webkit-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-moz-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);*/
    z-index: 0;
}



.h2deco-electra {
    margin: 0;
    margin-top: 0%;
    color: #59a8b8;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.8em;
    font-family: 'bc alphapipe l regular', sans-serif;
    padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    
    }
.h2deco-electra .span-templet {
    padding-left: 2%;
    padding-right: 2%;
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.8em;
}

.h2deco-electra .span-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.6em;
    
}


.triangle-page-deco-int-1 {
 position: absolute; 
 display : block;
 height : 0;
 width : 0;
margin-top: 24.5%;
margin-left: 42%;
border-width: 0 0 260px 220px;
	border-color: transparent transparent #AC9FA2 transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}


.triangle-page-deco-int-2 {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #918688; /*  #689aad  3a5560*/
border-color: transparent transparent #918688 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
}        
        
        
        
.triangle-deco-conception {
 position: absolute; 
 display : block;
 height : 0;
 width : 0;
 margin-top: -5%;
    margin-left: 23%;
    border-width: 130px 150px 0 100px;
	border-color: #EEBF00 transparent transparent transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
} 
        
        
.triangle-deco-conception-1 {
 position: absolute; 
 display : block;
 height : 0;
 width : 0;
margin-top: 24.5%;
margin-left: 42%;
border-width: 0 0 260px 220px;
	border-color: transparent transparent #BA99A1 transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}


.triangle-deco-conception-2 {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #947980; /*  #689aad  3a5560*/
border-color: transparent transparent #947980 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
}        
        
.triangle-page-shopping {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #9B8188; /*  #689aad  3a5560*/
border-color: transparent transparent #9B8188 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
}

.triangle-page-shopping-1 {
 position: absolute; 
 display : block;
 height : 0;
 width : 0;
margin-top: 24.5%;
margin-left: 42%;
border-width: 0 0 260px 220px;
	border-color: transparent transparent #A88C93 transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
} 
        
.triangle-page-home-staging-1 {
 position: absolute; 
 display : block;
 height : 0;
 width : 0;
margin-top: 24.5%;
margin-left: 42%;
border-width: 0 0 260px 220px;
	border-color: transparent transparent #9E8D91 transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}

.triangle-page-home-staging {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #786B6E; /*  #689aad  3a5560*/
border-color: transparent transparent #786B6E transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
}

.triangle-code-atria-bis {
    position: absolute; 
    display : block;
    height : 0;
    width : 0;
    margin-top: 24.5%;
    margin-left: 42%;
    border-width: 0 0 260px 220px;
	border-color: transparent transparent #82B0A5 transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}        
        
.triangle-code-atria {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #49635D; /*  #689aad */
border-color: transparent transparent #49635D transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.57));
/*box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-webkit-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-moz-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);*/
    z-index: 0;
}
        
.iframe-atria {
    position: absolute;
    width: 150px;
    height: 90px;
    margin-top: -52%;
    margin-left: 2%;
    z-index: 999;
    padding: 5px; 
}

.iframe-erakis {
    position: absolute;
    width: 150px;
    height: 90px;
    margin-top: -52%;
    margin-left: 2%;
    z-index: 999;
    padding: 5px; 
    
}
        
.iframe-andromede {
    position: absolute;
    width: 150px;
    height: 90px;
    margin-top: -52%;
    margin-left: 2%;
    z-index: 999;
    padding: 5px;  
} 
        
.iframe-electra {
    position: absolute;
   width: 150px;
    height: 90px;
    margin-top: -52%;
    margin-left: 2%;
    z-index: 999;
    padding: 5px;
   
    
}
 .h2deco-titre-atria {
    margin: 0;
    margin-top: 0%;
    color: #5b6178;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    }
.h2deco-titre-atria .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.6em;
}
.h2deco-titre-1-atria {
    margin: 0;
    margin-top: 0%;
    color: #7d5e64;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    }

.h2deco-titre-1-atria .span-forfait {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.6em;
}
        
.h2deco-atria {
    margin: 0;
    margin-top: 0%;
    color: #82B0A5;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.8em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    padding-left: 2%;
    padding-right: 2%;
    }
.h2deco-atria .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1em;
}
.h2deco-atria .span-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.3em;
}
.fond-page-atria-4 { 
    background-color: #537069;
    padding-bottom: 5%;
    
}
.fond-page-andromede-2 { 
    background-color: #6a8482;
    padding-bottom: 5%;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
    }

.triangle-haut-electra {
    position: absolute; 
    display : block;
    height : 0;
    width : 0;
    margin-top: -5%;
    margin-left: 23%;
    border-width: 130px 150px 0 100px;
	border-color: #e2b604 transparent transparent transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
}        
        
        
.triangle-code-andromede-bis {
    position: absolute; 
    display : block;
    height : 0;
    width : 0;
    margin-top: 24.5%;
    margin-left: 42%;
    border-width: 0 0 260px 220px;
	border-color: transparent transparent #6a8482 transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
}        

.triangle-code-andromede {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #46615f; /*  #689aad */
border-color: transparent transparent #46615f transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.57));
/*box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-webkit-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);
-moz-box-shadow: -9px 11px 12px 1px rgba(0,0,0,0.29);*/
    z-index: 0;
}



.h2deco-titre-andromede {
    margin: 0;
    margin-top: 0%;
    color: #5b6178;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.8em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    }
.h2deco-titre-andromede .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.4em;
}

.h2deco-titre-1-andromede {
    margin: 0;
    margin-top: 0%;
    color: #5b6178;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    }

.h2deco-titre-1-andromede .span-forfait {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.4em;
}

.h2deco-andromede {
    margin: 0;
    margin-top: 0%;
    color: #a9b3de;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.8em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    }
.h2deco-andromede .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1em;
}

.h2deco-andromede .span-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.3em;
    
}
        
.h6deco-contenue-offre-1 { 
    font-size: 1.5em;
    color:#fff; /*  #1d2d4e*/
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 2%;
    margin-top: 2%;
    text-align: left;
    padding-left: 2%;
     }

.h6deco-contenue-offre { 
    font-size: 1.4em;
    color: #c6e5e4; /* #d3d6e5 #e1e7ea #19291f*/
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 0%;
    margin-top: 2%;
    padding-left: 2%;
    padding-bottom: 2%;
    text-align: left;
     }

.h6deco-contenue-offre-bis { 
    font-size: 1em;
    color:#fff;
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 5%;
    margin-top: -2%;
    padding-left: 4.5%;
    text-align: left;
    font-weight: 100;
     }
        
  .h6deco-contenue-offre-2 { 
    font-size: 1.4em;
    color: #c6e5e4; /* #dfe7e6 #19291f*/
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 0%;
    margin-top: 2%;
    text-align: left;
    padding-left: 2%;
    padding-bottom: 2%;
     }      
        
.h2deco-titre-1-erakis {
    margin: 0;
    margin-top: 0%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    }

.h2deco-titre-1-erakis .span-forfait {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1em;
}
        
.h2deco-titre-1-electra {
    margin: 0;
    margin-top: 0%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    }

.h2deco-titre-1-electra .span-forfait {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1em;
}
 
.h6deco-bis { 
    font-size: 1.4em;
    color:#505c74;
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 0%;
    padding-top: 3%;
    padding-left: 2%;
    padding-right: 2%;
     }
        
.a5:link, .a5:visited { color: #EEBF00; text-decoration: none; 
    opacity: 0.9; font-weight: bold !important;
    
    }/* #4b4764*/
.a5:hover, .a5:active { color: #BAC8D4 ; text-decoration: none;
    opacity: 1;
    transition: 0.25s ease-in;
    }
    
.a5-cv:link, .a5-cv:visited { color: #EEBF00; text-decoration: none; 
    opacity: 0.9;
    
    }
.a5-cv:hover, .a5-cv:active { color: #4b4764; text-decoration: none;
    opacity: 1;
    transition: 0.25s ease-in;
    }     
        
 #bgVid {
    position: relative;
    right:0;
    bottom:0;
    min-width: 100%;
    min-height: 100%;
    z-index: 1;
    background-size: cover;
    

}         
 
.container-villa {
    margin-left: 18%;
    
    
}

.container-le-clos {
    margin-left: 6%;
    
    
}

.ba-slider-renov {
  position: relative;
  overflow: hidden;
    box-shadow: 0px 35px 77px -17px rgba(0, 0, 0, 0.44);
}

.ba-slider-renov img {
  width: 100%;
  display: block;
}


.ba-slider {
  position: relative;
  overflow: hidden;
    box-shadow: 0px 35px 77px -17px rgba(0, 0, 0, 0.44);
}

.ba-slider img {
  width: 100%;
  display: block;
}

.resize {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 50%;
  overflow: hidden;
}

.handle {
  /* Thin line seperator */
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 4px;
  margin-left: -2px;
  background: rgba(0, 0, 0, 0.5);
  cursor: grabbing;
    
}

.handle:after {
  /* Big orange knob  */
  position: absolute;
  top: 50%;
  width: 44px;
  height: 44px;
  margin: -22px 0 0 -22px;
  content: "⇔";
  color: white;
  font-weight: bold;
  font-size: 26px;
  text-align: center;
  line-height: 44px;
  background: #5c7373;
  /* @orange */
  border: 1px solid #5c7373;
  /* darken(@orange, 5%) */
  border-radius: 50%;
  transition: all 0.3s ease;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3), inset 0 2px 0 rgba(255, 255, 255, 0.5), inset 0 60px 50px -30px #EEC003;
  /* lighten(@orange, 20%)*/
}

.draggable:after {
  width: 48px;
  height: 48px;
  margin: -24px 0 0 -24px;
  line-height: 48px;
  font-size: 30px;
}        
.superpose1 {
    position: absolute;	
    width: 60px;
	top: 5%;
    left: 50%;
    margin-left: -30px;
    z-index: 99999999;
    
    }

.homepage-hero-module {
    border-right: none;
    border-left: none;
    border-top: none;
    position: relative;
    z-index: 1;
}
    
.video-container video,
.touch .video-container video {
    display: block !important;
}


.video-container {
    position: relative;
    top:0;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    overflow: hidden;
    background: none;
    padding-bottom: 56.25%;
}
.video-container .poster img {
    width: 100%;
    bottom: 0;
    position: absolute;
}
.video-container {
    z-index: 100;
    position: absolute;
    width: 100%;
    
}
.video-container video {
    position: absolute;
    height: auto;
    max-width: 100%;
    z-index: 1;
    bottom: 0;
   
    
   }
.video-container video .fillWidth {
    width: 2%;
    height: auto;
    margin-top: 0;
    
    
  }
        
.trame::after {
    position: absolute;
    top:0;
    bottom: 0;
    left:0;
    right:0;
    z-index: 2;
    content: "";
    display: block;
     background: rgba(25, 28, 43, 0.6);
    /*background-image: url('../images/trame-video.png');
    background-repeat: repeat;*/
    
   /* pointer-events: none;  permet de passer au travers de la trame */
    }

.trame-deco::after {
    position: absolute;
    top:0;
    bottom: 0;
    left:0;
    right:0;
    z-index: 999;
    content: "";
    display: block;
     background: rgba(25, 28, 43, 0.6);
    /*background-image: url('../images/trame-video.png');
    background-repeat: repeat;*/
    border: 5px solid #95a781; /*#53737a*/
   /* pointer-events: none;  permet de passer au travers de la trame */
    
    }

.trame-slider::after {
 position: absolute;
    top: 0;
    bottom: 0;
    left:0;
    right:0;
    z-index: 1;
    content: "";
    display: block;
     background: rgba(25, 28, 43, 0.5);
    /*background-image: url('../images/trame-video.png');
    background-repeat: repeat;*/
    border: 5px solid #95a781; /*#53737a*/
   /* pointer-events: none;  permet de passer au travers de la trame */
    
   
    
} 
        
        
.video-iframe-box {
    width: 300px;
    height: 170px;
    vertical-align: middle;
    border: 2px solid #574f55;
    padding: 0px;
    
}        
         
.h5-templet { 
    font-size: 1.2em;
    margin-bottom: 2%;
    color: #505c74;
    border-top: dashed 3px #505c74; /*#EEBF00*/
    text-align: center;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    
    }   
     
/*////////////////////// page qui suis je ////////////////////////*/
        
        
 .h1-qui {
    position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding: 0; 
    top: 50%;
    color: #fff; 
    font-size: 2.5em; 
    font-family: 'bc alphapipe l regular', sans-serif;
    font-weight:100;
    text-transform: uppercase;
    opacity: 1;
    z-index: 14;
}


.motiondesign5 {
    padding-right: 355px;
    padding-left: 355px;
    top: 65%;
    color: #fff; 
    font-size:0.7em; 
    opacity: 1;
    z-index: 15;
    line-height: normal;

    }   
        

 .video-iframe {
    width: 260px;
    height: 200px;
       margin-top: 2%;
      margin-bottom: 5%;
	}       
        
 .p-qui {
    font-size: 1em;
    color:#fff;
    line-height: normal;
    font-family: 'dosis', sans-serif;
    padding-bottom: 5%;
    padding-top: 5%;
      padding-right: 20px;
    padding-left: 20px;
}

.p-qui1 {
    font-size: 1em;
    color:#fff;
    line-height: normal;
    font-family: 'lato', arial;
    padding-bottom: 10%;
    padding-top: 5%;
     padding-right: 20px;
    padding-left: 20px;
}



.p-qui3 {
    font-size: 1em;
    color:#fff;
    line-height: normal;
    font-family: 'dosis', sans-serif;
   vertical-align: middle;
     padding-bottom: 5%;
    padding-top: 20%;
    padding-right: 20px;
    padding-left: 20px;
}
        
 
.caption-templet {
	position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 40%;
	color: #a09fa7;
    opacity: 1;
	background: rgba(28,31,36,0.5);
    overflow: hidden;
	transition: all 0.5s ease;
    margin-bottom: 0%;
   
}
.caption-templet span { 
    position: absolute;
    display: block;
    bottom: 10%;
    left: 0;
    right: 0;
    }
.caption-templet span .h3-bis-box {
    font-family: 'bc alphapipe l regular', sans-serif;
    margin-bottom: 0;
    color: #EEBF00;
    line-height: 1;
    margin-left: 0;
    margin-top: 10%;
     font-size: 2em;
    padding: 0;
    padding-left: 2%;
    padding-right: 2%;
    
}
.caption-templet:hover {
    opacity: 1;
    transition: all 0.5s ease;
   
}
    
.h2deco-box-riva {
    margin: 0;
    margin-top: 5%;
    padding-top: 10%;
    color: #43646B;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    padding-bottom: 2%;
    font-weight: 200;
    line-height: normal;
    }


.h2deco-box {
    margin: 0;
    margin-top: 2%;
    color: #43646B;   /* #83999E */
    font-size: 2.2em;
    font-family: 'bc alphapipe l regular', sans-serif;
    padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    padding-left: 2%;
    padding-right: 2%;
    line-height: normal;
    } 
        
.h6deco-box { 
    font-size: 1.5em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-weight: 200;
    font-family: 'Dosis', sans-serif;
    padding-bottom: 5%;
    margin-top: 0%;
    padding-left: 2%;
    padding-right: 2%;
    
     }
        
.h2deco-conception {
    margin: 0;
    margin-top: 0%;
    color: #FAE6EB;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    padding-left: 2%;
    padding-right: 2%;
    }
.h2deco-conception .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.5em;
} 
.h2deco-conception .span-contenu-conception {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 0.8em;
}
        
.h2deco-shopping {
    margin: 0;
    color: #FAE6EB;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    padding-left: 2%;
    padding-right: 2%;
    }
.h2deco-shopping .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.5em;
}
.h2deco-shopping .span-contenu-prix {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1em;
    
}
        
.h2deco-home-staging-titre {
    margin: 0;
    margin-top: 0%;
    color: #689aad;   /*  #607b93 #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.2em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    padding-bottom: 2%;
    }
.h2deco-home-staging-titre .span-templet {
    color: #EEBF00; 
    padding:0; 
    margin:0;
    font-size: 1.2em;
}
    
/*////////////////////////// debut lightbox //////////////////////////////*/

.lightbox {
    display: none;
    z-index: 999;
    margin:0;
    padding: 0;
    
    
}

.featherlight-content { /* cible le premier niveau des div juste apres et pas les autres div */
    margin: 0 auto;
    margin: 0 auto;  /*20vh de marin en bas et en haut =40 + les 60vh du height = 100% de la hauteur */
    width: 85%;
    height: 85vh;  /*hauteur de la page viewport height */
    background-color: #fff; 
    border-radius: 0px;
    overflow-y: auto;
    margin-bottom: 2%;
    
}
    
.espace-img-box {
       margin-top: 10%; 
    }
    
.h6-light-box { 
    font-size: 1.4em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    margin-top: 2%;
     margin-right: 2%;
    margin-left: 2%;
    text-align: justify;
    
     }
    
.img-riva {
    margin-top: 25%;
    margin-left: 8%;
    padding-bottom: 5%;
} 
.taille70-phone {
       width: 100%; 
       height: auto;     
        }
    
.videowrapper1 {
	position: relative;
    max-width: 100%;
    margin: 0;
	padding-top: 0;
	padding-bottom: 56.25%; /* 16:9 */
    margin-bottom: 0;
    margin-top: 3%;
	}
.videowrapper1 iframe {	/* Cible iframe contenu dans l'élément qui possède la class videowrapper */
	position: absolute;
    margin: 0;
	top: 0;
	left: 0;
    right: 0;
	width: 120%;
	height: auto;
    margin-left: 20%;
    
    }
    
.videowrapper1-phone {
	position: relative;
    max-width: 100%;
    margin: 0;
	padding-top: 0;
	padding-bottom: 56.25%; /* 16:9 */
    margin-bottom: 0;
    margin-top: 3%;
	}
.videowrapper1-phone iframe {	/* Cible iframe contenu dans l'élément qui possède la class videowrapper */
	position: absolute;
    margin: 0;
	top: 0;
	left: 0;
    right: 0;
	width: 120%;
	height: auto;
    margin-left: -40%;
    
    } 
    
.videowrapper2 {
	position: relative;
    min-width: 100%;
    margin: 0;
	padding-top: 0;
	padding-bottom: 56.25%; /* 16:9 */
    margin-bottom: 0;
    margin-top: 3%;
	}
.videowrapper2 iframe {	/* Cible iframe contenu dans l'élément qui possède la class videowrapper */
	position: absolute;
    margin: 0;
	top: 0;
	left: 0;
    right: 0;
	width: 90%;
	height: 90%;
    margin-left: 5%;
    margin-bottom: 10%;
	}

.videowrapper3 {
	position: relative;
    min-width: 100%;
    margin: 0;
	padding-top: 0;
	padding-bottom: 56.25%; /* 16:9 */
    margin-bottom: 0;
    margin-top: 3%;
    
    
	}
.videowrapper3 iframe {	/* Cible iframe contenu dans l'élément qui possède la class videowrapper */
	position: absolute;
    margin: 0;
	top: 0;
	left: 0;
    right: 0;
	width: 90%;
	height: 90%;
    margin-left: 5%;
    margin-bottom: 10%;
   
	}

.videowrapper4 {
	position: relative;
    min-width: 100%;
    margin: 0;
	padding-top: 0;
	padding-bottom: 56.25%; /* 16:9 */
    margin-bottom: 0;
    cursor: pointer;
	}
.videowrapper4 iframe {	/* Cible iframe contenu dans l'élément qui possède la class videowrapper */
	position: absolute;
    margin: 0;
	top: 0;
	left: 0;
    right: 0;
	width: 80%;
	height: 80%;
    margin-left: 10%;
    margin-right: 10%;
    
	}
        
.fond-templet-1 {
            background: url('../images/bg-8-projet-fin-annee.png');
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center center;
            margin: 0;
            padding-top: 200px;
            padding-bottom: 180px;
            width: 100%;
            height: auto;
            margin-left: 0%;
            margin-right: 0%;
    

            }

.fond-templet-2 {
            background: url('../images/bg-5-projet-web-jeux.png'); 
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center center;
            margin: 0;
            padding-top: 200px;
            padding-bottom: 180px;
            width: 100%;
            height: auto;
            margin-left: 0%;
            margin-right: 0%;
        }



.fond-templet-3 {
            background: url('../images/bg-4-projet-web-riva.png');
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center center;
            margin: 0;
            padding-top: 200px;
            padding-bottom: 180px;
            width: 100%;
            height: auto;
            margin-left: 0%;
            margin-right: 0%;
           
}  
        
        
        
.fond-templet-4 {
            background: url('../images/bg-6-projet-film-anim.png');
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center center;
            margin: 0;
            padding-top: 200px;
            padding-bottom: 180px;
            width: 100%;
            height: auto;
            margin-left: 0%;
            margin-right: 0%;
           
}
        

      
.h2jeux {
     padding-top: 5%;
    padding-bottom: 0%;
    padding-left: 5%;
    font-weight: 200;
    color: #607b93;
    font-size: 0.5em;
    font-family: 'bc alphapipe l regular', sans-serif;
    text-transform: uppercase;
    } 
    
.h2jeux1 {
    padding-top: 15%;
    padding-left: 12%;
    color: #607b93;/*#dbdbdb*/
    font-size: 2em;
    padding-bottom: 10%;
    font-family: 'bc alphapipe l regular', sans-serif;
    text-transform: uppercase;

    }
.h2jeux1-bis {
    padding-top: 5%;
    padding-left: 5%;
    padding-bottom: 2%;
    color: #607b93;/*#dbdbdb*/
    font-size: 2em;
    font-family: 'bc alphapipe l regular', sans-serif;
    text-transform: uppercase;

    }
    

        
.h2jeux-box {
    padding-top: 5%;
   padding-left: 5%;
    font-size: 1.4em;
    color: #b6bfbe;/*#dbdbdb*/
   font-family: 'BC Alphapipe L Regular', sans-serif;
    text-transform: uppercase;
    line-height: normal;


    }
.h2jeux1-box {
    margin-top: 10%;
    padding-top: 1%;
    padding-left: 12%;
    color: #b6bfbe;/*#dbdbdb*/
    padding-bottom: 15%;
    font-size: 1.4em;
    font-family: 'bc alphapipe l regular', sans-serif;
    text-transform: uppercase;

    }



.h2jeuxbis {
    padding-top: 5%;
    color: #30648c;/*#dbdbdb*/
    font-size: 1.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-transform: uppercase;

    }

        
.slide5-bouton {
   margin-top: 2%;
    margin-bottom: 2%;
}
        
        
.caption-deco-templet {
	position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #dbf1f4;
    opacity: 1;
	background: rgba(28,31,36,0.6);
    overflow: hidden;
	transition: all 0.5s ease;
   
}
.caption-deco-templet span { 
    position: absolute;
    display: block;
    bottom: 40%;
    left: 0;
    right: 0;
    
    }
.caption-deco-templet span h4 {
    padding: 0;
    font-size: 1.8em;
    margin-left: 5px;
    line-height: 1;
    color: #EEBF00;
    /*text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.50);*/
    
}
.caption-deco-templet:hover {
    opacity: 1;
    transition: all 0.5s ease;
   
}
span { 
    margin-left: 5%;
    margin-top: -5%;
    }

span .h6proj-deco {
    font-family: 'dosis', sans-serif;
    font-size: 1em;
    margin-left: 5px;
    line-height: 1;
    color: #dee9ec;
    
}
        
.bouton6-page-index-deco {
    position: relative;
    margin-right: 0;
	display: inline-block;
	zoom: 1;
	margin: 0; 	/* pour repousser (ou pas) les boutons entre eux */ /* Block en ligne pour consolider les paddings limités par la hauteur du texte */
	padding: 10px 20px;	
    margin-bottom: 0%;
    margin-top: -35%;
    margin-left: 8%;
	background-color: #EEBF00;
	font-family: 'Dosis', sans-serif; 
	/*font-weight: bold;*/
	font-size: 1.2em;
	color: #4b4764; /* #1c3148*/
   
	vertical-align: middle;	/* permet l'alignement vertical sur la ligne de texte (images, icones, etc.) */
	/*border: 2px solid #000;*/
    cursor: pointer;
    
	}
.bouton6-page-index-deco:link, .bouton6-page-index-deco:visited { 
	background-color: none; 
	color: #1c3148;
	text-decoration: none; 
	transition: 0.2s ease-out; 
	}
.bouton6-page-index-deco:hover, .bouton6-page-index-deco:active { 
	background-color: rgba(40,48,61,.8);  
	color: #EEBF00;
	text-decoration: none; 
	transition: 0.2s ease-in;
    box-shadow: 0 10px 5px rgba(40,48,61,.2);
	}
        
 .h6proj-page-amenagemnt {
    position: absolute;
    width: 300px;
    height: auto;
    padding: 0;
    padding-left: 5%;
    margin-top: -15%;
    font-size: 0.8em;
    float: left;
    font-family: 'dosis', sans-serif;
    font-weight: 100;
    color: #dcf0f4;
     z-index: 999999;
    } 
    
.caption-bis-templet {
	position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #dbf1f4;
    opacity: 1;
	background: rgba(28,31,36,0.6);
    overflow: hidden;
	transition: all 0.5s ease;
   
}
.caption-bis-templet span { 
    position: absolute;
    display: block;
    bottom: 48%;
    padding-left: 5%;
    left: 0;
    right: 0;
    }
.caption-bis-templet span h4 {
    padding: 0;
    font-size: 3.2em;
    color: #EEBF00;
    /*text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.50);*/
    
}
.caption-bis-templet h4 .span-tarif {
    position: absolute;
    font-family: 'dosis', sans-serif;
    font-size: 0.2em;
    color: aliceblue;
    margin-left: 55%;
    margin-bottom: 10%;
}
    
.caption-bis-templet span .h6proj {
    font-family: 'dosis', sans-serif;
    font-size: 1.4em;
    
    line-height: 1;
    color: #dee9ec;
    
}
.caption-bis-templet:hover {
    opacity: 1;
    transition: all 0.5s ease;
   
}
span { 
    margin-left: 8%;
    margin-top: 0;
    }


        

.caption-bis-templet-1 {
	position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #dbf1f4;
    opacity: 1;
	background: rgba(28,31,36,0.6);
    overflow: hidden;
	transition: all 0.5s ease;
   
}
.caption-bis-templet-1 span { 
    position: absolute;
    display: block;
    bottom: 40%;
    padding-left: 5%;
    left: 0;
    right: 0;
    }
.caption-bis-templet-1 span h4 {
    padding: 0;
    font-size: 3.2em;
    color: #EEBF00;
    /*text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.50);*/
    
}
.caption-bis-templet-1 h4 .span-tarif {
    position: absolute;
    font-family: 'dosis', sans-serif;
    font-size: 0.2em;
    color: aliceblue;
    margin-left: 55%;
    margin-bottom: 10%;
}
    
.caption-bis-templet-1 span .h6proj {
    font-family: 'dosis', sans-serif;
    font-size: 1.4em;
    line-height: 1;
    color: #dee9ec;
    
}
.caption-bis-templet-1:hover {
    opacity: 1;
    transition: all 0.5s ease;
   
}




.caption-bis-templet-2 {
	position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #dbf1f4;
    opacity: 1;
	background: rgba(28,31,36,0.6);
    overflow: hidden;
	transition: all 0.5s ease;
   
}
.caption-bis-templet-2 span { 
    position: absolute;
    display: block;
    bottom: 40%;
    padding-left: 5%;
    left: 0;
    right: 0;
    }
.caption-bis-templet-2 span h4 {
    padding: 0;
    font-size: 3.2em;
    color: #EEBF00;
    /*text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.50);*/
    
}
    
.caption-bis-templet-2 h4 .span-tarif {
    position: absolute;
    font-family: 'dosis', sans-serif;
    font-size: 0.2em;
    color: aliceblue;
    margin-left: 55%;
    margin-bottom: 10%;
}
    
.caption-bis-templet-2 span .h6proj {
    font-family: 'dosis', sans-serif;
    font-size: 1.4em;
    line-height: 1;
    color: #dee9ec;
    
}
.caption-bis-templet-2:hover {
    opacity: 1;
    transition: all 0.5s ease;
   
}



.caption-bis-templet-3 {
	position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #dbf1f4;
    opacity: 1;
	background: rgba(28,31,36,0.6);
    overflow: hidden;
	transition: all 0.5s ease;
   
}
.caption-bis-templet-3 span { 
    position: absolute;
    display: block;
    bottom: 40%;
    padding-left: 5%;
    left: 0;
    right: 0;
    }
.caption-bis-templet-3 span h4 {
    padding: 0;
    font-size: 3.2em;
    color: #EEBF00;
    /*text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.50);*/
    
}
    
.caption-bis-templet-3 h4 .span-tarif {
    position: absolute;
    font-family: 'dosis', sans-serif;
    font-size: 0.2em;
    color: aliceblue;
    margin-left: 55%;
    margin-bottom: 10%;
}
    
.caption-bis-templet-3 span .h6proj {
    font-family: 'dosis', sans-serif;
    font-size: 1.4em;
    line-height: 1;
    color: #dee9ec;
    
}
.caption-bis-templet-3:hover {
    opacity: 1;
    transition: all 0.5s ease;
   
}
        


.h6deco-page-deco-1 { 
    font-size: 1em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    margin-top: 2%;
    padding-left: 10%;
    padding-right: 10%;
    text-align: justify;
    
     }
        
.slide-img-conception {
    margin-top: 105%;
    margin-left: 5%;
}
        
.slideicone-phone {
    margin-top: 55%;
    margin-bottom: 10%;
    }       
.h6deco-moi { 
    font-size: 1.4em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    margin-top: 2%;
    margin-left: 5%;
    margin-right: 5%;
    text-align: justify;
    
     }
        
.h6deco-moi-deco { 
    font-size: 1.4em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    margin-top: 2%;
    padding-left: 10%;
    padding-right: 10%;
    text-align: justify;
    
     }
        
     
.h6proj-electra-cv {
    position: absolute;
    width: 800px;
    height: auto;
    padding: 0;
    padding-left: 6%;
    margin-top: -18%;
    font-size: 0.4em;
    float: left;
    font-family: 'dosis', sans-serif;
    font-weight: 100;
    color: #dcf0f4;
     z-index: 99999999;
    }
        
.titre-deco-reno {
    margin-top: 5%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    text-transform: uppercase;
    z-index: 999999999;
    }
        
.p1-reno {
     line-height: 1.5;
    font-family: 'dosis', sans-serif;
     font-weight: 200;
    color: #505c74; /* #857a80 */
    font-size: 1.2em;
    padding-left: 10%;
    padding-right: 10%;
    text-align: justify;
    

}
  
.p1-siteweb {
    font-family: 'dosis', sans-serif;
   font-weight: 300;
    color: #574f55;
    font-size: 1.5em;
   line-height: 1.5;
    margin-top: 5%;
    margin-bottom: 10%;
    padding-left: 0%;
  

}
    
.triangle-cv {
    position: absolute; 
    display : block;
    height : 0;
    width : 0;
    margin-top: 24.5%;
    margin-left: 42%;
    border-width: 0 0 260px 220px;
	border-color: transparent transparent #6391aa transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.57));
    z-index: 0;
} 

    
.triangle-cv-bis {
    position: absolute; 
    display : block;
    height : 0;
    width : 0;
    margin-top: -5%;
    margin-left: 23%;
    border-width: 130px 150px 0 100px;
	border-color: #EEBF00 transparent transparent transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
} 
    
    
/*--.wrap {
  margin: 50px auto 0 auto;
  width: 100%;
   padding-bottom: 5%;
  align-items: space-around;
  max-width: 1000px;
}
.tile {
  width: 450px;
  height: 600px;
  margin: 10px;
  background-color: #367e7f;
  display: inline-block;
  background-size: cover;
  position: relative;
  cursor: pointer;
  transition: all 0.4s ease-out;
  box-shadow: 0px 35px 77px -17px rgba(0, 0, 0, 0.44);
  overflow: hidden;
  color: white;
  font-family: 'dosis', sans-serif;
}
    
.tile h1 {
  font-weight: 300;
font-size: 2em;
    font-family: "bc alphapipe l regular", sans-serif;
    text-transform: uppercase;
  margin: 0;
  text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
    color: #EEBF00; 
}
.tile h2 {
    font-size: 0.8em;
  font-weight: 100;
  margin: 20px 0 0 0;
  font-style: italic;
  transform: translateX(200px);
}
.tile p {
    font-size: 0.3em;
  font-weight: 300;
  margin: 10px 0 0 0;
  line-height: 20px;
   opacity:0;
  transform: translateX(-200px);
  transition-delay: 0.2s;
}--*/
        
 
.h6-cv {
    margin-top: 10%;
    padding-bottom: 2%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 1.8em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    text-transform: uppercase; 
    
}    
    
    


.repousse-colonne2, .marge-c2 {
	margin-left: 2%!important;
    margin-bottom: 10%;
	}    
  
    
.triangle-cv-realisation {
 position: absolute; 
 display : block;
 height : 0;
 width : 0;
margin-top: 19.5%;
margin-left: 41%;
border-width: 0 0 400px 600px;
	border-color: transparent transparent #3a5560 transparent;
	border-style: solid;
	filter: drop-shadow(-11px -6px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
    opacity: 0;
}
.parent-cv {
  display: none;
} 
        
.parent-deco {
display: none;
}
        
.parent-conception {
 display: none;
}
        
.parent-shopping {
 display: none;
} 
        
.parent-home-staging{
    display: none;
} 

.triangle-galerie-realisation {
    display: none;
}

.triangle-galerie-realisation-1 {
    display: none;
}        
.triangle-cv-realisation-phone {
    display: none;
}
        
.triangle-deco-conception-1-bis {
    display: none;
}
        
.triangle-page-shopping-1-bis {
    display: none;
}

.triangle-page-shopping-bis {
    display: none;
}
.triangle-deco-conception-2-bis {
    display: none;
}
.triangle-page-home-staging-1-bis{
    display: none;
}
        
.triangle-page-home-staging-bis {
    display: none;
}

.triangle-code-erakis-cv {
 position: static; 
 display : block;
 height : 0;
 width : 0;
 border-right : 40vh solid transparent;
 border-bottom : 350px solid #3a5560; /*  #689aad  3a5560*/
border-color: transparent transparent #3a5560 transparent;
	border-style: solid;
	filter: drop-shadow(12px 2px 7px rgba(163, 163, 163, 0.70));
    z-index: 0;
}
        
.triangle-code-erakis-cv-phone {
opacity: 0
}
        
.slide-bottom-section-cv {margin-top: 18%; opacity: 1;}
        

    
.parent {
  width: 400px;
  height: 300px;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin-top: 25%;
  margin-left: 8%;
    margin-bottom: 8%;
  overflow: hidden;
  position: relative;
  -webkit-box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
  box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
  z-index: 999999999;
}
    
.titre-cv {
    position: absolute;
    margin: 0;
    margin-top: -25%;
    margin-left: 26%;
    padding-bottom: 3%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 3em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    text-transform: uppercase;
    z-index: 999999999;
    }
    
.p-qui2-moi-cv {
    font-size: 1.4em;
    color:#1d2d4e;
    line-height: normal;
    font-family: 'dosis', sans-serif;
    font-weight: 200;
    margin-bottom: 20%;
   margin-top: 5%;
    padding-left: 5%;
    padding-right: 5%;
    text-align: justify,
}
     
.slide-wrap {
    margin-top: 5%;
    margin-bottom: 5%;
}

.wrap {
   margin: 60px auto 0 auto;
    width: 100%;
    padding-bottom: 5%;
    align-items: space-around;
    max-width: 900px;
    margin-top: 5%;
    margin-left: 2%;
}
.tile {
  width: 500px;
  height: 700px;
  margin: 20px;
  background-color: #4f6469; /*#367e7f*/
  display: inline-block;
  background-size: cover;
  position: relative;
  cursor: pointer;
  transition: all 0.4s ease-out;
  box-shadow: 0px 35px 77px -17px rgba(0, 0, 0, 0.44);
  overflow: hidden;
  color: #dcf0f4;
  font-family: 'dosis', sans-serif;
}
.tile img {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  transition: all 0.4s ease-out;
}
.tile .text {
  /*   z-index:99; */
  position: absolute;
  padding: 30px;
  height: calc(100% - 60px);
}
.tile h1 {
  font-weight: 300;
font-size: 2.5em;
    font-family: "bc alphapipe l regular", sans-serif;
    text-transform: uppercase;
  margin: 0;
  text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
    color: #EEBF00; /*9bd1e7*/
}
.tile h2 {
    font-size: 1.4em;
  font-weight: 400;
  margin: 20px 0 0 0;
  font-style: italic;
  transform: translateX(200px);
}
.tile p {
    font-size: 1em;
  font-weight: 300;
  margin: 10px 0 0 0;
  line-height: 25px;
  /*   opacity:0; */
  transform: translateX(-200px);
  transition-delay: 0.2s;
}
.animate-text {
  opacity: 0;
  transition: all 0.6s ease-in-out;
}
.tile:hover {
  /*   background-color:#99aeff; */
  box-shadow: 0px 35px 77px -17px rgba(0, 0, 0, 0.64);
  transform: scale(1.05);
}
.tile:hover img {
  opacity: 0.1;
}
.tile:hover .animate-text {
  transform: translateX(0);
  opacity: 1;
}


.tile:hover span {
  opacity: 1;
  transform: translateY(0px);
}
    
    
    
    
    
    
.titre-moi-cv-1 {
    margin: 0;
    margin-top: 65%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
  
    text-align: center;
    text-transform: uppercase;
    }

.titre-moi-cv {
    margin: 0;
    padding-top: 5%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    
    text-align: center;
    text-transform: uppercase;
    }
    
    
.body-cv-1 { 
	   background: url('../images/papier-peint-cv.png');
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed;
        background-position: center center;
        margin: 0 auto;
     padding: 0 auto;
     z-index: 5;
    
  }
    
.body-cv { 
	margin: 0 auto; 	
	padding: 0 auto;  	
	 background-color: #ddeded;
	font-family: 'Dosis', sans-serif; 
	color: #000; 
	line-height: 1.5;
	font-size: 100%;	
    overflow-x: hidden;
    min-width: 100%;
    min-height: 100%;
    padding-bottom: 5%;
  }
    
.body-cv-bis { 
	margin: 0 auto; 	
	padding: 0 auto;  	
	 background-color: #c9dbda;/* #ddeded*/
	font-family: 'Dosis', sans-serif; 
	color: #000; 
	line-height: 1.5;
	font-size: 100%;	
    overflow-x: hidden;
    min-width: 100%;
    min-height: 100%;
    padding-bottom: 5%;
  }
    
.h6deco-cv { 
    width: 100%;
    font-size: 1em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    margin-top: 2%;
    padding-left: 10%;
    padding-right: 10%;
    text-align: justify;
    
     }
    

.iframe-cv-video {
    width: 320px;
    height: 180px;
    margin-top: 5%;
    margin-bottom: 5%;
    margin-left: 5%;
}
.trait-texte-gauche {
	padding-left: 20px;
	border-left: 1px solid white;
	}
    
.h6-cv {
   padding-bottom: 5%;
    padding-top: 3%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 2.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
    text-align: center;
    text-transform: uppercase; 
    
}
    
.h4-cv {
     font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    margin-top: 4%;
    font-size: 1.6em;
    line-height: 1;
    text-transform: uppercase;
    
    
}

.h4-cv-bis {
     font-family: 'BC Alphapipe L Regular', sans-serif;
    color: #EEBF00;
    margin-top: 2%;
    font-size: 1.6em;
    line-height: 1;
    text-transform: uppercase;
    
}
    
.slide-cv-1 {
    margin-left: 5%;
}
    
.espace-colonne {
    margin-top: 5%;
    
}
    
.slide-img-cv {
    padding-top: 0;
}
.img-cv {
    width: 80%;
    height: auto;
    margin-top: -5%;
    margin-left: 12%;
   
    }

    
.h6deco-moi-cv { 
    font-size: 0.8em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    margin-top: 2%;
   text-align: justify;
    }
    
.h6deco-cv-bis { 
    font-size: 1.8em;
    color: #505c74; /*  #1d2d4e */
    line-height: normal;
    font-family: 'Dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 5%;
    margin-top: 0;
    padding-left: 5%;
    padding-right: 12%;
    text-align: justify;
    }
    
.colonne6-tablet {
        width: 96.875%;  
        }
    
    
.skillbar {
	position:relative;
	display:block;
	margin-bottom:15px;
	width:100%;
	background:#eee;
	height:35px;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-webkit-transition:0.6s linear;
	-moz-transition:0.6s linear;
	-ms-transition:0.6s linear;
	-o-transition:0.6s linear;
	transition:0.6s linear;
	-webkit-transition-property:width, background-color;
	-moz-transition-property:width, background-color;
	-ms-transition-property:width, background-color;
	-o-transition-property:width, background-color;
	transition-property:width, background-color;
}

.skillbar-title {
	position:absolute;
	top:0;
	left:0;
    width:110px;
	font-weight:bold;
	font-size:13px;
	color:#ffffff;
	background:#6adcfa;
	-webkit-border-top-left-radius:3px;
	-webkit-border-bottom-left-radius:4px;
	-moz-border-radius-topleft:3px;
	-moz-border-radius-bottomleft:3px;
	border-top-left-radius:3px;
	border-bottom-left-radius:3px;
}

.skillbar-title span {
	display:block;
	background:rgba(0, 0, 0, 0.1);
	padding:0 20px;
	height:35px;
	line-height:35px;
	-webkit-border-top-left-radius:3px;
	-webkit-border-bottom-left-radius:3px;
	-moz-border-radius-topleft:3px;
	-moz-border-radius-bottomleft:3px;
	border-top-left-radius:3px;
	border-bottom-left-radius:3px;
}

.skillbar-bar {
	height:35px;
	width:0px;
	background:#6adcfa;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
}

.skill-bar-percent {
	position:absolute;
	right:10px;
	top:0;
	font-size:11px;
	height:35px;
	line-height:35px;
	color:#ffffff;
	color:rgba(0, 0, 0, 0.4);
}
    
    
    
    
    
    
    
 .slide1 {
  background-image: url('../images/img-realisation-1.jpg');
}

.slide2 {
  background-image: url('../images/img-realisation-2.jpg');
}

.slide3 {
  background-image: url('../images/img-realisation-3.jpg');
}

.slide4 {
  background-image: url('../images/img-realisation-4.jpg');
}       
.slide1, .slide2, .slide3, .slide4 {
  position: absolute;
  background-position: center;
  background-size: cover;
  color: #fff;
  font-size: 52px;
  padding-top: 200px;
  font-weight: 800;
  font-family: 'bc alphapipe l regular', sans-serif;
  text-align: center;
  width: 25%;
  height: 100%;
  z-index: 10;
  transition: 1.4s;
}
        
.right {
  margin-left: 350px;
  margin-top: 230px;
  border: 1px solid #849494;
  background-color: transparent;
  transition: 0.5s;
}
        
.bouton6-templet {
    position: relative;
    margin-right: 0;
	display: inline-block;
	zoom: 1;
	margin: 0; 	/* pour repousser (ou pas) les boutons entre eux */ /* Block en ligne pour consolider les paddings limités par la hauteur du texte */
	padding: 10px 20px;	
    margin-bottom: 1%; 
    margin-top: 50%;
    margin-left: 12%;
	background-color: #EEBF00;
	font-family: 'Dosis', sans-serif; 
	/*font-weight: bold;*/
	font-size: 1.2em;
	color: #4b4764;
	/*border: 2px solid #000;*/
    cursor: pointer;
    
	}
.bouton6-templet:link, .bouton6-templet:visited { 
	background-color: none; 
	color: #1c3148;
	text-decoration: none; 
	transition: 0.2s ease-out; 
	}
.bouton6-templet:hover, .bouton6-templet:active { 
	background-color: rgba(40,48,61,.8);  
	color: #ae8e96;
	text-decoration: none; 
	transition: 0.2s ease-in;
    box-shadow: 0px 10px 5px rgba(40,48,61,.2);
	}
    
    
.bouton6-templet-deco {
    position: relative;
    margin-right: 0;
	display: inline-block;
	zoom: 1;
	margin: 0; 	/* pour repousser (ou pas) les boutons entre eux */ /* Block en ligne pour consolider les paddings limités par la hauteur du texte */
	padding: 10px 20px;	
    margin-bottom: 1%; 
    margin-top: 52%;
    margin-left: 7%;
	background-color: #EEBF00;
	font-family: 'Dosis', sans-serif; 
	/*font-weight: bold;*/
	font-size: 1.2em;
	color: #4b4764; /* #1c3148*/
   vertical-align: middle;	/* permet l'alignement vertical sur la ligne de texte (images, icones, etc.) */
	/*border: 2px solid #000;*/
    cursor: pointer;
    
	}
.bouton6-templet-deco:link, .bouton6-templet-deco:visited { 
	background-color: none; 
	color: #1c3148;
	text-decoration: none; 
	transition: 0.2s ease-out; 
	}
.bouton6-templet-deco:hover, .bouton6-templet-deco:active { 
	background-color: rgba(40,48,61,.8);  
	color: #EEBF00;
	text-decoration: none; 
	transition: 0.2s ease-in;
    box-shadow: 0 10px 5px rgba(40,48,61,.2);
	}
 
/*//////////////////////////// page contact  /////////////////////////*/
    
 .h1-contact {
    position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding: 0; 
    top: 55%;
    color: #fff; 
    font-size: 2.5em; 
    font-family: 'bc alphapipe l regular', sans-serif;
    text-transform: uppercase;
    text-align: center;
    opacity: 1;
    z-index: 14;
}
        

        
.video-moi {
    position: absolute;
    width: 200px;
    height: auto;
    left: 40%;
    margin-top: -50%;
    }
        
.video-page-conception {
     position: absolute;
    width: 200px;
    height: auto;
    left: 40%;
    margin-top: -50%;
    
    }
        
.titre-conception-1 {
    margin: 0;
    margin-top: 0%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 1.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 10%;
    margin-left: 5%;
    text-align: center;
    text-transform: uppercase;
    z-index: 9999999;
    } 
        
.p-page-home-staging {
     color: #505c74; 
    padding:0; 
    margin:0;
    font-size: 1.8em;
    text-align: left;
    margin-left: 15%;
    margin-top: 5%;
    
}

.p-page-home-staging-bis {
     color: #505c74; 
    padding:0; 
    margin:0;
    font-size: 1.8em;
    text-align: left;
    margin-left: 15%;
    margin-top: -5%;
    padding-bottom: -5%;
}
        
.titre-shopping-1 {
    margin: 0;
    margin-top: 0%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 1.5em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 8%;
    text-align: center;
    text-transform: uppercase;
    margin-left: 5%;
    margin-right: 5%;
    }

.titre-moi {
    margin: 0;
    margin-top: 0%;
    color: #3a5560;   /*  #4b4764 #1d2d4e #dbdbdb*/
    font-size: 3em;
    font-family: 'BC Alphapipe L Regular', sans-serif;
   padding-top: 2%;
    text-align: center;
    text-transform: uppercase;
    }

        
 .taille100-box-maquette { 
     width: 80%; 	
	height: auto;
     margin-left: 10%;
     margin-top: 5%;
     margin-bottom: 5%;
     
	} 
    
.vignette-box {
    width: 40%;
    height: 100%;
    display: none;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden; 
    cursor: pointer;
    left:0;
    margin: 20px;
    }
.vignette-box img { 
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    
    }

.vignette-box .vignette-caption {
    background: rgba(28,31,36,0.5);
    position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #d1cfd4;
    opacity: 1;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    }

.vignette-box:hover .vignette-caption {opacity: 1;}

.vignette-box:hover img {
    transform: scale(1.15);
    -webkit-transform: scale(1.15);
	-moz-transform: scale(1.15);
    -o-transform: scale(1.15);
    }
        
.vignette-conception {
    width: 80%;
    height: 80%;
    display: block;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;  /* gestion du depassement cache le dépasement */
    cursor: pointer;
    left: 10%;
    margin: 10px;
    }
.vignette-conception img { 
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    
    }

.vignette-conception .vignette-caption {
    background: rgba(28,31,36,0.5);
    position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #d1cfd4;
    opacity: 0;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    }

.vignette-conception:hover .vignette-caption {opacity: 1;}

.vignette-conception:hover img {
    transform: scale(1.15);
    -webkit-transform: scale(1.15);
	-moz-transform: scale(1.15);
    -o-transform: scale(1.15);
    }
        
        
.vignette {
    width: 80%;
    height: 80%;
    display: block;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;  /* gestion du depassement cache le dépasement */
    cursor: pointer;
    left: 0%;
   margin-left: 15%;
    margin-right: 5%;
    margin-bottom: 15px;
    }
.vignette img { 
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    
    }

.vignette .vignette-caption {
    background: rgba(28,31,36,0.5);
    position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #d1cfd4;
    opacity: 0;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    }

.vignette:hover .vignette-caption {opacity: 1;}

.vignette:hover img {
    transform: scale(1.15);
    -webkit-transform: scale(1.15);
	-moz-transform: scale(1.15);
    -o-transform: scale(1.15);
    }

.vignette-realisation {
    width: 80%;
    height: 80%;
    display: block;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;  /* gestion du depassement cache le dépasement */
    cursor: pointer;
     left: 0%;
   margin-left: 15%;
    margin-right: 5%;
    margin-bottom: 15px;
    }
.vignette-realisation img { 
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    
    }

.vignette-realisation .vignette-caption {
    background: rgba(28,31,36,0.5);
    position: absolute;
    height: 100%;
    width: 100%;
	left: 0; 
    bottom: 0;
	color: #d1cfd4;
    opacity: 1;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    }
    
.fond-img-deco {
        background-color: #F7E4E8;
    } 
        
.fond-folio-5 {
    background-color: #a09fa7;
    padding-top: 2%;
    padding-bottom: 15%;
}
    
.fond-folio-6 {
    width: 100%;
    height: auto;
    background-color: #6a7e7c;
    padding-bottom: 10%;
    }
    
.fond-folio-1 {
    width: 100%;
    height: auto;
    background-color: #6d8383;
    padding-bottom: 10%;
    } 
    
.fond-folio-1-bis {
   
    background-color: #6d8383;
   
    } 

#prenom2 {
    position: absolute; 
    width: 100%; 
    text-align: center;
    margin: 0; 
    padding: 0; 
    top: 45%;
    color: #fff; 
    font-size: 1em; 
    font-family:'sarpanch-regular', sans-serif; 
    font-weight: 300;
    text-transform: uppercase;
    opacity: 1;
    z-index: 13;
    }

.h6contact { 
    padding-top: 10%;
    font-size: 1em;
    color:#fff;
    line-height: normal;
    font-family: 'dosis', sans-serif;
    padding-bottom: 5%;
    padding-right: 10%;
    padding-left: 10%;
    
            
    }
  .bouton6 {
    position: relative;
    margin-right: 0;
	display: inline-block;
	zoom: 1;
	margin: 0; 	/* pour repousser (ou pas) les boutons entre eux */ /* Block en ligne pour consolider les paddings limités par la hauteur du texte */
	padding: 10px 10px;	
    margin-bottom: 10%; 
	background-color: #EEBF00;
	font-family: 'Dosis', sans-serif; 
	/*font-weight: bold;*/
	font-size: 0.7em;
	color: #19291f;
    border-radius: 5px;
	vertical-align: middle;	/* permet l'alignement vertical sur la ligne de texte (images, icones, etc.) */
	/*border: 2px solid #000;*/
    cursor: pointer;
    
	}
.bouton6:link, .bouton6:visited { 
	background-color: none; 
	color: #1a1a1a;
	text-decoration: none; 
	transition: 0.2s ease-out; 
	}
.bouton6:hover, .bouton6:active { 
	background-color: rgba(40,48,61,.8);  
	color: #dfe8ec;
	text-decoration: none; 
	transition: 0.2s ease-in;
    box-shadow: 0 10px 5px rgba(40,48,61,.2);
	}        
        
.bouton5 {
    position: relative;
    margin-right: 0;
	display: inline-block;
	zoom: 1;
	margin: 0; 	/* pour repousser (ou pas) les boutons entre eux */ /* Block en ligne pour consolider les paddings limités par la hauteur du texte */
	padding: 10px 10px;	
	background-color: #EEBF00;
	font-family: 'dosis', sans-serif; 
	font-weight: 200;
	font-size: 1.2em;
    border-radius: 5px;
	color: #2b3f47;
	vertical-align: middle;	/* permet l'alignement vertical sur la ligne de texte (images, icones, etc.) */
	/*border: 2px solid #000;*/
    cursor: pointer;
    text-align: center;
    padding-top: 2%;
    
	}
.bouton5:link, .bouton5:visited { 
	background-color: none; 
	color: #2b3f47;
	text-decoration: none; 
	transition: 0.2s ease-out; 
	}
.bouton5:hover, .bouton5:active { 
	background-color: rgba(40,48,61,.8);  
	color: #8ed2ed;
	text-decoration: none; 
	transition: 0.2s ease-in;
    box-shadow: 0 10px 5px rgba(40,48,61,.2);
	}

        
.bouton5-cv {
    position: relative;
    margin-right: 0;
	display: inline-block;
	zoom: 1;
	margin: 0; 	/* pour repousser (ou pas) les boutons entre eux */ /* Block en ligne pour consolider les paddings limités par la hauteur du texte */
	padding: 15px 20px;	
    margin-bottom: 4%;
    margin-top: 5%;
	background-color: #EEBF00;
	font-family: 'dosis', sans-serif; 
	font-weight: 200;
	font-size: 1.2em;
    border-radius: 5px;
	color: #2b3f47;
	vertical-align: middle;	/* permet l'alignement vertical sur la ligne de texte (images, icones, etc.) */
	/*border: 2px solid #000;*/
    cursor: pointer;
    text-align: center;
    
	}
.bouton5-cv:link, .bouton5-cv:visited { 
	background-color: none; 
	color: #2b3f47;
	text-decoration: none; 
	transition: 0.2s ease-out; 
	}
.bouton5-cv:hover, .bouton5-cv:active { 
	background-color: rgba(40,48,61,.8);  
	color: #8ed2ed;
	text-decoration: none; 
	transition: 0.2s ease-in;
    box-shadow: 0 10px 5px rgba(40,48,61,.2);
	}
        
.button-footer {
     background-color: #69848A;
    font-family: 'dosis', sans-serif; 
    color: #fff;
    border: none;
    position: relative;
    height: 35px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 1.4em;
    cursor: pointer;
    transition: 600ms ease all;
    outline: none;
    float: left;
}
.button-footer:hover {
    background: none;
    color: #EEBF00;
}
.button-footer:before,.button-footer:after{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    height: 2px;
    width: 0;
    background: #EEBF00;
    transition: 400ms ease all;
}
.button-footer:after{
    right: inherit;
    top: inherit;
    left: 0;
    bottom: 0;
}
.button-footer:hover:before, .button-footer:hover:after{
    width: 100%;
    transition: 600ms ease all;
}


footer {
	margin: 0; 
	padding: 0;
    padding-top: 0;
	font-size: 0.5em;
    font-family: 'dosis', Sans-Serif;
    height: auto;

	}  
    
.nav-footer { 
    width: 100%;
    
}

ul.liste-sans-puce {		/* On cible la liste à puce qui possède la class liste-sans-puce */
	list-style: none;
	margin: 0;
	padding:0;
	}
ul.liste-sans-puce li {
	list-style: none; 	/* on repète pour certains vieux navigateurs comme IE... */
	margin: 0.3em 0em;
	}

ul.liste-sans-puce-horizontale {
    margin: 0;
    padding: 0;
    list-style: none;
    }
ul.liste-sans-puce-horizontale li {
    display: inline-block;
    margin: 10px 10px 10px 10px;
    padding: 0;
    list-style: none;
    }

footer nav ul { 
	list-style: none; 
	margin-top: 0;
	padding: 0;
    display: block;
	}
        
footer nav ul li {
     margin: 10px;   
    }
.h6-footer {
    font-family: 'dosis', sans-serif;
    font-size: 2em;
    color: aliceblue;
    padding-bottom: 10px;
}       
    
.footer-iframe {
    width: 250px;
    height: 150px;
    margin-left: 2%;
   }       
        
      
.p-footer {    
    font-size: 1.5em;
    color: #fff; /* #dceff8 #4b4764*/
    line-height: normal;
    font-family: 'dosis', sans-serif;
    font-weight: 200;
    padding-bottom: 0%;
    padding-top: 5%;
    padding-left: 10px;
}       
.slide-footer {
    margin-top: 5%;
    margin-left: 2%;
    padding-bottom: 2%;
}

.fond-footer {
    background-color: #69848A;
    width: 100%; 
    height: auto;
    
    } 
        
.a-header:link, .a-header:visited { 
    color: #d3d6e5; 
    text-decoration: none; 
    font-family: 'dosis', sans-serif;
    text-transform: uppercase;
    
}
.a-header:hover, .a-header:active { 
    color: #eaebed; 
    text-decoration: none; 
    font-family: 'dosis', sans-serif; 
}

        
.slide-cv {
    padding-left: 5%;
    padding-right: 5%;
    padding-bottom: 5%;
}
        
.slide-lien {
    margin-top: 2%;
}
        
.slide-cv-phone {
       margin-left: 1.5%; 
    } 
    
    
.slide-cv-phone-1 {
    margin-right: 1.5%;
        
    }     
    
    
    
.slide-lien-phone {
    margin-top: 2%;
}
        

.slide-contact-phone {
            margin-top: 2%;
        }
.slide-button-footer {
    margin-top: 20%;
    margin-bottom: 10%;
        }      
     
.copy-r{ 
    font-family: 'dosis', sans-serif;
    color: #30384c;
    margin-left: 15%;
    margin-right: 15%;
    font-size: 0.8em;
   
}
        

    
.a3:link, .a3:visited { color: #EEBF00; text-decoration: none; padding: 2%;}
.a3:hover, .a3:active { color: #fff; text-decoration: none;}   
      
.colonne1, .colonne2, .colonne4, .colonne5, .colonne6, .colonne7, .colonne8, .colonne9, .colonne10, .colonne11, .colonne12 {
        width: 96.875%;  
        }
.visible-phone { display: block;}
.visible-tablet { display: block;}
.visible-desktop { display: none;}
.visible-large { display: none;}
.hidden-phone { display: none;}
.hidden-tablet { display: none;}
.hidden-desktop { display: block;}
.hidden-large { display: block;}
        
.visible-touch { display: block;}
.hidden-touch { display: none;}       
      
   
    
       
        
 
}