/**
 * @file.
 * Provided basic styling for the Slick based on custom settings.
 */

.slick-wrapper,
.slick,
.slick * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.slick img {
    height: auto;
}

.slick img,
.slick iframe {
    border: 0;
    max-width: 100%;
}

/* Prevents overflowing nested slides. */

.slick,
.slick-wrapper {
    max-width: 100%;
    position: relative;
}

/**
 * Misc overrides core slick.
 */

.slick-initialized {
    overflow: visible;
}

.slick__slider::before,
.slick__slider::after {
    display: table;
    content: '';
}

.slick__slider::after {
    clear: both;
}

/** Draggable. */

.draggable {
    cursor: -webkit-grab;
    cursor: grab;
}

.draggable:active {
    cursor: -webkit-grabbing;
    cursor: grabbing;
}

.draggable:active a,
.draggable:active .slide__caption {
    cursor: -webkit-grabbing;
    cursor: grabbing;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

/** Visibility fix for stacking slides during initialization. */

.slick__slide {
    max-width: 100%;
    position: absolute;
    visibility: hidden;
}

/** Prevents collapsing container during initialization. */

.slick__slide.slide--0 {
    position: relative;
}

.unslick .slick__slide,
.slick-initialized .slick__slide {
    position: relative;
    visibility: visible;
}

/* Fix for Chrome blue outline */

.slick__slide:focus {
    outline: 0;
    /* csslint allow: outline-none */
}

/* Prevents collapsing slick when unslick like one item. */

.unslick .slick__slide {
    width: 100%;
}

.slick-current {
    z-index: 4;
}

/**
 * Slide layouts, adjust accordingly per actual container slide.
 */

.slide__content,
.grid__content {
    position: relative;
}

.slide__content::after {
    content: "";
    display: table;
    clear: both;
}

.slide__title {
    margin: 10px 0 5px;
    line-height: 1.2;
}

.slide__link {
    margin: 30px auto;
}

/* Overrides .slick-slider to make caption text selectable. */

.slide__caption {
    cursor: text;
    -moz-user-select: text;
    -ms-user-select: text;
    -o-user-select: text;
    -webkit-user-select: text;
    user-select: text;
    width: 100%;
}

/* Only display when JS is ready. */

.slick__arrow,
.is-loading .slide__caption {
    visibility: hidden;
}

/** Arrows are outside slick-initialized. */

.slick--initialized .slick__arrow {
    visibility: visible;
}

.slick--main .slide__caption {
    min-height: 32%;
    padding: 20px 0;
    z-index: 3;
}

.slick--thumbnail .slide__caption {
    padding: 5px 6px;
}

/**
 * Skins.
 * Arrows contained/wrapped within slick__arrow for easy moves.
 */

/* Overrides problematic hidden arrows at core slick.css */

.slick-prev {
    left: 0;
}

.slick-next {
    right: 0;
}

.slick__arrow {
    bottom: auto;
    height: 2px;
    left: 0;
    margin-top: -1px;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 2;
}

/** Keeps decent fallback for when slick-theme.css is disabled, even if dup. */

.slick-arrow {
    border: 0;
    border-radius: 50%;
    font-size: 0;
    height: 42px;
    pointer-events: auto;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 42px;
}

.slick-arrow:active,
.slick-arrow:focus {
    box-shadow: none;
    outline: 0;
}

.slick-arrow::before,
.slick-arrow::after {
    pointer-events: none;
}

.slick-arrow::before {
    color: #ff6d2c;
    font-size: 36px;
    font-size: 2.25rem;
}

.slick-arrow:hover::before {
    color: #37465b;
}

/**
 * Bullets.
 */

/* Makes the pointer work when bullets placed over the slide. */

/* Overrides core > 1.3.11, otherwise thumbnails are non-clickable */

.slick button,
.slick--thumbnail .slick__slide img {
    pointer-events: auto;
}

/* Provides decent dots if core slick-theme.css is disabled. */

.slick-dots li {
    margin-bottom: 5px;
    display: inline-block;
    vertical-align: top;
}

/* Overrides too tiny bullets from core slick.css.*/

.slick-dots li button::before {
    font-size: 12px;
    font-size: 0.75rem;
}

/**
 * Media.
 */

/* Hide lazyloaded image when JS is off.*/

img[data-lazy] {
    display: none;
}

.slide__media {
    overflow: hidden;
    position: relative;
}

/* Center the image to reduce gap at RHS with smaller image, larger container */

.media__image {
    margin: 0 auto;
}

/** @todo: Remove temp fix for when total <= slidesToShow at 1.6.1+. */

/** @see https://github.com/kenwheeler/slick/issues/262 */

.slick--less .slick-track {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.slick--less .slick-slide {
    float: none;
    display: inline-block;
    vertical-align: top;
}

.slick--less .draggable {
    cursor: default;
}