* {
  padding: 0;
  margin: 0;
}

.fabs {
  position: fixed;
  left: 20px;
  bottom: 20px;
}

.action {
  background: rgb(24, 145, 196);
  height: 55px;
  width: 55px;
  border-radius: 50%;
  box-shadow: 0 5px 7px 0px gray;
  transition: background-color 0.4s ease-in-out;
}

.action i {
  position: absolute;
  color: white;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 25px;
  cursor: pointer;
}

.action:hover {
  background-color: rgb(255, 103, 179);
}

.socialbtn {
  position: absolute;
  height: 40px;
  width: 40px;
  border-radius: 50%;
}



.socialbtn i {
  position: absolute;
  font-size: 18px;
  color: white;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.btns {
  position: absolute;
  bottom: 0px;
  margin-bottom: 10px;
  height: 40px;
  width: 40px;
  transition: 0.3s ease-in-out;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
.btns.open {
  bottom: 50px;
}





/*  == FAQS ===  */


.faq-heading{
    border-bottom: #777;
    padding: 20px 60px;
}
.faq-container{
display: flex;
justify-content: center;
flex-direction: column;

}
.hr-line{
  width: 100%;
  margin: auto;
}
/* Style the buttons that are used to open and close the faq-page body */
.faq-page {
    /* background-color: #eee; */
    color: #444;
    cursor: pointer;
    padding: 1em 2em;
    width: 100%;
    border: none;
    outline: none;
    transition: 0.4s;
    margin: auto;

}
.faq-body{
    margin: auto;
    /* text-align: center; */
   width: 100%; 
   padding: auto;
   
}


/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active,
.faq-page:hover {
    background-color: #F9F9F9;
}

/* Style the faq-page panel. Note: hidden by default */
.faq-body {
    padding: 0 18px;
    background-color: white;
    display: none;
    overflow: hidden;
}

.faq-page:after {
    content: '\02795';
    /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
}

.active:after {
    content: "\2796";
    /* Unicode character for "minus" sign (-) */
}


.floating-Watsapp-btn {
 width:  1.35em;
 height: 1.35em;
 color: white;
 background-color: #25D366;
 display: flex;
 align-items: center;
 justify-content: center;
 text-decoration: none;
 border-radius: 50%;
 font-size: 40px;
 box-shadow: 2px 2px 5px rgba(0,0,0,0.25);
 position: fixed;
 right: 20px;
 bottom: 20px;
}