html, body{
	height: auto;
	margin: 40px 0px 100px 100px;
	}

body{
	background: #ededed;
}

h1{
	font-family: 'Bitter', serif;
	font-size:3em;
	line-height: 0.5;
	}

h2, h3{
	font-family: 'Roboto', sans-serif;
	}

p{
	width:500px;
	padding:0;
	margin:0px;
	font-family: 'Roboto', sans-serif;
	line-height:1.4;
	text-align: justify;
	}


/* Couleurs et codes hexa */
#float {
    width: 60px;
    height: 60px;
    border-radius: 30px;
    float:left;
    margin-right: 30px;
}

/* Bouton affichage plein écran */
.button{
     font-family: 'Roboto',sans-serif;
     font-size: 1em;
     font-weight: bold;
     text-align: center;
     color:black;
     width: 350px;
     height: 25px;
     padding-top: 5px; /*centrage vertical*/
     background: #ff5741;
     border-radius: 25px;
     margin-top:15px;
     display:inline-block;
}

.button:hover{
	color:white;
}

/* Demo font Bitter */
.font-bitter{
	font-family: 'Bitter', serif;
	font-size: 3em;
	line-height:2;
	float:left;
}

/* Demo font Karla */
.font-karla{
	font-family: 'Karla', sans-serif;
	font-size: 3em;
	line-height:2;
	float:left;
}

/* Logo */
.logo{
	width: 130px;
	height: auto;
}



/* hover 1 */
#boutonDemo {
	/*background-image : url("IMG/bouton_1.png");*/
	width : 450px; 
	height : auto; 
	float:left;
}



/* hover 'Connexion' */
#lien {
	font-family:'Karla', sans-serif;
	font-size:1.2em;
	font-weight: bold;
	line-height:3.5;
}

#lien:hover { 
	font-style: italic;
	text-decoration: underline;
}


/* hover 'Menu' */
#menu {
	width:250px;
	height:60px;
	background:white;
	color:black;
	font-family:'Karla', sans-serif;
	font-size:1.5em;
	font-weight: bold;
	padding-top:30px;
	text-align:center;
}

#menu:hover { 
	background:black; 
	color:white;
	font-weight: bolder;
}


/* Image réduite */
.min{
	width: 500px;
	height: auto;
	float-left;
	margin-right:10px;
	}

/* Bas de page */
.meta{
	font-family: 'Roboto', sans-serif;
	font-style: italic;
	font-weight: bold;
	display:inline-block;
	}