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

 :root {
     --font1: 'Varela Round', sans-serif;
     --font2: 'Ubuntu', sans-serif;
     --main-bg-color: rgb(244, 242, 255);
 }


 .font1 {
     font-family: 'Varela Round', sans-serif;
 }

 .font2 {
     font-family: 'Ubuntu', sans-serif;
 }

 .max-width-1 {
     width: 70vw;
 }

 .max-width-2 {
     width: 55vw;
 }

 .m-auto {
     margin: auto;
 }

 .my-1 {
     margin-top: 14px;
     margin-bottom: 14px;
 }

 .my-2 {
     margin-top: 40px;
     margin-bottom: 40px;
 }
 .my-3{
    margin-top: 25px;
    margin-bottom: 25px;
 }
 .mtml-1{
    margin-top: 25px;
    margin-left: 25px;
 }

 .td-none {
     text-decoration: none;
     cursor: pointer;
     color: black;
 }

 .btnn {
     padding: 10px 16px;
     margin: 5px 22px;
 }

 .btn {
     border: 1px solid black;
     border-radius: 7px;
     padding: 5px 16px;
     font-size: 16px;
     font-family: var(--font2);
     cursor: pointer;
     transition: all 0.3s ease-in-out;
 }

 .btn:hover {
     background-color: rgb(208, 198, 252);
 }

 .form-input {
     font-size: 16px;
     border: 1px solid black;
     border-radius: 7px;
     margin: 0px 12px;
     padding: 6px 8px;
     font-family: var(--font2);
 }