@charset "utf-8";
@import url('./header_menu.css');


header {
    --calcHeaderHeight: calc(var(--fontSize) * var(--setCalcMinHeaderFactor));
    font-family: var(--mainFont);
    background-image: var(--headerBGImage);
    background-color: var(--colorDrkGrey);
    background-repeat: var(--repeateBg);
    backdrop-filter: var(--bgBlur);
    -webkit-backdrop-filter: var(--bgBlur);
    background-position-x: var(--headerBGPosX);
    background-position-y: var(--headerBGPosY);
    background-size: var(--headerBGSize);
    box-shadow: var(--boxShadow);
    color: var(--colorLgtGrey);
    width: var(--maxWidth);
    position: var(--posFixed);
    height: var(--calcHeaderHeight);
    text-align: var(--headerAlign);
    top: var(--headerTop);
    margin: var(--noMarginPadding) var(--centerMargin);
    display: var(--displayBlock);
    overflow: var(--overflowHidden);
    user-select: var(--userSelect);
    -webkit-user-select: var(--userSelect);
    -moz-user-select: var(--userSelect);
    z-index: 150;
}

header :is(.containerHeader, .containerHeader:hover, .containerHeader:active, .containerHeader:focus, .containerHeader:target) {
    text-decoration: var(--textDecoNo);
    opacity: var(--opacityFull) !important;
    cursor: unset !important;
}

.headerText {
    text-align: var(--headerAlign);
    left: 3.5em;
    position: relative;
}

.headerText h3 {
    position: var(--posRelative);
    top: var(--headerTopH3) !important;
    line-height: var(--headerLineHeight);
}

header h1::before {
    content: var(--headerH1) !important;
}

header h3::before {
    content: var(--headerH3) !important;
}

menu dialog.Info {
    display: var(--displayBlock);
}

menu dialog.Info {
    display: var(--displayBlock);
    background-color: transparent;
    border-color: transparent;
    padding: var(--noMarginPadding);
    margin: var(--noMarginPadding);
}

header h1,
header h3,
header h4 {
    font-size: 1.5em !important;
    top: .65em;
    position: relative;
}

header .containerHeader h1 {
    background-image: url(../img/CMovie.svg);
    background-size: 4em;
    background-repeat: no-repeat;
    padding-left: 4em;
    position: fixed;
    height: 1em;
    top: .45em;
}

#results #pagination button {
    position: fixed;
    top: 8.5em !important;
    font-family: 'OCR A Std';
    color: #ffffff;
    z-index: 100;
}

header #search {
    font-family: 'OCR A Std';
    margin: unset;
    padding: unset;
    position: unset;
    margin-top: unset;
    padding-top: unset;
    width: unset;
    overflow: unset;
    height: unset;
    backdrop-filter: unset;
    background-color: unset;
    background-image: unset;
    transition: unset;
    z-index: 10;
}

header h3::before,
header h4::before {
    content: "" !important;
}

@media screen and (min-width: 980pt) {
    header h1::before {
        content: var(--headerH1) !important;
    }

    .searchbar {
        left: 20px !important;
        position: relative;
    }

    .ion-ios-search:before {
        left: -15px;
        top: -.5em !important;
    }
}

@media screen and (min-width: 673pt) and (max-width: 980pt) {
    header h1::before {
        content: var(--headerH1Small) !important;
    }
}

@media screen and (max-width: 673pt) and (min-width: 553pt) {
    header h1::before {
        content: var(--headerH1XSmall) !important;
    }
}

@media screen and (min-width: 413pt) and (max-width: 553pt) {
    header h1::before {
        content: var(--headerH1XXSmall) !important;
    }
}

@media screen and (max-width: 413pt) {
    header h1::before {
        content: "" !important;
    }

    .navbar {
        width: calc(100vw - 9.5rem) !important;
    }
}