@font-face {
  font-family: Title;
  src: url("../icons/title_font.ttf");
}

html {
    height: 100%;
}

body {
    margin: 0;
    height: 100vh;
    position: relative;
}

a {
    text-decoration: none;
}

.block-page {
    display: flex;
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.block-page-content {
    overflow: scroll;
    width: 100%;
    border-left: 1px solid #cdcdcd;
}

#block-page-preloader {
    position: fixed;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 999;
    background-color: white;
}


.visible {
  visibility: visible;
  opacity: 1;
  transition: opacity 2s linear;
}

.hidden {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 2s, opacity 2s linear;
}

.block-page-pagination {
    display: flex;
    justify-content: center;
    margin: 40px;
}

.block-page-pagination-back-link,
.block-page-pagination-next-link {
    padding: 5px 10px;
    background-color: black;
    color: white;
    text-decoration: none;
    margin: 5px 10px;
    border-radius: 2px;
    font-size: 15px;
}

.block-page-pagination-count {
    align-self: center;
    font-family: Title;
}

@media only screen and (max-width: 1000px) and (min-width: 1px) {
    .block-page-content {
        border-left: 0;
    }
}


.slick-center .slider-item {
    height: 320px ;
}

.slider-dots {
    padding: 0;
    margin: 0;
    width: fit-content;
    display: flex !important;
    align-items: center;
}

.slider-dots .slick-active .dot {
    background-color: #AF272F;
}

.dot {
    height: 4px;
    width: 50px;
    margin: 0 5px;
    background-color: #cdcdcd;
    cursor: pointer;
    transition: all ease-out 0.3s;
}

.slider-dots li{
   list-style-type: none
}

.slider-links {
    display: flex;
    margin: 20px;
    justify-content: center;
    align-items: center;
}

.slick-initialized .slick-slide {
    display: flex !important;
    align-items: center;
}

.slider-wrap {
    display: flex !important;
    overflow: hidden;
    align-items: center;
    justify-content: center;
}

.slick-slide:focus {
    outline: 0;
}

.slider-item {
    height: 280px;
    width: 200px;
    overflow: hidden;
    margin: 5px;
    cursor: grab;
    transition: all ease-out 0.5s;
}


.slider-item img {
    height: 100%;
}

.slider-item-current img{
    height: 100%;
    width: 100%;
}
