/***********************************************/
/* oaw.css                                     */
/***********************************************/

/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 

/***********************************************/
/* Custom colors used: OAW                     */
/* white                                       */
/* black                                       */
/* lightblue  #ADD8E6                          */
/* darkblue   #00008B                          */
/* OldLace    #FDF5E6   R: 253, G: 245, B: 230 */
/* SaddleBrown #8B4513  RGB: 139 69 19         */
/***********************************************/

body{
  font-family: Arial,sans-serif;
  color: black;
  background-color: OldLace;
  line-height: 1.166;
  margin: 0px;
  padding: 0px;
}

a{
  color: SADDLEBROWN;
  text-decoration: none;
}

a:link{
  color: SADDLEBROWN;
  text-decoration: none;
}

a:visited{
  color: SADDLEBROWN;
  text-decoration: none;
}

a:hover{
  color: blue;
  text-decoration: none;
}

a:active{
  color: red;
  text-decoration: none;
}

h1{
  font-family: Verdana,Arial,sans-serif;
  font-size: 120%;
  color: SADDLEBROWN;
  margin: 0px;
  padding: 0px;
}

h2{
  font-family: Arial,sans-serif;
  font-size: 100%;
  color: SADDLEBROWN;
  margin: 0px;
  padding: 0px;
}

h3{
  font-family: Arial,sans-serif;
  font-size: 100%;
  color: SaddleBrown;
  margin: 0px;
  padding: 0px;
}

h4{
  font-family: Arial,sans-serif;
  font-size: 100%;
  font-weight: normal;
  color: SaddleBrown;
  margin: 0px;
  padding: 0px;
}

h5{
  font-family: Verdana,Arial,sans-serif;
  font-size: 100%;
  color: SaddleBrown;
  margin: 0px;
  padding: 0px;
}

ul{
  list-style-type: square;
  padding-left: 15px;
}

ul ul{
  list-style-type: disc;
  padding-left: 20px;
}

ul ul ul{
  list-style-type: square;
  padding-left: 25px;
}

ul.indented{
  list-style-type: square;
  padding-left: 25px;
}

label{
  font-family: Arial,sans-serif;
  font-size: 100%;
  font-weight: bold;
  color: black;
}

.indented
   {
   padding-left: 25pt;
   padding-right: 25pt;
   }

.nowrap {
    white-space: nowrap;
    }

p.author {font-style:italic;}

p.intro
  {
/*  padding-left: 25pt;
  padding-right: 25pt; */
  font-size: 85%;
  }

a.readmore
  {
  color: OldLace;
  background-color: SaddleBrown;
  padding: 1px 1em 1px 1px;
  background-image: url(graphics/right_white.gif);
  background-repeat: no-repeat;
  background-position: right center;
  }

a.readmore:hover
  {
  color: blue;
  }

dt {
  font-weight:bold;
  margin-top:5px;
}

/***********************************************/
/* Layout Divs                                 */
/***********************************************/

#masthead{
	padding: 0px 0px 0px 0px;
/*	width: 100%;*/
	width: 981px;
}

#navBar{
  float: left;
  width: 140px;
  font-size: 90%;
  margin: 50px 0 0 0;
}

#navBarDark{
  float: left;
  width: 140px;
  font-size: 90%;
  margin: 50px 0 0 0;
  background-color: SaddleBrown;
  border-radius: 15px;
  box-shadow: -5px 5px 5px #999999;
  color: OldLace;
}

#hmenu{
  font-family: Arial,sans-serif;
  float: left;
  width: 100%;
  margin: 5px 0 0 0;
  z-index: 100;
}

#content{
  float: left;
  background-color: OldLace;
/* padding (top right bottom left) */
  padding: 0px 10px 0px 10px;
  width: 647px;
}

#content li {
  margin-top:5px;
}

#wide-content{
  float: left;
  background-color: OldLace;
  padding: 0px 10px 0px 10px;
  width: 794px;
}

#wide-content li {
  margin-top:5px;
}


#triple-wide-content{
  float: left;
  background-color: OldLace;
  padding: 0px 10px 0px 10px;
  width: 934px;
}

#triple-wide-content li {
  margin-top:5px;
}

#headlines{
  position: relative;
  width: 147px;
  float: right;
  margin: 50px 0 0 0;
  padding: 0px;
  padding-top: 10px;
  font-size: 90%;
  z-index: 0;
}

#recommended{
  position: relative;
  width: 132px;
  float: right;
  margin: 50px 0 0 0;
  padding: 5px 5px 5px 10px;
  padding-top: 10px;
  font-size: 90%;
  z-index: 0;
  background-color: SaddleBrown;
  border-radius: 15px;
  box-shadow: -5px 5px 5px #999999;
  color: OldLace;
}

#recommended ul {
    text-decoration: none;
    color: OldLace;
}

#recommended a {
    text-decoration: none;
    color: OldLace;
}

#recommended a:link,
#recommended a:visited {
    color: OldLace;
}

#recommended a:hover,
#recommended a:active {
    color: blue;
}

#formbutton{
//  position: relative;
  width: 132px;
//  float: right;
  margin: 10px 0 0 0;
  padding: 5px 5px 5px 10px;
  padding-top: 10px;
  font-size: 90%;
  z-index: 0;
  background-color: SaddleBrown;
  border-radius: 15px;
  box-shadow: -5px 5px 5px #999999;
  color: OldLace;
}

#formbutton a {
    text-decoration: none;
    color: OldLace;
}

#formbutton a:link,
#formbutton a:visited {
    color: OldLace;
}

#formbutton a:hover,
#formbutton a:active {
    color: blue;
}

/***********************************************/
/* Components                                  */
/***********************************************/

#siteName{
  margin: 0;
  padding: 0 0 0 10px;
}


/************* #globalNav styles **************/

#globalNav{
  padding: 0px 0px 5px 10px;
  border-bottom: 1px solid #006699;
  color: #006699;
}

#globalNav img{
  display: block;
}

#globalNav a {
  font-size: 90%;
  padding: 0 4px 0 0;
}

/*************** #pageName styles **************/

.pageName{
  margin: 0px;
  padding: 3px 0px 0px 5px;
  font-weight: bold;
  text-align: center;
}

/************** .feature styles ***************/

.feature{
  padding: 0px 0px 10px 10px;
}

.feature h1{
  padding: 30px 0px 5px 0px;
  text-align: center;
  color: SADDLEBROWN;
}

.feature h3{
  padding: 10px 0px 5px 0px;
  font-style:italic;
}

.feature img{
  float: left;
  padding: 10px 10px 0px 0px;
}

/************** .story styles *****************/

.story{
  clear: both;
  padding: 10px 0px 0px 10px;
}

.story p{
  padding: 0px 0px 10px 0px;
}

.story h1{
  color: SADDLEBROWN;
}

/************* #siteInfo styles ***************/

#siteInfo{
  clear: both;
  border-top: 1px solid SADDLEBROWN;
  border-bottom: 1px solid SADDLEBROWN;
  font-size: 75%;
  background-color: OldLace;
  color: SADDLEBROWN;
  padding: 4px 0px 4px 0px;
}

#siteInfo img{
  padding: 4px 0px 4px 0px;
  vertical-align: middle;
}

/************* #search styles ***************/

#search{
  padding: 5px 0px 5px 10px;
  border-bottom: 1px solid #006699;
  font-size: 90%;
}

#search form{
  margin: 0px;
  padding: 0px;
}

#search label{
  display: block;
  margin: 0px;
  padding: 0px;
}


/*********** #navBar styles ***********/

#navBar ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
    width: 140px;
}

#navBar ul a:hover {
  background-color: lightblue;
}

#navBar ul li {
    position: relative;
}

#navBar ul li.expandable {
    background-image: url(graphics/right.gif);
    background-repeat: no-repeat;
    background-position: 7px;
    padding-left: 15px;
}

/* This tricky way of screening for hand-held devices doesn't work in IE
@media only screen and (min-device-width: 481px)  { */
/* expanding sublists     */
/* default width = 200px */
#navBar li ul {
    position: absolute;
    width: 200px;
    left: 139px;
    top: 0;
    display: none;
    background-color: lightblue;
}

/* wider sublist, 400px */
#navBar li ul.w400 {
    position: absolute;
    width: 400px;
    left: 139px;
    top: 0;
    display: none;
    background-color: lightblue;
}
/* }  end @media */

#navBar ul li a {
    display: block;
    text-decoration: none;
    padding: 5px;
/*    border-top: 1px solid #8B4513;*/
/*    border-bottom: 0;*/
}

/* HOVER/EXPANSION BEHAVIOR */
 #navBar li:hover ul {
    display: block;
}

/*********** #navBarDark styles ***********/

#navBarDark h1 h2 h3 h4 {
    color: OldLace;
}

#navBarDark ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
    width: 140px;
    color: OldLace;
}

#navBarDark ul a:hover {
    color: blue;
}

#navBarDark ul li {
    position: relative;
    color: OldLace;
}

#navBarDark ul li.expandable {
    background-image: url(graphics/right.gif);
    background-repeat: no-repeat;
    background-position: 7px;
    padding-left: 15px;
    color: OldLace;
}

/* This tricky way of screening for hand-held devices doesn't work in IE
@media only screen and (min-device-width: 481px)  { */
/* expanding sublists     */
/* default width = 200px */
#navBarDark li ul {
    position: absolute;
    width: 200px;
    left: 139px;
    top: 0;
    display: none;
    color: OldLace;
}

/* wider sublist, 400px */
#navBarDark li ul.w400 {
    position: absolute;
    width: 400px;
    left: 139px;
    top: 0;
    display: none;
    color: OldLace;
}
/* }  end @media */

#navBarDark ul li a {
    display: block;
    text-decoration: none;
    padding: 5px;
    color: OldLace;
}

/* HOVER/EXPANSION BEHAVIOR */
 #navBarDark li:hover ul {
    display: block;
    color: blue;
}

/*********** #hmenu styles ***********/

#hmenu ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
    float: left;
    width: 100%;
    clear: both;
}

#hmenu ul li {
    float: left;
    display: block;
/*    width: 152px;*/ /* 6 tabs */
    width: 184px; /* 5 tabs */
    position: relative;
    text-decoration: none;
    padding: 5px;
    background-color: SaddleBrown;
    border-right: solid 1px OldLace;
    border-bottom: solid 1px OldLace;
}

#hmenu ul a {
    text-decoration: none;
    color: OldLace;
}

#hmenu ul a:link,
#hmenu ul a:visited {
    color: OldLace;
}

#hmenu ul a:hover,
#hmenu ul a:active {
    color: blue;
}

#hmenu ul li.expandable {
    display: block;
    z-index: 100;
}

/* expanding sublists     */
/* width = hmenu ul li width */
#hmenu li ul {
    position: absolute;
/*    width: 152px;*/ /* 6 tabs */
    width: 184px; /* 5 tabs */
    left: 0px;
    top: 30px;
    display: none;
    background-color: OldLace;
}

#hmenu ul li a {
    display: block;
}

/* HOVER/EXPANSION BEHAVIOR */
#hmenu li:hover ul {
    display: block;
}


/*********** #sectionLinks styles ***********/

#sectionLinks{
	position: relative;
	margin: 0px;
	padding: 0px;
	font-size: 90%;
}

#sectionLinks h3{
	padding: 10px 0px 2px 10px;
}

#sectionLinks a {
	display: block;
/*	border-top: 1px solid #006699;*/
	padding: 2px 0px 2px 10px;
}

#sectionLinks a:hover{
	background-color: OldLace;
}

/*********** .relatedLinks styles ***********/

.relatedLinks{
	position: relative;
	margin: 0px;
	padding: 0px 0px 10px 10px;
	font-size: 90%;
}

.relatedLinks h3{
	padding: 10px 0px 2px 0px;
	border-bottom-color: #000099;
}

.relatedLinks a:link,
.relatedLinks a:visited {
	display: block; 
}

/************** #headlines styles **************/

#headlines h3{
  padding: 10px 0px 2px 10px;
}

#headlines a {
  display: block;
/* padding (top right bottom left) */
  padding: 2px 0px 10px 10px;
}

#headlines a:hover{
  background-color: OldLace;
}

/********** link styles emulate navBar styles ********/
#headlines ul {list-style: none; margin: 0; padding: 0;}

/***** special centering & button styles for Letter of Support (2/8/2022) ********/

.aligncenter {
      width: 100%;
      text-align: center;
}

.button {
      background-color: saddlebrown;
        border: none;
        border-radius: 10px;
        color: OldLace !important;
        padding: 20px 34px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 20px;
        margin: 4px 2px;
        cursor: pointer;
}
