/*
*    Form Styles
*    my-tax.co 01/05/2020
*/

.divForm { 
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  max-width: 1200px;
  display: block;
  margin: 0 auto;
  padding: 30px 0;
  padding-bottom: 50px;
}
.divForm .panel-figures{
  background-color: #c5f0f5;
  border-left: 3px solid #00b5c9;
  height: 100%;  
  padding: 20px 10px;
  padding-bottom: 25px;
  box-shadow: 1px 1px 2px rgba(0,0,0,.4);
  border-radius: 4px;
}
.divForm .form-group {
  position: relative;
}
.divForm label {
  margin-bottom: 0;
}
.divForm .label {
  color: black;
}
.divForm .panel-figures-title {
  font-size: 1.4em;
  padding-top: 10;
  margin: 0 10px 20px;
  border-bottom: 1px solid gray;
}
.divForm .panel-figures > div:not(:first-of-type) {
  margin: 3px 0;
}
.divForm .panel-figures div .label{
  font-size: 1.2em;
  font-weight: normal;
  width: 70%;
  display: inline-block;
  text-align: left;
}
.divForm .panel-figures div .values {
  font-size: 1.2em;
  font-weight: bold;
  text-align: right;
  width: 25%;
  display: inline-block;
}
.divForm .panel-figures div .values:before {
  content: "$";
}
.divForm input[type=text] {
  padding: 6px 12px;
}
.divForm form {
  margin-bottom: 0;
  margin: 0 5px;
}
.divForm .row:last-of-type {
  border: none;
  margin-bottom: 0;
}
.divForm .section-title {
  border-bottom: 10px solid #00b5c9;
  margin: 1 -55px;
  margin-bottom: 15px;
  padding: 8px 10px;
  font-weight: bold;
  color: #00b5c9;
  border-radius: 6px;
}
.divForm .childrenFields:after {
  content: "";
  display: block;
  clear: both;
}
.divForm .childrenFields,
.divForm .adultFields {
  border-left: 1px solid #e1e1e1;
}
.divForm #purchase-voucher .form-section {
  /*border: 1px solid red;*/
  margin-bottom: 20px;
/*   border: 1px solid #e1e1e1; */
}
.divForm #purchase-voucher h2 span,
.divForm #purchase-voucher h3 span,
.divForm #purchase-voucher h4 span {
  clear: both;
  display: block;
}
.divForm #purchase-voucher h2 #Total,
.divForm #purchase-voucher h3 #Subtotal,
.divForm #purchase-voucher h4 #Surcharge {
  font-weight: bold !important;
  font-size: 50%;
  margin: 5px 0 15px;
}
.divForm #purchase-voucher input[type=submit] {
  margin: 10px;
  margin-bottom: 20px;
}

.divForm .form-message {
  position: absolute;
  top: 30%;  
  transform: translateY(-50%);
  left: 50%;  
  transform: translateX(-50%);
  
  padding: 30px 30px;
  text-align: center;  
  width: 80%;
  
  background-color: lightgray;
  color: white;
    
  border-radius: 5px;
  
  z-index: 10;
  
  box-shadow: 0 5px 16px rgba(0, 0, 0, .5);
}
.divForm .form-message.form-message-error {
  background-color: #d9534f;
}
.divForm .form-message.form-message-warning {
  background-color: #f0ad4e;
}
.divForm .form-message.form-message-info {
  background-color: #46b8da;
}
.divForm .multi-step .previous,
.divForm .multi-step .next {
  color: white;
  border: none;
  padding: 5px 20px;
}
.divForm .checkbox-inline{
  font-size: 1.2em;
}
.divForm form:not(.multi-step) button.next,
.divForm form:not(.multi-step) button.previous {
  display: none;
}
.divForm button,
.divForm button:focus{
  outline: none;
}
.divForm input[type='checkbox'] {
    -webkit-appearance:none;
    width:18px;
    height:18px;
    background:white;
    border-radius:5px;
    border:2px solid #555;
    outline: none;
}
.divForm input[type='checkbox']:checked {
    background: #00b5c9;
}

/* Form Validation */
  .classDatepicker {
      z-index: 0 !important;
    }
  input:focus ~ .parsley-errors-list {
      display: none;
    }
/*   select ~ .parsley-errors-list, */
  input[type=number] ~ .parsley-errors-list {
      right: 25px;
    }
  .classDatepicker ~ .parsley-errors-list { 
      right: 45px;
    }
  .parsley-error {
      border:  2px solid #ff6600 !important;
    }
  .parsley-errors-list {
      border-left: 0;
      border-radius: 4px;
      border-right: 0;
      bottom: 5px;
      color: transparent;
      font-size: .8em;
      font-weight: bold;
      height: 34px;
      line-height: 1;
      list-style: none;
      pointer-events: none;
      position: absolute;
      right: 18px;
      text-align: right;
      width: 100%;
    }
  .parsley-errors-list:after {
      content: "Required";
      display: inline-block;
      color: #ff6600;
      padding-right: 5px;
      line-height: 0;
      bottom: 8px;
      right: 0;
      position: absolute;
    }
  .checkbox-inline {
      display: inline-block;
    }
  .checkbox-inline ~ .parsley-errors-list:after {
      display: none;
    }

/* Step Form */

.arrow_parent{
  width:100%;
  height:40px;
  background:#C3E0F1; 
  box-shadow: 0 0 1px 5px #c2e1f5 inset;
  font-size:12px;
  overflow:hidden;
}

.arrow_parent span h1{
  text-align:center;
  color:#DCF2FF;
  line-height:16px;
}

.arrow_box {
  position: relative;
  background: white;

  border: 2px solid transparent;
  height:45px;
  width:45%;
  float:left;
  text-align:center;
  line-height:12px;
  color:#A5D0E9;
  font-weight:700;
  font-size:12px;
}



.arrow_box:after, .arrow_box:before {
  left: 100%;
  top: 40%;
  border: solid #5EA8DB;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.arrow_box:after {
  border-color: rgba(0, 0,0, 0);
  border-left-color: #FFF;
  border-width: 28px;
  margin-top: -28px;
}
.arrow_box:before {
  border-color: rgba(0, 0, 0, 0);
  border-left-color: #5EA8DB;
  border-width: 34px;
  margin-top: -34px;
}


.activeList{
  background:#FFF; 
  box-shadow: 0 0 1px 5px #FFF inset;
  
}

.activeList span h1{
color:#A5D0E9;
  
}
.activeList .arrow_box{
  background:#C3E0F1;
  color:white;
}

.activeList .arrow_box:before{
 
 
}

.activeList .arrow_box:after {
  
  border-left-color: #C3E0F1;
  border-width: 35px;
  margin-top: -35px;
}

/* Form1 */

.body{ margin-top:30px; }

/* For The Notice Block */
.update-nag{
  display: inline-block;
  font-size: 14px;
  text-align: left;
  background-color: #fff;
  height: 40px;
  -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.2);
  box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
  margin: 10px 0;
  width: 100%;
}

.update-nag > .update-split{
  background: #337ab7;
  width: 33px;
  float: left;
  color: #fff!important;
  height: 100%;
  text-align: center;
}

.update-nag > .update-split > .glyphicon{
  position:relative;
  top: calc(50% - 9px)!important; /* 50% - 3/4 of icon height */
}
.update-nag > .update-split.update-success{
  background: #5cb85c!important;
}

.update-nag > .update-split.update-danger{
  background: #d9534f!important;
}

.update-nag > .update-split.update-xd{
  background: #717171!important;
}

.update-nag > .update-split.update-info{
  background: #5bc0de!important;
}

.update-nag > .update-text{
  line-height: 19px;
  padding-top: 11px;
  padding-left: 45px;
  padding-right: 20px;
  font-size: 0.9em;
}

@media (max-width: 168px) {
  .update-nag {
    font-size: 0.8em;
  }
}  

/* Select - Using the btn */
.btn-select {
    position: relative;
    padding: 0;
    min-width: 236px;
    width: 100%;
    border-radius: 0;
    margin-bottom: 15px;
}

.btn-select .btn-select-value {
    padding: 6px 12px;
    display: block;
    position: absolute;
    left: 0;
    right: 34px;
    text-align: left;
    text-overflow: ellipsis;
    overflow: hidden;
    border-top: none !important;
    border-bottom: none !important;
    border-left: none !important;
}

.btn-select .btn-select-arrow {
    float: right;
    line-height: 20px;
    padding: 6px 10px;
    top: 0;
}

.btn-select ul {
    display: none;
    background-color: white;
    color: black;
    clear: both;
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: none !important;
    position: absolute;
    left: -1px;
    right: -1px;
    top: 33px;
    z-index: 999;
}

.btn-select ul li {
    padding: 6px;
    text-align: left;
}

.btn-select ul li:hover {
    background-color: #f4f4f4;
}

.btn-select ul li.selected {
    color: white;
}

/* Default Start */
.btn-select.btn-default:hover, .btn-select.btn-default:active, .btn-select.btn-default.active {
    border-color: #ccc;
}

.btn-select.btn-default ul li.selected {
    background-color: #ccc;
}

.btn-select.btn-default ul, .btn-select.btn-default .btn-select-value {
    background-color: white;
    border: #ccc 1px solid;
}

.btn-select.btn-default:hover, .btn-select.btn-default.active {
    background-color: #e6e6e6;
}
/* Default End */

/* Primary Start */
.btn-select.btn-primary:hover, .btn-select.btn-primary:active, .btn-select.btn-primary.active {
    border-color: #286090;
}

.btn-select.btn-primary ul li.selected {
    background-color: #2e6da4;
    color: white;
}

.btn-select.btn-primary ul {
    border: #2e6da4 1px solid;
}

.btn-select.btn-primary .btn-select-value {
    background-color: #428bca;
    border: #2e6da4 1px solid;
}

.btn-select.btn-primary:hover, .btn-select.btn-primary.active {
    background-color: #286090;
}
/* Primary End */

/* Success Start */
.btn-select.btn-success:hover, .btn-select.btn-success:active, .btn-select.btn-success.active {
    border-color: #4cae4c;
}

.btn-select.btn-success ul li.selected {
    background-color: #4cae4c;
    color: white;
}

.btn-select.btn-success ul {
    border: #4cae4c 1px solid;
}

.btn-select.btn-success .btn-select-value {
    background-color: #5cb85c;
    border: #4cae4c 1px solid;
}

.btn-select.btn-success:hover, .btn-select.btn-success.active {
    background-color: #449d44;
}
/* Success End */

/* info Start */
.btn-select.btn-info:hover, .btn-select.btn-info:active, .btn-select.btn-info.active {
    border-color: #46b8da;
}

.btn-select.btn-info ul li.selected {
    background-color: #46b8da;
    color: white;
}

.btn-select.btn-info ul {
    border: #46b8da 1px solid;
}

.btn-select.btn-info .btn-select-value {
    background-color: #5bc0de;
    border: #46b8da 1px solid;
}

.btn-select.btn-info:hover, .btn-select.btn-info.active {
    background-color: #269abc;
}
/* info End */

/* warning Start */
.btn-select.btn-warning:hover, .btn-select.btn-warning:active, .btn-select.btn-warning.active {
    border-color: #eea236;
}

.btn-select.btn-warning ul li.selected {
    background-color: #eea236;
    color: white;
}

.btn-select.btn-warning ul {
    border: #eea236 1px solid;
}

.btn-select.btn-warning .btn-select-value {
    background-color: #f0ad4e;
    border: #eea236 1px solid;
}

.btn-select.btn-warning:hover, .btn-select.btn-warning.active {
    background-color: #d58512;
}
/* warning End */

/* danger Start */
.btn-select.btn-danger:hover, .btn-select.btn-danger:active, .btn-select.btn-danger.active {
    border-color: #d43f3a;
}

.btn-select.btn-danger ul li.selected {
    background-color: #d43f3a;
    color: white;
}

.btn-select.btn-danger ul {
    border: #d43f3a 1px solid;
}

.btn-select.btn-danger .btn-select-value {
    background-color: #d9534f;
    border: #d43f3a 1px solid;
}

.btn-select.btn-danger:hover, .btn-select.btn-danger.active {
    background-color: #c9302c;
}
/* danger End */

.btn-select.btn-select-light .btn-select-value {
    background-color: white;
    color: black;
}

/* Required Fields - Error Display*/

.asterix{
    position: relative;
    color: #a90a0a;
    float: right;
    font-size: 2em;
    height: 0;
    /* overflow: hidden; */
    right: 0.3em;
    top: -1.1em;
}

span.cross {
    position: relative;
    color: red;
    float: right;
    font-size: 26px;
    height: 0;
    /* overflow: hidden; */
    right: 0.3em;
    top: -1.35em;
    display: none;
}

i.fa.fa-check {
    color: green;
}

span.verify {
    position: absolute;
    float: right;
    font-size: 22px;
    height: 0;
    right: 1em;
    top: 1.87em;
    display: none;
}

#alert-custom {
    padding: 7px;
    padding-right: 31px;
}

.custom-alert{
    padding: 3px 7px;
    display: none;
    margin-top: 5px;
    margin-bottom: -3px;
}

.marginTopSmall {
  margin-top: 0.4em;
}

.icon-show-pass {
  position: relative;
  color: #6f6f6f;
  float: right;
  font-size: 1.5em;
  height: 0;
  right: 1.2em;
  top: -1.52em;
   cursor: pointer;
}

  #purchase-voucher .childrenFields:after
    {
      content: "$";
      display: block;
      clear: both;
    }
  #purchase-voucher .childrenFields,
  #purchase-voucher .adultFields
    {
      border-left: 1px solid #e1e1e1;
    }
  #purchase-voucher .card-logos img
    {
      height: 35px;
      vertical-align: middle;
      margin-left: 15px;
      margin-top: -5px;
      padding: 6px;
      background-color: white;
      border:  1px solid #ccc;
      border-radius: 6px;
    }
.move-right {
  right: 0.3em;
}


/* General Fields, Labels, Groups... */
  .divForm
    {
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      transform-style: preserve-3d;

      display: block;
      position: relative;
    }
  .divForm .form-section
    {
      background-color: #f5f5f5;
      border-radius: 6px;
      border-bottom: 1px solid #d1d1d1;
      border-right: 1px solid #d1d1d1;
      margin-bottom: 20px;
    }
  .divForm .section-title
    {
      border-bottom: 2px solid #00b5c9;
      margin: 0 -15px;
      margin-bottom: 25px;
      padding: 5px 10px;
      padding-top: 8px;
      font-weight: bold;
      color: white;
      border-radius: 6px;
      background-color: #00b5c9;
      font-size: 1.4em;
    }
  .divForm .control-label
    {
      white-space: nowrap;
    }
  .divForm .checkbox-inline
    {
      margin-top: 16px;
    }
  .divForm .classDatepicker
    {
      z-index: 0 !important;
    }
  .divForm .btn-info
    {
      background-color: #ee3252;
      font-size: 1.2em;
      padding: 6px 10px;
      border: none;
      color: white;
    }
  .divForm input[type=text]
    {
      padding: 6px 12px;
    }
  .divForm input[type=submit]
    {
      margin: 10px;
      border-radius: 6px;
    }
  .divForm input[type='checkbox']
    {
      -webkit-appearance: none;
      width: 18px;
      height: 18px;
      background: white;
      border-radius: 5px;
      border: 2px solid #555;
      outline: none;
    }
  .divForm input[type='checkbox']:checked
    {
      background: #00b5c9;
    }
  .divForm button,
  .divForm button:focus
    {
      outline: none;
    }
  .divForm .checkbox-inline
    {
      display: inline-block;
      margin-top: 16px;
    }
  .divForm .acceptable-cards img
    {
      vertical-align: middle;
      margin-left: 10px;
    }

/* General Forms */
  .divForm form
    {
      margin-bottom: 0;
      margin: 0 5px;
    }
  .divForm form:not(.multi-step) button.next,
  .divForm form:not(.multi-step) button.previous
    {
      display: none;
    }

/* Functionalities */
  .divForm .multi-step .previous,
  .divForm .multi-step .next
    {
      color: white;
      border: none;
      padding: 5px 20px;
    }

/* Form Validation */

  /* Positioning the Error label */
  .divForm input:focus ~ .parsley-errors-list.filled
    {
      display: none;
    }
  .divForm input[type=number] ~ .parsley-errors-list.filled
    {
      right: 25px;
    }
  .divForm .classDatepicker ~ .parsley-errors-list.filled
    {
      right: 45px;
    }

  /* Modifying the input's interface */
  .divForm .parsley-error
    {
      border: 2px solid #ff6600 !important;
      border-radius: 4px;
    }
  .divForm .parsley-errors-list
    {
      border-left: 0;
      border-radius: 6px;
      border-right: 0;
      bottom: 5px;
      color: transparent;
      font-size: .8em;
      font-weight: bold;
      height: 34px;
      line-height: 1;
      list-style: none;
      pointer-events: none;
      position: absolute;
      right: 18px;
      text-align: right;
      width: 100%;
    }
  .divForm .parsley-errors-list.filled:after
    {
      content: "Required";
      color: #ff6600;
      top: 8px;
      right: 15px;
      position: absolute;
    }
  .divForm .checkbox-inline ~ .parsley-errors-list.filled:after
    {
      display: none;
    }

  .divForm .form-message.form-message-error
    {
      background-color: #d9534f;
    }
  .divForm .form-message.form-message-warning
    {
      background-color: #f0ad4e;
    }
  .divForm .form-message.form-message-info
    {
      background-color: #46b8da;
    }
  .divForm .form-message:not(:empty)
    {
      font-size: 1.2em;
      position: absolute;
      top: 30%;
      transform: translateY(-50%);
      left: 50%;
      transform: translateX(-50%);
      padding: 30px 30px;
      text-align: center;
      width: 80%;
      color: white;
      border-radius: 5px;
      z-index: 10;
      box-shadow: 0 5px 16px rgba(0, 0, 0, .5);
      z-index: 1000;
    }
  .divForm .form-message:not(:empty) ~ .form-message-cover
    {
      width: 100%;
      height: 100%;
      position: fixed;
      display: block;
      background-color: rgba(0, 0, 0, 0);
      z-index: 999;
      left: 0;
      transition: all .2s;
    }
  .divForm .form-message:empty,
  .divForm .form-message:empty ~ .form-message-cover
    {
      display: none;
    }

/* Specific Areas */
  .divForm .divForm-summary
    {
      padding-bottom: 10px;
    }
  .divForm .divForm-summary .section-title
    {
      background-color: #0c9 !important;
      border-bottom-color: #0c9 !important;
    }
  .divForm .divForm-summary .package-title
    {
      text-align: center;
      font-size: 1.1em;
      font-weight: bold;
      padding: 0;
      margin-bottom: 10px;
      border-bottom: 1px solid #e1e1e1;
    }
  .divForm .divForm-summary .package-catchy-text
    {
      margin-top: 10px;
      /* margin-bottom: 5px; */
    }
  .divForm .divForm-summary .package-feature-list ul
    {
      list-style: none;
      padding-bottom: 0;
    }
  .divForm .divForm-summary .package-feature-list ul li i
    {
      margin-right: 10px;
    }
  .divForm .divForm-summary .values
    {
      font-weight: bold;
    }
  .divForm .divForm-summary .values:before
    {
      content:  "$ ";
    }
  .divForm .divForm-summary span
    {
      font-weight: bold;
    }

/* Specific forms */

  #purchase-voucher h2,
  #purchase-voucher h3,
  #purchase-voucher h4
    {
      font-size: 1.2em !important;
    }

  #purchase-voucher h2 span,
  #purchase-voucher h3 span,
  #purchase-voucher h4 span
    {
      clear: both;
      display: block;
    }

  #purchase-voucher h2 #Total,
  #purchase-voucher h3 #Subtotal,
  #purchase-voucher h4 #Surcharge
    {
      font-weight: bold !important;
      font-size: 80%;
      margin: 5px 0 15px;
    }
  #purchase-voucher .childrenFields:after
    {
      content: "";
      display: block;
      clear: both;
    }
  #purchase-voucher .childrenFields,
  #purchase-voucher .adultFields
    {
      border-left: 1px solid #e1e1e1;
    }
  #purchase-voucher .card-logos img
    {
      height: 35px;
      vertical-align: middle;
      margin-left: 15px;
      margin-top: -5px;
      padding: 6px;
      background-color: white;
      border:  1px solid #ccc;
      border-radius: 6px;
    }


@media (min-width: 992px)
  {
    .divForm .divForm-summary
      {
        width: 24% !important;
      }
  }

