@charset "utf-8";

/*
   Style Sheet for Mis-FIT Gym Website
   Author: Tenia Xu Yuan
   Filename: music.css
*/

body#img{   /*Image width edits*/
    width: 150px;
}

body {  /*edits to body section: background and fonts*/
    color: rgb(0,0,0);
    background-image: url(background_ombre.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    font-family: 'Chelsea Market';
    font-size: 30px;
    text-align: center;
}

h1 {    /*edits to font for h1 headings*/
    font-family: 'Faster One';
    font-size: 70px;
    text-align: center;
}
 
.headers_top {     /*header button (navbar) color */
    overflow: hidden;
    background-image: linear-gradient(#EBC3C1, #ECAD8F);
    border-style: solid;
    font-family: 'Akronim';
}
  
.headers_top a {    /*header borders, colours and word alignment*/
    float: left;
    color: rgb(0,0,0);
    text-align: center;
    padding: 13px 13px;
    width: 14.6%;
    text-decoration: none;
    font-size: 20px;
    border-style: double;
    border-color: rgb(253, 41, 41); /*to use RGB/HEX for colours*/
}
  
.headers_top a:hover { /*header button (navbar) hover over changes */
    background-color: #ddd;
    color: rgb(0,0,0);
}

h4 {    /*edits to font of h4 heading*/
    font-size:15px;
    text-align: center;
}

.quotes {   /*edits to font of <div class="quotes">*/
    font-family: 'Kaushan Script';
    font-size: 35px;
}
 
/*Start of edit of table in footer*/
table {
    border-collapse: collapse;
    width: 100%;
}
 
th {
    height: 50px;
    text-align: center;
    width: 16.6%;
}
 
table, tr, th {
    border: 1px solid rgb(0,0,0);
}
 
th:hover {  /*footer table hover over changes*/
    background-color: #FFFAF0;
    color:rgb(0,0,0);
}
/*End of edit of table in footer*/

footer {    /*footer section decoration*/
    font-size: 15px;
    border-style: double;
    padding: 15px;
}

.copyright {      /*company copyright*/
    font-size: 13px;
    color: rgb(0,0,0);
    text-align: center; /*appear at the bottom center of the website, below the footer*/
 }
 
 .lastupdate {  /*edits to last updated date of website*/
    font-size: 13px;
    color: rgb(0,0,0);
    text-align: right; /*appear at the bottom right of the website*/
 } 

/*edit to the width of image, to make use of white spaces*/
.music_content img {
    width: 30%;
}