/*
                                __      _ _                   _   
                               / _|    | (_)                 | |  
 _ __ ___   __ _ _ __ ___ ___ | |_ ___ | |_  ___   _ __   ___| |_ 
| '_ ` _ \ / _` | '__/ __/ _ \|  _/ _ \| | |/ _ \ | '_ \ / _ \ __|
| | | | | | (_| | | | (_| (_) | || (_) | | | (_) || | | |  __/ |_ 
|_| |_| |_|\__,_|_|  \___\___/|_| \___/|_|_|\___(_)_| |_|\___|\__|
                                                                  
*/



/* BAR CHART */
#bar { list-style:none; margin:50px 0 0 200px; width:600px; }
#bar li { margin-top:-40px; float:left;}

.java { margin-top:130px; margin-left:30px; float:left;}
.gwt { margin-top:85px; margin-left:30px; float:left;}
.hibernate { margin-top:75px; margin-left:18px; float:left;}
.spring { margin-top:50px; margin-left:25px; float:left;}
.maven { margin-top:50px; margin-left:25px; float:left;}

/* Ellipse top */
#bar li div.top { background-color:rgba(140,172,176,0.5); position:relative;
	width:100px; height:40px; -moz-border-radius: 100px/40px; -webkit-border-radius: 100px 40px; border-radius: 100px/40px; }
#bar li div.top img { margin-left:5px; margin-top:-50px; display:none; width:90px; height:80px;}

#bar li div.texte{ margin-left:5px; margin-top:-150px; display:none; width:90px; height:80px;}
/* Bar bottom */
#bar li div.bottom { background-color:rgba(184,203,205,0.5); margin-top:-40px; position:relative;
	width:100px; -moz-border-radius: 100px/40px; -webkit-border-radius: 100px 40px; border-radius: 100px/40px; }
#bar li div.bottom div.infobox { padding:40px 0 0 200px; }
#bar li div.bottom div.infobox h3 { font-family:Georgia,serif,Times;}
#bar li div.bottom div.infobox p { font-family:"Lucida Grande",Arial,Helvetica,Sans-Serif; }

/* General hover actions */
#bar li:hover div.top img { display:inline; }
#bar li:hover div.bottom div.infobox { color:#eee; text-shadow: 0px 5px 5px #111; }

/* jpa bar */
#jpa div.top { z-index:99; margin-top:140px; margin-right:2px;}
#jpa div.bottom { z-index:98; height:150px; }
#jpa:hover div.top { z-index:995; background-color:#d98f23; }
#jpa:hover div.bottom { z-index:994; background-color:#b6781e;
	background:-moz-linear-gradient(-90deg, #b6781e, #916018); background:-webkit-gradient(linear, 0 top, 0 bottom, from(#b6781e), to(#916018)); }

/* gwt bar */
#gwt div.top { z-index:97; margin-top:90px; margin-right:2px;}
#gwt div.bottom { z-index:96; height:200px; }
#gwt:hover div.top { z-index:997; background-color:#bc003c; }
#gwt:hover div.bottom { z-index:996; background-color:#9d0032;
	background:-moz-linear-gradient(-90deg, #9d0032, #7a0027); background:-webkit-gradient(linear, 0 top, 0 bottom, from(#9d0032), to(#7a0027)); }

/* java bar */
#java div.top { z-index:95; margin-top:40px; margin-right:2px;}
#java div.bottom { z-index:94; height:250px; }
#java:hover div.top { z-index:999; background-color:#1f81ac;}
#java:hover div.bottom { z-index:998; background-color:#1a6c90;
	background:-moz-linear-gradient(-90deg, #1a6c90, #14506b); background:-webkit-gradient(linear, 0 top, 0 bottom, from(#1a6c90), to(#14506b)); }

/* spring Display bar */
#spring div.top { z-index:93; margin-top:190px; margin-right:2px;}
#spring div.bottom { z-index:92; height:100px; }
#spring:hover div.top { z-index:993; background-color:#7da864; }
#spring:hover div.bottom { z-index:992; background-color:#698d54;
	background:-moz-linear-gradient(-90deg, #698d54, #506b40); background:-webkit-gradient(linear, 0 top, 0 bottom, from(#698d54), to(#506b40)); }
	
/* maven Display bar */
#maven div.top { z-index:93; margin-top:190px; margin-right:2px;}
#maven div.bottom { z-index:92; height:100px; }
#maven:hover div.top { z-index:993; background-color:#7da864; }
#maven:hover div.bottom { z-index:992; background-color:#698d54;
	background:-moz-linear-gradient(-90deg, #698d54, #506b40); background:-webkit-gradient(linear, 0 top, 0 bottom, from(#698d54), to(#506b40)); }