@font-face {
    font-family: "Poppins-Regular";
    src: url("../fonts/poppins/Poppins-Regular.ttf");
}

@font-face {
    font-family: "Poppins-Medium";
    src: url("../fonts/poppins/Poppins-Medium.ttf");
}

@font-face {
    font-family: "Poppins-SemiBold";
    src: url("../fonts/poppins/Poppins-SemiBold.ttf");
}

.registration-form * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.registration-form textarea {
    resize: none;
}

.registration-form input, .registration-form textarea, .registration-form select, .registration-form button {
    font-family: "Poppins-Regular", serif;
    font-size: 14px;
    color: #333;
}

.registration-form select {
    -moz-appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

.registration-form select option[value=""][disabled] {
    display: none;
}

.registration-form p,
.registration-form h1,
.registration-form h2,
.registration-form h3,
.registration-form h4,
.registration-form h5,
.registration-form h6,
.registration-form ul {
    margin: 0;
}

.registration-form ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.registration-form a {
    text-decoration: none;
}

.registration-form img {
    max-width: 100%;
    vertical-align: middle;
}

.wrapper {
    margin: auto;
    padding: 7px;
    background: url("../images/form-bg.png") repeat;
}

.registration-form .wizard {
    position: relative;
    background: #fff;
    padding: 15px 65px 65px 65px;
}

.registration-form .steps .current-info,
.registration-form .steps .number {
    display: none;
}

.registration-form .steps {
    position: absolute;
    right: 42px;
    top: 5px;
    z-index: 9;
}

.registration-form .steps ul {
    position: relative;
}

.registration-form h3 {
    font-family: "Poppins-SemiBold", serif;
    font-size: 35px;
    color: #3377c0;
    text-transform: uppercase;
    text-align: center;
    font-weight: 600;
    letter-spacing: 3px;
    margin-bottom: 32px;
}

.registration-form .form-row {
    display: flex;
    /*margin-bottom: 25px;*/
}

.registration-form .form-row .input-group {
    width: 100%;
}

.registration-form .form-row .form-col {
    width: 50%;
    margin-right: 40px;
}

.registration-form .form-row .form-col:last-child {
    margin-right: 0;
}

.registration-form .form-col label {
    color: #333;
    margin-bottom: 7px;
    display: block;
}

.registration-form .form-holder {
    position: relative;
}

.registration-form .form-holder i:not(.zmdi-chevron-down) {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 15px;
    font-size: 17px;
}

.registration-form .form-holder i.zmdi-chevron-down {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 15px;
    font-size: 17px;
}

.registration-form .form-holder.password i {
    cursor: pointer;
}

.registration-form .grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.registration-form .grid-item {
    width: 31.25%;
    display: flex;
    margin-bottom: 21px;
    cursor: pointer;
}

.registration-form .grid-item .thumb {
    width: 86.04%;
}

.registration-form .grid-item .heading {
    width: 13.96%;
    text-transform: uppercase;
    font-size: 11px;
    background: #b3b3b3;
    color: #fff;
    font-family: "Poppins-Medium", serif;
    writing-mode: tb-rl;
    transform: rotate(-180deg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    letter-spacing: 1px;
}

.registration-form .grid-item.active .heading {
    background: #3377c0;
}

.registration-form .grid-item:hover img {
    opacity: 0.6;
}

.registration-form .actions ul {
    display: flex;
    justify-content: space-between;
    margin-top: 42px;
}

.registration-form .actions ul.mt-7 {
    margin-top: 7px;
}

.registration-form .actions li a,
.registration-form .actions li:first-child a {
    width: 100%;
    color: #fff;
    background-color: #DD4814;
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 8px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.registration-form li a:hover,
.registration-form .actions li a:hover,
.registration-form .actions li:first-child a:hover {
    color: #fff;
    background-color: #ae3910;
    border-color: #a5360f;
}

.registration-form .actions li[aria-disabled="true"]:before {
    content: "";
}

.registration-form .actions li[aria-disabled="true"] a {
    display: none;
}

.registration-form .steps-counter {
    color: #dd4814;
    font-size: 2rem;
    display: inline-block;
    margin-bottom: 20px;
}

.registration-form .form-group {
    display: none !important;
}

.registration-form .spinner-1 {
    color: #dd4814;
    font-size: 5rem;
}

.registration-form .wizard-spinner {
    text-align: center;
}

@media (max-width: 767px) {
    .registration-form h3 {
        font-size: 30px;
    }

    .registration-form .wizard {
        height: auto;
        padding: 60px 20px 20px;
    }

    .registration-form .form-row {
        display: block;
    }

    .registration-form .form-row .form-col {
        width: 100%;
        margin-right: 0;
        margin-bottom: 25px;
    }

    .registration-form .actions ul {
        flex-direction: column;
        align-items: flex-end;
    }

    .registration-form .actions ul li {
        margin-bottom: 20px;
    }

    .registration-form .grid-item {
        width: 47%;
        display: block;
    }

    .registration-form .grid-item .thumb {
        width: 100%;
    }

    .registration-form .grid-item .heading {
        width: 100%;
        writing-mode: unset;
        transform: rotate(0);
        padding: 10px 0;
        font-size: 13px;
    }
}


.funkyradio div {
    clear: both;
    overflow: hidden;
}

.funkyradio label {
    width: 100%;
    border-radius: 3px;
    border: 1px solid #D1D3D4;
    font-weight: normal;
}

.funkyradio input[type="radio"]:empty,
.funkyradio input[type="checkbox"]:empty {
    display: none;
}

.funkyradio input[type="radio"]:empty ~ label,
.funkyradio input[type="checkbox"]:empty ~ label {
    position: relative;
    line-height: 2.5em;
    text-indent: 3.25em;
    margin-top: 2em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.funkyradio input[type="radio"]:empty ~ label:before,
.funkyradio input[type="checkbox"]:empty ~ label:before {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    content: '';
    width: 2.5em;
    background: #D1D3D4;
    border-radius: 3px 0 0 3px;
}

.funkyradio input[type="radio"]:hover:not(:checked) ~ label,
.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label {
    color: #888;
}

.funkyradio input[type="radio"]:hover:not(:checked) ~ label:before,
.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #C2C2C2;
}

.funkyradio input[type="radio"]:checked ~ label,
.funkyradio input[type="checkbox"]:checked ~ label {
    color: #777;
}

.funkyradio input[type="radio"]:checked ~ label:before,
.funkyradio input[type="checkbox"]:checked ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #333;
    background-color: #ccc;
}

.funkyradio input[type="radio"]:focus ~ label:before,
.funkyradio input[type="checkbox"]:focus ~ label:before {
    box-shadow: 0 0 0 3px #999;
}

.funkyradio-default input[type="radio"]:checked ~ label:before,
.funkyradio-default input[type="checkbox"]:checked ~ label:before {
    color: #333;
    background-color: #ccc;
}

.funkyradio-primary input[type="radio"]:checked ~ label:before,
.funkyradio-primary input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #337ab7;
}

.funkyradio-success input[type="radio"]:checked ~ label:before,
.funkyradio-success input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5cb85c;
}

.funkyradio-danger input[type="radio"]:checked ~ label:before,
.funkyradio-danger input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #d9534f;
}

.funkyradio-warning input[type="radio"]:checked ~ label:before,
.funkyradio-warning input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #f0ad4e;
}

.funkyradio-info input[type="radio"]:checked ~ label:before,
.funkyradio-info input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5bc0de;
}