:root {
    --blue: #000b35;
    --red: #340000;
    --black:#000000;
    --white: #ffffff;
    --text-black: #636363;
    --text-white: #cecece;
}

@font-face {
    font-family: roboto;
    src: url('../font/Roboto-Regular.ttf');
    font-display: swap;
}

html, body  {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #fff;
    scroll-behavior: smooth;
}

*{
    text-decoration: none;
    font-family: roboto, sans-serif;
    list-style-type: none;
}

.limit{
    width: calc(100% - 60px);
    max-width: calc(1100px - 60px);
    padding: 0 30px;
}

.dark{
    color: var(--text-white) !important;
    background-image: linear-gradient(to right, rgba(0, 11, 53, 0.99) 10%, rgba(52, 0, 0, 0.95) 90%), url("../img/slide3.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.center{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

[data-anime="left"] {
    opacity: 0 !important;
    transform: translate3d(-150px, 0, 0) !important;
}

[data-anime="right"] {
    opacity: 0 !important;
    transform: translate3d(150px, 0, 0) !important;
}

[data-anime="top"] {
    opacity: 0;
    transform: translate3d(0, -150px, 0) !important;
}

[data-anime="bottom"] {
    opacity: 0;
    transform: translate3d(0, 150px, 0) !important;
}

[data-time="1"] {
    transition: 1s ease-in-out !important;
}

[data-time="1.5"] {
    transition: 1.5s ease-in-out !important;
}

[data-time=".3"] {
    transition: .3s ease-in-out !important;
}

[data-time=".5"] {
    transition: .5s ease-in-out !important;
}

[data-time=".7"] {
    transition: .7s ease-in-out !important;
}

[data-anime].animate {
    opacity: 1 !important;
    transform: translate3d(0, 0, 0) !important;
}