html{
    padding: 0;
    margin: 0;
    background-color: #213D77;
}
body{
    padding: 10px 0 0;
    margin: 0;
    background: #213D77;
    height: auto;
}
#myContent{
    width: 900px;
    margin: 0 auto 0;
    background-color: #fff;
}
#pageContainer {
    width: 900px;
    background-color: #fff;
}
#theForm {
    display: block;
}

#header {background-color: #fff;}
#theForm .headerBar {
    margin-top: 142px;
    height: 1px;
}

#container {
    width: 900px; margin: 0 auto;
    background-color: transparent;
    border: none;
}
.donationPageBody #container, .programPageBody #container {width: 900px;}

/*-----------------------------------------------------------------------------+
|                                Header Images                                 |
+-----------------------------------------------------------------------------*/
#headerImg1{
    display: none;
}
#headerImg2{
    background-image: url("/images/charity/vetsvehicles/header.jpg");
    background-repeat: no-repeat;
    background-size:contain;
    height: 0;
    margin:0;
    width:100%;
    padding-top:23%;
    background-color: transparent;
}
#headerImg3{
    display: none;
}

#headerImg4{
    display:none;
}

#headerImg5{
    display:none;
}
/* ------------------------ End Header Images ------------------------------------- */

/* If we want the header to be clickable to the charities website (new window) then we need to
    set display to block, position to absolute, and then size and position accordingly*/
#headerImgLink {
    display: block;
    height: 180px;
    position: absolute;
    top: 0px;
    width: 100%;
}

#headerHR{
    display:none;
}

/*-----------------------------------------------------------------------------+
|                                  Menu stuff                                  |
+-----------------------------------------------------------------------------*/
#navRow {
    background-color: #B83130;
    height: 34px;
}

#navRow a, #navContact a, #charity_phone{
    color: #fff;
    padding: 5px 15px;
    line-height: 1.5em;
    font-size: 16px;
    text-decoration: none;
    display: block;
    float: left;
    font-weight: normal;
    height: 1.5em;
}
#navRow a:hover {
    color: #fff;
    background-color:#315579;
}

#navLinks {
    font-style: normal;
    font-size: 14px;
    font-weight: bold;
    font-family: arial,serif;
    margin: 0 auto;
    text-align: center;
    display: inline-block;
    float: left;
}

#navContact{
    display: inline-block;
    font-size: 14px;
    float:right;
    margin-right: 0;
    padding: 0;
}
#navContact a {
    float: right;
    line-height: auto;
    border-right: 0;
}
/* ------------------------ End Menu Stuff ----------------------------------------- */

/*
  hide test server so i dont have to delete it every time i hit f5 while testing 
*/
#testServer{
    display:none;
}

.pipeSep{
    display: none;
}

/* I don't see this anywhere when I use firebug, I'll considering getting rid of this "temp" imgHack in the future 
   UPDATE ... It's being used on the older donation process, I can get rid of it as on all newer charities */
.tempImgHack{
    display:none;
}

/* I'm puttin gthe truck background and the h2 stuff together to more easily change the colors*/
.truckBackground{
    background-color: #213D77;
}
.H2 /*, .programPageBody h1*/ {
    color: #213D77;
    line-height: 14px;
    font-style: normal; /* To get rid of default italics */
}

.programPageBody h1, .infoPageBody h1 {
    font-family: Futura Bold, Arial Black, "Trebuchet MS", sans-serif;
    font-size: 21px;
    color: #B83130;
    font-style: normal; /* To get rid of default italics */
}

.progressText a{
    text-decoration: none;
}

.fieldset{
    background-color: #fff;
}
#columnRight {
    width: auto;
    padding: 10px 20px;
    float: none;
}
#columnLeft {
    display: none;
}
#content {
    padding-bottom: 30px;
}

.affilName, .donateThankyou, .inputsAndTestimonials {
    background-color: #fff;
}
.affilName {
    display: none; /* this should be set on charities that have no affiliate for easier styling */
}
.donateThankyou {
    text-align:center;
}
.inputsAndTestimonials {
}
.inputsAndTestimonials a {
}

#footer{
    padding-top: 50px;
    margin:0 auto;
    background-color: #fff;
    width: 880px;
}
#footer .copy:first-child {
    margin-top: 0 !important;
}
#breadcrumb {
    display: none;
}
#letter {
    margin-top: 15px;
}

p {
    margin: 1em 0;
}
/*------------Override for smaller screen sizes------------*/
@media all and (max-width: 930px) {
    .donationPageBody #container, .programPageBody #container{width:100%;}
    #container{
        padding:0px !Important;
        margin:0px !Important;
    }
    #myContent{width:100%;}
}

@media all and (max-width: 899px) {
    #headerImgLink{height:150px;}
}
@media all and (max-width: 630px) {
   #headerImgLink{height:100px;} 
   #navContact{
       background-color:#B83130;
       border:1px solid black;
       width:100%;
   }
   #navRow a, #navContact a, #charity_phone{padding:5px 10px;}
   #navContact a{font-size:12px;}
}