*
               {
                box-sizing: border-box;
                font-family: made-tommy, calibri;
                text-align: center;
               }
@font-face 
               {
                font-family: inter-semibold;
                src: url(fonts/Inter-SemiBold.ttf);
               } 
@font-face 
               {
                font-family: inter-thin;
                src: url(fonts/Inter-Thin.ttf);
               }  
@font-face
               {
                font-family: made-tommy-bold;
                src: url(fonts/made_tommy_bold.otf);
               }    
@font-face
               {
                 font-family: made-tommy-extra-bold;
                 src: url(fonts/made_tommy_extra_bold.otf);
               }    
@font-face 
               {
                 font-family: made-tommy-medium;
                 src: url(fonts/made_tommy_medium.otf);
               }                                  
@font-face 
               {
                 font-family: made-tommy-regular;
                 src: url(fonts/made_tommy_regular.otf);
               }
header 
               {
                 margin: auto;
                 display: flex;
                 justify-content: center;
                 background-color: #CACAE6;
                 color: #704490;
                 height: 10vh;
               }  
header p
                {
                  text-align: center;
                  justify-content: baseline;
                  font-weight: bold;
                  padding: 1%;
                  margin-top: .25%;
                  margin-bottom: .25%;
                  font-size: larger;
                }                
header div
               {
                background-color: #704490;
                width: fit-content;
                height: fit-content;
                color: #CACAE6;
                padding: .5%;
                margin-top: .25%;
                margin-bottom: .25%;
                position: relative;
                top: 13%;
               }    
nav
               {
                display: grid;
                grid-template-columns: 2fr 8fr;
                width: 100%;
                margin-left: auto;
                margin-right: auto;
                gap: 3%;
                margin-bottom: 10px;
                padding-left: 10%;
                padding-right: 10%;
               }              
nav ul
               {
                display: flex;
                position: relative;
                top: 55%;
                gap: 10%;
               }  
nav li
               {
                padding-right: 10px;
                padding-bottom: 0%;
                list-style-type: none;
                font-size: large;
               }         
nav a
               {
                text-decoration: none;
                text-align: center;
                font-family: made-tommy-bold;
               } 
                
nav a:link
               {
                color: #704490;
               }                 
nav a:hover
               {
                color: #CACAE6;
               }                            
nav a:active
               {
                color: #CACAE6;
               }       
.bluestripe
               {
                background-color: #00A4E0;
                width: 100%;
                text-align: center;
                color: white;
                padding: .5%;
                margin-bottom: 0%;
               } 
.flex
               {
                display: flex;
                justify-content: space-around;
               }   
.flex div
                {
                  width: 25%;
                  padding: 2vh;
                  margin-bottom: 2vh;
                }                            
.flex div:first-child
              {
                border-right: 5px #704490 dotted;
                padding: 3vh;
                
              }   
.flex div:last-child
               {
                border-left: 5px #704490 dotted;
               }                          
#hero
               {
                background-image: url(images/Hero.jpg);
                background-repeat: no-repeat;
                background-size: cover;
                margin-top: 0%;
                height: 660px;
               }                                       
.herotext
               {
                margin: 0%;
                padding: 6% 57% 0 10%;
                border-top: 7px #704490 dotted;
                position: relative;
                top: 5%;
                color: white;
                font-weight: bold;
                font-size: larger;
               } 
.herobutton
               {
                background-color: #704490;
                padding-left: 20px;
                padding-right: 20px;
                padding-top: 10px;
                padding-bottom: 10px;
                width: fit-content;
               }                             
.herobutton a
               {
                text-decoration: none;
                text-align: center;
                color: white;
               }
.purplestripe
               {
                background-color: #704490;
                width: 100%;
                display: flex;
               }               
.purplestripe section
               {
                text-align: center;
                color: white;
                margin: 2% 5% 2% 5%;
               }  
#cma
               {
                background-color: #00A4E0;
                border-radius: 15px;
                width: 75%;
                margin-left: auto;
                margin-right: auto;
                margin-top: 5vh;
                padding-left: 2%;
                padding-right: 2%;
                padding-top: .5%;
                padding-bottom: .5%;
                text-align: center;
                color: white;
                font-size: 1.2em;
               }         
#cma div
               {
                background-color: #704490;
                border-radius: 15px;
                width: fit-content;
                margin-left: auto;
                margin-right: auto;
                padding-left: 3%;
                padding-right: 3%;

              }    
#curriculum
              {
                width: 60%;
                margin-left: auto;
                margin-right: auto;
                margin-top: 8vh;
              }
#numbers 
              {
                display: flex;
                justify-content: center;
                flex-wrap: wrap;
                padding: 0 15% 5% 15%;
                ;
              }
#numbers h3
               {
                margin: auto;
                font-size: 7em;
                padding: 0 2vw 0 3vw;
                color: #00A4E0;
               }     
#numbers p
               {
                color: #704490;
                text-align: left;
                width: 33%;
                flex-wrap: wrap;
                padding-top: 10px;
                font-weight: bold;
               }       
.headercopy 
               {
                background-color: #704490;
                color: white;
                width: 100%;
                text-align: center;
                display: flex;
                justify-content: center;
                
               }
.headercopy p
               {
                font-size: 2.5em;
               }    
.headercopy a
               {
                background-color: #00A4E0;
                text-decoration: none;
                color: white;
                padding: 1vw 2vw;
                position: relative;
                top: 10vh;
                margin-left: 1vw;
               }                          
.join
               {
                color: #704490;
                font-size: 2.5em;
                font-family: made-tommy-extra-bold;
                font-weight: bold;
                border-top: 7px #00A4E0 dotted;
                padding-top: 8vh;
                margin-top: 8vh;
               }
.join p
               {
                color: #00A4E0;
                font-size: .60em;
                padding-left: 8vw;
                padding-right: 8vw;

               }
.dotted
               {
                background-color: #CACAE6;
                width: 75%;
                margin: auto;
                margin-bottom: 3vh;
                padding: 10px;
                border-radius: 15px;
                border: 7px #704490 dotted;
               }

.circle
               {
                 width: 300px;
                 height: 300px;
                 border-radius: 100%;
                 border: 10px rgb(184, 184, 184) solid;
                 margin-left: 10vw;
               }
.classlevels
                {
                  display: flex;
                  margin-top: 5vh;
                  margin-bottom: 5vw;
                  padding-right: 5vw;
                }               
.classtext
               {
                margin-left: 5vw;
                text-align: left;
               }               
.classtext h2
               {
                font-family: inter-semibold;
                color: #00A4E0;
                text-align: left;
               }                      
.classtext p
                {
                  font-family: inter-thin;
                  font-weight: 600;
                  text-align: left;
                }                                   
.classtext a
                {
                  background-color: #704490;
                  color: white;
                  font-family: inter-semibold;
                  padding: 5px 10px 5px 10px;
                  text-decoration: none;
                  margin-top: 3vh;
                }
#purplestripethick
                 {
                  text-align: center;
                  background-color: #704490;
                  color: white;
                  padding-top: 3vh;
                  padding-bottom: 3vh;
                  font-family: inter-semibold;
                  font-size: 120%;
                  line-height: 70%;
                  margin-bottom: 3vh;
                 }   
#purplestripethick h2
                  {
                    color: #CACAE6;
                  }