/* Page */

body {
    color: #505050 !important;
}

    body.loginoldalbody {
        height: 100%;
    }

.page {
    position: relative;
    max-width: 1680px;
    max-height: 980px;
    margin: auto;
    font-family: Roboto, sans-serif;
}
/*Felh. feltételek megváltozása: */
.loginoldalbody a {
    padding-right: 12px;
    font-size: 14px;
    color: #8e8e8e;
}

.loginoldalbody .checkBoxLabel {
    display: block;
    position: relative;
    padding-left: 45px;
    padding-top: 5px;
    margin-bottom: 12px;
    margin-top: 12px;
    cursor: pointer;
    font-size: 15px;
}

/* Modal dialog */

.modal:nth-last-of-type(even) {
    z-index: 1052 !important;
}

.model-backdrop.show:nth-last-of-type(even) {
    z-index: 1051 !important;
}

.modal-dialog.wide {
    width: 80%;
    max-width: 650px;
    min-width: 400px;
}

.modal-dialog {
    overflow-y: initial !important;
}

.modal-content .modal-header {
    border: none;
    height: 55px;
    padding: 16px;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
    text-align: center;
    font-size: 30px;
    position: relative;
}

    .modal-content .modal-header.success {
        color: white;
        background-color: #8DE51D;
    }

    .modal-content .modal-header.error {
        color: white;
        background-color: #FF0000;
    }

        .modal-content .modal-header.error > h4.modal-title {
            color: white !important;
        }

    .modal-content .modal-header .modal-title {
        color: white;
        font-size: 22px;
        /*position: absolute;*/
        height: 33px;
        /*top: 50%;*/
        margin: -4px auto 0;
        width: 100%;
        text-align: center;
    }

    .modal-content .modal-header button.close {
        color: white;
        opacity: 0.8;
        outline: none;
        font-size: 36px;
        /*margin-top: -34px;*/
        /*position: absolute;*/
        /*top: 50%;*/
        /*right: 20px;*/
        float: right;
        padding: 0 4px;
        margin: -3px 0 0 0;
    }

        .modal-content .modal-header button.close:hover {
            opacity: 1;
        }

.modal-content .modal-body {
    padding: 16px;
    overflow-y: auto;
    max-height: calc(100vh - 190px);
    /*word-break: break-all;*/
}

.modal-content .modal-footer {
    padding: 16px;
    border-bottom-left-radius: 0.6em;
    border-bottom-right-radius: 0.6em;
    background-color: #f9f9f9;
}

.modal-content .dialog-controls {
    display: flex;
}

.modal-content .modal-footer button.dialogOK {
    border: none;
    outline: none;
    padding: 0;
    width: 75px;
    height: 32px;
    font-size: 14px;
    color: white;
}

.modal-content .modal-footer .btn {
    color: white;
}

/* - Input - */
.input-group .input-group-text {
    border: 1px solid #F4F4F4;
    border-left: none !important;
    background-color: #f4f9ff;
    padding: 0.375rem 0.75rem 0.375rem 0.5rem;
    /* border-top-right-radius: 1em; */
    /* border-bottom-right-radius: 1em; */
}

    .input-group .input-group-text.empty-span {
        background: #e8f0fd;
    }

    .input-group .input-group-text .glyphicon {
        margin: 0 2px;
    }

    .input-group .input-group-text > .glyphicon:hover {
        color: #019CDE;
    }

.input-group input:focus {
    border-right: none !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

    .input-group input:focus ~ .input-group-append .input-group-text {
        border: 1px solid #019CDE;
        border-left: none;
        background-color: transparent !important;
    }

/* Buttons */

.btn:focus {
    outline: none;
    box-shadow: none !important;
}

.btn:active {
    transform: scale(0.99);
    /*box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24);*/
}

.btn.btn-primary,
.btn.btn-secondary {
    display: block;
    height: 50px;
    font-size: 14px;
    font-weight: bold;
    border-radius: 0.6em;
    padding: 0.375rem 1.75rem;
}

a.btn.btn-primary {
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn.btn-primary.btn-outlined,
.btn.btn-primary.btn-outlined:focus {
    color: white;
    border-color: #505050;
    background-color: #505050;
}

    .btn.btn-primary.btn-outlined:hover {
        color: #007bff;
        border-color: #007bff;
        background-color: white !important;
    }

.action .btn.btn-primary {
    width: 90%;
    margin-top: 12px;
}

.action .btn.btn-secondary {
    width: 90%;
    margin-top: 12px;
    border-radius: 0.6em;
}

.action.flex-narrow .btn.btn-primary {
    width: 100%;
    margin-top: 12px;
}

#btn-tovabb {
    display: block;
    width: 120px;
    height: 50px;
    font-size: 16px;
    font-weight: bold;
    margin: auto;
    margin-top: 12px;
}

#btn-vissza {
    width: 120px;
    height: 50px;
    font-size: 16px;
    font-weight: bold;
    margin: auto;
    margin-top: 12px;
}

/* Checkbox */

.checkmark {
    background-color: #eee;
}

.checkBoxLabel:hover input ~ .checkmark {
    background-color: #ccc;
}

/* Select */

select.form-control {
    font-size: 14px;
    border-radius: .6rem;
    padding: .5rem 1rem;
    -webkit-box-shadow: inset 0 0 0 rgb(0 0 0 / 8%), 0 0 0 rgb(102 175 233 / 60%) !important;
    box-shadow: inset 0 0 0 rgb(0 0 0 / 8%), 0 0 0 rgb(102 175 233 / 60%) !important;
}

    select.form-control:not(:focus) {
        border-color: transparent;
        background: #e8f0fd;
    }

    select.form-control:focus {
        border-color: #019CDE;
    }

.input-container.select-province > span {
    color: #8e8e8e;
    font-size: 14px;
    padding: 10px 0 0 13px;
}

/* Header & footer */

header {
    height: 90px;
}

#logo-container {
    padding: 0;
    margin-left: 20%;
    height: 90px;
    width: 184px;
    text-align: center;
}

#header-logo {
    height: 90px;
    width: 184px;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

#Logo {
    padding: 0px;
    padding-left: 20%;
}

#languages-container {
    float: right;
    padding: 25px 0;
    margin-right: 20%;
    margin-top: -90px;
}

    #languages-container button {
        height: 40px;
        color: #8e8e8e;
        background: white;
        border: 1px solid #ced4da;
        outline: none !important;
        border-radius: 0.6em;
    }

        #languages-container button::after {
            display: inline-block;
            width: 0;
            height: 0;
            margin-left: .255em;
            vertical-align: .255em;
            content: "";
            border-top: .3em solid;
            border-right: .3em solid transparent;
            border-bottom: 0;
            border-left: .3em solid transparent;
        }

        #languages-container button .lcd-globe-icon {
            font-size: 16px;
            vertical-align: middle;
            width: 16px;
            height: 16px;
            display: block;
            margin-top: 4px;
            margin-right: 10px;
            float: left;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url("ikonok/nyelv.png");
        }

        #languages-container button .lcd-label {
            padding-left: 5px;
        }

    #languages-container ul {
        min-width: 128px;
        padding: 4px 0px;
    }

        #languages-container ul li {
            padding: 4px 10px;
        }

            #languages-container ul li a:hover,
            #languages-container ul li a:focus {
                color: black !important;
                text-decoration: none !important;
                background-color: #f8f8f8 !important;
            }

footer {
    position: absolute;
    padding: 18px;
    height: 60px;
    width: 60%;
    left: 20%;
}

    footer .footer-container {
        float: left;
    }

        footer .footer-container.center {
            float: none;
            margin: auto;
            text-align: center;
        }

    footer .footerText {
        color: #8e8e8e;
        font-size: 12px;
    }

    footer a {
        cursor: pointer;
    }

        footer a:hover {
            text-decoration: none;
        }

    footer .cookieLink {
        display: inline;
    }

    footer .cookieLinks {
        float: right;
    }

/* Login page content */

#login-page-background,
#two-factor-auth-background {
    position: relative;
    width: 100%;
    height: 850px;
    max-height: 850px;
}

#login-page-background-extension {
    position: relative;
}

    #login-page-background-extension.registration-background {
        height: 75px;
    }

.registration-background-extension {
    height: 0;
}

#login-header {
    background-color: transparent;
    color: #fff;
    line-height: normal;
    padding: 0.5rem;
    position: absolute;
    top: 50px;
    bottom: 0;
    left: 20%;
    max-width: 600px;
    /*font-weight: bold;*/
}

.page-title-container {
    width: 100%;
    height: 80px;
    font-weight: bold;
    line-height: normal;
    color: #fff;
}

#registration-form-background {
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    width: 1100px;
    top: 50%;
    left: 50%;
    margin-top: -290px;
    margin-left: -550px;
    background-color: white;
}

#unified-registration-form-background {
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    width: 1100px;
    top: 50%;
    left: 50%;
    margin-top: -150px;
    margin-left: -550px;
    background-color: white;
}

#terms-of-use-page-header {
    width: 100%;
    height: 80px;
    font-weight: bold;
    line-height: normal;
    text-align: center;
    color: #fff;
}

#terms-of-use-page-header-text {
    font-size: 18px;
    line-height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#terms-of-use-form-background {
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    width: 1100px;
    top: 50%;
    left: 50%;
    margin-top: -290px;
    margin-left: -550px;
    background-color: #ffffff;
}

#two-factor-auth-background .two-factor-auth-container {
    display: flex;
    justify-content: center;
}

    #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container {
        width: 600px;
        background-color: #FFFFFF;
        margin-top: 100px;
    }

        #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-form-input {
            margin-top: 30px;
            margin-top: 30px;
            margin-left: 10px;
            margin-right: 10px;
            text-align: center;
        }

            #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-form-input .two-factor-auth-form-input-title {
                font-size: 20px;
                font-weight: bold;
            }

                #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-form-input .two-factor-auth-form-input-title .two-factor-auth-icon {
                    background-image: url("ikonok/info.png");
                }

            #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-form-input .two-factor-auth-form-input-text {
                margin-top: 10px;
            }

            #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-form-input .two-factor-auth-form-re-send-email {
                text-align: center;
                display: none;
                font-size: 14px;
            }

        #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-validation-input {
            font-size: 36px;
            text-align: center;
            border-top-left-radius: 20px;
            border-bottom-left-radius: 20px;
            padding-left: 42px;
        }

        /* Chrome, Safari, Edge, Opera */
        #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-form-input .two-factor-auth-validation-input::-webkit-outer-spin-button,
        #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-form-input .two-factor-auth-validation-input::-webkit-inner-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }
        /* Firefox */
        #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .two-factor-auth-form-input .two-factor-auth-validation-input {
            -moz-appearance: textfield;
        }

        #two-factor-auth-background .two-factor-auth-container #two-factor-auth-form-container .input-container .input-group-append .input-group-text.empty-span {
            border-top-right-radius: 20px;
            border-bottom-right-radius: 20px;
        }

.dap-login-container {
    background: #fff;
    max-width: 420px;
    margin: 40px auto;
    border-radius: 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
    padding: 32px 28px;
}

    .dap-login-container .dap-header {
        display: flex;
        align-items: center;
        margin-bottom: 30px;
    }

    .dap-login-container .dap-header-back {
        text-align: right;
        margin-bottom: 20px;
    }

    .dap-login-container .dap-header .dap-icon {
        width: 48px;
        height: 48px;
        background: #e8f0fe;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 14px;
        font-size: 22px;
        color: #1967d2;
        font-weight: bold;
        background-image: url("ikonok/dap-logo.svg");
    }

    .dap-login-container .dap-header .dap-title {
        font-size: 18px;
        font-weight: bold;
    }

    .dap-login-container .dap-header .dap-subtitle {
        color: #666;
        font-size: 14px;
    }

    .dap-login-container .dap-section {
        margin-bottom: 24px;
    }

        .dap-login-container .dap-section .dap-section-title {
            font-size: 17px;
            font-weight: bold;
            margin-bottom: 6px;
        }

        .dap-login-container .dap-section .dap-section-desc {
            font-size: 15px;
            color: #333;
            margin-bottom: 16px;
        }

        .dap-login-container .dap-section .dap-qr-box {
            background: #f4f8fb;
            border-radius: 12px;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 18px 0;
            margin-bottom: 28px;
        }

            .dap-login-container .dap-section .dap-qr-box > .dap-qr {
                width: 160px;
                height: 160px;
                display: block;
            }

        .dap-login-container .dap-section .dap-howto-title {
            font-size: 16px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .dap-login-container .dap-section .dap-howto-list {
            font-size: 15px;
            color: #222;
            padding-left: 20px;
        }

            .dap-login-container .dap-section .dap-howto-list li {
                margin-bottom: 7px;
            }


.btn.btn-primary.btn-solid.dap-login {
    background-color: #4258ed;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn.btn-primary.btn-solid.dap-login:disabled {
        background-color: rgb(66 88 237 / 5%);
        color: #4258ed;
        border-color: rgba(66, 88, 237, .2);
        border-width: 1px;
        border-style: solid;
    }

    .btn.btn-primary.btn-solid.dap-login .dap-icon {
        width: 32px;
        height: 32px;
        margin-right: 8px;
        color: #1967d2;
        background-image: url("ikonok/dap-logo.svg");
        background-color: #FFFFFF;
        background-size: contain;
        border-radius: 15px;
        border-color: #FFFFFF;
        border-width: 1px;
        border-style: solid;
    }

    .btn.btn-primary.btn-solid.dap-login:hover {
        background-color: #3130ab !important;
    }

        .btn.btn-primary.btn-solid.dap-login:hover:disabled {
            background-color: rgb(66 88 237 / 10%) !important;
        }



#customer-feedback-background {
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    width: 1100px;
    top: 50%;
    left: 50%;
    margin-top: -290px;
    margin-left: -550px;
    min-height: 600px;
}

.terms-of-use-container {
    width: 100%;
    padding-top: 16px;
    margin-top: .5rem;
    color: black;
    background-color: #FFFFFF;
}

.terms-of-use-text-container {
    height: 488px;
    width: 90%;
    padding: 4%;
    margin: auto;
    background-color: #FAFAFA;
}

    .terms-of-use-text-container.registration {
        height: 260px;
    }

.terms-of-use-text-placeholder.registration {
    height: 260px;
}

.felteltelek-tartalom-div {
    border: 0px;
    height: 400px;
    max-height: 400px;
    margin: auto;
    display: block;
    overflow-y: scroll;
    word-wrap: break-word;
    background-color: #FAFAFA;
}

    .felteltelek-tartalom-div.registration {
        height: 150px;
    }

#action-panel {
    width: 90%;
    margin: auto;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.action {
    flex: 25%;
    padding: 12px;
}

    .action.flex-narrow {
        flex: 0 0 25%;
        padding: 0;
        margin: auto;
    }

#forgotten-password-form-background {
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    width: 1100px;
    top: 50%;
    left: 50%;
    margin-top: -160px;
    margin-left: -550px;
    background-color: white;
}

#manual-registration-form-background {
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    width: 1100px;
    top: 50%;
    left: 50%;
    margin-top: -160px;
    margin-left: -550px;
    background-color: white;
}

#forgotten-password-form-background #action-panel {
    justify-content: initial;
    align-items: initial;
}

#actions-container {
    width: 100%;
    padding-top: 16px;
    color: black;
    background-color: #FFFFFF;
}

#login-container {
    background-color: white;
}

/* Login page text */

/*.text-span {
    color: white;
}*/

.text-span.bold {
    font-weight: bold;
}

.text-span.large {
    font-size: 36px;
    margin-bottom: 28px;
}

.text-span.medium {
    font-size: 18px;
    margin-bottom: 20px;
}

.text-span.small {
    max-height: 55px;
    font-size: 14px;
    padding-top: 3px;
    padding-bottom: 5px;
    line-height: 18px;
    overflow: hidden;
}

.page-title {
    font-size: 28px;
    line-height: 80px;
    padding-left: 20%;
    vertical-align: middle;
}

#login-page-inner {
    display: flex;
    position: absolute;
    margin-top: -45px;
    margin-left: -550px;
    height: 450px;
    width: 1100px;
    top: 48%;
    left: 50%;
}

    #login-page-inner .column {
        flex: 50%;
        padding: 10px;
        height: 450px;
        position: relative;
    }

.column {
    flex: 50%;
    padding: 10px;
}

.login-icon {
    width: 25px;
    height: 25px;
    display: block;
    cursor: pointer;
    margin-top: 4px;
    margin-right: 10px;
    float: left;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

    .login-icon.user-icon {
        background-image: url("ikonok/belepes.png");
    }

    .login-icon.registration-icon {
        background-image: url("ikonok/regisztracio.png");
    }

    .login-icon.administration-icon {
        background-image: url("ikonok/ugyintezes.png");
    }



#login-title-container {
    margin-left: 16%;
    padding-top: 40px;
}

#login-title {
    font-size: 24px;
    font-weight: bold;
}

#adatok-title-div {
    width: 100%;
    height: 90px;
    font-weight: bold;
    line-height: normal;
    margin-bottom: 0.5rem;
    color: black;
    background-color: #FAFAFA;
}

#adatok-title-span {
    font-size: 24px;
    line-height: 90px;
    vertical-align: middle;
    padding-left: 5%;
}

.registration.title-container {
    margin-left: 16%;
    padding-top: 40px;
    width: 65%;
}

.registration.text-container {
    padding-top: 5px;
    margin-left: 16%;
    margin-bottom: 5px;
    max-height: 85px;
    width: 65%;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.registration.text-span.title-span {
    font-size: 24px;
    color: #fff;
}

.registration.text-container .text-span {
    color: black;
}

#feltetelek-title-div {
    width: 100%;
    height: 90px;
    font-weight: bold;
    line-height: normal;
    color: black;
    background-color: #FAFAFA;
}

#feltetelek-title-span {
    font-size: 24px;
    line-height: 90px;
    vertical-align: middle;
    padding-left: 5%;
}

#terms-of-use-title {
    margin-top: -25px;
    font-size: 20px;
    font-weight: bold;
}

#felteltelek-tartalom-div {
    border: 0px;
    height: 400px;
    max-height: 400px;
    margin: auto;
    display: block;
    overflow-y: scroll;
    word-wrap: break-word;
    background-color: #FAFAFA;
}

#forgotten-password-text {
    max-width: 424px;
    font-size: 14px;
    height: 128px;
    padding: 20px;
    margin: auto;
    color: #8e8e8e;
}

/* Input fields */

.input-container {
    margin: auto;
    margin-top: 30px;
    width: 68%;
    position: relative;
    margin-bottom: .5rem;
}

#registration-container .input-container {
    margin-top: 15px;
}

    #registration-container .input-container .btn {
        width: fit-content;
    }

.input-container.input-group {
    width: 68%;
}

.input-container.select-province {
    margin-top: 15px;
}

/*.input-container.has-province-selector {
    margin-top: 25px;
}*/

.input-container.registration,
.input-container.forgotten-password {
    width: 80%;
}

.input-container.submit-container #loginButton {
    float: left;
    margin-right: 20px;
}

.input-container.submit-container .forgotten-password {
    margin-top: 14px;
    display: inline-block;
}

.registration-column {
    flex: 50%;
    max-height: 88px;
}

.form-control.inputfield {
    padding: 0 20px;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 14px;
    font-weight: normal;
    color: #21211f;
    border-top-left-radius: 0.6em;
    border-bottom-left-radius: 0.6em;
}

.input-container.input-group .form-control.inputfield:not(:focus) {
    background: #e8f0fd;
}

.form-control.inputfield:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: white;
}

.form-control-placeholder {
    position: absolute;
    top: 0;
    padding: 7px 0 0 13px;
    transition: all 200ms;
    font-weight: normal;
    font-size: 14px;
    cursor: auto;
    color: #8e8e8e;
}

.form-control:focus + .form-control-placeholder,
.form-control:read-only + .form-control-placeholder,
.form-control:valid + .form-control-placeholder {
    font-size: 85%;
    padding-bottom: 2px;
    transform: translate3d(0, -100%, 0);
}

/* Tooltip */

.input-group-text .title {
    position: absolute;
    top: 20px;
    background: silver;
    color: black;
    padding: 4px;
    left: 0;
    /*white-space: nowrap;*/
    font-size: 12px;
}

.input-group-text .input-icon {
    width: 16px;
    height: 16px;
    display: block;
    cursor: pointer;
    margin-left: 6px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

    .input-group-text .input-icon.info-tooltip {
        background-image: url("ikonok/info.png");
    }

    .input-group-text .input-icon.eye-open-tooltip {
        background-image: url("ikonok/jelszo_mutat.png");
    }

    .input-group-text .input-icon.eye-close-tooltip {
        background-image: url("ikonok/jelszo.png");
    }

/* Checkbox */

.checkBoxLabel {
    display: block;
    position: relative;
    padding-left: 35px;
    padding-top: 5px;
    margin-bottom: 12px;
    margin-top: 12px;
    cursor: pointer;
    font-size: 15px;
}

    .checkBoxLabel input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 1px;
        width: 1px;
    }

.checkmark {
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    height: 30px;
    width: 30px;
}

    .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

.square-mark {
    border-radius: 0%;
    background-color: darkgray;
    border: 3px solid black !important;
    box-sizing: content-box;
}

.checkBoxLabel input:checked ~ .checkmark:after {
    display: block;
}

.checkBoxLabel .checkmark:after {
    left: 12px;
    top: 7px;
    width: 7px;
    height: 13px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

#reCaptcha-container > div {
    margin: auto;
}

/* News */

#login-page-news {
    display: flex;
    /*position: absolute;*/
    /*margin-top: -45px;
    margin-left: -550px;*/
    height: 250px;
    width: 1000px;
    margin: auto;
    /*top: 48%;
    left: 50%;*/
}

.news-column {
    flex: 33%;
    padding: 10px;
    width: 300px;
}

/* News carousel */

#highlight-news {
    width: 100%;
    height: 160px;
    margin-left: 10px;
    margin-top: .5rem;
}

#registration-container #highlight-news {
    margin-top: 30px;
}

/*.carousel-inner {
    width: 500px;
    height: 150px;
    margin: auto;
}*/

.carousel-item-inner {
    width: 400px;
    height: 120px;
    margin: auto;
    /*line-height: normal;*/
    line-height: 1.6;
}

.highlight-news-title {
    width: 400px;
    font-size: 18px;
    margin-top: 15px;
    margin-bottom: 10px;
    font-weight: bold;
    padding: 0 10px;
}

#registration-container .highlight-news-title {
    color: white;
}

.highlight-news-content {
    width: 400px;
    font-size: 14px;
    overflow: hidden;
    position: relative;
    padding: 0 10px;
}

#registration-container .highlight-news-content {
    color: black;
}

.carousel-indicators li.custom-indicator {
    width: 10px;
    height: 10px;
    border: none;
    background-color: transparent;
    background-size: contain;
}

.carousel-indicators li.custom-indicator {
    background-image: url("ikonok/lapozo_bullet_jeloletlen_baloldal.png")
}

.carousel-indicators li.custom-inindicator.active {
    background-image: url("ikonok/lapozo_bullet_jeloletlen_baloldal.png")
}

.registration-container .carousel-indicators li.custom-indicator {
    background-image: url("ikonok/lapozo_bullet_jeloletlen.png")
}

.registration-container .carousel-indicators li.custom-inindicator.active {
    background-image: url("ikonok/lapozo_bullet_jelolt.png")
}

.carousel-control.carousel-control-custom {
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -15px;
}

    .carousel-control.carousel-control-custom.left {
        left: 10px;
    }

    .carousel-control.carousel-control-custom.right {
        right: 10px;
    }

.custom-chevron {
    width: 20px;
    height: 20px;
    display: block;
    background-color: transparent;
    background-size: contain;
}

    .custom-chevron.custom-chevron-left {
        background-repeat: no-repeat;
        background-image: url("ikonok/lapozo_vissza.png")
    }

    .custom-chevron.custom-chevron-right {
        background-repeat: no-repeat;
        background-image: url("ikonok/lapozo_tovabb.png")
    }

@media screen and (max-width: 1119px) {
    #login-page-inner, #registration-form-background, #forgotten-password-form-background, #terms-of-use-form-background {
        width: 1000px;
        margin-left: -500px;
    }
}

@media screen and (max-width: 1023px) {
    #logo-container {
        padding: 0;
        margin-left: 10%;
        height: 90px;
        width: 184px;
        text-align: center;
    }

    /*.captcha-div { max-height: 70px; }*/

    #reCaptcha-container {
        height: calc(78px * 1.5);
    }

        #reCaptcha-container > div {
            transform: scale(1.5) translateX(calc(-0.25 * 304px * 0.5));
            /*transform: scale(1.3) translateX(-45px);*/
            -webkit-transform: scale(1.5) translateX(calc(-0.25 * 304px * 0.5));
            /*-webkit-transform: scale(1.3) translateX(-45px);*/
            transform-origin: 0 0;
            -webkit-transform-origin: 0 0;
        }

    .page-title {
        padding-left: 10%;
    }

    #login-header {
        left: 10%;
        max-width: 800px;
        width: 80%;
    }

    #registration-form-background {
        display: block;
        width: 95%;
        height: auto;
        left: 2.5%;
        margin: auto;
        margin-top: -195px;
        top: 41%;
    }

    .registration-background-extension {
        height: 110px;
    }

    #terms-of-use-form-background {
        display: block;
        width: 95%;
        height: auto;
        left: 2.5%;
        margin: auto;
        margin-top: -195px;
        top: 41%;
    }

    #forgotten-password-form-background {
        display: block;
        width: 95%;
        height: auto;
        left: 2.5%;
        margin: auto;
        margin-top: -198px;
        top: 41%;
    }

    #action-panel {
        display: block;
    }

    #terms-of-use-title {
        font-size: 28px;
    }

    .terms-of-use-text-container.registration {
        height: 400px;
        font-size: 1.3rem;
    }

    .felteltelek-tartalom-div.registration {
        height: 280px;
    }

    .checkBoxLabel {
        font-size: 24px;
        padding-left: 45px;
    }

    .checkmark {
        width: 35px;
        height: 35px;
        top: 5px;
    }

    .checkBoxLabel .checkmark:after {
        left: 12px;
        top: 6px;
        width: 12px;
        height: 20px;
        border-width: 0 4px 4px 0;
    }

    #login-page-inner {
        display: block;
        width: 95%;
        height: auto;
        top: 47%;
        left: 2.5%;
        margin: auto;
        margin-top: -45px;
    }

    #login-page-background-extension {
        /*background-color: #F4F4F4;*/
        height: 700px;
    }

        #login-page-background-extension.registration-background {
            /*background-color: #F4F4F4;*/
            height: 360px;
        }

            #login-page-background-extension.registration-background.has-terms-of-use {
                height: 760px;
            }

        #login-page-background-extension.forgotten-password-background {
            /*background-color: #F4F4F4;*/
            height: 200px;
        }

    #action-panel {
        margin-bottom: 20px;
    }

    .action .btn.btn-primary {
        width: calc(50% - 20px);
        margin-right: 40px;
        margin-top: 12px;
    }

        .action .btn.btn-primary.submit-button {
            float: left;
        }

    html {
        background-color: #F4F4F4;
    }

    footer {
        width: 60%;
        display: table !important;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        background-color: #F4F4F4;
    }

    #footerSpan1 {
        /*display: block;*/
        padding-bottom: 18px;
    }

    footer .footer-container {
        float: none;
        width: 100%;
        margin: 0 auto 20px;
        text-align: center;
    }

    footer .footerText {
        font-size: 20px;
    }

    footer .cookieLinks {
        float: none;
        width: 100%;
        margin: auto;
        text-align: center;
    }

    footer .cookieLinks {
        float: none;
    }

    /*footer .cookieLink { display: block; }*/

    /* Text sizes */

    .input-container {
        margin-top: 40px;
    }

    .text-span.large {
        font-size: 42px;
    }

    .text-span.medium {
        font-size: 30px;
    }

    .text-span.small {
        font-size: 20px;
        line-height: 24px;
    }

    .page-title {
        font-size: 30px;
    }

    #login-title {
        font-size: 30px;
    }

    .login-icon {
        width: 34px;
        height: 34px;
    }

    #adatok-title-span {
        font-size: 30px;
    }

    #forgotten-password-text {
        font-size: 22px;
        width: 65%;
        max-width: 800px;
    }

    .form-control.inputfield {
        font-size: 24px;
    }

    .form-control-placeholder {
        font-size: 20px;
        padding: 9px 0 0 13px;
    }

    .btn.btn-primary {
        /*margin-top: 0;*/
        font-size: 24px;
        height: 72px;
    }

    select.form-control {
        font-size: 24px;
    }

    .input-container.select-province > span {
        font-size: 24px;
        /*padding: 10px 0 0 13px;*/
    }

    .input-container.has-province-selector {
        margin-top: 40px;
    }

    .input-container.submit-container .forgotten-password {
        margin-left: 30px;
        margin-top: 20px;
        font-size: 20px;
    }


    #login-page-inner .column {
        height: 600px;
    }


        #login-page-inner .column.is-news-on-the-left-side {
            height: 710px;
        }

    .form-control:focus + .form-control-placeholder,
    .form-control:valid + .form-control-placeholder {
        font-size: 20px;
        padding-bottom: 2px;
        transform: translate3d(0, -100%, 0);
    }

    .input-group .input-group-text .glyphicon {
        font-size: 24px;
        padding: 0 3px;
    }

    .tooltip.bs-tooltip-top {
        font-size: 20px;
    }

    .highlight-news-title {
        font-size: 28px;
        width: 100%;
    }

    .highlight-news-content {
        font-size: 22px;
        width: 100%;
    }

    #highlight-news {
        height: 220px;
        margin-top: 1rem;
    }

    .carousel-item-inner {
        height: 225px;
        width: 72%;
    }

        .carousel-item-inner.news-link {
            cursor: pointer;
        }

    .custom-chevron {
        width: 34px;
        height: 34px;
    }

    .registration.text-container {
        max-height: 110px;
    }

    .registration.text-span.title-span {
        font-size: 30px;
    }

    .registration.text-span {
        font-size: 24px;
    }

    .modal-content .modal-header {
        height: 65px;
        padding: 0;
    }

        .modal-content .modal-header .modal-title {
            font-size: 32px;
            position: absolute;
            height: 52px;
            top: 50%;
            margin-top: -22px;
        }

        .modal-content .modal-header button.close {
            font-size: 44px;
            margin-top: -34px;
            top: 50%;
            right: 20px;
        }

    .modal-content .modal-body {
        font-size: 24px;
    }

        .modal-content .modal-body a {
            font-size: 24px;
        }

    .modal-content .modal-footer button.dialogOK {
        height: 40px;
        font-size: 28px;
    }

    .modal-content .modal-footer .btn {
        height: 40px;
        font-size: 28px;
        padding-top: 0;
    }

    .modal-dialog.wide {
        max-width: 800px;
    }
}

@media screen and (max-width: 511px) {
    #login-header {
        top: 50px;
    }

    .text-span.large {
        font-size: 28px;
    }

    .column {
        padding: 0;
    }
}