/* All Elements */

/* * {
    cursor: none;
} */
::selection {
    background-color: #3ab548;
    color: white;
}

body {
    font-family: Helvetica Neue;
    overflow-x: hidden;
}

.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

a {
    text-decoration: none;
    color: inherit;
}

/* images Elements */
.links {
    position: relative;
}

.image_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.pics {
    width: 1200px;
    margin: 10px;
    transition: filter 0.3s;
}

.links:hover .pics {
    filter: brightness(0.4);
}

.image_text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 75px;
    visibility: hidden;
    transition: visibility 0.1s;
}

.image_text_date {
    font-size: 20px;
}

.links:hover .image_text {
    visibility: visible;
}

/* Body Elements */

h1 {
    text-align: center;
    font-size: 60px;
    font-weight: 400;
    font-family: helvetica, sans-serif;
}

h2 {
    text-align: center;
    font-family: helvetica, sans-serif;
    font-size: 22px;
    font-style: normal;
    font-weight: 300;
    line-height: 28px;

}

.title_2_container {
    position: relative;
    margin: 100px;
    margin-top: 100px;
    height: 50px;

}

.disc_container {
    position: relative;
    margin: 100px auto;
    margin-top: 100px;
    width: 800px;
}



/* Animation */
.click_shape {
    position: absolute;
    width: 0;
    height: 0;
    border-radius: 50%;
    background-color: #3ab548;
    animation: circleAnimation 10s cubic-bezier(.3, .3, .75, 1) forwards;
    transform: translate(-50%, -50%);
    animation-fill-mode: forwards;
    z-index: 10;
}


@keyframes circleAnimation {
    0% {
        width: 0;
        height: 0;

    }

    100% {
        width: 40000px;
        height: 40000px;

    }
}

.click-animation {
    animation-play-state: running;

}