.patient_ack_form{
    position: relative;
}

.patient_ack_form label{
    font-weight: bold;
    color: #000;
    margin-bottom: 10px;
    margin-top: 20px;
    display: block;
}

.patient_ack_form label:first-child{
    margin-top: 0;
}

.patient_ack_form input[type="submit"]{
    margin-top: 30px;
    float: left;
}

.patient_ack_form a.go-back{
    background-color: #0d2846;
    color: #fff;
    padding: 13px 22px;
    border-radius: 4px;
    clear: left;
    float: left;
    margin-top: 30px;
    margin-right: 20px;
}

.patient_ack_form .date_col{
    width: 30%;
    float: left;
}

.patient_ack_form .phone_col{
    width: 28%;
    float: left;
}

.patient_ack_form span.separator{
    color: #000;
    float: left;
    width: 5%;
    text-align: center;
    font-weight: bold;
    font-size: 19px;
    line-height: 48px;
}

.patient_ack_form .clear_fix{
    display:  block;
    clear: both;
}

.patient_ack_form select{
    height: 48px;
    background-color: rgba(0,0,0,0.04);
    border-radius: 4px;
    border: 2px solid rgba(0,0,0,0);
}

.alert-danger{
    background: #F44336;
    padding: 10px;
    border-radius: 5px;
    color: #fff;
    float: left;
    clear: both;
    width: 100%;
    box-sizing: border-box;
}

.alert-info{
    background: #d4effb;
    padding: 10px;
    border-radius: 5px;
    color: #0272a5;
}

.alert-success{
    background: green;
    padding: 10px;
    border-radius: 5px;
    float: left;
    clear: both;
    width: 100%;
    box-sizing: border-box;
    margin: 20px 0 30px 0;
    color: #ffffff;
}

.patient_ack_form .form-field.col_4{
    width: 20%;
    float: left;
    margin-right: 5%;
    margin-top: 20px;
}

.patient_ack_form .form-field.col_4:nth-child(2){
    width: 50%;
}

.patient_ack_form .form-field.col_4:nth-child(3){
    margin-right: 0 !important;
}

.patient_ack_form .form-field.col_4 a{
    font-size: 11px;
    float: right;
}

.patient_ack_form .form-field.col_6{
    float: left;
    width: 45%;
    margin-right: 5%;
    margin-top: 20px;
}

.upload-btn-wrapper {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.upload-btn-wrapper input[type=file] {
  font-size: 100px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  cursor: pointer;
}

.mt-0{
    margin-top: 0 !important;
}

.mr-0{
    margin-right: 0 !important;
}

/* STEPPER */

:root {
  --s-width: 900px;
  --s-gutter: 2.5rem;
  --c-background: hsl(0, 0%, 94%);
  --c-accent: hsl(0, 0%, 94%);
}

.stepper {
  --s-stepper-bullet: 2rem;
  --s-stepper-bullet-half: calc( var(--s-stepper-bullet) / 2 );
  --step-transition: background .5s, color .5s;
  --step-content: '✔︎';
  --step-color: hsl(0, 0%, 70%);
  --step-bar-bg: var(--c-accent);
  --step-bullet-bg: var(--step-bar-bg);
  --step-bullet-color: white;
  counter-reset: current-step;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(1px, 1fr));
  position: relative;
  z-index: 1;
  margin: 30px auto 50px auto !important;
}

.stepper[data-debug] {
  counter-reset: steps;
}

.stepper[data-debug]::after {
  content: "number of steps: " counter(steps);
  display: block;
  position: absolute;
  bottom: -1.5rem;
  width: 100%;
  text-align: center;
  color: #bf9540;
}

.stepper[data-debug] input {
  --s-separation: 1.5rem;
  position: absolute;
  display: initial;
  top: -2rem;
}

.stepper[data-debug] input:nth-of-type(1) {
  left: calc( var(--s-separation) * 1 + .75rem);
}

.stepper[data-debug] input:nth-of-type(2) {
  left: calc( var(--s-separation) * 2 + .75rem);
}

.stepper[data-debug] input:nth-of-type(3) {
  left: calc( var(--s-separation) * 3 + .75rem);
}

.stepper[data-debug] input:nth-of-type(4) {
  left: calc( var(--s-separation) * 4 + .75rem);
}

.stepper[data-debug] input:nth-of-type(5) {
  left: calc( var(--s-separation) * 5 + .75rem);
}

.stepper[data-debug] input:nth-of-type(6) {
  left: calc( var(--s-separation) * 6 + .75rem);
}

.stepper[data-debug] input:nth-of-type(7) {
  left: calc( var(--s-separation) * 7 + .75rem);
}

.stepper[data-debug] input:nth-of-type(8) {
  left: calc( var(--s-separation) * 8 + .75rem);
}

.stepper[data-debug] input:nth-of-type(9) {
  left: calc( var(--s-separation) * 9 + .75rem);
}

.stepper[data-debug] input:nth-of-type(10) {
  left: calc( var(--s-separation) * 10 + .75rem);
}

.stepper__input {
  counter-increment: steps;
  display: none;
}

.stepper__step {
  counter-increment: current-step;
}

.stepper__input:checked ~ .stepper__step {
  --step-color: hsl(0, 0%, 30%);
  --step-bar-bg: hsl(0, 0%, 92%);
  --step-bullet-bg: var(--step-bar-bg);
  --step-bullet-color: hsl(0, 0%, 20%);
  --step-content: counter(current-step);
}

.stepper__input:checked ~ .stepper__step .stepper__content {
  opacity: 0;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.stepper__input:checked + .stepper__step {
  --step-bullet-bg: #53c3c2;
  --step-bullet-color: white;
  --step-color: black;
}

.stepper__input:checked + .stepper__step .stepper__button::before {
  box-shadow: 0 0 0 2px #b3b3b3;
}

.stepper__input:checked + .stepper__step .stepper__content {
  opacity: 1;
  pointer-events: auto;
  -webkit-user-select: auto;
     -moz-user-select: auto;
      -ms-user-select: auto;
          user-select: auto;
}

.stepper__content {
  color: white;
  text-align: center;
  font-style: italic;
  font-weight: 300;
  color: var(--step-color);
  transition: opacity .5s .05s;
  padding: .5rem;
}

.stepper__content::-moz-selection {
  color: black;
  background: var(--step-bullet-color);
}

.stepper__content::selection {
  color: black;
  background: var(--step-bullet-color);
}

.stepper__button {
  position: relative;
  text-align: center;
  color: var(--step-color);
  display: block;
}

.stepper__button::before {
  content: var(--step-content);
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto var(--s-stepper-bullet-half);
  height: var(--s-stepper-bullet);
  width: var(--s-stepper-bullet);
  border-radius: var(--s-stepper-bullet);
  transition: var(--step-transition);
  background: var(--step-bullet-bg);
  color: var(--step-bullet-color);
}

.stepper__button::after {
  content: '';
  position: absolute;
  width: 100%;
  height: calc( var(--s-stepper-bullet-half) / 2 );
  background: var(--step-bar-bg);
  transition: var(--step-transition);
  top: var(--s-stepper-bullet-half);
  left: 50%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  z-index: -1;
}

.stepper__step:last-child .stepper__button::after {
  display: none;
}

.stepper--flexbox {
  display: flex;
}

.stepper--flexbox .stepper__step {
  flex-grow: 1;
  flex-shrink: 0;
  flex-basis: 0;
}

.autocomplete-suggestions {
    border: 1px solid #0c2746;
    background: #FFF;
    overflow: auto;
    margin-top: 0;
    border-radius: 4px;
}

.autocomplete-suggestion {
    padding: 2px 5px;
    white-space: nowrap;
    overflow: hidden;
}

.autocomplete-selected {
    background: #F0F0F0;
}

.autocomplete-suggestions strong {
    font-weight: normal;
    color: #3399FF;
}

.autocomplete-group {
    padding: 2px 5px;
}

.autocomplete-group strong {
    display: block;
    border-bottom: 1px solid #000;
}

.breast_pump_details{
    margin: 30px 0;
}

#breast_pump_details{
    display: block;
    clear: both;
    overflow: auto;
}

.breast_pump_details .breast_pump_image{
    width: 40%;
    float: left;
}

.breast_pump_details .breast_pump_image img{
    width: 100%;
}

.breast_pump_details .breast_pump_info{
    width: 60%;
    float: left;
}

.product-content .tabs{
    display: flex;
}

.product-content .tabs a{
    padding: 10px 20px;
    border: 1px solid #e2e2e2;
    margin-right: 2px;
    color: #136cb3;
}

.product-content .tabs a.active{
    border: 1px solid orange;
    background: orange;
    color: #fff;
    font-weight: bold;
}

.product-content .tab-content{
    border: 1px solid #e2e2e2;
    padding: 20px;
}

.product-content .tab-content ul{
    margin-bottom: 0;
}

.express_reorder .field{
    margin-bottom: 30px;
}

.express_reorder .field label{
    font-weight: bold;
    clear: both;
    display: block;
}

.express_reorder .patient_ack_form{
    width: 40%;
    float: left;
}

.express_reorder .info{
    width: 50%;
    margin-left: 10%;
    float: left;
}

.express_reorder p{
    padding-bottom: 10px;
}

.supplies-head{
    background: #FF9800;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
    font-weight: bold;
    margin-bottom: 30px;
    margin-top: 20px;
    font-size: 12px;
}

.reorder_step_3 .col-30, .reorder_step_4 .col-30{
    width: 30%;
    float: left;
    clear: left;
}

.reorder_step_3 .col-70, .reorder_step_4 .col-70{
    width: 70%;
    float: left;
}

.reorder_step_3 .sub-head, .reorder_step_4 .sub-head{
    color: #999;
}

.reorder_step_3 .item-title, .reorder_step_4 .item-title{
    color: #2196F3;
}

.reorder_step_3 .reorder-quantity, .reorder_step_4 .reorder-quantity{
    color: #656565;
    font-weight: bold;
    margin-bottom: 10px;
    float: left;
    clear: both;
}

.reorder_step_3 .item, .reorder_step_4 .item{
    margin-bottom: 30px;
    float: left;
}

.reorder_step_3 input[type="text"], .reorder_step_4 input[type="text"],.reorder_step_3 input[type="number"]{
    max-width: 250px;
    float: left;
    clear: both;
    margin-bottom: 30px;
}

.reorder_step_3 input[type="number"]{
    background-color: rgba(0,0,0,0.04);
    border-radius: 4px;
    border: 2px solid rgba(0,0,0,0);
    padding: 10px;
    width: 100%;
    font-size: 14px;
    font-family: inherit;
    line-height: 24px;
    color: #555;
    -webkit-transition: all 0.2s ease;
}

.review{
    background: #ff9800 !important;
    margin-right: 20px;
}

.reorder_step_3 .col-30 img, .reorder_step_4 .col-30 img{
    max-width: 110px !important;
    display: block !important;
}

.reorder_step_4 .quantity-remaining{
    float: left;
    clear: both;
    font-size: 14px;
}

.reorder_step_5 .col-50{
    width: 50%;
    float: left;
}

.reorder_step_5 .btn-blue{
    background-color: #0d2846 !important;
    margin-right: 20px;
}

.reorder_step_4 .btn-blue, .reorder_step_3 .btn-blue{
    margin-right: 20px;
}

.reorder_step_5{
    font-size: 18px;
}

@media(max-width:800px){

    .stepper__button{
        color: #fff !important;
    }

    .patient_ack_form .form-field.col_4{
        width: 100% !important;
    }

    .express_reorder .patient_ack_form{
        width: 100%;
        float: left;
    }

    .express_reorder .info{
        width: 100%;
        margin-left: 0;
        margin-top: 30px;
        float: left;
    }

    .reorder_step_3 .col-30 img, .reorder_step_4 .col-30 img{
        width: 80% !important;
    }

    .reorder_step_5 .col-50{
        width: 100%;
        float: left;
        margin-bottom: 40px;
    }

}