.width-100 {
    width : 100%;
  }
  .auto {
    margin: auto;
  }
  .dis0 {
    display : none;
  }
  .dis0.active {
    display : block;
  }
  input:-webkit-autofill,
  input:-webkit-autofill:hover,
  input:-webkit-autofill:focus,
  input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px transparent inset !important;
  }
  ul,
  ol,
  li {
    list-style: none;
  }

  input:focus {
    outline: none !important;
  }
  input:autofill-selected {
    background: transparent !important;
  }
  .pad0 {
    padding: 0 !important;
  }
  .w100 {
    width: 100%;
  }
  .flex {
    display : flex;
  }
  .auto {
    margin: auto;
  }
  /* FLOATING INPUT */
  .floating-field-box {
    padding: 0px;
    margin-bottom : 15px;
  }
  .content-3 .floating-field-box {
    margin-bottom: 10px;
  }
  .user-input-wrps {
    position: relative;
    margin: 0 auto;
  }
  .multi-select-container,
  .select2-container {
    width : 100%!important;
  }
  .multi-select-button,
  .select2-container--default .select2-selection,
  .user-input-wrps .inputText {
    width: 100%;
    outline: none;
    border: none;
    box-shadow: none !important;
    padding: 25px 13px 10px!important;
    background: transparent;
    border: 2px solid #111!important;
    border-radius: 6px;
    font-size: 16px;
    color: #000;
  }
  .user-input-wrps .inputText.equal {
    padding : 10px!important;
  }
  .user-input-wrps .inputText:focus {
    border-color: var(--theme-color);
    border-width: medium medium 2px;
  }
  .user-input-wrps .floating-labels {
    position: absolute;
    pointer-events: none;
    top: 18px;
    left: 15px;
    transition: 0.2s ease all;
    color: #111;
    font-size: 16px;
  }
  .floating-labels.active,
  .user-input-wrps input.active + .floating-labels, 
  .user-input-wrps input:focus ~ .floating-labels {
    top: 8px;
    left: 15px;
    font-size: 13px;
    opacity: 1;
    color : #312e2d;
  }
  input:-webkit-autofill,
  input:-webkit-autofill:hover,
  input:-webkit-autofill:focus,
  input:-webkit-autofill:active {
      transition: background-color 5000s ease-in-out 0s;
      /* -webkit-text-fill-color: #fff !important; */
  }
  .type-field {
    display : none;
  }
  .type-field.active {
    display : block;
  }
  .checkbox-holder {
    margin-top : 20px;
  }
  .married-box {
    display : none!important;
  }
  .married-box.active {
    display : block!important;
  }

  /* INDEX PAGE OR HOME PAGE */
  .campaign-registration {
    min-width : 100vw;
    min-height : 100vh;
    background: #e6e6e6;
    display : flex;
  }
  .campaign-registration .inner { 
    margin : auto;
    padding-bottom : 0px;
  }

  /* RADIO BUTTON */
  .radio-box-wrapper {
    margin-bottom: 5px;
  }
  .radio-box-wrapper > .radio-box {
    display: inline-block;
    margin-right: 25px;
  }
  .radio-box-wrapper.block > .radio-box {
    display : block;
    margin : 10px 0 5px;
  }
  .radio-box-wrapper.block > .radio-box [type=radio]:checked + label, 
  .radio-box-wrapper.block > .radio-box [type=radio]:not(:checked) + label {
    font-weight : bold;
    background : #eee;
    display : block;
    width : 100%;
    padding : 10px 10px 10px 40px;
    border-radius : 10px;
    border : 1px solid #aaa;
  }
  .radio-box-wrapper.block > .radio-box [type=radio]:checked + label:before, 
  .radio-box-wrapper.block > .radio-box [type=radio]:not(:checked) + label:before {
    top : 10px;
    left : 15px;
  }
  .radio-box-wrapper.block > .radio-box [type=radio]:checked + label:after, 
  .radio-box-wrapper.block > .radio-box [type=radio]:not(:checked) + label:after {
    top : 14px;
    left : 19px;
  }
  .radio-box-wrapper > .radio-box [type=radio]:checked,
  .radio-box-wrapper > .radio-box [type=radio]:not(:checked) {
    position: absolute;
    left: -9999px;
  }
  .radio-box-wrapper > .radio-box [type=radio]:checked + label,
  .radio-box-wrapper > .radio-box [type=radio]:not(:checked) + label {
    position: relative;
    padding-left: 24px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: var(--textColor);
    text-transform: capitalize;
  }
  .radio-box-wrapper > .radio-box [type=radio]:checked + label:before,
  .radio-box-wrapper > .radio-box [type=radio]:not(:checked) + label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 1px;
    width: 18px;
    height: 18px;
    border: 1px solid var(--darkColor);
    border-radius: 100%;
    background: #fff;
    border: 1px solid #222;
  }
  .radio-box-wrapper > .radio-box [type=radio]:checked + label:after,
  .radio-box-wrapper > .radio-box [type=radio]:not(:checked) + label:after {
    content: "";
    width: 10px;
    height: 10px;
    background: var(--color-1);
    position: absolute;
    top: 5px;
    left: 4px;
    border-radius: 100%;
    transition: all 0.2s ease;
  }
  .radio-box-wrapper > .radio-box [type=radio]:not(:checked) + label:after {
    opacity: 0;
    transform: scale(0);
  }
  .radio-box-wrapper > .radio-box [type=radio]:checked + label:after {
    opacity: 1;
    transform: scale(1);
  }

  /* MATERIALIZE CHECKBOX */
  .materialize-checkbox {
    position: relative;
  }
  .materialize-checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    box-sizing: border-box;
    padding: 0;
  }
  .materialize-checkbox label {
    position: relative;
    padding-left: 20px;
    cursor: pointer;
    display: inline-block;
    height: 20px;
    line-height: 20px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size : 16px;
  }
  .materialize-checkbox label::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 14px;
    height: 14px;
    z-index: 0;
    border: 2px solid #000;
    border-radius: 1px;
    margin-top: 2px;
    -webkit-transition: 0.2s;
    transition: 0.2s;
  }
  .materialize-checkbox input[type="checkbox"]:checked + label:before {
    top: -4px;
    left: -5px;
    width: 10px;
    height: 18px;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    -webkit-transform: rotate(40deg);
    transform: rotate(40deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
  .materialize-checkbox label::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    z-index: 0;
    border: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    border-radius: 1px;
    margin-top: 2px;
    -webkit-transition: 0.2s;
    transition: 0.2s;
  }
  [type="checkbox"]:not(.filled-in) + label:after {
    border: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  
  .only-label {
    font-weight : bold;
    margin-bottom : 5px;
  }
  .back-option {
    margin-top : 15px;
  }
  .back-option a {
    color: #ecdc16;
    font-weight: bold;
    display: inline-block;
    padding: 4px 16px;
    background: #222;
    border-radius: 20px;
  }
  
  .splitter-2 {
    display : grid;
    grid-template-columns : 1.5fr 1fr;
    grid-gap : 15px;
  }
  .splitter-2.small {
    grid-template-columns : auto 80px;
  }
  span.cost {
    color : var(--color-1);
  }
  .payment-mode-box {
    display: none;
    padding : 10px;
  }
  .payment-mode-box.active {
    display : block;
  }
  .number-type {
    text-transform: capitalize;
  }
  .total-cost {
    margin : 25px 0;
    background : red;
  }
  .total-cost input {
    width : 90px;
    border : none;
    color : var(--color-1);
    font-size : 32px;
  }

  /* MEDIA QUERY */
  .visible-xs {
    display : none;
  }
  @media(max-width : 767px) {
    .visible-xs {
      display : block;
    }
    .hidden-xs {
      display : none;
    }
    
    .campaign-registration .inner,
    .campaign-registration .inner .container-fluid {
      padding : 0;
    }
    .template-box-1 {
      width : 100%;
      margin : 0;
      border-radius : 0;
    }
  }