/* Global css for vet site */

/******************* ELEMENTS ***********************/
body {
    margin: 0;
    padding: 0;
    background: #EFF5FF;
    color: #000;
    font-family: Verdana, Arial, sans-serif;
}

h1, h2, h3 {
   margin: 0;
}

h1 {
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    font-size: 230%;
}

h3 {
    font-family: "Trebuchet MS", Arial, sans-serif;
    font-style: italic;
}

h4 {
    text-align: center;
}

a:link {
    color: #31599A;
}

a:visited {
    color: #31599A;
}

a:hover {
    color: #657725;
    background: #E7F3CE;
}

blockquote {
    background: #eee;
    border: 1px solid #ccc;
    padding: 10px;
    margin: 10px 0;
}

/********************* DIVS **************************/
/* page wrapper to restrain total width on big monitors */
#page {
    margin: 0 auto;
    width: 780px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    background: #fff;
}

#header {
    margin: 0;
    padding-right: 15px;
    padding-bottom: 10px;
    background: #A9BB67 url('images/HVSgradient.jpg') repeat-x;
    color: #653310;
    border-left: 1px solid #A9BB67;
    border-right: 1px solid #A9BB67;
    border-bottom: 3px solid #653310;
}

#header a {
    text-decoration: none;
    color: #653310;
}

#header a:hover {
    text-decoration: none;
    background: none;
}

/* this has the roof image and contains the main header text */
#roof {
    width: 600px;
    height: 70px;
    padding-top: 15px;
    padding-left: 10px;
    background: url('images/roof.gif') no-repeat;
}

#head-contact {
    width: 100%;
    text-align: right;
    font-size: 110%;
}

/**** NAVIGATION ****/
#nav {
    padding: 15px 0;
    width: 200px;
    float: left;
    margin-bottom: 10px;
    background: #D1E298 url('images/navbtm.gif') bottom no-repeat;
    border: px solid #BFD770;
    color: #78854a;
    font-family: Arial, sans-serif;
    font-weight: bold;
}

/* all links - the block gives us hover effect over the whole block and not just the text */
#nav a {
    display: block;
    padding: 5px 0px 5px 30px;
    text-decoration: none;
    width: 170px;
}

#nav a:link {
    color: #653310;
}

#nav a:visited {
    color: #653310;
}

/* on hover we get a dark background with the paw showing */
#nav a:hover {
    color: #653310;
    background: #A9BB67 url('images/PawBrown.gif') no-repeat 7px 7px;
}

/* make our nav list flush and no default bullets */
#nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#navpic {
    width: 170px;
    height: 120px;
    margin: 10px 15px 0 15px;
    background: url('images/navpics/rotator.php');
}

/* rounded bottom */

/**** END NAVIGATION ****/

#content {
    margin-left: 200px;
    padding: 0 20px 15px 20px;
}

/****** The "blue bar" title on each page ******/
#title {
    padding: 10px 0;
    margin: 0 -5px;
    background: #D4DFF1;
    color: #653310;
    font-family: "Trebuchet MS", Arial, sans-serif;
    font-size: 120%;
    font-weight: bold;
    font-style: italic;
}

#topLeft {
    float: left;
    width: 15px;
    height: 15px;
    margin-top: -10px;
    background: url('images/cornerTL.gif') no-repeat;
}

#topRight {
    float: right;
    width: 15px;
    height: 15px;
    margin-top: -10px;
    background: url('images/cornerTR.gif') no-repeat;
}

#btmLeft {
    float: left;
    width: 15px;
    height: 15px;
    margin-top: -5px;
    background: url('images/cornerBL.gif') no-repeat;
}

#btmRight {
    float: right;
    width: 15px;
    height: 15px;
    margin-top: -5px;
    background: url('images/cornerBR.gif') no-repeat;
}
/***** End Blue Bar *****/


#bodypic {
    float: right;
    width: 260px;
    height: 165px;
    margin: 20px 0 10px 10px;
    background: url('images/mainpics/rotator.php') no-repeat;
}

#footer {
    padding: 0 10px 5px 10px;
    border-top: 1px solid #ddd;
    color: #aaa;
    font-size: 80%;
}

  #footer ul {
      padding-left: 0;
    }

  #footer ul li {
      display: inline;
      padding-right: 7px;
    }

/******************* CLASSES *************************/
.impact {
    font-family: "Trebuchet MS", Arial, sans-serif;
    font-size: 110%;
    font-style: italic;
    font-weight: bold;
    color: #31599A;
}

/* for links that are grey */
.subtle a {
    color: #aaa;
}

.hide a {
    color: #fff;
}

.announce {
    padding: 10px;
    margin-bottom: 10px;
    border: 2px solid #31599A;
    background: #E8EFD1;
    font-syle: italic;
}

/*******************
Form mailer (email)
*******************/
.maildiv .sidelbl {
  /* used for left side labels */
  width: 95px;
  padding-right: 5px;
  text-align: right;
  vertical-align: top;
  display: block;
  float: left;
}

.maildiv input, .maildiv select, .maildiv textarea {
  margin-bottom: 10px;
}

.maildiv .fmrequired {
  font-size: 90%;
  float: left;
  margin-top: 3px;
  margin-left: 5px;
}

.maildiv .fmsubmit {
  margin-left: 100px;
}

.maildiv .fminfofull {
  padding: 10px 0;
}

.maildiv .fmerrortitle {
  color: #FF0000;
  font-size: 120%;
}
