
/*error page*/

@font-face {
    font-family: 'amatic';
    src: url('fonts/AmaticSC-Regular.ttf') format('truetype');
    font-style: normal;
}


@font-face {
    font-family: 'montserrat';
    src: url('fonts/Montserrat-Regular.ttf') format('truetype');
    font-style: normal;
}

.error-page {
    background: #004890;
}


    .error-page form {
        background: rgba(0, 72, 144, .5);
        height: auto;
        width: 100%;
        position: relative;
        padding-bottom: 48px;
    }


    .error-page header {
        background: #0087ea;
        padding: 16px 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: #004c94;
            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: #004890; /* Old browsers */
                background: -moz-linear-gradient(-45deg, #004890 0%, #028af1 100%); /* FF3.6-15 */
                background: -webkit-linear-gradient(-45deg, #004890 0%,#028af1 100%); /* Chrome10-25,Safari5.1-6 */
                background: linear-gradient(135deg, #004890 0%,#028af1 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004890', endColorstr='#028af1',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
                font-family: 'montserrat';
                font-size: 16px;
                font-weight: bold;
                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: #028af1; /* Old browsers */
                    background: -moz-linear-gradient(-45deg, #028af1 0%, #004890 100%); /* FF3.6-15 */
                    background: -webkit-linear-gradient(-45deg, #028af1 0%,#004890 100%); /* Chrome10-25,Safari5.1-6 */
                    background: linear-gradient(135deg, #028af1 0%,#004890 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
                    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#028af1', endColorstr='#004890',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
                    -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%;
    }
}
