/** Style Homepage - http://www.tibess.fr/ **/

/* Reset Styles ============================================================ */
a, abbr, acronym, address, applet, article, aside, audio,
b, blockquote, big, body,
center, canvas, caption, cite, code, command,
datalist, dd, del, details, dfn, dl, div, dt, 
em, embed,
fieldset, figcaption, figure, font, footer, form, 
h1, h2, h3, h4, h5, h6, header, hgroup, html,
i, iframe, img, ins,
kbd, 
keygen,
label, legend, li, 
meter,
nav,
object, ol, output,
p, pre, progress,
q, 
s, samp, section, small, span, source, strike, strong, sub, sup,
table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul, 
var,
input{
    background: transparent;
    border: 0 none;
    font-size: 100%;
    margin: 0;
    padding: 0;
    vertical-align: baseline; }
	
/* Default Styles ============================================================ */
body{
    font: normal normal 12px/12px Arial, Tahoma, Helvetica, Verdana, sans-serif; }
    
    /* Fibonacci based heading scale ratio */
    h1{ font-size: 1.5em; font-weight: normal; margin:0; padding:0; }
    h2{ font-size: 1.3em; font-weight: bold; margin:0; padding:0; }
    h3{ font-size: 1.2em; font-weight: bold; margin:0; padding:0; }
    h4{ font-size: 1em; font-weight: bold; margin:0; padding:0; }

	/* Left & Right alignment */
	.left{ float: left; }
	.right{ float: right; }
	a { color:#000; cursor:pointer; text-decoration:none; }
	a:hover { text-decoration:underline; }
	
	/* For when a <br /> just ain't enough */
	.separator{
		clear: both;
		float: left;
		height: 1px;
		width: 97%;
		margin:0 1.5%;
		background-color:#4E639A; }
	
	/* Divers */
	p { line-height:1.5em; padding:5px; }

/* Homepage Styles ============================================================ */

body { background-color:#787878; }
#page { width:80%; min-width:340px; margin:100px 10% 0; padding:150px 0 0; background:url(../img/ptibess.png) top center no-repeat; color:#E5E5E5; text-align:center; font-size:1.6em; line-height:1.8em; }

	/* Message de presenation */
	#page .presentation { overflow:hidden; margin:0 0 1em 0; padding:0; }
	/* Menu */
	#page .menu { overflow:hidden; margin:0; padding:0; }
		#page .item-menu { float:left; margin:10px; padding:0; }
		#page .thumbnail-lnk { display:block; position:relative; overflow:hidden; height:195px; width:292px; margin:0; padding:0; text-decoration:none; background:url(../img/bkg-menu.png) top left no-repeat; border-radius:0.5em 0.5em 0 0; -webkit-border-radius:0.5em 0.5em 0 0; -moz-border-radius:0.5em 0.5em 0 0; }
		#page .geoloc { background:url(../img/bkg-menu-geoloc.jpg) top left no-repeat; }
		#page .blog { background:url(../img/bkg-menu-blog.jpg) top left no-repeat; }
			#page .boxcaption { display:block; overflow:hidden; height:195px; width:292px; position:absolute; top:195px; left:0; border:0; background-color:#fff; opacity:0.5; -moz-opacity:0.5; -ms-filter:"alpha(opacity=50)"; filter : alpha(opacity=50); }
			#page .descr{ display:block; overflow:hidden; }
			#page .caption{ font-size:12px; }

/* Menu ======================================================================= */
/*
#page ul { float:left; list-style:none; margin:0; padding:0; }
#page li{ margin:10px; padding:0; float:left; }
#page li .thumbnail-lnk { display:block; position:relative; overflow:hidden; height:195px; width:292px; margin:0; padding:0; text-decoration:none; background:url(../img/bkg-menu.png) top left no-repeat; border-radius:0.5em 0.5em 0 0; -webkit-border-radius:0.5em 0.5em 0 0; -moz-border-radius:0.5em 0.5em 0 0; }

#page li .geoloc { background:url(../img/bkg-menu-geoloc.jpg) top left no-repeat; }
#page li .blog { background:url(../img/bkg-menu-blog.jpg) top left no-repeat; }

#page li .boxcaption { display:block; overflow:hidden; height:195px; width:292px; position:absolute; top:195px; left:0; border:0; background-color:#fff; opacity:0.5; -moz-opacity:0.5; -ms-filter:"alpha(opacity=50)"; filter : alpha(opacity=50); }
#page li .descr{ display:block; overflow:hidden; }
#page li .caption{ font-size:12px; }
*/