/* Styles for Index.html for FrideyNet */

main {
    background-color: white;
}

.textBox {
    width: 90%;
    max-width: 1200px;
    text-align: center;
    margin: auto;
}

.textBox table {
    margin: auto;
}

.projects-cont {
    margin: 5px auto 5px auto;
    max-width: 200px;
}

.project-list {
    padding: 15px;
    margin: 5px 0 5px 0;
    background-color: #f8f8f8;
    border: #afafaf 1px solid;
    border-radius: 10px;
}

.project-list:hover {
    border: #c7c7c7 1px solid;
    box-shadow: 0px 0px 2px 0px #f0f0f0;
}

.games {
    background-color: white;
    box-shadow: 0px 5px 8px 0px #363636;
    padding: 0px 10px 0px 10px;
}

.tableLeftAlign {
    text-align: left;
    padding-left: 20px;
}

.mobileText {
    display: none;
}

@media(max-width: 700px) {
    .tableLeftAlign {
        display: none;
    }
    .mobileText {
        display: block;
    }
}

.btnA {
    text-decoration: none;
}

.btnA:hover {
    color: #363636;
}

.discordBTN {
    padding: 10px 20px 10px 20px;
    background: linear-gradient(to bottom right, #cefc8d, #8377d1);
    border-bottom: 5px solid #8377d1;
    border-radius: 10px;
    width: 60px;
}

.discordBTN:hover {
    border-bottom: 3px solid #8377d1;
    margin-top: 2px;
}

.discordBTN:active {
    border-bottom: 1px solid #8377d1;
    margin-top: 4px;
}

.patreonBTN {
    padding: 10px 20px 10px 20px;
    background: linear-gradient(to bottom right, #f7ea00, #e45826);
    border-bottom: 5px solid #e45826;
    border-radius: 10px;
    width: 60px;
}

.patreonBTN:hover {
    border-bottom: 3px solid #e45826;
    margin-top: 2px;
}

.patreonBTN:active {
    border-bottom: 1px solid #e45826;
    margin-top: 4px;
}

.youtubeBTN {
    padding: 10px 20px 10px 20px;
    background: linear-gradient(to bottom right, #ff9d9d, #ff0000);
    border-bottom: 5px solid #ff0000;
    border-radius: 10px;
    width: 60px;
    color: white;
}

.youtubeBTN:hover {
    border-bottom: 3px solid #ff0000;
    margin-top: 2px;
}

.youtubeBTN:active {
    border-bottom: 1px solid #ff0000;
    margin-top: 4px;
}

.twitterBTN {
    padding: 10px 20px 10px 20px;
    background: linear-gradient(to bottom right, #9dfcff, #00f7ff);
    border-bottom: 5px solid #00c3ff;
    border-radius: 10px;
    width: 60px;
    color: black;
}

.twitterBTN:hover {
    border-bottom: 3px solid #00c3ff;
    margin-top: 2px;
}

.twitterBTN:active {
    border-bottom: 1px solid #00c3ff;
    margin-top: 4px;
}

.tiktokBTN {
    padding: 10px 20px 10px 20px;
    background: linear-gradient(to bottom right, #646464, #000000);
    border-bottom: 5px solid #000000;
    border-radius: 10px;
    width: 60px;
    color: white;
}

.tiktokBTN:hover {
    border-bottom: 3px solid #000000;
    margin-top: 2px;
}

.tiktokBTN:active {
    border-bottom: 1px solid #000000;
    margin-top: 4px;
}

.extend {
    margin-top: 75px;
}

main ul {
    list-style: none;
    text-align: left;
}

.archives td {
    padding: 5px 10px 5px 10px;
}

.archivesMiddle {
    border-left: 1px solid #363636;
    border-right: 1px solid #363636;
}

.hidden{
    display: none;
}