@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700,800,900');

:root {
    --header-height: 50px;

    /*--text-color-body: #ffffff;*/
    /*--text-color-body-rgb: 255, 255, 255;*/
    --text-color-body: rgb(247, 215, 149);
    --text-color-body-rgb: 255, 255, 255;

    --font-family-global: Poppins, serif;
    --font-size-medium: 1rem;
    --font-size-small: 0.75rem;
    --font-size-large: 1.5rem;
    --font-size-xlarge: 3rem;

    --body-color: rgb(20, 20, 20);
    --body-color-darker: rgb(0, 0, 0);
    --body-color-lighter: rgb(69, 69, 69);
    --body-color-light: rgb(225, 225, 225);

    --body-color-rgb: 20, 20, 20;
    --body-color-darker-rgb: 0, 0, 0;
    --body-color-lighter-rgb: 69, 69, 69;
    --body-color-light-rgb: 225, 225, 225;

    --box-shadow-global: 0px 0px 5px rgba(0, 0,0, 50%);

    --swiper-pagination-color: rgba(255, 255, 255, 1);
    --swiper-pagination-bullet-inactive-color: rgba(0, 0, 0, 1);
    --swiper-pagination-bullet-inactive-opacity: 1;

    --bs-body-line-height: normal;

    /*color-scheme: dark;*/
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'PT Sans', sans-serif;
    scroll-behavior: smooth;
    scroll-margin-top: var(--header-height);
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

*:focus:not(:focus-visible){
    outline: none;
}

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    background: var(--body-color);
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
}

a {
    text-decoration: none;
}

li {
    list-style: none;
}

/*input:-webkit-autofill {*/
/*    -webkit-box-shadow: 0 0 0 1000px var(--body-color) inset !important;*/
/*    -webkit-text-fill-color: var(--text-color-body) !important;*/
/*    caret-color: var(--text-color-body) !important;*/
/*}*/

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(var(--text-color-body-rgb), .5);
    /*transition: background-color 5000s ease-in-out .5s;*/
    box-shadow: inset 0 0 20px 20px rgba(var(--body-color-darker-rgb), .5);
    caret-color: var(--text-color-body);
    /*transition-duration: .5s;*/
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
/*input[type=number] {*/
/*  -moz-appearance: textfield;*/
/*}*/

* {
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
    scroll-behavior: smooth;
}

html.sr .load-hidden {
    visibility: hidden;
}

ul {
    list-style: none;
}

body {
    width: 100vw;
    overflow-x: hidden;
}

body.modal-open {
    /*position: fixed;*/
    overflow: hidden;
}

body.modal-open .header {
    display: none;
}

body.modal-open .scrollup {
    display: none;
}

button {
    cursor: pointer;
}

img, button, .swiper, i, a {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;

    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    filter: drop-shadow(var(--box-shadow-global));
}

.main {
    display: grid;
}

.header a {
    /*text-transform: uppercase;*/
    font-family: var(--font-family-global);
}

.header {
    top: calc(-100%);
    /*height: var(--header-height);*/
    position: fixed;
    width: 100vw;
    z-index: 100;
    background-color: var(--body-color);
    /*border: 1px solid var(--body-color-darker);*/
    box-shadow: var(--box-shadow-global);
    /* border-radius: 1rem 1rem 0 0; */
    transition: .5s;
    overflow: hidden;
}

.header nav {
    display: grid;
    justify-content: center;
    /*grid-template-columns: repeat(auto-fit, 100px);*/
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: var(--header-height);
    height: var(--header-height);
    background-color: var(--body-color);
}

.header nav ul {
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;

    margin: 0;
    padding: 0;
}

/*.header nav ul:nth-child(1) {*/
/*    justify-self: start;*/
/*}*/

.header nav ul li {
    /*margin: .75rem;*/
    list-style-type: none;
    margin: .5rem;

    display: grid;
    justify-content: center;
    align-items: center;
}

.header nav ul li button {
    border: none;
    background: none;
    font-family: var(--font-family-global), serif;
}

.header nav .menu {
    display: none;
}

.header nav ul li a,
.header nav ul li button {
    color: rgba(var(--text-color-body-rgb), .5);
}

.header nav ul li a:hover,
.header nav ul li button:hover {
    color: rgba(var(--text-color-body-rgb), 1);
}

.header nav ul li a img {
    height: calc(var(--header-height)/2)
}

.footer {
    background-color: rgba(var(--body-color-darker-rgb), .25);
    /*border: 1px solid var(--body-color-darker);*/
    box-shadow: var(--box-shadow-global);
    color: var(--text-color-body);
    z-index: 90;
    position: relative;
    font-family: var(--font-family-global), serif;
    padding: 5rem;
    margin-top: 5rem;
    overflow: hidden;
}

/*.footer .container {*/
/*    display: grid;*/
/*    grid-template-columns: 1fr 3fr;*/
/*}*/

.footer .container .sections {
    /*display: grid;*/
    /*grid-template-columns: repeat(auto-fit, 300px);*/
    display: flex;
    flex-wrap: wrap;
    column-gap: 100px;
    row-gap: 100px;
    justify-self: center;
    /*align-items: center;*/
}

.footer ul li {
    /*background-color: rgba(var(--body-color-darker-rgb), .25);*/
    padding: 0 1rem;

    font-family: var(--font-family-global), serif;
}

.footer span {
    display: block;
    position: relative;
    font-size: var(--font-size-small);
    width: fit-content;
    margin: .5rem;

    font-family: var(--font-family-global), serif;
    text-wrap: nowrap;
    color: var(--body-color-light);
}

.footer .container .section .title {
    font-family: var(--font-family-global), serif;
}

.footer .container .section ul li a,
.footer .container .section ul li button {
    color: rgba(var(--text-color-body-rgb), .5);
    font-family: var(--font-family-global), serif;
}

.footer .container .section ul li a:hover,
.footer .container .section ul li button:hover {
    color: rgba(var(--text-color-body-rgb), 1);
}

.footer .container .section ul li a i {
    font-size: var(--font-size-large);
    margin: .5rem;
}

.footer .container .copy-wrapper {
    margin-top: 50px;
}

.sectionLine {
    background-color: rgba(var(--body-color-light-rgb), .5);
    width: 90%;
    place-self: center;
    height: 1px;

    margin: 50px 0 50px 0;
}

.showHeader {
    top: 0;
}

.show-menu {
    /*top: 500px;*/
}

.scrollup {
    position: fixed;
    right: 1rem;
    bottom: -30%;
    background-color: var(--body-color);
    /*box-shadow: 0 4px 12px hsla(207, 24%, 35%, 15);*/
    /*box-shadow: 0px 0px 4px grey;*/
    display: inline-flex;
    padding: .5rem;
    border-radius: .25rem;
    font-size: 1.1rem;
    color: var(--body-color-light);
    z-index: 100;
    transition: bottom .3s, transform .3s;
    animation: popup infinite 1s;
}

.scrollup:hover {
    /*transform: translateY(.25rem);*/
    animation-play-state: paused;
    color: var(--body-color-light);
    /*box-shadow: 0px 0px 2px rgba(0, 0, 0, 50%);*/
}

/* Show Scroll Up*/
.show-scroll {
    bottom: 2rem;
}

@keyframes popup {
    0% {
        transform: translateY(0rem);
    }

    50% {
        transform: translateY(.25rem);
    }
    100%{
        transform: translateY(0rem);
    }
}

::-webkit-scrollbar {
    /*display: none;*/
    width: .5rem;
    border-radius: .5rem;
    /*background-color: rgba(var(--body-color-darker-rgb), .25);*/
}

::-webkit-scrollbar:hover {
    /*width: .5rem;*/
    /*border-radius: .5rem;*/
    background-color: var(--body-color-lighter);
}

::-webkit-scrollbar-thumb {
    background-color: var(--body-color-light);
    border-radius: .5rem;
}

/*Hidden menu*/
@media screen and (max-width: 950px) {
    .header nav {
        grid-template-columns: 1fr 1fr;
    }

    .header nav ul:nth-child(3) {
        position: fixed;
        top: -200%;
        z-index: -1;
        width: 100%;
        background-color: var(--body-color);
        opacity: 1;
        transition: all .5s allow-discrete;
        flex-direction: column;
        padding: 0;
        box-shadow: var(--box-shadow-global);
        /*border: 1px solid var(--body-color-darker);*/
    }

    .header nav ul:nth-child(3) li {
        margin: 1rem;
        display: flex;
        flex-direction: column;
        align-items: center;

        /*box-shadow: var(--box-shadow-global);*/
        /*border: 1px solid var(--body-color-darker);*/
    }

    .show-menu nav ul:nth-child(3) {
        top: 50px;
    }

    .header nav .menu {
        display: flex;
    }
}
