/* steps */
.step:not(.active) {
    background-color: green;
    display: none;
    margin-bottom: 20px;
}

.step.active {
    display: block;
}

.step-row {
  position: relative;
}

.step-row input,
.step-row select,
.step-row textarea {
    border: 1px solid #ccc;
    transition: border-color 0.3s ease;
}

.step-row.step-success-active input {
    border-color: green;
}

.step-row.step-error-active input {
    border-color: red;
}

.step-error {
    color: red;
    display: none;
    text-align: center;
    font-style: italic;
    font-size: 18px;
    margin-top: 10px;
}

.step-row.step-error-active .step-error {
    display: block;
}

/* Fonts */
.step h2 {
    color: #c93843;
}

/* Icons */
.form-icon {
    margin-left: 10px;
    display: none;
		position: absolute;
		right: 5px;
		bottom: calc(50% - 20px);
		z-index: 99;
}

.form-icon svg {
    width: 25px;
    height: 25px;
    transition: fill 0.3s ease;
}

.form-failed {
    fill: #ff0e0e;
}

.form-success {
    fill: #3cde07;
}

.step-row.step-success-active #zip-success,
.step-row.step-success-active #phone-success {
    display: inline-block;
}

.form-icom-loader {
    animation: rotate 2s linear infinite;
    width: 18px;
    height: 18px;
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}