﻿.sidefeedback-proper {
  position: fixed;
  width: 400px;
  height: 490px;
  background: #FFF;
  right: -444px;
  -webkit-transition: 0.7s cubic-bezier(0, 0, 0.2, 1);
  transition: 0.7s cubic-bezier(0, 0, 0.2, 1);
  top: 50%;
  -webkit-transform: translatey(-50%);
          transform: translatey(-50%);
  z-index: 300;
  -webkit-box-shadow: 0 1px 2px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 2px 2px rgba(0, 0, 0, 0.2);
  background: #f8f7f7;
  z-index: 10000;
  color: #100f0f;
}
.sidefeedback-proper .support-home h2 {
  margin-top: 0px;
}
.sidefeedback-proper .formQuestion {
  width: 100% !important;
  margin-bottom: 2px;
}
.sidefeedback-proper textarea {
  resize: none !important;
}
.sidefeedback-proper .side-btn {
  position: absolute;
  left: -93px;
  top: 74px;
  background: #007dcb;
  width: auto;
  height: auto;
  padding: 10px 16px 10px 40px;
  text-align: center;
  word-break: break-all;
  line-height: 1.0;
  color: #FFF;
  text-transform: uppercase;
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
  -webkit-box-shadow: -1px 1px 2px 2px rgba(0, 0, 0, 0.2);
          box-shadow: -1px 1px 2px 2px rgba(0, 0, 0, 0.2);
  -webkit-transform: rotate(270deg) translateY(-50%);
          transform: rotate(270deg) translateY(-50%);
  border-radius: 8px 8px 0px 0px;
  font-family: "Frutiger",Arial,sans-serif;
}
.sidefeedback-proper .side-btn:hover {
  cursor: pointer;
}
@media (max-width: 768px) {
  .sidefeedback-proper .side-btn {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    border-radius: 8px 8px 0px 0px;
    top: -35px;
    left: 7px;
    border-radius: 8px 8px 0px 0px;
    padding: 8px 50px;
    font-size: 16px;
    width: 100%;
    left: 0px;
    right: 0px;
    padding: 10px 0px;
    -webkit-box-shadow: 1px -1px 2px 2px rgba(0, 0, 0, 0.2);
            box-shadow: 1px -1px 2px 2px rgba(0, 0, 0, 0.2);
  }
}
.sidefeedback-proper .side-btn:after {
  position: absolute;
  content: '';
  bottom: 9px;
  left: 11px;
  width: 20px;
  height: 20px;
  background-image: url("../img/chatbubble.png");
  background-repeat: no-repeat;
  background-size: contain;
}
@media (max-width: 600px) {
  .sidefeedback-proper .side-btn:after {
    bottom: 9px;
    left: 11px;
  }
}
.sidefeedback-proper .side-btn.shakes {
  -webkit-animation: shake_ 500ms 2 ease-in-out 1500ms;
          animation: shake_ 500ms 2 ease-in-out 1500ms;
}
.sidefeedback-proper .side-btn.shakes2 {
  -webkit-animation: shake2 500ms 2 ease-in-out 1500ms;
          animation: shake2 500ms 2 ease-in-out 1500ms;
}
.sidefeedback-proper.closed {
  right: -402px !important;
}
.sidefeedback-proper.opened {
  right: 0px !important;
}
.sidefeedback-proper.peeking {
  right: -237px !important;
}
@media (max-width: 768px) {
  .sidefeedback-proper {
    width: 100%;
    top: unset;
    bottom: -526px;
    left: 0px;
    right: unset;
    -webkit-transform: rotate(0deg) translateY(0);
            transform: rotate(0deg) translateY(0);
  }
  .sidefeedback-proper.closed {
    right: unset !important;
    bottom: -492px !important;
  }
  .sidefeedback-proper.peeking {
    right: unset !important;
    bottom: -396px !important;
  }
  .sidefeedback-proper.opened {
    right: unset !important;
    bottom: 0px !important;
  }
}
.sidefeedback-block {
  position: relative;
  padding: 20px;
}
.sidefeedback-block h2 {
  margin-top: 0px !important;
}
.sidefeedback-close {
  position: absolute;
  background-image: url("../img/x-circle.svg");
  background-repeat: no-repeat;
  background-size: contain;
  top: 20px;
  right: 20px;
  width: 30px;
  height: 30px;
}
.sidefeedback-close:hover {
  cursor: pointer;
}
@media (max-width: 768px) {
  .sidefeedback-close {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }
}

@-webkit-keyframes shake_ {
  0% {
    -webkit-transform: rotate(270deg) translate(0px, -50%);
            transform: rotate(270deg) translate(0px, -50%);
  }
  10% {
    -webkit-transform: rotate(270deg) translate(3px, -50%);
            transform: rotate(270deg) translate(3px, -50%);
  }
  20% {
    -webkit-transform: rotate(270deg) translate(6px, -50%);
            transform: rotate(270deg) translate(6px, -50%);
  }
  30% {
    -webkit-transform: rotate(270deg) translate(0px, -50%);
            transform: rotate(270deg) translate(0px, -50%);
  }
  40% {
    -webkit-transform: rotate(270deg) translate(-3px, -50%);
            transform: rotate(270deg) translate(-3px, -50%);
  }
  50% {
    -webkit-transform: rotate(270deg) translate(-6px, -50%);
            transform: rotate(270deg) translate(-6px, -50%);
  }
  60%, 100% {
    -webkit-transform: rotate(270deg) translate(0px, -50%);
            transform: rotate(270deg) translate(0px, -50%);
  }
}

@keyframes shake_ {
  0% {
    -webkit-transform: rotate(270deg) translate(0px, -50%);
            transform: rotate(270deg) translate(0px, -50%);
  }
  10% {
    -webkit-transform: rotate(270deg) translate(3px, -50%);
            transform: rotate(270deg) translate(3px, -50%);
  }
  20% {
    -webkit-transform: rotate(270deg) translate(6px, -50%);
            transform: rotate(270deg) translate(6px, -50%);
  }
  30% {
    -webkit-transform: rotate(270deg) translate(0px, -50%);
            transform: rotate(270deg) translate(0px, -50%);
  }
  40% {
    -webkit-transform: rotate(270deg) translate(-3px, -50%);
            transform: rotate(270deg) translate(-3px, -50%);
  }
  50% {
    -webkit-transform: rotate(270deg) translate(-6px, -50%);
            transform: rotate(270deg) translate(-6px, -50%);
  }
  60%, 100% {
    -webkit-transform: rotate(270deg) translate(0px, -50%);
            transform: rotate(270deg) translate(0px, -50%);
  }
}
@-webkit-keyframes shake2 {
  0% {
    -webkit-transform: rotate(0deg) translateX(0);
            transform: rotate(0deg) translateX(0);
  }
  10% {
    -webkit-transform: rotate(0deg) translateX(3px);
            transform: rotate(0deg) translateX(3px);
  }
  20% {
    -webkit-transform: rotate(0deg) translateX(6px);
            transform: rotate(0deg) translateX(6px);
  }
  30% {
    -webkit-transform: rotate(0deg) translateX(-3px);
            transform: rotate(0deg) translateX(-3px);
  }
  40% {
    -webkit-transform: rotate(0deg) translateX(-6px);
            transform: rotate(0deg) translateX(-6px);
  }
  50% {
    -webkit-transform: rotate(0deg) translateX(-3px);
            transform: rotate(0deg) translateX(-3px);
  }
  60%, 100% {
    -webkit-transform: rotate(0deg) translateX(0);
            transform: rotate(0deg) translateX(0);
  }
}
@keyframes shake2 {
  0% {
    -webkit-transform: rotate(0deg) translateX(0);
            transform: rotate(0deg) translateX(0);
  }
  10% {
    -webkit-transform: rotate(0deg) translateX(3px);
            transform: rotate(0deg) translateX(3px);
  }
  20% {
    -webkit-transform: rotate(0deg) translateX(6px);
            transform: rotate(0deg) translateX(6px);
  }
  30% {
    -webkit-transform: rotate(0deg) translateX(-3px);
            transform: rotate(0deg) translateX(-3px);
  }
  40% {
    -webkit-transform: rotate(0deg) translateX(-6px);
            transform: rotate(0deg) translateX(-6px);
  }
  50% {
    -webkit-transform: rotate(0deg) translateX(-3px);
            transform: rotate(0deg) translateX(-3px);
  }
  60%, 100% {
    -webkit-transform: rotate(0deg) translateX(0);
            transform: rotate(0deg) translateX(0);
  }
}
/* Override search CSS */
.ola-search-dropdown-active .ola-search-dropdown {
  z-index: 10001;
}