/* Steg för steg-meny */


.lp-progress-menu {
   padding: 15px 0;
   border-bottom: 1px solid #e7e7e7;
}

.lp-progress-menu ul {
   list-style-type: none;
   margin: 0;
   padding: 0;
   display: flex;
}

.lp-progress-menu li {
   border: 1px solid #e7e7e7;
   flex-grow: 1;
   text-align: center;
   position: relative;
}

.lp-progress-menu a {
   padding: 12px 20px;
   display: block;
   text-decoration: none;
   font-size: 16px;
   line-height: 1.4;
   cursor: default;
}

.lp-progress-menu li:after,
.lp-progress-menu li:before {
   left: 100%;
   top: 50%;
   border: solid transparent;
   content: " ";
   height: 0;
   width: 0;
   position: absolute;
   pointer-events: none;
   z-index:2
}

.lp-progress-menu li:after {
   border-color: rgba(255, 255, 255, 0);
   border-left-color: #ffffff;
   border-width: 23px;
   margin-top: -23px;
}

.lp-progress-menu li:before {
   border-color: rgba(217, 217, 217, 0);
   border-left-color: #d9d9d9;
   border-width: 25px;
   margin-top: -25px;
}

.lp-progress-menu li:last-child:before {
   display: none;
}


/* Aktiv*/

.lp-progress-menu li.lp-active {
   background: #ee7f01;
   border-color: #ee7f01;
}

.lp-progress-menu li.lp-active:after {
   border-left-color: #ee7f01;
}

.lp-progress-menu li.lp-active a {
   color: #fff;
}


/* Dölj sista pilen */
.lp-progress-menu li:last-child:after {
   display:none;
}

/*I Mobiler*/
@media only screen 
   and (max-width : 380px) {
   /*Dölj alla steg i progressbar*/
   .lp-progress-menu li {
      display:none;
   }
   /*Utom den aktiva*/
   .lp-progress-menu li.lp-active {
      display:initial;
   }
   /*Föregå varje steg med numerär för att vägleda användaren */
   .lp-progress-menu li.lp-step-1 a:before {
      content:"1/4. ";
   }
   .lp-progress-menu li.lp-step-2 a:before {
      content:"2/4. ";
   }
   .lp-progress-menu li.lp-step-3 a:before {
      content:"3/4. ";
   }
   .lp-progress-menu li.lp-step-4 a:before {
      content:"4/4. ";
   }
}