@import url('https://fonts.googleapis.com/css2?family=Signika:wght@300..700&display=swap');

/* === CONFIG === */
:root {
    --header-color: rgb(41, 41, 71);
    --main-bg-color: #FFF;
    --colorA: rgb(36, 52, 77);
    --colA: 36, 52, 77;
    --colB: 255,140,0;
    --colN: 51, 51, 51;
    --colAfont: 255,255,255;
    --colBfont: 0,0,0;
}
/* === FRAMEWORK === */
body {
    font-family: "Signika", sans-serif;
    margin: 0;
    background: #f7f7f7;
    color: #333;
    font-size: clamp(17px, 1.3vh,30px);
}
main {
    padding: 2rem;
    min-height: calc(100vh - 180px - 180px);
}
header {
    background-color: rgb(var(--colA));
    padding: 2rem;
    color: #FFF;
}
header > img {
    width: 100%;
    filter: brightness(200%) contrast(100%);
    opacity: 0.5;
}
footer {
    background-color: black;
    color: #FFF;
    padding: 2rem;
}
/* === BASIC ELEMENTS === */
a {
    color: inherit;
}
img[src="/img/logo/q-white.svg"]{
    padding: 10px;
    filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
}
img[src$=".svg"] {
    box-shadow:none !important;
}
img {
    max-width: 100%;
}
.submenu a {
    background-color: rgb(var(--colA));
    color: rgb(var(--colAfont));
    padding: 0.3em 0.5em;
    border-radius: 0.3em;
    white-space: nowrap;
    line-height: 2em;
}
.submenu a.act {
    /* text-decoration: underline; */
    background-color: rgb(var(--colB));
}

/* === CITY SELECT === */
.citysel, .citysel select {
    border-top: #FFFFFF7F 1px solid;
    margin-top: 0.5em;
    font-size: 3vh;
}

/* === DECORATION === */
.gold {
    background: linear-gradient(135deg, rgb(255, 174, 0) 0%, #FA0 25%, #FFF 50%, #FA0 75%, #FA0 100%);
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5), inset -1px -1px 1px rgba(0, 0, 0, 0.4), inset 1px 1px 1px rgba(255, 255, 255, 0.4);
}

.silver {
    background: linear-gradient(135deg, #AAA 0%, #BBB 30%, #FFF 50%, #BBB 70%, #AAA 100%);
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5), inset -1px -1px 1px rgba(0, 0, 0, 0.4), inset 1px 1px 1px rgba(255, 255, 255, 0.4);
}

.bronze {
    background: linear-gradient(135deg, #F80 0%, #F80 30%, #FFF 50%, #F80 70%, #F80 100%);
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5), inset -1px -1px 1px rgba(0, 0, 0, 0.4), inset 1px 1px 1px rgba(255, 255, 255, 0.4);
}