:root {
    --purple1:rgb(195, 69, 244);
    --purple2:rgb(170, 81, 170);
    --purple2l:rgb(246, 193, 246);
    --purple3:rgb(124, 81, 170);
    --purple4:rgb(81, 112, 170);
    --purple5:rgb(174, 222, 236);

}

div.sticky
{
    background-color:rgb(255, 255, 255, .9);
    position: sticky;
    top: 0;

}
body {
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    background-color: #E5E5F7;
    opacity: 1;
    background-image:  radial-gradient(#ffd4e8 10px, transparent 10px), radial-gradient(#94ffc9 10px, #ffffff 10px);
    background-size: 200px 200px;
    background-position: 0 0,100px 100px;
}
h2{
    /*background-color:rgb(255, 255, 255, .8);*/
    text-shadow:0px 0px 10px #ffffff;
  
    
}
table {
    margin: auto;
}
.horizontal {
        background-color:var(--purple1);

}

hgroup {

    padding-top:10px;
    padding-bottom:10px;
    padding-left:100px;
    padding-right:100px;

    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    text-align:center;
        /*
    margin-left: 0px;
    margin-right: 0px;
    */
}

.table
{
    text-align: center;
    padding:2rem;
    border-radius:50px;
    margin-bottom:10px;
    box-shadow:2px 2px 5px grey;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;


}
td {
    padding: 6px;
}
#table1 {
    background: linear-gradient(159deg,rgba(253, 245, 255, 1) 0%, rgba(240, 171, 255, 1) 51%, rgba(255, 117, 216, 1) 100%);

}
#table2 {
    background: linear-gradient(14deg,rgba(183, 173, 255, 1) 0%, rgba(168, 147, 245, 1) 51%, rgba(255, 117, 216, 1) 100%);

}
#table3 {
    background: linear-gradient(175deg,rgba(183, 173, 255, 1) 0%, rgba(147, 176, 245, 1) 51%, rgba(179, 255, 217, 1) 100%);

}
#table4 {
    background: linear-gradient(7deg,rgba(119, 201, 122, 1) 0%, rgba(134, 217, 154, 1) 30%, rgba(179, 255, 217, 1) 100%);
}

.odd {
    background-color:var(--purple5);
}
.purple {
    
    border-radius:50px;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    padding-top:10px;
    padding-bottom:10px;
    color:black;
    }
#about {
    background-color:purple2;
    /*
    margin-left:20%;
    margin-right:20%;
*/
    
    }
#lessons {
    background-color:purple3;
    /*
    margin-right:60%;
    margin-left:50px;
    */
    
    }
#sheetmusic {
    background-color:purple4;
    /*
    margin-left:60%;
    margin-right:50px;
    */
    
    }
#resources {
    background-color:purple5;
    /*
    margin-right:60%;
    margin-left:50px;
    */
    }

