/* --------------------- RESET & BASICS ----------------------- */

html, body, div, span, img, hr, h1, h2, h3, h4, h5, h6, a, p, font, em, ol, ul, li, table, caption, tbody, tfoot, thead, tr, th, td, fieldset, form, label, input, textarea, legend, center, b, u, i, small, strong, big, sub, sup, applet, object, iframe, blockquote, q, pre, abbr, acronym, address, cite, code, dfn, ins, del, kbd, samp, strike, s, tt, var, dl, dt, dd{
background:transparent;
margin:0; padding:0; 
border:0; outline:0;
font-size:100%;
}

body{line-height:1.4;}
a{text-decoration:none; white-space:nowrap;} /* white-space --> si long lien, jamais sur 2 lignes */
ol, ul{list-style:none;}
table{border-collapse:collapse; border-spacing:0;}
/*:focus{outline:0;} /* par exemple, enlever le border quand on clique sur un lien - cf firefox */
textarea{overflow:auto;} /* supprimer la barre de scroll dans une textarea - de base sous ie ;) */

body{background:#3a3a3a; font-size:12px; font-family:"Lucida Grande", palatino, georgia, arial, sans-serif; color:#ccc; text-align:left;}
* html body{font-family:"arial", sans-serif;}
*+html body{font-family:"arial", sans-serif;}

a{color:#b7ddf2; cursor:pointer;}
.small{font-size:11px;}
a:hover, a:focus{text-decoration:underline;}

form table{width:100%;}
label{display:block; margin-top:5px;}
.inputtext{background:#ccc; width:85%; padding:5px;}
.submit{padding:5px 15px; background:#3a3a3a; color:#ccc; float:right; margin:10px 20px auto auto;}
	.submit:hover, .submit:focus{cursor:pointer; background:#2a2a2a;}
.erreur{color:#d12121; height:28px; vertical-align:top;}

hr{color:#7e7e7e; background-color:#7e7e7e; height:1px; width:60%; margin:5px auto;}

#main{position:absolute; width:975px; height:535px; margin:auto; left:50%; top:50%; margin-left:-488px; margin-top:-268px;}
#colgauche{height:100%;}
#webmail, #tutos, #contact{width:60%; height:155px;}
*+html #webmail, *+html #tutos, *+html #contact{width:95%; height:155px; margin-left:0;}
* html #webmail, * html #tutos, * html #contact{width:95%; height:155px; margin-left:0;}
	#tutos{margin-top:19px;}
	*+html #tutos{margin-top:35px;}
	* html #tutos{margin-top:35px;}
	#contact{margin-top:19px;}
	*+html #contact{margin-top:35px;}
	* html #contact{margin-top:35px;}
	#webmail{background:#484848 url('../images/roundcube.png') 4% 92% no-repeat;}
	#tutos{background:#484848 url('../images/tutos.png') 5% 70% no-repeat;}
	#contact{background:#484848 url('../images/contact.png') 4% 92% no-repeat;}
	#ip{position:absolute; width:500px; height:150px; background:#484848 url('../images/ip.jpg') 5% 90% no-repeat; left:50%; top:50%; margin-left:-250px; margin-top:-75px;}
	#webmail h1, #tutos h1, #contact h1, #ip h1{color:#ccc; background:#3a3a3a; font-size:13px; padding:8px 25px; display:inline; text-transform:uppercase; letter-spacing:4px;}
		#webmail .content, #tutos .content, #contact .content{width:70%; height:90px; margin:10px 0 auto auto; padding:10px;}	
		#ip .content{width:57%; height:90px; margin:25px 0 auto auto; padding:10px;}
		#ip .content h2{font-size:24px; letter-spacing:5px;}
		#ip .content a{float:right; margin-top:35px;}
		
#homeserver{float:right; width:35%; padding:0 10px; height:100%; min-height:512px; background:#484848 url('../images/homeserver.png') 10% 10% no-repeat;}
* html #homeserver{float:right; width:35%; padding:0 10px; height:393px; background:#484848 url('../images/homeserver.png') 10% 10% no-repeat;}
	#homeserver h1, #homeserver h2{color:#ccc; font-size:13px; text-transform:uppercase;}
	#homeserver h1{background:#3a3a3a; padding:8px 25px; display:inline; letter-spacing:4px; float:right; margin:-10px -10px auto auto;}
	#homeserver h2{padding:8px 10px; margin:50px auto auto 90px; letter-spacing:2px;}
	* html #homeserver h1{color:#ccc; background:#3a3a3a; font-size:13px; padding:8px 25px; display:inline; text-transform:uppercase; letter-spacing:4px; float:right; margin:-10px -15px auto auto;}	
	#homeserver .content{width:95%; height:90%; margin:30px auto; padding:10px;}
	
	
#oublipass{position:absolute; width:450px; min-height:260px; background:#484848; margin:auto; left:50%; top:50%; margin-left:-245px; margin-top:-165px; color:#fff; padding:20px;}
	#oublipass h1{color:#b7ddf2; font-size:15px;}
	#oublipass table{width:90%; margin-top:20px;}
	#oublipass table tr{vertical-align:top;}
	#oublipass .submit{margin-top:5px;}
	#oublipass .inputtext{width:100%;}