#epform {
    max-width: 500px;
    /*text-align: center;*/
    padding: 40px 30px;
    /* box-shadow: 0px 0px 10px #e6e6e6; */
    /* border: 2px solid; */
    border-radius: 26px;
}

#epform .form-schritt p {
    color: grey;
    text-align: center;
}
#epform .form-schritt h3 {
    text-align: center;
}

#epform .ep-schritt-inner {
    max-width: 220px;
    margin: 35px auto;
}
#epform .ep-schritt-inner label{
    margin: 5px;
    color: grey;
}

#epform .prevlink:hover,
#epform .nextlink:hover {
    cursor: pointer;
}

#epform .prevlink {
    text-align: center;
    margin-top: 30px;
}
#epform .prevlink {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAyNTcxIDI1NzEiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM6c2VyaWY9Imh0dHA6Ly93d3cuc2VyaWYuY29tLyIgc3R5bGU9ImZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwOyI+PHJlY3QgaWQ9IkFydEJvYXJkMSIgeD0iMCIgeT0iMCIgd2lkdGg9IjI1NzAuNTIiIGhlaWdodD0iMjU3MC41MiIgc3R5bGU9ImZpbGw6bm9uZTsiLz48Y2xpcFBhdGggaWQ9Il9jbGlwMSI+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjI1NzAuNTIiIGhlaWdodD0iMjU3MC41MiIvPjwvY2xpcFBhdGg+PGcgY2xpcC1wYXRoPSJ1cmwoI19jbGlwMSkiPjxwYXRoIGQ9Ik0xMDU5Ljg0LDgzOC41MTVsLTY3MC4xMTUsNDQ2Ljc0M2w2NzAuMTE1LDQ0Ni43NDMiIHN0eWxlPSJmaWxsOm5vbmU7c3Ryb2tlOiMwMDA7c3Ryb2tlLXdpZHRoOjEwNC4xN3B4OyIvPjxwYXRoIGQ9Ik0zODkuNzI0LDEyODUuMjZjMzkyLjkyOCwwIDE4ODQuOTYsMCAxODg0Ljk2LDAiIHN0eWxlPSJmaWxsOm5vbmU7c3Ryb2tlOiMwMDA7c3Ryb2tlLXdpZHRoOjEwNC4xN3B4O3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxLjU7Ii8+PC9nPjwvc3ZnPg==");
    background-repeat: no-repeat;
    background-position-x: 10px;
    background-size: 32px;
    background-position-y: center;
}


#epform .nextlink {
    border: 2px solid;
    display: block;
    padding: 10px 50px;
    font-size: 20px;
    margin-bottom: 10px;
    border-radius: 50px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: 40px;
    text-transform: uppercase;

}


#epform .button {
    border: 2px solid;
    display: block;
    padding: 10px 20px;
    font-size: 20px;
    margin-bottom: 10px;
    border-radius: 14px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
	position: relative;
}

#epform .button.active:after {
	background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAyNTcxIDI1NzEiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM6c2VyaWY9Imh0dHA6Ly93d3cuc2VyaWYuY29tLyIgc3R5bGU9ImZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxLjU7Ij48cmVjdCBpZD0iQXJ0Qm9hcmQxIiB4PSIwIiB5PSIwIiB3aWR0aD0iMjU3MC41MiIgaGVpZ2h0PSIyNTcwLjUyIiBzdHlsZT0iZmlsbDpub25lOyIvPjxjaXJjbGUgY3g9IjEyODUuMjYiIGN5PSIxMjg1LjI2IiByPSI3ODEuMjUiIHN0eWxlPSJmaWxsOm5vbmU7c3Ryb2tlOiMwMDA7c3Ryb2tlLXdpZHRoOjEwNC4xN3B4OyIvPjxwYXRoIGQ9Ik04MzUuNDcyLDEzNDMuNGwyOTYuODMzLDI0My4yMyIgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MTA0LjE3cHg7Ii8+PHBhdGggZD0iTTE3MzUuMDUsOTgzLjg4OGwtNjAyLjc0LDYwMi43NCIgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MTA0LjE3cHg7Ii8+PC9zdmc+");
	content: '';
	  background-repeat: no-repeat;
	  background-position-x: 100%;
	  background-size: 32px;
	  background-position-y: center;
	  width: 30px;
	  height: 30px;
	  display: block;
	  position: absolute;
	  right: 8px;
	  top: 10px;
	   filter: hue-rotate(90deg);
}

#epform .button span {
    font-size: 14px;
    line-height: 16px;
    display: block;
    color: gray;
}

#epform input {
    border: 2px solid !important;
    border-radius: 14px !important;
    height: 54px;
	width: 100%;
  padding: 0 10px;
}

#epform .input-error-message {
    color: #e91e63;
    font-size: 12px;
    margin-top: 4px;
}

#epform .error {
    border: 2px solid #e91e63 !important;
}

.button.male {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAyNTcxIDI1NzEiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM6c2VyaWY9Imh0dHA6Ly93d3cuc2VyaWYuY29tLyIgc3R5bGU9ImZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxLjU7Ij48cmVjdCBpZD0iQXJ0Qm9hcmQxIiB4PSIwIiB5PSIwIiB3aWR0aD0iMjU3MC41MiIgaGVpZ2h0PSIyNTcwLjUyIiBzdHlsZT0iZmlsbDpub25lOyIvPjxjbGlwUGF0aCBpZD0iX2NsaXAxIj48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMjU3MC41MiIgaGVpZ2h0PSIyNTcwLjUyIi8+PC9jbGlwUGF0aD48ZyBjbGlwLXBhdGg9InVybCgjX2NsaXAxKSI+PGNpcmNsZSBjeD0iMTI4NS4yNiIgY3k9IjEzNDAuMTMiIHI9Ijc4MS4yNSIgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MTA0LjE3cHg7Ii8+PHBhdGggZD0iTTIyNjQuNjcsNzA5LjkzM2w1NS4yNDMsLTI3Ni4yMTNsLTI3Ni4yMTQsNTUuMjQzIiBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojMDAwO3N0cm9rZS13aWR0aDoxMDQuMTdweDtzdHJva2UtbGluZWpvaW46bWl0ZXI7c3Ryb2tlLW1pdGVybGltaXQ6MTA7Ii8+PHBhdGggZD0iTTIzMTkuOTEsNDMzLjcyYy0xMzIuNzQzLDEzMi43NDIgLTQxOC4yNTYsNDE4LjI1NiAtNDE4LjI1Niw0MTguMjU2IiBzdHlsZT0iZmlsbDpub25lO3N0cm9rZTojMDAwO3N0cm9rZS13aWR0aDoxMDQuMTdweDsiLz48L2c+PC9zdmc+");
    background-repeat: no-repeat;
    background-position-x: 10px;
    background-size: 32px;
    background-position-y: center;
}
.button.female {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj48c3ZnIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAyNTcxIDI1NzEiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM6c2VyaWY9Imh0dHA6Ly93d3cuc2VyaWYuY29tLyIgc3R5bGU9ImZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxLjU7Ij48cmVjdCBpZD0iQXJ0Qm9hcmQxIiB4PSIwIiB5PSIwIiB3aWR0aD0iMjU3MC41MiIgaGVpZ2h0PSIyNTcwLjUyIiBzdHlsZT0iZmlsbDpub25lOyIvPjxjaXJjbGUgY3g9IjEyODUuMjYiIGN5PSIxMDA2LjgiIHI9Ijc4MS4yNSIgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MTA0LjE3cHg7Ii8+PHBhdGggZD0iTTEyODUuMjYsMTc4OC4wNWwwLDY2Ni42NjciIHN0eWxlPSJmaWxsOm5vbmU7c3Ryb2tlOiMwMDA7c3Ryb2tlLXdpZHRoOjEwNC4xN3B4OyIvPjxwYXRoIGQ9Ik0xNjE4LjU5LDIxNTguNzVsLTY2Ni42NjcsMCIgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MTA0LjE3cHg7Ii8+PC9zdmc+");
    background-repeat: no-repeat;
    background-position-x: 10px;
    background-size: 32px;
    background-position-y: center;
}


#epform #gewicht,
#epform #groesse,
#epform #alter {
    text-align: center;
}

#epform .button:hover {
    cursor: pointer;
    box-shadow: 0px 0px 10px #cecece;
    background-color: #ececec;
}

.loader {
    width: 100%;
    height: 40px;
    border: 1px solid #d9d9d9;
    position: relative;
    border-radius: 40px;
    /*box-shadow: 0px 0px 10px #cecece;*/
    overflow: hidden;
    margin-bottom: 20px;
    max-width: 250px;
    margin-left: auto;
    margin-right: auto;
}

.progress {
    width: 0;
    height: 100%;
    background: rgb(242, 242, 242);
    background: linear-gradient(90deg, rgb(242, 242, 242) 0%, rgb(161, 210, 174) 100%);
    position: absolute;
    top: 0;
    left: 0;
    animation: fill 5s linear forwards;
}

@keyframes fill {
    0% { width: 0; }
    100% { width: 100%; }
}

.count {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    font-weight: bold;
}

.submitformbutton {
    transition: all 0.3s ease-in-out;
    margin: 40px auto 10px auto !important;
    display: block !important;
    min-width: 200px;
    border: 2px solid !important;
    border-radius: 30px !important;
    height: 54px;
  padding: 10px 50px;
  font-size: 20px;
  text-align: center;
  text-transform: uppercase;
  background: white;
  
}
.submitformbutton:hover {
  cursor: pointer;
}



.inactive {
    /* Stile für den inaktiven Button */
    cursor: not-allowed; /* Zeigt den nicht erlaubten Cursor an */
    opacity: 0.3;
	pointer-events: none;
}