@import url('https://fonts.googleapis.com/css2?family=Mouse+Memoirs&display=swap');

body{
    margin: 0px;
    font-family: 'Mouse Memoirs', sans-serif;
    background-color: bisque;
}

.navigation{
    padding: 1rem;
    background-color:#F5D0FE;
    border:4px solid #6B21A8;
    border-bottom-right-radius: 4rem;
}
.container-fluid{
    background-color:#F5D0FE;
    height: 20vh;
    margin-top: 10px;
    height: 55px;
    margin-bottom: 20px;
}

.triangles{
    margin: 0px;
    padding: 1rem;
    list-style: none;

}

.triangles li{
    padding: 55px;
    display: inline;
}

.triangles a{
    margin: 20px;
    text-decoration: none;
    font-size: 35px;
}
.paragraph{
    font-size: 35px;
    text-align: center;
    border: 3px solid #6B21A8 ;
    margin: 40px 200px;
    border-radius: 2rem;
    padding:10px;
    background-color: #F5D0FE;
}

.list{
    text-align: center;
    font-size: 30px;
    padding: 1rem 2rem;
    list-style: none;

}

.list li{
    padding: 1rem;
}

.footer{
    background-color:#F5D0FE ;
    padding: 5px 20px;   
    border: 4px solid #6B21A8;
    border-top-left-radius:4rem ; 
}

.footer-text h3{
     text-align: center;
     font-size: 35px;
     font-weight: lighter;
}

.footer-text p{
    font-size: 25px;
    text-align: center;
}

.container{
    margin:100px;
}

.heading
{
    text-align: center;
    font-size: 50px;
    border: solid 4px #6B21A8 ;
    border-radius: 4rem;
    color: #6B21A8;
}

.inputText{
    font-size: 25px;
    border-radius: 2rem;
    background-color: #F5D0FE;
    border-width: 4px;
    padding: 0.5rem;
}
.angle1{
    padding: 1rem;
    font-size: 25px;
    margin-left: 400px;
}

.angle2{
    padding: 1rem;
    font-size: 25px;
    margin-left: 400px;
}

.angle3{
    padding: 1rem;
    font-size: 25px;
    margin-left: 400px;
}

#check-triangle-btn{
    font-size: 25px;
    font-family: 'Mouse Memoirs', sans-serif;
    border-radius: 4rem;
    padding: 10px;
    background-color: #F5D0FE;
    margin-left: 550px;
}

.side-input{
   border-radius: 4rem;
   background-color: #F5D0FE;
   font-size: 25px;
   padding: 0.5rem;
}

#hypotenuse-btn{
    font-size: 25px;
    font-family: 'Mouse Memoirs', sans-serif;
    border-radius: 4rem;
    padding: 10px;
    background-color: #F5D0FE;
    margin-left: 550px;
}

.question-container{
    font-size: 25px;
    text-align: center;
}
#submit-btn{
    font-size: 25px;
    font-family: 'Mouse Memoirs', sans-serif;
    border-radius: 4rem;
    padding: 10px;
    background-color: #F5D0FE;
    margin-left: 580px;
    margin-top: 30px;
}

#output{
    font-size: 30px;
    text-align: center;
    margin: 20px;
    border: 5px solid #6B21A8;
    padding: 1rem;
    border-radius: 4rem;
    font-weight: 600;
    color: #6B21A8;
    text-decoration: underline;
}

.length{
    border-radius: 4rem;
   background-color: #F5D0FE;
   font-size: 25px;
   padding: 0.5rem;
}

#find-area{
    font-size: 25px;
    font-family: 'Mouse Memoirs', sans-serif;
    border-radius: 4rem;
    padding: 10px;
    background-color: #F5D0FE;
    margin-left: 550px;
    margin-top: 30px;
    margin-bottom: 30px;
}

.output{
    font-size: 30px;
    text-align: center;
    margin: 20px;
    border: 5px solid #6B21A8;
    padding: 1rem;
    border-radius: 4rem;
    font-weight: 600;
    color: #6B21A8;
    text-decoration: underline;
}

#out{
    font-size: 30px;
    text-align: center;
    margin: 20px;
    border: 5px solid #6B21A8;
    padding: 1rem;
    border-radius: 4rem;
    font-weight: 600;
    color: #6B21A8;
    text-decoration: underline;  
}