/*** Keyframes ***/
@keyframes flicker1 {
    0%, 2%, 8%, 12%, 16%, 20%, 24%, 28%, 32%, 36%, 40%, 44%, 48%, 52%, 56%, 60%, 64%, 68%, 72%, 76%, 80%, 84%, 88%, 92%, 96% { color: #9237E5FF; }
    4%, 6%, 10%, 14%, 18%, 22%, 26%, 30%, 34%, 38%, 42%, 46%, 50%, 54%, 58%, 62%, 66%, 70%, 74%, 78%, 82%, 86%, 90%, 94%, 98% { color: black; }
    100% { color: #9237E5FF; }
}
/* Apply flicker animation */
.flicker1 {
    animation: flicker1 1s 0s;
}

/*** Font Styles ***/
* {
    font-family: "Ubuntu Mono", monospace;
    color: white; /* Default text color */
    margin: 0;
    padding: 0;
}
p,
a,
strong {
    font-size: 18px;
    padding-bottom: 18px;
}
a {
    text-decoration: underline;
}
a:hover,
a:focus,
a:active {
    text-decoration: none;
}
#email a {
    font-size: 18px;
    font-weight: bold;
    color: #9237E5FF; /* Email link color */
    line-height: 26px;
}
address {
    font-style: normal;
}

/*** Layout ***/
body {
    background-color: #2E2E2E; /* Body background color */
    text-align: center;
}
section {
    position: relative;
    margin: 0 auto;
    width: 700px;
    height: auto;
    padding-top: 50px; /* Space from top */
}
footer {
    margin-top: 15px;
    height: 50px;
    text-align: right;
}

/*** Content Layout ***/
#email,
#underconstruction {
    display: none; /* Hide email and under construction sections */
}

/*** Miscellaneous ***/
.animate-flex {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100% !important;
    width: auto !important;
    display: inline-block !important;
    box-sizing: border-box;
    padding-bottom: 20px !important;
}
.animate-box {
    position: relative;
    height: 600px !important;
}

/*** Responsive ***/
@media handheld, only screen and (max-width: 900px) {

    section {
        padding-top: 150px;
        margin:0 auto;
        width: 90%;
    }
    p,
    #email a {
        font-size: 15px; /* Increase font size for smaller screens */
    }
    .animate-box {
        position: relative;
        height: 350px !important;
    }
}
