/* set body font, margins and padding to take care of IE and Opera weirdness */

html, body {font-size: 100%; padding: 0; margin: 0; font-family:'Trebuchet MS',Verdana,Arial,sans-serif;}

/* basic TEXT STYLES */

h1, h2 {text-align: center; font-size: 140%;}
h2 {font-size: 120%;}
.small-heading {font-size: 105%; font-weight:normal;}
h3 {font-size: 110%;}
.instruction {margin: 0; padding: .5em 0 .5em 2em; font-weight:bold;}
.c, th {text-align: center;}
caption {text-align: center; font-size: 110%; font-weight: bold;}
.destination{font-weight: bold;}
.warning {text-align:center; color:black; background-color:yellow; margin:0 auto 0 auto; padding:0 auto 0 auto;}
.warning ul, li {text-align:left;}
.success {text-align:center; color:yellow; font-weight: bold; background-color:blue;}
.user-profile {font-size: 80%;}
.user-profile td {vertical-align:top;}
.required {color: Red;}
.right-padded {padding-right:2em;}
dt {font-weight: bold;}

img {border: 0px none;}

/* TRIPS layout and text */

.signup, .signup p {padding:0; margin:0;}
.shaded {background-color: #eee;}
li.trip-list {margin-top: 1.5em;}

table.trip-confirmed, table.trip-wait {
   margin: 0;
   padding: 0;
   float: left;
}

table.trip-wait {
  margin-left: 3em;
  clear: right;
}

.trip-add {
  width: 7em;
}

/* PROFILE stuff */
.user-profile hr {width: 40%;text-align:center;}

/* spacing classes for layout */
.tight {margin-bottom: 0;}
.clear { clear: both; margin: 0; padding: 0; height: 1px;}

hr.separator {width: 70%; text-align: center;}

/* main layout ids
 #container: wraps everything to make IE play nice
 . . #header: holds logo and login.
 . . . . #header img: logo
 . . . . #login: holds login form
 . . . . . . ** additional styles set size and margins of input boxes, labels, submit button and so on
 . . . . #login.inputs: holds the text inputs
 . . #main: central content area
     #nav-wrapper: wraps navigation sidebar b/c of float/clear weirdness in Mozilla Firefox.
 . . . #nav: navigation sidebar
 . . . . . #nav-top, #nav-bot: used to make rounded corners work.
 . . . . . . . .cl, .cr: float corners right or left.
 . . . . . . . ** additional text style for navigation area
 . . #footer: everything below the main content area
*/


/* wrap everything in body in a div.  Can't apply style straight to BODY
because IE is bad */
#container {
  max-width: 48em; /*doesn't work in IE */
  text-align: left;
  margin: 0px auto;
}

#header {
  float: left;
  clear: both;
  width: 100%;
  border-bottom: 3px solid black;
  margin: 0 0 1em 0;
  background: url(../images/banner-long.jpg) no-repeat;
}

#header img {
   margin: 0;
   padding: 0;
   float: left;
   clear: none;
}

/* LOGIN FORM HEADER STYLES -- START */
#login {
   margin: 0;
   padding: .25em 0 0 0;
   float: right;
   font-size: .8em;
   width: 21em;
}

#login form {margin:0; padding: 0;}

#login fieldset {
   margin: .25em .4em 0 0;
   padding: .25em;
}
#login label {/* line up the labels */
         display: block;
         text-align: right;
         white-space: nowrap;
         margin: 0;
         padding: 0;
         width: 18em;
}
#login label input {/* replace width and margin */
         display: inline;
         margin-left: .15em;
         width: 6em;
         margin: 0;
         padding: 0;
}
#login input.submit {/* line up the submit */
         display: block;
         width: 58px;
         height: 28px;
         float: right;
         margin: .35em;
         padding: 0 0 0 .25em;
}

#login p {padding: 0 .4em 0 0;
          margin: 0;
          text-align: right;
          font-weight: bold;
          clear: right;
} /* Create account link */

#login p a {text-decoration: none;}

/* MAIN CONTENT WINDOW LAYOUT STYLES -- START */

#main {
  margin: 0;
  padding: 0 1em;
  border-left: 13em solid #fff;
}

/* NAVIGATION AREA STYLES -- START */

#nav-wrapper {
  float: left;
  clear: none;
  width: 13em;
  padding: 0;
  border: 0;
  margin: 0;
}
#nav {
  float: left;
  width: 13em;
  margin: 0;
  padding: 0;
  border: 0px none Black;
  background-color: #3a638b;
  color: #e5f0e6;
}

#nav-top {
  float: left;
  margin: 0 0 -28px 0;
  height: 36px;
  width: 13em;
}
#nav-bot {
  float: left;
  margin: -5px 0 0 0;
  padding: 0;
  background-color: #3a638b;
  height: 36px;
  width: 13em;
  clear: both;
}
.cl {float: left;}
.cr {float: right;}

#nav a {text-decoration: none; font-weight: bold; color: white;}
#nav a:hover {background-color: blue; color: white;}
#nav h2 {display: none;}
#nav h3 {margin: .5em 0 0; text-align: center;}
#nav p {padding: 0 0 0 .5em; margin: .25em;}


/* FOOTER STYLES */
#footer {
  margin: 0;
  padding: 0;
  width: 100%;
  clear: both;
}
#footer p {font-size: 70%; text-align:justify; width:70%; margin:auto;}
#footer p#flinks {width: 100%; text-align:center;}