@font-face {
    font-family: 'Chomsky';
    src: url('Chomsky.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
}

body {
    padding-left: 5%;
    padding-right: 5%;
    background-color: #f9e2c3;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 15 px;
    color: #24211D;
}

.Head {
    font-size: 90px;
    display: flex;
    justify-content: center;
    font-family: 'Chomsky';
    margin-top: 0;
    margin-bottom: 5px;
    color: #24211D;
}

.p {
    font-family: 'Chomsky', monospace;
    font-size: 30px;

}

nav {
    display: flex;
    justify-content: center;
    gap: 100px;
    font-size: 15px;
}

nav a {

    font-size: 15px;
    text-decoration: none;
    color: #24211D;
    text-align: center;
    font-weight: bold;
}

/* Faded ink color for later if needed #625C53, red accent #9B3434,  */

.corner-image {
    position: absolute;
    top: -300px;
    left: -150px;
    width: 300px;
    z-index: 0;
    opacity: 0.5;
    transform: rotate(-1deg);
}

.right-image {
    position: absolute;
    top: 190px;
    right: 0px;
    width: 150px;
    z-index: 0;
    opacity: 0.6;
    transform: rotate(0deg);
}

.bottom-image {
    position: absolute;
    bottom: -20px;
    left: -120px;
    width: 300px;
    z-index: 0;
    opacity: 0.5;
    transform: rotate(-6deg);
}

.corner-image2 {
    position: absolute;
    top: -300px;
    left: -150px;
    width: 300px;
    z-index: 0;
    opacity: 0.4;
    transform: rotate(-1deg);
}

.right-image2 {
    position: absolute;
    top: 190px;
    right: 0px;
    width: 150px;
    z-index: 0;
    opacity: 0.5;
    transform: rotate(0deg);
}

.bottom-image2 {
    position: absolute;
    bottom: -20px;
    left: -120px;
    width: 300px;
    z-index: 0;
    opacity: 0.4;
    transform: rotate(-6deg);
}

.corner-image3 {
    position: absolute;
    top: -300px;
    left: -150px;
    width: 300px;
    z-index: 0;
    opacity: 0.3;
    transform: rotate(-1deg);
}

.right-image3 {
    position: absolute;
    top: 190px;
    right: 0px;
    width: 150px;
    z-index: 0;
    opacity: 0.4;
    transform: rotate(0deg);
}

.bottom-image3 {
    position: absolute;
    bottom: -20px;
    left: -120px;
    width: 300px;
    z-index: 0;
    opacity: 0.3;
    transform: rotate(-6deg);
}

.corner-image4 {
    position: absolute;
    top: -300px;
    left: -150px;
    width: 300px;
    z-index: 0;
    opacity: 0.2;
    transform: rotate(-1deg);
}

.right-image4 {
    position: absolute;
    top: 190px;
    right: 0px;
    width: 150px;
    z-index: 0;
    opacity: 0.3;
    transform: rotate(0deg);
}

.bottom-image4 {
    position: absolute;
    bottom: -20px;
    left: -120px;
    width: 300px;
    z-index: 0;
    opacity: 0.2;
    transform: rotate(-6deg);
}





.newspaper-area {
    display: grid !important;
    grid-template-columns: 1fr .5fr !important;
    gap: 50px !important;
    margin: 60px auto;
}

.main-container {
    padding: 25px;
    min-height: 300px;
    box-sizing: border-box;
    border: .5px solid #24211D;


}

.secondNav-header {
    font-size: 20px;
    margin-bottom: 30px;
}

.secondNav-container {
    padding: 25px;
    min-height: 300px;
    box-sizing: border-box;
    border: 1px solid #24211D;

}

.the-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.info-card {
    border: 1px solid #24211D;
    padding: 25px;
    text-decoration: none;
    color: #24211D;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    transition: 0.2s ease;

}

.info-card:hover {
    transform: translateY(-4px);


}

.info {
    font-size: 16px;
}



.challenge-title {
    font-size: 26px;
    font-weight: bold;
}

.enter-button {
    font-weight: bold;
}

.intro {
    font-size: 17px;
}

.challenge-section {
    margin-top: 80px;
    margin-bottom: 80px;
}