/* stylesheet.css */
/* Style rule for the body element */
body {
 background-color: rgb(36, 117, 146);
 background-image: url('images/backofschool.jpg'); /* Default font styling */
 font: 10pt Arial, Helvetica, Sans-Serif;
 color: black;
}
/* Style rule for the wrapper div */
#wrapper {
 width: 95%;
 min-width: 600px;
 max-width: 1200px;
/* margin: 1em auto; */
/* background-color: white; */
/*  border: solid 2px gray; */
/* border-radius: 30px; */
/* box-shadow: 2px 2px 2px gray; */
}
/* Eliminate default margins for all heading types */
h1, h2, h3, h4, h5, h6 {
 margin: 0;
}
/* Make HTML5 layout elements block elements for older browsers */
header, nav, aside, article, footer, section{
 display:block;
}
/*================================== Layout Sections */
/*======== Styling for page header */
header {
	border-top: 20px rgb(81, 111, 145) solid;
	width: 85%;
	margin: 0px 150px;
	height: 135px; /* Font size, line-height, and family */;
	font: 40px/80px Impact, Gadget, Fantasy;
	text-align: left; /* Background color, image, position */;
	background-color: black;
	background-image: url('images/DCSbanner.jpg');
	background-repeat: no-repeat; /* background-position: 10px center; /* Round the top corners */;
	background-position: center;
/* Round the top corners */border-top-left-radius: 18px;
	border-top-right-radius: 18px;
}
/*======== Styling for the sidebar section (asides) */
aside{
 width:120px;
/* padding:10px; */
 float:left;
}
nav{
 width:120px;
 padding:10px;
 float:center;
 text-align: center;
 border: ridge thick gray;
 border-radius: 20px;
/* box-shadow: 2px 2px 2px 2px gray; */
 background-color: rgb(220, 229, 249);
 opacity:0.9;
}
/*======== Styling for links in the Nav section */
nav a{
/* display:block; */
/* background-color: #d0ae8e; */
 color: rgb(44, 44, 44);
/* font-weight: bold; */
 text-align: center;
 /* As wide as the content width */
 width: 100%;
 /* Small vertical margin, zero side margin */
 margin: 2px 0;
 /* Bigger text */
 font-size: 14px;
 /* Some extra height */
 padding: 4px 0; 
 /* No underline or dotted outline */
 text-decoration: none;
 outline: none;
}
nav a:link, nav a:visited {
/* background-color: #d0ae8e; */
/* color: #5d3f25; */
}
nav a:hover, nav a:active {
 background-color: rgb(59,57,57);
 color: white;
 width: 100%;
}
/*======== Styling for the article section */
article {
/* border-top: 40px rgb(142, 177, 217) solid; */
 border-top: 40px #8EB1D9 solid;
 width: 82%;
 background-color: white;
 border-radius: 10px;
 box-shadow: 3px 3px 3px 3px black;
 padding: 10px;
 /* Left margin should match neighboring column full width */
 margin: 10px 0px 0px 155px;
/* border-left:solid 1px white; */
}
/* ==== Styling for tables in the article section */
/* Styling for the table as a whole */
article table {
 /* Remove gaps between table cells */
 border-collapse: collapse; /* Font size, family, and color */
 font: 12pt Times, "Times New Roman" , Serif;
 color: #4c2e16; /* top/bottom and side margins (auto for centering) */
 margin: 1em auto;
}
/* Table header cells */
article th {
 background-color: #405980;
 color: white;
}
/* Header and data cells */
article th, article td {
 border: solid 1px #405980;
 padding: 2px 4px;
}
/* Give even-numbered rows tan background color */
article tr:nth-child(even) {
 background-color: #80B2FF;
}
/* Center align content in column 1 data cells */
article td:nth-child(1) {
 text-align: center;
}
/* Center align content in column 2 data cells */
article td:nth-child(2) {
 text-align: center;
}
/* Center align content in column 3 data cells */
article td:nth-child(3) {
 text-align: center;
}
/* Highlight table row on hover */
article tr:hover {
 background-color: #ff6;
 cursor: default;
}
/* ==== Links and link states in article section */
/* Unvisited links */
article a:link {
 color: #0c391c;
}
/* Visited links */
article a:visited {
 color: #af4600;
}
/* Mouse pointer on link */
article a:hover {
/* background-color: #bc9f81; */
 background-color: #405980;
 color: #1e2953;
}
/* Mouse pointer on link and left button down */
article a:active {
 background-color: #1e2953;
 color: #bc9f81;
}
/* ==== Styling for footer */
footer {
 clear:both;
 height: 45px;
 width: 82%;
 padding: 5px;
 margin: 0px 0px 0px 150px;
/* background-color: white; */
 border-bottom-left-radius: 18px;
 border-bottom-right-radius: 18px;
 text-align: center; /* Background color, image, position */
}
/* Styling for table in footer */
footer table {
 width: 98%;
 margin: 5px auto;
 color:#4c2e16; 
}
/*========================= More general style rules and classes */
/* Style for h1 headings */
h1 {
 font: italic small-caps bold 24px Arial Black, Gadget, Sans-Serif;
 text-shadow: -2px -2px 2px #a48362;
}
/* Style for h2 headings */
h2 {
 font: italic small-caps bold 18px Arial Black, Gadget, Sans-Serif;
 text-shadow: -1px -1px 1px #a48362;
}
/* Style for paragraphs */
p {
 line-height: 1.5;
 margin-top: 0;
}
/* === Style classes */
/* Highlight any span of text */
.hilite {
 background-color: yellow;
}
/* Create raised appearance with border, rounded corners, and shadow */
/* Works with images, tables, and block elements (div, p, and headings) */
.raised {
 border: solid 1px gray;
 border-radius: 5px;
 box-shadow: 5px 5px 5px gray;
}
/* Image floating to the left of neighboring text */
img.left {
 float: left;
 width: 30%;
 margin-right: 10px;
}
/* Image floating to the right of neighboring text */
img.right {
 float: right;
 width: 30%;
 margin-left: 10px;
}
/* Use class="centerall" in p or div to center
 all text and images inside the element */
.centerall {
 text-align: center; /* Clear any floating elements */
 clear: both;
}
.newStyle1 {
	background-color: #333333;
}
.newStyle2 {
	background-color: Hex=;
}