@media all {
    @font-face {
        font-family: 'icons';
        font-style: normal;
        font-weight: 400;
        src: local('Material Icons'),
        local('MaterialIcons-Regular'),
        url('../fonts/MaterialIcons-Regular-new.woff2') format('woff2'),
        url('../fonts/MaterialIcons-Regular-new.woff') format('woff'),
        url('../fonts/MaterialIcons-Regular-new.ttf') format('truetype');
    }

    @font-face {
        font-family: 'brands';
        font-style: normal;
        font-weight: 400;
        src: local('brands'),
        local('brands'),
        url('../fonts/brands.woff2') format('woff2'),
        url('../fonts/brands.woff') format('woff'),
        url('../fonts/brands.ttf') format('truetype'),
        url('../fonts/brands.svg#svgFontName') format('svg');
    }
}

.icon {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;  /* Preferred icon size */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
}

* { box-sizing: border-box; user-select: none; }

html,body {
    margin: 0;
    padding: 0;

    width: 100%;
    height: 100%;

    min-width: 100%;
    max-width: 100%;

    min-height: 100%;
    max-height: 100%;

    overflow: hidden;
}

body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-color: #3a3a3a; }

html[lang="hu"] *[_lang="en"] { display: none; }
html[lang="en"] *[_lang="hu"] { display: none; }

/*body {

}*/

button {
    border: none;
    outline: none;
}

h1 { color: var(--primary-heading-color); }
h2 { color: var(--secondary-heading-color); }
h3 { color: var(--tertiary-heading-color); }
h4 { color: var(--quaternary-heading-color); }
p { color: var(--primary-paragraph-color); }

.modal.lightbox {
    position: fixed;
    top:0;
    left: 0;
    z-index: 50;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(0.2rem);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(64,64,64,0.85);
}

.modal > .content {
    padding: 2rem 3rem;
    border-radius: 0.5rem;
    background-color: #fefefe;
    min-width: 20rem;
    max-height: calc(100% - 4rem);
    overflow-y: auto;
}

button {
    position: absolute;
    padding: 1rem 2rem;
    border-radius: 0.6rem;
    bottom:3rem;
    right:2rem;
    font-size: 1.2rem;
    font-weight: 400;
    letter-spacing: 0.1rem;
    background-color: rgba(0,0,0,0.5);
    color: whitesmoke;
}

button span { vertical-align: middle; }
button span:first-child { margin-right: 1rem; }