/*****************************************************************
 ------------------------------------------------------------------
 Savings and Activation Form pages CSS
 ------------------------------------------------------------------
 *****************************************************************/
.savings #page-title, .activation-form #page-title {
  display: none;
}
.webform-client-form h1::after {
  background: none;
}
.webform-client-form h1 {
  margin: 0;
  padding: 0;
}
/*Step1 and Step2 of Get-a-Card form has different title*/
.webform-client-form h1.form1-title::after, .webform-client-form h1.form2-title::after {
  background-image: url("/sites/default/themes/custom/peh_template/images/global/green_underline.png");
  background-repeat: no-repeat;
  bottom: 0;
  content: " ";
  height: 5px;
  left: 0;
  position: absolute;
  width: 100%;
}
.webform-client-form h1.form1-title, .webform-client-form h1.form2-title {
  margin: 0 0 30px 0;
  padding: 35px 0 25px
}
.webform-component--savings-form-fill-info p {
  color: #0071d1;
}
.webform-client-form p.small {
  padding: 0 0 0 3px;
  text-indent: -3px;
}
/*Content section of the Get-a-card form 1*/
.webform-component--savings-form-1-content {
  display: inline-block;
  vertical-align: middle;
  width: 50%;
}
.webform-component--savings-form-1-card-image {
  display: inline-block;
  vertical-align: middle;
  width: 47%;
}

.webform-component--savings-form-1-card-image img, .activate-card-img img {
  max-width: 298px;
  max-height: 222px;
  width: 100%;
  height: auto;
}
.node-form-landing-page .field-name-field-form-landing-page-image img {
  max-width: 298px;
  max-height: 211px;
  width: 100%;
  height: 100%;
}
.card-footnote {
  width: 60%;
  margin: -50px 0 60px 0;
}
/*Form Section*/
.form-item input.error, .form-item textarea.error, .webform-component-select .selector.error, div.checker span.error {
  border: 4px solid #ff0000;
  border-radius: 3px;
}
.error-msg, .info-warning {
  color: #ff0000;
  margin: 5px 0 0 3px;
}
.webform-component--savings-address-1 .error-msg, .webform-component--savings-address-2 .error-msg, .webform-component--savings-city .error-msg, .webform-component--savings-state .error-msg, .webform-component--savings-zip-code .error-msg{
  display: none;
}
.form-type-checkbox {
  display: table;
}
.form-type-checkbox label {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  width: auto;
  padding: 0 0 0 15px;
}
.text-checkbox {
  display: inline-block;
}
.webform-component--savings-text-note {
  display: inline-block;
  margin: 0 0 0 19px;
  vertical-align: middle;
  width: 79%;
}

/*Savings Form 1 eligibility checklist*/
ul.eligibility-checklist, .registration-success-checklist  ul {
  margin: 25px 0;
}
.eligibility-checklist li, .registration-success-checklist  ul li {
  margin: 0 0 20px 40px;
  position: relative;
}
.eligibility-checklist > li, .registration-success-checklist  ul li {
  list-style-type: none;
  margin: 0 0 30px;
  padding: 0 0 0 47px;
}
.eligibility-checklist > li::before, .registration-success-checklist  ul li::before {
  background: url("/sites/default/themes/custom/peh_template/images/forms/green-checkmark.png") no-repeat 0 0;
  content: " ";
  left: 0;
  position: absolute;
  top: 0;
  width: 33px;
  height: 26px;
}
.eligibility-checklist ul {
  margin: 15px 0 0 0;
}

.savings .paragraphs-items-field-learn-more-about-brand{
  border-top: 4px solid #dcdee0;
  margin: 10px 0 0 0;
  padding: 40px 0 0 0;
}
/*Get Your Savings Card Section*/
.webform-component--savings-already-have-a-card, .webform-component--savings-activate-it-here {
  display: inline-block;
}
.webform-component--savings-activate-it-here {
  position: relative;
}
.webform-component--savings-activate-it-here .activate-here:after {
  position: absolute;
  content: ' ';
  width: 9px;
  height: 16px;
  top: 7px;
  right: -18px;
  background: url(/sites/default/themes/custom/peh_template/images/global/anchor-blue-arrow.png) no-repeat center;
}
/*Savings Form1 Check Box Error message*/
.confirm-label .error-msg {
  margin: 5px 0 0 53px;
}

/*Savings Form2 Recieve Card Check Box */
.download-checkbox, .print-checkbox, .email-checkbox {
  margin: 0 0 20px 0;
}
/*Privacy Policy Content*/
.webform-component--savings-privacy-policy, .webform-component--activate-card-privacy-policy {
  margin: 30px 0 0;
}

/*Success Page*/
.success-terms {
  margin: 30px 0 0 0;
}

.savings-success .paragraphs-items-field-steps-body h2 {
  max-width: none;
  background: none;
  text-align: left;
}
.success-content {
  display: inline-block;
  float: left;
  width: 50%;
}
.savings-success .node-form-landing-page .field-name-field-form-landing-page-image .field-item, .activation-success .node-form-landing-page .field-name-field-form-landing-page-image .field-item {
  width: 47%;
  display: inline-block;
  vertical-align: middle;
}

.webform-component--savings-mobile .description{
  margin: 10px 0 0 0;
}
/* New 'California' link css */
.california-tooltip-wrap {
  margin: -55px 0 30px;
  border: 3px solid #a9cf6e;
  width: 100%;
  max-width: 400px;
  padding: 6px 5px;
  border-radius: 15px;
  text-align: center;
  background: #fff;
  position: relative;
}
.california-tooltip-wrap .california-link {
  text-transform: uppercase;
  text-decoration: underline;
  color: #0071d5;
  cursor: pointer;
  display: inline-block;
  text-align: left;
  width: 87%;
  margin: 0 0 0 8px;
  vertical-align: middle;
}
.california-tooltip-wrap .california-link:hover {
  text-decoration: none;
}
.california-tooltip-wrap .tooltip {
  width: 100%;
  max-width: 370px;
  position: absolute;
  top: 40px;
  right: -40px;
  z-index: 1;
  padding: 15px 0;
  background: #fff;
  border: 1px solid #000;
  border-radius: 40px;  
  display: none;
}
.california-tooltip-wrap .tooltip p {
  padding: 0 20px;
  margin: 0;
  color: #000;
}
.california-tooltip-wrap .tooltip p:last-child {
  padding: 0 35px;
  font-weight: 600;
}
.california-tooltip-wrap .close-btn {
  position: absolute;
  top: 5px;
  right: 20px;
  cursor: pointer;
}
.california-tooltip-wrap img {
  display: inline-block;
  text-align: left;
  width: 7%;
  vertical-align: middle;
}
/* New 'California' link css for Activate copay page */
.activate-copay.california-tooltip-wrap {
  margin: -25px 0 15px;
}

/*****************************************************************
 ------------------------------------------------------------------
 Activation page CSS
 ------------------------------------------------------------------
 *****************************************************************/
.activation-form .webform-client-form > div{
  position: relative;
  display: flex;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  flex-flow: column;
}
.webform-component--savings-card-link{
  order: 9;
}
.activation-form  .webform-client-form .form-actions{
  order: 7;
}

.activate-cont{
  display: table;
}
.activate-cont p{
  display: table-cell;
  vertical-align: middle;
  width: 50%;
}
.activate-card-img{
  display: table-cell;
  width: 100%;
}

.webform-component--activate-card-tc {
  padding: 30px 0 30px 68px;
}
.webform-component--activate-card-title-next h1 {
  margin: 50px 0;
}
.webform-component--savings-card-link{
  display: none;
  margin: 0 0 90px 0;
}
.activation-form .paragraphs-items-field-learn-more-about-brand{
  border-top: 4px solid #dcdee0;
  margin: 10px 0 0 0;
  padding: 40px 0 0 0;
}
/*Success Page*/
.activation-success .paragraphs-items-field-steps-body h2 {
  max-width: none;
  background: none;
  text-align: left;
}
/*****************************************************************
 ------------------------------------------------------------------
 Unsubscribe Form page CSS
 ------------------------------------------------------------------
 *****************************************************************/

.unsubscribe .webform-client-form p, .unsubscribe  .webform-client-form ul li, .unsubscribe-success .unsubscribe-text p {
  font-size: 18px;
}
.unsubscribe-email {
  margin: 0 0 30px;
}
.unsubscribe .webform-client-form > div{
  position: relative;
  display: flex;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  flex-flow: column;
}


.unsubscribe .webform-client-form .form-actions{ 
  order: 2;
}
.webform-component--unsubscribe-help-text{  
  order: 3;
}
.webform-component--unsubscribe-help-text a[href^="tel"]{
  text-decoration: none;
  color: inherit;
}

/*****************************************************************
 ------------------------------------------------------------------
 Text A Card Form page CSS
 ------------------------------------------------------------------
 *****************************************************************/
.text-a-card .form-actions{
  margin: 25px 0 40px 114px;
}

/*Hide placeholder*/

.hide-placeholder::-webkit-input-placeholder {
  color: transparent;
}

.hide-placeholder:-moz-placeholder {
  color: transparent;
}

.hide-placeholder::-moz-placeholder {
  color: transparent;
}

.hide-placeholder:-ms-input-placeholder {
  color: transparent;
}

/*****************************************************************
 ------------------------------------------------------------------
 Captcha CSS
 ------------------------------------------------------------------
 *****************************************************************/
fieldset.captcha{
  margin: 50px 0 0 0;
}

/*****************************************************************
 ------------------------------------------------------------------
 CSS for Desktop and iPad landscape
 ------------------------------------------------------------------
 *****************************************************************/

@media only screen and (min-width: 1000px) , only screen and (min-device-width: 1000px) and (orientation: landscape) {
  /*****************************************************************
   ------------------------------------------------------------------
   Savings Form CSS
   ------------------------------------------------------------------
   *****************************************************************/

  .webform-component--savings-tc {
    padding: 30px 0 30px 68px;
  }

  .recieve-mail .form-checkboxes, .recieve-mail .description {
    display: table-cell;
    vertical-align: middle;
    width: auto;
  }
  .recieve-mail {
    margin: 50px 0;
  }
  .recieve-mail .description {
    padding: 0 0 0 28px;
  }
  .webform-component--savings-address-1, .webform-component--savings-address-2-optional, .webform-component--savings-city, .webform-component--savings-state, .webform-component--savings-zip-code {
    display: inline-block;
    float: left;
  }
  .webform-component--savings-address-1, .webform-component--savings-address-2-optional {
    width: 49%;
  }
  .webform-component--savings-address-2-optional {
    padding: 0 0 0 20px;
  }
  .webform-component--savings-address-1 .error-msg {
    margin: 0 0 -24px;
  }
  .webform-component--savings-city, .webform-component--savings-zip-code {
    width: 38.5%;
  }
  .webform-component--savings-state {
    width: 21%;
  }
  .webform-component--savings-state, .webform-component--savings-zip-code {
    padding: 0 0 0 21px;
  }

  .webform-component--savings-mobile {
    margin: 0 0 0 53px;
    width: 53%;
  }
  /* New Mobile privacy note */
  .webform-component--mobile-privacy-note {
    margin: 0 0 0 53px;
  }
  .registration-success-checklist ul li span.btn-primary{
    display: inline-block;
    margin: -18px 0 0 20px;
    vertical-align: top;
  }
  /*****************************************************************
   ------------------------------------------------------------------
   Unsubscribe Form CSS
   ------------------------------------------------------------------
   *****************************************************************/
  .unsubscribe-email{
    max-width: 370px;
  }
  .unsubscribe .webform-client-form .form-actions{
    margin: 0;
    left: 400px;
    top: 120px;
    position: absolute;
    width: 50%;
  }

}

/*****************************************************************
 ------------------------------------------------------------------
 CSS for Mobile and iPad potrait
 ------------------------------------------------------------------
 *****************************************************************/
@media only screen and (max-width: 999px) , only screen and (max-device-width: 999px) and (orientation: portrait) {
  /*****************************************************************
   ------------------------------------------------------------------
   Savings Form CSS
   ------------------------------------------------------------------
   *****************************************************************/
  .webform-component--savings-activate-it-here .activate-here:after {
    right: -5px;
    top: 6px;
    background: url(/sites/default/themes/custom/peh_template/images/global/anchor-blue-arrow.png) no-repeat center/cover;
    width: 5px;
    height: 9px;
  }
  .confirm-label .error-msg{
    margin: -6px 0 0 53px;
  }
  .webform-component--savings-tc {
    padding: 20px 0 30px 28px;
  }
  .recieve-mail{
    margin: 30px 0;
  }
  .recieve-mail .description {
    margin: 20px 0 0 0;
  }
  .webform-component--savings-text-note {
    width: 63%;
  }	
  .unsubscribe-text {
    margin-bottom: 30px;
  }
  .webform-component--savings-form-1-card-image p {
    margin: 0;
  }
  .webform-client-form h1.form1-title, .webform-client-form h1.form2-title {
    margin: 0 0 20px 0;
  }
  .registration-success-checklist ul li span.btn-primary{
    margin: 21px auto 0 auto;
    display: block;
  }
  /*****************************************************************
   ------------------------------------------------------------------
   Unsubscribe Form page CSS
   ------------------------------------------------------------------
   *****************************************************************/
  .unsubscribe-email{
    max-width: none;
  }
  .unsubscribe .webform-client-form .form-actions{
    margin: 0 auto 23px auto;
    position: static;
  }
  /* New 'California' link css */
  .california-tooltip-wrap {
    margin: 0 0 30px;
  }
  .california-tooltip-wrap .tooltip {
    max-width: 100%;
    right: 0;
  }
  .california-tooltip-wrap .tooltip {
    padding: 20px 0;
  }
  .california-tooltip-wrap .california-link {
    line-height: 15px;
  }
  /* New 'California' link css for Activate copay page */
  .activate-copay.california-tooltip-wrap {
    margin: 15px 0 15px;
  }
}