/*          flexing paginate arrows        */
.quotes button {
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  outline: 0;
  top: 40%;
}
.paginate {
  position: relative;
  margin: 10px;
  width: 50px;
  height: 50px;
  cursor: pointer;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  position: absolute;
  top: 50%;
  margin-top: -20px;
  -webkit-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.2));
}
 .paginate i {
   position: absolute;
   top: 40%;
   left: 0;
   width: 50px;
   height: 5px;
   border-radius: 2.5px;
   background: rgb(69,190,194);
   -webkit-transition: all 0.15s ease;
   -moz-transition: all 0.15s ease;
   -ms-transition: all 0.15s ease;
   transition: all 0.15s ease;
 }
.paginate.left {  left: 0 }
 .paginate.left i {
   -webkit-transform-origin: 0% 50%;
   -moz-transform-origin: 0% 50%;
   -ms-transform-origin: 0% 50%;
   transform-origin: 0% 50%;
 }
 .paginate.left i:first-child {
   -webkit-transform: translate(0, -1px) rotate(40deg);
   -moz-transform: translate(0, -1px) rotate(40deg);
   -ms-transform: translate(0, -1px) rotate(40deg);
   transform: translate(0, -1px) rotate(40deg);
 }
 .paginate.left i:last-child {
   -webkit-transform: translate(0, 1px) rotate(-40deg);
   -moz-transform: translate(0, 1px) rotate(-40deg);
   -ms-transform: translate(0, 1px) rotate(-40deg);
   transform: translate(0, 1px) rotate(-40deg);
 }
.paginate.left:hover i:first-child {
  -webkit-transform: translate(0, -1px) rotate(30deg);
  -moz-transform: translate(0, -1px) rotate(30deg);
  -ms-transform: translate(0, -1px) rotate(30deg);
  transform: translate(0, -1px) rotate(30deg);
}
.paginate.left:hover i:last-child {
  -webkit-transform: translate(0, 1px) rotate(-30deg);
  -moz-transform: translate(0, 1px) rotate(-30deg);
  -ms-transform: translate(0, 1px) rotate(-30deg);
  transform: translate(0, 1px) rotate(-30deg);
}
.paginate.left:active i:first-child {
  -webkit-transform: translate(1px, -1px) rotate(25deg);
  -moz-transform: translate(1px, -1px) rotate(25deg);
  -ms-transform: translate(1px, -1px) rotate(25deg);
  transform: translate(1px, -1px) rotate(25deg);
}
.paginate.left:active i:last-child {
  -webkit-transform: translate(1px, 1px) rotate(-25deg);
  -moz-transform: translate(1px, 1px) rotate(-25deg);
  -ms-transform: translate(1px, 1px) rotate(-25deg);
  transform: translate(1px, 1px) rotate(-25deg);
}

.paginate.right {  right: 0 }
 .paginate.right i {
   -webkit-transform-origin: 100% 50%;
   -moz-transform-origin: 100% 50%;
   -ms-transform-origin: 100% 50%;
   transform-origin: 100% 50%;
 }
 .paginate.right i:first-child {
   -webkit-transform: translate(0, 1px) rotate(40deg);
   -moz-transform: translate(0, 1px) rotate(40deg);
   -ms-transform: translate(0, 1px) rotate(40deg);
   transform: translate(0, 1px) rotate(40deg);
 }
 .paginate.right i:last-child {
   -webkit-transform: translate(0, -1px) rotate(-40deg);
   -moz-transform: translate(0, -1px) rotate(-40deg);
   -ms-transform: translate(0, -1px) rotate(-40deg);
   transform: translate(0, -1px) rotate(-40deg);
 }
.paginate.right:hover i:first-child {
  -webkit-transform: translate(0, 1px) rotate(30deg);
  -moz-transform: translate(0, 1px) rotate(30deg);
  -ms-transform: translate(0, 1px) rotate(30deg);
  transform: translate(0, 1px) rotate(30deg);
}
.paginate.right:hover i:last-child {
  -webkit-transform: translate(0, -1px) rotate(-30deg);
  -moz-transform: translate(0, -1px) rotate(-30deg);
  -ms-transform: translate(0, -1px) rotate(-30deg);
  transform: translate(0, -1px) rotate(-30deg);
}
.paginate.right:active i:first-child {
  -webkit-transform: translate(1px, 1px) rotate(25deg);
  -moz-transform: translate(1px, 1px) rotate(25deg);
  -ms-transform: translate(1px, 1px) rotate(25deg);
  transform: translate(1px, 1px) rotate(25deg);
}
.paginate.right:active i:last-child {
  -webkit-transform: translate(1px, -1px) rotate(-25deg);
  -moz-transform: translate(1px, -1px) rotate(-25deg);
  -ms-transform: translate(1px, -1px) rotate(-25deg);
  transform: translate(1px, -1px) rotate(-25deg);
}

.quotes .counter {
  text-align: center;
  position: absolute;
  width: 100%;
  top: 50%;
  margin-top: -15px;
  font-size: 30px;
  text-shadow: 0px 2px 0px rgba(0, 0, 0, 0.2);
  color: #fff;
  display: none;
}
/*          flexing-pagination END    */