@import "base.css";


/* Transversal Nav
---------------------- */
#sections li {height: 100px;}

#sections .observatory a {background: url('i/sections-home.png') 0 0 no-repeat;}
#sections .newspaper a {background: url('i/sections-home.png') -326px 0 no-repeat;}
#sections .foundation a {background: url('i/sections-home.png') -653px 0 no-repeat;}

/* Layout
---------------------- */
#wrapper {background: url('i/tripartite.gif') 0 0 repeat-y; margin: 0 9px;}
.section .col1 {width: 290px; float: left; padding: 0 18px;}
.section .col2 {width: 291px; float: left; padding: 0 18px;}
.section .col3 {width: 291px; float: left; padding: 0 18px;}

/* Content
---------------------- */
.content h2 {font-weight: normal;}

.plus a {padding: 0 0 0 23px; background-position: 0 0.3em; background-repeat: no-repeat; text-decoration: none;}
.plus a:hover {text-decoration: underline;}
.col1 .plus a {background-image: url('i/plus-1.gif');}
.col2 .plus a {background-image: url('i/plus-2.gif');}
.col3 .plus a {background-image: url('i/plus-3.gif');}

.nav ul li {list-style: none; margin: 0;}
.nav ul li a {padding: 0 0 0 12px; background-position: 0 0.4em; background-repeat: no-repeat; color: #000; text-decoration: none;}
.nav ul ul li a {padding: 0 0 0 12px; background-position: 0 0.4em; background-repeat: no-repeat;}
.nav ul li a:hover {text-decoration: underline;}
.nav ul ul {margin: 0 0 0 2em;}
.overlay1 .nav a {background-image: url('i/nav-a-2.gif');}
.overlay2 .nav a {background-image: url('i/nav-b-2.gif');}
.overlay3 .nav a {background-image: url('i/nav-c-2.gif');}
.overlay1 .nav ul ul li a,
.overlay2 .nav ul ul li a,
.overlay3 .nav ul ul li a {background-image: url('i/nav-3.gif');}
.overlay1 .nav a:hover {color: #e20b00;}
.overlay2 .nav a:hover {color: #ffa000;}
.overlay3 .nav a:hover {color: #8ab801;}

/* Overlay
---------------------- */
.overlay {
	position: absolute;
	width: 468px;
	font-size: 0.95em;
	padding: 9px 0 12px 0;
	z-index: 777;
}
.overlay .inner {padding: 5px 30px;}
.overlay > .inner {background: url('i/overlay.png') 0 0 repeat-y;}

.overlayT {height: 9px; width: 468px; display: block; top: 0; left: 0; position: absolute;}
.overlay > .overlayT {background: url('i/overlay-a.png') 0 0 no-repeat;}
.overlayB {height: 12px; width: 468px; display: block; bottom: 0; left: 0; position: absolute;}
.overlay > .overlayB {background: url('i/overlay-b.png') 0 0 no-repeat;}

.overlay .close {color: #e10b00; text-align: right; font-weight: bold;}
.overlay .close a {color: #e10b00;}

.overlay h2 {font-size: 1.2em; margin-bottom: 0.5em;}
.overlay h3 {font-size: 1.1em; margin-bottom: 0.5em;}
.overlay1 h3 {color: #e10b00;}
.overlay2 h3 {color: #ffa000;}
.overlay3 h3 {color: #9c0;}

.overlay p,
.overlay ul,
.overlay ol,
.overlay blockquote {margin-bottom: 0.8em;}

/* Navigation
---------------------- */
#navigation h2 {position: absolute; left: -9999px; top: -9999px;}
#navigation ul li {list-style: none; margin: 0; position: relative;}
#navigation ul li a {padding: 0 0 0 20px; background-position: 0 0.1em; background-repeat: no-repeat; display:block;}
#navigation ul li:hover a,
#navigation ul li.hover a {background-position: -299px 0.1em;}
#navigation .col1 a {background-image: url('i/nav-a-1.gif');}
#navigation .col2 a {background-image: url('i/nav-b-1.gif');}
#navigation .col3 a {background-image: url('i/nav-c-1.gif');}

#navigation .col1 a:hover {color: #e20b00;}
#navigation .col2 a:hover {color: #ffa000;}
#navigation .col3 a:hover {color: #8ab801;}

/* Misc
---------------------- */
.separator {display: block; margin: 0.7em 0; border-bottom: dotted 1px #000; clear: both;}

/* Floats
---------------------- */
.section:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}