/* Base styles */
body {
    background-color: #00C6C1;
}

header {
    grid-column: 1/span 3;
    grid-row: 2;
    width: fit-content;
    line-height: 6vw;
}

p {
    color: #ffffff;
}

a {
    color: #f4f0e9;
    text-decoration: underline;
    cursor: pointer;
}

.dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ffffff;
    opacity: 0.4;
    transition: opacity 0.3s ease;
    cursor: none;
}

.menu {
    color: #ffffff;
}

.menu li a {
    color: #ffffff;
}

.informations {
    background-color: #00C6C1;
    color: #ffffff;
}

.colorcircle {
    color: #ffffff;
}

.circle1 { background-color: #1E1E1E; border: 2px solid #ffffff; }
.circle2 { background-color: #FFAA4D; border: 2px solid #ffffff; }
.circle3 { background-color: #00C6C1; border: 2px solid #ffffff; }

.text-overlay {

    color: #ffffff !important;
}

.contact, .mywork, .informations {
    background-color: #00C6C1;
    color: #ffffff;
}