.foxesGallery {
	/*
    --s: 250px;
    --g: 30px;
    display: grid;
    width: calc(3*var(--s) + 2*var(--g));
	*/
	aspect-ratio: 1;
}

.galleryImg {
	display: block;
}

.gallery {
    position: relative;
    width: 100%;
    height: 100%;
    background: #d3c0c0e8;
    border-top: 2px solid #327014;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-font-smoothing: antialiased;
}

.gallery__viewport {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    cursor: move;
    cursor: -webkit-grab;
    cursor: -moz-grab
}

.gallery__viewport-layer {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-transition-property: left,-webkit-transform;
    transition-property: left,transform;
    transition-timing-function: cubic-bezier(.1,0,.25,1);
    transition-duration: .24s;
    z-index: 0
}

._noeffects .gallery__viewport-layer {
    transition-duration: 0
}

.gallery__viewport-layer-slide {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    text-align: center;
    white-space: nowrap
}

.gallery__viewport-layer-slide._hidden {
    display: none
}

.gallery__viewport-layer-slide._auto .gallery__viewportLayerSlideImg {
    -webkit-background-size: contain;
    background-size: contain
}

@media (max-width: 400px) {
    .gallery__viewport-layer-slide._auto .gallery__viewportLayerSlideImg {
        -webkit-background-size:cover;
        background-size: cover
    }
}

.gallery__thumbs {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 44px;
    padding: 2px 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    font-size: 0;
    width: 42px
}

.gallery__thumbs:before {
    display: inline-block;
    vertical-align: middle;
    width: 0;
    height: 100%;
    content: ''
}

.gallery__thumbs-in {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-transition-property: left,-webkit-transform;
    transition-property: left,transform;
    transition-timing-function: cubic-bezier(.1,0,.25,1);
    transition-duration: .24s;
    white-space: normal
}

._noeffects .gallery__thumbs-in {
    transition-duration: 0
}

.gallery__thumbs-in-item {
    position: relative;
    display: inline-block;
    vertical-align: top;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    outline: none;
    cursor: pointer;
    width: 42px;
    height: 64px
}

.gallery__thumbs-in-item:before {
    position: absolute;
    top: 15px;
    left: 6px;
    content: '';
    opacity: .4;
    transition: opacity .25s ease
}

.gallery__thumbs-in-item:hover:before,.gallery__thumbs-in-item._current:before {
    opacity: 1
}

.gallery__thumbs-in-item:after {
    position: absolute;
    top: 9px;
    left: 0;
    width: 42px;
    height: 45px;
    background: url(svg/i_frame.svg) top left no-repeat;
    content: '';
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0;
    -webkit-transition: opacity .25s ease,-webkit-transform .25s ease;
    transition: opacity .25s ease,transform .25s ease
}

.gallery__thumbs-in-item._current:after {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1
}

.gallery__thumbs-in-item._0:before {
    background: url(svg/i_idea.svg) top left no-repeat;
    width: 31px;
    height: 32px
}

.gallery__thumbs-in-item._1:before {
    background: url(svg/i_help.svg) top left no-repeat;
    width: 32px;
    height: 32px;
    top: 16px;
    left: 5px
}

.gallery__thumbs-in-item._2:before {
    background: url(svg/i_fun.svg) top left no-repeat;
    width: 30px;
    height: 33px
}

.gallery__thumbs-in-item._3:before {
    background: url(svg/i_education.svg) top left no-repeat;
    width: 31px;
    height: 38px;
    top: 14px
}

.gallery__thumbs-in-item._4:before {
    background: url(svg/i_grow.svg) top left no-repeat;
    width: 26px;
    height: 32px;
    top: 18px;
    left: 8px
}

.gallery__bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 6px;
    background: #1573fb;
    transition: width .24s ease;
    z-index: 1
}

.gallery._dragging .gallery__viewport {
    cursor: move;
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing
}

.gallery__slide {
    position: relative;
    width: 100%;
    height: 100%;
    white-space: normal;
    text-align: left;
    -webkit-transform: translate3d(0,0,0)
}

.gallery__slide._idea {
    background: url(images/section-idea.jpg) center center;
    background-size: cover
}

.gallery__slide._help {
    background: url(images/section-help.jpg) center center;
    background-size: cover
}

.gallery__slide._fun {
    background: url(images/section-fun.jpg) center center;
    background-size: cover
}

.gallery__slide._education {
    background: url(images/section-education.jpg) center center;
    background-size: cover
}

.gallery__slide._grow {
    background: url(images/section-grow.jpg) center center;
    background-size: cover
}

.gallery__slide-desc {
    position: absolute;
    bottom: 15%;
    right: 90px;
    left: 50%;
    max-width: 550px
}

.gallery__slide-desc-title {
    font: 80px/1 'Proxima Nova Thin',Helvetica,Arial,sans-serif;
    margin: 0 0 25px -5px
}


@-webkit-keyframes photor__preloader {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes photor__preloader {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

.photor {
    position: relative;
    width: 100%;
    height: 100%;
    margin: auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-font-smoothing: antialiased;
    overflow: hidden
}

.photor__viewport {
    position: absolute;
    padding: 5px;
    top: 0px;
    right: -1px;
    bottom: 60px;
    left: -1px;
    overflow: hidden;
}

.photor__viewportLayer {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-transition-property: left,-webkit-transform;
    transition-property: left,transform;
    transition-timing-function: cubic-bezier(.1,0,.25,1);
    transition-duration: .24s;
    z-index: 0
}

.photor__viewportLayerSlide {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    text-align: center;
    white-space: nowrap
}

.photor__viewportLayerSlide:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
    width: 0;
    font-size: 0
}

.photor__viewportLayerSlide:after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 14px;
    margin: -9px 0 0 -9px;
    visibility: hidden;
    content: '';
    border-radius: 50%;
    border: 2px solid #fff;
    border-right: 2px solid transparent;
    -webkit-animation: photor__preloader .8s linear infinite;
    animation: photor__preloader .8s linear infinite;
    opacity: 0;
    transition: all .3s ease
}

.photor__viewportLayerSlideImg {
    position: absolute;
    top: 0;
    right: 1px;
    bottom: 0;
    left: 1px;
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 1;
    transition: opacity .2s ease;
    visibility: visible;
    display: inline-block;
    vertical-align: middle
}

.photor__viewportLayerSlideImg._alt:before {
    display: block;
    content: attr(data-alt);
    background: rgba(0,0,0,.5);
    color: #fff;
    text-align: center;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 4px 0;
    font: 14px/20px Arial
}

.photor__viewportLayerSlide._loading:after {
    visibility: visible;
    opacity: 1
}

.photor__viewportLayerSlide._loading .photor__viewportLayerSlideImg {
    opacity: 0
}

.photor__viewportLayerSlide._hidden {
    display: none
}

.photor__viewportLayerSlide._auto .photor__viewportLayerSlideImg {
    -webkit-background-size: contain;
    background-size: contain
}

@media (max-width: 400px) {
    .photor__viewportLayerSlide._auto .photor__viewportLayerSlideImg {
        -webkit-background-size:cover;
        background-size: cover
    }
}

.photor__viewportLayerSlide._center {
    background-size: auto
}

.photor__viewportLayerSlide._html:before,.photor__viewportLayerSlide._html:after {
    display: none
}

.photor__viewportControl {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    cursor: move;
    cursor: -webkit-grab;
    cursor: -moz-grab
}

.photor__viewportControlPrev,.photor__viewportControlNext {
    position: absolute;
    top: 0;
    bottom: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

.photor__viewportControlPrev._disabled,.photor__viewportControlNext._disabled {
    cursor: default
}

.photor__viewportControlPrev {
    right: 70%;
    left: 0
}

.photor__viewportControlNext {
    right: 0;
    left: 30%
}

.photor__thumbs {
    position: absolute;
    height: 56px;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 2px 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    font-size: 0
}

.photor__thumbsWrap {
    position: relative;
    display: inline-block;
    text-align: left;
    height: 100%;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-transition-property: left,-webkit-transform;
    transition-property: left,transform;
    transition-timing-function: cubic-bezier(.1,0,.25,1);
    transition-duration: .24s;
    margin: 0 -1px
}

._noeffects .photor__thumbsWrap {
    transition-duration: 0
}

.photor__thumbsWrapItem {
    display: inline-block;
    vertical-align: top;
    height: 100%;
    margin: 0 1px;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    outline: none;
    cursor: pointer
}

.photor__thumbsWrapItemImg {
    width: auto;
    height: 100%;
    vertical-align: top;
    border: 0;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

.photor._dots .photor__thumbsWrapItem {
    width: 4px;
    height: 4px;
    padding: 5px;
    margin: 0
}

.photor._dots .photor__thumbsWrapItem:before {
    display: block;
    width: 4px;
    height: 4px;
    border: 1px solid gray;
    border-radius: 3px;
    content: ''
}

.photor._dots .photor__thumbsWrapItem._current:before {
    background: gray
}

.photor__thumbsWrapFrame {
    top: 0;
    height: 100%;
    position: absolute;
    transition-property: all;
    transition-duration: 5s;
    transition-timing-function: cubic-bezier(.1,0,.25,1);
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 2px solid #00afea;
    background: rgba(171,171,171,.15)
}

@media (max-device-width: 1280px) {
    .photor__thumbsWrapFrame {
        -webkit-transition-property:top,left,-webkit-transform;
        transition-property: top,left,transform
    }
}

.photor._dragging .photor__viewportControl,.photor._dragging .photor__viewportControlPrev,.photor._dragging .photor__viewportControlNext {
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
    cursor: grabbing
}

.photor._ie8 .photor__viewportLayerSlide._auto._portrait .photor__viewportLayerSlideImg {
    height: 100%;
    width: auto
}

.photor._ie8 .photor__viewportLayerSlide._auto._landscape .photor__viewportLayerSlideImg {
    height: auto;
    width: 100%
}

.photor._ie8 .photor__viewportLayerSlide._center .photor__viewportLayerSlideImg {
    height: auto;
    width: auto
}

.photor._ie8 .photor__viewportControl {
    background: url('about:blank')
}
