/* CSS aaDocument */

@import url(https://fonts.googleapis.com/css?family=Prata);
@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);
/* line 12, ../scss/components/fonts/_font-lightcase.scss */
@import url(resource/fontMy/css/style.css);

@import url(../scripts/resource/mCustomScrollbar/jquery.mCustomScrollbar.css);
@import url(../scripts/resource/Magnific-Popup/magnific-popup.css);
[class*='lightcase-icon-']:before {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */
    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;
    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;
    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;
    /* you can be more comfortable with increased icons size */
    /* font-size: 120%; */
    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale/* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}



/* 廣域指定微軟正黑 */
@font-face {
    font-family: 'Microsoft JhengHei';
    src: local(Microsoft JhengHei);
}

/* 碧筵綰的時候使用細體微軟正黑 */
@font-face {
    font-family: 'Microsoft JhengHei';
    unicode-range: U+7db0, U+78A7, U+7B75;
    font-style: normal;
    font-weight: normal;
    src: local(Microsoft JhengHei);
}


/* Codes */

/* line 35, ../scss/components/fonts/_font-lightcase.scss */

.lightcase-icon-play:before {
    content: '\e830';
}


/* line 36, ../scss/components/fonts/_font-lightcase.scss */

.lightcase-icon-pause:before {
    content: '\e852';
}


/* line 37, ../scss/components/fonts/_font-lightcase.scss */

.lightcase-icon-close:before {
    content: '\e812';
}


/* line 38, ../scss/components/fonts/_font-lightcase.scss */

.lightcase-icon-prev:before {
    content: '\e818';
}


/* line 39, ../scss/components/fonts/_font-lightcase.scss */

.lightcase-icon-next:before {
    content: '\e819';
}


/* line 40, ../scss/components/fonts/_font-lightcase.scss */

.lightcase-icon-spin:before {
    content: '\e805';
}


/** Mixin providing icon defaults to be used on top of font-lightcase.  Example usage: @include icon(#e9e9e9) */


/** Mixin providing icon defaults including a hover status to be used on top of font-lightcase.  Example usage: @include icon-hover(#e9e9e9, #fff) */


/** Provides natural content overflow behavior and scrolling support even so for touch devices.  Example usage: @include overflow() */


/** Neutralizes/resets dimensions including width, height, position as well as margins, paddings and styles. Used to enforce a neutral and unstyled look and behavoir!  Example usage: @include clear(true)  @param boolean $important */

@-webkit-keyframes lightcase-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@-ms-keyframes lightcase-spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@keyframes lightcase-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}


/* line 1, ../scss/components/modules/_case.scss */

#lightcase-case {
    display: none;
    position: fixed;
    z-index: 2002;
    top: 50%;
    left: 50%;
    font-family: arial, sans-serif;
    font-size: 13px;
    line-height: 1.5;
    text-align: left;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

@media screen and (max-width: 640px) {
    /* line 16, ../scss/components/modules/_case.scss */
    #lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        background: none !important;
    }
}

@media screen and (min-width: 641px) {
    /* line 4, ../scss/components/modules/_content.scss */
    #lightcase-case:not([data-lc-type=error]) #lightcase-content {
        position: relative;
        z-index: 1;
        overflow: hidden;
        text-shadow: none;
        background-color: #fff;
        -o-box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
        -webkit-backface-visibility: hidden;
    }
}

@media screen and (min-width: 641px) {
    /* line 24, ../scss/components/modules/_content.scss */
    #lightcase-case[data-lc-type=image] #lightcase-content, #lightcase-case[data-lc-type=video] #lightcase-content {
        background-color: #333;
    }
}


/* line 32, ../scss/components/modules/_content.scss */

#lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-content {
    -o-box-shadow: none;
    box-shadow: none;
}

@media screen and (max-width: 640px) {
    /* line 32, ../scss/components/modules/_content.scss */
    #lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-content {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        background: none !important;
    }
}


/* line 42, ../scss/components/modules/_content.scss */

#lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-content .lightcase-contentInner {
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 640px) {
    /* line 42, ../scss/components/modules/_content.scss */
    #lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-content .lightcase-contentInner {
        padding: 15px;
    }
    /* line 51, ../scss/components/modules/_content.scss */
    #lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-content .lightcase-contentInner, #lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-content .lightcase-contentInner > * {
        width: 100% !important;
        max-width: none !important;
    }
    /* line 58, ../scss/components/modules/_content.scss */
    #lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-content .lightcase-contentInner > *:not(iframe) {
        height: auto !important;
        max-height: none !important;
    }
}

@media screen and (max-width: 640px) {
    /* line 69, ../scss/components/modules/_content.scss */
    .lightcase-isMobileDevice #lightcase-case[data-lc-type=iframe] #lightcase-content .lightcase-contentInner iframe {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media screen and (max-width: 640px) and (min-width: 641px) {
    /* line 73, ../scss/components/modules/_content.scss */
    [data-lc-type=image] #lightcase-content .lightcase-contentInner, [data-lc-type=video] #lightcase-content .lightcase-contentInner {
        line-height: 0.75;
    }
}

@media screen and (max-width: 640px) {
    /* line 85, ../scss/components/modules/_content.scss */
    #lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-content .lightcase-contentInner .lightcase-inlineWrap {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        background: none !important;
    }
}

@media screen and (min-width: 641px) {
    /* line 92, ../scss/components/modules/_content.scss */
    #lightcase-case:not([data-lc-type=error]) #lightcase-content .lightcase-contentInner .lightcase-inlineWrap {
        padding: 30px;
        overflow: auto;
        -o-box-sizing: border-box;
        box-sizing: border-box;
    }
}

@media screen and (max-width: 640px) {
    /* line 109, ../scss/components/modules/_content.scss */
    #lightcase-content h1, #lightcase-content h2, #lightcase-content h3, #lightcase-content h4, #lightcase-content h5, #lightcase-content h6, #lightcase-content p {
        color: #aaa;
    }
}

@media screen and (min-width: 641px) {
    /* line 109, ../scss/components/modules/_content.scss */
    #lightcase-content h1, #lightcase-content h2, #lightcase-content h3, #lightcase-content h4, #lightcase-content h5, #lightcase-content h6, #lightcase-content p {
        color: #333;
    }
}


/* line 3, ../scss/components/modules/_error.scss */

#lightcase-case p.lightcase-error {
    margin: 0;
    font-size: 17px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #aaa;
}

@media screen and (max-width: 640px) {
    /* line 3, ../scss/components/modules/_error.scss */
    #lightcase-case p.lightcase-error {
        padding: 30px 0;
    }
}

@media screen and (min-width: 641px) {
    /* line 3, ../scss/components/modules/_error.scss */
    #lightcase-case p.lightcase-error {
        padding: 0;
    }
}


/* line 6, ../scss/components/modules/_global.scss */

.lightcase-isMobileDevice .lightcase-open body {
    max-width: 100%;
    max-height: 100%;
    overflow: hidden;
}

@media screen and (max-width: 640px) {
    /* line 4, ../scss/components/modules/_global.scss */
    .lightcase-open body {
        padding: 55px 0 70px 0;
    }
    /* line 15, ../scss/components/modules/_global.scss */
    .lightcase-open body > *:not([id*='lightcase-']) {
        position: fixed !important;
        top: -9999px !important;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
    }
}


/* line 1, ../scss/components/modules/_info.scss */

#lightcase-info {
    position: absolute;
    padding-top: 15px;
}


/* line 9, ../scss/components/modules/_info.scss */

#lightcase-info #lightcase-title, #lightcase-info #lightcase-caption {
    margin: 0;
    padding: 0;
    line-height: 1.5;
    font-weight: normal;
    text-overflow: ellipsis;
}


/* line 19, ../scss/components/modules/_info.scss */

#lightcase-info #lightcase-title {
    font-size: 17px;
    color: #aaa;
}

@media screen and (max-width: 640px) {
    /* line 19, ../scss/components/modules/_info.scss */
    #lightcase-info #lightcase-title {
        position: fixed;
        top: 10px;
        left: 0;
        max-width: 87.5%;
        padding: 5px 15px;
        background: #333;
    }
}


/* line 33, ../scss/components/modules/_info.scss */

#lightcase-info #lightcase-caption {
    clear: both;
    font-size: 13px;
    color: #aaa;
}


/* line 39, ../scss/components/modules/_info.scss */

#lightcase-info #lightcase-sequenceInfo {
    font-size: 11px;
    color: #aaa;
}

@media screen and (max-width: 640px) {
    /* line 45, ../scss/components/modules/_info.scss */
    .lightcase-fullScreenMode #lightcase-info {
        padding-left: 15px;
        padding-right: 15px;
    }
    /* line 51, ../scss/components/modules/_info.scss */
    #lightcase-case:not([data-lc-type=image]):not([data-lc-type=video]):not([data-lc-type=flash]):not([data-lc-type=error]) #lightcase-info {
        position: static;
    }
}
@media screen and (max-width: 768px) {
    .banner-icon{
        display:none;
    }
}
/* line 1, ../scss/components/modules/_loading.scss */

#lightcase-loading {
    position: fixed;
    z-index: 9999;
    width: 30px;
    height: 30px;
    line-height: 1;
    text-align: center;
    text-shadow: none;
    position: fixed;
    z-index: 2001;
    top: 50%;
    left: 50%;
    margin-top: -15px;
    margin-left: -15px;
    opacity: 1;
    font-size: 32px;
    text-align: center;
    text-shadow: 0 0 15px #fff/*-moz-transform-origin: 50% 50%;
-webkit-animation: lightcase-spin 0.5s infinite linear;
-moz-animation: lightcase-spin 0.5s infinite linear;
-o-animation: lightcase-spin 0.5s infinite linear;*/
}

#lightcase-loading:before {
    line-height: 30px;
    -webkit-animation: lightcase-spin 0.5s infinite linear;
    animation: lightcase-spin 0.5s infinite linear;
}


/* line 20, ../scss/components/mixins/_presets.scss */

#lightcase-loading, #lightcase-loading:focus {
    text-decoration: none;
    color: #fff;
    /* -webkit-tap-highlight-color: transparent;
-webkit-transition: color, opacity, ease-in-out 0.25s;
-moz-transition: color, opacity, ease-in-out 0.25s;
-o-transition: color, opacity, ease-in-out 0.25s;*/
    -webkit-transition: color, opacity, ease-in-out 0.25s;
    transition: color, opacity, ease-in-out 0.25s;
}


/* line 32, ../scss/components/mixins/_presets.scss */

#lightcase-loading > span {
    display: inline-block;
    text-indent: -9999px;
}


/* line 4, ../scss/components/modules/_navigation.scss */

#lightcase-nav a[class*='lightcase-icon-'] {
    position: fixed;
    z-index: 9999;
    width: 1.123em;
    height: auto;
    font-size: 38px;
    line-height: 1;
    text-align: center;
    text-shadow: none;
    outline: none;
    cursor: pointer;
}


/* line 20, ../scss/components/mixins/_presets.scss */

#lightcase-nav a[class*='lightcase-icon-'], #lightcase-nav a[class*='lightcase-icon-']:focus {
    text-decoration: none;
    color: rgba(255, 255, 255, 0.6);
    -webkit-tap-highlight-color: transparent;
    -webkit-transition: color, opacity, ease-in-out 0.25s;
    transition: color, opacity, ease-in-out 0.25s;
}


/* line 32, ../scss/components/mixins/_presets.scss */

#lightcase-nav a[class*='lightcase-icon-'] > span {
    display: inline-block;
    text-indent: -9999px;
}


/* line 49, ../scss/components/mixins/_presets.scss */

#lightcase-nav a[class*='lightcase-icon-']:hover {
    color: white;
    text-shadow: 0 0 15px white;
}


/* line 12, ../scss/components/modules/_navigation.scss */

.lightcase-isMobileDevice #lightcase-nav a[class*='lightcase-icon-']:hover {
    color: #aaa;
    text-shadow: none;
}


/* line 19, ../scss/components/modules/_navigation.scss */

#lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-prev {
    left: 15px;
}


/* line 24, ../scss/components/modules/_navigation.scss */

#lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-next {
    right: 15px;
}


/* line 29, ../scss/components/modules/_navigation.scss */

#lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-pause, #lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-play {
    left: 50%;
    margin-left: -0.5em;
}

@media screen and (min-width: 641px) {
    /* line 29, ../scss/components/modules/_navigation.scss */
    #lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-pause, #lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-play {
        opacity: 0;
    }
}


/* line 40, ../scss/components/modules/_navigation.scss */

#lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-close {
    top: 15px;
    right: 15px;
    bottom: auto;
    margin: 0;
    opacity: 0;
    outline: none;
}

@media screen and (max-width: 640px) {
    /* line 40, ../scss/components/modules/_navigation.scss */
    #lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-close {
        position: absolute;
    }
}

@media screen and (min-width: 641px) {
    /* line 40, ../scss/components/modules/_navigation.scss */
    #lightcase-nav a[class*='lightcase-icon-'].lightcase-icon-close {
        position: fixed;
    }
}

@media screen and (max-width: 640px) {
    /* line 4, ../scss/components/modules/_navigation.scss */
    #lightcase-nav a[class*='lightcase-icon-'] {
        bottom: 15px;
        font-size: 24px;
    }
}

@media screen and (min-width: 641px) {
    /* line 4, ../scss/components/modules/_navigation.scss */
    #lightcase-nav a[class*='lightcase-icon-'] {
        bottom: 50%;
        margin-bottom: -0.5em;
    }
    /* line 66, ../scss/components/modules/_navigation.scss */
    #lightcase-nav a[class*='lightcase-icon-']:hover, #lightcase-case:hover ~ #lightcase-nav a[class*='lightcase-icon-'] {
        opacity: 1;
    }
}


/* line 1, ../scss/components/modules/_overlay.scss */

#lightcase-overlay {
    display: none;
    width: 100%;
    min-height: 100%;
    position: fixed;
    z-index: 2000;
    top: -9999px;
    bottom: -9999px;
    left: 0;
    background: #333;
}

@media screen and (max-width: 640px) {
    /* line 1, ../scss/components/modules/_overlay.scss */
    #lightcase-overlay {
        opacity: 1 !important;
    }
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
    height: auto;
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
    height: 100%;
}

.slick-list:focus {
    outline: none;
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}

.slick-loading .slick-list {
    background: #fff url("./ajax-loader.gif") center center no-repeat;
}

.slick-slider .slick-track, .slick-slider .slick-list {
    height: 100%;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    display: block;
    height: 100%;
}

.slick-track:before, .slick-track:after {
    display: table;
    content: '';
}

.slick-track:after {
    clear: both;
}

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
}

[dir='rtl'] .slick-slide {
    float: right;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent;
}


/* Arrows */

.slick-prev, .slick-next {
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    display: block;
    padding: 0;
    cursor: pointer;
    border: none;
    outline: none;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    color: #ffffff;
    z-index: 99;
    background-color: transparent;
    border-radius: 50%;
    border: 1px solid #fff;
    width: 60px;
    height: 60px;
}

.slick-prev .sr-only, .slick-next .sr-only {
    display: none;
}

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
    outline: none;
}

.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
    opacity: 1;
}

.slick-prev:before, .slick-next:before {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

.slick-prev.slick-disabled, .slick-next.slick-disabled {
    color: #d22129;
}

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
    opacity: .25;
}

.slick-prev {
    left: 0%;
}

.slick-prev:before {
    content: '\e818';
}

.slick-next {
    right: 0%;
}

.slick-next:before {
    content: '\e819';
}


/* Dots */

.slick-dots {
    position: absolute;
    bottom: -45px;
    display: block;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0 10px;
    padding: 0;
    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 15px;
    height: 15px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    border: 3px solid #ffffff;
    outline: none;
    border-radius: 100%;
    background-color: #555555;
}

.slick-dots li button:before {
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    text-align: center;
    opacity: .25;
    color: black;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-dots li button:hover, .slick-dots li button:focus {
    outline: none;
}

.slick-dots li button:hover:before, .slick-dots li button:focus:before {
    opacity: 1;
}

.slick-dots li.slick-active button {
    background-color: #e60012;
    border: 3px solid #e60012;
}

.slick-dots li.slick-active button:before {
    opacity: .75;
    color: black;
}

.noSlider.slick-slider .slick-track {
    text-align: center;
    width: 100% !important;
    -webkit-transform: translate3d(0px, 0px, 0px) !important;
    transform: translate3d(0px, 0px, 0px) !important;
}

.noSlider.slick-slider .slick-slide {
    float: none;
    display: inline-block;
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
    height: 100%;
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
    height: 100%;
}

.slick-list:focus {
    outline: none;
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}

.slick-loading .slick-list {
    background: #fff url("./ajax-loader.gif") center center no-repeat;
}

.slick-slider .slick-track, .slick-slider .slick-list {
    height: 100%;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    display: block;
    height: 100%;
}

.slick-track:before, .slick-track:after {
    display: table;
    content: '';
}

.slick-track:after {
    clear: both;
}

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
}

[dir='rtl'] .slick-slide {
    float: right;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent;
}


/* Arrows */

.slick-prev, .slick-next {
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    display: block;
    padding: 0;
    cursor: pointer;
    border: none;
    outline: none;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    color: #ffffff;
    z-index: 99;
    background-color: transparent;
    border-radius: 50%;
    border: 1px solid #fff;
    width: 60px;
    height: 60px;
}

.slick-prev .sr-only, .slick-next .sr-only {
    display: none;
}

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
    outline: none;
}

.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
    opacity: 1;
}

.slick-prev:before, .slick-next:before {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

.slick-prev.slick-disabled, .slick-next.slick-disabled {
    color: #d22129;
}

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
    opacity: .25;
}

.slick-prev {
    left: 0%;
}

.slick-prev:before {
    content: '\e818';
}

.slick-next {
    right: 0%;
}

.slick-next:before {
    content: '\e819';
}


/* Dots */

.slick-dots {
    position: absolute;
    bottom: -45px;
    display: block;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0 10px;
    padding: 0;
    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 15px;
    height: 15px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    border: 3px solid #ffffff;
    outline: none;
    border-radius: 100%;
    background-color: #555555;
}

.slick-dots li button:before {
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    text-align: center;
    opacity: .25;
    color: black;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-dots li button:hover, .slick-dots li button:focus {
    outline: none;
}

.slick-dots li button:hover:before, .slick-dots li button:focus:before {
    opacity: 1;
}

.slick-dots li.slick-active button {
    background-color: #e60012;
    border: 3px solid #e60012;
}

.slick-dots li.slick-active button:before {
    opacity: .75;
    color: black;
}

.noSlider.slick-slider .slick-track {
    text-align: center;
    width: 100% !important;
    -webkit-transform: translate3d(0px, 0px, 0px) !important;
    transform: translate3d(0px, 0px, 0px) !important;
}

.noSlider.slick-slider .slick-slide {
    float: none;
    display: inline-block;
}


/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;

}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block;
}

audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline;
}

audio:not([controls]) {
    display: none;
    height: 0;
}

[hidden], template {
    display: none;
}

a {
    background-color: transparent;
}

a:active {
    outline: 0;
}

a:hover {
    outline: 0;
}

abbr[title] {
    border-bottom: 1px dotted;
}

b, strong {
    font-weight: bold;
}

dfn {
    font-style: italic;
}

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

mark {
    background: #ff0;
    color: #000;
}

small {
    font-size: 80%;
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

img {
    border: 0;
}

svg:not(:root) {
    overflow: hidden;
}

figure {
    margin: 1em 40px;
}

hr {
    box-sizing: content-box;
    height: 0;
}

pre {
    overflow: auto;
}

code, kbd, pre, samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}

button {
    overflow: visible;
}

button, select {
    text-transform: none;
}

button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

button[disabled], html input[disabled] {
    cursor: default;
}

button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

input {
    line-height: normal;
}

input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

input[type="search"] {
    -webkit-appearance: textfield;
    box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

legend {
    border: 0;
    padding: 0;
}

textarea {
    overflow: auto;
}

optgroup {
    font-weight: bold;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

td, th {
    padding: 0;
}

dl {
    margin-top: 0;
    margin-bottom: 20px;
}

dt, dd {
    line-height: 1.42857143;
}

dt {
    font-weight: bold;
}

dd {
    margin-left: 0;
}

address {
    font-style: normal;
    display: inline-block;
}


/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.animated.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
}

.animated.flipOutX, .animated.flipOutY, .animated.bounceIn, .animated.bounceOut {
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
}

@-webkit-keyframes bounce {
    from, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0);
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0);
    }
}

@keyframes bounce {
    from, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0);
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0);
    }
}

.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom;
}

@-webkit-keyframes flash {
    from, 50%, to {
        opacity: 1;
    }
    25%, 75% {
        opacity: 0;
    }
}

@keyframes flash {
    from, 50%, to {
        opacity: 1;
    }
    25%, 75% {
        opacity: 0;
    }
}

.flash {
    -webkit-animation-name: flash;
    animation-name: flash;
}


/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes pulse {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse;
}

@-webkit-keyframes rubberBand {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }
    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }
    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }
    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }
    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes rubberBand {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }
    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }
    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }
    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }
    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand;
}

@-webkit-keyframes shake {
    from, to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}

@keyframes shake {
    from, to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}

.shake {
    -webkit-animation-name: shake;
    animation-name: shake;
}

@-webkit-keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg);
    }
    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg);
    }
    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg);
    }
    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg);
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg);
    }
    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg);
    }
    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg);
    }
    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg);
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.headShake {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-name: headShake;
    animation-name: headShake;
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg);
    }
    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg);
    }
    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg);
    }
    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg);
    }
    to {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg);
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg);
    }
    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg);
    }
    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg);
    }
    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg);
    }
    to {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg);
    }
}

.swing {
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing;
}

@-webkit-keyframes tada {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    10%, 20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes tada {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    10%, 20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.tada {
    -webkit-animation-name: tada;
    animation-name: tada;
}


/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
    from {
        -webkit-transform: none;
        transform: none;
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    }
    to {
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes wobble {
    from {
        -webkit-transform: none;
        transform: none;
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    }
    to {
        -webkit-transform: none;
        transform: none;
    }
}

.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble;
}

@-webkit-keyframes jello {
    from, 11.1%, to {
        -webkit-transform: none;
        transform: none;
    }
    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg);
    }
    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg);
    }
    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg);
    }
    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg);
    }
    66.6% {
        -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
        transform: skewX(-0.78125deg) skewY(-0.78125deg);
    }
    77.7% {
        -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
        transform: skewX(0.39063deg) skewY(0.39063deg);
    }
    88.8% {
        -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
        transform: skewX(-0.19531deg) skewY(-0.19531deg);
    }
}

@keyframes jello {
    from, 11.1%, to {
        -webkit-transform: none;
        transform: none;
    }
    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg);
    }
    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg);
    }
    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg);
    }
    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg);
    }
    66.6% {
        -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
        transform: skewX(-0.78125deg) skewY(-0.78125deg);
    }
    77.7% {
        -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
        transform: skewX(0.39063deg) skewY(0.39063deg);
    }
    88.8% {
        -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
        transform: skewX(-0.19531deg) skewY(-0.19531deg);
    }
}

.jello {
    -webkit-animation-name: jello;
    animation-name: jello;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
}

@-webkit-keyframes bounceIn {
    from, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }
    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }
    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }
    to {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes bounceIn {
    from, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }
    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }
    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }
    to {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.bounceIn {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0);
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0);
    }
    to {
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes bounceInDown {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0);
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0);
    }
    to {
        -webkit-transform: none;
        transform: none;
    }
}

.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0);
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0);
    }
    to {
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes bounceInLeft {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0);
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0);
    }
    to {
        -webkit-transform: none;
        transform: none;
    }
}

.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    from {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0);
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0);
    }
    to {
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes bounceInRight {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    from {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0);
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0);
    }
    to {
        -webkit-transform: none;
        transform: none;
    }
}

.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0);
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes bounceInUp {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0);
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }
    50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
}

@keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }
    50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
}

.bounceOut {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0);
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
}

@keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0);
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
}

.bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
}

@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
}

.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
}

@keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
}

.bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
}

@keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
}

.bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInDownBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInLeftBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInRightBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInUpBig {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

@keyframes fadeOutDown {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

.fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
}

@keyframes fadeOutDownBig {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
}

.fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@keyframes fadeOutLeft {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
}

@keyframes fadeOutLeftBig {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
}

.fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

@keyframes fadeOutRight {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
}

@keyframes fadeOutRightBig {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
}

.fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

@keyframes fadeOutUp {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

.fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
}

@keyframes fadeOutUpBig {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
}

.fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
    from {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    40% {
        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    50% {
        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    80% {
        -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
        transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
}

@keyframes flip {
    from {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    40% {
        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
    50% {
        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    80% {
        -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
        transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
}

.animated.flip {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flip;
    animation-name: flip;
}

@-webkit-keyframes flipInX {
    from {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1;
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

@keyframes flipInX {
    from {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1;
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX;
}

@-webkit-keyframes flipInY {
    from {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1;
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

@keyframes flipInY {
    from {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1;
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

.flipInY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1;
    }
    to {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0;
    }
}

@keyframes flipOutX {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1;
    }
    to {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0;
    }
}

.flipOutX {
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1;
    }
    to {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0;
    }
}

@keyframes flipOutY {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1;
    }
    to {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0;
    }
}

.flipOutY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
    from {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
    }
    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1;
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
        opacity: 1;
    }
    to {
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

@keyframes lightSpeedIn {
    from {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
    }
    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1;
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
        opacity: 1;
    }
    to {
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

.lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
    from {
        opacity: 1;
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0;
    }
}

@keyframes lightSpeedOut {
    from {
        opacity: 1;
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0;
    }
}

.lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    animation-name: lightSpeedOut;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
    from {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, -200deg);
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

@keyframes rotateIn {
    from {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, -200deg);
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

.rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

@keyframes rotateInDownLeft {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

.rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

@keyframes rotateInDownRight {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

.rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

@keyframes rotateInUpLeft {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

.rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -90deg);
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

@keyframes rotateInUpRight {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -90deg);
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0;
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

.rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
    from {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, 200deg);
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0;
    }
}

@keyframes rotateOut {
    from {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, 200deg);
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0;
    }
}

.rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
}

@keyframes rotateOutDownLeft {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
}

.rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
}

@keyframes rotateOutDownRight {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
}

.rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
}

@keyframes rotateOutUpLeft {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
}

.rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 90deg);
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0;
    }
}

@keyframes rotateOutUpRight {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;
    }
    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 90deg);
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0;
    }
}

.rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
    }
    20%, 60% {
        -webkit-transform: rotate3d(0, 0, 1, 80deg);
        transform: rotate3d(0, 0, 1, 80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
    }
    40%, 80% {
        -webkit-transform: rotate3d(0, 0, 1, 60deg);
        transform: rotate3d(0, 0, 1, 60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1;
    }
    to {
        -webkit-transform: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0;
    }
}

@keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
    }
    20%, 60% {
        -webkit-transform: rotate3d(0, 0, 1, 80deg);
        transform: rotate3d(0, 0, 1, 80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
    }
    40%, 80% {
        -webkit-transform: rotate3d(0, 0, 1, 60deg);
        transform: rotate3d(0, 0, 1, 60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1;
    }
    to {
        -webkit-transform: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0;
    }
}

.hinge {
    -webkit-animation-name: hinge;
    animation-name: hinge;
}


/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes rollIn {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn;
}


/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    }
}

@keyframes rollOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    }
}

.rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
        opacity: 1;
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
        opacity: 1;
    }
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoomInDown {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoomInLeft {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoomInRight {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoomInUp {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
    from {
        opacity: 1;
    }
    50% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    to {
        opacity: 0;
    }
}

@keyframes zoomOut {
    from {
        opacity: 1;
    }
    50% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    to {
        opacity: 0;
    }
}

.zoomOut {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoomOutDown {
    -webkit-animation-name: zoomOutDown;
    animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
        transform: scale(0.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center;
    }
}

@keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
        transform: scale(0.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center;
    }
}

.zoomOutLeft {
    -webkit-animation-name: zoomOutLeft;
    animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
        transform: scale(0.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center;
    }
}

@keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    }
    to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
        transform: scale(0.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center;
    }
}

.zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInDown {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInLeft {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
    from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInRight {
    from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInUp {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

@keyframes slideOutDown {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

.slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@keyframes slideOutLeft {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

@keyframes slideOutRight {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

.slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

@keyframes slideOutUp {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

.slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp;
}

@-webkit-keyframes imgScale {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes imgScale {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes downIn {
    0% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 0.7;
    }
}

@keyframes downIn {
    0% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 0.7;
    }
}

@-webkit-keyframes downIn2 {
    0% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}

@keyframes downIn2 {
    0% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}

@-webkit-keyframes upIn {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 0.7;
    }
}

@keyframes upIn {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 0.7;
    }
}

@-webkit-keyframes upIn2 {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 1;
    }
}

@keyframes upIn2 {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 1;
    }
}

@-webkit-keyframes upIn3 {
    0% {
        -webkit-transform: translateY(0px) translateX(-50%);
        transform: translateY(0px) translateX(-50%);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(-10px) translateX(-50%);
        transform: translateY(-10px) translateX(-50%);
        opacity: 1;
    }
}

@keyframes upIn3 {
    0% {
        -webkit-transform: translateY(0px) translateX(-50%);
        transform: translateY(0px) translateX(-50%);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(-10px) translateX(-50%);
        transform: translateY(-10px) translateX(-50%);
        opacity: 1;
    }
}

@-webkit-keyframes rightIn {
    0% {
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
        opacity: 1;
    }
}

@keyframes rightIn {
    0% {
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
        opacity: 1;
    }
}

@-webkit-keyframes leftIn {
    0% {
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
        opacity: 1;
    }
}

@keyframes leftIn {
    0% {
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
        opacity: 1;
    }
}

@-webkit-keyframes ad {
    0% {
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
        opacity: 0;
    }
    50% {
        -webkit-transform: scale3d(1.3, 1.3, 1.3);
        transform: scale3d(1.3, 1.3, 1.3);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes ad {
    0% {
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
        opacity: 0;
    }
    50% {
        -webkit-transform: scale3d(1.3, 1.3, 1.3);
        transform: scale3d(1.3, 1.3, 1.3);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.loaded .ad {
    -webkit-animation-name: ad;
    animation-name: ad;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}


/* === location ===*/


/* === font ===*/


/* === main color ===*/


/* === margin padding ===*/


/* === style ===*/


/* === table ===*/

* {
    outline: none;
}

input, button, select, textarea {
    outline: none;
}


/* === df ===*/

body {
    font-family: Microsoft JhengHei, MHei, PingFang TC, Helvetica Neue, Helvetica, STHeitiTC-Light, Arial, sans-serif;
    -webkit-overflow-scrolling: touch;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 25px;
}

.max-md-size .container {
    padding: 0 15px;
}

.container-xl {
    max-width: 1480px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 25px;
}

.max-md-size .container-xl {
    padding: 0 15px;
}

.container-sm {
    max-width: 900px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 25px;
}

.max-md-size .container-sm {
    padding: 0 15px;
}

.min-w-sm {
    min-width: 700px;
}

.container-xs {
    max-width: 600px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 25px;
}

.max-md-size .container-xs {
    padding: 0 15px;
}

.container-xs {
    max-width: 600px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 25px;
}

.max-md-size .container-xs {
    padding: 0 15px;
}

.img-responsive {
    max-width: 100%;
    height: auto;
}


/* === font ===*/

.h1 {
    /*50px;*/
    font-size: 3.125rem !important;
}

.h2 {
    font-size: 30px;
    line-height: 1.2;
}

.max-lg-size .h2 {
    font-size: 27px;
}

.max-md-size .h2 {
    font-size: 20px;
}

.max-sm-size .h2 {
    font-size: 17px;
}

.h3 {
    /*25px;*/
    font-size: 25px;
}

.max-lg-size .h3 {
    font-size: 20px;
}

.max-md-size .h3 {
    font-size: 17px;
}

.max-sm-size .h3 {
    font-size: 15px;
}

.h4 {
    /*20px;*/
    font-size: 1.25rem !important;
}

.h5 {
    /*18px;*/
    font-size: 18px;
}

.max-lg-size .h5 {
    font-size: 17px;
}

.max-md-size .h5 {
    font-size: 16px;
}

.max-sm-size .h5 {
    font-size: 15px;
}

.p {
    font-size: 1rem;
    font-weight: normal;
}

.text-justify {
    text-align: justify !important;
}

.text-nowrap {
    white-space: nowrap !important;
}

.text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text-center {
    text-align: center !important;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-lowercase {
    text-transform: lowercase !important;
}

.text-uppercase {
    text-transform: uppercase !important;
}

.text-capitalize {
    text-transform: capitalize !important;
}

small, .small {
    font-size: 80%;
    font-weight: normal;
}

.text-muted {
    color: #818a91;
}

.red {
    color: red;
}


/* === focuspoint.js ===*/

.imgfull {
    position: relative;
    overflow: hidden;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    display: inline-block;
}

.imgfull img {
    position: absolute;
    left: 0;
    top: 0;
    margin: 0;
    display: block;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    max-height: none;
    max-width: none;
}

.s-hidden {
    visibility: hidden;
    padding-right: 10px;
}


/* === list ===*/

.list-unstyled {
    padding-left: 0;
    list-style: none;
    margin: 0;
}

.list-unstyled ul {
    padding-left: 0;
    list-style: none;
    margin: 0;
}

.list-inline {
    padding-left: 0;
    list-style: none;
    letter-spacing: -3px;
}

.list-inline li, .list-inline > div {
    display: inline-block;
    letter-spacing: 0;
}

.list-inline-item, .col {
    display: inline-block;
}


/* === style ===*/

hr {
    border: 0;
    border-bottom: 1px solid #d6d6d6;
}


/*focuspoint*/

.imgfull {
    position: relative;
    overflow: hidden;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    display: inline-block;
}

.imgfull img {
    position: absolute;
    left:0;
    top: 0;
    margin: 0;
    display: block;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    max-height: none;
    max-width: none;
}

.icon-circle {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 50%;
    border: 1px solid #fff;
    color: #fff;
}

.full {
    display: block;
    height: 100%;
    width: 100%;
    text-decoration: none;
    position: relative;
    box-sizing: border-box;
}

.html {
    line-height: 1.4em;
}

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

.html img {
    max-width: 100%;
    height: auto;
}

.icon-font-b:before, .icon-font-a:after {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */
    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;
    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;
    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;
    /* you can be more comfortable with increased icons size */
    /* font-size: 120%; */
    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale/* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}


/* === hide ===*/

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.text-hide {
    font: "0/0" a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

.invisible {
    visibility: hidden !important;
}

.min-xs-size .min-xs-hidden {
    display: none;
}

.min-xs-size .min-xs-hidden {
    display: none;
}

.min-sm-size .min-sm-hidden {
    display: none;
}


/* === Floats ===*/

.dl-horizontal::after {
    content: "";
    display: table;
    clear: both;
}

.dl-horizontal dt {
    float: left;
    overflow: hidden;
    clear: left;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: bold;
}

.dl-horizontal dd {
    margin-left: 20px;
}

.col {
    display: inline-block !important;
    width: auto !important;
}

.si {
    box-sizing: border-box;
}

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

.pull-left {
    float: left !important;
}

.pull-right {
    float: right !important;
}

.m-x-auto {
    margin-right: auto !important;
    margin-left: auto !important;
}

.m-0 * {
    margin: 0 !important;
}

.m-a-0 {
    margin: 0 !important;
}

.m-t-0 {
    margin-top: 0 !important;
}

.m-r-0 {
    margin-right: 0 !important;
}

.m-b-0 {
    margin-bottom: 0 !important;
}

.m-l-0 {
    margin-left: 0 !important;
}

.m-x-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.m-y-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.m-a {
    margin: 1% !important;
}

.m-t {
    margin-top: 1% !important;
}

.m-r {
    margin-right: 1% !important;
}

.m-b {
    margin-bottom: 1% !important;
}

.m-l {
    margin-left: 1% !important;
}

.m-x {
    margin-right: 1% !important;
    margin-left: 1% !important;
}

.m-y {
    margin-top: 1% !important;
    margin-bottom: 1% !important;
}

.m-x-auto {
    margin-right: auto !important;
    margin-left: auto !important;
}

.m-a-md {
    margin: 2.5% !important;
}

.m-t-md {
    margin-top: 2.5% !important;
}

.m-r-md {
    margin-right: 2.5% !important;
}

.m-b-md {
    margin-bottom: 2.5% !important;
}

.m-l-md {
    margin-left: 2.5% !important;
}

.m-x-md {
    margin-right: 2.5% !important;
    margin-left: 2.5% !important;
}

.m-y-md {
    margin-top: 2.5% !important;
    margin-bottom: 2.5% !important;
}

.m-a-lg {
    margin: 5% !important;
}

.m-t-lg {
    margin-top: 5% !important;
}

.m-r-lg {
    margin-right: 5% !important;
}

.m-b-lg {
    margin-bottom: 5% !important;
}

.m-l-lg {
    margin-left: 5% !important;
}

.m-x-lg {
    margin-right: 5% !important;
    margin-left: 5% !important;
}

.m-y-lg {
    margin-top: 5% !important;
    margin-bottom: 5% !important;
}

.p-a-0 {
    padding: 0 !important;
}

.p-t-0 {
    padding-top: 0 !important;
}

.p-r-0 {
    padding-right: 0 !important;
}

.p-b-0 {
    padding-bottom: 0 !important;
}

.p-l-0 {
    padding-left: 0 !important;
}

.p-x-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.p-y-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.p-a {
    padding: 1% !important;
}

.p-t {
    padding-top: 1% !important;
}

.p-r {
    padding-right: 1% !important;
}

.p-b {
    padding-bottom: 1% !important;
}

.p-l {
    padding-left: 1% !important;
}

.p-x {
    padding-right: 1% !important;
    padding-left: 1% !important;
}

.p-y {
    padding-top: 1% !important;
    padding-bottom: 1% !important;
}

.p-a-md {
    padding: 2.5% !important;
}

.p-t-md {
    padding-top: 2.5% !important;
}

.p-r-md {
    padding-right: 2.5% !important;
}

.p-b-md {
    padding-bottom: 2.5% !important;
}

.p-l-md {
    padding-left: 2.5% !important;
}

.p-x-md {
    padding-right: 2.5% !important;
    padding-left: 2.5% !important;
}

.p-y-md {
    padding-top: 2.5% !important;
    padding-bottom: 2.5% !important;
}

.p-a-lg {
    padding: 5% !important;
}

.p-t-lg {
    padding-top: 5% !important;
}

.p-r-lg {
    padding-right: 5% !important;
}

.p-b-lg {
    padding-bottom: 5% !important;
}

.p-l-lg {
    padding-left: 5% !important;
}

.p-x-lg {
    padding-right: 5% !important;
    padding-left: 5% !important;
}

.p-y-lg {
    padding-top: 5% !important;
    padding-bottom: 5% !important;
}

[class^="column-"]::after, [class*=" column-"]::after {
    content: "";
    display: table;
    clear: both;
}

[class^="column-"] > *, [class*=" column-"] > * {
    float: left;
    box-sizing: border-box;
    vertical-align: top;
}

.column-count-2 {
    -moz-column-count: 2;
    /* Firefox */
    -webkit-column-count: 2;
    /* Safari and Chrome */
    column-count: 2;
    -moz-column-gap: 40px;
    /* Firefox */
    -webkit-column-gap: 40px;
    /* Safari and Chrome */
    column-gap: 40px;
}

.max-md-size .column-count-2 {
    -moz-column-count: 1;
    /* Firefox */
    -webkit-column-count: 1;
    /* Safari and Chrome */
    column-count: 1;
}

.column-count-3 {
    -moz-column-count: 3;
    /* Firefox */
    -webkit-column-count: 3;
    /* Safari and Chrome */
    column-count: 3;
    -moz-column-gap: 40px;
    /* Firefox */
    -webkit-column-gap: 40px;
    /* Safari and Chrome */
    column-gap: 40px;
}

.max-md-size .column-count-3 {
    -moz-column-count: 1;
    /* Firefox */
    -webkit-column-count: 1;
    /* Safari and Chrome */
    column-count: 1;
}

.column-count-4 {
    -moz-column-count: 4;
    /* Firefox */
    -webkit-column-count: 4;
    /* Safari and Chrome */
    column-count: 4;
    -moz-column-gap: 40px;
    /* Firefox */
    -webkit-column-gap: 40px;
    /* Safari and Chrome */
    column-gap: 40px;
}

.max-lg-size .column-count-4 {
    -moz-column-count: 2;
    /* Firefox */
    -webkit-column-count: 2;
    /* Safari and Chrome */
    column-count: 2;
}

.max-md-size .column-count-4 {
    -moz-column-count: 1;
    /* Firefox */
    -webkit-column-count: 1;
    /* Safari and Chrome */
    column-count: 1;
}

.p-x-2 {
    margin: 0 -2.5%;
}

.rows {
    padding: 0 2.5%;
}

[class^="column-"]::after, [class*=" column-"]::after {
    content: "";
    display: table;
    clear: both;
}

[class^="column-"] > *, [class*=" column-"] > * {
    float: left;
    box-sizing: border-box;
    vertical-align: top;
}

[class^="column-"].column-1 > *, [class*=" column-"].column-1 > * {
    width: 100%;
}

[class^="column-"].column-2 > *, [class*=" column-"].column-2 > * {
    width: 50%;
}

[class^="column-"].column-3 > *, [class*=" column-"].column-3 > * {
    width: 33%;
}

[class^="column-"].column-4 > *, [class*=" column-"].column-4 > * {
    width: 25%;
}

[class^="column-"].column-5 > *, [class*=" column-"].column-5 > * {
    width: 20%;
}

.max-bg-size [class^="column-"].column-1-bg > *, .max-bg-size [class*=" column-"].column-1-bg > * {
    width: 100%;
}

.max-bg-size [class^="column-"].column-2-bg > *, .max-bg-size [class*=" column-"].column-2-bg > * {
    width: 50%;
}

.max-bg-size [class^="column-"].column-3-bg > *, .max-bg-size [class*=" column-"].column-3-bg > * {
    width: 33%;
}

.max-bg-size [class^="column-"].column-4-bg > *, .max-bg-size [class*=" column-"].column-4-bg > * {
    width: 25%;
}

.max-bg-size [class^="column-"].column-5-bg > *, .max-bg-size [class*=" column-"].column-5-bg > * {
    width: 20%;
}

.max-lg-size [class^="column-"].column-1-lg > *, .max-lg-size [class*=" column-"].column-1-lg > * {
    width: 100%;
}

.max-lg-size [class^="column-"].column-2-lg > *, .max-lg-size [class*=" column-"].column-2-lg > * {
    width: 50%;
}

.max-lg-size [class^="column-"].column-3-lg > *, .max-lg-size [class*=" column-"].column-3-lg > * {
    width: 33%;
}

.max-lg-size [class^="column-"].column-4-lg > *, .max-lg-size [class*=" column-"].column-4-lg > * {
    width: 25%;
}

.max-lg-size [class^="column-"].column-5-lg > *, .max-lg-size [class*=" column-"].column-5-lg > * {
    width: 20%;
}

.max-md-size [class^="column-"].column-1-md > *, .max-md-size [class*=" column-"].column-1-md > * {
    width: 100%;
}

.max-md-size [class^="column-"].column-2-md > *, .max-md-size [class*=" column-"].column-2-md > * {
    width: 50%;
}

.max-md-size [class^="column-"].column-3-md > *, .max-md-size [class*=" column-"].column-3-md > * {
    width: 33%;
}

.max-md-size [class^="column-"].column-4-md > *, .max-md-size [class*=" column-"].column-4-md > * {
    width: 25%;
}

.max-md-size [class^="column-"].column-5-md > *, .max-md-size [class*=" column-"].column-5-md > * {
    width: 20%;
}

.max-sm-size [class^="column-"].column-1-sm > *, .max-sm-size [class*=" column-"].column-1-sm > * {
    width: 100%;
}

.max-sm-size [class^="column-"].column-2-sm > *, .max-sm-size [class*=" column-"].column-2-sm > * {
    width: 50%;
}

.max-sm-size [class^="column-"].column-3-sm > *, .max-sm-size [class*=" column-"].column-3-sm > * {
    width: 33%;
}

.max-sm-size [class^="column-"].column-4-sm > *, .max-sm-size [class*=" column-"].column-4-sm > * {
    width: 25%;
}

.max-sm-size [class^="column-"].column-5-sm > *, .max-sm-size [class*=" column-"].column-5-sm > * {
    width: 20%;
}

.max-xs-size [class^="column-"].column-1-xs > *, .max-xs-size [class*=" column-"].column-1-xs > * {
    width: 100%;
}

.max-xs-size [class^="column-"].column-2-xs > *, .max-xs-size [class*=" column-"].column-2-xs > * {
    width: 50%;
}

.max-xs-size [class^="column-"].column-3-xs > *, .max-xs-size [class*=" column-"].column-3-xs > * {
    width: 33%;
}

.max-xs-size [class^="column-"].column-4-xs > *, .max-xs-size [class*=" column-"].column-4-xs > * {
    width: 25%;
}

.max-xs-size [class^="column-"].column-5-xs > *, .max-xs-size [class*=" column-"].column-5-xs > * {
    width: 20%;
}

.w-10 {
    width: 10%;
}

.w-15 {
    width: 15%;
}

.w-20 {
    width: 20%;
}

.w-25 {
    width: 25%;
}

.w-30 {
    width: 30%;
}

.w-35 {
    width: 35%;
}

.w-40 {
    width: 40%;
}

.w-45 {
    width: 45%;
}

.w-50 {
    width: 50%;
}

.w-55 {
    width: 55%;
}

.w-60 {
    width: 60%;
}

.w-65 {
    width: 65%;
}

.w-70 {
    width: 70%;
}

.w-75 {
    width: 75%;
}

.w-80 {
    width: 80%;
}

.w-85 {
    width: 85%;
}

.w-90 {
    width: 90%;
}

.w-95 {
    width: 95%;
}

.w-100 {
    width: 20%;
}

.table-hover tbody tr:hover td {
    background-color: #f5f5f5;
}

.table-responsive {
    display: block;
    width: 100%;
    min-height: 0.01%;
    overflow-x: auto;
}

.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 0.5rem;
    border-spacing: 1px;
    background-color: transparent;
}

.table td, .table th {
    padding: .5rem;
    line-height: 2rem;
    vertical-align: top;
    -webkit-transition: background-color 0.2s;
    transition: background-color 0.2s;
}

.table tbody th, .table tbody td {
    border-top: 1px solid #eceeef;
}

.table thead th {
    border-bottom: 2px solid #e60012;
    text-align: center;
    color: #000;
    white-space: nowrap;
}

.table a {
    text-decoration: underline;
    transition: all 0.4s;
}

.memberEngineering .table a{
    color: #343434;
}
.memberEngineering .table a:hover{
    color: #e60012;
}

.table-lg td, .table-lg th {
    padding: 1.2rem;
    line-height: 2.3;
}

button {
    white-space: nowrap;
    -webkit-appearance: none;
}

.btn {
    display: inline-block;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    border: 0;
    padding: 0.375rem 1rem;
    line-height: 1.5;
    text-decoration: none;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    background-color: transparent;
    text-decoration: none;
    box-sizing: border-box;
}

.max-sm-size .btn {
    font-size: 12px;
}

.btn-base {
    color: #fff;
    background-color: #222222;
}

.btn-base:hover {
    background-color: #424242;
}

.btn-red {
    color: #fff;
    background-color: #e72e25;
}

.btn-red:hover {
    color: #fff;
    background-color: #c31e16;
}

.btn-lg {
    padding: 0.8rem 4rem;
    margin: 0 1%;
    font-size: 1.1rem;
    line-height: 1.33333;
}

.max-lg-size .btn-lg {
    padding: 0.6rem 3rem;
    font-size: 15px;
}

.max-sm-size .btn-lg {
    padding: 0.4rem 2rem;
    font-size: 12px;
}

.btn-radius {
    border-radius: 5px;
}

.form-group {
    box-sizing: border-box;
    border-bottom: 1px solid #dddddd;
    position: relative;
    -webkit-transition: border 0.5s;
    transition: border 0.5s;
    margin-bottom: 15px;
    display: table;
    width: 100%;
    padding-bottom: 10px;
}

.form-group::after {
    content: "";
    display: table;
    clear: both;
}

.form-group .form-label, .form-group .form-control, .form-group .form-control-col {
    box-sizing: border-box;
    padding: .375rem .75rem;
    line-height: 1.5;
    color: #55595c;
    background-color: transparent;
    border: 0;
    position: relative;
}

.form-group .form-label {
    white-space: nowrap;
}

.form-group .form-control {
    display: block;
    width: 100%;
}

.max-md-size .form-group .form-control {
    background-color: #f5f5f5;
}

.form-group .form-control-col {
    display: inline-block;
}

.form-group .form-control::-ms-expand {
    background-color: transparent;
    border: 0;
}

.form-group .form-control:focus {
    outline: none;
}

.form-group .form-control::-webkit-input-placeholder {
    color: #999;
    opacity: 1;
}

.form-group .form-control::-moz-placeholder {
    color: #999;
    opacity: 1;
}

.form-group .form-control:-ms-input-placeholder {
    color: #999;
    opacity: 1;
}

.form-group .form-control::placeholder {
    color: #999;
    opacity: 1;
}

.form-group .controls {
    zoom: 1;
    z-index: 1;
    position: relative;
    box-sizing: border-box;
}

.form-group:hover {
    border-bottom: 1px solid #000;
}

.form-group.error {
    border-bottom: 1px solid red;
}

.form-group.warning {
    border-bottom: 1px solid #c09853;
}

.form-group .help-block {
    color: #c09853;
    font-size: 12px;
    position: absolute;
    top: 15px;
    right: 0px;
    color: #e60012;
    padding: 2px 5px;
    border-radius: 5px;
    margin: 0;
}

.form-group .help-block ul {
    padding-left: 0;
    list-style: none;
    margin: 0;
}

.form-group .help-block ul li {
    line-height: normal;
}

.max-md-size .form-group .help-block {
    top: 5px;
    right: 5px;
}

.form-group .left, .form-group .right {
    display: table-cell;
    vertical-align: top;
}

.form-group .left {
    box-sizing: border-box;
    width: 100px;
    z-index: 2;
}

.max-md-size .form-group .left {
    position: relative;
}

.form-group.required .left:after {
    position: absolute;
    top: 5px;
    left: -5px;
    content: '*';
    margin-left: 5px;
    color: red;
}

.form-group .bootstrap-filestyle {
    position: relative;
    border-collapse: separate;
    width: 100%;
}

.form-group .bootstrap-filestyle .form-control {
    padding-left: 100px;
}

.form-group .bootstrap-filestyle .input-group-btn {
    position: absolute;
    top: 0;
    left: 0px;
    border-radius: 5px;
    border: 1px solid #bbbbbb;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f1f1f1+50,e1e1e1+51,f6f6f6+100;White+Gloss+%231 */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,cccccc+100;Gren+3D */
    background: #eeeeee;
    /* Old browsers */
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #eeeeee 0%, #cccccc 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #eeeeee 0%, #cccccc 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    z-index: 3;
    padding: 0;
}

.form-group .bootstrap-filestyle .input-group-btn .btn {
    padding: 5px 10px;
    font-size: 12px;
    margin: 0;
    line-height: 0;
}

.form-group .bootstrap-filestyle .input-group-btn .btn:before {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: '\e83f';
    color: #e60012;
}

.container-fluid {
    margin-left: auto;
    margin-right: auto;
    padding-left: 0.9375rem;
    padding-right: 0.9375rem;
}

.container-fluid::after {
    content: "";
    display: table;
    clear: both;
}

.row {
    margin-left: -0.9375rem;
    margin-right: -0.9375rem;
}

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

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
    position: relative;
    min-height: 1px;
    padding-left: 0.9375rem;
    padding-right: 0.9375rem;
    box-sizing: border-box;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
    float: left;
}

.col-xs-1 {
    width: 8.33333%;
}

.col-xs-2 {
    width: 16.66667%;
}

.col-xs-3 {
    width: 25%;
}

.col-xs-4 {
    width: 33.33333%;
}

.col-xs-5 {
    width: 41.66667%;
}

.col-xs-6 {
    width: 50%;
}

.col-xs-7 {
    width: 58.33333%;
}

.col-xs-8 {
    width: 66.66667%;
}

.col-xs-9 {
    width: 75%;
}

.col-xs-10 {
    width: 83.33333%;
}

.col-xs-11 {
    width: 91.66667%;
}

.col-xs-12 {
    width: 100%;
}

.col-xs-pull-0 {
    right: auto;
}

.col-xs-pull-1 {
    right: 8.33333%;
}

.col-xs-pull-2 {
    right: 16.66667%;
}

.col-xs-pull-3 {
    right: 25%;
}

.col-xs-pull-4 {
    right: 33.33333%;
}

.col-xs-pull-5 {
    right: 41.66667%;
}

.col-xs-pull-6 {
    right: 50%;
}

.col-xs-pull-7 {
    right: 58.33333%;
}

.col-xs-pull-8 {
    right: 66.66667%;
}

.col-xs-pull-9 {
    right: 75%;
}

.col-xs-pull-10 {
    right: 83.33333%;
}

.col-xs-pull-11 {
    right: 91.66667%;
}

.col-xs-pull-12 {
    right: 100%;
}

.col-xs-push-0 {
    left: auto;
}

.col-xs-push-1 {
    left: 8.33333%;
}

.col-xs-push-2 {
    left: 16.66667%;
}

.col-xs-push-3 {
    left: 25%;
}

.col-xs-push-4 {
    left: 33.33333%;
}

.col-xs-push-5 {
    left: 41.66667%;
}

.col-xs-push-6 {
    left: 50%;
}

.col-xs-push-7 {
    left: 58.33333%;
}

.col-xs-push-8 {
    left: 66.66667%;
}

.col-xs-push-9 {
    left: 75%;
}

.col-xs-push-10 {
    left: 83.33333%;
}

.col-xs-push-11 {
    left: 91.66667%;
}

.col-xs-push-12 {
    left: 100%;
}

.col-xs-offset-0 {
    margin-left: 0%;
}

.col-xs-offset-1 {
    margin-left: 8.33333%;
}

.col-xs-offset-2 {
    margin-left: 16.66667%;
}

.col-xs-offset-3 {
    margin-left: 25%;
}

.col-xs-offset-4 {
    margin-left: 33.33333%;
}

.col-xs-offset-5 {
    margin-left: 41.66667%;
}

.col-xs-offset-6 {
    margin-left: 50%;
}

.col-xs-offset-7 {
    margin-left: 58.33333%;
}

.col-xs-offset-8 {
    margin-left: 66.66667%;
}

.col-xs-offset-9 {
    margin-left: 75%;
}

.col-xs-offset-10 {
    margin-left: 83.33333%;
}

.col-xs-offset-11 {
    margin-left: 91.66667%;
}

.col-xs-offset-12 {
    margin-left: 100%;
}

.min-sm-size .col-sm-1, .min-sm-size .col-sm-2, .min-sm-size .col-sm-3, .min-sm-size .col-sm-4, .min-sm-size .col-sm-5, .min-sm-size .col-sm-6, .min-sm-size .col-sm-7, .min-sm-size .col-sm-8, .min-sm-size .col-sm-9, .min-sm-size .col-sm-10, .min-sm-size .col-sm-11, .min-sm-size .col-sm-12 {
    float: left;
}

.min-sm-size .col-sm-1 {
    width: 8.33333%;
}

.min-sm-size .col-sm-2 {
    width: 16.66667%;
}

.min-sm-size .col-sm-3 {
    width: 25%;
}

.min-sm-size .col-sm-4 {
    width: 33.33333%;
}

.min-sm-size .col-sm-5 {
    width: 41.66667%;
}

.min-sm-size .col-sm-6 {
    width: 50%;
}

.min-sm-size .col-sm-7 {
    width: 58.33333%;
}

.min-sm-size .col-sm-8 {
    width: 66.66667%;
}

.min-sm-size .col-sm-9 {
    width: 75%;
}

.min-sm-size .col-sm-10 {
    width: 83.33333%;
}

.min-sm-size .col-sm-11 {
    width: 91.66667%;
}

.min-sm-size .col-sm-12 {
    width: 100%;
}

.min-sm-size .col-sm-pull-0 {
    right: auto;
}

.min-sm-size .col-sm-pull-1 {
    right: 8.33333%;
}

.min-sm-size .col-sm-pull-2 {
    right: 16.66667%;
}

.min-sm-size .col-sm-pull-3 {
    right: 25%;
}

.min-sm-size .col-sm-pull-4 {
    right: 33.33333%;
}

.min-sm-size .col-sm-pull-5 {
    right: 41.66667%;
}

.min-sm-size .col-sm-pull-6 {
    right: 50%;
}

.min-sm-size .col-sm-pull-7 {
    right: 58.33333%;
}

.min-sm-size .col-sm-pull-8 {
    right: 66.66667%;
}

.min-sm-size .col-sm-pull-9 {
    right: 75%;
}

.min-sm-size .col-sm-pull-10 {
    right: 83.33333%;
}

.min-sm-size .col-sm-pull-11 {
    right: 91.66667%;
}

.min-sm-size .col-sm-pull-12 {
    right: 100%;
}

.min-sm-size .col-sm-push-0 {
    left: auto;
}

.min-sm-size .col-sm-push-1 {
    left: 8.33333%;
}

.min-sm-size .col-sm-push-2 {
    left: 16.66667%;
}

.min-sm-size .col-sm-push-3 {
    left: 25%;
}

.min-sm-size .col-sm-push-4 {
    left: 33.33333%;
}

.min-sm-size .col-sm-push-5 {
    left: 41.66667%;
}

.min-sm-size .col-sm-push-6 {
    left: 50%;
}

.min-sm-size .col-sm-push-7 {
    left: 58.33333%;
}

.min-sm-size .col-sm-push-8 {
    left: 66.66667%;
}

.min-sm-size .col-sm-push-9 {
    left: 75%;
}

.min-sm-size .col-sm-push-10 {
    left: 83.33333%;
}

.min-sm-size .col-sm-push-11 {
    left: 91.66667%;
}

.min-sm-size .col-sm-push-12 {
    left: 100%;
}

.min-sm-size .col-sm-offset-0 {
    margin-left: 0%;
}

.min-sm-size .col-sm-offset-1 {
    margin-left: 8.33333%;
}

.min-sm-size .col-sm-offset-2 {
    margin-left: 16.66667%;
}

.min-sm-size .col-sm-offset-3 {
    margin-left: 25%;
}

.min-sm-size .col-sm-offset-4 {
    margin-left: 33.33333%;
}

.min-sm-size .col-sm-offset-5 {
    margin-left: 41.66667%;
}

.min-sm-size .col-sm-offset-6 {
    margin-left: 50%;
}

.min-sm-size .col-sm-offset-7 {
    margin-left: 58.33333%;
}

.min-sm-size .col-sm-offset-8 {
    margin-left: 66.66667%;
}

.min-sm-size .col-sm-offset-9 {
    margin-left: 75%;
}

.min-sm-size .col-sm-offset-10 {
    margin-left: 83.33333%;
}

.min-sm-size .col-sm-offset-11 {
    margin-left: 91.66667%;
}

.min-sm-size .col-sm-offset-12 {
    margin-left: 100%;
}

.min-md-size .col-md-1, .min-md-size .col-md-2, .min-md-size .col-md-3, .min-md-size .col-md-4, .min-md-size .col-md-5, .min-md-size .col-md-6, .min-md-size .col-md-7, .min-md-size .col-md-8, .min-md-size .col-md-9, .min-md-size .col-md-10, .min-md-size .col-md-11, .min-md-size .col-md-12 {
    float: left;
}

.min-md-size .col-md-1 {
    width: 8.33333%;
}

.min-md-size .col-md-2 {
    width: 16.66667%;
}

.min-md-size .col-md-3 {
    width: 25%;
}

.min-md-size .col-md-4 {
    width: 33.33333%;
}

.min-md-size .col-md-5 {
    width: 41.66667%;
}

.min-md-size .col-md-6 {
    width: 50%;
}

.min-md-size .col-md-7 {
    width: 58.33333%;
}

.min-md-size .col-md-8 {
    width: 66.66667%;
}

.min-md-size .col-md-9 {
    width: 75%;
}

.min-md-size .col-md-10 {
    width: 83.33333%;
}

.min-md-size .col-md-11 {
    width: 91.66667%;
}

.min-md-size .col-md-12 {
    width: 100%;
}

.min-md-size .col-md-pull-0 {
    right: auto;
}

.min-md-size .col-md-pull-1 {
    right: 8.33333%;
}

.min-md-size .col-md-pull-2 {
    right: 16.66667%;
}

.min-md-size .col-md-pull-3 {
    right: 25%;
}

.min-md-size .col-md-pull-4 {
    right: 33.33333%;
}

.min-md-size .col-md-pull-5 {
    right: 41.66667%;
}

.min-md-size .col-md-pull-6 {
    right: 50%;
}

.min-md-size .col-md-pull-7 {
    right: 58.33333%;
}

.min-md-size .col-md-pull-8 {
    right: 66.66667%;
}

.min-md-size .col-md-pull-9 {
    right: 75%;
}

.min-md-size .col-md-pull-10 {
    right: 83.33333%;
}

.min-md-size .col-md-pull-11 {
    right: 91.66667%;
}

.min-md-size .col-md-pull-12 {
    right: 100%;
}

.min-md-size .col-md-push-0 {
    left: auto;
}

.min-md-size .col-md-push-1 {
    left: 8.33333%;
}

.min-md-size .col-md-push-2 {
    left: 16.66667%;
}

.min-md-size .col-md-push-3 {
    left: 25%;
}

.min-md-size .col-md-push-4 {
    left: 33.33333%;
}

.min-md-size .col-md-push-5 {
    left: 41.66667%;
}

.min-md-size .col-md-push-6 {
    left: 50%;
}

.min-md-size .col-md-push-7 {
    left: 58.33333%;
}

.min-md-size .col-md-push-8 {
    left: 66.66667%;
}

.min-md-size .col-md-push-9 {
    left: 75%;
}

.min-md-size .col-md-push-10 {
    left: 83.33333%;
}

.min-md-size .col-md-push-11 {
    left: 91.66667%;
}

.min-md-size .col-md-push-12 {
    left: 100%;
}

.min-md-size .col-md-offset-0 {
    margin-left: 0%;
}

.min-md-size .col-md-offset-1 {
    margin-left: 8.33333%;
}

.min-md-size .col-md-offset-2 {
    margin-left: 16.66667%;
}

.min-md-size .col-md-offset-3 {
    margin-left: 25%;
}

.min-md-size .col-md-offset-4 {
    margin-left: 33.33333%;
}

.min-md-size .col-md-offset-5 {
    margin-left: 41.66667%;
}

.min-md-size .col-md-offset-6 {
    margin-left: 50%;
}

.min-md-size .col-md-offset-7 {
    margin-left: 58.33333%;
}

.min-md-size .col-md-offset-8 {
    margin-left: 66.66667%;
}

.min-md-size .col-md-offset-9 {
    margin-left: 75%;
}

.min-md-size .col-md-offset-10 {
    margin-left: 83.33333%;
}

.min-md-size .col-md-offset-11 {
    margin-left: 91.66667%;
}

.min-md-size .col-md-offset-12 {
    margin-left: 100%;
}

.min-lg-size .col-lg-1, .min-lg-size .col-lg-2, .min-lg-size .col-lg-3, .min-lg-size .col-lg-4, .min-lg-size .col-lg-5, .min-lg-size .col-lg-6, .min-lg-size .col-lg-7, .min-lg-size .col-lg-8, .min-lg-size .col-lg-9, .min-lg-size .col-lg-10, .min-lg-size .col-lg-11, .min-lg-size .col-lg-12 {
    float: left;
}

.min-lg-size .col-lg-1 {
    width: 8.33333%;
}

.min-lg-size .col-lg-2 {
    width: 16.66667%;
}

.min-lg-size .col-lg-3 {
    width: 25%;
}

.min-lg-size .col-lg-4 {
    width: 33.33333%;
}

.min-lg-size .col-lg-5 {
    width: 41.66667%;
}

.min-lg-size .col-lg-6 {
    width: 50%;
}

.min-lg-size .col-lg-7 {
    width: 58.33333%;
}

.min-lg-size .col-lg-8 {
    width: 66.66667%;
}

.min-lg-size .col-lg-9 {
    width: 75%;
}

.min-lg-size .col-lg-10 {
    width: 83.33333%;
}

.min-lg-size .col-lg-11 {
    width: 91.66667%;
}

.min-lg-size .col-lg-12 {
    width: 100%;
}

.min-lg-size .col-lg-pull-0 {
    right: auto;
}

.min-lg-size .col-lg-pull-1 {
    right: 8.33333%;
}

.min-lg-size .col-lg-pull-2 {
    right: 16.66667%;
}

.min-lg-size .col-lg-pull-3 {
    right: 25%;
}

.min-lg-size .col-lg-pull-4 {
    right: 33.33333%;
}

.min-lg-size .col-lg-pull-5 {
    right: 41.66667%;
}

.min-lg-size .col-lg-pull-6 {
    right: 50%;
}

.min-lg-size .col-lg-pull-7 {
    right: 58.33333%;
}

.min-lg-size .col-lg-pull-8 {
    right: 66.66667%;
}

.min-lg-size .col-lg-pull-9 {
    right: 75%;
}

.min-lg-size .col-lg-pull-10 {
    right: 83.33333%;
}

.min-lg-size .col-lg-pull-11 {
    right: 91.66667%;
}

.min-lg-size .col-lg-pull-12 {
    right: 100%;
}

.min-lg-size .col-lg-push-0 {
    left: auto;
}

.min-lg-size .col-lg-push-1 {
    left: 8.33333%;
}

.min-lg-size .col-lg-push-2 {
    left: 16.66667%;
}

.min-lg-size .col-lg-push-3 {
    left: 25%;
}

.min-lg-size .col-lg-push-4 {
    left: 33.33333%;
}

.min-lg-size .col-lg-push-5 {
    left: 41.66667%;
}

.min-lg-size .col-lg-push-6 {
    left: 50%;
}

.min-lg-size .col-lg-push-7 {
    left: 58.33333%;
}

.min-lg-size .col-lg-push-8 {
    left: 66.66667%;
}

.min-lg-size .col-lg-push-9 {
    left: 75%;
}

.min-lg-size .col-lg-push-10 {
    left: 83.33333%;
}

.min-lg-size .col-lg-push-11 {
    left: 91.66667%;
}

.min-lg-size .col-lg-push-12 {
    left: 100%;
}

.min-lg-size .col-lg-offset-0 {
    margin-left: 0%;
}

.min-lg-size .col-lg-offset-1 {
    margin-left: 8.33333%;
}

.min-lg-size .col-lg-offset-2 {
    margin-left: 16.66667%;
}

.min-lg-size .col-lg-offset-3 {
    margin-left: 25%;
}

.min-lg-size .col-lg-offset-4 {
    margin-left: 33.33333%;
}

.min-lg-size .col-lg-offset-5 {
    margin-left: 41.66667%;
}

.min-lg-size .col-lg-offset-6 {
    margin-left: 50%;
}

.min-lg-size .col-lg-offset-7 {
    margin-left: 58.33333%;
}

.min-lg-size .col-lg-offset-8 {
    margin-left: 66.66667%;
}

.min-lg-size .col-lg-offset-9 {
    margin-left: 75%;
}

.min-lg-size .col-lg-offset-10 {
    margin-left: 83.33333%;
}

.min-lg-size .col-lg-offset-11 {
    margin-left: 91.66667%;
}

.min-lg-size .col-lg-offset-12 {
    margin-left: 100%;
}

.min-xl-size .col-xl-1, .min-xl-size .col-xl-2, .min-xl-size .col-xl-3, .min-xl-size .col-xl-4, .min-xl-size .col-xl-5, .min-xl-size .col-xl-6, .min-xl-size .col-xl-7, .min-xl-size .col-xl-8, .min-xl-size .col-xl-9, .min-xl-size .col-xl-10, .min-xl-size .col-xl-11, .min-xl-size .col-xl-12 {
    float: left;
}

.min-xl-size .col-xl-1 {
    width: 8.33333%;
}

.min-xl-size .col-xl-2 {
    width: 16.66667%;
}

.min-xl-size .col-xl-3 {
    width: 25%;
}

.min-xl-size .col-xl-4 {
    width: 33.33333%;
}

.min-xl-size .col-xl-5 {
    width: 41.66667%;
}

.min-xl-size .col-xl-6 {
    width: 50%;
}

.min-xl-size .col-xl-7 {
    width: 58.33333%;
}

.min-xl-size .col-xl-8 {
    width: 66.66667%;
}

.min-xl-size .col-xl-9 {
    width: 75%;
}

.min-xl-size .col-xl-10 {
    width: 83.33333%;
}

.min-xl-size .col-xl-11 {
    width: 91.66667%;
}

.min-xl-size .col-xl-12 {
    width: 100%;
}

.min-xl-size .col-xl-pull-0 {
    right: auto;
}

.min-xl-size .col-xl-pull-1 {
    right: 8.33333%;
}

.min-xl-size .col-xl-pull-2 {
    right: 16.66667%;
}

.min-xl-size .col-xl-pull-3 {
    right: 25%;
}

.min-xl-size .col-xl-pull-4 {
    right: 33.33333%;
}

.min-xl-size .col-xl-pull-5 {
    right: 41.66667%;
}

.min-xl-size .col-xl-pull-6 {
    right: 50%;
}

.min-xl-size .col-xl-pull-7 {
    right: 58.33333%;
}

.min-xl-size .col-xl-pull-8 {
    right: 66.66667%;
}

.min-xl-size .col-xl-pull-9 {
    right: 75%;
}

.min-xl-size .col-xl-pull-10 {
    right: 83.33333%;
}

.min-xl-size .col-xl-pull-11 {
    right: 91.66667%;
}

.min-xl-size .col-xl-pull-12 {
    right: 100%;
}

.min-xl-size .col-xl-push-0 {
    left: auto;
}

.min-xl-size .col-xl-push-1 {
    left: 8.33333%;
}

.min-xl-size .col-xl-push-2 {
    left: 16.66667%;
}

.min-xl-size col-xl-push-3 {
    left: 25%;
}

.min-xl-size .col-xl-push-4 {
    left: 33.33333%;
}

.min-xl-size .col-xl-push-5 {
    left: 41.66667%;
}

.min-xl-size .col-xl-push-6 {
    left: 50%;
}

.min-xl-size .col-xl-push-7 {
    left: 58.33333%;
}

.min-xl-size .col-xl-push-8 {
    left: 66.66667%;
}

.min-xl-size .col-xl-push-9 {
    left: 75%;
}

.min-xl-size .col-xl-push-10 {
    left: 83.33333%;
}

.min-xl-size .col-xl-push-11 {
    left: 91.66667%;
}

.min-xl-size .col-xl-push-12 {
    left: 100%;
}

.min-xl-size .col-xl-offset-0 {
    margin-left: 0%;
}

.min-xl-size .col-xl-offset-1 {
    margin-left: 8.33333%;
}

.min-xl-size .col-xl-offset-2 {
    margin-left: 16.66667%;
}

.min-xl-size .col-xl-offset-3 {
    margin-left: 25%;
}

.min-xl-size .col-xl-offset-4 {
    margin-left: 33.33333%;
}

.min-xl-size .col-xl-offset-5 {
    margin-left: 41.66667%;
}

.min-xl-size .col-xl-offset-6 {
    margin-left: 50%;
}

.min-xl-size .col-xl-offset-7 {
    margin-left: 58.33333%;
}

.min-xl-size .col-xl-offset-8 {
    margin-left: 66.66667%;
}

.min-xl-size .col-xl-offset-9 {
    margin-left: 75%;
}

.min-xl-size .col-xl-offset-10 {
    margin-left: 83.33333%;
}

.min-xl-size .col-xl-offset-11 {
    margin-left: 91.66667%;
}

.min-xl-size .col-xl-offset-12 {
    margin-left: 100%;
}


/* ==========================================================================
* load
==========================================================================*/

.isLoad {
    opacity: 0;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
}

.isLoad.isLoaded {
    opacity: 1;
}

.load-imgmark {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 99998;
    background: #fff;
}

#loading {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 9997;
}

#loading .loading-mask {
    width: 100%;
    height: 100%;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: 'ease-in-out';
    transition-timing-function: 'ease-in-out';
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
    overflow: hidden;
    background: #19191a;
    -webkit-transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
}

.loading #loading .loading-mask {
    -webkit-transition-delay: 0.25s;
    transition-delay: 0.25s;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
}

#loading .loading-inner {
    position: absolute;
    top: 45vh;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    width: 77px;
    height: 77px;
    text-align: center;
    z-index: 100000;
    border-radius: 100%;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#loading .loading-animate {
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.9s ease;
    transition: all 0.9s ease;
}

#loading .loading-animate:after {
    content: "";
    position: absolute;
    top: -11px;
    left: -11px;
    border-radius: 99em;
    width: 97px;
    height: 97px;
    z-index: -1;
}

.loading #loading .loading-animate {
    opacity: 0;
    -webkit-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
}

#loading #loading-circle {
    content: "";
    position: absolute;
    top: -37px;
    left: -37px;
    border-radius: 0em;
    width: 150px;
    height: 150px;
    z-index: -1;
}

body.page .wp {
    opacity: 0;
    -webkit-transition: opacity 1.2s;
    transition: opacity 1.2s;
}

body.page.loaded .wp {
    opacity: 1;
}

#page-loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 99998;
}

#page-loading img {
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
}


/* ==========================================================================
* public
==========================================================================*/

body {
    overflow-x: hidden;
    font-size: 16px;
    line-height: 2em;
    color: #424242;
}

.max-md-size body {
    font-sxlize: 13px;
}

body, p, .p {
    font-size: 16px;
}

.max-md-size body, .max-md-size p, .max-md-size .p {
    font-size: 15px;
}

.max-sm-size body, .max-sm-size p, .max-sm-size .p {
    font-size: 13px;
}

.max-xs-size body, .max-xs-size p, .max-xs-size .p {
    font-size: 12px;
}

.title-line {
    border-bottom: 1px solid #bbbbbb;
    padding-bottom: 15px;
    margin-bottom: 50px;
}

.title-line-b {
    border-bottom: 2px solid #000;
    padding-bottom: 15px;
    margin-bottom: 50px;
}

.title-line-s {
    position: relative;
}

.title-line-s:after {
    content: '';
    border-bottom: 1px solid #000;
    width: 35px;
    height: 1px;
    display: block;
    margin-top: 15px;
}

.navbar-page {
    margin-top: -39px;
    z-index: 3;
    position: relative;
    -webkit-animation: downIn2 1.3s;
    animation: downIn2 1.3s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

.max-md-size .navbar-page {
    margin-left: -15px;
    margin-right: -15px;
}

.navbar-page li {
    display: block;
    float: left;
    text-align: center;
}

.navbar-page li a {
    display: block;
    text-decoration: none;
    height: 77px;
    color: #fff;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    background: #000;
    line-height: 77px;
    font-weight: bold;
}

.max-md-size .navbar-page li a {
    line-height: 40px;
    height: 40px;
    font-size: 12px;
}

.navbar-page li a:hover {
    color: #e60012;
}

.navbar-page li:nth-child(2) a {
    background-color: #121212;
}

.navbar-page li:nth-child(3) a {
    background-color: #222222;
}

.navbar-page li:nth-child(4) a {
    background-color: #343434;
}

.navbar-page li:nth-child(5) a {
    background-color: #4d4c4c;
}

.navbar-page li.active a {
    color: #e60012;
    background: #eeeeee;
}

.tabNav {
    border-bottom: 1px solid #dddddd;
    position: relative;
    z-index: 3;
    margin-bottom: 5%;
}

.tabNav li {
    display: inline-block;
}

.tabNav li a {
    text-decoration: none;
    color: #424242;
    display: inline-block;
    padding: 10px 25px;
    border-bottom: 3px solid rgba(255, 0, 0, 0);
    -webkit-transition: color 0.5s;
    transition: color 0.5s;
}

.tabNav li a:hover {
    color: #e60012;
}

.max-sm-size .tabNav li a {
    padding: 5px 10px;
}

.tabNav li.active a {
    color: #000;
    font-weight: bold;
    border-bottom: 3px solid red;
}

.tabNav .dropdown-select {
    position: absolute;
    top: 0px;
    right: 15px;
}

.dropdown-select {
    display: inline-block;
    text-align: center;
    background-color: transparent;
    z-index: 99;
    width: 150px;
    position: relative;
    box-sizing: border-box;
}

.max-md-size .dropdown-select {
    width: 100px;
}

.max-md-size .tabNav .dropdown-select {
    position: static;
    margin: 15px 0;
}

.dropdown-select * {
    text-decoration: none;
    color: #000;
}

.dropdown-select::after {
    content: "";
    display: table;
    clear: both;
}

.dropdown-select .btn {
    position: relative;
    width: 100%;
    padding: 13px;
    border: 1px solid #000;
    box-sizing: border-box;
}

.dropdown-select .btn:before {
    content: '';
    width: 0;
    height: 0;
    border-top: 5px solid #e60012;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    position: absolute;
    top: 45%;
    right: 15px;
}

.max-md-size .dropdown-select .btn:before {
    right: 5px;
}

.max-md-size .dropdown-select .btn {
    padding: 5px;
}

.dropdown-select .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    max-height: 150px;
    overflow-y: auto;
    box-sizing: border-box;
}

.dropdown-select .dropdown-item {
    display: block;
    padding: 8px;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    border: 1px solid #000;
    border-top: 0;
    box-sizing: border-box;
    background-color: #fff;
}

.dropdown-select .dropdown-item:hover {
    background: #000;
    color: #fff;
}

.max-md-size .dropdown-select .dropdown-item {
    padding: 5px;
}

.dropdown-select:hover .btn {
    background: #eeeeee;
    color: #838383;
}

.banner {
    overflow: hidden;
    width: 100%;
}

.banner .down {
    height: 100px;
    position: absolute;
    top: 85vh;
    text-align: center;
    text-transform: uppercase;
    font-size: 13px;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    opacity: 1;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
}

.banner .down a {
    text-decoration: none;
    display: inline-block;
    color: #fff;
    height: 100%;
}

.banner .down:before {
    position: absolute;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    content: '';
    width: 0;
    height: 0;
    border-top: 10px solid #fff;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    top: 30px;
}

.banner .down:after {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    content: '';
    border-left: 1px solid #fff;
    position: absolute;
    top: 40px;
    bottom: 0;
}

.scroll .banner .down {
    pointer-events: none;
    opacity: 0;
}

.page-banner {
    height: 65vh;
    position: relative;
}

.page-banner .inner {
    height: 70vh;
    position: relative;
}

.page-banner .down {
    top: inherit;
    bottom: 0;
    height: 150px;
}

.max-md-size .page-banner .down {
    height: 100px;
}

.page-banner .txt {
    position: absolute;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    z-index: 3;
    text-align: center;
    bottom: 35%;
    width: 95%;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
    opacity: 1;
}

.page-banner .txt h1 {
    opacity: 0.7;
    font-size: 25px;
    color: #fff;
    letter-spacing: 4px;
    font-weight: normal;
    margin: 0 0 45px 0;
    text-shadow: 0px 0px 5px rgba(39, 39, 39, 0.6);
}

.max-lg-size .page-banner .txt h1 {
    margin: 0 0 1rem 0;
}

.max-md-size .page-banner .txt h1 {
    font-size: 25px;
}

.page-banner .txt p {
    color: #fff;
    text-shadow: 0px 0px 5px rgba(39, 39, 39, 0.6);
    font-family: "Prata";
    font-weight: normal;
    letter-spacing: 2px;
    margin: 0 0 50px 0;
    white-space: nowrap;
    font-size: 50px;
}

.max-lg-size .page-banner .txt p {
    font-size: 35px;
}

.max-md-size .page-banner .txt p {
    font-size: 25px;
}

.max-sm-size .page-banner .txt p {
    font-size: 20px;
    white-space: normal;
}

.max-xs-size .page-banner .txt p {
    font-size: 16px;
}

.page-banner img {
    -webkit-animation: imgScale 30s;
    animation: imgScale 30s;
    -webkit-animation-play-state: running;
    animation-play-state: running;
}

.page-banner h1 {
    -webkit-animation: upIn 1s;
    animation: upIn 1s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

.page-banner p {
    -webkit-animation: upIn2 1.3s;
    animation: upIn2 1.3s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.page-banner .dropdown-select {
    position: absolute;
    top: 100%;
    width: 200px;
    left: 50%;
    z-index: 99;
    margin-top: 2%;
    background-color: transparent;
    color: #fff;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}

.page-banner .dropdown-select .btn {
    border: 2px solid #fff;
    color: #fff;
}

.page-banner .dropdown-select .dropdown-item {
    display: block;
    padding: 8px 35px;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    border: 1px solid #fff;
    border-top: 0;
    box-sizing: border-box;
    background-color: #fff;
}

.page-banner .dropdown-select .dropdown-item:hover {
    background: #000;
    color: #fff;
}

.max-md-size .page-banner .dropdown-select .dropdown-item {
    padding: 5px;
}

.page-banner .dropdown-select:hover .btn {
    color: #000;
}

.more-details {
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    font-size: 13px;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
    display: inline-block;
}

.max-lg-size .more-details {
    display: block;
    text-align: center;
}

.more-details:before {
    display: block;
    font-size: 10px;
    -webkit-transform: scale(0.7);
    -ms-transform: scale(0.7);
    transform: scale(0.7);
    margin-bottom: 10px;
}

.max-lg-size .more-details:before {
    display: inline-block;
    margin-right: 20px;
}

.more-details:hover {
    color: #e60012;
}

.more-mous {
    position: relative;
    display: inline-block;
    padding: 10px 45px;
    text-transform: uppercase;
    overflow: hidden;
    border: 1px solid currentColor;
    color: #fff;
    text-decoration: none;
}

.max-md-size .more-mous {
    padding: 5px 25px;
}

.more-mous span {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: #e60012;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: width 0.4s, height 0.4s;
    transition: width 0.4s, height 0.4s;
    z-index: -1;
}

.more-mous:hover {
    color: #f5c2c6;
}

.more-mous:hover span {
    width: 562.5px;
    height: 562.5px;
}

.more-mous:active {
    background: #e60012;
}

.html h2 {
    position: relative;
}

.html h2:after {
    content: '';
    border-bottom: 1px solid #000;
    width: 35px;
    height: 1px;
    display: block;
    margin-top: 15px;
}

.html h3 {
    font-size: 16px;
}

.html dd, .html p, .html li {
    line-height: 2em;
}

.html dd {
    margin-left: 15px;
}

.html dd > ol, .html dd > ul {
    list-style-position: inside;
    padding-left: 0;
}

.html li > p {
    margin: 0;
}

.html a {
    color: #424242;
}

.html a:hover {
    color: #e60012;
}

.html .red {
    color: #e60012;
}

.html dl.m-l-next dd {
    margin-left: 0;
}

.max-sm-size .html img {
    margin-bottom: 2rem;
}

.g-recaptcha {
    display: inline-block;
}

[class*='lightcase-icon-']:before {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#lightcase-loading {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#lightcase-loading span {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.lightcase-icon-close {
    font-size: 50px;
}

.max-md-size .lightcase-contentInner {
    max-width: 100% !important;
    width: 100% !important;
    text-align: center;
}

.max-md-size .lightcase-contentInner iframe {
    max-width: 100% !important;
    width: 100% !important;
}

#lightcase-nav .news-btn {
    display: none !important;
}

.openPage {
    background-color: #fff;
    position: relative;
    text-align: left;
}

.openPage .wrapper {
    padding: 10vw;
}

.openPage .btn-close {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #e60012;
    color: #fff;
    width: 60px;
    height: 60px;
    font-weight: bold;
    font-size: 23px;
    text-align: center;
    padding: 0;
}

.max-sm-size .openPage .btn-close {
    width: 40px;
    height: 40px;
    font-size: 18px;
}

.openPage .header {
    position: relative;
    border-bottom: 1px solid #000;
    padding-bottom: 3vh;
}

.openPage .header h1 {
    margin: 0;
}

.openPage .header .widget-social {
    position: absolute;
    top: 25px;
    right: 15px;
    font-size: 25px;
}

.max-lg-size .openPage .header .widget-social {
    top: 0;
    font-size: 18px;
}

.openPage .header .widget-social a {
    text-decoration: none;
    color: #000;
}


/* === layout ===*/

.footer {
    background: #19191a;
    padding: 15px 0;
    box-sizing: border-box;
    color: #969696;
    font-size: 15px;
    line-height: 1.5em;
    z-index: 99;
    position: relative;
    overflow: hidden;
    min-height: 90px;
}

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

.footer .container-xl {
    position: relative;
}

.footer a {
    color: #969696;
    text-decoration: none;
}

.max-lg-size .footer .left, .max-lg-size .footer .right {
    display: block;
    float: none;
    text-align: center;
    position: relative;
}

.footer .left .html, .footer .right .html {
    height: 100%;
    width: 100%;
}

.footer .left {
    float: left;
    padding-right: 100px;
}

.max-lg-size .footer .left {
    padding-right: 0;
}

.footer .left h3 {
    color: #fff;
    margin: 0;
    margin-right: 30px;
    display: inline-block;
    width: auto;
    vertical-align: top;
    line-height: 2rem;
}

.max-lg-size .footer .left h3 {
    margin-right: 0;
}

.footer .left .inner {
    display: inline-block;
    width: auto;
    vertical-align: top;
}

.footer .left .author {
    margin-right: 40px;
}

.max-lg-size .footer .left .author {
    margin: 0;
}

.footer .left .map {
    position: relative;
    padding-right: 25px;
}

.footer .left .map i {
    color: #e60012;
    font-size: 20px;
    position: absolute;
    right: 0;
    top: -7px;
}

.footer .left .link {
    font-size: 0.87rem;
}

.footer .left p {
    line-height: 1.6em;
    margin: 0;
}

.footer .left span, .footer .left h3, .footer .left a {
    display: inline-block;
}

.footer .left span {
    margin-right: 15px;
}

.max-lg-size .footer .left span {
    margin: 0;
}

.footer .right {
    position: absolute;
    top: 0px;
    right: 15px;
}

.max-lg-size .footer .right {
    padding-top: 15px;
}

.footer .right .top {
    display: block;
    color: #fff;
    text-align: right;
    padding: 10px 10px;
}

.footer .right .top i {
    font-size: 1.3rem;
}

.max-lg-size .footer .right .top {
    text-align: center;
}

.footer .widget-social {
    text-align: center;
    display: inline-block;
}

.footer .widget-social a {
    display: inline-block;
    text-decoration: none;
    border-radius: 50%;
    margin: 0 5px;
    color: #fff;
    background-color: #444444;
    width: 33px;
    height: 33px;
    line-height: 33px;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}

.footer .widget-social a:before {
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}

.footer .widget-social a:hover {
    background-color: #e60012;
}
.footer .widget-social a.facebook:hover {
    background-color: #324F93;
}
.footer .widget-social a:hover:before {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

#main, .main {
    position: relative;
    z-index: 2;
}

.page .page-inner {
    padding: 5% 0;
    box-sizing: border-box;
}

.home {
    background-color: #eeeeee;
}

.home #main, .home .main {
    /*margin-top: 95vh;*/
}

.home #home-banner {
    /*position: fixed;
z-index: 1;
top: 0;*/
}

.home section{
    -webkit-backface-visibility: hidden;
    -webkit-transform: scale(1);
}

.fullpage {
    min-height: 100vh;
    background-color: #000;
    position: relative;
    box-sizing: border-box;
    padding-bottom: 5%;
}

.fullpage .imgbg {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}

.fullpage .header {
    position: relative;
    z-index: 2;
    height: 35vh;
}

.fullpage .header .txt {
    bottom: 0%;
}

.fullpage #main, .fullpage .main {
    z-index: 5;
    position: relative;
    padding-top: 3%;
}

.fullpage #main .page-inner, .fullpage .main .page-inner {
    background-color: rgba(255, 255, 255, 0.9);
    padding: 50px;
}

.fullpage #main .page-inner .title, .fullpage .main .page-inner .title {
    margin-bottom: 40px;
}

.fullpage #main .page-inner h2, .fullpage .main .page-inner h2 {
    text-align: center;
    color: #000;
    margin-top: 0;
}

.max-md-size .fullpage #main .page-inner, .max-md-size .fullpage .main .page-inner {
    padding: 20px;
}


/* === header mynav.js  ===*/

.home-header {
    background: url(images/header-bg.png) repeat-x top;
    box-sizing: border-box;
    padding: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    padding: 5vh 0 7vh 0;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

.max-lg-size .home-header {
    padding: 0;
}

.home-header .navbar-header {
    width: 100%;
    position: absolute;
    padding: 0;
    z-index: 998;
    top: 0;
    left: 0;
    right: 0;
    box-sizing: border-box;
}

.home-header .navbar-header .logo {
    padding: 0;
    margin: 0 !important;
    line-height: 0 !important;
    display: inline-block;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 999;
    top: 3vh;
    left: 5vw;
}

.max-bg-size .home-header .navbar-header .logo {
    left: 3vw;
}

.max-lg-size .home-header .navbar-header .logo {
    width: 60px;
    top: 7px;
    left: 15px;
}

.home-header .navbar-header .logo img {
    width: 100%;
    height: auto;
}





.home-header .widget-social {
    text-align: center;
    display: inline-block;
}

.home-header .widget-social a {
    display: inline-block;
    text-decoration: none;
    border-radius: 50%;
    margin: 0 5px;
    color: #fff;
    background-color: #444444;
    width: 33px;
    height: 33px;
    line-height: 33px;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}

.home-header .widget-social a:before {
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}

.home-header .widget-social a:hover {
    background-color: #e60012;
}
.home-header .widget-social a.facebook:hover {
    background-color: #324F93;
}

.home-header .widget-social a:hover:before {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

.home-header .widget-social {
    padding: 50px 24px 50px 0px;
    padding-right: 24px;
    padding-top: 50px;
    display: block;
}

.min-lg-size .home-header .widget-social {
    display: none !important;
}

.navbar-toggler {
    width: 45px;
    display: block;
    height: 45px;
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 998;
    -webkit-transition: right 0.3s;
    transition: right 0.3s;
    box-sizing: border-box;
    display: none;
}

.navbar-toggler span {
    margin-bottom: 0px;
    height: 2px;
    width: 25px;
    background: #f00000;
    position: absolute;
    left: 8px;
    -webkit-transition: all 0.3s cubic-bezier(0.35, 0.085, 0.305, 1.005);
    transition: all 0.3s cubic-bezier(0.35, 0.085, 0.305, 1.005);
}

.navbar-toggler span:nth-child(1) {
    top: 10px;
}

.navbar-toggler span:nth-child(2) {
    top: 18px;
}

.navbar-toggler span:nth-child(3) {
    top: 27px;
}

.navbar-toggler:hover {
    cursor: pointer;
}

.navbar-toggler.open span {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$ms)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
    position: absolute;
    top: 20px;
    left: 4px;
    height: 3px;
    width: 28px;
    background: #f00000 !important;
    -webkit-transition: all 0.3s cubic-bezier(0.35, 0.085, 0.305, 1.005);
    transition: all 0.3s cubic-bezier(0.35, 0.085, 0.305, 1.005);
}

.navbar-toggler.open span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$ms)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
}

.navbar-toggler.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$ms)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
}

.isMobile .navbar-toggler {
    display: block;
}

.navbar {
    box-sizing: border-box;
    text-align: center;
}

.isMobile .navbar {
    float: left;
    width: 100%;
    padding-top: 20vh;
    height: 100vh;
    overflow: scroll;
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
    min-height: 100vh;
    box-sizing: border-box;
    background: rgba(37, 36, 35, 0.95);
}

.isMobile .navbar.open {
    background: rgba(37, 36, 35, 0.95);
}

.isMobile .navbar.open > ul > li {
    -webkit-animation: leftIn 1s;
    animation: leftIn 1s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: backwards;
    animation-fill-mode: backwards;
}

.isMobile .navbar.open > ul > li:nth-child(1) {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

.isMobile .navbar.open > ul > li:nth-child(2) {
    -webkit-animation-delay: 0.7s;
    animation-delay: 0.7s;
}

.isMobile .navbar.open > ul > li:nth-child(3) {
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;
}

.isMobile .navbar.open > ul > li:nth-child(4) {
    -webkit-animation-delay: 1.1s;
    animation-delay: 1.1s;
}

.isMobile .navbar.open > ul > li:nth-child(5) {
    -webkit-animation-delay: 1.3s;
    animation-delay: 1.3s;
}

.isMobile .navbar.open > ul > li:nth-child(6) {
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s;
}

.isMobile .navbar.open > ul > li:nth-child(7) {
    -webkit-animation-delay: 1.7s;
    animation-delay: 1.7s;
}

.isMobile .navbar .dropdown:after {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.isMobile .navbar ul {
    padding: 0;
    margin: 0;
    width: 100%;
    list-style-type: none;
    font-size: 20px;
}

.isMobile .navbar ul li {
    position: relative;
    float: left;
    width: 100%;
}

.isMobile .navbar ul li a {
    display: block;
    float: left;
    line-height: 70px;
    margin: 0;
    text-align: center;
    color: #fff;
    width: 100%;
    text-decoration: none;
    text-transform: uppercase;
    box-sizing: border-box;
    padding-right: 24px;
}

.isMobile .navbar ul li.dropdown > a {
    padding-right: 0px;
}

.isMobile .navbar ul li.dropdown > a:after {
    content: '\e80e';
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.isMobile .navbar ul li li {
    background: rgba(255, 255, 255, 0.05);
}

.isMobile .navbar ul li li a {
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    opacity: 0.75;
    filter: alpha(opacity=75);
    text-shadow: none !important;
    visibility: visible;
}

.isMobile .navbar ul li li a:hover {
    background: rgba(255, 255, 255, 0.05);
}

.isMobile .navbar ul li li li {
    background: rgba(255, 255, 255, 0.05);
}

.isMobile .navbar > ul > li > a {
    position: relative;
}

.isMobile .navbar > ul > li > a:before {
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    width: 0%;
    height: 1px;
    background: #c60211;
    -webkit-transition: width 1s;
    transition: width 1s;
}

.isMobile .navbar > ul > li:hover > a:before {
    width: 100%;
}

.isMobile .navbar > ul > li.active > a:before {
    width: 100%;
}

.isTablet .navbar a {
    text-decoration: none;
}

.isTablet .navbar .level-1 {
    margin: 0;
}

.isTablet .navbar .level-1 > li {
    width: 11.5%;
    display: inline-block;
    position: relative;
    font-size: 17px;
}

.isTablet .navbar .level-1 > li:lang(en) {
    width: auto;
    font-size: 20px;
}
.isTablet .navbar .level-1 > li:lang(en) + li {
    margin-left: 50px;
}

.isTablet .navbar .level-1 > li > a {
    position: relative;
    color: #fff;
    text-shadow: 0px 0px 5px rgba(39, 39, 39, 0.6);
}

.isTablet .navbar .level-1 > li > a:before {
    position: absolute;
    bottom: -8px;
    left: 0;
    content: '';
    width: 0%;
    height: 3px;
    background: #c60211;
    -webkit-transition: width 0.5s;
    transition: width 0.5s;
}

.isTablet .navbar .level-1 > li:hover > a:before {
    width: 100%;
}

.isTablet .navbar .level-1 > li.active > a:before {
    width: 100%;
}

.isTablet .navbar .level-2 {
    font-size: 16px;
    position: relative;
    background-color: #fff;
    border-radius: 5px;
    padding: 10px 10px;
    box-sizing: border-box;
    white-space: nowrap;
    text-align: center;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
}

.isTablet .navbar .level-2:before {
    content: '';
    width: 0;
    height: 0;
    border-bottom: 10px solid #fff;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    position: absolute;
    top: 0px;
    left: 50%;
    opacity: 1;
}

.isTablet .navbar .level-2.open:before {
    -webkit-animation: upIn3 0.5s;
    animation: upIn3 0.5s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.isTablet .navbar .level-2 a {
    color: #000;
    padding: 5px 15px;
    display: block;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    text-decoration: none;
}

.isTablet .navbar .level-2 a:hover {
    color: #e60012;
}

.isTablet .navbar .level-2 li + li {
    border-top: 1px dashed #c7c7c7;
}

.navbar.open .level-2:before {
    -webkit-animation: upIn3 0.5s;
    animation: upIn3 0.5s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.isTablet .navbar.navbar-main {
    padding: 0 13vw 0 10vw;
    font-size: 20px;
}


@media screen and (max-width:1280px){
   html[lang="en"] .isTablet .navbar.navbar-main{
    font-size: 15px;
   }
}

@media screen and (max-width:1080px){
   html[lang="en"] .isTablet .navbar.navbar-main{
    font-size: 14px;
   }
}

.isTablet .navbar.navbar-main .level-2 {
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    float: left;
    top: 25px;
    margin-left: 50%;
}

.isTablet .navbar.navbar-main .level-2:before {
    -webkit-transition: all 1s;
    transition: all 1s;
}

.scroll.isTablet .home-header {
    background-color: #fff;
    background-image: none;
    padding: 2vh 0;
}

.scroll.isTablet .home-header .navbar-header .logo {
    width: 57px;
    top: 8px;
}

.scroll.isTablet .home-header .navbar-header .widget-btn {
    top: 15px;
    color: #e60012;
}

.scroll.isTablet .navbar-main .level-1 > li > a {
    text-shadow: 0px 0px 0px rgba(39, 39, 39, 0);
    color: #000;
}

.scroll.isMobile .home-header {
    background-color: #fff;
    background-image: none;
    height: 60px;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.3);
}

.scroll.isMobile .home-header .navbar-header .logo {
    width: 45px;
    top: 8px;
}

.scroll.isMobile .home-header .navbar-header .widget-btn {
    color: #000;
}

.scroll.isMobile .home-header .navbar-header .navbar-btn, .scroll.isMobile .home-header .navbar-header .widget-btn {
    top: 10px;
}

.isTablet .widget {
    position: absolute;
    width: auto;
    margin: 0;
    top: 0;
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    padding-right: 35px;
    padding-top: 5vh;
    z-index: 1;
}

.isTablet .widget ul {
    margin-top: 58px;
}

.isTablet .widget.opne {
    z-index: 2;
}

.isTablet #widget-len {
    right: 5vw;
}

.isTablet #widget-len .active a {
    color: #e60012;
}

.isTablet #widget-member {
    right: 9vw;
}


/* === home-banner  ===*/

#home-banner {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

#home-banner .slick-prev, #home-banner .slick-next {
    opacity: 1;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
}

.scroll #home-banner .slick-prev, .scroll #home-banner .slick-next {
    pointer-events: none;
    opacity: 0;
}

#home-banner .slick-prev:before, #home-banner .slick-next:before {
    font-size: 10px;
    -webkit-transform: scale(0.8) translateX(-8px);
    -ms-transform: scale(0.8) translateX(-8px);
    transform: scale(0.8) translateX(-8px);
}

.max-md-size #home-banner {
    height: auto;
}

.max-md-size #home-banner .list-item img{
    position: relative;
    min-width: 0;
    min-height: 0;
    max-width: 100%;
}

.max-md-size #home-banner .slick-prev, .max-md-size #home-banner .slick-next {
    border: 0;
}

#home-banner .slick-prev {
    left: 3%;
}

#home-banner .slick-prev:before {
    content: '\e858';
}

#home-banner .slick-prev:hover:before {
    -webkit-transform: scale(0.8) translateX(-16px);
    -ms-transform: scale(0.8) translateX(-16px);
    transform: scale(0.8) translateX(-16px);
}

#home-banner .slick-next {
    right: 5%;
}

#home-banner .slick-next:before {
    content: '\e857';
}

#home-banner .slick-next:hover:before {
    -webkit-transform: scale(0.8) translateX(0px);
    -ms-transform: scale(0.8) translateX(0px);
    transform: scale(0.8) translateX(0px);
}

.windows #home-banner .video-item:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
}

.windows #home-banner .video-item:before {
    width: 100%;
    height: 100%;
    position: absolute;
    background: #000000;
    z-index: 9;
    content: '';
    background: url(images/loading2.gif) no-repeat center center;
}

.windows #home-banner .video-item.on:before {
    opacity: 0;
    display: block;
}

.isMobile #home-banner .video-item {
    display: none;
}

#home-banner .txt {
    position: absolute;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    z-index: 3;
    text-align: center;
    bottom: 35%;
    width: 95%;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
    opacity: 1;
}

.scroll #home-banner .txt {
    pointer-events: none;
    opacity: 0;
}

#home-banner .txt h3 {
    opacity: 0.7;
    font-size: 35px;
    color: #fff;
    letter-spacing: 4px;
    font-weight: normal;
    margin: 0 0 45px 0;
    font-style: italic;
}

.max-md-size #home-banner .txt h3 {
    font-size: 25px;
}

#home-banner .txt p {
    color: #fff;
    text-shadow: 0px 0px 5px rgba(39, 39, 39, 0.6);
    font-family: "Prata";
    font-weight: normal;
    letter-spacing: 2px;
    font-style: italic;
    margin: 0 0 50px 0;
    white-space: nowrap;
}

#home-banner .txt .more {
    text-shadow: 0px 0px 3px rgba(39, 39, 39, 0.5);
    box-shadow: 0px 0px 5px rgba(39, 39, 39, 0.5);
    margin-top: 2.5%;
}

#home-banner .slick-current h3 {
    -webkit-animation: downIn 1s;
    animation: downIn 1s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: backwards;
    animation-fill-mode: backwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

#home-banner .slick-current p {
    -webkit-animation: downIn2 1.3s;
    animation: downIn2 1.3s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-delay: 1.3s;
    animation-delay: 1.3s;
    -webkit-animation-fill-mode: backwards;
    animation-fill-mode: backwards;
}

#home-banner .slick-current .more {
    -webkit-animation: downIn2 1.3s;
    animation: downIn2 1.3s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-delay: 1.9s;
    animation-delay: 1.9s;
    -webkit-animation-fill-mode: backwards;
    animation-fill-mode: backwards;
}

#home-banner .down {
    position: absolute;
    bottom: 2vh;
    text-align: center;
    text-transform: uppercase;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    opacity: 1;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
}

#home-banner .down a {
    color: #fff;
    text-decoration: none;
    font-size: 40px;
}


/* === home ===*/

#home-case {
    position: relative;
    box-sizing: border-box;
    padding: 5vh 0;
}

#home-case:after {
    z-index: 1;
    background-color: #eeeeee;
    position: absolute;
    height: 60%;
    left: 0;
    bottom: 0;
    width: 100%;
    content: '';
}

#home-case .container-xl {
    position: relative;
    z-index: 2;
}

#home-case .list-item {
    position: relative;
}

#home-case .list-item::after {
    content: "";
    display: table;
    clear: both;
}

#home-case .list-item h2 {
    position: absolute;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    width: 112px;
    height: 112px;
    background-color: #000;
    border-radius: 50%;
    line-height: 112px;
    text-align: center;
    font-weight: normal;
    z-index: 99;
    color: #fff;
}

.max-xl-size #home-case .list-item h2 {
    width: 80px;
    height: 80px;
    font-size: 16px;
    line-height: 80px;
}

.max-lg-size #home-case .list-item h2 {
    top: 55vw;
}

#home-case .list-item .box-left, #home-case .list-item .box-right {
    display: block;
    float: left;
    height: 650px;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    overflow: hidden;
    width: 50%;
    vertical-align: middle;
}

.max-xl-size #home-case .list-item .box-left, .max-xl-size #home-case .list-item .box-right {
    height: 550px;
}

.max-lg-size #home-case .list-item .box-left, .max-lg-size #home-case .list-item .box-right {
    width: 100%;
    padding: 0;
    display: block;
}

#home-case .list-item .box-left {
    padding: 40px 0;
    position: relative;
}

#home-case .list-item .box-left a {
    overflow: hidden;
}

#home-case .list-item .box-left img {
    -webkit-transition: -webkit-transform 0.8s ease;
    transition: transform 0.8s ease;
    margin: 0;
}

.max-lg-size #home-case .list-item .box-left {
    height: 55vw;
}

#home-case .list-item:hover .box-left img {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}

#home-case .list-item .box-right {
    background: url("images/home-case-bg.jpg");
    text-overflow: ellipsis;
    padding: 5% 9%;
    color: #fff;
}

.max-bg-size #home-case .list-item .box-right {
    padding: 5% 0% 5% 6%;
}

.max-lg-size #home-case .list-item .box-right {
    text-align: center;
    padding: 50px 25px 90px 25px;
    height: auto;
}

.max-lg-size #home-case .list-item .box-right h3 {
    padding-top: 40px;
}

#home-case .list-item .box-right h3 span {
    display: inline-block;
}

#home-case .list-item .box-right h3 span:after {
    content: '';
    border-bottom: 1px solid #fff;
    width: 30px;
    height: 1px;
    display: block;
    margin-top: 8px;
}

.max-md-size #home-case .list-item .box-right h3 span:after {
    width: 100%;
}

.max-lg-size #home-case .list-item .box-right h3 {
    text-align: center;
}

#home-case .list-item .box-right p {
    color: #d6d6d6;
}

#home-case .slick-dots {
    bottom: 5%;
    width: auto;
    left: 57%;
    text-align: left;

}

#home-case .slick-dots li.slick-active button {
    border: 4px solid #e60012;
}

.max-bg-size #home-case .slick-dots {
    left: 54%;
}

.max-lg-size #home-case .slick-dots {
    bottom: 15px;
    left: 0;
    width: 100%;
    text-align: center;
}

#home-classic {
    background: #fff;
    height: 100vh;
    padding-top: 120px;
    min-height: 650px;
    box-sizing: border-box;
    position: relative;
}

#home-classic .list-item {
    position: relative;
}

#home-classic h2 {
    text-align: center;
    color: #000;
    margin: 0;
    padding: 35px 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    font-size: 35px;
}

.max-lg-size #home-classic h2 {
    font-size: 25px;
}

#home-classic h2 i, #home-classic h2 a {
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
    color: #6f6b6b;
}

#home-classic h2 a {
    margin-left: 35px;
    text-transform: uppercase;
    font-family: "Prata";
    font-size: 16px;
}

#home-classic h2 i {
    border-bottom: 1px solid #000;
    width: 100px;
    margin-right: 25px;
}

#home-classic h2 span {
    display: inline-block;
    vertical-align: middle;
}

#home-classic .slider {
    height: 100%;
    -webkit-backface-visibility: hidden;
    -webkit-transform: scale(1);
}

#home-classic .box-left, #home-classic .box-right {
    box-sizing: border-box;
    position: absolute;
    height: 100%;
    display: block;
}

#home-classic .box-left {
    width: 65%;
    border: 10px solid #fff;
    opacity: 0.1;
}

.max-lg-size #home-classic .box-left {
    border: 10px solid #fff;
    width: 100%;
}

#home-classic .box-right {
    width: 35%;
    background: #a2a2a2;
    opacity: 0.7;
    top: 0;
    left: 65%;
}

.max-lg-size #home-classic .box-right {
    display: none;
}

#home-classic .txt {
    position: absolute;
    top: 30%;
    right: 2%;
    width: 32%;
    background: white;
    padding: 3%;
}

.max-lg-size #home-classic .txt {
    width: 90%;
    top: 60%;
    bottom: 5%;
    background: rgba(255, 255, 255, 0.8);
}

.max-sm-size #home-classic .txt {
    bottom: 8px;
}

#home-classic .txt:before {
    width: 0;
    height: 0;
    border-top: 8px solid #e60012;
    border-left: 8px solid transparent;
    border-right: 0px solid transparent;
    content: '';
    position: absolute;
    top: 15px;
    right: 15px;
}

#home-classic .txt h3 {
    margin-bottom: 35px;
}

.max-lg-size #home-classic .txt h3 {
    margin-bottom: 15px;
}

#home-classic .txt .more-details {
    color: #000;
}

#home-classic .slick-prev, #home-classic .slick-next {
    width: 50px;
    height: 50px;
    background: #bcc6d1;
    border-radius: 0;
    border: 0;
    color: #fff;
    top: 32%;
    left: 65%;
    font-size: 30px;
}

#home-classic .slick-prev:hover, #home-classic .slick-next:hover {
    background: #e60012;
}

.max-lg-size #home-classic .slick-prev, .max-lg-size #home-classic .slick-next {
    left: inherit;
    right: 5%;
    top: inherit;
    bottom: 8%;
    width: 30px;
    height: 30px;
    font-size: 20px;
}

.max-sm-size #home-classic .slick-prev, .max-sm-size #home-classic .slick-next {
    bottom: 25px;
}

#home-classic .slick-prev {
    -webkit-transform: translateX(20px) translateY(-100px);
    -ms-transform: translateX(20px) translateY(-100px);
    transform: translateX(20px) translateY(-100px);
}

#home-classic .slick-prev:before {
    content: '\e818';
}

.max-lg-size #home-classic .slick-prev {
    -webkit-transform: translateX(-40px) translateY(0px);
    -ms-transform: translateX(-40px) translateY(0px);
    transform: translateX(-40px) translateY(0px);
}

#home-classic .slick-next {
    -webkit-transform: translateX(80px) translateY(-100px);
    -ms-transform: translateX(80px) translateY(-100px);
    transform: translateX(80px) translateY(-100px);
}

#home-classic .slick-next:before {
    content: '\e819';
}

.max-lg-size #home-classic .slick-next {
    -webkit-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
}

#home-news {
    background: #fff url(images/home-news-bg.jpg) no-repeat bottom left;
}

.max-xl-size #home-news {
    background-image: none;
}

#home-news .container-xl {
    padding: 5% 15px;
}

#home-news .container-xl::after {
    content: "";
    display: table;
    clear: both;
}

#home-news .section-header, #home-news .section-content {
    width: 50%;
    float: left;
}

.max-md-size #home-news .section-header, .max-md-size #home-news .section-content {
    width: 100%;
    float: none;
}

#home-news .section-header {
    text-align: center;
    padding-right: 35px;
    box-sizing: border-box;
}

#home-news .section-header .inner {
    width: 330px;
    margin: 0 auto;
    height: 150px;
    position: relative;
}

.max-lg-size #home-news .section-header .inner {
    width: 250px;
    height: 80px;
    margin-top: 35px;
}

.max-md-size #home-news .section-header .inner {
    margin-top: 0px;
    margin-bottom: 35px;
    width: 100%;
    text-align: right;
}

#home-news .section-header .box {
    display: inline-block;
    width: 100%;
    height: 100%;
    /* Permalink - use to edit and share this gradient: http: //colorzilla.com/gradient-editor/#ff9000+0,ff0000+50,191f2a+100 */
    background: #ff9000;
    /* Old browsers */
    /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #ff9000 0%, #ff0000 50%, #191f2a 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-linear-gradient(315deg, #ff9000 0%, #ff0000 50%, #191f2a 100%);
    background: linear-gradient(135deg, #ff9000 0%, #ff0000 50%, #191f2a 100%);
    position: relative;
    padding: 8px;
    margin-bottom: 35px;
}

.max-md-size #home-news .section-header .box {
    margin-bottom: 5px;
}

#home-news .section-header .box:before {
    content: '';
    height: 100%;
    width: 100%;
    background-color: #fff;
    display: block;
    z-index: 1;
}

#home-news .section-header .box p {
    position: absolute;
    bottom: -8px;
    right: -8px;
    padding: 15px 0 0 15px;
    background-color: #fff;
    font-size: 60px;
    margin: 0;
    font-family: "Prata";
    line-height: normal;
    z-index: 2;
}

.max-lg-size #home-news .section-header .box p {
    font-size: 35px;
    letter-spacing: 5px;
}

#home-news .section-header .box h2 {
    position: absolute;
    bottom: 30px;
    right: 0;
    font-size: 20px;
    z-index: 3;
    font-weight: normal;
}

.max-lg-size #home-news .section-header .box h2 {
    bottom: 15px;
    font-size: 16px;
}

#home-news .section-header a {
    color: #000;
    text-decoration: none;
    text-align: right;
    display: block;
    width: 100%;
}

#home-news .section-header a i {
    font-size: 12px;
}

.max-md-size #home-news .section-header a {
    display: inline-block;
    width: auto;
    position: absolute;
    left: 15px;
    bottom: 0px;
}

#home-news .section-content h3 {
    font-weight: normal;
    margin: 0;
}

#home-news .section-content time {
    /*margin-bottom: 20px;*/
    display: block;
}

#home-news .section-content .list-item a {
    text-decoration: none;
    color: #424242;
}

#home-news .section-content a:hover {
    color: #e60012;
}

#home-news .section-content .list-item {
    padding: 20px 0;
}

#home-news .section-content .list-item + .list-item {
    border-top: 1px dotted #989898;
}

#home-foundation {
    position: relative;
    color: #fff;
    overflow: hidden;
}

#home-foundation .section-header {
    height: 600px;
    width: 100%;
    position: relative;
    z-index: 1;
}

.max-xl-size #home-foundation .section-header {
    height: 500px;
}

.max-md-size #home-foundation .section-header {
    height: 350px;
}

#home-foundation .section-header .title {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    top: 25%;
    text-align: center;
    z-index: 2;
}

#home-foundation .section-header .title h2 {
    font-size: 40px;
    letter-spacing: 3px;
}

.max-md-size #home-foundation .section-header .title h2 {
    font-size: 25px;
}

#home-foundation .section-header .title .more {
    text-transform: inherit;
}

#home-foundation .section-header .img {
    position: relative;
    height: 100%;
    width: 100%;
    z-index: 1;
}

#home-foundation .section-content {
    position: relative;
    z-index: 2;
    text-align: center;
}

#home-foundation .section-content:before {
    display: block;
    width: 1px;
    border-right: 1px solid #000;
    height: 150px;
    content: '';
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    top: -150px;
    z-index: 3;
}

.max-md-size #home-foundation .section-content:before {
    height: 100px;
    top: -100px;
}

#home-foundation .section-content:after {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    z-index: 3;
    display: block;
    width: 10px;
    content: '';
    height: 10px;
    top: 0px;
    background-color: #000;
    border-radius: 50%;
}

#home-foundation .section-content .bg {
    left: 50%;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    top: -100px;
    width: 130%;
    bottom: 0;
    background: #fb3;
    border-radius: 50% 50% 0 0;
    background: url(images/home-foundation-bg2.jpg);
    position: absolute;
    z-index: 1;
}

.max-md-size #home-foundation .section-content .bg {
    width: 230%;
    top: -50px;
}

#home-foundation .section-content .bg2 {
    position: absolute;
    bottom: 0px;
    right: 72%;
    width: 445px;
    height: 445px;
    z-index: 4;
    display: block;
    background: url(images/home-foundation-3.png) no-repeat;
    background-size: cover;
}

.max-bg-size #home-foundation .section-content .bg2 {
    right: 75%;
}

.max-xl-size #home-foundation .section-content .bg2 {
    width: 300px;
    height: 300px;
    right: 80%;
}

.max-md-size #home-foundation .section-content .bg2 {
    display: none;
}

#home-foundation .section-content p {
    position: relative;
    z-index: 2;
    width: 40%;
    padding: 50px 15px 80px 15px;
    margin: 0 auto;
    box-sizing: border-box;
    color: #000;
}

.max-bg-size #home-foundation .section-content p {
    width: 50%;
}

.max-xl-size #home-foundation .section-content p {
    width: 60%;
    padding: 30px 15px 50px 15px;
}

.max-md-size #home-foundation .section-content p {
    width: 100%;
}


/* === page-service  ===*/

.service .list {
    padding: 0;
}

.service .list a {
    text-decoration: none;
    color: #000;
}

.service .list .item {
    padding: 20px;
    text-align: center;
    width: 25%;
    float: left;
    overflow: hidden;
    box-sizing: border-box;
}

.max-lg-size .service .list .item {
    padding: 10px;
    width: 33%;
}

.max-sm-size .service .list .item {
    padding: 5px;
    width: 50%;
}

.service .list .item a {
    display: block;
    width: 100%;
}

.service .list .item .img {
    padding-bottom: 150%;
    width: 100%;
    height: 0;
    box-sizing: border-box;
}

.service .list .item .img .mark {
    width: 101%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(230, 0, 18, 0.8);
}

.service .list .item .img .mark .icon {
    position: absolute;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    color: #fff;
}

.service .list .item .img .mark .icon i {
    border-radius: 99em;
    border: 2px solid #fff;
    width: 80px;
    height: 80px;
    line-height: 80px;
    display: inline-block;
    font-size: 30px;
    -webkit-transform: scale(1.6);
    -ms-transform: scale(1.6);
    transform: scale(1.6);
    -webkit-transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    opacity: 0;
}

.service .list .item .img .mark .icon p {
    color: #fff;
}

.service .list .item h3 {
    font-weight: bold;
}

.service .list .item .mark {
    opacity: 0;
    -webkit-transition: all 0.8s;
    transition: all 0.8s;
}

.service .list .item:hover .mark {
    opacity: 1;
}

.service .list .item:hover .mark .icon i {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.service .list .item:hover .mark .icon p {
    -webkit-animation: downIn2 1s;
    animation: downIn2 1s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}


/* === page-service  ===*/

.csr-list {
    padding: 0;
}

.csr-list .item {
    padding: 1.5vw;
    text-align: center;
    width: 33%;
    float: left;
    overflow: hidden;
    box-sizing: border-box;
}

.csr-list .item h3 {
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    margin: 0;
    white-space: nowrap;
}

.max-md-size .csr-list .item {
    width: 50%;
}

.max-sm-size .csr-list .item {
    width: 100%;
}

.csr-list .item a {
    display: block;
    width: 100%;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px transparent;
    text-decoration: none;
    color: #fff;
}

.csr-list .item a:before {
    content: '';
    position: absolute;
    border: #e1e1e1 solid 3px;
    top: 0;
    right: 0;
    bottom: 8px;
    left: 0;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: top, right, bottom, left;
    transition-property: top, right, bottom, left;
}

.csr-list .item a:hover:before, .csr-list .item a:focus:before, .csr-list .item a:active:before {
    top: -8px;
    right: -8px;
    bottom: 0px;
    left: -8px;
}

.csr-list .item .img {
    height: 13vw;
    width: 100%;
}

.csr-list .item .img:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    -webkit-transition: background-color 0.5s;
    transition: background-color 0.5s;
}

.csr-list .item .img img {
    -webkit-transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
}

.csr-list .item:hover .img:after {
    background-color: transparent;
}

.csr-list .item:hover .img img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.has-aside::after {
    content: "";
    display: table;
    clear: both;
}

.has-aside .aside {
    width: 20%;
    float: left;
    box-sizing: border-box;
    padding: 5% 3% 5% 0;
}

.max-xl-size .has-aside .aside {
    width: 25%;
}

.max-lg-size .has-aside .aside {
    display: none;
}

.has-aside .page-inner {
    width: 80%;
    box-sizing: border-box;
    float: right;
}

.max-xl-size .has-aside .page-inner {
    width: 75%;
}

.max-lg-size .has-aside .page-inner {
    width: 100%;
}

.aside .header {
    text-align: center;
    padding-right: 35px;
    box-sizing: border-box;
    margin-bottom: 50px;
}

.aside .header .inner {
    width: 100%;
    margin: 0 auto;
    height: 90px;
    position: relative;
}

.max-lg-size .aside .header .inner {
    width: 100%;
    height: 80px;
    margin-top: 35px;
}

.max-md-size .aside .header .inner {
    margin-top: 0px;
    margin-bottom: 35px;
    width: 100%;
    text-align: right;
}

.aside .header .box {
    display: inline-block;
    width: 100%;
    height: 100%;
    /* Permalink - use to edit and share this gradient: http: //colorzilla.com/gradient-editor/#ff9000+0,ff0000+50,191f2a+100 */
    background: #ff9000;
    /* Old browsers */
    /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #ff9000 0%, #ff0000 50%, #191f2a 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-linear-gradient(315deg, #ff9000 0%, #ff0000 50%, #191f2a 100%);
    background: linear-gradient(135deg, #ff9000 0%, #ff0000 50%, #191f2a 100%);
    position: relative;
    padding: 4px;
    margin-bottom: 35px;
}

.max-md-size .aside .header .box {
    margin-bottom: 5px;
}

.aside .header .box:before {
    content: '';
    height: 100%;
    width: 100%;
    background-color: #fff;
    display: block;
    z-index: 1;
}

.aside .header .box p {
    position: absolute;
    bottom: -8px;
    right: -8px;
    padding: 35px 0 0 15px;
    background-color: #fff;
    font-size: 40px;
    margin: 0;
    font-family: "Prata";
    line-height: normal;
    z-index: 2;
}

.max-lg-size .aside .header .box p {
    font-size: 35px;
    letter-spacing: 5px;
}

.aside .header .box h2 {
    position: absolute;
    bottom: 30px;
    right: 0;
    font-size: 18px;
    z-index: 3;
    font-weight: normal;
}

.max-lg-size .aside .header .box h2 {
    bottom: 15px;
    font-size: 16px;
}

.aside .nav {
    padding-right: 20px;
    text-align: right;
}

.aside .nav li a {
    text-decoration: none;
    color: #7d7d7d;
    display: block;
    position: relative;
    padding: 5px 0;
    -webkit-transition: color 1s;
    transition: color 1s;
}

.aside .nav li a:before {
    content: '';
    width: 0;
    height: 0;
    border-left: 6px solid #e60012;
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
    position: absolute;
    top: 15px;
    left: 30px;
    opacity: 0;
    -webkit-transition: all 1s;
    transition: all 1s;
}

.aside .nav li a:hover {
    color: #e60012;
}

.aside .nav li a:hover:before {
    left: 0px;
    opacity: 1;
}

.aside .nav li.active a {
    color: #000;
    font-weight: bold;
}

.aside .nav li.active a:before {
    left: 0px;
    opacity: 1;
}

.job .accordion {
    background: url(images/job-bg.jpg) bottom repeat-x;
}

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

.job .accordion .header::after, .job .accordion .panel::after, .job .accordion .panel-heading::after {
    content: "";
    display: table;
    clear: both;
}

.job .accordion .header {
    font-weight: bold;
    color: #000;
    border-bottom: 2px solid #e60012;
}

.job .accordion .panel-heading, .job .accordion .header {
    padding: 20px 0 20px 8%;
    box-sizing: border-box;
}

.max-xl-size .job .accordion .panel-heading, .max-xl-size .job .accordion .header {
    padding: 15px;
}

.job .accordion .panel {
    border-bottom: 1px solid #bbbbbb;
}

.job .accordion .panel .panel-heading {
    text-decoration: none;
    display: block;
    color: #424242;
    position: relative;
}

.max-md-size .job .accordion .panel .panel-heading {
    padding-right: 60px;
}

.job .accordion .panel .panel-collapse {
    width: 90%;
    margin: 0 auto;
    margin-bottom: 4%;
    background-color: #fff;
    padding: 2%;
    box-sizing: border-box;
}

.max-xl-size .job .accordion .panel .panel-collapse {
    width: 95%;
    padding: 10px;
}

.job .accordion .panel.open {
    background-color: #f5f5f5;
}

.job .accordion .panel.open .panel-heading {
    border-bottom: 0;
}

.job .accordion .panel.open .panel-collapse {
    display: block;
}

.job .accordion .date, .job .accordion .name, .job .accordion .action {
    float: left;
}

.job .accordion .date {
    width: 20%;
    color: #000;
    text-decoration: none;
}

.max-xl-size .job .accordion .date {
    width: 15%;
}

.max-md-size .job .accordion .date {
    width: auto;
    margin-right: 5px;
}

.job .accordion .name {
    width: 52%;
}

.max-xl-size .job .accordion .name {
    width: 55%;
}

.max-md-size .job .accordion .name {
    width: auto;
}

.job .accordion .action {
    width: 28%;
}

.max-xl-size .job .accordion .action {
    width: 30%;
}

.max-md-size .job .accordion .action {
    width: auto;
    position: absolute;
    top: 15px;
    right: 10px;
}

.job .accordion .action a {
    display: inline-block;
    color: #424242;
}

.job .accordion .action a i {
    display: inline-block;
    width: 25px;
    height: 25px;
    border-radius: 100%;
    background-color: #888888;
    font-style: normal;
    color: #fff;
    margin-right: 5px;
    font-size: 15px;
}

.job .accordion .action a.more i {
    background-color: #e60012;
}

.max-md-size .job .accordion .action a span {
    display: none;
}

.max-xl-size .job .accordion .action a {
    padding: 0 5px;
}

.max-md-size .job .accordion .action a {
    margin-right: 0;
    padding: 0;
}

.supplier h3 {
    position: relative;
}

.supplier h3 .more {
    top: 0;
}

.supplier .box-wp {
    padding-right: 100px;
    position: relative;
}

.max-md-size .supplier .box-wp {
    padding-right: 60px;
}

.supplier .box-wp + .box-wp {
    border-top: 1px dashed #888888;
    margin-top: 10px;
    padding-top: 20px;
}

.supplier .column-2 {
    position: relative;
}

.supplier .more {
    position: absolute;
    top: 15px;
    right: 15px;
    display: inline-block;
    color: #424242;
    text-decoration: none;
    text-align: center;
}

.supplier .more i {
    display: inline-block;
    width: 25px;
    height: 25px;
    line-height: 25px;
    border-radius: 100%;
    background-color: #888888;
    font-style: normal;
    color: #fff;
    margin-right: 5px;
    font-size: 15px;
}

.supplier .more.more i {
    background-color: #e60012;
}

.max-md-size .supplier .more span {
    display: none;
}

.max-xl-size .supplier .more {
    padding: 0 5px;
}

.max-md-size .supplier .more {
    margin-right: 0;
    padding: 0;
}

.supplier .box-wp:first-child .more {
    top: 0;
}

.privacy h3 {
    color: #000;
}

.privacy p {
    margin-bottom: 3em;
}

.memberPayment .header {
    position: relative;
    z-index: 3;
}

.memberPayment .header .camera {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-block;
    padding: 10px 45px;
    background-color: #f6f6f6;
    text-decoration: none;
    color: #3d6889;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}

.memberPayment .header .camera span, .memberPayment .header .camera i {
    vertical-align: middle;
}

.memberPayment .header .camera i {
    display: inline-block;
    background: url(images/video-camera2.png) no-repeat;
    width: 30px;
    height: 30px;
    margin-right: 15px;
}

.memberPayment .header .camera:hover {
    background-color: #e4e2e2;
}

.max-xl-size .memberPayment .dropdown-select-wp {
    text-align: center;
    margin-top: 35px;
}

.memberPayment .img {
    display: inline-block;
    border-radius: 100%;
    width: 30px;
    height: 30px;
    background: #67b8cb url(images/pic.png) no-repeat center center;
}

.memberPayment .img:hover {
    background-color: #e60012;
}

.memberPayment .img.pdf {
    background: #ffc9c3 url(images/pdf.png) no-repeat center center;
}

.memberCamera .header {
    height: 27vh;
}

@media screen and (max-width: 1008px){
    .memberCamera .header {
        height: 12vh;
    }
}

.memberCamera .header h1 {
    font-size: 35px;
    opacity: 1;
    -webkit-animation: upIn2 1s;
    animation: upIn2 1s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

.memberCamera .header h1 span {
    display: inline-block;
    padding-left: 55px;
    background: url(images/video-camera.png) no-repeat left center;
}

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

.memberCamera .list .item {
    width: 50%;
    float: left;
    padding: 25px;
    box-sizing: border-box;
    text-align: center;
}

.max-lg-size .memberCamera .list .item {
    width: 100%;
}

.memberCamera .list .item .pic {
    width: 100%;
    height: 300px;
    position: relative;
}

.max-xl-size .memberCamera .list .item .pic {
    height: 250px;
}

.max-lg-size .memberCamera .list .item .pic {
    height: 300px;
}

.memberCamera .list .item .btn {
    text-transform: uppercase;
    line-height: 16px;
    margin-top: 25px;
}

.memberCamera .list .item .btn i {
    background: url(images/expand-arrows.png) no-repeat;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 5px;
}

.memberCamera .back {
    color: #fff;
    border-radius: 30px 30px 30px 30px;
    border: 1px solid #fff;
    padding: 15px;
    text-decoration: none;
    padding: 15px 35px;
    -webkit-transition: background-color 0.5s;
    transition: background-color 0.5s;
    z-index: 2;
    position: relative;
}

.memberCamera .back:hover {
    background-color: rgba(255, 255, 255, 0.2);
}

.memberOpinions .qa-list .header {
    box-sizing: border-box;
    font-weight: bold;
    color: #000;
    border-bottom: 2px solid #000;
    padding: 15px;
}

.memberOpinions .qa-list .header h3 {
    margin: 0;
}

.memberOpinions .qa-list .title, .memberOpinions .qa-list .info {
    color: #424242;
    border-bottom: 1px solid #dddddd;
}

.memberOpinions .qa-list .title .text, .memberOpinions .qa-list .info .text {
    padding-left: 116px;
    padding-top: 15px;
}

.memberOpinions .qa-list .title time, .memberOpinions .qa-list .info time {
    color: #000;
    font-weight: bold;
}

.memberOpinions .qa-list .title {
    position: relative;
    padding: 25px 25px;
}

.memberOpinions .qa-list .title:before {
    content: 'Q';
    color: #e60012;
    margin-right: 15px;
}

.memberOpinions .qa-list .title .status {
    position: absolute;
    top: 40%;
    right: 5%;
}

.memberOpinions .qa-list .title h4 {
    margin: 0;
    font-weight: normal;
}

.memberOpinions .qa-list .title h4 p {
    margin: 0;
}

.memberOpinions .qa-list .info {
    background-color: #f5f5f5;
    padding: 25px 25px 25px 65px;
}

.memberOpinions .qa-list .info:before {
    content: 'A';
    color: #e60012;
    margin-right: 15px;
}

.memberOpinions .qa-list .info .html p {
    margin: 0;
}

.memberDownlaod .btn-download {
    text-decoration: none;
    border-radius: 30px;
    padding: 5px 35px;
    color: #fff;
    background-color: #f0f0f0;
    color: #000;
    box-shadow: 2px 2px 2px #c8c8c8;
}

.memberDownlaod .btn-download i {
    margin-left: 10px;
}

.memberDownlaod .btn-download:hover {
    background-color: #e60012;
    color: #fff;
}

.max-sm-size .memberDownlaod .btn-download {
    padding: 5px 10px;
}

.memberEngineering {
    padding-bottom: 3vh;
}

.memberEngineering .header {
    position: relative;
    z-index: 3;
}

.memberEngineering .header .right {
    position: absolute;
    right: 0;
    top: 0;
}

.memberEngineering .header .camera {
    display: inline-block;
    padding: 9px 35px;
    background-color: #f6f6f6;
    text-decoration: none;
    color: #3d6889;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
    margin-left: 15px;
}

.max-sm-size .memberEngineering .header .camera {
    padding: 9px;
}

.memberEngineering .header .camera span, .memberEngineering .header .camera i {
    vertical-align: middle;
}

.memberEngineering .header .camera i {
    display: inline-block;
    background: url(images/video-camera2.png) no-repeat;
    width: 30px;
    height: 30px;
    margin-right: 15px;
}

.memberEngineering .header .camera:hover {
    background-color: #e4e2e2;
}

.memberEngineering .slider {
    margin-top: 5%;
    margin-bottom: 5%;
    padding-bottom: 15px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.max-md-size .memberEngineering .slider {
    width: 100%;
}

.memberEngineering .slider .slick-slider .slick-track, .memberEngineering .slider .slick-slider .slick-list, .memberEngineering .slider .slick-slide {
    height: auto;
}

.memberEngineering .slider .slick-prev, .memberEngineering .slider .slick-next {
    color: #fff;
    border: 0;
    font-size: 75px;
    border-radius: 0%;
}

.memberEngineering .slider .slick-prev:before, .memberEngineering .slider .slick-next:before {
    background-color: #DBDBDB;
    padding: 10px 0;
}

.memberEngineering .slider .slick-prev:hover:before, .memberEngineering .slider .slick-next:hover:before {
    background-color: #E60012;
}

.max-md-size .memberEngineering .slider .slick-prev, .max-md-size .memberEngineering .slider .slick-next {
    font-size: 45px;
}

.memberEngineering .slider .slick-prev {
    left: -15px;
}

.memberEngineering .slider .slick-prev:before {
    content: '\e818';
}

.memberEngineering .slider .slick-next {
    right: 30px;
}

.max-md-size .memberEngineering .slider .slick-next {
    right: -10px;
}

.memberEngineering .slider .slick-next:before {
    content: '\e819';
}

.memberEngineering .slider .list-item {
    position: relative;
}

.memberEngineering .slider .list-item .txt {
    position: absolute;
    bottom: 10px;
    right: 10px;
    left: 10px;
    padding: 15px;
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff;
}

.memberEngineering .slider .list-item .pic {
    border: 5px solid #eeeeee;
    padding: 5px;
}

.memberEngineering .slider .list-item img {
    display: block;
    font-size: 0;
    width: 100%;
    height: auto;
}

.select-year{
    width: 100%;
    max-width: 230px;
    height: 55px;
    line-height: 55px;
    border: 1px solid #000;
    padding: 0 15px;
    margin-bottom: 25px;
    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    background: url('images/select-arrow.png') calc(100% - 15px) center no-repeat;
}

.investors .table em {
    color: #888888;
    font-style: normal;
}

.btn-3d-link {
    width: 100%;
    max-width: 220px;
    height: 55px;
    line-height: 55px;
    font-size: 15px;
    text-decoration: none;
    border-radius: 5px;
    padding: 0 70px 0 35px;
    color: #fff!important;
    box-shadow: 2px 2px 2px #c8c8c8;
    position: relative;
    z-index: 30;
    text-decoration: none!important;
}

.btn-3d-link:before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    transform: translate(-50%, -50%);
    background: #187DC8;
    background: -moz-linear-gradient(top, #187DC8 0%, #033860 100%);
    background: -webkit-linear-gradient(top, #187DC8 0%,#033860 100%);
    background: linear-gradient(to bottom, #187DC8 0%,#033860 100%);
}

.btn-3d-link:after{
    content: "";
    display: block;
    width: calc(100% + 4px);
    height: 59px;
    border-radius: 5px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -5;
    transform: translate(-50%, -50%);
    background: #77A0C0;
    background: -moz-linear-gradient(top left, #77A0C0 0%, #0E5185 100%);
    background: -webkit-linear-gradient(top left, #77A0C0 0%,#0E5185 100%);
    background: linear-gradient(to bottom right, #77A0C0 0%,#0E5185 100%);
}

.btn-3d-link i {
    border-radius: 50%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    margin-left: 15px;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 15px;
    z-index: 5;
    transform: translateY(-50%);
    background: #033860;
    background: -moz-linear-gradient(top, #033860 0%, #187DC8 100%);
    background: -webkit-linear-gradient(top, #033860 0%,#187DC8 100%);
    background: linear-gradient(to bottom, #033860 0%,#187DC8 100%);
}

.btn-3d-link i:before {
    font-size: 12px;
    font-weight: normal;
}

.btn-3d-link.link:before{
    background: #01A1EC;
    background: -moz-linear-gradient(top, #01A1EC 0%, #1F5F82 100%);
    background: -webkit-linear-gradient(top, #01A1EC 0%,#1F5F82 100%);
    background: linear-gradient(to bottom, #01A1EC 0%,#1F5F82 100%);
}

.btn-3d-link.link:after{
    background: #95D1ED;
    background: -moz-linear-gradient(top left, #95D1ED 0%, #13547C 100%);
    background: -webkit-linear-gradient(top left, #95D1ED 0%,#13547C 100%);
    background: linear-gradient(to bottom right, #95D1ED 0%,#13547C 100%);
}

.btn-3d-link.link i{
    background: #27729a;
    background: -moz-linear-gradient(top, #27729a 0%, #0F83C2 100%);
    background: -webkit-linear-gradient(top, #27729a 0%,#0F83C2 100%);
    background: linear-gradient(to bottom, #27729a 0%,#0F83C2 100%);
}

.btn-3d-link.more:before{
    background: #00A7B7;
    background: -moz-linear-gradient(top, #00A7B7 0%, #1D7A80 100%);
    background: -webkit-linear-gradient(top, #00A7B7 0%,#1D7A80 100%);
    background: linear-gradient(to bottom, #00A7B7 0%,#1D7A80 100%);
}

.btn-3d-link.more:after{
    background: #67C1C9;
    background: -moz-linear-gradient(top left, #67C1C9 0%, #10727D 100%);
    background: -webkit-linear-gradient(top left, #67C1C9 0%,#10727D 100%);
    background: linear-gradient(to bottom right, #67C1C9 0%,#10727D 100%);
}

.btn-3d-link.more i{
    background: #0b7780;
    background: -moz-linear-gradient(top, #0b7780 0%, #0D909C 100%);
    background: -webkit-linear-gradient(top, #0b7780 0%,#0D909C 100%);
    background: linear-gradient(to bottom, #0b7780 0%,#0D909C 100%);
}

.case .header {
    text-align: center;
}

.case .header .dropdown-select {
    width: 180px;
    margin-left: 15px;
}

.case .header .dropdown-select .btn {
    text-align: left;
}

.max-sm-size .case .header .dropdown-select {
    width: 90px;
    margin-left: 1px;
}

.case .list {
    padding: 0;
    min-height: 300px;
}

.case .list a {
    text-decoration: none;
    color: #000;
}

.case .list .item {
    padding: 20px;
    text-align: center;
    width: 25%;
    float: left;
    box-sizing: border-box;
    position: relative;
}

.max-lg-size .case .list .item {
    padding: 10px;
    width: 33%;
}

.max-sm-size .case .list .item {
    padding: 5px;
    width: 50%;
}

.case .list .item .hot, .case .list .item .notice {
    position: absolute;
    top: -3px;
    left: -3px;
    color: #fff;
    z-index: 5;
}

.case .list .item .hot em, .case .list .item .notice em {
    position: relative;
    z-index: 2;
    font-style: normal;
    display: block;
    width: 75px;
    line-height: 60px;
}

.case .list .item .hot:before, .case .list .item .notice:before {
    position: absolute;
    top: -100px;
    left: -100px;
    content: '';
    width: 180px;
    height: 180px;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
    background-color: rgba(230, 0, 18, 0.8);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 1;
}

.case .list .item .notice:before {
    background-color: rgba(15, 19, 23, 0.7);
}

.case .list .item .box {
    position: relative;
    padding: 0;
    display: block;
    width: 100%;
    float: left;
    height: 300px;
    z-index: 1;
    overflow: hidden;
    box-sizing: border-box;
}

.max-lg-size .case .list .item .box {
    height: 200px;
}

.case .list .item .box h3 {
    position: absolute;
    color: #fff;
    bottom: 0;
    width: 100%;
    padding: 0;
    margin: 0;
    font-weight: bold;
    box-sizing: border-box;
    overflow: hidden;
    padding: 20px 0 10px 0;
    background: url(images/case-bg.png) repeat-x top;
}

.case .list .item .box .img {
    width: 100%;
    height: 100%;
}

.case .list .item .box .img img {
    display: block;
    font-size: 0;
}

.case .list .item .box .img .mark {
    width: 101%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(230, 0, 18, 0.6);
}

.case .list .item .box .img .mark .icon {
    position: absolute;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    color: #fff;
}

.case .list .item .box .img .mark .icon i {
    border-radius: 99em;
    border: 2px solid #fff;
    width: 110px;
    height: 110px;
    line-height: 110px;
    display: inline-block;
    font-size: 20px;
    -webkit-transform: scale(1.6);
    -ms-transform: scale(1.6);
    transform: scale(1.6);
    -webkit-transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    opacity: 0;
}

.case .list .item .box .mark {
    opacity: 0;
    -webkit-transition: all 0.8s;
    transition: all 0.8s;
}

.case .list .item .box:hover .mark {
    opacity: 1;
}

.case .list .item .box:hover .mark .icon i {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

#caseInfo .section-1 {
    width: 100%;
    position: relative;
}

#caseInfo .section-1::after {
    content: "";
    display: table;
    clear: both;
}

#caseInfo .section-1 .case-logo {
    position: absolute;
    left: 50%;
    top: 40%;
    z-index: 3;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    width: 220px;
}

#caseInfo .section-1 .case-logo img {
    width: 100%;
    height: auto;
}

.max-xl-size #caseInfo .section-1 .case-logo {
    width: 180px;
}

.max-lg-size #caseInfo .section-1 .case-logo {
    width: 140px;
    top: 40vh;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

#caseInfo .section-1 .txt, #caseInfo .section-1 .pic {
    box-sizing: border-box;
    width: 50%;
    background: #000;
}

.max-lg-size #caseInfo .section-1 .txt, .max-lg-size #caseInfo .section-1 .pic {
    margin: 0;
    width: 100%;
    position: relative;
    display: block;
}

#caseInfo .section-1 .pic {
    z-index: 1;
    height: 100%;
    position: absolute;
    width: 50%;
    overflow: hidden;
}

.max-lg-size #caseInfo .section-1 .pic {
    height: 40vh;
}

#caseInfo .section-1 .pic img {
    display: block;
    font-size: 0;
    vertical-align: bottom;
    float: left;
}

#caseInfo .section-1 .txt {
    box-shadow: -5px 0px 5px rgba(255, 255, 255, 0.2);
    z-index: 2;
    position: relative;
    margin-left: 50%;
    min-height: 100vh;
}

.max-lg-size #caseInfo .section-1 .txt {
    min-height: inherit;
}

#caseInfo .section-1 .txt .imgfull {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
}

#caseInfo .section-1 .txt .info {
    position: relative;
    z-index: 2;
    color: #fff;
    box-sizing: border-box;
    padding: 25vh 2vh 2vh 220px;
}

.max-bg-size #caseInfo .section-1 .txt .info {
    padding: 20vh 2vh 2vh 160px;
}

.max-xl-size #caseInfo .section-1 .txt .info {
    padding: 18vh 2vh 2vh 120px;
}

.max-lg-size #caseInfo .section-1 .txt .info {
    padding: 90px 20px 20px 20px;
}

#caseInfo .section-1 .txt .info .dl-horizontal {
    margin: 0;
}

#caseInfo .section-1 .txt .info .dl-horizontal dt, #caseInfo .section-1 .txt .info .dl-horizontal dd {
    line-height: 2.2rem;
}

#caseInfo .section-1 .txt .info .dl-horizontal dd {
    margin-left: 90px;
}

#caseInfo .section-1 .txt .info .dl-horizontal dd a {
    text-decoration: none;
    color: #fff;
    display: inline-block;
    position: relative;
    padding-right: 35px;
}

#caseInfo .section-1 .txt .info .dl-horizontal dd i {
    color: #e60012;
    font-size: 30px;
    position: absolute;
    right: 0;
    top: -7px;
}



#caseInfo .section-1 .txt .info .widget_social a {
    color: #fff;
    text-decoration: none;
    display: inline-block;
    border-radius: 5px;
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    margin-right: 0.4rem;
}

#caseInfo .section-1 .txt .info .widget_social a.facebook {
    background-color: #3b5998;
}

#caseInfo .section-1 .txt .info .widget_social a.line {
    background-color: #00c100;
}

#caseInfo .section-1 .txt .info .widget_social a.gplus {
    background-color: #d64532;
}

#caseInfo .section-1 .txt .info .widget_social a.wechat {
    background-color: #42a800;
}

#caseInfo .section-2 {
    /* === responsive.tabs.js ===*/
}

#caseInfo .section-2 .tabs .tabs-header {
    padding-top: 10px;
}

.max-md-size #caseInfo .section-2 .tabs .tabs-header {
    padding-top: 0;
}

#caseInfo .section-2 .tabs .tabs-header .container-xl {
    position: relative;
}

.max-md-size #caseInfo .section-2 .tabs .tabs-header .container-xl {
    display: none;
}

#caseInfo .section-2 .tabs .tabs-header a {
    text-decoration: none;
    color: #000;
}

#caseInfo .section-2 .tabs .tabs-header .btn-back {
    position: absolute;
    left: 15px;
    top: 18px;
}

#caseInfo .section-2 .tabs .tabs-header .btn-back i {
    margin-right: 10px;
}

#caseInfo .section-2 .tabs .tabs-header .btn-ask {
    position: absolute;
    right: 15px;
    top: 5px;
    border: 1px solid #e60012;
    color: #e60012;
    padding: 0.5rem 2rem;
}

#caseInfo .section-2 .tabs .tabs-list {
    list-style: none;
    text-align: center;
    margin: 0;
}

#caseInfo .section-2 .tabs .tabs-list li {
    display: inline-block;
    margin-right: 10px;
}

#caseInfo .section-2 .tabs .tabs-list li a {
    display: block;
    padding: 15px 0px;
    margin: 0 25px;
    color: #808080;
    text-decoration: none;
}

#caseInfo .section-2 .tabs .tabs-list li a:hover {
    color: #e60012;
}

#caseInfo .section-2 .tabs .tabs-list li.active a {
    color: #000;
    font-weight: bold;
    border-bottom: 3px solid #e60012;
}

#caseInfo .section-2 .tabs .tabs-container {
    background-color: #eeeeee;
}

.max-md-size #caseInfo .section-2 .tabs .tabs-container {
    background-color: #fff;
}

#caseInfo .section-2 .tabs .tabs-container .html, #caseInfo .section-2 .tabs .tabs-container .caseInfo-brief {
    padding: 8vh 15px;
}

.max-md-size #caseInfo .section-2 .tabs .tabs-container .html, .max-md-size #caseInfo .section-2 .tabs .tabs-container .caseInfo-brief {
    padding: 15px;
}

#caseInfo .section-2 .tabs .accordion-handle {
    display: none;
}

#caseInfo .section-2 .accordion-handle {
    position: relative;
    background-color: #eeeeee;
    text-decoration: none;
    color: #000;
    cursor: pointer;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    border-bottom: 1px solid #d9d9d9;
}

#caseInfo .section-2 .accordion-handle:hover {
    background-color: #d9d9d9;
}

#caseInfo .section-2 .accordion-handle.active {
    background-color: #e60012;
    color: #fff;
}

#caseInfo .section-2 .accordion-handle h4 {
    height: 38px;
    line-height: 38px;
    padding: 0 15px;
    font-size: 14px;
    font-weight: normal;
}

#caseInfo .section-2 .accordion-handle i {
    display: block;
    width: 38px;
    height: 38px;
    overflow: hidden;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 38px;
    font-style: 15px;
}

#caseInfo .section-2 .accordion-handle i:before {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: '\e80e';
}

#caseInfo .section-2 .accordion-content {
    display: none;
}

.max-md-size #caseInfo .section-2 .responsive-tabs .tabs-list {
    display: none;
}

.max-md-size #caseInfo .section-2 .responsive-tabs .accordion-handle {
    display: block;
}

.max-md-size #caseInfo .section-2 .responsive-tabs .accordion-handle h4 {
    margin: 0;
}

#caseInfo .section-2 .caseInfo-brief .left {
    padding-right: 15px;
}

#caseInfo .section-2 .caseInfo-brief .right {
    padding-left: 15px;
}

#caseInfo .section-2 .caseInfo-brief .left, #caseInfo .section-2 .caseInfo-brief .right {
    box-sizing: border-box;
    width: 49%;
    display: inline-block;
    vertical-align: top;
}

#caseInfo .section-2 .caseInfo-brief .left img, #caseInfo .section-2 .caseInfo-brief .right img {
    max-width: 100%;
    height: auto;
}

.max-lg-size #caseInfo .section-2 .caseInfo-brief .left, .max-lg-size #caseInfo .section-2 .caseInfo-brief .right {
    width: 100%;
    text-align: center;
    padding: 0;
}

#caseInfo .section-2 .caseInfo-brief .widget-social {
    margin-top: 5vh;
    border-top: 1px dashed #888888;
    padding-top: 3vh;
}

#caseInfo .section-2 .caseInfo-brief .widget-social a {
    display: inline-block;
    color: #000;
    margin-right: 15px;
    text-decoration: none;
}

#caseInfo .section-2 .caseInfo-brief .widget-social a i {
    width: 30px;
    display: inline-block;
    height: 30px;
    border-radius: 50%;
    text-align: center;
    font-size: 18px;
    line-height: 30px;
    margin-right: 0.4rem;
    color: #fff;
}

#caseInfo .section-2 .caseInfo-brief .widget-social a i.facebook {
    background-color: #3b5998;
}

#caseInfo .section-2 .caseInfo-brief .widget-social a i.link {
    background-color: #e60012;
}

#caseInfo .section-3 {
    height: 60vh;
    background: #000;
    position: relative;
}

#caseInfo .section-3 .inner-wp {
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    z-index: 2;
}

#caseInfo .section-3 .imgfull {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#caseInfo .section-3 .imgfull img {
    -webkit-transition: -webkit-transform 0.8s ease;
    transition: transform 0.8s ease;
}

#caseInfo .section-3 .imgfull:hover img {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}

#caseInfo .section-3 .inner {
    display: inline-block;
    color: #fff;
    text-align: center;
    text-decoration: none;
}

#caseInfo .section-3 .inner h3 {
    font-weight: normal;
    text-transform: capitalize;
}

#caseInfo .section-3 .inner i {
    font-size: 40px;
    border-radius: 50%;
    line-height: 90px;
    width: 90px;
    height: 90px;
    display: inline-block;
    border: 2px solid #fff;
}

#caseInfo .section-4 {
    background: url(images/caseInfo-bg3.jpg);
    padding: 5vh 0;
}

#caseInfo .section-4::after {
    content: "";
    display: table;
    clear: both;
}

#caseInfo .section-4 .slider {
    padding: 5vh 0;
}

#caseInfo .section-4 .slider .slick-list {
    width: 90%;
    margin: 0 auto;
    padding-bottom: 35px;
}

#caseInfo .section-4 .slider .slick-prev, #caseInfo .section-4 .slider .slick-next {
    border-radius: 0;
    background-color: #dbdbdb;
    font-size: 20px;
    border: 0;
}

#caseInfo .section-4 .slider .slick-prev:hover, #caseInfo .section-4 .slider .slick-next:hover {
    background-color: #e60012;
}

.max-xl-size #caseInfo .section-4 .slider .slick-prev, .max-xl-size #caseInfo .section-4 .slider .slick-next {
    display: none !important;
}

#caseInfo .section-4 .slider .slick-dots {
    bottom: 0;
}

.max-lg-size #caseInfo .section-4 .slider .slick-dots li {
    margin: 0 3px;
}

#caseInfo .section-4 .slider .slick-dots li button {
    border: 2px solid #8a8a8a;
    background-color: transparent;
}

#caseInfo .section-4 .slider .slick-dots li.slick-active button {
    border: 2px solid #e60012;
    background-color: #e60012;
}

#caseInfo .section-4 .item {
    height: auto;
    padding: 1vw;
    text-align: center;
    box-sizing: border-box;
    position: relative;
}

#caseInfo .section-4 .item .box {
    position: relative;
    padding: 0;
    display: block;
    width: 100%;
    float: left;
    height: 300px;
    z-index: 1;
    overflow: hidden;
    box-sizing: border-box;
}

.max-bg-size #caseInfo .section-4 .item .box {
    height: 250px;
}

.max-lg-size #caseInfo .section-4 .item .box {
    height: 200px;
}

#caseInfo .section-4 .item .box .img {
    width: 100%;
    height: 100%;
}

#caseInfo .section-4 .item .box .img img {
    display: block;
    font-size: 0;
}

#caseInfo .section-4 .item .box .img .mark {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(230, 0, 18, 0.8);
}

#caseInfo .section-4 .item .box .img .mark .icon {
    position: absolute;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    color: #fff;
}

#caseInfo .section-4 .item .box .img .mark .icon i {
    border-radius: 99em;
    border: 2px solid #fff;
    width: 110px;
    height: 110px;
    line-height: 110px;
    display: inline-block;
    font-size: 20px;
    -webkit-transform: scale(1.6);
    -ms-transform: scale(1.6);
    transform: scale(1.6);
    -webkit-transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    opacity: 0;
    font-style: normal;
}

#caseInfo .section-4 .item .box .mark {
    opacity: 0;
    -webkit-transition: all 0.8s;
    transition: all 0.8s;
}

#caseInfo .section-4 .item .box:hover .mark {
    opacity: 1;
}

#caseInfo .section-4 .item .box:hover .mark .icon i {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

#caseInfo .section-5 {
    padding: 5vh 0;
}

#caseInfo .section-5::after {
    content: "";
    display: table;
    clear: both;
}

#caseInfo .section-5 .btn-red {
    border: 1px solid #e60012;
}

#caseInfo .section-5 .btn-red:hover {
    background-color: #fff;
    color: #555555;
    border: 1px solid #555555;
}

#caseInfo .section-6 {
    margin-top: 8vh;
}

.max-md-size #caseInfo .section-6 {
    margin-top: 10px;
}

#caseInfo .section-6 .section-header {
    text-align: center;
}

#caseInfo .section-6 .section-header .inner {
    background-color: #3e3e3e;
    color: #fff;
    padding: 20px 0;
}

#caseInfo .section-6 .section-header .inner h2 {
    margin: 0;
}

.max-md-size #caseInfo .section-6 .section-header .inner {
    padding: 10px 0;
}

#caseInfo .section-6 .section-content {
    background-color: #eeeeee;
    padding-bottom: 8vh;
}

.max-md-size #caseInfo .section-6 .section-content {
    padding-bottom: 0;
}

#caseInfo .section-6 .section-content .inner {
    background-color: #fff;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    padding: 8vh;
}

.max-xl-size #caseInfo .section-6 .section-content .inner {
    padding: 3vh;
}

.max-md-size #caseInfo .section-6 .section-content .inner .btn-wp, .max-md-size #caseInfo .section-6 .section-content .inner .g-recaptcha-wp {
    text-align: center;
}

#caseInfo .section-6 .section-content .inner .radio-inline {
    margin-right: 15px;
}

#caseInfo .title {
    text-align: center;
}

#caseInfo .title span {
    display: inline-block;
    position: relative;
}

#caseInfo .title span:before, #caseInfo .title span:after {
    content: '';
    height: 0;
    border-bottom: 1px solid #000;
    width: 80px;
    position: absolute;
    top: 50%;
    background-color: #000;
    display: inline-block;
}

#caseInfo .title span:before {
    left: -40px;
    -webkit-transform: translateX(-100%) translateY(-50%);
    -ms-transform: translateX(-100%) translateY(-50%);
    transform: translateX(-100%) translateY(-50%);
}

#caseInfo .title span:after {
    right: -40px;
    -webkit-transform: translateX(100%) translateY(-50%);
    -ms-transform: translateX(100%) translateY(-50%);
    transform: translateX(100%) translateY(-50%);
}

#about .banner {
    height: 95vh;
    position: fixed;
    z-index: 1;
    top: 0;
    overflow: hidden;
}

#about .main {
    margin-top: 65vh;
}

#about .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #e60012;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)";
}

#about .mCSB_scrollTools .mCSB_draggerRail {
    background-color: #707070;
}

#about .section-1 {
    position: relative;
    z-index: 2;
}

#about .section-1::after {
    content: "";
    display: table;
    clear: both;
}

.max-md-size #about .section-1 .container-xl {
    padding: 0;
}

#about .section-1 .left, #about .section-1 .right {
    width: 50%;
    float: left;
    box-sizing: border-box;
    height: 626px;
}

.max-md-size #about .section-1 .left, .max-md-size #about .section-1 .right {
    width: 100%;
    height: auto;
    float: none;
    margin: 0;
}

#about .section-1 .left {
    background-color: #fff;
    padding: 5vh 2.5vw 5vh 5vw;
}

#about .section-1 .right {
    padding: 5vh 2.5vw 5vh 5vw;
    margin-top: 5vh;
    background: url(images/home-case-bg.jpg);
    color: #fff;
}

#about .section-header {
    text-align: center;
    position: relative;
    z-index: 2;
}

#about .section-header i {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    bottom: 0;
}

#about .section-header i:after {
    top: -5px;
    content: '';
    display: inline-block;
    position: absolute;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    width: 15px;
    height: 15px;
    background: #e60012;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
    -ms-transform-origin: 0 100%;
    transform-origin: 0 100%;
}

#about .section-header p {
    color: #fff;
    text-shadow: 0px 0px 5px rgba(39, 39, 39, 0.6);
    font-family: "Prata";
    font-weight: normal;
    letter-spacing: 2px;
    margin: 0 0 50px 0;
    white-space: nowrap;
    font-size: 50px;
}

.max-lg-size #about .section-header p {
    font-size: 30px;
}

.max-sm-size #about .section-header p {
    font-size: 20px;
}

#about .section-2 {
    margin-top: -5vh;
    position: relative;
    z-index: 1;
}

.max-md-size #about .section-2 {
    margin-top: 0;
}

#about .section-2 .section-header {
    /* background: url(images/about-section-2-1.jpg) center center no-repeat; */
    background-size: cover;
    padding: 13vh 0 3vh 0;
    color: #fff;
    position: relative;
    z-index: 2;
}

#about .section-2 .section-content {
    background: #fff url(images/about-section-2-bg.jpg) no-repeat right bottom;
    height: auto;
    position: relative;
    z-index: 1;
}

#about .section-2 .section-content:before {
    position: absolute;
    content: '';
    height: 0;
    width: 100%;
    border-bottom: 1px solid #e60012;
    bottom: 92px;
}

#about .section-2 .section-content .slider {
    padding: 50px 0;
}

#about .section-2 .section-content .slider .slick-list {
    max-width: 1480px;
    margin: 0 auto;
    padding-bottom: 35px;
}

#about .section-2 .section-content .slider .slick-prev, #about .section-2 .section-content .slider .slick-next {
    border-radius: 0;
    background-color: #dbdbdb;
    font-size: 20px;
    border: 0;
}

#about .section-2 .section-content .slider .slick-prev:hover, #about .section-2 .section-content .slider .slick-next:hover {
    background-color: #e60012;
}

/* // .max-xl-size #about .section-2 .section-content .slider .slick-prev, .max-xl-size #about .section-2 .section-content .slider .slick-next {
//     display: none !important;
// } */
#about .section-2 .section-content .slider .slick-dots {
    bottom: 0;
}

.max-lg-size #about .section-2 .section-content .slider .slick-dots li {
    margin: 0 3px;
}

#about .section-2 .section-content .slider .slick-dots li button {
    border: 2px solid #8a8a8a;
    background-color: transparent;
}

#about .section-2 .section-content .slider .slick-dots li.slick-active button {
    border: 2px solid #e60012;
    background-color: #e60012;
}

#about .section-2 .slider .item {
    text-align: center;
    box-sizing: border-box;
    padding: 2vw;
    height: 650px;
    position: relative;
}

.max-md-size #about .section-2 .slider .item {
    height: 500px;
}

#about .section-2 .slider .item .pic {
    border-radius: 50%;
    width: 260px;
    height: 260px;
}

#about .section-2 .slider .item .year {
    font-family: "Prata";
    font-style: italic;
}

#about .section-2 .slider .item .txt{
    height: auto;
    max-height: 230px;
}

.max-md-size #about .section-2 .slider .item .txt{
    max-height: 128px;
}

#about .section-2 .slider .item i {
    border: 2px solid #e60012;
    background-color: #fff;
    width: 10px;
    height: 10px;
    bottom: 0;
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    position: absolute;
    display: inline-block;
    border-radius: 50%;
}

#about .section-3 {
    position: relative;
    z-index: 1;
}

#about .section-3 .section-header {
    background: url(images/about-section-3-bg.jpg) center center no-repeat;
    background-size: cover;
    padding: 10vh 0;
    color: #fff;
}

#about .section-3 .section-content {
    background: #f0f0f0 url(images/about-section-3-bg2.jpg) no-repeat left bottom;
    height: auto;
    position: relative;
    z-index: 1;
    padding: 10vh 15px;
}

#about .section-4 {
    position: relative;
    z-index: 1;
    /* background: url(images/about-section-4-bg.jpg) center center no-repeat; */
    background-size: cover;
    padding-bottom: 8vh;
}

#about .section-4 .section-header {
    padding: 10vh 0 3vh 0;
    color: #fff;
}

#about .section-4 .section-content {
    position: relative;
    z-index: 1;
}

#about .section-4 .tabs .tabs-list {
    list-style: none;
    margin: 0;
}

#about .section-4 .tabs .accordion-handle {
    display: none;
}

#about .section-4 .accordion-handle {
    position: relative;
    background-color: #eeeeee;
    text-decoration: none;
    color: #000;
    cursor: pointer;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    border-bottom: 1px solid #d9d9d9;
}

#about .section-4 .accordion-handle:hover {
    background-color: #d9d9d9;
}

#about .section-4 .accordion-handle.active {
    background-color: #e60012;
    color: #fff;
}

#about .section-4 .accordion-handle h4 {
    height: 38px;
    line-height: 38px;
    padding: 0 15px;
    font-size: 14px;
    font-weight: normal;
}

#about .section-4 .accordion-handle i {
    display: block;
    width: 38px;
    height: 38px;
    overflow: hidden;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 38px;
    font-style: 15px;
}

#about .section-4 .accordion-handle i:before {
    font-family: "style";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: '\e80e';
}

#about .section-4 .accordion-content {
    display: none;
}

.max-md-size #about .section-4 .responsive-tabs .tabs-list {
    display: none;
}

.max-md-size #about .section-4 .responsive-tabs .accordion-handle {
    display: block;
}

.max-md-size #about .section-4 .responsive-tabs .accordion-handle h4 {
    margin: 0;
}

#about .section-4 .tabs-container .tab-content {
    padding: 5vw;
    box-sizing: border-box;
    height: 100%;
    background-color: #fff;
    height: 530px;
}

#about .section-4 .tabs-container .mCSB_scrollTools .mCSB_draggerRail {
    background-color: #bbbbbb;
}

#about .section-4 .tabs-container .item {
    box-sizing: border-box;
}

#about .section-4 .tab-header {
    overflow-x: auto;
    width: 100%;
}

#about .section-4 .mCSB_horizontal.mCSB_inside > .mCSB_container {
    margin-bottom: 0px;
}

#about .section-4 .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    height: 9px;
}

#about .section-4 .tabs-list {
    padding: 0;
    margin: 0;
    white-space: nowrap;
}

#about .section-4 .tabs-list::after {
    content: "";
    display: table;
    clear: both;
}

#about .section-4 .tabs-list .item {
    margin-right: 0px;
    display: inline-block;
    vertical-align: bottom;
    height: 60px;
    min-width: 150px;
    float: left;
    padding-right: 1px;
}

.max-lg-size #about .section-4 .tabs-list .item {
    min-width: inherit;
}

#about .section-4 .tabs-list .item .title {
    background-color: #eeeeee;
    height: 50px;
    line-height: 50px;
    margin-top: 10px;
    padding: 0 20px;
    text-align: center;
    display: block;
    color: #444444;
}

#about .section-4 .tabs-list .item .title:hover {
    color: #fff;
    background-color: #000;
}

#about .section-4 .tabs-list .item.active .title {
    color: #fff;
    background-color: #000;
    height: 60px;
    line-height: 60px;
    margin-top: 0px;
}

#ad {
    position: fixed;
    z-index: 9996;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.8);
    text-align: center;
    overflow: hidden;
}

#ad .inner {
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
}

#ad img {
    opacity: 0;
}

#ad iframe {
    width: 100%;
    height: 90vh;
}

 .min-lg-size #ad iframe {
     max-width: 1080px;
     max-height: 610px;
 }

#ad .btn-close {
    display: inline-block;
    text-decoration: none;
    font-size: 75px;
    color: #fff;
    top: 3vh;
    right: 1vh;
    position: absolute;
}

.max-lg-size #ad .btn-close {
    font-size: 55px;
}

.csrInfo h2 {
    position: relative;
}

.csrInfo .btn-back {
    position: absolute;
    right: 15px;
    top: 0px;
    font-size: 1rem;
    color: #000;
    text-decoration: none;
    display: none;
}

.max-lg-size .csrInfo .btn-back {
    display: block;
}

.csrInfo .btn-back i {
    margin-right: 10px;
}


/*en*/

.max-md-size body.en .form-group .left {
    white-space: normal;
}

.max-md-size body.en .form-group .left[for="service"] {
    width: 200px;
}

.max-sm-size .navbar-page li {
    width: 50%;
}

.max-xs-size .csr-list .item .img {
    height: 15vw;
}

.case .header .dropdown-select {
    margin-bottom: 5px;
}

.case .header .dropdown-select:first-of-type {
    z-index: 101;
}

.case .header .dropdown-select:first-of-type + .dropdown-select {
    z-index: 100;
}

.max-xs-size .case .header .dropdown-select {
    width: 100%;
}

.windows .ie11 #home-banner .video-item iframe {
    transform: scale(1.2) !important;
}

/*敶�枂閬𣇉��*/

.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
}

#readMore{
    width: 800px;
    max-width: 100%;
}

.popup-content{
    padding: 55px 100px 55px 70px;
}

#readMore .mfp-close{
    width: 70px;
    height: 70px;
    background-color: #E60118;
    color: #fff;
    text-align: center;
    line-height: 70px;
    font-size: 0;
    color: transparent;
    opacity: 1;
}

#readMore .mfp-close:before{
    content: "";
    display: block;
    width: 40px;
    height: 1px;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    transform: rotate(45deg);
}

#readMore .mfp-close:after{
    content: "";
    display: block;
    width: 40px;
    height: 1px;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    transform: rotate(-45deg);
}

.read-more-list{
    border-top: 2px solid #E60118;
    border-bottom: 2px solid #E60118;
}

.read-more-list .item{
    display: block;
    border-bottom: 1px solid #BBBBBB;
    padding: 15px 25px;
    position: relative;
    text-decoration: none;
    line-height: 1.5;
}

.read-more-list .item:hover{
    background-color: #EEEEEE;
}

.read-more-list .title{
    color: #000;
    font-size: 16px;
    margin-top: 0;
    margin-bottom: 5px;
}

.read-more-list .item:hover .title{
    text-decoration: underline;
}

.read-more-list .des{
    color: #8B8B8B;
    margin-top: 0;
    margin-bottom: 5px;
}

.read-more-list .item .icon{
    display: block;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color: #E60118;
    position: absolute;
    top: 20px;
    right: 25px;
    color: #fff;
    text-align: center;
    line-height: 25px;
}
/* overlay at start */
.mfp-fade.mfp-bg {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}
/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}


/*��蝣�*/

.page-number{
    text-align: center;
    padding: 2em 0;
    list-style-type: none;
}

.page-number li{
    display: inline-block;
    vertical-align: top;
    margin: 4px;
}

.page-number li a{
    display: block;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 1px solid #AEAEAE;
    text-decoration: none;
    color: #AEAEAE;
    background-color: #fff;
    text-align: center;
    line-height: 35px;
    -webkit-transition: color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out;
    -o-transition: color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out;
    transition: color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out;
}

.page-number li:hover a,
.page-number li.active a{
    border: 1px solid #E60012;
    background-color: #E60012;
    color: #fff;
}

.page-number li.prev a,
.page-number li.next a{
    border: 1px solid #E60012;
    color: #E60012;
}

.page-number li.prev:hover a,
.page-number li.next:hover a{
    color: #fff;
}
.banner-icon{
    position: absolute;
    bottom:40px;
    right:95px;
    text-align: center;
}
.banner-icon.widget-social a {
    display: inline-block;
    text-decoration: none;
    border-radius: 50%;
    margin: 0 5px;
    color: #fff;
    background-color: #444444;
    width: 33px;
    height: 33px;
    line-height: 33px;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}
.banner-icon.widget-social a:hover {
    background-color: #e60012;
}
.banner-icon.widget-social a.facebook:hover {
    background-color: #324F93;
}
.banner-icon.widget-social a:before {
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
.banner-icon.widget-social a:hover:before {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

#home-banner .imgfull img{
    left:0 !important;
}
#home-case .imgfull img{
    left:0 !important;
}
#home-classic .imgfull img{
    left:0 !important;
}







#header .widget-social-1{
    position: absolute;
    right: 5.5vw;
    top: 5vh;
    text-align: center;
}

.max-bg-size #header .widget-social-1{
     right: 1vw;
}
.max-lg-size #header .widget-social-1{
    top:23px;
    right:80px;
}
.scroll.isTablet #header .widget-social-1{
    top:16px;
}
#header .widget-social-1 a.social{
    display: inline-block;
    text-decoration: none;
    border-radius: 50%;
    color: #fff;
    vertical-align: middle;
    margin-top: -7px;
    width: 30px;
    height: 30px;
    line-height: 37px;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    position: relative;
}
#header .widget-social-1 a.facebook{
    background-color: #32548F;
}
#header .widget-social-1 a.facebook:hover{
     background-color:#2B4777;
}

#header .widget-social-1 a.youtube{
    background-color: #F7000A;
    position: relative;
}
#header .widget-social-1 a.google{
    background-color: #686868;

}
#header .widget-social-1 a.social:before{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
}
#header .widget-social-1 a.google:hover{
     background-color: #444444;;
}

#header .widget-social-1 a.youtube:hover{
    background-color: #B90008
}
#header .widget-social-1 a.youtube img{
    width:16px;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
}
#header .widget-social-1 a:before{
    margin:0;
}
#header .widget-social-1 a:not(:last-child){
    margin-right:0.5vw;
}
.home-header .navbar-header .widget-btn:hover {
    color: #e60012;
}

.home-header .navbar-header .widget-btn.open {
    color: #e60012;
}

.home-header .navbar-header .widget-btn {
    text-decoration: none;
    color: #fff;
    font-size: 25px;
    padding: 0;
    margin: 0;
    line-height: normal;
    z-index: 999;
    -webkit-transition: color 0.5s;
    transition: color 0.5s;
}

@media screen and (max-width: 1280px){
    .isTablet .navbar.navbar-main{
            padding: 0 13vw 0 5vw;
    }
    .isTablet .navbar .level-1 > li{
        width:12%;
        font-size: 16px;
    }
    .isTablet .navbar .level-1 > li:lang(en){
        width: auto;
    }
}
@media screen and (max-width: 576px){
   #header .navbar-toggler    {
       right:5px;
   }
   #header .widget-social-1{
       right:55px !important;
   }
   #header .widget-social-1 a:not(:last-child){
           margin-right: 2vw;
   }
}
.scroll.isMobile  #header .widget-social-1{
    top:10px;
}


.en.isTablet .navbar .level-1 > li:nth-child(3){
    min-width: 180px;
}

#caseInfo .section-1 .txt .info .widget_social{
    padding-top: 30px;
}
#caseInfo .section-1 .txt .info .widget_social span{
    font-size: 16px;
    font-weight: bold;
    margin-left:16px;
    margin-right: 7px;
}
.max-md-size #caseInfo .section-1 .txt .info .widget_social span{
    font-size: 15px;
    margin-left:15px;
    margin-right: 11px;
}
.max-sm-size #caseInfo .section-1 .txt .info .widget_social{
    padding-top: 13px;
}
.max-sm-size #caseInfo .section-1 .txt .info .widget_social span{
    font-size: 13px;
    margin-left:13px;
    margin-right: 22px;
}

.en #caseInfo .section-1 .txt .info .widget_social span{
    margin-left: 0;
    margin-right: 7px;
}
#ad .inner{
    width:68%;
}
/* #ad .inner img{
    width:100%;
} */
@media (max-width:576px){
    #ad .inner{
        width:90%;
    }
}

.align-middle {
  vertical-align: middle !important;
}

/*20220318 增加線上報修頁面*/
.repairForm{
    overflow: hidden;
}
.repairForm .formRow{
    margin: 0 -22px;
}
.repairForm .formCol{
    padding: 0 22px;
}
@media (max-width:784px){
    .repairForm .formRow{
        margin: 0 -10px;
    }
    .repairForm .formCol{
        padding: 0 10px;
    }
}
.repairForm .addForm{

}
.repairForm .addForm>.form-group{
    display: flex;
}
.repairForm .addForm .addFormLabel{
    width: 100px;
}
.repairForm .addForm .addFormRowBox{
    width: calc(100% - 100px);
}
.repairForm .addForm .addFormRow{
    margin: 0 -15px;
    clear: both;
}
@media (max-width:784px){
    .repairForm .addForm .addFormRow{
        margin: 0 -10px;
    }
}
.repairForm .addForm .addFormCol{
    padding: 0 15px;
}
@media (max-width:784px){
    .repairForm .addForm .addFormCol{
        padding: 0 10px;
    }
}
.repairForm .addForm .addFormSelect{}
@media (max-width:784px){
    .repairForm .addForm .addFormSelect{
        margin-bottom: 10px;
    }
}
.repairForm .addForm .addFormInput{}
.repairForm .repairPorjectCol{
    margin-bottom: 15px;
    border-bottom: 1px solid #dddddd;
}
@media (max-width:784px){
    .repairForm .repairPorjectCol{
        margin-bottom: 0px;
        border-bottom: none;
    }
}
.repairForm .repairPorjectCol .form-group{
    margin-bottom: 0;
    border-bottom: none;
}
@media (max-width:784px){
    .repairForm .repairPorjectCol .form-group{
        margin-bottom: 15px;
        border-bottom: 1px solid #dddddd;
    }
    .repairForm .repairPorjectCol .form-group:hover {
        border-bottom: 1px solid #000;
    }
}
.repairForm .fileRow{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.repairForm .fileRow .fileLabel{
    width: 100px;
}
.repairForm .fileRow .fileInputBox{
    width: 97px;
}
@media (max-width:784px){
    .repairForm .fileRow .fileInputBox{
        width: 80px;
    }
    .repairForm .fileRow .fileInputBox .form-control{
        padding-left: 0;
        padding-right: 0;
        background: transparent;
    }
}
@media (max-width:544px){
    .repairForm .fileRow .fileInputBox{
        width: 70px;
    }
}
.repairForm .fileRow .fileItemBox{
    width: calc(100% - 100px - 97px - 30px - 120px);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
@media (max-width:784px){
    .repairForm .fileRow .fileItemBox{
        width: calc(100% - 100px);
        margin-left: auto;
    }
}
@media (max-width:599px){
    /* .repairForm .fileRow .fileItemBox{
        width: calc(100% - 100px);
        margin-left: auto;
    } */
}
.repairForm .fileRow .fileItemBox .item{
    display: flex;
    align-items: center;
}
.repairForm .fileRow .fileItemBox .item:not(:last-child){
    margin-right: 24px;
}
@media (max-width:784px){
    .repairForm .fileRow .fileItemBox .item:not(:last-child){
        margin-right: 15px;
    }
}
.repairForm .fileRow .fileItemBox .item .text{}
.repairForm .fileRow .fileItemBox .item .deleteBtn{
    width: 15px;
    height: 15px;
    margin-left: 5px;
    border: none;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
}
.repairForm .fileRow .fileItemBox .item .icon{
    width: 10px;
    height: 10px;
    position: relative;
}
.repairForm .fileRow .fileItemBox .item .icon::before,
.repairForm .fileRow .fileItemBox .item .icon::after{
    content: '';
    border-radius: 1px;
    background: #000;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    transition: all 0.4s;
}
.repairForm .fileRow .fileItemBox .item .icon::before{
    width: 13px;
    height: 1px;

}
.repairForm .fileRow .fileItemBox .item .icon::after{
    width: 1px;
    height: 13px;
}
.repairForm .fileRow .fileItemBox .item .deleteBtn:hover .icon::before,
.repairForm .fileRow .fileItemBox .item .deleteBtn:hover .icon::after{
    background: #E50012;
}
.repairForm .fileRow .fileItemNote{
    width: 120px;
    margin-left: 15px;
    margin-right: 15px;
    font-size: 90%;
    color: #e72e25;
}
@media (max-width:784px){
    .repairForm .fileRow .fileItemNote{
        width:110px;
        margin-left: 10px;
        margin-right: 0px;
    }
}
.social img{
    max-width: 100%;
}
.camObj {
    display: inline-block !important;
    cursor: pointer;
    background-color: #101010;
}
.memberCamera .list .item{
    position: relative;
}
.memberCamera .list .item:after {
    content: "";
    background: asset('/static/web/styles/images/295.png') center 40% no-repeat;
    background-size: 32px;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: .6s;
}
.memberCamera .list .item.loaded:after {
    opacity: 0;
    pointer-events: none;
}
.max-lg-size .memberCamera .list .item .camObj {
    width: 100%;
    height: auto;
}
.fancybox-outer .camObj {
    width: 100%;  /*width of parent container*/
    height: 95%; /*height of parent container*/
    object-fit: contain;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.fancybox-skin {
    background: #101010 !important;
}