@charset "UTF-8";
/* admin page specific layout styles
 * copyright 2011 XTN
 * Christian Z. Tamayo
 */

/* ----- global constants ----- */
html { height: 100%; width: 100%; }
body { height: 100%; width: 100%; margin: 0px; padding: 0px; border: 0px;
	font-family: "Trebuchet MS",Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 16px; line-height: 1.28; background: #398235 url("../images/bg.jpg") center no-repeat fixed; }
p, ul, li { font-family: "Trebuchet MS",Verdana, Geneva, Arial, Helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: Georgia, "Times New Roman", Times, serif; }
a {	text-decoration: none; }
a:focus {outline: none}

li:hover ul {
    display: block;
}
li {
    display: inline;
    position: relative;
}

ul {
    padding: 0;
    margin: 0;
}
textarea#styled {
	width: 1000px;
	height: 120px;
	border: 3px solid #cccccc;
	padding: 5px;
	font-family: Tahoma, sans-serif;
	background-image: url(bg.gif);
	background-position: bottom right;
	background-repeat: no-repeat;
}

/* ----- limited-scale reset ----- */
h1, h2, h3, h4, h5, h6, p, address, blockquote, div, ul, li { margin: 0px; padding: 0px; }

/* ----- wrapper & container ----- */
div#wrapper { height: auto; min-height: 100%; width: 100%; position: relative; /*overflow: hidden;*/ }

div#container { height: auto; min-height: 450px; width: 920px; overflow: hidden;
				margin: 0 auto; margin-bottom: .8em; box-shadow: 0 0 10px rgba(0, 0, 0, 0.52);
				border-bottom-left-radius: 7px; border-bottom-right-radius: 7px; 
				background: #FFF url("../images/mainContent_gradient.png") repeat-x; }

div#mainContent { min-height: 450px; width: 920px; overflow: hidden; }

div#header { height: 100px; width: 920px; background-color: #398235; border-bottom: 1px solid #176B12; z-index: 5; }

div#loginLogo {	height:100px; width:405px; overflow: hidden; }
div#loginLogo a { display:block;height:100px; width:405px; }
div#loginLogo a:hover,div#loginLogo a:focus { background-color: #599154; }

div#headerRFloat { height: 100px; width: 510px; text-align: center; }

input#search {font-size: 16px; padding: 3px; width: 230px }
.hint {color: #666; font-style: italic; }


div#nav ul { list-style: none; }
div#nav li { float: left; font-family: tahoma,verdana,arial,sans-serif; font-weight: bold; border-left: 1px solid #488A43; font-size: 12px; }
div#nav li a { display: block; padding: 1ex 1em; color: #0000; }
div#nav li a:hover, div#nav li a:active, div#nav li a:focus { background-color: #599154; }
div#nav li.removeLBorder { border-left: 0; }

/* ----- main Content ----- */
div#sidebar { width: 200px; height: auto; min-height: 450px; background: #333; }
div#sidebar h2 { padding: 10px; }
div#sidebar ul { list-style: none; }
div#sidebar li a { display: block; color: #FFF; font-size: 32px; font-weight: bold; padding: 10px;
					font-family: Verdana,"Trebuchet MS",Geneva,Arial,Helvetica,sans-serif; }
div#sidebar li a:hover,div#sidebar li a:focus { background-color: #FFF; color: #000 }
div#sidebar li a.selected { background-color: #CCC; color: #000; border-left: 20px solid #D61515; }

div#content { width: 720px; height: auto; min-height: 450px; }

div#content h2 { font-size: 30px; color: #1556CF; margin: 10px;}

.eqheights {	margin-bottom: -99999px;
	padding-bottom: 99999px;}

div#profList, div#profSubjList { margin-bottom: 2em; }
div#profList a { font-weight: bold; font-size: 24px; font-variant: small-caps; color: #111; }
div#profList img { margin-right: 2ex; vertical-align: middle; }

.listContainers { min-height: 10px; height: auto; border-bottom: 1px solid #AAA; padding: 10px; margin: 0 30px;
						cursor: pointer; display: block; }
.listContainers:hover { background-color: #FFC233; }
.listContainers:active { background-color: #FFDC33; }
.listContainersF { border-top: 1px solid #AAA; }

.evalInfoContainers {
	padding: 10px; margin-top: 10px; background-color: #444; color: #FFF; line-height: 1.28;
	font-size: 14px;
	display: none;/**/
}

.progressContainers { border-bottom: 1px solid #888; padding-bottom: 8px; margin-bottom: 8px }
.summaryTables { border-collapse: collapse; width: 100%; }

.summaryTables td, .summaryTables th {
    border: 1px solid #98BF21;
    font-size: 1.2em;
    padding: 3px 7px 2px;
}
.summaryTables th {
    background-color: #A7C942;
    color: #FFFFFF;
    font-size: 1.4em;
    padding-bottom: 4px;
    padding-top: 5px;
    text-align: left;
}
.summaryTables tr.alt td {
    background-color: #EAF2D3;
    color: #000000;
}

/* ----- footer ----- */
div#footer {
	width: auto;
	margin: .8em auto;
	padding-bottom: .6em;
	background-color: transparent;
	text-align: center;
	bottom: 0;
	position:relative;
}
div#footer ul {	list-style: none; }
div#footer li {	display: inline; margin-right: 15px; }
div#footer a { color: #C7CED6; text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.3); }
div#footer a:hover { color: #FFF; }

div#logoWatermark { height: 500px; width: 500px; position: fixed; right: -100px; bottom: -70px; z-index: -1;
					background: url("../images/dlsauLogo.png") no-repeat; 
					background-position: right bottom;  }

/* ----- settings.php ----- */
#changePass { text-align: center; line-height: 1.5; width: 459px; margin-top: 2em; border-right: 1px solid #AAA; min-height: 300px; }
#changePass h1 { display: inline-block; color: #111; border-bottom: 2px dotted #111; 
				margin-bottom: 14px; padding-bottom: 4px; }
#changePass table { text-align: left; margin: 0 auto; margin-bottom: 10px; }
#changePass table input {
	border: 1px solid #888; padding: 5px; width: 180px; border-radius: 3px; outline: none;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 16px;
	background-color: #FAEFC3;
}
#changePass table input:hover {
	background-color: #FFCE5C; 
	-webkit-box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 0.4);
	-moz-box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 0.4);
	box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 0.4);
}
#changePass table input:focus,#changePass table input:active {
	background-color: #FFC233;
	-webkit-box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 1);
	-moz-box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 1);
	box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 1);
}
#changePass table td { padding-bottom: 3px;}

.changePassLabel { 
	font-weight: bold; color: #222; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
	text-align: right; padding-right: 1em
}

.changePassMessageContainer,.updateMessageContainer {
	border-radius: 3px; border: 1px solid black; padding: 8px 6px;
	margin: 0 auto 14px; width: 320px; display: none;
	-webkit-box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
	-moz-box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
}
#changePassMessageError,#updateMessageError { display: block; font-size: 14px; background: #E83333; color: #FFF; }
#changePassMessageSuccess,#updateMessageSuccess { display: block; font-size: 14px; background: #33E833; color: #222; }

#period { text-align: center; line-height: 1.5; width: 459px; margin-top: 2em; min-height: 300px; }
#period h1 { display: inline-block; color: #111; border-bottom: 2px dotted #111; 
				margin-bottom: 14px; padding-bottom: 4px; }
#period table { text-align: left; margin: 0 auto; margin-bottom: 10px; }
#period table input {
	border: 1px solid #888; padding: 5px; width: 180px; border-radius: 3px; outline: none;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 16px;
	background-color: #FAEFC3;
}
#period table input:hover {
	background-color: #FFCE5C; 
	-webkit-box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 0.4);
	-moz-box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 0.4);
	box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 0.4);
}
#period table input:focus,#period table input:active {
	background-color: #FFC233;
	-webkit-box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 1);
	-moz-box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 1);
	box-shadow: 0px 0px 3px 0px rgba(25, 0, 0, 1);
}
#period table td { padding-bottom: 3px;}

.periodLabel { 
	font-weight: bold; color: #222; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
	text-align: right; padding-right: 1em
}

.periodMessageContainer,.updateMessageContainer {
	border-radius: 3px; border: 1px solid black; padding: 8px 6px;
	margin: 0 auto 14px; width: 320px; display: none;
	-webkit-box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
	-moz-box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
}
#periodMessageError,#updateMessageError { display: block; font-size: 14px; background: #E83333; color: #FFF; }
#periodMessageSuccess,#updateMessageSuccess { display: block; font-size: 14px; background: #33E833; color: #222; }



#options { text-align: center; line-height: 1.5; width: 460px; margin-top: 2em; }

#options h1 { display: inline-block; color: #111; border-bottom: 2px dotted #111; 
				margin-bottom: 14px; padding-bottom: 4px; }
#options .warning { text-align: left; margin: 0 10px 10px; font-style: italic; font-size: 14px; }

/* ========================================LOGIN STYLES============================ */
/* ----- login header ----- */
#loginLogo { display: block; height: 155px; width: 634px; margin: 0 auto; }
#adminLabel {color: #D61515; font-variant: small-caps; display: inline-block; 
				border-bottom: 2px solid black; border-top: 2px solid black;
				margin: 0.2em 0 0.6em; padding: 0.3ex 0;}
/* ----- login main ----- */
#loginWrapper { position: relative; padding: 0; width: 750px; overflow: hidden;
	/* Sticky Footer */ min-height: 100%; height: auto !important; height: 100%;
	margin: 0 auto; text-align: center; }

/* ----- login form ----- */

#loginFormContainer {
	font-family: "Trebuchet MS", sans-serif;
	width: 205px;
	height: 280px;
	overflow: hidden;
	margin: 0 auto;
}

#loginFormTable { border: 0 none; border-spacing: 0; }
#loginFormContainer .label { font-weight: bold; font-family: Georgia,sans-serif;
	font-variant: small-caps; font-size: 21px; color: black; }

#loginFormContainer .inputWrapper {
    display: inline-block;
    position: relative;
	    width: auto;
    margin-bottom: 12px;
}

#loginFormContainer .inputWrapper input {
	border: 1px solid #667;
	width: 180px;
	font-size: 20px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	padding: 6px;
	border-radius: 3px;
	text-align: center;
}

.inputWrapper input:focus, .inputWrapper input:active {	background-color: #F7E8AE; }
.inputWrapper input:hover {	background-color: #F7EDC6; }

.button { display: inline-block; position: relative; width: 100px; background: url(../images/loginButton.png);
    border: 1px solid;  border-color: #3B6E22 #3B6E22 #2C5115;  text-align: center; }
.button:active { background: none repeat scroll 0 0 #609946; border-bottom-color: #3B6E22; }

#loginButton {
	cursor: pointer; font-size: 16px; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold; color: #FFFFFF; width: 100%; height: 40px;
	background: none repeat scroll 0 0 transparent; border: 0 none; padding: 0; }

.loginMessageContainer {
	border-radius: 3px;
	border: 1px solid black;
	padding: 8px 6px;
	background: #FFF;
	margin: 0 auto 1em;
	display: none;
	-webkit-box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
	-moz-box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.8);
}

#loginMessageError { display: inline-block; font-size: 12px; background: #E83333; color: #FFF; }
#loginMessageLogout { display: inline-block; font-size: 14px; background: #FAFA96; color: #222; font-weight: bold; }


.dropbtn {
    background-color: #4CAF50;
    color: white;
    padding: 10px;
    font-size: 16px;
    border: none;
    cursor: pointer;
	display: block;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {background-color: #32cd32}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
	display: block;
    background-color: #d3d3d3;
}