

  /* The popup form - hidden by default */
  .form-popup {
    display: none;
    bottom: 0;
    right: .5em;
    border: 3px solid #f1f1f1;
    z-index: 7;
  }
  
  /* Add styles to the form container */
  .form-container {
    width: 343px;
    padding: 35px 1px 15px 2px;
    background-color: black;
    border-radius: 10px;
  }
  
  /* Full-width input fields */
  .form-container input[type=text], .form-container input[type=name], .form-container input[type=email],
  .form-container input[type=tel] {
    width: 95%;
    padding: 7px;
    margin: 2px 0 15px 0;
    border: none;
    background: #f1f1f1;
  }
  
  /* When the inputs get focus, do something */
  .form-container input[type=text]:focus, .form-container input[type=email], .form-container input[type=tel]:focus {
    background-color: #ddd;
    outline: none;
  }
  
  /* Set a style for the submit/login button */
  .form-container .btn {
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bolder;
    background-color: white;
    color: #544c4a;
    padding: 2px 8px 2px 8px;
    border: 4.5px solid #544c4a;
    border-radius: 20px;
    cursor: pointer;
    width: 35%;
    margin-bottom: 12px;
    margin-left: 80px;
    margin-top: 12px;
    opacity: 0.8;
  }
  
  /* Add a red background color to the cancel button */
  .form-container .cancel {
    color: red;
    background-color: white;
  }
  
  /* Add some hover effects to buttons */
  .form-container .btn:hover, .open-button:hover {
    background-color: darkgrey;
    opacity: 1;
  }

  .close {
    margin-top: -45px;
    margin-left: -25px;
    background-color: none;
  }

  .cancel-button {
    background-color: transparent;
    border: none;
    cursor: pointer;
  }

  .cancel-button:hover {
    color: lightcoral;
    opacity: 1;
  }

  .quote-container {
    width: 343px;
    padding: 35px 1px 15px 2px;
    background-color: #6b6c6e;
    border-radius: 10px;
   }

  .quote-container .sub-btn {
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bolder;
    background-color: white;
    color: #544c4a;
    padding: 2px 8px 2px 8px;
    border: 4.5px solid #544c4a;
    border-radius: 20px;
    cursor: pointer;
    width: 35%;
    margin-bottom: 12px;
    margin-left: 80px;
    margin-top: 12px;
    opacity: 0.8;
  }

  .close-quote {
    margin-top: -45px;
    margin-left: -25px;
  }

  .cancel-quote {
    background-color: transparent;
    border: none;
    cursor: pointer;
  }

  .cancel-quote:hover {
    color: coral;
    opacity: 1;
  }

  .quote-container input[type=text], .quote-container input[type=name], .quote-container input[type=email],
  .quote-container input[type=tel] {
    width: 95%;
    padding: 7px;
    margin: 2px 0 15px 0;
    border: none;
    background: #f1f1f1;
  }

  .quote-container input[type=text]:focus, .quote-container input[type=email]:focus, .quote-container input[type=tel]:focus {
    background-color: rgb(201, 198, 198);
    outline: none;
  }

  .sub-btn:hover {
    background-color: darkgray;
    opacity: 1;
  }