/*
CSS for NM Navy League site
*/

/* Use a font stack to specify font choices in order */

body {
    font-family:  Verdana, Helvetica, Arial, sans-serif;
    background-color: #e2edff;
    line-height: 125%;
    padding-bottom: 4em;
    margin: 0;
}

h1, h2, h3 {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}

h1 {
    font-size: xx-large;
    color: yellow;
    padding-top: 2em;
    padding-bottom: .6em;
    padding-left: 4em;
    margin: 0;
    background: url(images/NLUS_Primary_Logo_100X107.jpg) no-repeat top left;
}

h2 {
    color: yellow;
    font-size: 130%;
    font-weight: normal;
    padding-top: 15px;
}

h3 {
    color: yellow;
    font-size: 115%;
    font-weight: normal;
    padding-top: 15px;
}
h4 {
    color: yellow;
    font-size: 100%;
    font-weight: normal;
    margin-bottom: 0em;
}
li {
    font-size: small;
    list-style-type: none;
}


p {
    font-size: small;
    color: #fafad2;
    padding-right: 4px;
}


h2.form_head {
    color: black;
    font-size: 130%;
    font-weight: normal;
    padding-left: 10em;
}

p.form_head {
    font-size: 100%;
    color: black;
    padding-left: 5em;
}

fieldset {
  background: #C361D2; border: none;
  margin-bottom: 1em; width: 24em;
  padding-top: 1.5em;
  }

p.legend {
  background: #DED983; color: black;
  padding: .2em .3em; font-size: 1.2em;
  border: 2px outset #DED983; position: relative;
  margin-bottom: -1em; width: 10em;
  margin-left: 1em; margin-top: 1em;
}


#personal {
  background: #F5D9B4;
  border:outset #F5D9B4;  
}

#choices {
  background: #F5D9B4;
  border:outset #F5D9B4;  
}
#guests {
  background: #F5D9B4;
  border:outset #F5D9B4;  
}
#donation {
  background: #F5D9B4;
  border:outset #F5D9B4;  
}

#header {
    border-top: 3px solid #7da5d8; 
}

#tagline p {
    font-style: italic;
    font-family: Georgia, Times, serif;
    background-color: #bed8f3;
    color: navy;
    border-top: 3px solid #7da5d8;
    border-bottom: 3px solid #7da5d8;
    padding-top: .2em;
    padding-bottom: .2em;
    padding-left: .8em;
    margin: 0;
    background: #bed8f3 url(images/tagline-fade.jpg) repeat-y right;
}
#credits {
  border-top: 2px solid yellow;
}
#credits p {
    padding-left: 4em;
}

#directors p {
    padding-left: 2em;
    padding-top: 0;
}

a {
    font-weight: bold;
}

a:link {
    color: black;    
}
a:visited {
    color: navy;
}
a:hover {
    text-decoration: none;
    color: white;
    background-color: navy;   
}
a:active {
    color: aqua;
    background-color: navy;
}

#bodycontent a:link {
    color: yellow;
}
#bodycontent a:visited {
    color: #8dcff4;
}
#bodycontent a:hover {
    text-decoration: none;
    color: white;
    background-color: navy;   
}

#scholarship_reqs li {
    list-style-type: circle;
    color: #fafad2;
}

#reservation h2 {
    color: black;
    font-size: 130%;
    font-weight: normal;
}

#reservation h3 {
    color: black;
    font-size: 115%;
    font-weight: normal;
}

#reservation p {
    font-size: 100%;
    color: black;
    padding-left: 5em;
}

#reservation th{
  text-align: left;
  padding: 0.2em;
}

#reservation td {
  padding: 0.2em;
}
#reservation a {
    font-weight: bold;
}

#reservation a:link {
    color: black;    
}
#reservation a:visited {
    color: red;
}

#reservation a:hover {
    text-decoration: none;
    color: white;
    background-color: navy;   
}
#reservation a:active {
    color: aqua;
    background-color: navy;
}

.fun {
    color: #339999;
    font-family: Georgia, Times, serif;
    letter-spacing: 0.05em;
}
.feature {
    float: right;
    margin: 10px;
}

.attentiongrab {
    width: 50%;
    font-weight: bold;
}

#navigation {
    width: 180px;
    background-color: #7da5d8;
}

/* this section deals with the position of items on the screen.
 * It uses absolute positioning - fixed x and y coordinates measured
 * from the top-left corner of the browser's content display.
 */

#navigation, #bodycontent, #header {
    position: absolute;
}
#navigation, #bodycontent {
    top: 140px;
}
#bodycontent {
    left: 200px;
}
#reservation {
    left: 20px;
}
#header {
    width: 100%;
}
