@import url('https://fonts.googleapis.com/css?family=Montserrat:200,300,400,500,600,700,800,900&display=swap');
/* Button used to open the chat form - fixed at the bottom of the page */
.open-button {
background-color: #208f6e;
color: white;
padding: 8px 13px;
border: none;
cursor: pointer;
position: fixed;
bottom: 23px;
right: 28px;
z-index: 99;
border-radius: 50%;
font-size: 29px
}

/* The popup chat - hidden by default */
.chat-popup {
    display: none;
    position: fixed;
    bottom: 0;
    right: 15px;
    border: 3px solid #ed3237;
    z-index: 99;
    height: 310px;
    border-radius: 8px;
    padding: 10px 16px;
    background: #fff;
}

/* Add styles to the form container */
.form-container {
  max-width: 300px;
  padding: 10px;
  background-color: white;
}
.chat-input{
    border-radius: 8px;
font-size:14px;
color: #6c7898;

border: 1px solid #e4b036;
}
/* Full-width textarea */
.form-container textarea {
  width: 100%;
  padding: 15px;
  margin: 5px 0 22px 0;
  border: none;
  background: #f1f1f1;
  resize: none;
  min-height: 200px;
  border-radius: 23px;

color: #6c7898;

border: 1px solid #208f6e;
}

/* When the textarea gets focus, do something */
.form-container textarea:focus {
  background-color: #ddd;
  outline: none;
}

/* Set a style for the submit/send button */
.form-container .btn {
  background-color: #4CAF50;
  color: white;
  padding: 16px 20px;
  border: none;
  cursor: pointer;
  width: 100%;
  margin-bottom:10px;
  opacity: 0.8;
}

/* Add a red background color to the cancel button */
.form-container .cancel {
  background-color: red;
}

/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
  opacity: 1;
}
.close-div-pop{
    height: 35px;

width: 35px;

background: #ed3237;

position: absolute;
top: -22px;
right: -18px;
border-radius: 50%;

padding: 5px 8px;

text-align: center;

cursor: pointer;
}
.close-div-pop img{
    width: 75%;

margin: 0 auto;
}
.chat-bt{

margin: 0 auto;
text-align: center;
display: block;
width: 100%;
border-radius: 8px;
background-color: #ed3237;
color: #fff;
font-family: 'Montserrat', sans-serif;
font-size: 16px;
font-weight: 600;
}
.chat-bt:hover
{
    color: #fff;
}
.chat-popup h3{
    color: #ed3237;

font-family: 'Montserrat', sans-serif;
margin-bottom: 1rem;
font-weight: 600;
font-size:20px;
}
@media(max-width:468px){
 
/* Button used to open the chat form - fixed at the bottom of the page */
.open-button {
background-color: #208f6e;
color: white;
padding: 8px 13px;
border: none;
cursor: pointer;
position: fixed;
bottom: 23px;
right: 28px;
z-index: 99;
border-radius: 50%;
font-size: 29px
}

/* The popup chat - hidden by default */
.chat-popup {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 15px;
    border: 3px solid #e4b036;
    z-index: 99;
    height: 350px;
    border-radius: 12px;
    padding: 10px 16px;
    background: #fff;
}

/* Add styles to the form container */
.form-container {
  max-width: 300px;
  padding: 10px;
  background-color: white;
}
.chat-input{
    border-radius: 23px;

color: #6c7898;

border: 1px solid #208f6e;
}
/* Full-width textarea */
.form-container textarea {
  width: 100%;
  padding: 15px;
  margin: 5px 0 22px 0;
  border: none;
  background: #f1f1f1;
  resize: none;
  min-height: 200px;
  border-radius: 23px;

color: #6c7898;

border: 1px solid #208f6e;
}

/* When the textarea gets focus, do something */
.form-container textarea:focus {
  background-color: #ddd;
  outline: none;
}

/* Set a style for the submit/send button */
.form-container .btn {
  background-color: #4CAF50;
  color: white;
  padding: 16px 20px;
  border: none;
  cursor: pointer;
  width: 100%;
  margin-bottom:10px;
  opacity: 0.8;
}

/* Add a red background color to the cancel button */
.form-container .cancel {
  background-color: red;
}

/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
  opacity: 1;
}
.close-div-pop{
    height: 35px;

width: 35px;

background: #e4b036;

position: absolute;
top: -22px;
right: -18px;
border-radius: 50%;

padding: 5px 8px;

text-align: center;

cursor: pointer;
}
.close-div-pop img{
    width: 75%;

margin: 0 auto;
}
.chat-bt{
background: #fff;
color: #208f6e;
margin: 0 auto;
text-align: center;
display: block;
width: 94%;
border-radius: 12px;
border: 1px solid #208f6e;
}
.chat-popup h3{
    color: #fac21f;

font-family: 'Montserrat', sans-serif;
margin-bottom: 1rem;
font-weight: 600;
}
}