#boncall {
  padding: 30px;
}

#btn-boncall {
  display: inline-block;
  position: relative;
}

#btn-boncall .block-callback {
  display: flex;
  margin: 17px 10px 20px 0;
}

#boncall .boncall-mail {
  padding-left: 36px;
}

#btn-boncall .block-callback-link {
  position: relative;
  margin-right: 45px;
}

#btn-boncall .boncall-title {
  color: #3a3a3a;
}

#btn-boncall .block-callback a {
  display: flex;
}

#btn-boncall .block-callback a span {
  hyphens: none
}

#btn-boncall a i {
  font-size: 14px;
  margin-right: 7px;
}

#btn-boncall a.btn-boncall {
  color: #3a3a3a;
  text-transform: uppercase;
  font-weight: 400;
  white-space: inherit;
  transition: all 0.2s linear;
  font-size: 15px;
  position: relative;
}

#btn-boncall a.btn-boncall span {
  font-size: 13px;
}

#btn-boncall a.btn-boncall:hover {
  box-shadow: none;
}

#btn-boncall a.btn-boncall::after {
  position: absolute;
  right: -15px;
  content: "\E801";
  font-size: 10px;
  font-family: 'Mercury';
  font-weight: 600;
  transform: rotate(180deg);
}

#btn-boncall a.btn-boncall.active::after {
  transform: rotate(0deg);
}

#btn-boncall .boncall-wrapper {
  display: none;
}

#btn-boncall .boncall-wrapper {
  width: 300px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);
  background: #fff;
  padding: 15px;
  position: absolute;
  z-index: 998;
  right: -15px;
  top: 35px;
}

#btn-boncall .boncall-wrapper .bon-call-success.alert-success {
  text-align: center;
  margin-bottom: 0;
}

#btn-boncall .boncall_form .wh {
  display: flex;
  justify-content: space-between;
  margin-bottom: 15px;
}

#btn-boncall .boncall_form p {
  margin-bottom: 12px;
}

#btn-boncall .boncall_form .submit {
  display: flex;
  justify-content: center;
}

#btn-boncall .boncall_form .submit .boncall_send {
  padding: 11px 20px;
  width: 100%;
}

#btn-boncall .boncall_form fieldset {
  margin-top: 0;
}

@media screen and (max-width: 575px) {
  #btn-boncall .boncall-wrapper {
    right: 0;
  }
}




/* wrapper bottom */

#btn-boncall-wrapper-bottom p {
  margin-bottom: 10px;
}

#btn-boncall-wrapper-bottom .boncall-open {
  left: 0;
  top: 320px;
  width: 46px;
  position: fixed;
  height: 46px;
  transition: all 0.3s;
  z-index: 998;
  border: none;
  cursor: pointer;
  background: #1EAFBE;
  box-shadow: 4px 2px 8px rgb(0 0 0 / 16%);
}

#btn-boncall-wrapper-bottom .boncall-open:focus {
  outline: none;
}

#btn-boncall-wrapper-bottom .boncall-open .boncall-open_img {
  background: url(data:./img/icon.png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAH4SURBVHgBrVaLcYMwDFV6HcAjeINmBDJBs0GyQegEZINmA7JB2glIJ6AbQCcgG7hykduHMYZA350OsGU9/U6GSGCMUSwZS2NalCw7mgjW1SwVS3GPcgjZneerKYRnUbbRHVgSWLNIp5LZ7zEyDYZ3EUf0YjI5dJIDRWBPgcEicvZnnyX35NBzwrTNMZg2Sa+LUlE4A2P47YNHFi3vnxSGW1ciN9ir4f3M8gXfVvdZ7B+ts6vV6oXAizXFIzSBCNVYDXntCOcT6nz0lbEp8gGHRhvHtPW1KAiU9/caGtIN7G9lr3mgvxqt0QA/bFfaZ82y4fzXQ4SytxFbIT1Xd2WNp75ntp6Q6mdaCOwDV/heHSHvJS1Eh9AznoOSrYsb5K+0AAamWc8DbA5It8Xkm2OAdIsZ7LZuV9FNExvtmv4LXpQprNsal1NJRV/TRNITGNaw7t+XaeCshiw55FFy0x9VyjNYgrEs4hCiMZH71O/O0iNVpntDVFIKdDIR3a3nRBYjxXqWflpMdyAjuQ7YwjtzFyPdx4xJJi4xsgBp/AfLtCOucrWg4WyoETvdSTOi7JrlRDMB2WrmGtBSx2SCrm0e14T5imbAkvHDdV3NcmV5p+7vxxPLliUBvQ3NJMSGmYKLq/OsCJFYInA/S27s3SSiD5Y3vqCv7sw3+42MkIb1fhwAAAAASUVORK5CYII=);
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 25px;
}

#btn-boncall-wrapper-bottom .boncall-open .boncall-open_img i {
  font-size: 22px;
}

.fl-outicons-ico,
[class^="fl-outicons-"]:before,
[class*=" fl-outicons-"]:before,
[class^="fl-outicons-"]:after,
[class*=" fl-outicons-"]:after {
  font-family: 'fl-outicons';
  font-size: inherit;
  font-weight: 400;
  font-style: normal;
}

#btn-boncall-wrapper-bottom .boncall-wrapper {
  top: 320px;
  opacity: 0;
  position: fixed;
  background-color: white;
  width: 320px;
  max-height: 535px;
  overflow: auto;
  z-index: 99999;
  transition: all 0.3s;
  box-shadow: 0 0 9px rgba(0, 0, 0, 0.15);
}

#btn-boncall-wrapper-bottom .boncall-wrapper.left {
  left: -320px;
  opacity: 1;
}

#btn-boncall-wrapper-bottom .boncall-wrapper.right {
  right: -320px;
  opacity: 1;
}

#btn-boncall-wrapper-bottom .boncall-wrapper.left.active {
  left: 0;
}

#btn-boncall-wrapper-bottom .boncall-wrapper.right.active {
  right: 0;
}

#btn-boncall-wrapper-bottom .boncall-wrapper .form-group {
  margin-bottom: 10px;
}

#btn-boncall-wrapper-bottom .boncall-wrapper .boncall-header-title {
  padding: 11px 40px 10px 15px;
  background: #F4F4F4;
}

#btn-boncall-wrapper-bottom .boncall-wrapper .boncall-header-title p {
  color: #505050;
  font-size: 17px;
  line-height: 25px;
  text-align: center;
  margin: 0;
}

#btn-boncall-wrapper-bottom .boncall-wrapper .boncall-body {
  padding: 15px;
}

#btn-boncall-wrapper-bottom .boncall-wrapper .boncall-body p:nth-child(2) {
  display: none;
}

#btn-boncall-wrapper-bottom .boncall-open.left.active {
  left: 320px;
}

#btn-boncall-wrapper-bottom .boncall-open.right {
  right: 0;
  left: unset;
}

#btn-boncall-wrapper-bottom .boncall-open.right.active {
  right: 320px;
}

#btn-boncall-wrapper-bottom .block-callback a {
  margin-left: 36px;
}

#btn-boncall-wrapper-bottom .block-callback-link {
  position: relative;
}

#btn-boncall-wrapper-bottom .boncall-title {
  color: #3a3a3a;
  display: none;
}

#btn-boncall-wrapper-bottom .block-callback a {
  display: flex;
}

#btn-boncall-wrapper-bottom .block-callback a span {
  hyphens: none;
}

#btn-boncall-wrapper-bottom a i {
  font-size: 14px;
  margin-right: 7px;
}

#btn-boncall-wrapper-bottom a.btn-boncall {
  color: #3a3a3a;
  text-transform: uppercase;
  font-weight: 400;
  white-space: inherit;
  /* transition: all 0.3s ease; */
  font-size: 15px;
  position: relative;
}

#btn-boncall-wrapper-bottom a.btn-boncall span {
  font-size: 13px;
}

#btn-boncall-wrapper-bottom a.btn-boncall:hover {
  box-shadow: none;
}

#btn-boncall-wrapper-bottom .boncall-wrapper .bon-call-success.alert-success {
  text-align: center;
  margin-bottom: 0;
}

#btn-boncall-wrapper-bottom .boncall_form .wh {
  display: flex;
  justify-content: space-between;
  margin-bottom: 15px;
  display: none;
}

#btn-boncall-wrapper-bottom .boncall_form p {
  margin-bottom: 12px;
}

#btn-boncall-wrapper-bottom .boncall_form .submit {
  display: flex;
  justify-content: center;
}

#btn-boncall-wrapper-bottom .boncall_form .submit .boncall_send {
  padding: 11px 20px;
  width: 100%;
}

#btn-boncall-wrapper-bottom .boncall_form fieldset {
  margin-top: 0;
}


@media screen and (max-width: 1199px) {

  #btn-boncall-wrapper-bottom .boncall-open,
  #btn-boncall-wrapper-bottom .boncall-wrapper {
    top: 380px;
  }
}

@media screen and (max-width: 767px) {

  #btn-boncall-wrapper-bottom .boncall-open,
  #btn-boncall-wrapper-bottom .boncall-wrapper {
    top: 409px;
  }
}

@media screen and (max-width: 575px) {
  #btn-boncall-wrapper-bottom .boncall-wrapper {
    right: 0;
  }

  #btn-boncall-wrapper-bottom .boncall-wrapper {
    overflow: auto;
    height: 220px;
  }

  #btn-boncall-wrapper-bottom .block-callback {
    flex-direction: column-reverse;
  }

  #btn-boncall-wrapper-bottom a.btn-boncall span {
    font-size: 11px;
  }

  #btn-boncall-wrapper-bottom a.btn-boncall::after {
    right: 10%;
  }
}