body {
   
    background-image: url("../images/imagefond.png");
    padding-top: 70px;
}
img{
	width: 100%;
}

/* menu */

#logolinkedin{
	width: 18%;
	text-align: right;
}
 .logowd26{
 	width: 14%;
 	margin-right: 2%;
 	margin-left: 2%;
 }
 .logowd26xs{ /* logo affiché uniquemnt sur taille xs */
 	width: 14%;
 	margin-right: 2%;
 	margin-left: 2%;
 	right: 72%;
 }
 .logo{
	max-width: 10%;
}
.glyphicon-question-sign{
	color:green;
}
#imgdiplome{
 	max-width: 100%;
 }

 /* section */
.presentation{
	color: white;
	text-align: center;
	background-color: rgb(0,0,0,0.7);
}
.entreprise{
	font-size: 1.8em;
}
/* text defilant */
.realisations{
	margin-top: 5%;
	color: white;
	font-weight: bold;
	font-size: 10em;
	color: rgb(0,0,0,0.7);
	text-align: center;
}

/* permet de remonter les tableaux prés du text defilant */
.ligne{
	margin-top: -8%;
}

/* tableaux affichant les réalisations */
.tableau{
	padding: 4%;
}
.tableau2{
	text-align: center;
	box-shadow: black 4px 4px 4px;
	background-color: black;
	height: 0;
	width: 100%;
	padding-top: 56%;
	position:relative;
}
.interieur-tableau{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0; left: 0;
	padding-top: 4px;
	padding-bottom: 2px;
	opacity: 0.9;
}

	/* text qui viens couvrire les tableaux */
.overlay{
	color: white;
	font-size: 2em;
	position: absolute;
	top: 40%;
	left:25%;
	visibility: hidden;
}
/* survole des tableaux */
.interieur-tableau:hover{
	opacity: 0.4;
}
.tableau2:hover .overlay{
	visibility: visible;
}
/* tableau ne contenant pas des pages en 100% zoom */
.t1, .t8{
	width: 60%;
	left: 20%;
}
.t2{
	width: 100%;
}

/* footer */
.foot{
	color: white;
	text-align: center;
	background-color: rgb(0,0,0,0.7);
}