@import url('https://fonts.googleapis.com/css?family=Open+Sans');

/* global course styles with rebranding */
body {
font-family: 'Open Sans', sans-serif;
}

p, td, li, ul, ol, h1, h2, h3, h4, h5, h6 {
font-family: 'Open Sans', sans-serif;
color: #003478; /* A2LA blue */
}

#content h2 {
color: #003478 !important; /* A2LA blue */
font-size: 16px !important;
}

#content h4 {
color: #003478 !important; /* A2LA blue */
}

/* main and submenus */
#bkmenu{
width: 550px;
margin: 20px;
}

#bkmenu h1 {
margin: 0;
padding: 0;
font-size: 22px;
line-height: 1.25em;
font-style: normal;
font-weight: bold;
color: #003478 !important; /* A2LA blue */
}

#bkmenu h2 {
margin: 0;
padding: 0;
font-size: 18px;
line-height: 1.25em;
font-style: normal;
font-weight: bold;
color: #ee7624 !important; /* A2LA orange */
}

#bkmenu .prompt {
margin-top: 1em;
padding: 0;
font-size: 14px;
line-height: 1em;
font-style: italic;
font-weight: bold;
color: #007dba; /* A2LA light blue */
}

#bkmenu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#bkmenu li {
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 2.5em;
margin-bottom: 1px;
background-color: #ddd !important;
padding:2px 10px;
}

#bkmenu a:link {
color: #003478 !important; /* A2LA blue */
text-decoration: none;
}

#bkmenu a:hover {
color: #ee7624 !important; /* A2LA orange */
text-decoration: none;
padding-left:10px;
}

#bkmenu li.inactive {
color: #aaa !important;
}


/* left nav panel */
#nav{
height: 600px;	
}

#nav p{
margin: 0;
padding: 0 0 4px 0;
color: #002855; /* A2LA dark blue */
}

#nav p.notavail{
color: #666666;
font-size: 12px;
font-style: normal;
font-weight: normal;
text-decoration: none;
}

#nav a:link, #nav a:visited{
color: #002855; /* A2LA dark blue */
font-size: 13px;
font-style: normal;
font-weight: bold;
text-decoration: none;
}

#nav a:hover{
color: #ee7624 !important; /* A2LA orange */
font-size: 13px;
font-style: normal;
font-weight: bold;
text-decoration: none;
}

#linkset1{
position: absolute; 
left: 30px; 
top: 155px; 
width: auto; 
height: auto;
}

#linkset2{
position: absolute; 
left: 30px; 
top: 275px; 
width: auto; 
height: auto;
}

#linkset3{
position: absolute; 
left: 30px; 
top: 395px; 
width: auto; 
height: auto;
}

#exit{
position: absolute; 
left: 30px; 
top: 520px; 
width: auto; 
height: auto;
background-color: #003478 !important; /* A2LA blue */
}

#exit p {
color: #eeeeee !important;
font-style: normal;
font-weight: bold;
font-size: 13px;
text-decoration: none;
line-height: 1em;
padding: 8px;
}

#exit a {
color: #eeeeee !important;
}

#exit a:hover{
color: #ee7624 !important; /* A2LA orange */
}

.ojtqmark {
font-weight:bold;
color:#007dba; /* A2LA light blue */
}


/* content pages */
#content p.pager{
margin-top: 30px;
}

#content p.pager a:link, #content p.pager a:visited{
line-height: 30px;
background-color: #eee;
color: #444;
font-style: normal;
font-weight: bold;
font-size: 11px;
text-decoration: none;
padding: 5px;
margin-right: 20px;
border: 1px solid #aaa;
}

#content p.pager a:hover{
color: #ee7624 !important; /* A2LA orange */
}

#content .maintopic {
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 22px;
margin-bottom:0
}

#content .subtopic {
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 16px;
margin-bottom: 1em;
}

#content .term {
color:#EE7624; /* A2LA orange */
font-weight: bold;
font-size: 18px;
line-height:1em;
letter-spacing: 1px;
text-shadow: 1px 1px #aaa;
margin:0;
padding:0;
}

#content .definition {
font-size: 18px !important;
color: #003478 !important; /* A2LA blue */
background-color: #efefef; !important;
font-style: normal !important;
text-decoration: none !important;
margin:10px 0 20px 0;
padding:10px 12px 12px 14px;
border: 1px solid #ee7624; /* A2LA orange */
}

#content p.caption{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 12px;
line-height: 1.2em;
margin-bottom:20px;
padding:0;
}

#content p.caption{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 12px;
line-height: 1.2em;
margin-bottom:20px;
padding:0;
}

#content table.exhibit {
background-color: #eee;
color: #003478 !important; /* A2LA blue */
margin:20px 0;
border: 1px solid #003478 !important; /* A2LA blue */
border-collapse: collapse;
}

#content table.exhibit td, th {
padding: 8px;
text-align: left;
color: #003478 !important; /* A2LA blue */
border: 1px solid #003478 !important; /* A2LA blue */
}

#pager{
width: 350px;
margin: 20px;
}

#pager p{
line-height: 30px;
}

#pager a:link, #pager a:visited{
background-color: #eeeeee;
color: #aaaaaa;
font-style: normal;
font-weight: bold;
font-size: 11px;
text-decoration: none;
padding: 5px;
border: 1px solid #aaaaaa;
}

#pager a:hover{
color: black;
}

#content {
width: 550px;
margin: 20px;
}

#content img{
float: right;
margin: 10px 0 20px 20px;	
}

#content img.indent{
float: none;
margin: 0 0 20px 40px;
}

#content img.obj{
float: none;
margin: 0 0 6px 6px;
border: 0;
}

#content img.left{
float: none;
margin: 5px;
}

#content img.bbar{
float:none;
display: inline;
margin:0;
padding:0;
}

#content img.title{
float: none;
margin: 0;
}

#content h1{
color: #000066;
font-style: normal;
font-weight: bold;
font-size: 18px;
margin: 0 0 1em 0;
}

#content h2{
color: #003478 !important; /* A2LA blue */
font-style: italic;
font-weight: bold;
font-size: 14px;
margin: 0 0 .25em 0;
}

#content h3{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 16px;
font-variant: small-caps;
margin: 0 0 .75em 0;
border-bottom: solid 2px color: #003478 !important; /* A2LA blue */
}

#content h4{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 14px;
margin: 1em 0 0 0;
}

#content p{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 1.5em;
margin: 0 0 1em 0;
}

#content p.formula{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 20px;
margin: 10px;
text-align: center;
}

#content blockquote{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 1.25em;
padding: 10px;
background-color: #eee;
border: 1px solid #ccc;
margin: 0 10px 10px 10px;
}

#content a:link, #content a:visited{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 1.5em;
margin: 0 0 1em 0;
}

#content a:hover{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 1.5em;
margin: 0 0 1em 0;
}

#content p.bio{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 1.2em;
}

#content p.notavail{
color: #666666;
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 1.5em;
margin: 0 0 1em 0;
}

#content p.prelist{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 1.5em;
margin: 0 0 .5em 0;
}

#content p.stem{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
margin: 10px 0 -10px 0;
}

#content p.ropt{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
margin: 0 0 .5em 6px;
}

#content ul,#content ol{
margin: 0 0 21px 40px;
padding:0;
}

#content li{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 1.5em;
}

#content em{
font-weight: bold;
font-style: italic;
color: #003478 !important; /* A2LA blue */	
}

#content p.copy{
color: #444;
font-size: 11px;
font-style: normal;
font-weight: normal;
text-align: center;	
}

#titlepage{
width: 550px;
margin: 20px;
}

#titlepage img{
margin: 0;
}

#titlepage p.copy{
color: #666;
font-size: 11px;
font-style: normal;
font-weight: normal;
text-align: center;	
}

#feedback{
height: auto;
width: 250px;
margin: 0;
padding: 0;
background: #F8E6AE;
border: solid 1px #cccccc;
visibility: visible;
}

#feedback p{
color: #3C1A11;
font-size: 16px;
font-weight: bold;
font-style: normal;
margin: 0;
padding: 10px;
}

#feedback p.label{
color: #F8E6AE;
background: #3C1A11;
font-size: 12px;
font-weight: bold;
font-style: normal;
margin: 0;
padding: 0 0 2px 10px;
}

#title p{
color: #990000;
font-style: normal;
font-weight: bold;
font-size: 16px;
}

#title em{
font-style: italic;
font-size: 16px;
}

#menu h1{
background-color: #F8D66F;
color: #3D1910;
border: 1px solid #3D1910;
font-style: normal;
font-weight: bold;
font-size: 20px;
margin: 0 0 10px 0;
padding: 4px 10px 4px 10px;
}

#menu h2{
background-color: #eee;
color: #003478 !important; /* A2LA blue */
border: 1px solid #3D1910;
font-style: normal;
font-weight: bold;
font-size: 16px;
margin: 16px 0 16px 0;
padding: 2px 10px 2px 10px;
}

#menu h3{
color: #003478 !important; /* A2LA blue */
font-style: italic;
font-weight: bold;
font-size: 14px;
font-variant: normal;
margin: 0;
border: 0;
}

#menu li{
color: #3D1910;
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 21px;
margin: 0;
}

#menu li.indent{
margin-left: 16px
}

#menu p{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 12px;
margin-left: 16px
}

#menu hr{
color: white;
border-top: 1px dotted black;
margin: 10px 10px 0 -32px;	
}

#menu a:link{
color: #3D1910;
text-decoration: underline;
}

#menu a:visited{
color: #003478 !important; /* A2LA blue */
text-decoration: underline;
}

#menu a:hover{
color: #F8D66F;
text-decoration: underline;
}

#text p{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 21px;
margin: 0 0 21px 0;
}

#text p.formula{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 16px;
margin: 0 0 16px 0;
}

#text h2{
color: #003478 !important; /* A2LA blue */
font-style: italic;
font-weight: bold;
font-size: 14px;
line-height: 21px;
margin: 0;
}

#text p.list{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 21px;
margin: 0 0 7px 0;
}

#text ul{
margin: 0 0 0 40px;
}

#text li{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
line-height: 21px;
margin: 0;
}

#text li.last{
margin: 0 0 21px 0;	
}

#end p{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 15px;
}

#end em{
font-family: Arial, Helvetica, sans-serif;
color: #990000;
font-style: normal;
font-weight: bold;
font-size: 13px;
}

#present{
margin: 20px;
padding: 0;
}

#present img{
float: none;
padding: 0;	
margin: 0;	
}

#present p{
font-size: 14px;
color: #003478 !important; /* A2LA blue */
margin: 0 0 2em 0;
padding: 0;	
}

#present p.stem{
font-size: 14px;
color: #003478 !important; /* A2LA blue */
margin: 0 0 10px 0;
line-height: 1.5em;
padding: 0;	
}

#present p.opt{
font-size: 14px;
color: #003478 !important; /* A2LA blue */
margin: 0;	
padding: 0;	
}

#present p.legend{
font-size: 14px;
color: #003478 !important; /* A2LA blue */
margin: 0;
padding: 0;
}

#present form{
margin: 0;	
padding: 0;	
}

#present table{
margin: 0 0 20px 0;	
padding: 0;
}

#present h1{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 18px;
margin: 0 0 1em 0;
}

#present h2{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 12px;
margin: 10px 0 10px 0;
}

#present p.incor{
color: red;
font-style: normal;
font-weight: bold;
font-style: italic;
font-size: 12px;
}

#present p.cor{
color: green;
font-style: normal;
font-weight: bold;
font-style: italic;
font-size: 12px;
}

#question{
width: 550px;
margin: 0;
}

#question h1{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 18px;
margin: 0 0 1em 0;
}

#question h2{
color: #003478 !important; /* A2LA blue */
font-style: italic;
font-weight: bold;
font-size: 14px;
margin: 0 0 .5em 0;
}

#question form{
margin: 5px 0 20px 0;
padding: 0;
}

#question p{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
margin: 0;
padding: 0;
}

#question p.choice{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
margin: 0 0 2px 0;
}

#question p.pager a:link, #question p.pager a:visited{
line-height: 30px;
background-color: #eee;
color: #444;
font-style: normal;
font-weight: bold;
font-size: 11px;
text-decoration: none;
padding: 5px;
margin-right: 20px;
border: 1px solid #aaa;
}

#question p.pager a:hover{
color: #ff6600;
}


#resources h1{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 16px;
margin: 0 0 10px 0;
}

#resources h2{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 14px;
margin: 0;
}

#resources p{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
margin: 0 0 10px 0;
}

#resources a:link, a:visited{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
text-decoration: underline;
margin: 0;
}

#resources a:hover{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 14px;
text-decoration: underline;
margin: 0;
}

#map h1{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 16px;
margin: 0 0 10px 0;
}

#map h2{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: bold;
font-size: 12px;
margin: 0;
}

#map ul{
margin: 0 0 0 30px;
}

#map li{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 11px;
margin: 0;
}

#map li.last{
margin: 0 0 10px 0;	
}

#glossary h4{
/*background-color: #F8D66F;*/
font-size: 12px;
border-top: 1px solid color: #003478 !important; /* A2LA blue */
margin: 10px 0 5px 0;
padding: 10px 5px 0 5px;
}

#glossary p, #glossary p.prelist, #glossary li{
color: #003478 !important; /* A2LA blue */
font-style: normal;
font-weight: normal;
font-size: 12px;
line-height: 1.25em;
margin: 0 0 1em 0;
padding: 0 5px 0 5px;
}

#graph{
margin: 10px 0 20px 0;
background: #eee;
border: 1px solid #bbb;
}

#graph td{
margin: 0;
padding: 0;	
}

#graph p{
font-size: 12px;
font-weight: bold;
margin: 0;
padding: 0 0 0 5px;
text-align: right;
}

#graph p.scorelabel{
color: #003478; /* A2LA blue */
}

#graph p.passlabel{
color: #007dba; /* A2LA light blue */
}

#graph img{
float: left;
margin: 0;
padding: 0;	
}

#graph img.scorebar{
height: 20px;
}

#graph img.passbar{
height: 20px;
}

/* multiple choice tutorial questions */
#mchoice {
width:520px;
background:#eee;
border:1px solid #007dba !important; /* A2LA light blue */
border-radius:6px;
padding:10px;
font-size:14px;
text-align:left;
}

#mchoice td {
padding:5px;
text-align:left;
}

#mchoice .choices {
font-size:12px;
background:#ddd;
border:1px solid #007dba !important; /* A2LA light blue */
border-radius:8px
}

#mchoice td.prompt {
font-size: 18px;
line-height: 1em;
letter-spacing: 1.2;
font-weight:bold;
color: #007dba !important; /* A2LA light blue */
}

#mchoice td.qbutton {
width:32px;
cursor:pointer;
}

#mchoice td.qoption {
width:450px;
text-align:left;
}

#mchoice img {
float:left;
padding:0;
margin:0;
}



