body {
  font-size:87.5%; /* cross-browser 1em=16px; sets 14px base size */
  line-height:130%; /* 16x1.125=20px */
  background: url("/images/page-bg.jpg") white repeat-x;
  /* background: #71A1C7; */
}

#main {
  background: white;
  width: 67em;
  padding:0em;
  border: solid #D8D8CF 1px;
  margin:0 auto;
  min-width:950px;
}

#wrapper {
  clear: both;
  position: relative;
  background: #E8E8E2;
  padding: 0.5em;
  height:100%;
  overflow:hidden;
}

/* ========== nav & header styles ============ */

#logorow { //logotype & slogan
    position:relative;
}
/* styles to hide logotype replacement text*/
div#logorow h1 {
    position: relative;
    width: 270px;
    height: 96px;
    margin: 0;
    font: bold 9px sans-serif, Arial;
    float: left;
    }
    
div#logorow h1 span {
    position: absolute;
    width: 100%; 
    height: 100%;
    background-image: url("../images/logotype.gif");
    float: left;
}

div#logorow h2 {
    position: relative;
    width: 350px;
    height: 60px;
    margin: 0;
    font: bold 9px sans-serif, Arial;
    float: right;
    }
    
div#logorow h2 span {
    position: absolute;
    width: 100%; 
    height: 100%;
    top: 0;
    background-image: url("../images/hopkins-bme.gif");
    float: right;
}

div#logorow h2 span.bmelogo {
    position: absolute;
    width: 100%; 
    height: 100%;
    top: 0;
    background-image: url("../images/biomedical-engineering-large-.horizontal.png");
    float: right;
}

#logorow form {
  font: bold 0.9375em Arial, Helvetica, sans-serif; /* same as navbar */
  margin:0.5em 16px 0.25em;
  float: right;
  clear: right;
}

#navbar ul {
  width:100%;
  background: url("../images/navbarbg.gif") #E8E8E2 repeat-x;
  float:left;
  margin:0;
  padding:0;
  list-style:none;
}
  
#navbar li {
  padding: 0; 
  display:inline;
  font: bold 0.9375em/2.5em Arial, Helvetica, sans-serif; /* 15px */
 }
 
#navbar a {
  display: block;
  float:left;
  width:auto;
  text-decoration: none;  
  color: #4A4640;
  border-right: solid #D8D8CF 2px;
  padding: 0em 0.8em;
  background: url("../images/navbarbg.gif") #E8E8E2 repeat-x;
}

#navbar a:hover,
#navbar a:focus,
#navbar a:active {
  background: url("../images/navbarbg.gif") #E8E8E2 repeat-x 0 -100px;
}

#home .home a, 
#about-us .about-us a,
#news-and-events .news-and-events a,
#educational-programs .educational-programs a,
#design .design a,
#industry .industry a,
#submit-a-project .submit-a-project a,
#design-day .design-day a,
#contact .contact a {
  background: url("../images/navbarbg.gif") #4A4640 0em -200px repeat-x;
  color: #fff;
}

#home .home a:focus, 
#about-us .about-us a:focus,
#news-and-events .news-and-events a:focus,
#educational-programs .educational-programs a:focus,
#design .design a:focus,
#industry .industry a:focus,
#submit-a-project .submit-a-project a:focus,
#design-day .design-day a:focus,
#contact .contact a:focus {
  background: url("../images/navbarbg.gif") #4A4640 0em -200px repeat-x;
}

/* ========== end nav & header styles ============ */

#content { /* regular page center column */
  width: 29em; 
  min-width:360px;
  background: #fff;
  padding: 0.25em 1.5em 1em; 
  border: solid #D8D8CF 1px;
  margin: 0em 0.5em 0em;
  float: left;
 }

#content-wide { /* Project Gallery, News */
  width: 50em; 
  background: #fff;
  padding: 0.5em 1.25em 1em; 
  border: solid #D8D8CF 1px;
  margin: 0em 0em 0em 0.5em;
  float: left;
 }

#left_sidebar {
  width: 11.5em; /* 188px */
  background: #fff;
  padding: 0.75em 1.5em 1em 0;
  border: solid #D8D8CF 1px;
  float: left;
} 
#left_sidebar ul {
  list-style: none;
  list-style-position: outside;
}
#left_sidebar ul > ul{
  margin-left: -1.5em;
}
#left_sidebar li {
  font: bold 1em/1.25em Arial, Helvetica, sans-serif; /* 16px/22.4px */
  margin-bottom: 0.5em;
  margin-left: -0.5em;
}
#left_sidebar li.selected {
  list-style: url("../images/green-right-triangle.gif"); 
}
#left_sidebar li.selected a {
  color: #829637;
}

#right_sidebar {
  /* 250px pictures + padding */
  width: 18em; /* 248px */
  background: #fff;
  padding: 0.25em 1em;
  border: solid #D8D8CF 1px;
  float: left;
}
#right_sidebar img {
  margin-top: 0.75em;
}

#right_sidebar p, #right_sidebar li {
  font: 0.875em Arial, Helvetica, sans-serif;
}
#right_sidebar p.caption {
  font-style: italic;
  text-indent: 0em;
}
#right_sidebar.sidebar1,
#right_sidebar.sidebar5 {
  background: #71A1C7;
}
#right_sidebar.sidebar2 {
  background: #B1D86E;
}
#right_sidebar.sidebar3,
#right_sidebar.sidebar4 {
  background: #CC7A3E;
}

#footer {
  //width: 65.25em;
  width: 910px;
  background: white;
  padding: 1em 0.5em;
  border-left: solid #D8D8CF 1px; 
  border-right: solid #D8D8CF 1px;
  border-top: solid #71A1C7 4px;
  border-bottom: solid #D8D8CF 1px;
  //margin-top: 0.375em;
  float: left;
}
#copyright {
  width: 67em; 
  font: 0.75em Arial, Helvetica, sans-serif;
  color: #4A4640;
  margin: 0.75em 0.5em 0.25em;
  float: left;
}
  
a {
  color: #4F6E98;
  text-decoration: none;
}
a:hover {
   color: #829637;
}
  
h1 {
  font-family: Arial, Helvetica, sans-serif; 
  font-weight: bold;
  font-size:1.5em; /* 24px */
  line-height:1.25em; 
}
h2 {
  font-family: Arial, Helvetica, sans-serif;
  font-size:1.25em; /* 20px */
  line-height:1.25em; 
  color: #CC7A3E;  /* orange */
}
h3 {
  font: bold 1.125em Arial, Helvetica, sans-serif;
  line-height: 125%;
  color: #0066CC ; /* med blue changed from green 11/15 */
}
h4 { /* 14px paragraph heads */
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  text-indent: 0em;
  margin-bottom: -0.875em; /* no extra linebreak displayed */
}

p { /* 14px */
  font-family: Arial, Helvetica, sans-serif;
  /*text-indent:  1.5em; This indents the first line of text and was removed 11/15*/
}

table, legend, li, dl {
  font-family: Arial, Helvetica, sans-serif;
}
th {
  font-weight:bold;
  text-align:left;
  color: #4F6E98;
}
tr {
  border-bottom: #D8D8CF 1px solid;
}
td {
  padding:0.25em;
}

label {
  font: 1em/1.25em Arial, Helvetica, sans-serif;
  margin-right: 0.25em;
}

dt {
  font-weight: bold;
  line-height: 125%;
}
dd {
  margin-bottom: 0.875em;
}

ul.biglist li { /* display lists; bold green */
  font: bold 1.125em/1.25em Arial, Helvetica, sans-serif; /* 16px/22.4px */
  list-style-type: square;
  color: #829637; /* dark green */
  margin-bottom: 0.5em;
}
ul.biglink li {
  font: bold 1.125em/1.4em Arial, Helvetica, sans-serif; /* 16px/22.4px */
  list-style-type: none;
  list-style-image: url("../images/link-forward-triangle.gif");
  list-style-position: outside;
  margin-left: -0.5em;
  color: #71A1C7; /* light blue */
}
ul.bigbacklink {
  float:left;
  clear:left;
}
ul.bigbacklink li {
  font: bold 1.125em/1.4em Arial, Helvetica, sans-serif; /* 16px/22.4px */
  list-style-type: none;
  list-style-image: url("../images/link-back-triangle.gif");
  list-style-position: outside;
  margin-left: -0.5em;
  color: #71A1C7; /* light blue */
}
ul.link li {
  list-style-type: none;
  list-style-image: url("/images/link-forward-triangle.gif");
  list-style-position: outside;
  margin-left: -0.75em;
}
ul.backlink {
  float:left;
  clear:left;
}
ul.backlink li {
  list-style-type: none;
  list-style-image: url("/images/link-back-triangle.gif");
  list-style-position: outside;
  margin-left: -0.75em;
}
img {
    border: none;
}

.caption { /* mainly for right sidebar */
  font-style: italic;
  text-indent: 0em;
}
.indent {
  margin-left:2em;
}
.pictureleft {  /* inset picture left */
  padding-right: 20px; 
  padding-bottom: 20px;
  float: left; 
}
.pictureright {  /* inset picture right */
  padding-left: 20px; 
  padding-bottom: 20px;
  float: right; 
}

.floatleft {
  float: left;
  clear: left;
}
.floatright {
  float: right;
  clear: right;
}
.overunder {
  border-top: solid #D8D8CF 2px;
  border-bottom: #D8D8CF 2px solid;
}  
.over {
  border-top: solid #D8D8CF 2px;
}  
.white {
  color: #fff;
}
.gray {
  color: #4A4640;
}
.green {
  color: #B1D86E;
}
.required { /* red */
  color: #f00;
}

.notextindent {
  text-indent: 0;
}
.nodisplay, .hidden {
  display: none;
}
.greenquotebox {
  padding: 20px;
  border-top: solid #829637 2px;
  border-bottom: solid #829637 2px;
  background: #B1D86E;
  text-align: right;
}  
