@font-face{
    font-family: Caveat;
    src: url(Caveat-Bold.ttf) format(truetype);
}
body{
    background-color: rgb(189, 166, 206);
}
.img-fluid{
	height: auto;
    width: 100%;
    opacity: 0.4;
    max-height: 400px;
	overflow: hidden;
}
#chat{
	height: auto;
    width: 80%;
    max-height: 400px;
    overflow: hidden;
    opacity: 1.0;
}
.back{
    position: relative;
}
.back p {
    position: absolute;
    color: rgb(29, 23, 23);
    font-weight: bold;
    font-size: 4em;
    font-family: 'Caveat', cursive;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin: 0;
    padding: 0;
}
.border-bottom{
    border-bottom: solid 10px rgb(219, 138, 16);
}
.text-center{
    text-align: center;
 }
 .center2{
    list-style: disc;
    padding-left: 15px;
 }
 .center{
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 350px;
    justify-content: center;
    align-items: center;
 }
 .box{
     position: relative;
 }
 .box div.text{
     position: absolute;
     color: rgb(29, 23, 23);
     top: 50%;
     left: 50%;
     -ms-transform: translate(-50%,-50%);
     -webkit-transform: translate(-50%,-50%);
     transform: translate(-50%,-50%);
     margin: 0;
     padding: 0;
 }
 .hand img{
     width: 100%;
 }
 .processing{
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 650px;
    justify-content: center;
    align-items: center;
 }
 .chatbot{
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 550px;
    justify-content: center;
    align-items: center;
 }
 .math{
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 650px;
    justify-content: center;
    align-items: center;
 }
 h2 {
    font-family: 'Caveat', cursive;
    font-size: 300%;
 }
 h3{
     font-size: 125%;
 }