@import url(player.css);
@import url(headerandfooter.css);
@import url(default.css);

/*Page buttons*/
.page-button { 
    background-color: black; 
    color: red; 
    border-color: red; 
    border: 5px; 
    height: 50px; 
    min-width: 70px; 
    cursor: pointer; 
    font-size: 20px; 
    margin-right: 3.5px; 
    margin-left: 3.5px; 
    font-weight: bold; 
    transition: background-color 0.25s; 
}
.page-button:hover { 
    background-color: red; color: black; 
    border-color: rgb(120,0,0); 
} 
.page-button:active { 
    opacity: 0.6 
}
/*boxes*/
.textbox { 
    width: 1238px;
    border: 5px solid red; 
    background-color: black; 
    margin-left: auto;
    margin-right: auto;
    margin-top: 80px;
    margin-bottom: 80px;
    padding: 25px; 
    text-align: center; 
} 
.section-box { 
    width: 1100px; 
    height: 100%; 
    border: 5px solid red; 
    margin-bottom: 60px; 
    font-size: 18px; 
    padding: 50px; 
    background: black; 
    margin-left: auto; 
    margin-right: auto; 
    text-align: center; 
    display: block;
    box-sizing: border-box;
}
.box-list { 
    font-size: 20px; 
    padding-top: 5px; 
    padding-bottom: 5px; 
}
.in-box-image { 
    border: 5px solid red; 
    display: inline-block; 
    max-width: 1000px; 
    margin-left: 100px; 
    margin-right: 100px; 
}
/*tables*/
.table-logs { 
    width: 60%; 
    border: 3px solid red; 
    font-size: 20px; 
    margin-top: 25px; 
    margin-bottom: 25px; 
    text-align: center; 
    position: relative; 
    padding: 7px; 
}
.row1 { 
    background: rgb(56,4,0); 
    padding: 10px; 
    border: 2px solid red; 
}
/*texts*/
.introductory-text { 
    width: 800px;
    font-size: 20px; 
    text-align: center; 
    margin-left: auto; 
    margin-right: auto; 
}
.small-text { 
    font-size: 20px; 
    text-align: center; 
    margin: 20px; 
    max-width: 700px; 
}
.larger-in-box-text { 
    font-size: 30px; 
    font-weight: bold; 
    text-align: center; 
}
.in-box-text { 
    max-width: 1060px; 
    margin-left: 455px; 
    margin-right: 14px; 
}
.subtitle-text { 
    Font-weight: bold; 
    margin-top: 5px; 
    margin-bottom: 40px; 
    font-size: 25px 
} 
.body-text { 
    max-width: 1075px; 
}
/*music stuff*/
.spotify-box { 
    max-width: 850px; 
    height: 526px; 
    border: 5px solid red; 
    font-size: 20px; 
    padding: 20px; 
    display: flex; 
    margin-left: auto; 
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px; 
    overflow: auto; 
}
.youtube-box { 
    max-width: 850px; 
    height: 316px; 
    border: 5px solid red; 
    font-size: 20px; 
    padding: 20px; 
    display: flex; 
    margin-left: auto; 
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px; 
    overflow: auto; 
}
.words { 
    grid-area: menu;
}
.music {
    grid-area: content;
}
.playlist-box { 
    max-width: 100%; 
    height: 600px; 
    border: 5px solid red; 
    font-size: 20px; 
    padding: 20px; 
    display: inline-block; 
    margin-left: auto; 
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px; 
    overflow: auto; 
}