/*IMPORTANT... #headerImg1,2,3,4,5 all need to be styled here or the page will
be messed up.  If you dont use them set their display to none.*/
#charity_phone,
.pipeSep{
  display:none;
}
#headerImg1{
  background-image:url("../images/charity/vdac/vdp2.png");
  background-repeat:no-repeat;
  background-position:left bottom;
  width:900px;
  height:30px;
  margin:120px 0px 0px 0px;
}

#headerImg2{
  position: relative;
  float:left;
  background-image:url("../images/charity/vdac/poweredBy.gif");
  background-repeat:no-repeat;
  background-position:left bottom;
  width:120px;
  height:85px;
  top:0px;
  margin:-120px 0px 0px 35px;
}

#headerImg3{
  display:none;
  /*position:absolute;
  float:left;
  background-image:url("../images/charity/vdac/vdi.gif");
  background-repeat:no-repeat;
  background-position:left bottom;
  width:300px;
  height:111px;
  top:0px;
  margin:0px 0px 0px 15px;*/
}

#headerImg4{
  display:none;
}

#headerImg5{
  display:none;
}
/* to be clickable - set display to block
   position to absolute and size accordingly */
#headerImgLink {
    display: block;
    position: absolute;
    left: 0;
    top: -120px;
    width: 155px;
    height: 120px;
}

#headerText{
  width:500px;
  padding-top:35px;
  margin-left:225px;
  text-align:center;
  font-size:24px;
  font-family: 'Comic Sans MS', arial, Helvetica, sans-serif;
  font-weight:bold;
  /*text-transform: capitalize;*/
}

#headerHR{
  display:none;
}

#programGo{
  background-image:url("../images/charity/vdac/logo.gif");
  background-repeat:no-repeat;
  width:150px;
  height:71px;
  float:right;
}

html{
  background-color:#ffffff;
}

body{
  background-color:#ffffff;
}

#container{ 
  border:0px;
}

#affilName{
  position:absolute;
  top:65px;
  left:225px;
  width:500px;
  text-align:center;
  font-weight:bold;
  font-size:22px;
  font-family: 'Comic Sans MS', arial, Helvetica, sans-serif;
}

.vdacText{
  color:#575656;
  font-family:Verdana,Geneva,Sans-serif;
  font-size:8pt;
  line-height:16px;
}

a.vdacLink{
  color:#B63401 !important;
}

.vdacHeader{
  font-size:24px;
  color:#575656;
  font-family:"Palatino Linotype","Book Antiqua",Palatino,serif;
  font-weight:bold;
  line-height:24px;
  padding:0 0 10px;
}

.threeHeader{
  background-image:url("../images/charity/vdac/vdi.gif");
  background-repeat:no-repeat;
  background-position:left bottom;
  width:300px;
  height:111px;
  float:left;
}

.affilName{
  float: left;
  font-size: 22px;
  margin: 30px 0 0 50px;
  text-align: center;
  width: 500px;
  font-weight:bold;
  font-family: 'Comic Sans MS', arial, Helvetica, sans-serif;
}

.truckBackground{
  background-color: #cb1115;
}

h2 {
	font-weight: bold;
	margin-top: 15px;
}
p {
	margin: 10px 0;
}
.navLinks a{
	margin-right: 15px;
}

/*------------Override for smaller screen sizes------------*/

@media all and (max-width: 966px) {
    #container {
        max-width: 100%;
        width: auto;
        margin: 0  !important;
        padding: 0 0px !important;    
    }
    
    .donationPageBody #container, .programPageBody #container, .infoPageBody #container{
        width: auto !important;
    }
    
    body.programPageBody div#breadcrumb,
    .programPageBody #breadcrumb > #breadcrumbTextContainer {
        display: none !important;
    }
    
    #myContent{
        width: auto;
    }
    
    div#content {
        margin: 0;
    }
    
    div.inputsAndTestimonials.donate-section {
        margin-top: 0;
    }
    
    div.affilName {
        float: none;
        width: auto;
        margin: 0 auto;
        font-size: 1.5em;
    }
    
    .programPageBody #columnLeft {
        display: none;
    }
    
    .donateThankyou {
        margin: 0 auto !important;
    }
    
    div.donateThankyou p {
        margin: 0;
        padding: 5px 2px 12px 2px;
        text-align: center;
    }
    
    .fieldset {
        padding: 0 5px;
        display: block !important;
        width: auto !important;
    }
    
    body.donationPageBody.donate4 #letter {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    #headerImg1 {
        width: auto;
        margin-top: 100px;
    }
    
    #headerImgLink {
        width: 100%;
    }
    
    h2.thankyouHeader {
        margin: 0;
        text-align: center;
        font-size: 1.2em;
        padding: 5px 2px;
    }
}

@media all and (max-width: 899px) {
    #container, #myContent {
        max-width: 100%;
        margin-top: 0;
        padding-top: 0 !important;
    }

    .donationPageBody #container, .programPageBody #container {
        width: auto;
    }
    
    /* Headers/Links
    --------------------------*/
    #navLinks {
        margin: 5px auto 5px auto;
    }
    
    #navLinks a {
        margin: 0;
        padding: 0 2px 0 2px;
    }
    
    #navLinks a:first-child {
        padding-left: 5px;
    }

    #header {
        margin-left: auto;
        margin-right: auto;
        position: relative;
    }
    
    #headerImg2 {
        float: none;
        margin-bottom: 2.5em;
        margin-left: auto;
        margin-right: auto;
    }
    
    #columnRight h1 {
        margin: 0;
    }
    
    /* donateThankyou section */
    div.donateThankyou {
        margin: 0 15px 0 15px;
    }

    .donate-section.donateThankyou p {
        display: none;
    }
    
    body.donationPageBody.donate4 #letter {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    /* end donateThankyou */

    form#theForm {
        margin: 0px;
    }

    #navRow {
        padding: 0;
    }
    
    a.back-button.gradient {
        width: auto;
    }
    
    .H2 {
        font-size: 1.4em;
    }
    
    .programPageBody #columnRight{
        padding: 0;
        float: none;
        width: auto;
    }
    
    #columnRight p:first-child {
        margin-top: 0;
    }
}

@media all and (max-width: 526px) {
    div#navContact.navContact {
        float: left;
        width: 100%;
        padding: 10px 0;
        text-align: center;
    }
    
    .infoPageBody div#pageheader {
        margin-left: 1.5em;
        margin-bottom: 0.5em;
    }
    
    #columnRight h1 {
        text-align: center;
    }
}

@media all and (max-width: 378px) {
    #navLinks a {
        font-size: 0.95em;
    }
}

@media all and (max-width: 360px) {
    #navLinks a {
        font-size: 0.83em;
    }
}
/*------------End Override------------*/