@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap');


body {
  font-family: 'Open Sans', sans-serif;
  font-size: 12.5pt;
}

.header#hd {
  background: url("../../images/PAA2025_RegBanner.jpg") no-repeat center;
  border-bottom: none;
  height: 257px !important;
  background-size: 101%;
  position: absolute;
  background-position-y: 0;
  top:0;
  right: 0;
  left: 0;
}

div.col-primary {
  margin-top:  13%;
}

div.functions div.header,
div.functions div.header div.key,
div.checkOutContent div.section label.header,

div.popup > div.titleBar,
div.dialog > div.titleBar {
    background-color: #58442f;
    color: white;
}

 div.functions div.header div.key {
   background-color:#e8e8e8 !important;
   color: #000 !important;
 }

 div.functions div.container {
    clear: both;
    max-width: 1170px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 15px;
}

.functions .collapse.collapsed .header .controls .collapseButton {
  background: url("../../images/OpenArrow.png") !important;
  background-repeat: no-repeat !important;
}

.functions .collapse.opened .header .controls .collapseButton {
  background: url("../../images/CollapseArrow.png") !important;
  background-repeat: no-repeat !important;
}

div.createContact.dialog .content {
  max-height: unset;
  overflow-x:hidden;
}

.btn, input[type="button"], input[type="reset"], input[type='submit']{
    background-color: #0c6e3b;
    color: #fff;
}

.btn:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type='submit']:hover {
  background-color: #6db044;
  color: #000;
}

#ctl00_TemplateBody_registrantsDisplay_dlRegistrants {
  margin: 5px 0px 10px 30px;
}

.registrantsDisplay {
  margin-top: 10px;
}

@media only screen and (max-width: 2500px) {

  .header#hd { 
      height: 320px !important;
  }
}

@media only screen and (max-width: 2200px) {

  .header#hd { 
      height: 275px !important;
  }
}

@media only screen and (max-width: 2000px) {

  .header#hd { 
      height: 250px !important;
  }
}

@media only screen and (max-width: 1800px) {

  .header#hd { 
      height: 225px !important;
  }
}

@media only screen and (max-width: 1600px) {

  .header#hd { 
      height: 200px !important;
  }
}


@media only screen and (max-width: 1200px) {

  .header#hd {
      height: 150px !important;
  }

}


@media only screen and (max-width: 1000px) {

  .header#hd {
      height: 125px !important;
  }

  .container {
    padding-left: 0px !important;
  }

}


@media only screen and (max-width: 900px) {

  .header#hd {
      height: 110px !important;
  }

}


@media only screen and (max-width: 700px) {

  .header#hd {
     height: 90px !important;
  }

}

@media only screen and (max-width: 600px) {
  
  .promoCode input[type="text"] {
      width: 250px;
  }

  .header#hd {
    background-size: 116%;
    background-position-y: 100%;
  }

}


@media only screen and (max-width: 500px) {

  .header#hd {
    height: 80px !important;
  }

  div.createContact label, div.demographicsValidation label {
    font-size: 11pt;
  }

  div.content div.createContact span, div.createContact label {
      width: 200px;
      margin-right: 0;
  }

  .createContact .field .label {
    width: 210px;
  }

  div.billTo .label {
    width: 85px !important;
  }

  .creditCard .field .label {
    width: 85px !important;
  }

}

@media only screen and (max-width: 450px) {

  div.createContact.popup.selfCenter {
    width: 95% !important;
  }

}

@media only screen and (max-width: 390px) {

  div.createContact .field {  
    display: flex;
    flex-direction: column;
  }

  div.createContact div.field div.label {
    width: 100%;
  }

  div.createContact label {
    width: 100%;
    text-align: center;
  }

  div.content div.createContact span.value, div.content div.createContact select.value {
      width: 100%;
      text-align: center;
  }

  div.createContact .field input { 
    width: 100%;
  }
}