/* Imports */
@import url('https://fonts.googleapis.com/css?family=Oswald|Pacifico|Ubuntu|Kavivanar');

/* Global rules */
/* Elements */
html {}
body {}
h1,h2,h3,h4,h5,h6 {}
a {color: white !important;}
a:hover {color: seashell !important;}

/* IDs */
#twitch-embed {text-align: center;}

/* Classes */
.header {background-color: #4c4e51;}
.header-title {color: whitesmoke;}
.header-title h1 {font-family: "Pacifico", cursive; font-size: 72px; text-align: center; margin: 0; padding: 35px;}

.footer {font-family: "Oswald", sans-serif; background-color: #4c4e51; padding: 20px;}
.footer p {font-size: 20px; color: white; text-align: center; padding: 5px;}
.footer a {color: white; text-decoration-color: white; text-decoration-line: none;}
.footer a:hover {color: white;}

.main-section {position: relative; background-size: 100%; background-image: url("tracks.jpg"); background-color: black; padding: 30px 5px;}
.main-background {border-radius: 25px; padding: 25px;}
.main-background h2 {font-family: "Kavivanar", cursive; position: relative; font-size: 54px; color: white; text-align: center;}
.main-background p {font-family: "Kavivanar", cursive; position: relative; font-size: 36px; color: white; text-align: center;}

.about-background h2 {position: relative; font-size: 24px; color: white;}
.about-background p {position: relative; font-size: 20px; color: white;}

.nav-pills .nav-link {font-size: 24px; background-color: #f08080 !important; border-radius: 0 !important; border-style: solid; border-width: 2px; border-color: black;}
.nav-link a {color: white; text-decoration-color: white;}
.nav-pills .nav-link a:hover {text-decoration-color: white;}
a.nav-item.nav-link {font-family: "Ubuntu", cursive; font-size: 30px;}

/*Media queries*/
@media (min-width: 768px){
    .main-section {padding: 50px 10px;}
    .main-section h2 {text-align: left;}
}
@media (min-width: 992px){
    .main-section {padding: 70px 10px;}
}
@media (min-width: 1200px){
    .main-section {padding: 90px 200px;}
    .main-section h2 {text-align: center;}
}