@import "reset.css";

h1 { font-family:century Gothic; color: #5e5e5e; font-size: 36px; font-weight: 200; }
h2 { font-family: century Gothic; color: #5e5e5e; font-size: 18px; font-weight: 100; }
p { font-family: century Gothic, arial; color: #5e5e5e; font-size: 12px; font-weight: 200;margin-top:2%; text-align: justify; border-top:1px;line-height: 1.5em }
#Professeur h2 {color:#FFFFFF; margin-left: 10px;margin-right: 10px; font-weight: 500;padding-top: 8px;}

a { color:#5E5E5E; text-decoration: none; }
#titre a {color:#fff; }
#titre a:hover {color:#f9194e;}
a:hover {color:#f9194e;}

p a { color: #f9194e; }

h5 { font-family: century Gothic, arial; color: #5e5e5e; font-size: 12px; font-weight: 200;margin-top:2%; border-top:1px; text-indent: 0%; line-height: 1.5em; padding-left:3%;  }

/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
	#Tablet (Landscape)
    #Mobile (Portrait)
    #Mobile (Landscape)
    


/* #Base 960 Grid
================================================== */

#page {
	width: 980px;
	min-height: 950px;
	margin: 0 auto;
	background-color:#fff;
	margin-top:60px;
	border:1px solid #bbb;
}

#PrenomNom {
	
	float: left;
	position:relative;
	top:30px;
	left:5%;
	
	
}

#image {
	clear: both;
	position: relative;
	float: left;
	width: 90%;
	margin-left:5%;
	margin-right:5%;
	top: 50px;
	left:0px;
	
}

img {max-width: 100%; }
	
#Professeur {
		position:relative;
		top: -65px;
		left:0px;
		width: 420px;
		height: 55px;
		background:#4f4141;
		opacity:.9;
		
		filter: alpha(opacity=30);
}

#menu {
	float: right;
	position:relative;
	top:48px;
	left:-20px;
	background-color:transparent;
	font-family: Arial sans-serif; arial;
	font-weight: 200;
	font-size: 95%;
	color: #5e5e5e;
}
#menu ul {
	list-style:none;
	}
#menu ul li {
	padding-left: 10px
	}
#menu li {
	float: left;
	margin-right:30px;
	
	
	}
#menu li:hover a {
	display: block;
	color:red;
	}

#menu ul li ul {
	display: none;
	background: #fff;
	padding-bottom: 10px;
	margin-left: -10px;
	font-size: 80%;
	}
#menu ul li:hover ul {
	display: block;
	}
#menu li:hover ul li {
	float: none;
	margin-top:10px;
	}
#menu ul li ul {
	position: absolute;
	z-index:5;
	}
#biographie {
	clear: both;
	float:left;
	position:relative;
	top: 30px;
	left:5%;
	width: 50%;
	min-height: 100px;
	background-color:transparent;
}

#Anoter {
	float:left;
	position:relative;
	top: 30px;
	left: 15%;
	width: 30%;
	min-height: 100px;
	background-color:transparent;
}

#EspaceEtudiants {
	position: absolute;
	top: 235px;
	left:0px;
	width: 250px;
	height: 80px;
	border-radius:15px;
		-moz-border-radius: 15px; 
		-webkit-border-radius:15px; 
		-khtml-border-radius:15px;
	background-color: #4f4141;
	
}
#titre {
	position: absolute;
	top:30px;
	left:50px;
	font-family: century gothic, arial;
	color: #fff;
	font-size: 100%;
	
}
#colonne1 {
        clear: both;
		position: relative;
		top:80px;
		left:0px;
		float:left;
		margin-left:5%;
		width: 18%;
		min-height: 204px;
		border-right: 2px solid #fff;
		background-color:#dcd9d9;
		text-indent: 3%;
    
		
		
}

	#colonne2 {
		float:left;
		position:relative;
		top:80px;
		left:0%;
		width: 16.5%;
		min-height: 204px;
		border-right: 2px solid #fff;
		background-color:#dcd9d9;
		text-indent: 3%;
		
}
	
	#colonne3 {
		float:left;
		position:relative;
		top:80px;
		left:0%;
		width: 18%;
		min-height: 204px;
		border-right: 2px solid #fff;
		background-color:#dcd9d9;
		text-indent: 3%;
		
}
	
	#colonne4 {
		float:left;
		position:relative;
		top:80px;
		left:0%;
		width: 18%;
		min-height: 204px;
		border-right: 2px solid #fff;
		background-color:#dcd9d9;
		text-indent: 3%;
		
}
	
	#colonne5 {
		float:left;
		position:relative;
		top:80px;
		left:0%;
		width: 18%;
		min-height: 204px;
		border-right: 2px solid #fff;
		background-color:#dcd9d9;
		text-indent: 3%;
		
}

/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */