body {
	font-family: Arial, Verdana, sans-serif;
	background:#008888;

	}

#totalpage { max-width:1220px;  background:#FFFFFF; margin: auto;
border-style:solid;
border-color:#990000;
border-width:2px;
 -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px	}

.clear { clear:both; display:block;height:1px; font-size:1px; line-height:1px; }
.log  {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 80%;}
.private  {font-family: Verdana, Arial, Helvetica, sans-serif; color: #990000; font-size: 80%;  font-weight:bold;}
.underline {border:2px solid #990000;}
.link  {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 100%;}


#header {  background:#EEEEAA;   }
#headleft { float: left; width:12%;margin: 20px 1% 10px 1%;  }
#headmid  { float: left; width:64%; margin: 20px 1% 10px 1%; }
#headright  { float: right; width:18%; margin: 20px 1% 10px 1%;  }



#main { float: left; width:82%;  }
#mainleft { float: left; width:14%; margin: 10px 1% 1px 1%;  }
#mainleftpr  { float: left; width:14%; margin: 10px 1% 10px 1%;  background:#FFDDDD;  }
#mainleftpub  { float: left; width:14%; margin: 10px 1% 10px 1%;  background:#DDFFDD;  }
#mainright { float: right; width:82%; margin: 10px 1% 1px 1%; border-top:2px solid #990000; }
#mainrightbottom { float: right; width:82%; margin: 10px 1% 1px 1%; border-bottom:2px solid #990000; }
#archiveright { float: right; padding-left:35px; }
#mainrightfinal{ float: right; width:82%; margin: 10px 1% 10px 1%;  }
#selectbox{font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 100%; font-style: normal}

#right { float: right; width:16%; margin: 10px 1% 10px 1%; }
#oscer{ padding-left:12px; padding-right:12px; float:right;  } 
.small {font-size: 70%;}

#lefthowl { padding-left:5px;  float:left; min-width:35px; }
#righthowl { float:left; padding-left:15px;} 

#leftprofile { padding-left:5px;  float:left; width:350px; }
#rightprofile { float:left; padding-left:15px;} 

#left-table { padding-left:15px;  float:left; min-width:150px; }
#right-table { padding-left:15px;  float:right; min-width:150px; }
#pictureright { float:right; padding-left:85px;} 


#correct {Border: none; background: none;  font-weight:bold; color:green;}
#incorrect {Border: none; background: none;  font-weight:bold; color:red;}
#notgraded {Border: none; background: none;  font-weight:bold; color:darkblue;}
#editbutton {Border: none; background: none; }

#editbuttonbold {Border: none; background: none;  font-weight:bold;}
#fancybutton {font-family:"Times New Roman", Times, serif; padding-top:0.3em;
font-style:italic; font-weight:bold; font-size:0.85em; Border:  none; background: none;  }
#fancybuttonbig {font-family:"Times New Roman", Times, serif; padding-top:0.3em;
font-style:italic; font-weight:bold; font-size:1.2em; Border:  none; background: none;  }

#quizbutton {Border: none; background: none;  font-weight:bold;}
#birds {font-family: Verdana, Arial, Helvetica, sans-serif;font-style: italic; font-size: 90%;}
#topleft {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 100%;}

#welcome { float:right; }

#editbutton:hover {color:red;}
#fancybutton:hover {color:red;}
#fancybuttonbig:hover {color:red;}
#editbuttonbold:hover {color:red;}
#quizbutton:hover {color:red;}
#logbutton {Border: none; background: none; font-weight:bold;   }
#logbutton:hover {color:red;}
#quizlist {height:45px; width:125px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 80%;}
#quizactive {height:45px; width:125px; background-color:#99FF99; border:1px solid green; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 80%;}
#howls {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 88%; }
#howlsBold {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 88%;color: #990000 }
#howlbutton {Border: none; background: none; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 88%;color: #990000}
#howlbutton:hover {font-weight:bold;}
#follow{font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 65%; }

#yellow {height:50px; background-color:#FFFF40; border:1px solid black; }
#orange {height:50px; background-color:#FFAA50; border:1px solid black; }
#red {height:50px; background-color:#FF5050; border:1px solid black; }
#white {height:50px; border:1px solid black;  }
#pink {height:20px; width:160px; background-color:#FFDDDD   }
#green {height:20px; width:160px; background-color:#DDFFDD   }
#points {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 200%; color:red;}

a { text-decoration:none; }	

a:link {color: #000000; text-decoration: none; }
a:active {color: #0000ff; text-decoration: none; }
a:visited {color: #000000; text-decoration: none; }
a:hover {color: #c41330; text-decoration: none; }

h1 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 100%; font-style: normal}

  h1 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 140%; font-style: normal}
   h1 { margin-top:  .2 em; margin-bottom:  .2 em;  } 
		h1 {color: #000000}

   h2 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 88%; font-style: normal}
   h2 { margin-top:  .2 em; margin-bottom:  .2 em;  } 
		h2 {color: #990000}	
		
		 h3 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 75%; font-style: normal}
   h3 { margin-top:  .2 em; margin-bottom:  .2 em;  } 
		h3 {color: #990000}
	
	p {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 80%; }
	p {color: #000000}	
	p{margin-top: 0em;}
    p{margin-bottom: .7em;}

table, th, td
{
 border-collapse: collapse;
} 
 
.oscerbox
{
background:#FFFAEC;
   padding-top: 10px;
    padding-right: 2px;
    padding-bottom: 13px;
    padding-left: 3px;
border-style:solid;
border-color:#990000;
border-width:2px;
 -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px	
	
}
.noshowoscerbox
{
background:#FFFFFF;
   padding-top: 10px;
    padding-right: 2px;
    padding-bottom: 13px;
    padding-left: 3px;
border-style:solid;
border-color:#FFFFFF;
border-color:#FFFFFF;
border-width:2px;
 -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px	
	
}
.gradebook, .gradebook TD, .gradebook TH
{
font-family:sans-serif;
font-size:10pt;
color:black;

}
.short
{
line-height: .5;
}
.evenrow
{
background-color:#E0EEEE;
}


.oddrow
{
background-color:#F5FDFD;
}
.titlerow
{
background-color:#D5E5E5;
}

custom-select {
  position: relative;
  font-family: Arial;
}

.custom-select select {
  display: none; /*hide original SELECT element: */
}

.select-selected {
  background-color: Gray;
  border-color: transparent transparent #fff transparent;
}

/* Style the arrow inside the select element: */
.select-selected:after {
  position: absolute;
  content: "";
  top: 14px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #fff transparent transparent transparent;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}

/* style the items (options), including the selected item: */
.select-items div,.select-selected {
  color: #ffffff;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: Gray;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}