/*
    style.css utilise le langage CSS pour créer la partie style des pages de notre page de suivie. Chaque élément 
    du code HTML peut être implémenté d'une classe ou d'un id. Il peut être ensuite repris dans ce templates pour 
    lui assigner un style.
    
    Par exemple écrivons dans le template SuiviProjet.php : <div class='test'>TEST</div>
    
    La balise div est une balise très courante en HTML. En lui assignant la class test, on peut maintenant
    venir écrire dans le template style.css du css pour lui assigner une spécificité :
    
    Par exemple :   .test{
                        background-color:black;
                    }
    --> La couleur du background de cette div sera alors noire.
*/

.tout{
	padding: 50px;
	width : 100%;
}

#footer{
    width : 100%;
    background-color:#54c4cf;
    padding : 20px;
    height : 150px;
}

.formLogin{
     display : table-cell;
	 border-radius: 20px;
	 padding: 20px;
	 width:625px;
	 background-color:white;
	 box-shadow: 1px 1px 12px #555;
}

.formLogin2{
    border-spacing:20px 0;
     display : table-cell;
	 padding: 20px;
	 width:625px;
	 height:400px;
	 background-color:white;
	 box-shadow: 1px 1px 12px #555;
}

.facturetaille{
    font-size: 16px;
    padding:0px;
}

.formLogin1{
	 border: 0px solid white;
	 border-radius: 20px;
	 padding: 20px;
	 width:100%;
	 margin: 0 auto;
	 background-color:white;
	 box-shadow: 1px 1px 12px #555;
	 
}

.popuplegende{
    position : fixed;
    border: 0px solid white;
    background-color:white;
	box-shadow: 1px 1px 12px #555;
    margin-left:25%;
    margin-top:25%;
}

#docclient, #mairie, #Consuel, #reseau, #edfoa, #Facture, #docclientbis, #mairiebis, #Consuelbis, #reseaubis, #edfoabis, #Facturebis{
    text-align:center;
}

#block{
    width:100%;
    display: flex;
     align-items: center;
     justify-content: center;

}

#email:hover{
    background-color: #325eab;
}

a:link
{
	text-decoration:none;
	color: black;
}
#cercle {
	float: left;
}
.logo{
	display: inline-block;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	width: 120%;
	height: 100%;
}
h1{
	display: inline-block;
	float: right;
	text-align: center;
	width: 100%;
	display:box; padding: 30px;color:#fff;
	background-color:#325eab;
}

.header{
	display: inline-block;
	height : 150px;
	float: right;
	text-align: center;
	width: 60%;
	display:box; padding: 30px;color:#fff;
	background-color:#325eab;
}
#titre2{
	color: #325eab;
	height: 90px;
	background: #54c4cf; 
	padding: 20px;color:#fff;
	text-align: center;
}
.titre2{
	margin-top: 200px;
	color: #325eab;
	width: 25%;
	height: 90px;
	background: #54c4cf; padding: 20px;color:#fff;
	text-align: center;
}

.textgeneral, p{
	font-size : 20px;
	padding: 20px;
}
iframe{
	display: inline-block;
	margin-right: 20px;
	width:23%;
	height:500px;
}
#actu{
	width: 100%;
	height: 200px;
}
#message{
	overflow: scroll;
	width: 100%;
	height: 650px;
	border: 5px solid #325eab;
	padding: 10px;
}

#info{
	overflow: auto;
	width: 100%;
	height: 200px;
	border: 5px solid #325eab;
	padding: 10px;
	font-size: 18px;
}

h3{
	width: 25%;
	height: 80px;
	background: #92FFD8; padding: 20px; color:#fff;
	text-align: center;
}

.test:hover{
	background-color: #C9E4EC;
}

hr{
	background: lightgrey;
	height: 1px;
}

table{
    width:100%;
}

p{
    font-size: 18px;
}