/*https://preview.codecanyon.net/item/zoomtimeline-css-timeline-pack/full_screen_preview/16918891?ref=taqmaninwmak*/

.zoomtimeline {
    margin-bottom: 30px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
.zoomtimeline * {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
.zoomtimeline .items {
    opacity: 0;
    visibility: hidden;
    transition-property: opacity, visibility;
    transition-duration: 0.3s;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: opacity, visibility;
    -o-transition-duration: 0.3s;
    -ms-transition-property: opacity, visibility;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline .ztm-item {
    display: block; }
.zoomtimeline .clear {
    display: block;
    clear: both; }
.zoomtimeline .the-heading {
    margin-bottom: 20px; }
.zoomtimeline p {
    margin-bottom: 15px; }
.zoomtimeline .scroller-con.skin_luna {
    margin-bottom: 0px; }
.zoomtimeline .scroller-con.skin_luna .scrollbar {
    height: 20px;
    position: absolute;
    top: 0;
    bottom: auto;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.1);
    overflow: hidden; }
.zoomtimeline .scroller-con.dragging {
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
    cursor: grabbing; }
.zoomtimeline .scroller-con.dragging .scrollbar .scrollbarx {
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
    cursor: grabbing; }
.zoomtimeline .scroller-con.skin_luna .scrollbarx {
    margin-top: 2px;
    border-radius: 3px;
    top: 0;
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: grab; }
.zoomtimeline .scroller-con.skin_luna .scrollbarx .the-year {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #444;
    font-weight: bold;
    font-size: 10px; }
.zoomtimeline .scroller-con.skin_luna .scrollbarx_bg {
    margin-top: 0px;
    top: 0;
    background-color: rgba(200, 200, 200, 0.4); }
.zoomtimeline a {
    color: #cb1919; }
.zoomtimeline .thumbs-gallery-con {
    padding: 5px 5px 0;
    margin-left: -2px;
    margin-right: -2px;
    position: relative;
    background-color: rgba(20, 20, 20, 0.5);
    display: inline-block; }
.zoomtimeline .thumbs-gallery-con .thumb-smoothie {
    position: relative;
    width: 45px;
    height: 45px; }
.zoomtimeline .thumbs-gallery-con:before {
    content: "";
    position: absolute;
    top: 0px;
    left: 2px;
    width: calc(100% - 4px);
    height: 100%; }
.zoomtimeline .preloader-wave {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
    visibility: visible;
    transition-property: opacity, visibility;
    transition-duration: 0.3s;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: opacity, visibility;
    -o-transition-duration: 0.3s;
    -ms-transition-property: opacity, visibility;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline .preloader-wave span {
    display: block;
    bottom: 0px;
    width: 9px;
    height: 5px;
    background: #dddddd;
    position: absolute;
    animation: preloader_audio 1.5s  infinite ease-in-out; }
.zoomtimeline .preloader-wave span:nth-child(2) {
    left: 11px;
    animation-delay: .2s; }
.zoomtimeline .preloader-wave span:nth-child(3) {
    left: 22px;
    animation-delay: .4s; }
.zoomtimeline .preloader-wave span:nth-child(4) {
    left: 33px;
    animation-delay: .6s; }
.zoomtimeline .preloader-wave span:nth-child(5) {
    left: 44px;
    animation-delay: .8s; }
@keyframes preloader_audio {
    0% {
        height: 5px;
        transform: translateY(0px);
        background: #BF959D; }
    25% {
        height: 30px;
        transform: translateY(15px);
        background: #BF959D; }
    50% {
        height: 5px;
        transform: translateY(0px);
        background: #cccccc; }
    100% {
        height: 5px;
        transform: translateY(0px);
        background: #aaaaaa; } }
.zoomtimeline .overflow-it {
    overflow: hidden;
    width: auto; }

.zoomtimeline.content-position-bottom .scroller-con.skin_luna .scrollbar {
    top: auto;
    bottom: 0; }

.zoomtimeline.ztm-ready .preloader-wave {
    opacity: 0;
    visibility: hidden; }
.zoomtimeline.ztm-ready .items {
    opacity: 1;
    visibility: visible; }

.zoomtimeline:after {
    content: "";
    clear: both;
    display: block; }

.zoomtimeline.mode-default {
    line-height: 1;
    position: relative; }
.zoomtimeline.mode-default p {
    line-height: 1.6; }
.zoomtimeline.mode-default .ztm-item {
    position: relative;
    margin-bottom: 30px; }
.zoomtimeline.mode-default .ztm-item .hex-icon {
    position: absolute;
    top: 10px;
    left: 15px;
    width: 40px;
    height: 23.09px;
    background-color: #ddd;
    margin: 11.55px 0; }
.zoomtimeline.mode-default .ztm-item .hex-icon:before,
.zoomtimeline.mode-default .ztm-item .hex-icon:after {
    content: "";
    position: absolute;
    width: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent; }
.zoomtimeline.mode-default .ztm-item .hex-icon:before {
    bottom: 100%;
    border-bottom: 11.55px solid #ddd; }
.zoomtimeline.mode-default .ztm-item .hex-icon:after {
    top: 100%;
    width: 0;
    border-top: 11.55px solid #ddd; }
.zoomtimeline.mode-default .ztm-item .hex-icon .the-icon {
    font-size: 16px;
    color: #777;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
.zoomtimeline.mode-default .ztm-item .ztm-content {
    padding: 10px 0 20px;
    position: relative;
    left: 0px;
    padding-left: 100px; }
.zoomtimeline.mode-default .ztm-item .ztm-content > *:first-child.the-heading {
    margin-top: 0; }
.zoomtimeline.mode-default .ztm-item .hex-desc-con {
    width: 70px;
    position: absolute;
    top: 68px;
    height: 30px; }
.zoomtimeline.mode-default .ztm-item .hex-desc-con .hex-desc {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 9px;
    text-transform: uppercase;
    font-weight: 900;
    font-family: "Lato", "Open Sans", "Helvetica", serif;
    background-color: #ddd;
    color: #777;
    padding: 5px 3px;
    white-space: nowrap; }
.zoomtimeline.mode-default .thumbs-gallery-con {
    background-color: rgba(0, 0, 0, 0.12); }

.zoomtimeline.mode-default:before {
    content: "";
    height: 100%;
    width: 1px;
    background-color: #ddd;
    opacity: 0.5;
    position: absolute;
    left: 34px; }

.zoomtimeline.mode-default.under-400 {
    padding-top: 15px; }
.zoomtimeline.mode-default.under-400 .hex-icon {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    top: 3px;
    left: 4px; }
.zoomtimeline.mode-default.under-400 .hex-icon > .the-icon {
    display: none; }
.zoomtimeline.mode-default.under-400 .hex-icon:before, .zoomtimeline.mode-default.under-400 .hex-icon:after {
    display: none; }
.zoomtimeline.mode-default.under-400 .hex-desc-con {
    top: -13px;
    left: -5px; }
.zoomtimeline.mode-default.under-400 .hex-desc-con:before {
    content: "";
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #ddd;
    position: absolute;
    top: 19px;
    left: 9px; }
.zoomtimeline.mode-default.under-400 .ztm-item .ztm-content {
    padding-left: 15px; }

.zoomtimeline.mode-default.under-400:before {
    left: 7px; }

.zoomtimeline.mode-oncenter {
    position: relative;
    padding-bottom: 15px; }
.zoomtimeline.mode-oncenter .hex-desc-con {
    position: absolute;
    left: 50%;
    width: 100px;
    margin-left: -50px;
    text-align: center;
    padding: 5px;
    background-color: white;
    font-size: 15px;
    color: #555555;
    font-weight: bold;
    font-family: "Lato", serif;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;}
.zoomtimeline.mode-oncenter .hex-desc-con .hex-desc {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
.zoomtimeline.mode-oncenter .ztm-item {
    position: relative;
    margin-bottom: 50px; }
.zoomtimeline.mode-oncenter .ztm-item .the-image-con {
    width: calc(50% - 60px);
    float: right;
    text-align: left;
    position: relative;
    top: 15px; }
.zoomtimeline.mode-oncenter .ztm-item .the-image-con .the-image {
    display: inline-block;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    border: 1px solid rgba(20, 20, 20, 0.3);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5);
    background-size: cover;
    background-position: center center; }
.zoomtimeline.mode-oncenter .ztm-item .ztm-content {
    width: calc(50% - 60px);
    text-align: right;
    float: left; }
.zoomtimeline.mode-oncenter .ztm-item .ztm-content p:last-child {
    margin-bottom: 0; }
.zoomtimeline.mode-oncenter .ztm-item .the-heading {
    margin-top: 45px;
    margin-bottom: 8px;
    word-wrap: break-word;}
.zoomtimeline.mode-oncenter .ztm-item:before {
    content: "";
    position: absolute;
    top: 68px;
    left: 50%;
    width: 46px;
    height: 1px;
    margin-left: 1px;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&amp;0.5+1,0+100 */
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 1%, rgba(255, 255, 255, 0) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 1%, rgba(255, 255, 255, 0) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 1%, rgba(255, 255, 255, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ffffff', endColorstr='#00ffffff',GradientType=1 );
    /* IE6-9 */ }
.zoomtimeline.mode-oncenter .ztm-item:after {
    content: "";
    position: absolute;
    top: 125px;
    left: 50%;
    width: 46px;
    height: 1px;
    margin-left: -46px;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&amp;0+0,0.5+99 */
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 99%, rgba(255, 255, 255, 0.5) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 99%, rgba(255, 255, 255, 0.5) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 99%, rgba(255, 255, 255, 0.5) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#80ffffff',GradientType=1 );
    /* IE6-9 */ }
.zoomtimeline.mode-oncenter .ztm-item:nth-child(odd) .ztm-content {
    float: right;
    text-align: left; }
.zoomtimeline.mode-oncenter .ztm-item:nth-child(odd) .the-image-con {
    float: left;
    text-align: right; }
.zoomtimeline.mode-oncenter .ztm-item:nth-child(even):after {
    top: 70px; }
.zoomtimeline.mode-oncenter .ztm-item:nth-child(even):before {
    top: 115px; }
.zoomtimeline.mode-oncenter .ztm-item.no-image:nth-child(even):before {
    display: none; }
.zoomtimeline.mode-oncenter .ztm-item.no-image:nth-child(odd):after {
    display: none; }

.zoomtimeline.mode-oncenter:before {
    content: "";
    height: 100%;
    width: 1px;
    background-color: #fff;
    opacity: 0.5;
    position: absolute;
    left: 50%; }

.zoomtimeline.mode-oncenter.skin-dark .hex-desc-con {
    background-color: #1e1e1e;
    color: #FFFFFF; }
.zoomtimeline.mode-oncenter.skin-dark .thumbs-gallery-con {
    background-color: rgba(20, 20, 20, 0.15); }
.zoomtimeline.mode-oncenter.skin-dark .ztm-item:before {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#383838+0,303030+100&amp;0.5+1,0+99,0+100 */
    background: -moz-linear-gradient(left, rgba(56, 56, 56, 0.5) 0%, rgba(56, 56, 56, 0.5) 1%, rgba(48, 48, 48, 0) 99%, rgba(48, 48, 48, 0) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(56, 56, 56, 0.5) 0%, rgba(56, 56, 56, 0.5) 1%, rgba(48, 48, 48, 0) 99%, rgba(48, 48, 48, 0) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(20, 20, 20, 0.5) 0%, rgba(15, 15, 15, 0.5) 1%, rgba(48, 48, 48, 0) 99%, rgba(20, 20, 20, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80383838', endColorstr='#00303030',GradientType=1 );
    /* IE6-9 */ }
.zoomtimeline.mode-oncenter.skin-dark .ztm-item:after {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#303030+0,383838+100&amp;0+0,0+1,0.5+99 */
    background: -moz-linear-gradient(left, rgba(48, 48, 48, 0) 0%, rgba(48, 48, 48, 0) 1%, rgba(56, 56, 56, 0.5) 99%, rgba(56, 56, 56, 0.5) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(48, 48, 48, 0) 0%, rgba(48, 48, 48, 0) 1%, rgba(56, 56, 56, 0.5) 99%, rgba(56, 56, 56, 0.5) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(20, 20, 20, 0) 0%, rgba(15, 15, 15, 0) 1%, rgba(20, 20, 20, 0.5) 99%, rgba(20, 20, 20, 0.5) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00303030', endColorstr='#80383838',GradientType=1 );
    /* IE6-9 */ }
.zoomtimeline.mode-oncenter.skin-dark .the-image-con .the-image {
    border: 1px solid rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.5); }

.zoomtimeline.mode-oncenter.skin-dark:before {
    background-color: #222222; }

.zoomtimeline.mode-slider .ztm-item {
    display: none; }
.zoomtimeline.mode-slider .scroller-con {
    margin-bottom: 0; }
.zoomtimeline.mode-slider a {
    padding: 2px 4px;
    background-color: #f9f2f4;
    font-size: 11px; }
.zoomtimeline.mode-slider .feature-image {
    background-size: cover;
    width: 120px;
    height: 120px;
    margin-bottom: 15px;
    border: 3px solid #222; }
.zoomtimeline.mode-slider .inner > img {
    max-width: none; }
.zoomtimeline.mode-slider .the-item {
    display: inline-block;
    white-space: normal;
    vertical-align: bottom;
    padding: 0 15px;
    position: relative; }
.zoomtimeline.mode-slider .the-item .hex-desc {
    font-size: 11px;
    font-weight: bold;
    font-family: "Lato",serif; }
.zoomtimeline.mode-slider .the-item h3 {
    margin-top: 7px;
    margin-bottom: 15px;
    font-size: 23px;
    font-weight: 200;
    color: #A08E2A;
    font-family: "Raleway",serif; }
.zoomtimeline.mode-slider .the-item p {
    font-style: italic; }
.zoomtimeline.mode-slider .the-item .the-content:last-child p:last-child {
    margin-bottom: 0; }
.zoomtimeline.mode-slider .the-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: calc(100% + 19px);
    border-left: 1px dashed rgba(50, 50, 50, 0.1); }
.zoomtimeline.mode-slider .inner {
    padding-bottom: 20px; }
.zoomtimeline.mode-slider .inner > .the-item:first-child:before {
    display: none; }
.zoomtimeline.mode-slider .scrollbar {
    position: relative;
    top: -20px; }
.zoomtimeline.mode-slider .sc-descriptions-content > .the-item:first-child:before {
    display: none; }
.zoomtimeline.mode-slider .sc-descriptions {
    white-space: nowrap;
    width: 100%;
    overflow: hidden; }
.zoomtimeline.mode-slider .sc-descriptions .sc-descriptions-content {
    white-space: nowrap;
    display: inline-block;
    position: relative; }
.zoomtimeline.mode-slider .sc-descriptions .the-item {
    display: inline-block;
    vertical-align: top;
    position: relative;
    padding-top: 20px;
    transition-property: color, background;
    transition-duration: 0.3s;
    -moz-transition-property: color, background;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: color, background;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: color, background;
    -o-transition-duration: 0.3s;
    -ms-transition-property: color, background;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-slider .sc-descriptions .the-item > .the-content {
    position: relative; }
.zoomtimeline.mode-slider .sc-descriptions .the-item > .the-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition-property: color, background;
    transition-duration: 0.3s;
    -moz-transition-property: color, background;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: color, background;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: color, background;
    -o-transition-duration: 0.3s;
    -ms-transition-property: color, background;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-slider .sc-descriptions .the-item:before {
    top: -30px; }

.zoomtimeline.mode-slider.skin-light .scroller-con.skin_cerc .scrollbarx_bg {
    background-color: rgba(255, 255, 255, 0.3); }
.zoomtimeline.mode-slider.skin-light .the-item:before {
    border-left-color: rgba(255, 255, 255, 0.3); }

.zoomtimeline.mode-slider-variation a {
    color: #cb1919;
    background-color: rgba(214, 189, 189, 0.3);
    padding: 1px 3px;
    display: inline-block; }
.zoomtimeline.mode-slider-variation .ztm-item {
    display: none; }
.zoomtimeline.mode-slider-variation > .scroller-con {
    background-color: #FFFFFF; }
.zoomtimeline.mode-slider-variation .inner > img {
    max-width: none; }
.zoomtimeline.mode-slider-variation .hexa-mark-con {
    position: absolute;
    top: 5px;
    width: auto;
    height: 9px;
    cursor: pointer; }
.zoomtimeline.mode-slider-variation .hexa-mark-con .hexa-content {
    background-color: white;
    color: #222222;
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    padding: 4px 12px;
    font-size: 10px;
    font-weight: 300;
    max-width: 140px;
    opacity: 0;
    visibility: hidden;
    transition-property: opacity, visibility;
    transition-duration: 0.3s;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: opacity, visibility;
    -o-transition-duration: 0.3s;
    -ms-transition-property: opacity, visibility;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-slider-variation .hexa-mark-con .hexa-content > span {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block; }
.zoomtimeline.mode-slider-variation .hexa-mark-con .hexa-content:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    width: 0;
    height: 0;
    margin-left: -5px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #ffffff; }
.zoomtimeline.mode-slider-variation .hexa-mark-con .hexa-inshow {
    white-space: nowrap;
    font-weight: bold;
    font-size: 9px;
    position: relative;
    top: -0px;
    left: -0px;
    color: #444;
    pointer-events: none;
    opacity: .7;
    transition-property: opacity, visibility;
    transition-duration: 0.3s;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: opacity, visibility;
    -o-transition-duration: 0.3s;
    -ms-transition-property: opacity, visibility;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-slider-variation .hexa-mark {
    width: 9px;
    height: 9px;
    background-color: #ffffff;
    transform: rotate(45deg);
    position: absolute;
    top: 0px;
    left: 0;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
    cursor: pointer; }
.zoomtimeline.mode-slider-variation .hexa-mark-con:hover .hexa-content {
    opacity: 1;
    visibility: visible; }
.zoomtimeline.mode-slider-variation .hexa-mark-con:hover .hexa-inshow {
    opacity: 1; }
.zoomtimeline.mode-slider-variation .sc-descriptions {
    white-space: nowrap;
    width: 100%;
    background-color: #f8f8f8;
    overflow: hidden; }
.zoomtimeline.mode-slider-variation .sc-descriptions .sc-descriptions-content {
    white-space: nowrap;
    display: inline-block;
    position: relative; }
.zoomtimeline.mode-slider-variation .sc-descriptions .sc-description {
    display: inline-block;
    vertical-align: top;
    padding: 25px 20px 15px;
    position: relative;
    text-align: center;
    white-space: normal;
    color: #777;
    transition-property: color, background;
    transition-duration: 0.3s;
    -moz-transition-property: color, background;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: color, background;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: color, background;
    -o-transition-duration: 0.3s;
    -ms-transition-property: color, background;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-slider-variation .sc-descriptions .sc-description p {
    font-style: italic; }
.zoomtimeline.mode-slider-variation .sc-descriptions .sc-description > .the-content {
    position: relative; }
.zoomtimeline.mode-slider-variation .sc-descriptions .sc-description > .the-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f8f8f8;
    transition-property: color, background;
    transition-duration: 0.3s;
    -moz-transition-property: color, background;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: color, background;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: color, background;
    -o-transition-duration: 0.3s;
    -ms-transition-property: color, background;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-slider-variation .sc-descriptions .sc-description.active {
    color: #222; }
.zoomtimeline.mode-slider-variation .sc-descriptions .sc-description.active > .the-bg {
    background-color: #FFFFFF; }
.zoomtimeline.mode-slider-variation .sc-descriptions .the-heading {
    margin-top: 0;
    margin-bottom: 15px; }
.zoomtimeline.mode-slider-variation .sc-descriptions .sc-description .the-after {
    content: "";
    position: absolute;
    right: 100%;
    top: 0;
    height: 100%;
    width: 1px;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+47,b4b3b1+100&0+1,0.05+30,0.13+47,0.05+68,0+100 */
    background: -moz-linear-gradient(top, transparent 0%, transparent 1%, rgba(0, 0, 0, 0.05) 30%, rgba(0, 0, 0, 0.13) 47%, rgba(71, 71, 70, 0.05) 68%, rgba(180, 179, 177, 0) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, transparent 0%, transparent 1%, rgba(0, 0, 0, 0.05) 30%, rgba(0, 0, 0, 0.13) 47%, rgba(71, 71, 70, 0.05) 68%, rgba(180, 179, 177, 0) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, transparent 0%, transparent 1%, rgba(0, 0, 0, 0.05) 30%, rgba(0, 0, 0, 0.13) 47%, rgba(71, 71, 70, 0.05) 68%, rgba(180, 179, 177, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#00b4b3b1',GradientType=0 );
    /* IE6-9 */ }
.zoomtimeline.mode-slider-variation .preloader-wave {
    opacity: 1;
    visibility: visible; }
.zoomtimeline.mode-slider-variation .items, .zoomtimeline.mode-slider-variation .sc-descriptions, .zoomtimeline.mode-slider-variation .scroller-con {
    opacity: 0;
    visibility: hidden;
    transition-property: opacity, visibility;
    transition-duration: 0.3s;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: opacity, visibility;
    -o-transition-duration: 0.3s;
    -ms-transition-property: opacity, visibility;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }

.zoomtimeline.mode-slider-variation.ztm-ready .preloader-wave {
    opacity: 1;
    visibility: visible; }
.zoomtimeline.mode-slider-variation.ztm-ready .items, .zoomtimeline.mode-slider-variation.ztm-ready .sc-descriptions, .zoomtimeline.mode-slider-variation.ztm-ready .scroller-con {
    opacity: 0;
    visibility: hidden; }

.zoomtimeline.mode-slider-variation.ztm-ready.reinited-finished-loading-all-images .preloader-wave {
    opacity: 0;
    visibility: hidden; }
.zoomtimeline.mode-slider-variation.ztm-ready.reinited-finished-loading-all-images .sc-descriptions, .zoomtimeline.mode-slider-variation.ztm-ready.reinited-finished-loading-all-images .scroller-con {
    opacity: 1;
    visibility: visible; }

/* mode-YEARSLIST END */
/* mode-3dslider START */
.zoomtimeline.mode-3dslider {
    width: 100%;
    overflow: hidden;
    position: relative;
    font-family: "Dosis","Open Sans",Helvetica,serif;
    min-height: 700px;}
.zoomtimeline.mode-3dslider .ztm-item {
    display: none; }
.zoomtimeline.mode-3dslider .yearlist-con {
    position: absolute;
    width: 100%; }
.zoomtimeline.mode-3dslider .yearlist-con .yearlist-container {
    margin: 0 auto;
    max-width: 1170px;
    overflow: hidden;
    position: relative;
    top: 260px;
    height: 400px;
    -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(black), color-stop(0.9, black), to(transparent)); }
.zoomtimeline.mode-3dslider .yearlist-con .yearlist-container .yearlist-container-inner {
    -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(0.1, black), to(black));
    height: 100%; }
.zoomtimeline.mode-3dslider .yearlist-con .yearlist {
    white-space: nowrap;
    position: relative;
    left: 0;
    transition-property: left;
    transition-duration: 0.25s;
    -moz-transition-property: left;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: left;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: left;
    -o-transition-duration: 0.25s;
    -ms-transition-property: left;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out; }
.zoomtimeline.mode-3dslider .yearlist-con .yearlist .year {
    display: inline-block;
    vertical-align: top;
    text-align: center;
    width: 20%;
    font-size: 13px;
    position: relative;
    font-weight: bold;
    color: #EEEEEE;
    top: 0;
    transition-property: top, font-size;
    transition-duration: 0.25s;
    -moz-transition-property: top, font-size;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: top, font-size;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: top, font-size;
    -o-transition-duration: 0.25s;
    -ms-transition-property: top, font-size;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-3dslider .yearlist-con .yearlist .year .the-year {
    display: block; }
.zoomtimeline.mode-3dslider .yearlist-con .yearlist .year.curr-item {
    top: 218px;
    font-size: 21px; }
.zoomtimeline.mode-3dslider .yearlist-con .yearlist .year.curr-item figure {
    opacity: 0;
    visibility: hidden; }
.zoomtimeline.mode-3dslider .yearlist-con:after {
    position: absolute;
    top: 290px;
    width: 100%;
    height: 2px;
    content: "";
    background-color: #693e3a }
.zoomtimeline.mode-3dslider .details-container {
    position: relative;
    perspective: 600px;
    opacity: 0;
    visibility: hidden;
    transition-property: height, opacity, visibility;
    transition-duration: 0.3s;
    -moz-transition-property: height, opacity, visibility;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: height, opacity, visibility;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: height, opacity, visibility;
    -o-transition-duration: 0.3s;
    -ms-transition-property: height, opacity, visibility;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out; }
.zoomtimeline.mode-3dslider .details-container > .detail {
    position: absolute;
    text-align: center;
    width: 300px;
    top: 0;
    visibility: visible;
    opacity: 1;
    left: 50%;
    margin-left: -150px;
    transition-property: all;
    transition-duration: 0.25s;
    -moz-transition-property: all;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: all;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: all;
    -o-transition-duration: 0.25s;
    -ms-transition-property: all;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    perspective: 600px;
    -webkit-perspective: 600px; }
.zoomtimeline.mode-3dslider .details-container > .detail .detail-image-con {
    position: relative;
    transform: rotateY(0deg) scale(1) translate3d(0, 0, 0);
    -webkit-transform: rotateY(0deg) scale(1) translate3d(0, 0, 0);
    transition-property: all;
    transition-duration: 0.25s;
    -moz-transition-property: all;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: all;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: all;
    -o-transition-duration: 0.25s;
    -ms-transition-property: all;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out; }
.zoomtimeline.mode-3dslider .details-container > .detail .detail-image {
    transition-property: opacity, visibility;
    transition-duration: 0.25s;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: opacity, visibility;
    -o-transition-duration: 0.25s;
    -ms-transition-property: opacity, visibility;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out; }
.zoomtimeline.mode-3dslider .details-container > .detail .detail-image, .zoomtimeline.mode-3dslider .details-container > .detail .detail-image--border {
    position: relative;
    width: 100%;
    height: 400px;
    border-radius: 5px;
    background-size: cover;
    background-position: center center; }
.zoomtimeline.mode-3dslider .details-container > .detail .detail-image--border {
    border: 2px solid #693e3a;
    position: absolute;
    border-radius: 0;
    transition-property: background, border;
    transition-duration: 0.25s;
    -moz-transition-property: background, border;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: background, border;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: background, border;
    -o-transition-duration: 0.25s;
    -ms-transition-property: background, border;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out; }
.zoomtimeline.mode-3dslider .details-container > .detail .detail-excerpt {
    font-size: 14px;
    padding-top: 10px;
    opacity: 0;
    visibility: hidden;
    color: #ffffff;
    margin-left: -10%;
    margin-right: -10%;
    transition-property: opacity, visibility;
    transition-duration: 0.25s;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: opacity, visibility;
    -o-transition-duration: 0.25s;
    -ms-transition-property: opacity, visibility;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    font-family: Raleway, "Open Sans",serif; }
.zoomtimeline.mode-3dslider .details-container > .detail .detail-excerpt p {
    line-height: 1.7; }
.zoomtimeline.mode-3dslider .details-container > .detail > .the-heading {
    color: #ffffff;
    transform: rotateY(0deg) scale(1) translate3d(0, 0, 0);
    -webkit-transform: rotateY(0deg) scale(1) translate3d(0, 0, 0);
    transition-property: all;
    transition-duration: 0.25s;
    -moz-transition-property: all;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: all;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: all;
    -o-transition-duration: 0.25s;
    -ms-transition-property: all;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-out;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out; }
.zoomtimeline.mode-3dslider .details-container .detail {
    cursor: pointer;
    transform: translate3d(calc(-150px - 3vw), 0, 0);
    -webkit-transform: translate3d(calc(-150px - 3vw), 0, 0); }
.zoomtimeline.mode-3dslider .details-container .detail .detail-image-con {
    transform: rotateY(32deg) scale(0.75) translate3d(0, 0, 0);
    -webkit-transform: rotateY(32deg) scale(0.75) translate3d(0, 0, 0); }
.zoomtimeline.mode-3dslider .details-container .detail .detail-image {
    opacity: 0; }
.zoomtimeline.mode-3dslider .details-container .detail > .the-heading {
    transform: rotateY(10deg) scale(0.75) translate3d(0, 20px, 0);
    -webkit-transform: rotateY(10deg) scale(0.75) translate3d(0, 20px, 0);
    opacity: 0;
    font-size: 19px;
    text-transform: uppercase
}
.zoomtimeline.mode-3dslider .details-container .detail .the-year {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 258px;
    width: 100%;
    text-align: center;
    font-size: 14px;
    transition-property: top, opacity, visibility, font-size;
    transition-duration: 0.3s;
    -moz-transition-property: top, opacity, visibility, font-size;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: top, opacity, visibility, font-size;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: top, opacity, visibility, font-size;
    -o-transition-duration: 0.3s;
    -ms-transition-property: top, opacity, visibility, font-size;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    opacity: 0;
    visibility: hidden; }
.zoomtimeline.mode-3dslider .details-container .detail .the-year figure {
    position: relative;
    top: 8px;
    opacity: 1;
    width: 10px;
    height: 10px;
    left: 50%;
    margin-left: -6px;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.25);
    background-color: #693e3a;
    border-radius: 50%;
    transition-property: opacity, visibility;
    transition-duration: 0.25s;
    -moz-transition-property: opacity, visibility;
    -moz-transition-duration: 0.25s;
    -webkit-transition-property: opacity, visibility;
    -webkit-transition-duration: 0.25s;
    -o-transition-property: opacity, visibility;
    -o-transition-duration: 0.25s;
    -ms-transition-property: opacity, visibility;
    -ms-transition-duration: 0.25s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-3dslider .details-container .detail .the-year figure polygon {
    fill: #693e3a; }
.zoomtimeline.mode-3dslider .details-container .detail .the-year figure polyline {
    stroke: rgba(255, 255, 255, 0.9); }
.zoomtimeline.mode-3dslider .details-container > input {
    opacity: 0;
    visibility: visible; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail {
    position: absolute;
    z-index: 55;
    max-width: 100%;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0); }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail .detail-image--border {
    opacity: 0; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail .detail-image {
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.5);
    -webkit-mask-image: none;
    opacity: 1; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail .detail-image-con {
    transform: rotateY(0deg) scale(1) translate3d(0, 0, 0);
    -webkit-transform: rotateY(0deg) scale(1) translate3d(0, 0, 0); }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail > .the-heading {
    transform: rotateY(0deg) scale(1) translate3d(0, 0px, 0);
    -webkit-transform: rotateY(0deg) scale(1) translate3d(0, 0px, 0);
    opacity: 1; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail .detail-excerpt {
    visibility: visible;
    opacity: 1; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail .the-year {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 477px;
    width: 100%;
    text-align: center;
    font-size: 25px; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail .the-year figure {
    opacity: 0;
    visibility: hidden; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail {
    position: absolute;
    cursor: pointer;
    transform: translate3d(calc(150px + 3vw), 0, 0);
    -webkit-transform: translate3d(calc(150px + 3vw), 0, 0);
    z-index: 30; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail .detail-image {
    opacity: 0.4;
    box-shadow: 0 0 8px 0 transparent;}
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail .detail-image-con {
    transform: rotateY(-32deg) scale(0.75) translate3d(0, 0, 0);
    -webkit-transform: rotateY(-32deg) scale(0.75) translate3d(0, 0, 0); }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail > .the-heading {
    transform: rotateY(-10deg) scale(0.75) translate3d(0, 20px, 0);
    opacity: 0.5; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail .the-year {
    opacity: 1;
    visibility: visible; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail {
    cursor: pointer;
    transform: translate3d(calc(300px + 5vw), 0, 0);
    -webkit-transform: translate3d(calc(300px + 5vw), 0, 0); }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail .detail-image--border {
    background-color: transparent;
    border-color: rgba(220, 167, 167, 0.5); }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail .detail-image {
    opacity: 0;
    box-shadow: 0 0 8px 0 transparent; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail .detail-image-con {
    transform: rotateY(-32deg) scale(0.65) translate3d(0, 40px, 0);
    -webkit-transform: rotateY(-32deg) scale(0.65) translate3d(0, 40px, 0); }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail .detail-excerpt {
    visibility: hidden;
    opacity: 0; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail > .the-heading {
    transform: rotateY(-15deg) scale(0.75) translate3d(0, 40px, 0);
    -webkit-transform: rotateY(-15deg) scale(0.75) translate3d(0, 40px, 0);
    opacity: 0.15; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail .the-year {
    opacity: 1;
    visibility: visible; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail ~ .detail {
    visibility: hidden;
    opacity: 0;
    transform: translate3d(calc(450px + 5vw), 0, 0);
    -webkit-transform: translate3d(calc(450px + 5vw), 0, 0); }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail ~ .detail .detail-image {
    opacity: 0; }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail ~ .detail .detail-image-con {
    transform: rotateY(-32deg) scale(0.65) translate3d(0, 0, 0);
    -webkit-transform: rotateY(-32deg) scale(0.65) translate3d(0, 0, 0); }
.zoomtimeline.mode-3dslider .details-container > input:checked + .detail + * + .detail + * + .detail ~ .detail .the-year {
    opacity: 1;
    visibility: visible; }

.zoomtimeline.mode-3dslider.ztm-ready .details-container {
    opacity: 1;
    visibility: visible; }

.zoomtimeline.mode-3dslider.skin-dark .details-container > .detail > .the-heading {
    color: #555555; }
.zoomtimeline.mode-3dslider.skin-dark .yearlist-con .yearlist > .year {
    color: #555; }
.zoomtimeline.mode-3dslider.skin-dark .details-container > .detail .detail-excerpt p {
    color: #222222; }

.zoomtimeline.mode-3dslider.under-600 .details-container > .detail {
    max-width: none; }
.zoomtimeline.mode-3dslider.under-600 .details-container > .detail .detail-excerpt {
    margin-left: 0;
    margin-right: 0;
    width: 100%; }

.zoomtimeline.circuit-the-timeline-off.first-item-active .diamond-arrow-left {
    opacity: 0;
    visibility: hidden; }

.zoomtimeline.circuit-the-timeline-off.last-item-active .diamond-arrow-right {
    opacity: 0;
    visibility: hidden; }

/* mode-3dslider END */
/* mode-BLACKWHITE START */
.zoomtimeline.mode-blackwhite .ztm-item {
    display: block;
    font-size: 0;
    background-color: #FFFFFF; }
.zoomtimeline.mode-blackwhite .ztm-item .hex-icon, .zoomtimeline.mode-blackwhite .ztm-item .hex-desc-con {
    display: none; }
.zoomtimeline.mode-blackwhite .ztm-item .image-con, .zoomtimeline.mode-blackwhite .ztm-item .ztm-content {
    display: inline-block;
    width: 50%;
    vertical-align: middle;
    font-size: 13px; }
.zoomtimeline.mode-blackwhite .ztm-item .image-con > .fullwidth {
    display: block;
    margin-top: 0; }
.zoomtimeline.mode-blackwhite .ztm-item .the-heading {
    font-size: 14px;
    font-weight: bold;
    font-family: "Lato",serif;
    margin-top: 0;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 12px;
    margin-bottom: 15px; }
.zoomtimeline.mode-blackwhite .ztm-item .the-heading:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10px;
    width: 20px;
    height: 2px;
    background-color: #222222; }
.zoomtimeline.mode-blackwhite .ztm-item .ztm-content {
    padding: 30px;
    color: #222222;
    text-align: center; }
.zoomtimeline.mode-blackwhite .ztm-item .ztm-content p:last-child {
    margin-bottom: 0; }

@media (max-width: 600px) {
    .zoomtimeline.mode-blackwhite .ztm-item {
        margin-bottom: 30px; }
    .zoomtimeline.mode-blackwhite .ztm-content, .zoomtimeline.mode-blackwhite .image-con {
        width: 100%;
        margin-bottom: 10px; } }
.zoomtimeline.mode-blackwhite.under-400 .ztm-item {
    margin-bottom: 30px; }
.zoomtimeline.mode-blackwhite.under-400 .ztm-content, .zoomtimeline.mode-blackwhite.under-400 .image-con {
    width: 100%;
    margin-bottom: 10px; }

/* -- mode-blackwhite END */
/* -- mode-masonry START */
.zoomtimeline.mode-masonry {
    margin-left: -15px;
    margin-right: -15px;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -moz-column-gap: 15px;
    -webkit-column-gap: 15px; }
.zoomtimeline.mode-masonry .ztm-item {
    display: inline-block;
    margin-bottom: 15px; }
.zoomtimeline.mode-masonry .ztm-item .hex-desc-con {
    font-family: "Raleway","Open Sans",sans-serif;
    font-size: 11px;
    font-style: italic;
    opacity: 0.5;
    text-align: center; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner {
    background-color: #ffffff;
    color: #222222; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner .ztm-content {
    padding: 30px 30px 25px;
    text-align: center;
    font-family: "Raleway","Open Sans",sans-serif;
    font-size: 13px;
    font-weight: 400; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner .ztm-content > .the-heading {
    margin-top: 0;
    font-family: "Raleway","Open Sans",sans-serif;
    font-weight: 200;
    font-size: 28px;
    position: relative;
    padding-bottom: 15px;
    margin-bottom: 15px; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner .ztm-content .the-heading:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10px;
    width: 20px;
    height: 1px;
    background-color: #222222; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner .ztm-content *:last-child {
    margin-bottom: 0; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner a.image-con {
    overflow: hidden;
    position: relative;
    display: block; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner a.image-con img {
    margin-top: 0; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner a.image-con .the-label {
    position: absolute;
    white-space: nowrap;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    background-color: #222;
    padding: 3px 5px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    opacity: 0;
    visibility: hidden;
    margin-top: 20px;
    transition-property: margin, opacity, visibility;
    transition-duration: 0.3s;
    -moz-transition-property: margin, opacity, visibility;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: margin, opacity, visibility;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: margin, opacity, visibility;
    -o-transition-duration: 0.3s;
    -ms-transition-property: margin, opacity, visibility;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner a.image-con:before {
    content: "";
    position: absolute;
    top: -100%;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition-property: top, opacity, visibility;
    transition-duration: 0.3s;
    -moz-transition-property: top, opacity, visibility;
    -moz-transition-duration: 0.3s;
    -webkit-transition-property: top, opacity, visibility;
    -webkit-transition-duration: 0.3s;
    -o-transition-property: top, opacity, visibility;
    -o-transition-duration: 0.3s;
    -ms-transition-property: top, opacity, visibility;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner a.image-con:hover .the-label {
    opacity: 1;
    visibility: visible;
    margin-top: 0px; }
.zoomtimeline.mode-masonry .ztm-item .ztm-item--inner a.image-con:hover:before {
    opacity: 1;
    visibility: visible;
    top: 0; }
.zoomtimeline.mode-masonry .ztm-item .thumbs-gallery-con {
    background-color: rgba(20, 20, 20, 0.15); }

@media (max-width: 600px) {
    .zoomtimeline.mode-masonry {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1; } }
.zoomtimeline.mode-masonry.ztm-ready .preloader-wave {
    opacity: 1;
    visibility: visible; }
.zoomtimeline.mode-masonry.ztm-ready .items {
    opacity: 0;
    visibility: hidden; }

.zoomtimeline.mode-masonry.ztm-ready.reinited-finished-loading-all-images .preloader-wave {
    opacity: 0;
    visibility: hidden; }
.zoomtimeline.mode-masonry.ztm-ready.reinited-finished-loading-all-images .items {
    opacity: 1;
    visibility: visible; }

.zoomtimeline.mode-masonry.under-900 .ztm-item {
    width: 50%; }

.zoomtimeline.mode-masonry.under-600 .ztm-item {
    width: 100%; }

/* -- mode-masonry END */
.thumbs-gallery-con--global {
    padding: 5px 5px 0;
    margin-left: -2px;
    margin-right: -2px;
    position: relative;
    background-color: rgba(20, 20, 20, 0.5);
    display: inline-block; }
.thumbs-gallery-con--global span.thumb-smoothie {
    display: inline-block; }
.thumbs-gallery-con--global .thumb-smoothie {
    position: relative;
    width: 45px;
    height: 45px; }

.float-left {
    float: left; }

.overflow-it {
    overflow: hidden; }

.normal-weight {
    font-weight: 400; }

.full-bg, .full-bg--overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center; }

.full-bg.blurred {
    -webkit-filter: blur(10px);
    filter: blur(10px); }

.full-bg--overlay {
    background-color: rgba(50, 50, 50, 0.7); }

/*# sourceMappingURL=zoomtimeline.css.map */

/*
 * Author: Digital Zoom Studio
 * Website: http://digitalzoomstudio.net/
 * Portfolio: http://codecanyon.net/user/ZoomIt/portfolio
 *
 * Version: 5.01
 */
/*functional styling*/
.scroller-con {
    position: relative;
    width: 100%;
    height: 200px;
    opacity: 0;
    transition-property: opacity, visibility, top;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
    -moz-transition-property: opacity, visibility, top;
    -moz-transition-duration: 0.3s;
    -moz-transition-timing-function: ease-out;
    -webkit-transition-property: opacity, visibility, top;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-property: opacity, visibility, top;
    -o-transition-duration: 0.3s;
    -o-transition-timing-function: ease-out;
    -ms-transition-property: opacity, visibility, top;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-out;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
.scroller-con * {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
.scroller-con .scroller {
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; }
.scroller-con .scroller .inner {
    position: absolute !important; }
.scroller-con .scroller .real-inner {
    position: absolute;
    top: 0;
    left: 0; }
.scroller-con .scrollbar .scrollbary.animatetoptoo {
    transition-property: opacity, visibility, top;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
    -moz-transition-property: opacity, visibility, top;
    -moz-transition-duration: 0.3s;
    -moz-transition-timing-function: ease-out;
    -webkit-transition-property: opacity, visibility, top;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-property: opacity, visibility, top;
    -o-transition-duration: 0.3s;
    -o-transition-timing-function: ease-out;
    -ms-transition-property: opacity, visibility, top;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-out; }
.scroller-con .scroller::-webkit-scrollbar {
    display: none; }

.scroller-con.safe {
    opacity: 1; }

.scroller-con.type-scrollTop {
    overflow: hidden;
    height: auto; }
.scroller-con.type-scrollTop .scrollbary_bg, .scroller-con.type-scrollTop .scrollbary {
    position: fixed; }

.scroller-con.dzsscr-inited {
    opacity: 1; }

.inner.inner-for-horizontal {
    white-space: nowrap;
    width: auto; }
.inner.inner-for-horizontal > img {
    max-width: none; }

.scroller-con.auto-height {
    height: auto; }
.scroller-con.auto-height .scroller {
    position: relative;
    height: auto; }
.scroller-con.auto-height .scroller .inner {
    position: relative !important;
    display: inline-block; }
.scroller-con.auto-height .scroller .real-inner {
    position: relative;
    top: 0;
    left: 0; }
.scroller-con.auto-height .scroller::-webkit-scrollbar {
    display: none; }

.scroller-con.overflow-visible .scroller {
    overflow: visible; }

.scroller-con.overflow-x-visible .scroller {
    overflow: visible;
    overflow-y: hidden;
    overflow-x: visible; }

.scroller-con.easing .inner {
    transition-property: left, top;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
    -moz-transition-property: left, top;
    -moz-transition-duration: 0.3s;
    -moz-transition-timing-function: ease-out;
    -webkit-transition-property: left, top;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-property: left, top;
    -o-transition-duration: 0.3s;
    -o-transition-timing-function: ease-out;
    -ms-transition-property: left, top;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-out; }

.scroller-con .scrollbar.easing > * {
    transition-property: left, top;
    transition-duration: 0.7s;
    transition-timing-function: ease-out;
    -moz-transition-property: left, top;
    -moz-transition-duration: 0.7s;
    -moz-transition-timing-function: ease-out;
    -webkit-transition-property: left, top;
    -webkit-transition-duration: 0.7s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-property: left, top;
    -o-transition-duration: 0.7s;
    -o-transition-timing-function: ease-out;
    -ms-transition-property: left, top;
    -ms-transition-duration: 0.7s;
    -ms-transition-timing-function: ease-out; }

.scroller-con .scrollbary {
    position: absolute;
    cursor: pointer; }

.scroller-con .scrollbary_bg {
    position: absolute;
    cursor: pointer; }

.scroller-con .scrollbarx {
    position: absolute;
    cursor: pointer; }

.scroller-con .scrollbarx_bg {
    position: absolute;
    cursor: pointer; }

.scroller-con.swipe-enabled {
    cursor: move;
    cursor: -moz-grab;
    cursor: grab;
    cursor: url(styleimg/openhand.cur) 4 4, move; }

.scroller-con.swipe-enabled.closedhand {
    cursor: url(styleimg/closedhand.cur) 4 4, move; }

/*estethic styling*/
/* skin_default */
.scroller-con.skin_default .scrollbarx {
    width: 60px;
    height: 7px;
    left: 0;
    bottom: -10px;
    background: #5896c6;
    border-radius: 2px; }
.scroller-con.skin_default .scrollbarx_bg {
    height: 7px;
    left: 0;
    bottom: -10px;
    background: #eee;
    border-radius: 5px; }
.scroller-con.skin_default .scrollbary {
    width: 10px;
    height: 60px;
    top: 0;
    right: -11px;
    background: #5896c6;
    border-radius: 2px; }
.scroller-con.skin_default .scrollbary_bg {
    width: 10px;
    top: 0;
    right: -11px;
    background: #eee;
    border-radius: 5px; }

.scroller-con.dir-ver .scroller {
    width: calc(100% - 16px); }

.scroller-con.skin_apple.dir-ver .scroller {
    width: 100%; }

/* skin_alternate */
.scroller-con.skin_alternate {
    margin-bottom: 40px; }
.scroller-con.skin_alternate .scrollbarx {
    width: 200px;
    height: 30px;
    left: 0;
    bottom: -30px;
    background: yellow; }
.scroller-con.skin_alternate .scrollbarx_bg {
    height: 30px;
    left: 0;
    bottom: -30px;
    background: #000; }
.scroller-con.skin_alternate .scrollbary {
    width: 7px;
    height: 60px;
    top: 0;
    right: -10px;
    background: transparent url("styleimg/scroller1.png"); }
.scroller-con.skin_alternate .scrollbary_bg {
    width: 7px;
    top: 0;
    right: -10px;
    background: #eee; }

/*Skin 3*/
.scroller-con.skin_blackwhite {
    margin-top: 30px; }

.scroller-con.skin_blackwhite .scrollbarx {
    position: absolute;
    width: 35px;
    height: 10px;
    left: 0;
    top: -15px;
    background: url("styleimg/s3scrollerx.png");
    cursor: pointer; }

.scroller-con.skin_blackwhite .scrollbarx_bg {
    position: absolute;
    height: 1px;
    left: 0;
    top: -10px;
    background: #eee;
    cursor: pointer; }

.scroller-con.skin_blackwhite .scrollbary {
    width: 10px;
    height: 35px;
    top: 0;
    right: -15px;
    background: url("styleimg/s3scrollery.png"); }

.scroller-con.skin_blackwhite .scrollbary_bg {
    position: absolute;
    width: 1px;
    top: 0;
    right: -10px;
    background: #fff;
    cursor: pointer; }

/*======Skin-Progress*/
.scroller-con.skin_progress .scrollbarx {
    width: 60px;
    height: 19px;
    left: 0;
    bottom: -20px;
    background-image: url("styleimg/progress.png");
    border-radius: 15px; }

.scroller-con.skin_progress .scrollbarx_bg {
    height: 19px;
    left: 0;
    bottom: -20px;
    background: #191d21;
    border-radius: 15px;
    border: 1px solid #1a1a1a;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

.scroller-con.skin_progress .scrollbary {
    width: 19px;
    height: 60px;
    top: 0;
    right: -28px;
    background-image: url("styleimg/progressy.png");
    border-radius: 15px; }

.scroller-con.skin_progress .scrollbary_bg {
    width: 19px;
    top: 0;
    right: -28px;
    background: #191d21;
    border-radius: 15px;
    border: 1px solid #1a1a1a;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

/*======Skin_ProgressBox*/
.scroller-con.skin_progressbox .scrollbarx {
    width: 60px;
    height: 19px;
    left: 0;
    bottom: -16px;
    background-image: url("styleimg/progressblue.png"); }

.scroller-con.skin_progressbox .scrollbarx_bg {
    height: 19px;
    left: 0;
    bottom: -16px;
    background: #191d21;
    border: 1px solid #1a1a1a;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

.scroller-con.skin_progressbox .scrollbary {
    width: 19px;
    height: 60px;
    top: 0;
    right: -28px;
    background-image: url("styleimg/progressy.png");
    border-radius: 15px; }

.scroller-con.skin_progressbox .scrollbary_bg {
    width: 19px;
    top: 0;
    right: -28px;
    background: #191d21;
    border: 1px solid #1a1a1a;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

/*skin slider*/
.scroller-con.skin_slider .scrollbarx {
    width: 60px;
    height: 7px;
    left: 0;
    bottom: -10px;
    background: #5896c6;
    border-radius: 2px; }

.scroller-con.skin_slider .scrollbarx_bg {
    height: 7px;
    left: 0;
    bottom: -10px;
    background: #eee;
    border-radius: 5px; }

.scroller-con.skin_slider .scrollbary {
    width: 30px;
    height: 30px;
    top: 0;
    right: -30px;
    background-image: url("styleimg/handle.png");
    background-repeat: no-repeat;
    background-position: center center; }

.scroller-con.skin_slider .scrollbary_bg {
    width: 7px;
    top: 0;
    right: -18px;
    background: #282a31;
    border-radius: 15px;
    border: 1px solid #1a1a1a;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

.scroller-con.skin_slider.scrollbars-inset .scrollbary {
    right: 0px; }
.scroller-con.skin_slider.scrollbars-inset .scrollbary_bg {
    right: 0px; }
.scroller-con.skin_slider.scrollbars-inset .scrollbarx {
    bottom: 0px; }
.scroller-con.skin_slider.scrollbars-inset .scrollbarx_bg {
    bottom: 10px; }

/*skin slider*/
.scroller-con.skin_slider .scrollbarx {
    width: 30px;
    height: 30px;
    left: 0;
    bottom: -31px;
    background-color: transparent;
    background-image: url("styleimg/handle.png");
    background-repeat: no-repeat;
    background-position: center center; }

.scroller-con.skin_slider .scrollbarx_bg {
    height: 7px;
    left: 0;
    bottom: -20px;
    background: #282a31;
    border-radius: 15px;
    border: 1px solid #1a1a1a;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

.scroller-con.skin_slider .scrollbary {
    width: 30px;
    height: 30px;
    top: 0;
    right: -30px;
    background-image: url("styleimg/handle.png");
    background-repeat: no-repeat;
    background-position: center center; }

.scroller-con.skin_slider .scrollbary_bg {
    width: 7px;
    top: 0;
    right: -18px;
    background: #282a31;
    border-radius: 15px;
    border: 1px solid #1a1a1a;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

/*skin skin_timeline*/
.scroller-con.skin_timeline .scrollbar {
    opacity: 0; }

.scroller-con.skin_timeline .scrollbarx {
    width: 17px;
    height: 17px;
    left: 0;
    bottom: 7px;
    background-color: transparent;
    background-image: url("styleimg/skin_timeline_handle.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center; }

.scroller-con.skin_timeline .scrollbarx_bg {
    height: 30px;
    left: 0;
    bottom: 0px;
    background-image: url(styleimg/skin_timeline_bg.png);
    background-position: center center;
    background-repeat: repeat-x;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

.scroller-con.skin_timeline .scrollbary {
    width: 30px;
    height: 30px;
    top: 0;
    right: -30px;
    background-image: url("styleimg/handle.png");
    background-repeat: no-repeat;
    background-position: center center; }

.scroller-con.skin_timeline .scrollbary_bg {
    width: 7px;
    top: 0;
    right: -18px;
    background: #282a31;
    border-radius: 15px;
    box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

.scroller-con.skin_royale {
    margin-bottom: 30px; }
.scroller-con.skin_royale .scrollbarx_bg, .scroller-con.skin_royale .scrollbary_bg {
    background-color: #1c1a17;
    border-radius: 3px; }
.scroller-con.skin_royale .scrollbarx, .scroller-con.skin_royale .scrollbary {
    background-color: #363330;
    border-radius: 3px; }
.scroller-con.skin_royale .scrollbarx_bg {
    height: 14px;
    top: auto;
    bottom: -24px; }
.scroller-con.skin_royale .scrollbarx {
    width: 50px;
    height: 14px;
    top: auto;
    bottom: -24px; }
.scroller-con.skin_royale .scrollbary_bg {
    width: 14px;
    left: auto;
    right: -24px; }
.scroller-con.skin_royale .scrollbary {
    width: 14px;
    left: auto;
    right: -24px;
    height: 50px; }

/*======skin apple*/
.scroller-con.skin_apple .scrollbarx {
    width: 90px;
    height: 8px;
    left: 0;
    bottom: -15px;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px; }

.scroller-con.skin_apple .scrollbarx_bg {
    height: 0px; }

.scroller-con.skin_apple .scrollbary {
    width: 8px;
    height: 90px;
    top: 0;
    right: 0px;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px; }

.scroller-con.skin_apple .scrollbary_bg {
    width: 8px;
    right: 0;
    background: rgba(255, 255, 255, 0);
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: ease-out;
    -moz-transition-property: all;
    -moz-transition-duration: 0.3s;
    -moz-transition-timing-function: ease-out;
    -webkit-transition-property: all;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-property: all;
    -o-transition-duration: 0.3s;
    -o-transition-timing-function: ease-out;
    -ms-transition-property: all;
    -ms-transition-duration: 0.3s;
    -ms-transition-timing-function: ease-out; }

.scroller-con.skin_apple .scrollbar:hover .scrollbary_bg, .scroller-con.skin_apple .scrollbar.dragging .scrollbary_bg {
    background: rgba(255, 255, 255, 0.3); }

.scroller-con.skin_bigblue {
    margin-bottom: 30px; }
.scroller-con.skin_bigblue .scrollbary {
    width: 20px;
    background: #59c8ef;
    opacity: 0.2;
    border-radius: 0;
    height: 350px; }
.scroller-con.skin_bigblue .scrollbary_bg {
    opacity: 0;
    border-radius: 0; }
.scroller-con.skin_bigblue .scrollbarx {
    width: 350px;
    background: #59c8ef;
    opacity: 0.2;
    border-radius: 0;
    height: 20px;
    top: 100%;
    bottom: auto;
    margin-top: 5px; }
.scroller-con.skin_bigblue .scrollbax_bg {
    opacity: 0;
    border-radius: 0;
    top: 100%;
    bottom: auto;
    margin-top: 5px; }

.scroller-con.skin_luna {
    margin-bottom: 30px; }
.scroller-con.skin_luna .scrollbary {
    width: 20px;
    background: #59c8ef;
    opacity: 0.2;
    border-radius: 0;
    height: 350px; }
.scroller-con.skin_luna .scrollbary_bg {
    opacity: 0;
    border-radius: 0; }
.scroller-con.skin_luna .scrollbarx {
    width: 100px;
    background: #fafafa;
    opacity: 1;
    border-radius: 0;
    height: 16px;
    top: 100%;
    bottom: auto;
    margin-top: 7px;
    margin-left: 2px; }
.scroller-con.skin_luna .scrollbarx svg.arrow-left, .scroller-con.skin_luna .scrollbarx svg.arrow-right {
    width: 5px;
    height: 7px;
    position: absolute;
    top: 5px;
    left: 6px; }
.scroller-con.skin_luna .scrollbarx svg.arrow-left path, .scroller-con.skin_luna .scrollbarx svg.arrow-right path {
    fill: #555; }
.scroller-con.skin_luna .scrollbarx svg.arrow-right {
    right: 6px;
    left: auto;
    transform: scaleX(-1); }
.scroller-con.skin_luna .scrollbarx_bg {
    opacity: 1;
    border-radius: 0;
    background-color: rgba(50, 50, 50, 0.1);
    height: 20px;
    top: 100%;
    bottom: auto;
    margin-top: 5px; }

.scroller-con.skin_cerc {
    margin-bottom: 30px; }
.scroller-con.skin_cerc .scrollbary {
    width: 20px;
    background: #59c8ef;
    opacity: 0.2;
    border-radius: 0;
    height: 350px; }
.scroller-con.skin_cerc .scrollbary_bg {
    opacity: 0;
    border-radius: 0; }
.scroller-con.skin_cerc .scrollbarx {
    width: 22px;
    background: #444444;
    opacity: 1;
    border-radius: 50%;
    height: 22px;
    top: 100%;
    bottom: auto;
    margin-top: 7px;
    margin-left: 2px; }
.scroller-con.skin_cerc .scrollbarx svg.arrow-left, .scroller-con.skin_cerc .scrollbarx svg.arrow-right {
    width: 3px;
    height: 7px;
    position: absolute;
    top: 8px;
    left: 5px; }
.scroller-con.skin_cerc .scrollbarx svg.arrow-left path, .scroller-con.skin_cerc .scrollbarx svg.arrow-right path {
    fill: #e5c100; }
.scroller-con.skin_cerc .scrollbarx svg.arrow-right {
    right: 5px;
    left: auto;
    transform: scaleX(-1); }
.scroller-con.skin_cerc .scrollbarx_bg {
    opacity: 1;
    border-radius: 0;
    background-color: rgba(50, 50, 50, 0.1);
    height: 1px;
    top: 100%;
    bottom: auto;
    margin-top: 18px; }

.scroller-con.place-scrollbar-left .scrollbary, .scroller-con.place-scrollbar-left .scrollbary_bg {
    left: auto;
    right: 100%; }

body.scroller-con {
    overflow: hidden !important;
    margin-top: 0 !important; }

body.scroller-con .inner {
    width: 100%; }

body.scroller-con.skin_blackwhite .scrollbary {
    right: 0; }

body.scroller-con.skin_blackwhite .scrollbary_bg {
    right: 5px;
}

.fullwidth {
    width: 100%; }

.fullheight {
    height: 100%; }

/*# sourceMappingURL=scroller.css.map */

@media(max-width: 768px){
    .zoomtimeline.mode-oncenter .ztm-item .the-image-con .the-image {
        width: 125px;
        height: 125px;
        margin-top: 47px;
    }
}