@import url('https://fonts.googleapis.com/css2?family=Inter');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Display');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Math');

@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap");

body {
    font-family: 'Inter', monospace;
}

.button {
    font-family: 'Noto Sans Display';
    font-size:20;
    color:#f6f9f6;
    background-color:#666565;
    height:62px;
    transition: 0.2s linear;
    border:none;
    border-radius:10px;
    margin: 10;
    padding: 20
}

.section {
    background-color: rgb(216, 228, 245);
    margin: 20;
    width: 400;
    text-align: center;
    align-items: center;
    padding: 20;
    box-shadow: 10px 5px 5px rgb(29, 28, 28);

}

.beginning {
    background-color: #f6f9f6;
}

table {
    margin: auto;
    margin-top: 60px;
}

.other {
    background-color: transparent;
    color:#f6f9f6;
    box-shadow: none;
    color: black;
}

.intro {
    margin: 20px;
    text-align: center;
    font-family: 'Jetbrains Mono', monospace;
    font-weight: bolder;
    font-size: 50;
    color: white;
}
.subintro {
    text-align: center;
    margin: 20px;
    margin-bottom: 50px;
    color: white;
}

#prep {
    float: right
}
#test {
    float: right;
}

.header {
    background-color: #220693;
    

}

footer {
    background: linear-gradient(#220693, #2c07c0);
    color: white;
    padding: 10px;
    font-size: 30px;
    text-align: center;
}

#faqs {
    margin-top: 50px;
   
}

.bottom {
    position:relative;
    
}

.bottom:after {
    background:#220693;
  content:"";
  height:2vw;
  position:absolute;
  top:100%;
  left:0;
  right:0;
  clip-path:polygon(
     0 0, 2% 100%, 5% 0,  7.5% 100%, 
   10% 0,12.5% 100%,15% 0, 17.5% 100%, 
   20% 0,22.5% 100%,25% 0, 27.5% 100%, 
   30% 0,32.5% 100%,35% 0, 37.5% 100%, 
   40% 0,42.5% 100%,45% 0, 47.5% 100%, 
   50% 0,52.5% 100%,55% 0, 57.5% 100%, 
   60% 0,62.5% 100%,65% 0, 67.5% 100%, 
   70% 0,72.5% 100%,75% 0, 77.5% 100%, 
   80% 0,82.5% 100%,85% 0, 87.5% 100%, 
   90% 0,92.5% 100%,95% 0, 97.5% 100%, 100% 0);
   box-shadow: 10px 5px 5px rgb(29, 28, 28);


}


hr {
    border-top: 8px dotted black;
    width: 300px;
}




html {
    scroll-behavior: smooth;
}
  
.button:hover {
    background-color:rgb(167, 198, 255);
    color:rgb(66, 132, 255);
}

p {
    width: 300;
    margin: auto;
    font-size: 20px;
}

.menu {

    padding: 50;
    font-size: 20px;
    font-family: 'Jetbrains Mono', monospace;
    font-weight: 400;
    color: rgb(29, 63, 230);

}

body {
    background: linear-gradient(90deg, rgb(3, 88, 174) 0%, rgb(35, 162, 235) 35%, rgb(117, 233, 246) 100%);;

}

.grid {
    display: flex;
    flex-wrap: wrap;
    margin-left: 10px;
    padding: 10px;
}

.button:hover {
    background-color:rgb(170, 217, 238);
    color:rgb(66, 132, 255);
}
.grid img{
    border: 2px solid #000000;
    border-radius: 50px;
}

body {
    overscroll-behavior: none;
}

.collapsable {
    background-color: #220693;
    text-align: center;
    color: white;
    margin: 0;
}

a{
    color: #c0b5b5;
    text-align: center;
    font-size: 24px;
}

a:hover {
    color: white;
    font-size: 24px;
}