/*
 * Stylesheet for Tenshi Animetion, 2011 edition
 *
 * Author: Jae'da Berry
 *
 * Date: 5.7.2011
 *
 * Contents: Classes and styling information for website. CSS3+
 * 			 Tested on MSIE9, Firefox 4, and Google Chrome 10
 */

body {
	margin-top: 0px;
	background-color: #aaa;
	font: 12px Arial;
}

div#document-manager {
	width: 960px;
	height: 100%;
	min-height: 550px;
	background: #339;
	background: -webkit-gradient(linear, left top, left bottom, from(#ccccff), to(#333399)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #ccccff,  #333399); /* for firefox 3.6+ */ 
    border-radius: 20px;
	margin-left: auto;
	margin-right: auto
}

header, footer, article, nav {
	display: block; /* Backwards compatibility */
}
header {
	background: url( '/images/header.png' );
	background-repeat: no-repeat;
	background-position: top right
}
article#page-content { 
	background: url('/images/background.jpg');
	padding: 5px;
	width: 770px; 
	min-height: 350px; 
	float: right;
	margin-right: 5px;
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px
 }
footer {
	clear: both
}
nav#portals {
	display: block;
	margin-left: 40px; 
	margin-top: 40px; 
	float: left
}
nav#sections {
	display: block;
	text-align: right;
	width: 170px;
	float: left;
	background: #6f6fa0;
	margin-left: 5px;
	padding-bottom: 10px;
	padding-top: 10px;
	border-bottom-left-radius: 6px }
div.portal { 
	float: left; 
	padding-top: 4px;
	padding-left: 4px;
	padding-right: 2px;
	padding-bottom: 4px;
	width: 160px;
	height: 52px; 
	margin-left: 2px;
	margin-bottom: 1px;
	text-align: left;
	opacity: 0.75;
	font: 18px Arial;
	color: white;
	font-weight: bolder;
	font-variant: small-caps;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	background-color: #0f0f30 }
div.portal div {
	width: 48px;
	height: 48px;
	float: left;
	margin-right: 5px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	border-radius: 6px;
	border: 2px inset;
	background-color: grey
}
div.portal:hover {
	color: yellow
}
div.portal:hover  div{
	background-position: 0px -96px; 
	border-color: yellow;
	border-style: outset;
	background-color: goldenrod
 }
div.portal-active {
	opacity: 1.0;
	background-color: #6f6fa0;
	margin-bottom: 0px;
	height: 53px
}
div.portal-active div {
	background-position: 0px -48px;
	border-color: white;
	box-shadow: 3px 3px 1px #333;
	background-color: #ccc
}
div#title-bar{ 
	clear: left; 
	font: 16px Arial;
	font-weight: bold;
	color: white; 
	padding-top: 10px;
	padding-left: 180px; 
	margin-left: 5px; 
	width: 770px;
	background: #6f6fa0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
 }
div#navigation-section { 
	float: right; 
	font-size: 12px; 
	margin-right: 10px; 
 }
div#navigation-section a {
	color: white;
	border-bottom: 1px dashed
 }
div#navigation-section a:hover { text-decoration: none }
div.section { 
	padding: 5px;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
	background: #afaff0;
	margin-bottom: 2px;
	margin-left: 30px;
	margin-right: 1px;
	font: 14px Arial
}
div.section:hover {
	background: #ccc;
	margin-left: 10px;
	padding-right: 20px;
	cursor: pointer
 }
div.section:hover a {
	color: black
 }
div.section-active {
	background: white;
	margin-left: 15px;
	margin-right: 0px;
	font-weight: bold;
	padding-top: 10px;
	padding-bottom: 10px
 }
div.section-active a {
	color: #ccc;
	text-shadow: 0px 0px 3px #aaa
 }
div.section-active div.subsection {
	background-color: grey
 }
div.section-active div.subsection:hover {
	background-color: #393
 }
div.subsection { 
	background-color: #339;
	text-align: center;
	padding-left: 5px;
	margin-bottom: 2px;
	margin-left: 20px;
	border-radius: 4px
 }
div.subsection:hover {
	background-color: #393
 }
div.subsection a { 
	color: white;
	text-shadow: 0px 2px 2px #333
 }
div#login-div { 
	float: right; 
	margin-right: 80px;
	margin-top: 25px }
div#login-div a:hover { text-decoration: underline }
div#page-comments {
	padding-left: 180px;
	padding-right: 20px
 }
div#permanent-url {
	float: right;
	padding-right: 20px;
	color: grey;
	font-size: 10px }
div#permanent-url a {
	color: #a0a09f;
	text-decoration: underline}
div.welcome-page-feature-window {
	width: 540px;
	height: 260px;
	margin-top: 10px;
	background-color: red
 }
div.welcome-page-feature-item {
	width: 100px;
	height: 45px;
	background-color: pink;
	float: left
 }
div.welcome-page-feature-window-image {
	width: 540px;
	height: 200px;
	background-color: blue
 }
div.poll-title {
}
div.poll-description {
}
div.poll-options {
}
div#copyright { 
	font: 10px Arial; 
	color: white;
	text-align: right; 
	padding-right: 20px; 
	padding-top: 5px; 
	padding-bottom: 5px;
	clear: right }

/* Content-level elements */
h1 {
	font: 18px Arial;
	font-weight: bold;
	color: #566951;
	margin-bottom: 15px;
	margin-top: 0px;
	text-shadow: 2px 2px 2px #aaa
}
h2 {
	font: 16px Arial;
	font-weight: bold;
	color: blue;
	margin-bottom: 10px;
	margin-top: 0px;
	text-shadow: 2px 2px 1px #aaa;
}
h3 {
	font: 14px Arial;
	font-weight: bold;
	color: lightBlue;
	margin-bottom: 5px;
	margin-top: 0px;
	text-shadow: 1px 1px 1px #aaa
}
p { 
	text-align: justify;
	text-indent: 10px
}
a { text-decoration: none }