body {
    margin: 0px;
    overflow-x: hidden;

    --black: #111;
    --blue: #0073BD;
    --header-green: #62C73E;
    --green: #139A15;
    --show-speed: ease;

    font-family:Arial, Helvetica, sans-serif;

    background-color: #fff;
}
a {
    text-decoration: none;
    color: #fff;
}
a:hover {
    color: #ddd; 
}


.none {
    display: none;
}
.none-size {
    width: 0px;
    height: 0px;
}
.full-size {
    width: 100%;
    height: 100%; 
}

.f {
    display: flex;
}
.f.dir-row {
    flex-direction: row;
}
.f.dir-col {
    flex-direction: column;
}
@media screen and (max-width : 800px) {
    .f.adap {
        flex-direction: column;
    }
    .f.adap > :first-child {
        margin-right: 0px !important;
    }
    .f.adap > :not(:first-child) {
        margin-top: 15vw !important;
        margin-right: 0px !important;
        margin-left: 0px !important;
    }
}


.f.right {
    justify-content: flex-end;
}
.f.left {
    justify-content: flex-start;
}
.f.dir-col.right {
    align-items: flex-end;
}
.f.dir-col.left {
    align-items: flex-start;
}
.f.bottom {
    align-items: flex-end
}
.f.top {
    align-items: flex-start
}

.p-abs {
    position: absolute;
}
.bg {
    position: absolute;
    z-index: -1;
}
.bg2 {
    position: absolute;
    z-index: -2;
}
.p-rel {
    position: relative;
}

.center {
    justify-content: center;
    align-items: center;
}
.center-h {
    align-items: center;
}
.center-v {
    justify-content: center;
}
.center-text {
    text-align: center;
}

.button {
    display: flex;
    justify-content: center;
    align-items: center;
}
.sub-button {
    display: flex;
    align-items: center;
    padding-left: 25px;
}

.section-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.sec-margin {
    margin-top: 100;
}
.margin-bottom {
    margin-bottom: 200;
}

.hover-show div {
    visibility: hidden;
}
.hover-show:hover div {
    visibility: visible;
}

.title {
    font-size: 40px !important;
}
.title2 {
    font-size: 60px !important;
}
.title3 {
    font-size: 87px !important;
}
@media screen and (max-width : 600px) {
    .title {
        font-size: 25px !important;
    }
    .title2 {
        font-size: 40px !important;
    }
    .title3 {
        font-size: 55px !important;
    }
}
@media screen and (max-width : 350px) {
    .title {
        font-size: 15px !important;
    }
    .title2 {
        font-size: 30px !important;
    }
    .title3 {
        font-size: 40px !important;
    }
}

.anim-all {
    transition: all 1s ease;
}

.hide {
    opacity: 0;
    scale: 0.97;
    
}
.h-anim:not(.block-text-3d) {
    transition: opacity 0.5s var(--show-speed), scale 0.5s var(--show-speed);z-index: -5;
}