* {
    margin: 0;
    padding: 0;
    font-family: Play;
}

h1 {
    text-align: center;
}

.dissappear {
    display: none;
}


img {
    width: 100%;
    height: 100%;
}

body {
    padding-top: 60px;
}


a {
    text-decoration: none;
}

main {
    margin-top: 0px;
}

.content p {
    text-align: center;
    margin-top: 50px;
    font-size: 1.1rem;
}

.content h2 {
    margin-top: 50px;
    text-align: center;
}

.content h3 {
    text-align: center;
    font-size: 1.5rem;
    margin-top: 50px;
    margin-left: 10px;
    margin-right: 10px;
    color: white;
    background-color: rgba(194, 88, 13, 0.751);
    padding: 10px;
    box-shadow: 1px 1px 5px black;
}

.maintenance-section {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.maintenance-grid {
    display: grid;
    grid-template-columns: 600px 600px;
    justify-content: space-evenly;
    align-items: top;
    text-align: center;
    row-gap: 50px;
    column-gap: 50px;
    max-width: 1500px;
}


.button {
    text-align: center;
    background-color: green;
    color: white;
    padding: 30px;
    cursor: pointer;
    box-shadow: 1px 1px 10px black;
    font-size: large;
    transition: background-color, 0.2s;
    transition: color, 0.2s;
    transition: box-shadow, 0.2s;
}

.button:hover {
    background-color: white;
    color: black;
    box-shadow: 0px 0px 10px rgb(207, 207, 207);
}

.button:active {
    background-color: rgb(220, 220, 220);
}

.desc {
    text-align: left;
    margin: 0;
}

.footer-title {
    text-align: center;
    margin-top: 40px;
}


@media (max-width:1231px) {
    .maintenance-grid {
        grid-template-columns: 400px 400px;
    }
}

@media (max-width:850px) {
    .maintenance-grid {
        grid-template-columns: 400px;
    }
}


@media(max-width:500px) {
    .underlines::before {
        right: 99%;
    }
    .underlines::after {
        left: 99%;
    }
}

@media (max-width:400px) {
    .maintenance-grid {
        grid-template-columns: 300px;
    }
}

@media (max-width:387px) {
    .underlines::before {
        right: 70%;
    }
    .underlines::after {
        left: 104%;
    }
}