@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800|Satisfy);

/* General */
/* body {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
}
 */
mybot {
    position: fixed;
    width: 65px;
    height: 65px;
    bottom: 30px;
    right: 30px;
    z-index: 99999999;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

img {
  -webkit-user-drag: none;
  -moz-user-drag: none;
  -khtml-user-drag: none;
}

/* a,
a:hover,
a:focus {
  text-decoration: none;
  outline: none;
} */

.width100 {
  width: 100%;
}

.text-center {
  text-align: center;
}

/* .container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
} */
/* .form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  outline: none;
  font-family: 'Open Sans', sans-serif;
} */

/* General end*/

/* Demo */
/* .hd1 {
  margin-top: 15vh;
  font-size: 50px;
  font-weight: 100;
}

.powered {
  font-size: 17px;
  margin-top: 20px;
}

.powered img {
  width: 110px;
  position: relative;
  top: 8px;
} */

/* .footer {
  margin-top: 50px;
  position: absolute;
  bottom: 40px;
  width: auto;
  left: 0;
  right: 0;
  margin: 0 auto;
} */

/* .foo-txt {
  font-size: 15px;
  font-weight: 400;
  font-family: 'Satisfy', cursive;
  text-shadow: none;
  color: #272727;
}

.fa-heart {
  color: #fb2323;
} */
/* Demo end */

/* MyBot */
mybot.center .chatCont,
mybot.center .profile_div {
  left: 0;
  right: 0;
  margin: 0 auto;
}

mybot.left .chatCont,
mybot.left .profile_div {
  left: 0;
}

mybot .chatCont {
  position: fixed;
  width: 400px;
  height: 400px !important;
  bottom: 65px;
  right: 0;
  z-index: 10000;
  display: none;
  border-radius: 30px;
  background: #fff;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
}

/* mybot .close {
  position: absolute;
  right: 5px;
  margin-top: -60px;
  color: #868686;
  font-size: 18px;
  cursor: pointer;
} */

mybot .bot_profile {
  position: absolute;
  right: 0;
  left: 0;
  margin-top: -58px;
  text-align: center;
  width: 100%;
  display: none;
  z-index: 1000;
  border-radius: 6px 6px 0px 0px;
  background: #26a6fe;
  align-items: center;
  justify-content: space-between;
  padding: 8px 15px;
  gap: 20px;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
}

mybot .bot_profile .bot_p_img {
  background: none;
  box-shadow: none;
  width: 42px;
  object-fit: cover;
  border-radius: 0;
}

mybot .bot_profile span {
  color: #fff;
  text-align: center;
  font-family: inherit;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

mybot .bot_profile .close {
  cursor: pointer;
}

mybot .bot_p_img {
  width: 65px;
  border-radius: 50%;
  background: var(--blue, #26a6fe);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
  object-fit: scale-down;
}

mybot .chatForm {
  position: absolute;
  bottom: -65px;
  right: 0;
  margin-bottom: 0;
  width: 400px;
  display: none;
}

mybot .bot-txt,
mybot .bot-txt:focus {
  box-shadow: none;
  border-radius: 0;
  height: 66px;
  border: 0;
  margin: 0;
  padding: 12px 20px !important;
  border-radius: 0px 0px 6px 6px;
  border-top: 1px solid #f0f0f0;
  background: #fff;
  color: var(--text-mi, #182940);
  font-family: inherit;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
}

mybot .resultDiv .botResult,
mybot .resultDiv .userEnteredText {
  float: left;
  position: relative;
  left: 0;
  margin-bottom: 25px;
  margin-top: 0;
  width: fit-content;
  word-wrap: break-word;
  border-radius: 6px;
  background: #e8f6fe;
  color: var(--text-mi, #182940);
  font-family: inherit;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  padding: 10px 15px;
  display: flex;
  gap: 10px;
}

/* mybot .resultDiv .botResult:before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 0px solid rgba(0, 0, 0, 0);
  border-bottom: 15px solid rgba(0, 0, 0, 0);
  border-right: 15px solid #fff;
  left: -15px;
  margin-top: -12px;
} */

mybot .resultDiv .userEnteredText {
  float: right;
}

mybot .resultDiv .userQuestion,
mybot .resultDiv .botAnswers {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  justify-content: flex-end;
}

mybot .resultDiv .userQuestion::after,
mybot .resultDiv .botAnswers::before {
  content: "";
  width: 32px;
  height: 32px;
  display: block;
  flex-shrink: 0;
}

mybot .resultDiv .botAnswers {
  justify-content: flex-start;
}
mybot .resultDiv .userQuestion::after {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none"><g clip-path="url(%23clip0_8056_42642)"><path d="M16.0007 17.0677C14.7341 17.0677 13.4959 16.6921 12.4428 15.9885C11.3897 15.2848 10.5689 14.2846 10.0842 13.1144C9.59945 11.9443 9.47263 10.6566 9.71973 9.41439C9.96683 8.17214 10.5768 7.03106 11.4724 6.13545C12.368 5.23984 13.5091 4.62992 14.7513 4.38282C15.9936 4.13572 17.2812 4.26254 18.4514 4.74724C19.6215 5.23194 20.6217 6.05276 21.3254 7.10589C22.029 8.15902 22.4046 9.39716 22.4046 10.6637C22.4046 12.3622 21.7299 13.9911 20.529 15.192C19.328 16.393 17.6991 17.0677 16.0007 17.0677ZM16.0007 6.39443C15.1563 6.39443 14.3308 6.64482 13.6288 7.11394C12.9267 7.58306 12.3795 8.24983 12.0563 9.02995C11.7332 9.81006 11.6486 10.6685 11.8134 11.4966C11.9781 12.3248 12.3847 13.0855 12.9818 13.6826C13.5789 14.2797 14.3396 14.6863 15.1678 14.851C15.9959 15.0158 16.8543 14.9312 17.6345 14.6081C18.4146 14.2849 19.0813 13.7377 19.5505 13.0357C20.0196 12.3336 20.27 11.5081 20.27 10.6637C20.27 9.53145 19.8202 8.44553 19.0195 7.64488C18.2189 6.84423 17.133 6.39443 16.0007 6.39443Z" fill="%23009FFF"/><path d="M16.0007 32.01C13.6338 32.0085 11.2967 31.4821 9.15771 30.4689C7.01868 29.4557 5.13092 27.9808 3.63033 26.1504L3.07532 25.4673L3.63033 24.7949C5.13218 22.9669 7.02051 21.4945 9.15946 20.4835C11.2984 19.4726 13.6348 18.9482 16.0007 18.9482C18.3665 18.9482 20.7029 19.4726 22.8419 20.4835C24.9808 21.4945 26.8692 22.9669 28.371 24.7949L28.926 25.4673L28.371 26.1504C26.8704 27.9808 24.9827 29.4557 22.8436 30.4689C20.7046 31.4821 18.3675 32.0085 16.0007 32.01ZM5.87172 25.478C7.16985 26.8677 8.73978 27.9757 10.484 28.7332C12.2283 29.4907 14.1097 29.8816 16.0113 29.8816C17.913 29.8816 19.7944 29.4907 21.5387 28.7332C23.2829 27.9757 24.8529 26.8677 26.151 25.478C24.8529 24.0883 23.2829 22.9803 21.5387 22.2227C19.7944 21.4652 17.913 21.0743 16.0113 21.0743C14.1097 21.0743 12.2283 21.4652 10.484 22.2227C8.73978 22.9803 7.16985 24.0883 5.87172 25.478Z" fill="%23009FFF"/><path d="M16.0007 32.0101C12.3641 32.0126 8.83494 30.7768 5.99419 28.5062C3.15344 26.2357 1.17035 23.0656 0.37133 19.5178C-0.427693 15.97 0.00495712 12.2559 1.59807 8.98671C3.19119 5.71756 5.84983 3.08821 9.13643 1.5314C12.423 -0.0254066 16.1417 -0.416891 19.6804 0.42138C23.2192 1.25965 26.3671 3.27772 28.606 6.14345C30.845 9.00918 32.0416 12.5518 31.9989 16.1882C31.9562 19.8246 30.6767 23.3381 28.3711 26.1505C26.8705 27.9809 24.9827 29.4558 22.8437 30.469C20.7047 31.4822 18.3676 32.0086 16.0007 32.0101ZM16.0007 2.1249C13.2565 2.1249 10.5738 2.93868 8.29204 4.46331C6.01026 5.98795 4.23183 8.15497 3.18164 10.6903C2.13146 13.2257 1.85668 16.0156 2.39206 18.7071C2.92744 21.3987 4.24893 23.871 6.18943 25.8115C8.12992 27.752 10.6023 29.0735 13.2938 29.6089C15.9853 30.1442 18.7752 29.8695 21.3106 28.8193C23.846 27.7691 26.013 25.9907 27.5376 23.7089C29.0622 21.4271 29.876 18.7445 29.876 16.0002C29.876 12.3202 28.4142 8.791 25.812 6.18888C23.2099 3.58676 19.6807 2.1249 16.0007 2.1249Z" fill="%23009FFF"/><path d="M4.45227 25.4778C4.45227 25.4778 15.2003 37.4853 26.1404 26.6733L27.5493 25.4778C27.5493 25.4778 18.4129 16 9.13785 21.6888L4.45227 25.4778Z" fill="%23009FFF"/><path d="M16.0007 16C18.9481 16 21.3374 13.6107 21.3374 10.6633C21.3374 7.71596 18.9481 5.32666 16.0007 5.32666C13.0534 5.32666 10.6641 7.71596 10.6641 10.6633C10.6641 13.6107 13.0534 16 16.0007 16Z" fill="%23009FFF"/></g><defs><clipPath id="clip0_8056_42642"><rect width="32" height="32" fill="white"/></clipPath></defs></svg>');
}
mybot .resultDiv .botAnswers::before {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 36 36" fill="none"><g clip-path="url(%23clip0_8056_42604)"><path d="M3.69089 24.9586C2.62161 24.9586 1.57696 24.6858 0.630208 24.1542C0.143091 23.9033 -0.0455777 23.2757 0.245425 22.8035C1.21229 21.2585 1.56143 19.3699 1.11875 17.5938C0.65991 15.7525 -0.00399457 14.2018 0.000757794 12.2525C0.0172326 5.41377 5.70937 -0.130338 12.5411 0.00233248C19.1398 0.13524 24.578 5.6822 24.5781 12.2826C24.5781 20.9028 15.5441 26.955 7.56858 23.6262C6.46928 24.489 5.08753 24.9586 3.69089 24.9586ZM2.39159 22.854C3.89397 23.3206 5.58367 22.9478 6.74222 21.8278C6.8816 21.693 7.05887 21.6041 7.25024 21.5729C7.44162 21.5418 7.63793 21.57 7.81285 21.6536C14.641 24.9182 22.6771 19.8012 22.677 12.2826C22.677 6.67211 18.1129 2.01583 12.5029 1.90288C6.72147 1.78803 1.91564 6.47037 1.9017 12.2571C1.89719 14.1085 2.61955 15.5882 3.01431 17.342C3.43022 19.1903 3.21114 21.1448 2.39159 22.854Z" fill="%23009FFF"/><path d="M28.3095 32.0001C26.9129 32.0001 25.5311 31.5304 24.4319 30.6677C20.1905 32.4379 15.1452 31.6317 11.6675 28.6284C11.2702 28.2853 11.2263 27.6851 11.5694 27.2878C11.9125 26.8905 12.5126 26.8465 12.9099 27.1897C15.9944 29.8534 20.5116 30.4526 24.1876 28.6952C24.3625 28.6115 24.5588 28.5834 24.7502 28.6145C24.9416 28.6456 25.1188 28.7346 25.2582 28.8693C26.4167 29.9893 28.1065 30.3623 29.6089 29.8955C28.6421 27.879 28.5081 25.5688 29.2573 23.43C29.2641 23.4108 29.2714 23.3919 29.2794 23.373C29.8265 22.0831 30.1022 20.7122 30.0988 19.2986C30.0928 16.8061 29.2637 14.5005 27.7009 12.6308C27.3643 12.228 27.4179 11.6287 27.8207 11.292C28.2234 10.9553 28.8229 11.009 29.1595 11.4118C30.9841 13.5948 31.9928 16.394 31.9998 19.294C32.0038 20.955 31.6815 22.567 31.0419 24.0859C30.3701 26.0306 30.6791 28.1129 31.7549 29.8448C32.0462 30.3171 31.8573 30.9448 31.3701 31.1958C30.4235 31.7272 29.3786 32 28.3095 32.0001Z" fill="%23009FFF"/><path d="M12.2891 13.833C13.1197 13.833 13.7931 13.16 13.7931 12.3298C13.7931 11.4997 13.1197 10.8267 12.2891 10.8267C11.4585 10.8267 10.7852 11.4997 10.7852 12.3298C10.7852 13.16 11.4585 13.833 12.2891 13.833Z" fill="%23009FFF"/><path d="M6.74823 13.833C7.57884 13.833 8.25219 13.16 8.25219 12.3298C8.25219 11.4997 7.57884 10.8267 6.74823 10.8267C5.91761 10.8267 5.24426 11.4997 5.24426 12.3298C5.24426 13.16 5.91761 13.833 6.74823 13.833Z" fill="%23009FFF"/><path d="M17.8301 13.833C18.6608 13.833 19.3341 13.16 19.3341 12.3298C19.3341 11.4997 18.6608 10.8267 17.8301 10.8267C16.9995 10.8267 16.3262 11.4997 16.3262 12.3298C16.3262 13.16 16.9995 13.833 17.8301 13.833Z" fill="%23009FFF"/></g><defs><clipPath id="clip0_8056_42604"><rect width="36" height="36" fill="white"/></clipPath></defs></svg>');
}

mybot .profile_div {
  position: fixed;
  bottom: 0;
  right: 10px;
  cursor: pointer;
}

mybot .img-profile {
  width: 65px;
  border-radius: 50%;
  background: var(--blue, #26a6fe);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
  object-fit: scale-down;
}

mybot .col-hgt {
  /* height: 100px;
  display: flex;
  align-items: center;
  float: left;
  margin-right: 10px; */
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 24px;
  margin-bottom: 30px;
}

mybot .profile_div .row .col-hgt:last-child {
  display: none;
}

mybot .chat-txt {
  box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 10px 0 rgba(0, 0, 0, 0.12);
  padding: 15px 15px;
  border-radius: 50px;
}

/* Spinner start */
mybot .spinner {
  text-align: center;
  position: relative;
  left: 10px;
  margin-bottom: 15px;
  margin-top: 0;
  width: fit-content;
  word-wrap: break-word;
  border-radius: 6px;
  background: #e8f6fe;
  color: var(--text-mi, #182940);
  font-family: inherit;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  padding: 8px 16px;
  display: none;
}

/* mybot .spinner:before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 0px solid rgba(0, 0, 0, 0);
  border-bottom: 15px solid rgba(0, 0, 0, 0);
  border-right: 15px solid #9C27B0;
  left: -15px;
  margin-top: -7px;
} */

mybot .spinner > div {
  width: 10px;
  height: 10px;
  background-color: #182940;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  margin-right: 5px;
}

mybot .spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

mybot .spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

mybot .input-group .btn-send {
  border: none;
  background: #FFF;
  padding: 0 20px;
  box-shadow: none;
  border-top: 1px solid #f0f0f0;
}

mybot .input-group .btn-send i {
  font-size: 20px;
  color: #26a6fe;
}

@-webkit-keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}

@keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
/* Spinner End */

/* Suggestions */
mybot .suggestion {
  background: #fff;
  color: #000;
  border-radius: 3px;
  padding: 12px;
  font-size: 14px;
  font-weight: 400;
  width: 400px;
  float: left;
  box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 10px 0 rgba(0, 0, 0, 0.12);
  margin-left: 5px;
  border-top-left-radius: 0;
  margin-bottom: 20px;
  width: 100%;
  position: relative;
}

mybot .suggestion:before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 0px solid rgba(0, 0, 0, 0);
  border-bottom: 15px solid rgba(0, 0, 0, 0);
  border-right: 15px solid #fff;
  left: -15px;
  margin-top: -12px;
}

mybot .suggestion .sugg-options {
  display: block;
  background: #9c27b0;
  color: #fff;
  text-align: center;
  padding: 5px;
  margin-bottom: 5px;
  cursor: pointer;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 300;
}

mybot .suggestion .sugg-title {
  font-size: 15px;
  font-weight: 300;
  margin-bottom: 10px;
}

mybot .suggestion span:last-child {
  margin-bottom: 0;
}
/* Suggestions end */

.resultDiv {
  padding: 10px;
  overflow-y: auto;
  height: 100%;
  background: #fff;
}

.input-group {
  display:flex;
}

@media screen and (max-width: 500px) {
  mybot .resultDiv .userEnteredText,
  mybot .resultDiv .botResult,
  mybot .suggestion {
    width: 90%;
    margin-bottom: 20px;
  }
  mybot .chatCont,
  mybot .chatForm {
    width: 100%;
  }
  mybot .chatCont {
    height: 70% !important;
  }
}
/* MyBot end */