@import url(http://fonts.googleapis.com/css?family=Quicksand:300,400,700);

body {      
    font-family: 'Quicksand', sans-serif;
     position: relative;
  }

/* utilities */
.padding-cards {
    padding-top: 100px;
    padding-bottom: 100px;
}
.padding-40 {
    padding-top: 40px;
    padding-bottom: 10px;
}
.padding-60 {
    padding-top: 60px;
    padding-bottom: 10px;
}
.padding-70 {
    padding-top: 70px;
    padding-bottom: 10px;
}
.padding-80 {
    padding-top: 80px;
    padding-bottom: 10px;
}
.padding-100 {
    padding-top: 100px;
    padding-bottom: 10px;
}

.padding-140 {
    padding-top: 140px;
    padding-bottom: 100px;
}
.padding-150 {
	padding-bottom: 100px;
}
.padding-300 {
    padding-top: 150px;
    padding-bottom: 400px;
}
.padding-200 {
    padding-top: 150px;
    padding-bottom: 200px;
}


.bg-dark {
     
}

.bg-cloud {
    background: rgb(236, 240, 241);
}

.text-cloud {
    color: rgb(236, 240, 241);
}

.text-dark {
    color: #212529;
}

.h-100 {
    height: 100px;
}

.h-250 {
    height: 250px;
}

.paddingZero {
    padding: 0;
}

.padding-10 {
    padding: 10px;
}
.font-10{
	font-size: 1rem;
}
.font-10pres{
	font-size: 1rem;
	text-align: left;
}
.font-10presisole{
	font-size: 1rem;
	text-align: left;
	
}
.font-10t{
	font-size: 1.2rem;
}
.font-10mail{
	font-size: 1.3rem;
	text-align: center;
}
.font-20{
	font-size: 1.5rem;
}
.font-30{
	font-size: 2rem;
}
.font-30titre{
    font-size: 3rem;
    font-family: aclonica;
    font-style: normal;
    font-weight: 400;
}
.font-30titrechap{
    font-size: 2rem;
    font-family: aclonica;
    font-style: normal;
    font-weight: bolder;
}
.font-30titreaccueil{
    font-size: 1.8rem;
    font-family: aclonica;
    font-style: normal;
    font-weight: bolder;
}
.font-40f {
	font-size: 36px;
}
.font-40 {
	font-size: 3rem;
}
.font-50{
	font-size: 4rem;
}
.font-60 {
    font-size: 60px;
}
.font-60V {
	font-size: 3em;
	margin-top: 27px;
}
.font-60p {
	font-size: 3rem;
	font-style: italic;
	font-weight: bolder;
	text-shadow: 2px 0px;
}
.font-70 {
    font-size: 70px;
}
.font-80 {
   font-size: 5rem;
}

/* navbar */
#navbar {
    transition: all 1s;
    -moz-transition: all 1;
    -webkit-transition: all 1s;
    -o-transition: all 1;
}

.bg-clear {
    background: transparent;
}


/* header */
.bg* {
    background: url('img/bg-mountain-clouds.jpg') 20% 40%;
    width: 100%;
    text-align: left;
    border-style: solid;
    border-color: #1D29D9;
}
.bg {
    background-color: #004C80;
    background-image: url(page%20accueil/Background-dark-blue-300x169.jpg);
    background-attachment: fixed;
}

.bg-fixed {
    background-attachment: fixed;
}


/*social media icons - CSS animation */
section#contact a {
	display: inline;
	width: 128px;
	height: 128px;
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	text-align: center;
}

a.fb {
    background: url(img/social_media.png) -256px top;
}

a.tw {
    background: url(img/social_media.png)  -512px top;
}

a.go {
    background: url(img/social_media.png) -768px top;
}

a.ytube {
    background: url(img/social_media.png) -640px top;
}

section#contact li:hover a.fb {
    background: url(img/social_media.png) -256px bottom;
}

section#contact li:hover a.tw {
    background: url(img/social_media.png) -512px bottom;
}

section#contact li:hover a.ytube {
    background: url(img/social_media.png) -640px bottom;
}

section#contact li:hover a.go {
    background: url(img/social_media.png) -768px bottom;
}
.ml-10 {
	margin-left: 10px;
	
}  
.ml-15 {
	margin-left: 15px;
	
}  
.ml-20 {
	margin-left: 20px;
	
}  
.ml-30 {
	margin-left: 30px;
	
}  
.column {
	margin-bottom: 10px;
}
.height {
	height: 850px;
	text-shadow: 0px 0px;
}
.margin-top10{
	margin-top: 10px;
}
.margin-top20{
	margin-top: 20px;
}
.margin-top30{
	margin-top: 30px;
}
.margin-top40{
	margin-top: 40px;
}
.margin-top50{
	margin-top: 50px;
}
.margin-top60{
	margin-top: 60px;
}
.margin-top80{
	margin-top: 80px;
}
.margin-top100{
	margin-top: 100px;
}
.margin-bottom10{
	margin-bottom: 10px;
}
.margin-bottom20{
	margin-bottom: 20px;
}
.margin-bottom30{
	margin-bottom: 30px;
}
.margin-bottom50{
	margin-bottom: 50px;
}
.padding-top20{
	padding-bottom: 20px;
}
.font-gras{
	font-weight: bold;
	font-size: 1.5rem;
}
.font-grasl{
	font-weight: bold;
	font-size: 1.2rem;
}
.bg-contact{
	background-color: #fad390;
}
.bg-cards{
	background-color: #A08B8B;
}
.margin-right20 {
	margin-right: 20px;
}
.margin-right30 {
	margin-right: 30px;
}
.margin-right40 {
	margin-right: 40px;
}
.margin-right50 {
	margin-right: 50px;
}
.margin-right100 {
	margin-right: 100px;
}
.margin-right150 {
	margin-right: 150px;
}
.margin-right200 {
	margin-right: 200px;
}
.margin-bottom100{
	margin-bottom: 100;
}
hr {
	border-color: #ddd;
}
.scale:hover{
	-webkit-transform:scale(1.05);
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 250ms;
	-moz-transform:scale(1.05);
	-moz-transition-timing-function: linear;
	-moz-transition-duration: 250ms;
	
	transform:scale(1.05); 
	transition-timing-function: linear;
	transition-duration: 250ms;
	 
}

.colortexteimg{
	color: #FAFAFA;
	
}
.videoWrapper { 
	position: relative; padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px; height: 0; 
} 
.videoWrapper iframe { 
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
} 
.margeimghaut{
	padding-top: 9px;
	 
}
.margeimghaut1{
	padding-top: 15px;
}
.margeimghaut1img{
	padding-top: 19px;
}
.align-mail{
	margin-left: 0px;
	text-transform: none;
	list-style-type: none;
	margin-right: 16px;
	text-align: center;
}
.h6webmaster{
	text-align: center;
	color: #8E8787;
	display: inline;
}
.footerjaune{
	color: #E1F30C;
	font-style: normal;
	font-variant: normal;
	font-weight: bold;
}
.footeradresse{
	color: #E1F30C;
	font-style: normal;
	font-variant: normal;
	font-weight: bold;
}
.footerital{
    font-style: italic;
    color: #C6E714;
    font-weight: bolder;
	
}
.copyright {
	color: #FBF8F8;
	padding-top: 80px;
	padding-right: 0;
	padding-left: 0;
	padding-bottom: 20px;
	font-style: italic;
	width: 100%;
}
.margin-bottom80 {
}
.margin-left20 {
}
.margin-botton40 {
}
i {
  font-size: 4rem;
  color: #007bff;
}
.bi bi-arrow-down{
	style="font-size: 20px;
}
.couleurtitserv{
    background-color: #05395C
}
.couleurcadreserv{
    border-radius: 4r;
    border-color: #1A1C1E;
    -webkit-box-shadow: 0px 0px #12074F;
    box-shadow: 0px 0px #12074F;
}
.couleurtextserv{
    background-color: #10074A
}
#Presentation {
}
.col-md-3 .couleurcadreserv .couleurtextserv {
}
.couleurphotovolaique{
    color: #FCD53F;
}
.couleurautoconso{
    color: #86D72F;
	
}
.couleurstockage{
    color: #FF822D;
	
}
.couleursav{
    color: #D1C9DB;
	
}
.couleureco{
	
}
.couleurecologie{
    color: #00D26A;
	
}
.couleurautonomie{
    color: #E7C0A6;
	
}
.couleurvalorisation{
    color: #BEB6C7;
	
}
     
background-attachment: fixed;


	
body {
  background-image: url('page%20accueil/Background-dark-blue-300x169.jpg'); /* ou une photo de votre choix */
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hero {
  position: relative;
  overflow: hidden;
}

.hero::before {
  content: '';
  position: fixed; /* fixed sur le pseudo-élément, pas le parent */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(page%20accueil/Background-dark-blue-300x169.jpg);
  background-size: cover;
  background-position: center;
  z-index: -1;
}