body{
  font-family: "overpass";
}

p{
  font-size: 18px;
  font-weight: 300;
  word-spacing: 0.01em;
  line-height: 1.5;
  margin: 0 auto 2em;
}

.btn{
  border-radius: 0;
}

.container-white{
  background-color: #ffffff;
}

.container-grey{
  background-color: #F2F2F2;
}

.container-yellow{
  background-color: #FBBA16;
}

.font-60{
  font-size: 60px;
}

.card{
  cursor: pointer;
  border-radius: 0;
  border: 0;
  margin-bottom: 20px;
  overflow: hidden;
  font-size: 14px;

  .card-img-top1{
    border-radius: 0;
    width: 40%;
    margin: 0px;
    padding: 0px;
  }
  .card-img-top2{
    border-radius: 0;
    width: 60%;
    margin: 0px;
    padding: 0px;
    padding-left: 4px;
  }

  .card-body{
    padding: 20px 15px;
  }
}

.modal{
  --bs-modal-border-radius: 0;

  .modal-header{
    border:0;
  }

  .modal-footer{
    border:0;
  }
}

#div-arrow-right{
  cursor: pointer;
  position: absolute;
  right: -10px;
  top: 100px;
  background-color: #fcba16;
  padding: 10px;
  transform: rotate(45deg);
  .right {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
  }
}

#div-arrow-left{
  cursor: pointer;
  position: absolute;
  left: -10px;
  top: 100px;
  background-color: #fcba16;
  padding: 10px;
  transform: rotate(45deg);
  .left {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
  }
}

.arrow {
  border: solid white;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
}

.form-floating .form-control{
  border-radius: 0 !important;
  background-color: #F4F5F5;
}

.form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after{
  background-color: #F4F5F5;
}