nugg.css

body 
{
	margin: 0px;
	padding: 0px;
	font-family: calibri;
	font-size: 16px;
	color: rgb(50,50,50);
		background-image:url(Img\nugg.jpg);
	background-attachment:fixed;
	background-repeat    : no-repeat;
	background-size      : cover;
}
	
/* CSS du wallpaper */
#background
{
	width:auto;
	position:fixed;
	top:0px;
	z-index:-1;

	}


/* CSS de la div pour la bannière */
#header 
{
	margin-top: 6%;
	margin-left:25.5%;

	width : 50%;
	height:50%;
	
	padding:0;
	margin-bottom:0px;
	border: 3px solid;
	border-color:white;
	padding:5px 5px 0px 5px;
	box-shadow: 0px 0px 1px #000000;	
}
	









/* CSS des liens lorsque l'on passe la souris dessus */
a:hover
{
color : rgb(110,110,110);
}

/* CSS des liens */
a
{
color : rgb(50,50,50);
}


	
#central
{
	width:100%;
	/*background-color : gold;*/
	display:inline-block;

}


/* CSS de la div du coeur du site */
#centre 
{
	margin-left: 30%;
	margin-top : 2%;
	border-radius : 7px;
	padding: 10px;
	height : 60%;
	width : 40%;
	overflow : auto;		/* Scroll de la div du milieu */
	border:5px solid;
	border-color:white;
	background-color:rgb(244,243,243);
	box-shadow: 0px 0px 1px #000000;
}

#connexion
{
	margin-left : 33%;
	margin-top : 4%;
	border:5px solid;
	border-color:white;
	background-color:rgb(244,243,243);
	box-shadow: 0px 0px 1px #000000;
	width:35%;
	padding:1%;

}



#piouter
{
	width:97%;
	height:7em;
}




#piouts
{
	border : 1px dashed black;
	padding : 2%;
	background-color:rgba(247,195,34,0.4);
	border-radius:10px;
}

#panneauGauche
{
	margin:2% 2.5% 0 15%;
	padding: 10px;
	padding-top : 0px;
	height : 65%;
	/*width : 18.5%;*/
	width : 18vmax;
	float:left;
}


	
/* CSS de l'encart de post de piout */
#postPiout
{
	margin: 0% 0 10% 0;
	padding: 10px;
	height : 30%;
	width : 90%;
	border:5px solid;
	border-color:white;
	background-color:rgb(244,243,243);
	box-shadow: 0px 0px 1px #000000;
	float:left;
	border-radius : 7px;
}


	
	
/* CSS de la div des copyright (footer) */
#barreBas 
{
	margin-top : 5%;

	padding: 15px;
	height : 40px;
	width : 995px;
	margin-left : 15%;
	margin-right : auto;
	
	font-size:30px;
	
	border:5px solid;
	border-color:white;
	background-color:rgb(244,243,243);
	box-shadow: 0px 0px 1px #000000;
}


/* CSS des img dans l'encart actualités */
img.news
{
	border:5px solid;
	border-color:white;
	background-color:rgb(244,243,243);
	box-shadow: 0px 0px 1px #000000;
	height : 90px;
	width : 590px;
}

/* CSS des images pour les derniers tests */
img.derniersTests
{
	border:5px solid;
	border-color:white;
	background-color:rgb(244,243,243);
	box-shadow: 0px 0px 1px #000000;
	height : 60px;
	width : 250px;
	margin-left:-5px;
}




/* CSS des titres h1 h2 et h3 */
h1
{
margin : 3px;
padding :0;
font-family : calibri;
font-size:2vw;
text-transform:uppercase;
}

@media screen and (max-width: 740px) 
{
  h1 
	{
    font-size: 105%;
	}
	
	#panneauGauche
	{
		margin:2% 2.5% 0 3%;
	}
	
	#centre
	{
		margin-left: 30%;
		margin-top : 2%;
		width : 50%;
	
	}
}






h2
{
font-family : calibri;
font-size:20px;
margin-bottom : 4px;
margin-top : 0px;
}


h3
{
margin : 1px 2px 0px 2px;
padding :0px 3px 2px 10px;
font-family : calibri;
font-size:20px;
border-left : 6px solid;
border-color : #2d7ca0;
text-transform:uppercase;
height : 25px;				/* Taille (en hauteur) du rectangle des titres */
}

h4
{
margin : 1px 2px 0px 2px;
padding :0px 3px 2px 10px;
font-family : calibri;
font-size:19px;
border-left : 6px solid;
border-color : #2d7ca0;
text-transform:uppercase;
height : 25px;				/* Taille (en hauteur) du rectangle des titres */
}

h5
{
font-family : calibri;
font-size:18px;
margin-bottom : 3px;
margin-top : 0px;
}

p
{
margin : 0;
font-size : 100%;
}


/* Barre horizontale en dessous des titres */
hr 		
{
border :0;
border-bottom:1px solid;
border-color : #9c9b9b;
box-shadow: 0px 1px 0px #ffffff;
margin:10px 0;

}


/* CSS du tableau répertoriant les tests */
table.tabTests
{ 
	border-collapse:collapse; 
}

table.tabTests td, table.tabTests th 
{ 
	border:1px solid black;padding:5px; 
}




/* ----------- CSS fade pour les barres de derniers tests --------------- */
#fadeText
{
height : 70px;
}


#fadeText .details
{
height : 60px;
position : relative;
top : -86px;
opacity: 0;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 500ms;
color: white;
font-family:calibri;
font-size:15px;
background-color: rgba(0, 0, 0, 0.7);		/* Opacité du background à 0.5 */
}


#fadeText .details:hover
{	
opacity: 1;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 500ms;
}






#nav
{
	position : fixed;
	top : 0px;
	height : 8.4%;
	width: 55%;
	z-index : 50;
	margin:0;

 list-style-type: none;
background-color:rgb(247,195,34);
}


#nav li a
{
	font-family:Arial;
	font-size:1.2vw;
	text-decoration: none;
	float:left;
	padding:10px;
	background-color: #333333;
	color:#ffffff;
	border-bottom:1px;
	border-bottom-color:#000000;
	border-bottom-style:solid;
	width:16%;
	margin:1% 0.3% 1% 0.3%;
	padding:1.7%;
}

#nav li a:hover
{
	background-color:rgb(244,244,236);
	color:rgb(255,124,94);
	border-bottom:2px;
	border-bottom-color:#000000;
	border-bottom-style:solid;
	margin:1% 0.3% 1% 0.3%;
	padding:1.7%;
}

#menu
{
	position : fixed;
	top : 0px;
	height : 8.4%;
	width: 100%;
	z-index : 50;
	background-color:rgb(247,195,34);
	margin:0;
	text-align:center;
	padding-left:20%;
}