body {
  font-family: 'Noto Kufi Arabic', Arial, sans-serif;
}

[class^="number-slide"],
[class*=" number-slide"] {
background: grey;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
    -ms-flex-align: center;
        align-items: center;
-webkit-box-pack: center;
    -ms-flex-pack: center;
        justify-content: center;
font-size: 50px;
color: #fff;
font-weight: 500;
height: 300px;
max-height: 100vh;
}


.navigation-wrapper {
position: relative;
}

.dots {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 10px 0;
-webkit-box-pack: center;
    -ms-flex-pack: center;
        justify-content: center;
}

.dot {
border: none;
width: 10px;
height: 10px;
background: #c5c5c5;
border-radius: 50%;
margin: 0 5px;
padding: 5px;
cursor: pointer;
}

.dot:focus {
outline: none;
}

.dot--active {
background: #000;
}

.arrow {
width: 30px;
height: 30px;
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
    transform: translateY(-50%);
-webkit-transform: translateY(-50%);
fill: #fff;
cursor: pointer;
}

.arrow--left {
left: 5px;
fill: "#fff";
background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' %3E%3Cpath d='M16.67 0l2.83 2.829-9.339 9.175 9.339 9.167-2.83 2.829-12.17-11.996z' %3E%3C/path%3E%3C/svg%3E");
}

.arrow--right {
left: auto;
right: 5px;
background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg'  viewBox='0 0 24 24' %3E%3Cpath d='M5 3l3.057-3 11.943 12-11.943 12-3.057-3 9-9z'%3E%3C/path%3E%3C/svg%3E");
}

.arrow--disabled.arrow--left {
background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='grey' viewBox='0 0 24 24' %3E%3Cpath d='M16.67 0l2.83 2.829-9.339 9.175 9.339 9.167-2.83 2.829-12.17-11.996z' %3E%3C/path%3E%3C/svg%3E");
}

.arrow--disabled.arrow--right {
background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='grey' viewBox='0 0 24 24' %3E%3Cpath d='M5 3l3.057-3 11.943 12-11.943 12-3.057-3 9-9z'%3E%3C/path%3E%3C/svg%3E");
}

.thumbnail .keen-slider__slide {
    font-size: 30px;
    margin-top: 10px;
    height: 100px;
  }
  .thumbnail .keen-slider__slide {
    cursor: pointer;
  }
  .thumbnail .keen-slider__slide.active {
    border: 2px dashed black;
  }