/*error page*/

@font-face {
    font-family: 'montserrat-semibold';
    src: url('fonts/Montserrat-SemiBold.ttf') format('truetype');
    font-style: normal;
}


@font-face {
    font-family: 'montserrat';
    src: url('fonts/Montserrat-Regular.ttf') format('truetype');
    font-style: normal;
}

@font-face {
    font-family: 'roboto-bold';
    src: url('fonts/Roboto-Bold.ttf') format('truetype');
    font-style: normal;
}


.error-page {
    /*background: #004890;*/
}


    .error-page form {
        /*background: rgba(0, 72, 144, .5);*/
        background: #e2e2e2;
        height: auto;
        width: 100%;
        position: relative;
        padding-bottom: 48px;
    }


    .error-page header {
        background: #f09600;
        padding: 24px 0px;
        text-align: center;
    }

    .error-page .content-holder {
        background: #fff;
        margin-top: 48px;
        margin-left: auto;
        margin-right: auto;
        padding: 40px 32px;
        text-align: center;
        position: relative;
    }

        .error-page .content-holder .message-holder .illustration-holder img {
            width: 400px;
        }

        .error-page .content-holder .message-holder .text {
            font-size: 24px;
            font-family: 'montserrat-semibold';
            color: #2c3795;
            margin-top: 24px;
            margin-bottom: 16px;
            text-transform: uppercase;
        }

        .error-page .content-holder .message-holder .button-holder {
        }

            .error-page .content-holder .message-holder .button-holder .btn-primary {
                /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#004890+0,028af1+100 */
                background: #2c3795;
                font-family: 'roboto-bold';
                font-size: 16px;
                color: #fff;
                padding: 12px 32px;
                border-radius: 24px;
                border: 0px;
            }

                .error-page .content-holder .message-holder .button-holder .btn-primary:hover {
                    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#028af1+0,004890+100 */
                    background: #c2caff;
                    color: #2c3795;
                    -webkit-transition: all .3s ease-in-out;
                    -moz-transition: all .3s ease-in-out;
                    transition: all .3s ease-in-out;
                }

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    .error-page .content-holder .message-holder .illustration-holder img {
        width: 100%;
    }
}