@import "../../../styles/varibale.scss";

.iconRightDisplay {
    cursor:pointer;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    border-radius: 0.5em;
    transition: 0.3s;
    color: $primaryColor;
    background: whitesmoke;
    width: 3.5em;
    height: 3.5em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: -1em;
    top: calc(50% - 1.5em);
    opacity: 0.5;
  }

  .iconRightDisplay:hover{
    opacity: 1;
  }

  .iconLeftDisplay {
    cursor:pointer;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    border-radius: 0.5em;
    transition: 0.3s;
    color: $primaryColor;
    background: whitesmoke;
    width: 3.5em;
    height: 3.5em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: -1em;
    top: calc(50% - 1.5em);
    z-index: 9;
    opacity: 0.5;
  }
  
  .iconLeftDisplay:hover{
    opacity: 1;
  }