/* COLORS AND BACKGROUNDS */
h1, h2, h3, h4, h5, h6, body { color:#777; }
html, body { background-color:#f3f3f3;}
div { background-color:trasparent;}
a:link, a:visited { color:#d66a2b;}
a:focus, a:hover { color:#ff5a1b; }
/*h2 a:focus, h2 a:hover { border-bottom-color:#ff5a1b; 
  border-bottom-style:solid; border-bottom-width:2px; } */

.research { color:#d66a2b; border-bottom-color:#ff5a1b;}
.curriculum { color:#5C9131; border-bottom-color:#5C9131;}
.coding { color:#bab3a0; border-bottom-color:#bab3a0;}
.life { color:#5174a6; border-bottom-color:#5174a6;}

.research a:focus, .research a:hover { color:#ff5a1b; border-bottom-color:#ff5a1b;}
.curriculum a:focus, .curriculum a:hover { color:#5C9131; border-bottom-color:#5C9131; }
.coding a:focus, .coding a:hover { color:#bab3a0; border-bottom-color:#bab3a0; }
.life a:focus, .life a:hover { color:#5174a6; border-bottom-color:#5174a6; }
/*h2 a:focus, h2 a:hover { border-bottom-style:solid; border-bottom-width:2px; } */
h2 { border-bottom-style:solid; border-bottom-width:2px; border-bottom-color:#777}

.container { 
  background-image:url(../img/shadow862.png);
  background-repeat: repeat-y;
  padding: 0px 6px;
}

/* FONT, STYLE, DECORATIONS */

h1, h2, h3, h4 { font-family:"Trebuchet MS"; }
h2 { font-size:1.5em; }

a { text-decoration: none; }
a:hover, a:active { text-decoration: none; }

#title { font-size: 2em; margin:0.7em 0em 0.7em 2em;}

/* POSITIONS and MARGINS */
.content { min-height:700px;}
#logo { float:right; margin:0.5em 3em 0em 0em;}
#banner img { margin-right:10px; }
h2 { float:left; text-align:center; width:162px; margin:0.5em 30px 2em 30px;}

.item { padding-top:2em; }
.item img { float:left; width:140px; height:140px; 
  border:1px solid #CCCCCC; 
  padding:2px; margin:0em 3em 1em 0em
}
.double { width:350px; float:left; }
/*.item h3 { margin: 2em 1em 0em 2em; }*/

.clear { clear: both; }


/* maille */

.thumb { position:relative; float:left; width:160px; text-align:center; margin:10px 6px 10px 6px;}
.thumb img { border:1px solid #CCCCCC; padding:2px; width:140px; height:140px; }

.hoverbox {	cursor: default; }
.thumb .detail{
 background-color:#ffffff;
	display: none;
	position: absolute;
	top: -25px;
	left: -25px;
	width: 200px;
	height: 200px;
}
.hoverbox :hover .detail {	display: block; }