.container {
    position     : absolute;
    top          : var(--white-border);
    bottom       : var(--white-border);
    left         : var(--white-border);
    right        : var(--white-border);
    background   : var(--main-bg);
    border-radius: var(--border-radius);
    overflow     : hidden;
}

section {
    background-color: black;
    overflow        : hidden;
    height          : 100vh;
}

section#home {
    background-color: #150136;
}

section#services {
    background-color: #fbc059;
    padding         : 50px;
}

section#folio {
    background-color: #504377;
    padding         : 50px;
}

header,
footer {
    position  : fixed;
    left      : 0;
    right     : 0;
    background: var(--color-white);
    z-index   : 10;
    padding   : 10px;
    text-align: center;
}

header {
    top               : 0;
    display           : flex;
    justify-content   : center;
    align-items       : center;
    /* gap            : 2rem; */
    height            : var(--white-border);
    overflow          : hidden;
}

footer {
    font-family    : Arial, Helvetica, sans-serif;
    bottom         : 0;
    height         : var(--white-border);
    display        : flex;
    justify-content: center;
    align-items    : center;
    font-size      : 0.75rem;
    color          : #5e5e5e;
}

nav img {
    /* vertical-align: middle; */
    position: relative;
    width   : 50px;
    height  : auto;
    top     : 6px;
}

nav a,
nav a:hover,
.active {
    transition: all 0.42s ease-in;
}

nav a {
    text-decoration: none;
    color          : #c3d0df;
    font-weight    : 400;
    padding        : 0 2rem;
    border-radius  : 20px;
    border         : 1px solid rgba(0, 0, 0, 0);
}

nav a:hover {
    color      : var(--hover-color);
    font-weight: 400;
    border     : 1px solid rgba(0, 0, 0, .5);
}

.active {
    color        : rgb(56, 56, 56);
    font-weight  : 400;
    border-radius: 20px;
    border       : 1px solid rgb(87, 87, 87);
    width        : 250px;
    background   : transparent;
}



/*-----------------------------------------------------------------*/

@media (max-width: 768px) {

    #myVideo,
    html {
        display: none;
    }

    .video-section {
        background-image   : url('../assets/imgs/mini_logo.png');
        background-size    : contain;
        background-position: center;
    }
}

p {
    padding: 0 0;
}