@charset "UTF-8";
@font-face {
    font-family: "HelveticaNeue";
    src: url("../fonts/HelveticaNeue.woff2") format("woff2"),
        url("../fonts/HelveticaNeue.woff") format("woff");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "HelveticaNeue-light";
    src: url("../fonts/HelveticaNeue-Light.woff2") format("woff2"),
        url("../fonts/HelveticaNeue-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: "HelveticaNeue-Medium";
    src: url("../fonts/HelveticaNeue-medium.woff2") format("woff2"),
        url("../fonts/HelveticaNeue-medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "Helvetica Neue Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue Italic"),
        url("../fonts/HelveticaNeueItalic.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 35 Thin";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 35 Thin"),
        url("../fonts/HelveticaNeue-Thin.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 37 Thin Condensed";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 37 Thin Condensed"),
        url("../fonts/HelveticaNeue-ThinCond.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 37 Thin Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 37 Thin Condensed Oblique"),
        url("../fonts/HelveticaNeue-ThinCondObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 33 Thin Extended Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 33 Thin Extended Oblique"),
        url("../fonts/HelveticaNeue-ThinExtObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 36 Thin Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 36 Thin Italic"),
        url("../fonts/HelveticaNeue-ThinItalic.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 43 Light Extended";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 43 Light Extended"),
        url("../fonts/HelveticaNeue-LightExt.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 27 Ultra Light Condensed";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 27 Ultra Light Condensed"),
        url("../fonts/HelveticaNeue-UltraLigCond.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 23 Ultra Light Extended";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 23 Ultra Light Extended"),
        url("../fonts/HelveticaNeue-UltraLigExt.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 47 Light Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 47 Light Condensed Oblique"),
        url("../fonts/HelveticaNeue-LightCondObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 43 Light Extended Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 43 Light Extended Oblique"),
        url("../fonts/HelveticaNeue-LightExtObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 27 Ultra Light Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 27 Ultra Light Condensed Oblique"),
        url("../fonts/HelveticaNeue-UltraLigCondObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 83 Heavy Extended";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 83 Heavy Extended"),
        url("../fonts/HelveticaNeue-HeavyExt.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 53 Extended";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 53 Extended"),
        url("../fonts/HelveticaNeue-Extended.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 85 Heavy";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 85 Heavy"),
        url("../fonts/HelveticaNeue-Heavy.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 87 Heavy Condensed";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 87 Heavy Condensed"),
        url("../fonts/HelveticaNeue-HeavyCond.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 107 Extra Black Condensed";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 107 Extra Black Condensed"),
        url("../fonts/HelveticaNeue-ExtBlackCond.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 57 Condensed";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 57 Condensed"),
        url("../fonts/HelveticaNeue-Condensed.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 63 Medium Extended";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 63 Medium Extended"),
        url("../fonts/HelveticaNeue-MediumExt.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 55 Roman";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 55 Roman"),
        url("../fonts/HelveticaNeue-Roman.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 83 Heavy Extended Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 83 Heavy Extended Oblique"),
        url("../fonts/HelveticaNeue-HeavyExtObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 87 Heavy Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 87 Heavy Condensed Oblique"),
        url("../fonts/HelveticaNeue-HeavyCondObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 53 Extended Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 53 Extended Oblique"),
        url("../fonts/HelveticaNeue-ExtendedObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 107 Extra Black Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 107 Extra Black Condensed Oblique"),
        url("../fonts/HelveticaNeue-ExtBlackCondObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 57 Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 57 Condensed Oblique"),
        url("../fonts/HelveticaNeue-CondensedObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 86 Heavy Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 86 Heavy Italic"),
        url("../fonts/HelveticaNeue-HeavyItalic.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 63 Medium Extended Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 63 Medium Extended Oblique"),
        url("../fonts/HelveticaNeue-MediumExtObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 73 Bold Extended";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 73 Bold Extended"),
        url("../fonts/HelveticaNeue-BoldExt.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 73 Bold Extended Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 73 Bold Extended Oblique"),
        url("../fonts/HelveticaNeue-BoldExtObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 77 Bold Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 77 Bold Condensed Oblique"),
        url("../fonts/HelveticaNeue-BoldCondObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 93 Black Extended";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 93 Black Extended"),
        url("../fonts/HelveticaNeue-BlackExt.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 95 Black";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 95 Black"),
        url("../fonts/HelveticaNeue-Black.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 93 Black Extended Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 93 Black Extended Oblique"),
        url("../fonts/HelveticaNeue-BlackExtObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica Neue UltraLight";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue UltraLight"),
        url("../fonts/HelveticaNeueUltraLight.woff") format("woff");
}
@font-face {
    font-family: "Helvetica Neue UltraLight Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue UltraLight Italic"),
        url("../fonts/HelveticaNeueUltraLightItal.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 45 Light";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 45 Light"),
        url("../fonts/HelveticaNeue-Light.woff") format("woff");
}
@font-face {
    font-family: "Helvetica Neue Light";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue Light"),
        url("../fonts/HelveticaNeueLight.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 47 Light Condensed";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 47 Light Condensed"),
        url("../fonts/helvetica-47-light-condensed-587ebd7b5a6f6.woff")
            format("woff");
}
@font-face {
    font-family: "Helvetica Neue Light Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue Light Italic"),
        url("../fonts/HelveticaNeueLightItalic.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 46 Light Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 46 Light Italic"),
        url("../fonts/helvetica-46-light-italic-587ebdb0ea724.woff")
            format("woff");
}
@font-face {
    font-family: "Helvetica Neue Medium";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue Medium"),
        url("../fonts/HelveticaNeueMedium.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 67 Medium Condensed";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 67 Medium Condensed"),
        url("../fonts/HelveticaNeue-MediumCond.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 65 Medium";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 65 Medium"),
        url("../fonts/HelveticaNeue-Medium.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 67 Medium Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 67 Medium Condensed Oblique"),
        url("../fonts/HelveticaNeue-MediumCondObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica Neue Bold";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue Bold"),
        url("../fonts/HelveticaNeueBold.woff") format("woff");
}
@font-face {
    font-family: "Helvetica Neue Condensed Bold";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue Condensed Bold"),
        url("../fonts/HelveticaNeueCondensedBold.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 75 Bold Outline";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 75 Bold Outline"),
        url("../fonts/helvetica-75-bold-outline-587ebe00b76ba.woff")
            format("woff");
}
@font-face {
    font-family: "Helvetica Neue Bold Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue Bold Italic"),
        url("../fonts/HelveticaNeueBoldItalic.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 97 Black Condensed";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 97 Black Condensed"),
        url("../fonts/HelveticaNeue-BlackCond.woff") format("woff");
}
@font-face {
    font-family: "Helvetica Neue Condensed Black";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica Neue Condensed Black"),
        url("../fonts/HelveticaNeueCondensedBlack.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 97 Black Condensed Oblique";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 97 Black Condensed Oblique"),
        url("../fonts/HelveticaNeue-BlackCondObl.woff") format("woff");
}
@font-face {
    font-family: "Helvetica 96 Black Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Helvetica 96 Black Italic"),
        url("../fonts/HelveticaBlkIt.woff") format("woff");
}
@font-face {
    font-family: "Open Sans Regular";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans Regular"),
        url("../fonts/OpenSans-Regular.woff") format("woff");
}
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans"),
        url("../fonts/OpenSans-Regular.woff") format("woff");
}
@font-face {
    font-family: "Open Sans Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans Italic"),
        url("../fonts/OpenSans-Italic.woff") format("woff");
}
@font-face {
    font-family: "Open Sans Light";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans Light"),
        url("../fonts/OpenSans-Light.woff") format("woff");
}
@font-face {
    font-family: "Open Sans Light Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans Light Italic"),
        url("../fonts/OpenSans-LightItalic.woff") format("woff");
}
@font-face {
    font-family: "Open Sans SemiBold";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans SemiBold"),
        url("../fonts/OpenSans-SemiBold.woff") format("woff");
}
@font-face {
    font-family: "Open Sans SemiBold Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans SemiBold Italic"),
        url("../fonts/OpenSans-SemiBoldItalic.woff") format("woff");
}
@font-face {
    font-family: "Open Sans Bold";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans Bold"),
        url("../fonts/OpenSans-Bold.woff") format("woff");
}
@font-face {
    font-family: "Open Sans Bold Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans Bold Italic"),
        url("../fonts/OpenSans-BoldItalic.woff") format("woff");
}
@font-face {
    font-family: "Open Sans ExtraBold";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans ExtraBold"),
        url("../fonts/OpenSans-ExtraBold.woff") format("woff");
}
@font-face {
    font-family: "Open Sans ExtraBold Italic";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans ExtraBold Italic"),
        url("../fonts/OpenSans-ExtraBoldItalic.woff") format("woff");
}
@font-face {
    font-family: "Open Sans Light Regular";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans Light Regular"),
        url("../fonts/OpenSans-Light-webfont.woff") format("woff");
}
@font-face {
    font-family: "Open Sans Condensed Bold";
    font-style: normal;
    font-weight: normal;
    src: local("Open Sans Condensed Bold"),
        url("../fonts/OpenSans-CondBold.woff") format("woff");
}
/*--------------------------- Color variations ----------------------*/
/* Medium Layout: 1280px */
/* Tablet Layout: 768px */
/* Mobile Layout: 320px */
/* Wide Mobile Layout: 480px */
/* =================================== */
/*  Basic Style
/* =================================== */
::-moz-selection {
    /* Code for Firefox */
    background-color: #00aeef;
    color: #fff;
}

::selection {
    background-color: #00aeef;
    color: #fff;
}

::-webkit-input-placeholder {
    /* WebKit, Blink, Edge */
    color: #777777;
    font-weight: 300;
}

:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #777777;
    opacity: 1;
    font-weight: 300;
}

::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: #777777;
    opacity: 1;
    font-weight: 300;
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #777777;
    font-weight: 300;
}

::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #777777;
    font-weight: 300;
}

body {
    color: #ffffff;
    font-family: "HelveticaNeue";
    font-size: 14px;
    font-weight: 300;
    line-height: 1.625em;
    position: relative;
    overflow-x: hidden;
}


#load-banner{
    height: calc(calc(100vw - 140px)/21*9);
    width:100vw;
}

.left_banner_ch{
    height: calc(calc(100vw - 140px)/21*9);
    width: 60px;
    margin-right: 17px;
}

.center_banner_ch{
    height: calc(calc(100vw - 140px)/21*9);
    width: calc(100vw - 160px);
    margin-right: 17px;
}

.right_banner_ch{
    height: calc(calc(100vw - 140px)/21*9);
    width:55px;
}

ol,
ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

select {
    display: block;
}

figure {
    margin: 0;
}

a {
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

iframe {
    border: 0;
}

a,
a:focus,
a:hover {
    text-decoration: none;
    outline: 0;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn.focus:active,
.btn:active:focus,
.btn:focus {
    text-decoration: none;
    outline: 0;
}

.card-panel {
    margin: 0;
    padding: 60px;
}

/**
 *  Typography
 *
 **/
.btn i,
.btn-large i,
.btn-floating i,
.btn-large i,
.btn-flat i {
    font-size: 1em;
    line-height: inherit;
}

.gray-bg {
    background: #f9f9ff;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "HelveticaNeue";
    color: #222222;
    line-height: 1.2em !important;
    margin-bottom: 0;
    margin-top: 0;
    /* font-weight: 600; */
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    margin-bottom: 0;
    margin-top: 0;
    font-family: "HelveticaNeue";
    font-weight: 600;
    color: #222222;
}

h1,
.h1 {
    font-size: 36px;
}

h2,
.h2 {
    font-size: 30px;
}

h3,
.h3 {
    font-size: 24px;
}

h4,
.h4 {
    font-size: 18px;
}

h5,
.h5 {
    font-size: 16px;
}

h6,
.h6 {
    font-size: 14px;
    color: #222222;
}

td,
th {
    border-radius: 0px;
}

/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clear::before,
.clear::after {
    content: " ";
    display: table;
}
.clear::after {
    clear: both;
}

.fz-11 {
    font-size: 11px;
}

.fz-12 {
    font-size: 12px;
}

.fz-13 {
    font-size: 13px;
}

.fz-14 {
    font-size: 14px;
}

.fz-15 {
    font-size: 15px;
}

.fz-16 {
    font-size: 16px;
}

.fz-18 {
    font-size: 18px;
}

.fz-30 {
    font-size: 30px;
}

.fz-48 {
    font-size: 48px !important;
}

.fw100 {
    font-weight: 100;
}

.fw300 {
    font-weight: 300;
}

.fw400 {
    font-weight: 400 !important;
}

.fw500 {
    font-weight: 500;
}

.f700 {
    font-weight: 700;
}

.fsi {
    font-style: italic;
}

.mt-10 {
    margin-top: 10px;
}

.mt-15 {
    margin-top: 15px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-25 {
    margin-top: 25px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-35 {
    margin-top: 35px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-60 {
    margin-top: 60px;
}

.mt-70 {
    margin-top: 70px;
}

.mt-80 {
    margin-top: 80px;
}

.mt-100 {
    margin-top: 100px;
}

.mt-120 {
    margin-top: 120px;
}

.mt-150 {
    margin-top: 150px;
}

.ml-0 {
    margin-left: 0 !important;
}

.ml-5 {
    margin-left: 5px !important;
}

.ml-10 {
    margin-left: 10px;
}

.ml-15 {
    margin-left: 15px;
}

.ml-20 {
    margin-left: 20px;
}

.ml-30 {
    margin-left: 30px;
}

.ml-50 {
    margin-left: 50px;
}

.mr-0 {
    margin-right: 0 !important;
}

.mr-5 {
    margin-right: 5px !important;
}

.mr-15 {
    margin-right: 15px;
}

.mr-10 {
    margin-right: 10px;
}

.mr-20 {
    margin-right: 20px;
}

.mr-30 {
    margin-right: 30px;
}

.mr-50 {
    margin-right: 50px;
}

.mb-0 {
    margin-bottom: 0px;
}

.mb-0-i {
    margin-bottom: 0px !important;
}

.mb-5 {
    margin-bottom: 5px;
}

.mb-10 {
    margin-bottom: 10px;
}

.mb-15 {
    margin-bottom: 15px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-25 {
    margin-bottom: 25px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-60 {
    margin-bottom: 60px;
}

.mb-70 {
    margin-bottom: 70px;
}

.mb-80 {
    margin-bottom: 80px;
}

.mb-90 {
    margin-bottom: 90px;
}

.mb-100 {
    margin-bottom: 100px;
}

.pt-0 {
    padding-top: 0px;
}

.pt-10 {
    padding-top: 10px;
}

.pt-15 {
    padding-top: 15px;
}

.pt-20 {
    padding-top: 20px;
}

.pt-25 {
    padding-top: 25px;
}

.pt-30 {
    padding-top: 30px;
}

.pt-40 {
    padding-top: 40px;
}

.pt-50 {
    padding-top: 50px;
}

.pt-60 {
    padding-top: 60px;
}

.pt-70 {
    padding-top: 70px;
}

.pt-80 {
    padding-top: 80px;
}

.pt-90 {
    padding-top: 90px;
}

.pt-100 {
    padding-top: 100px;
}

.pt-120 {
    padding-top: 120px;
}

.pt-150 {
    padding-top: 150px;
}

.pt-170 {
    padding-top: 170px;
}

.pb-0 {
    padding-bottom: 0px;
}

.pb-10 {
    padding-bottom: 10px;
}

.pb-15 {
    padding-bottom: 15px;
}

.pb-20 {
    padding-bottom: 20px;
}

.pb-25 {
    padding-bottom: 25px;
}

.pb-30 {
    padding-bottom: 30px;
}

.pb-40 {
    padding-bottom: 40px;
}

.pb-50 {
    padding-bottom: 50px;
}

.pb-60 {
    padding-bottom: 60px;
}

.pb-70 {
    padding-bottom: 70px;
}

.pb-80 {
    padding-bottom: 80px;
}

.pb-90 {
    padding-bottom: 90px;
}

.pb-100 {
    padding-bottom: 100px;
}

.pb-120 {
    padding-bottom: 120px;
}

.pb-150 {
    padding-bottom: 150px;
}

.pr-30 {
    padding-right: 30px;
}

.pl-30 {
    padding-left: 30px;
}

.pl-90 {
    padding-left: 90px;
}

.p-40 {
    padding: 40px;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.text-italic {
    font-style: italic;
}

.text-white {
    color: #fff;
}

.text-black {
    color: #000;
}

.transition {
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.section-full {
    padding: 100px 0;
}

.section-half {
    padding: 75px 0;
}

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

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

.text-rigth {
    text-align: right;
}

.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
}

.inline-flex {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
}

.flex-grow {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.flex-wrap {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.flex-left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
}

.flex-middle {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
}

.flex-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
}

.flex-top {
    -webkit-align-self: flex-start;
    -moz-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
}

.flex-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
}

.flex-bottom {
    -webkit-align-self: flex-end;
    -moz-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
}

.space-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between;
}

.space-around {
    -ms-flex-pack: distribute;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    justify-content: space-around;
}

.flex-column {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.flex-cell {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.display-table {
    display: table;
}

.light {
    color: #fff;
}

.dark {
    color: #222;
}

.relative {
    position: relative;
}

.frame-close{
    height: 30px;
    width: auto;
    left: 50%;
    margin: auto;
    right: 0px;
}

.overflow-hidden {
    overflow: hidden;
}

.overlay {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.container.fullwidth {
    width: 100%;
}
.container.no-padding {
    padding-left: 0;
    padding-right: 0;
}

.no-padding {
    padding: 0;
}

.section-bg {
    background: #f9fafc;
}

@media (max-width: 767px) {
    .no-flex-xs {
        display: block !important;
    }
}

.row.no-margin {
    margin-left: 0;
    margin-right: 0;
}

.sample-text-area {
    background: #fff;
    padding: 100px 0 70px 0;
}

.sample-text {
    margin-bottom: 0;
}

.text-heading {
    margin-bottom: 30px;
    font-size: 24px;
}

.typo-list {
    margin-bottom: 10px;
}

@media (max-width: 767px) {
    .typo-sec {
        margin-bottom: 30px;
    }
}

@media (max-width: 767px) {
    .element-wrap {
        margin-top: 30px;
    }
}

b,
sup,
sub,
u,
del {
    color: #00aeef;
}

h1 {
    font-size: 36px;
}

h2 {
    font-size: 30px;
}

h3 {
    font-size: 24px;
}

h4 {
    font-size: 18px;
}

h5 {
    font-size: 16px;
}

h6 {
    font-size: 14px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.5em;
}

.typography h1,
.typography h2,
.typography h3,
.typography h4,
.typography h5,
.typography h6 {
    color: #ffffff;
}

.button-area {
    background: #fff;
}
.button-area .border-top-generic {
    padding: 70px 15px;
    border-top: 1px dotted #eee;
}

.button-group-area .genric-btn {
    margin-right: 10px;
    margin-top: 10px;
}
.button-group-area .genric-btn:last-child {
    margin-right: 0;
}

.genric-btn {
    display: inline-block;
    outline: none;
    line-height: 40px;
    padding: 0 30px;
    font-size: 0.8em;
    text-align: center;
    text-decoration: none;
    font-weight: 500;
    cursor: pointer;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.genric-btn:focus {
    outline: none;
}
.genric-btn.e-large {
    padding: 0 40px;
    line-height: 50px;
}
.genric-btn.large {
    line-height: 45px;
}
.genric-btn.medium {
    line-height: 30px;
}
.genric-btn.small {
    line-height: 25px;
}
.genric-btn.radius {
    border-radius: 3px;
}
.genric-btn.circle {
    border-radius: 20px;
}
.genric-btn.arrow {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.genric-btn.arrow span {
    margin-left: 10px;
}
.genric-btn.default {
    color: #222222;
    background: #f9f9ff;
    border: 1px solid transparent;
}
.genric-btn.default:hover {
    border: 1px solid #f9f9ff;
    background: #fff;
}
.genric-btn.default-border {
    border: 1px solid #f9f9ff;
    background: #fff;
}
.genric-btn.default-border:hover {
    color: #222222;
    background: #f9f9ff;
    border: 1px solid transparent;
}
.genric-btn.primary {
    color: #fff;
    background: #00aeef;
    border: 1px solid transparent;
}
.genric-btn.primary:hover {
    color: #00aeef;
    border: 1px solid #00aeef;
    background: #fff;
}
.genric-btn.primary-border {
    color: #00aeef;
    border: 1px solid #00aeef;
    background: #fff;
}
.genric-btn.primary-border:hover {
    color: #fff;
    background: #00aeef;
    border: 1px solid transparent;
}
.genric-btn.success {
    color: #fff;
    background: #4cd3e3;
    border: 1px solid transparent;
}
.genric-btn.success:hover {
    color: #4cd3e3;
    border: 1px solid #4cd3e3;
    background: #fff;
}
.genric-btn.success-border {
    color: #4cd3e3;
    border: 1px solid #4cd3e3;
    background: #fff;
}
.genric-btn.success-border:hover {
    color: #fff;
    background: #4cd3e3;
    border: 1px solid transparent;
}
.genric-btn.info {
    color: #fff;
    background: #38a4ff;
    border: 1px solid transparent;
}
.genric-btn.info:hover {
    color: #38a4ff;
    border: 1px solid #38a4ff;
    background: #fff;
}
.genric-btn.info-border {
    color: #38a4ff;
    border: 1px solid #38a4ff;
    background: #fff;
}
.genric-btn.info-border:hover {
    color: #fff;
    background: #38a4ff;
    border: 1px solid transparent;
}
.genric-btn.warning {
    color: #fff;
    background: #f4e700;
    border: 1px solid transparent;
}
.genric-btn.warning:hover {
    color: #f4e700;
    border: 1px solid #f4e700;
    background: #fff;
}
.genric-btn.warning-border {
    color: #f4e700;
    border: 1px solid #f4e700;
    background: #fff;
}
.genric-btn.warning-border:hover {
    color: #fff;
    background: #f4e700;
    border: 1px solid transparent;
}
.genric-btn.danger {
    color: #fff;
    background: #f44a40;
    border: 1px solid transparent;
}
.genric-btn.danger:hover {
    color: #f44a40;
    border: 1px solid #f44a40;
    background: #fff;
}
.genric-btn.danger-border {
    color: #f44a40;
    border: 1px solid #f44a40;
    background: #fff;
}
.genric-btn.danger-border:hover {
    color: #fff;
    background: #f44a40;
    border: 1px solid transparent;
}
.genric-btn.link {
    color: #222222;
    background: #f9f9ff;
    text-decoration: underline;
    border: 1px solid transparent;
}
.genric-btn.link:hover {
    color: #222222;
    border: 1px solid #f9f9ff;
    background: #fff;
}
.genric-btn.link-border {
    color: #222222;
    border: 1px solid #f9f9ff;
    background: #fff;
    text-decoration: underline;
}
.genric-btn.link-border:hover {
    color: #222222;
    background: #f9f9ff;
    border: 1px solid transparent;
}
.genric-btn.disable {
    color: #222222, 0.3;
    background: #f9f9ff;
    border: 1px solid transparent;
    cursor: not-allowed;
}

.generic-blockquote {
    padding: 30px 50px 30px 30px;
    background: #f9f9ff;
    border-left: 2px solid #00aeef;
}

@media (max-width: 991px) {
    .progress-table-wrap {
        overflow-x: scroll;
    }
}

.progress-table {
    background: #f9f9ff;
    padding: 15px 0px 30px 0px;
    min-width: 800px;
}
.progress-table .serial {
    width: 11.83%;
    padding-left: 30px;
}
.progress-table .country {
    width: 28.07%;
}
.progress-table .visit {
    width: 19.74%;
}
.progress-table .percentage {
    width: 40.36%;
    padding-right: 50px;
}
.progress-table .table-head {
    display: flex;
}
.progress-table .table-head .serial,
.progress-table .table-head .country,
.progress-table .table-head .visit,
.progress-table .table-head .percentage {
    color: #222222;
    line-height: 40px;
    text-transform: uppercase;
    font-weight: 500;
}
.progress-table .table-row {
    padding: 15px 0;
    border-top: 1px solid #edf3fd;
    display: flex;
}
.progress-table .table-row .serial,
.progress-table .table-row .country,
.progress-table .table-row .visit,
.progress-table .table-row .percentage {
    display: flex;
    align-items: center;
}
.progress-table .table-row .country img {
    margin-right: 15px;
}
.progress-table .table-row .percentage .progress {
    width: 80%;
    border-radius: 0px;
    background: transparent;
}
.progress-table .table-row .percentage .progress .progress-bar {
    height: 5px;
    line-height: 5px;
}
.progress-table .table-row .percentage .progress .progress-bar.color-1 {
    background-color: #6382e6;
}
.progress-table .table-row .percentage .progress .progress-bar.color-2 {
    background-color: #e66686;
}
.progress-table .table-row .percentage .progress .progress-bar.color-3 {
    background-color: #f09359;
}
.progress-table .table-row .percentage .progress .progress-bar.color-4 {
    background-color: #73fbaf;
}
.progress-table .table-row .percentage .progress .progress-bar.color-5 {
    background-color: #73fbaf;
}
.progress-table .table-row .percentage .progress .progress-bar.color-6 {
    background-color: #6382e6;
}
.progress-table .table-row .percentage .progress .progress-bar.color-7 {
    background-color: #a367e7;
}
.progress-table .table-row .percentage .progress .progress-bar.color-8 {
    background-color: #e66686;
}

.single-gallery-image {
    margin-top: 30px;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;
    height: 200px;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.single-gallery-image:hover {
    opacity: 0.8;
}

.list-style {
    width: 14px;
    height: 14px;
}

.unordered-list li {
    position: relative;
    padding-left: 30px;
    line-height: 1.82em !important;
}
.unordered-list li:before {
    content: "";
    position: absolute;
    width: 14px;
    height: 14px;
    border: 3px solid #00aeef;
    background: #fff;
    top: 4px;
    left: 0;
    border-radius: 50%;
}

.ordered-list {
    margin-left: 30px;
}
.ordered-list li {
    list-style-type: decimal-leading-zero;
    color: #00aeef;
    font-weight: 500;
    line-height: 1.82em !important;
}
.ordered-list li span {
    font-weight: 300;
    color: #ffffff;
}

.ordered-list-alpha li {
    margin-left: 30px;
    list-style-type: lower-alpha;
    color: #00aeef;
    font-weight: 500;
    line-height: 1.82em !important;
}
.ordered-list-alpha li span {
    font-weight: 300;
    color: #ffffff;
}

.ordered-list-roman li {
    margin-left: 30px;
    list-style-type: lower-roman;
    color: #00aeef;
    font-weight: 500;
    line-height: 1.82em !important;
}
.ordered-list-roman li span {
    font-weight: 300;
    color: #ffffff;
}

.single-input {
    display: block;
    width: 100%;
    line-height: 40px;
    border: none;
    outline: none;
    background: #f9f9ff;
    padding: 0 20px;
}
.single-input:focus {
    outline: none;
}

.input-group-icon {
    position: relative;
}
.input-group-icon .icon {
    position: absolute;
    left: 20px;
    top: 0;
    line-height: 40px;
    z-index: 3;
}
.input-group-icon .icon i {
    color: #797979;
}
.input-group-icon .single-input {
    padding-left: 45px;
}

.single-textarea {
    display: block;
    width: 100%;
    line-height: 40px;
    border: none;
    outline: none;
    background: #f9f9ff;
    padding: 0 20px;
    height: 100px;
    resize: none;
}
.single-textarea:focus {
    outline: none;
}

.single-input-primary {
    display: block;
    width: 100%;
    line-height: 40px;
    border: 1px solid transparent;
    outline: none;
    background: #f9f9ff;
    padding: 0 20px;
}
.single-input-primary:focus {
    outline: none;
    border: 1px solid #00aeef;
}

.single-input-accent {
    display: block;
    width: 100%;
    line-height: 40px;
    border: 1px solid transparent;
    outline: none;
    background: #f9f9ff;
    padding: 0 20px;
}
.single-input-accent:focus {
    outline: none;
    border: 1px solid #eb6b55;
}

.single-input-secondary {
    display: block;
    width: 100%;
    line-height: 40px;
    border: 1px solid transparent;
    outline: none;
    background: #f9f9ff;
    padding: 0 20px;
}
.single-input-secondary:focus {
    outline: none;
    border: 1px solid #f09359;
}

.default-switch {
    width: 35px;
    height: 17px;
    border-radius: 8.5px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.default-switch input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
.default-switch input + label {
    position: absolute;
    top: 1px;
    left: 1px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #00aeef;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
    cursor: pointer;
}
.default-switch input:checked + label {
    left: 19px;
}

.single-element-widget {
    margin-bottom: 30px;
}

.primary-switch {
    width: 35px;
    height: 17px;
    border-radius: 8.5px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.primary-switch input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.primary-switch input + label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.primary-switch input + label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    border-radius: 8.5px;
    cursor: pointer;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}
.primary-switch input + label:after {
    content: "";
    position: absolute;
    top: 1px;
    left: 1px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #fff;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
    cursor: pointer;
}
.primary-switch input:checked + label:after {
    left: 19px;
}
.primary-switch input:checked + label:before {
    background: #00aeef;
}

.confirm-switch {
    width: 35px;
    height: 17px;
    border-radius: 8.5px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.confirm-switch input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.confirm-switch input + label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.confirm-switch input + label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    border-radius: 8.5px;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    cursor: pointer;
}
.confirm-switch input + label:after {
    content: "";
    position: absolute;
    top: 1px;
    left: 1px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #fff;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
    cursor: pointer;
}
.confirm-switch input:checked + label:after {
    left: 19px;
}
.confirm-switch input:checked + label:before {
    background: #4cd3e3;
}

.primary-checkbox {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.primary-checkbox input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.primary-checkbox input + label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    cursor: pointer;
    border: 1px solid #f1f1f1;
}
.primary-checkbox input:checked + label {
    background: url(../img/elements/primary-check.png) no-repeat center
        center/cover;
    border: none;
}

.confirm-checkbox {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.confirm-checkbox input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.confirm-checkbox input + label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    cursor: pointer;
    border: 1px solid #f1f1f1;
}
.confirm-checkbox input:checked + label {
    background: url(../img/elements/success-check.png) no-repeat center
        center/cover;
    border: none;
}

.disabled-checkbox {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.disabled-checkbox input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.disabled-checkbox input + label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    cursor: pointer;
    border: 1px solid #f1f1f1;
}
.disabled-checkbox input:disabled {
    cursor: not-allowed;
    z-index: 3;
}
.disabled-checkbox input:checked + label {
    background: url(../img/elements/disabled-check.png) no-repeat center
        center/cover;
    border: none;
}

.primary-radio {
    width: 16px;
    height: 16px;
    border-radius: 8px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.primary-radio input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.primary-radio input + label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid #f1f1f1;
}
.primary-radio input:checked + label {
    background: url(../img/elements/primary-radio.png) no-repeat center
        center/cover;
    border: none;
}

.confirm-radio {
    width: 16px;
    height: 16px;
    border-radius: 8px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.confirm-radio input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.confirm-radio input + label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid #f1f1f1;
}
.confirm-radio input:checked + label {
    background: url(../img/elements/success-radio.png) no-repeat center
        center/cover;
    border: none;
}

.disabled-radio {
    width: 16px;
    height: 16px;
    border-radius: 8px;
    background: #f9f9ff;
    position: relative;
    cursor: pointer;
}
.disabled-radio input {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.disabled-radio input + label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid #f1f1f1;
}
.disabled-radio input:disabled {
    cursor: not-allowed;
    z-index: 3;
}
.disabled-radio input:checked + label {
    background: url(../img/elements/disabled-radio.png) no-repeat center
        center/cover;
    border: none;
}

.default-select {
    height: 40px;
}
.default-select .nice-select {
    border: none;
    border-radius: 0px;
    height: 40px;
    background: #f9f9ff;
    padding-left: 20px;
    padding-right: 40px;
}
.default-select .nice-select .list {
    margin-top: 0;
    border: none;
    border-radius: 0px;
    box-shadow: none;
    width: 100%;
    padding: 10px 0 10px 0px;
}
.default-select .nice-select .list .option {
    font-weight: 300;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 28px;
    min-height: 28px;
    font-size: 12px;
    padding-left: 20px;
}
.default-select .nice-select .list .option.selected {
    color: #00aeef;
    background: transparent;
}
.default-select .nice-select .list .option:hover {
    color: #00aeef;
    background: transparent;
}
.default-select .current {
    margin-right: 50px;
    font-weight: 300;
}
.default-select .nice-select::after {
    right: 20px;
}

@media (max-width: 991px) {
    .left-align-p p {
        margin-top: 20px;
    }
}

.form-select {
    height: 40px;
    width: 100%;
}
.form-select .nice-select {
    border: none;
    border-radius: 0px;
    height: 40px;
    background: #f9f9ff;
    padding-left: 45px;
    padding-right: 40px;
    width: 100%;
}
.form-select .nice-select .list {
    margin-top: 0;
    border: none;
    border-radius: 0px;
    box-shadow: none;
    width: 100%;
    padding: 10px 0 10px 0px;
}
.form-select .nice-select .list .option {
    font-weight: 300;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 28px;
    min-height: 28px;
    font-size: 12px;
    padding-left: 45px;
}
.form-select .nice-select .list .option.selected {
    color: #00aeef;
    background: transparent;
}
.form-select .nice-select .list .option:hover {
    color: #00aeef;
    background: transparent;
}
.form-select .current {
    margin-right: 50px;
    font-weight: 300;
}
.form-select .nice-select::after {
    right: 20px;
}

.container {
    max-width: 1090px;
}

.cont-homepage {
    max-width: 50%;
}

.alert {
    border-radius: 0 !important;
    border: 0 !important;
}

.alert-danger {
    background-color: #da251c !important;
    border-color: #da251c !important;
    color: #ffffff !important;
}

/* Large Devices, Wide Screens */
@media only screen and (max-width: 1024px) {
    #nav-menu-container {
        right: 20px !important;
        padding: 0 15px 0 15px !important;
        margin-top: 22px !important;
    }

    .banner-area img {
        margin-top: 0 !important;
    }

    .banner-about-area img {
        margin-top: 0 !important;
    }

    .banner-partnership img {
        margin-top: 0 !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 30px !important;
        display: none;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 10px !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 9px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 9px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 55px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 9px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 9px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 355px !important;
        height: 355px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 10px !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 360px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 3rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 1024px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 1024px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 255px !important;
        margin: 0 60px 40px 60px;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 20px;
        right: 40px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 536px !important;
        position: absolute;
        top: -22px !important;
        right: 18px !important;
        /*webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;*/
        overflow: hidden;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 536px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: -15px;
        bottom: 0;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 20px;
        bottom: -20px !important;
        position: absolute;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 15px !important;
        left: -21% !important;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 225px !important;
        padding-left: 20px !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 100% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 8% !important;
        top: 82% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 8% !important;
        top: 94% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 20px;
        height: 20px;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 143px !important;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .partnership-area .mainbar .gallery-our-partner .item a img {
        max-width: 100px !important;
        max-height: 100px !important;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .list-category {
        margin-bottom: 40px;
    }
    .bg-category .list-category a img {
        padding-bottom: 10px;
        width: 100% !important;
        height: auto;
    }
    .bg-category .list-category a .title {
        height: 50px;
    }
    .bg-category .list-category a .title h8 {
        text-decoration: none;
        color: #000;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: 600;
        margin: 5px 0 0 0;
    }
    .bg-category .list-category a p {
        padding-top: 5px;
        height: 45px;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 1px;
        color: #000;
        line-height: 13px;
    }
    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 21px !important;
        float: none !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: 511px !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 0 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-archive .mainbar .timeline > li > .timeline-badge-none a img {
        background: #eff4fa !important;
        border-radius: 50% !important;
    }

    .bg-archive .mainbar .timeline > li > .timeline-badge-none {
        margin-left: -21px !important;
    }

    .bg-express-2 .box-account h5 {
        padding-top: 80px !important;
        font-size: 17px !important;
    }

    .bg-express .box-account h5 {
        padding-top: 80px !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .bg-dashboard .dashboard-area {
        padding: 110px 50px 0 50px !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -5px !important;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d;
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 50px 0 50px !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 20px 34px !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 250px;
        font-size: 12px;
    }

    .bg-donation .donation .box-card-transfer {
        margin: 0 auto;
    }

    .donation .box-nominal {
        max-width: 450px !important;
        margin: 0 auto !important;
    }
    .donation .box-nominal .check-upper {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .check-down {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .comment {
        margin-left: 10px;
    }
    .donation .box-nominal .opsi {
        padding: 0 50px 0 50px !important;
    }
    .donation .box-additional {
        margin: 0 auto !important;
        padding: 20px 20px 0 20px !important;
    }
    .donation .box-additional .btn-submit-donation-3 {
        padding: 7px 60px !important;
    }
    .donation .box-card-transfer .form-row .form-group {
        margin-bottom: 20px !important;
    }
    .donation
        .box-card-transfer
        .form-row
        .form-group
        ::-webkit-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-moz-placeholder {
        /* Firefox 18- */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group ::-moz-placeholder {
        /* Firefox 19+ */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-ms-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group .form-control {
        padding: 10px 15px 0 15px !important;
        font-size: 14px !important;
    }
    .donation .box-card-transfer .form-row .form-group .break-it {
        margin-left: 0 !important;
        margin-top: 10px !important;
    }
    .donation .donation-table {
        padding: 0 10px;
        background: #fff;
        margin: 0 35px !important;
        max-width: 952px !important;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        position: relative;
        height: 325px;
    }
    .donation .donation-table .table-responsive .table {
        padding: 0 5px;
        border-spacing: 10px;
        border-collapse: separate !important;
        background: transparent;
        position: absolute;
        top: -30px;
        left: 0;
        max-width: 1056px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .table-hover
        > tbody
        > tr.select-row:hover
        > td,
    .donation .donation-table .table-responsive .table .select-row > td {
        background: transparent;
    }
    .donation .donation-table .table-responsive .table thead {
        width: 1024px;
    }
    .donation .donation-table .table-responsive .table thead th {
        overflow: hidden;
        vertical-align: middle !important;
        border-bottom: 0 !important;
        border-top: 0 !important;
        color: #000;
        background: #f4f4f4;
        border-radius: 8px;
        padding: 8px 10px !important;
        font-size: 15px;
    }
    .donation .donation-table .table-responsive .table thead .head {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .donation .donation-table .table-responsive .table thead .head:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: 5px;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d !important;
        margin: 0 5px;
        width: 90%;
    }
    .donation .donation-table .table-responsive .table thead .head-banging {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
        width: 60px !important;
        font-size: 12px;
        line-height: 15px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        thead
        .head-banging:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: 5px;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d !important;
        margin: 0 5px;
        width: 80%;
    }
    .donation .donation-table .table-responsive .table thead .ket1 {
        width: 243px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket2 {
        width: 110px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket3 {
        width: 100px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket4 {
        width: 80px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket5 {
        width: 60px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket6 {
        width: 50px !important;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-moz-scrollbar {
        width: 5px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-moz-scrollbar-track {
        background: #ccc;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-webkit-scrollbar {
        width: 5px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-webkit-scrollbar-track {
        background: #ccc;
    }
    .donation .donation-table .table-responsive .table tbody {
        left: 4px !important;
        overflow-y: scroll;
        height: 275px;
        width: 937px !important;
        position: absolute;
    }
    .donation .donation-table .table-responsive .table tbody tr {
        width: 100%;
        display: inline-table;
        margin: -7px 0 !important;
    }
    .donation .donation-table .table-responsive .table tbody tr td {
        background: #fff;
        border: solid 1px #c9c9c9;
        border-radius: 5px;
        padding: 8px 10px !important;
        color: #000;
        font-weight: 600;
    }
    .donation .donation-table .table-responsive .table tbody tr .column1 {
        width: 310px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column2 {
        width: 130px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column3 {
        width: 165px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column4 {
        width: 90px;
    }
    .donation .donation-table .table-responsive .table tbody tr .done {
        color: #09ae5d !important;
        width: 90px;
    }
    .donation .donation-table .table-responsive .table tbody tr .upload {
        text-align: center;
        background: #f4f4f4;
        color: #c7c7c7;
        width: 50px;
    }
    .donation .donation-table .table-responsive .table tbody tr .upload span {
        font-weight: 300 !important;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        tbody
        tr
        .upload
        .btn-file {
        position: relative;
        overflow: hidden;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        tbody
        tr
        .upload
        .btn-file
        input[type="file"] {
        position: absolute;
        padding: 0 !important;
        margin: 0 !important;
        top: -10px;
        right: -15px;
        width: 80px;
        height: 40px;
        /*min-width: 100%;
      min-height: 100%;*/
        font-size: 14px !important;
        text-align: left;
        filter: alpha(opacity=0);
        opacity: 0;
        outline: none;
        background: white;
        cursor: inherit;
        display: block;
    }
}
/* Medium Devices, Desktops */
@media only screen and (max-width: 992px) {
    #nav-menu-container {
        padding: 0 15px 0 15px !important;
        right: 20px !important;
        margin-top: 22px !important;
    }

    .banner-area img {
        margin-top: 0 !important;
    }

    .banner-about-area img {
        margin-top: 0 !important;
    }

    .banner-partnership img {
        margin-top: 0 !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 30px !important;
        display: none !important;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 10px !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 9px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 9px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 9px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 9px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 355px !important;
        height: 355px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 10px !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 360px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 3rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 992px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 992px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 255px !important;
        margin: 0 60px 40px 60px;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 20px;
        right: 40px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 514px !important;
        position: absolute;
        top: -20px !important;
        right: 18px !important;
        /*webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;*/
        overflow: hidden;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 554px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: -15px;
        bottom: 0;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 20px;
        bottom: -10px !important;
        position: absolute;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 15px !important;
        left: -21% !important;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 225px !important;
        padding-left: 20px !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 100% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 8% !important;
        top: 82% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 8% !important;
        top: 94% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 20px;
        height: 20px;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 143px !important;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .partnership-area .mainbar .gallery-our-partner .item a img {
        max-width: 100px !important;
        max-height: 100px !important;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .list-category {
        margin-bottom: 40px;
    }
    .bg-category .list-category a img {
        padding-bottom: 10px;
        width: 100% !important;
        height: auto;
    }
    .bg-category .list-category a .title {
        height: 50px;
    }
    .bg-category .list-category a .title h8 {
        text-decoration: none;
        color: #000;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: 600;
        margin: 5px 0 0 0;
    }
    .bg-category .list-category a p {
        padding-top: 5px;
        height: 45px;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 1px;
        color: #000;
        line-height: 13px;
    }
    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 23px !important;
        float: none !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: 511px !important;
    }

    .bg-gallery .videos h4 {
        font-size: 18px !important;
    }

    .bg-gallery .list-gallery a img {
        width: 100% !important;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 12px !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 10px !important;
        padding-top: 10px !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 0 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-archive .mainbar .timeline > li > .timeline-badge-none a img {
        background: #eff4fa !important;
        border-radius: 50% !important;
    }

    .bg-archive .mainbar .timeline > li > .timeline-badge-none {
        margin-left: -21px !important;
    }

    .bg-express-2 .box-account h5 {
        padding-top: 80px !important;
        font-size: 17px !important;
    }

    .bg-express .box-account h5 {
        padding-top: 80px !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .bg-dashboard .dashboard-area {
        padding: 110px 50px 0 50px !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -5px !important;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d;
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 50px 0 50px !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 20px 20px !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 250px;
        font-size: 12px;
    }

    .donation .donation-table {
        padding: 0 10px;
        background: #fff;
        margin: 0 20px !important;
        max-width: 952px !important;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        position: relative;
        height: 325px;
    }
    .donation .donation-table .table-responsive .table {
        padding: 0 5px;
        border-spacing: 10px;
        border-collapse: separate !important;
        background: transparent;
        position: absolute;
        top: -30px;
        left: 0;
        max-width: 1056px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .table-hover
        > tbody
        > tr.select-row:hover
        > td,
    .donation .donation-table .table-responsive .table .select-row > td {
        background: transparent;
    }
    .donation .donation-table .table-responsive .table thead {
        width: 1024px;
    }
    .donation .donation-table .table-responsive .table thead th {
        overflow: hidden;
        vertical-align: middle !important;
        border-bottom: 0 !important;
        border-top: 0 !important;
        color: #000;
        background: #f4f4f4;
        border-radius: 8px;
        padding: 8px 10px !important;
        font-size: 15px;
    }
    .donation .donation-table .table-responsive .table thead .head {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .donation .donation-table .table-responsive .table thead .head:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: 5px;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d !important;
        margin: 0 5px;
        width: 90%;
    }
    .donation .donation-table .table-responsive .table thead .head-banging {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
        width: 60px !important;
        font-size: 12px;
        line-height: 15px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        thead
        .head-banging:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: 5px;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d !important;
        margin: 0 5px;
        width: 80%;
    }
    .donation .donation-table .table-responsive .table thead .ket1 {
        width: 243px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket2 {
        width: 110px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket3 {
        width: 100px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket4 {
        width: 80px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket5 {
        width: 60px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket6 {
        width: 50px !important;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-moz-scrollbar {
        width: 5px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-moz-scrollbar-track {
        background: #ccc;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-webkit-scrollbar {
        width: 5px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-webkit-scrollbar-track {
        background: #ccc;
    }
    .donation .donation-table .table-responsive .table tbody {
        left: 4px !important;
        overflow-y: scroll;
        height: 275px;
        width: 937px !important;
        position: absolute;
    }
    .donation .donation-table .table-responsive .table tbody tr {
        width: 100%;
        display: inline-table;
        margin: -7px 0 !important;
    }
    .donation .donation-table .table-responsive .table tbody tr td {
        background: #fff;
        border: solid 1px #c9c9c9;
        border-radius: 5px;
        padding: 8px 10px !important;
        color: #000;
        font-weight: 600;
    }
    .donation .donation-table .table-responsive .table tbody tr .column1 {
        width: 310px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column2 {
        width: 130px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column3 {
        width: 165px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column4 {
        width: 90px;
    }
    .donation .donation-table .table-responsive .table tbody tr .done {
        color: #09ae5d !important;
        width: 90px;
    }
    .donation .donation-table .table-responsive .table tbody tr .upload {
        text-align: center;
        background: #f4f4f4;
        color: #c7c7c7;
        width: 50px;
    }
    .donation .donation-table .table-responsive .table tbody tr .upload span {
        font-weight: 300 !important;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        tbody
        tr
        .upload
        .btn-file {
        position: relative;
        overflow: hidden;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        tbody
        tr
        .upload
        .btn-file
        input[type="file"] {
        position: absolute;
        padding: 0 !important;
        margin: 0 !important;
        top: -10px;
        right: -15px;
        width: 80px;
        height: 40px;
        /*min-width: 100%;
      min-height: 100%;*/
        font-size: 14px !important;
        text-align: left;
        filter: alpha(opacity=0);
        opacity: 0;
        outline: none;
        background: white;
        cursor: inherit;
        display: block;
    }

    .bg-donation .donation .box-card-transfer {
        margin: 0 auto;
    }
}
/* Small Devices, Tablets */
@media only screen and (max-width: 768px) {
    .banner-area img {
        margin-top: 70px !important;
    }

    .banner-about-area img {
        margin-top: 70px !important;
    }

    .banner-partnership img {
        margin-top: 70px !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 20px;
        display: inline-block !important;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 10px !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 9px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 9px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 9px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 9px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 265px !important;
        height: 265px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 10px !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 330px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 3rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 768px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 768px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 195px !important;
        margin: 0 60px 40px 60px;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 20px;
        right: 40px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 380px !important;
        position: absolute;
        top: -10px !important;
        right: 15px !important;
        /*webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;*/
        overflow: hidden;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 380px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: -15px;
        bottom: 0;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 20px;
        position: absolute;
        bottom: -0 !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 10px !important;
        left: -19%;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 170px !important;
        padding-left: 0 !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 100% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 3% !important;
        top: 82% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 3% !important;
        top: 96% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 20px;
        height: 20px;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px !important;
        padding: 0 10px 10px 10px !important;
    }
    .testimony-area
        .item-testimony
        .testimony-slider
        .col-xs-12
        .thumbnail
        img {
        display: block !important;
        margin: auto !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 145px !important;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .partnership-area .mainbar .gallery-our-partner .item a img {
        max-width: 100px !important;
        max-height: 100px !important;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .list-category {
        margin-bottom: 40px;
    }
    .bg-category .list-category a img {
        padding-bottom: 10px;
        width: 100% !important;
        height: auto;
    }
    .bg-category .list-category a .title {
        height: 50px;
    }
    .bg-category .list-category a .title h8 {
        text-decoration: none;
        color: #000;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: 600;
        margin: 5px 0 0 0;
    }
    .bg-category .list-category a p {
        padding-top: 5px;
        height: 45px;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 1px;
        color: #000;
        line-height: 13px;
    }
    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 21px !important;
        float: none !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: 415px !important;
    }

    .bg-gallery .videos h4 {
        font-size: 30px !important;
    }

    .bg-gallery .list-gallery a img {
        width: 100% !important;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 31px !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 18px !important;
        padding-top: 10px !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 40px 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-express .box-account {
        padding-bottom: 0 !important;
        padding: 0 30px !important;
    }
    .bg-express .box-account h5 {
        padding-top: 40px !important;
        font-size: 12px !important;
    }

    .bg-express .express-subtitle h5 {
        margin-top: 20px !important;
    }

    .bg-express-2 .box-account h5 {
        padding-top: 60px !important;
        font-size: 11px !important;
    }

    .bg-express .box-account h5 {
        padding-top: 60px !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .dashboard-area ul li .item {
        border-right: 0 !important;
        line-height: 18px;
        padding-right: 0;
    }

    #mobile-nav ul li input[type="text"] {
        position: absolute !important;
        top: 8px !important;
        right: 112px !important;
    }
    #mobile-nav ul li a {
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        overflow: hidden;
        padding: 10px 22px 10px 15px;
        position: relative;
        text-decoration: none;
        width: 100%;
        display: block;
        outline: none;
        font-weight: 700;
    }
    #mobile-nav ul li a img {
        width: 20px;
        height: 20px;
    }
    #mobile-nav ul li .fa-user-o {
        display: none;
    }
    #mobile-nav ul li .notifications .fa {
        display: none;
    }
    #mobile-nav ul li .notifications span.num {
        padding-right: 5px !important;
    }

    .bg-dashboard .dashboard-area {
        padding: 90px 0 0 0 !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -5px !important;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d;
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 0 0 0 !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 20px 20px !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 250px;
        font-size: 12px;
    }

    .bg-donation .donation .box-card-transfer {
        margin: 0 auto;
    }

    .donation .box-nominal {
        max-width: 450px !important;
        margin: 0 auto !important;
    }
    .donation .box-nominal .check-upper {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .check-down {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .comment {
        margin-left: 10px;
    }
    .donation .box-nominal .opsi {
        padding: 5px !important;
    }
    .donation .box-additional {
        max-width: 450px !important;
        margin: 0 auto !important;
        padding: 20px 20px 0 20px !important;
    }
    .donation .box-additional .col-lg-7 {
        padding: 0 10px !important;
    }
    .donation .box-additional .col-lg-5 {
        padding: 0 10px !important;
    }
    .donation .box-additional .btn-submit-donation-3 {
        padding: 7px 180px !important;
    }
    .donation .box-card-transfer .form-row .form-group {
        margin-bottom: 20px !important;
    }
    .donation
        .box-card-transfer
        .form-row
        .form-group
        ::-webkit-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-moz-placeholder {
        /* Firefox 18- */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group ::-moz-placeholder {
        /* Firefox 19+ */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-ms-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group .form-control {
        padding: 10px 15px 0 15px !important;
        font-size: 14px !important;
    }
    .donation .box-card-transfer .form-row .form-group .break-it {
        margin-left: 0 !important;
        margin-top: 10px !important;
    }
    .donation .donation-table {
        padding: 0 10px;
        background: #fff;
        margin: 0 20px !important;
        max-width: 737px !important;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        position: relative;
        height: 325px;
    }
    .donation .donation-table .table-responsive .table {
        padding: 0 5px;
        border-spacing: 10px;
        border-collapse: separate !important;
        background: transparent;
        position: absolute;
        top: -30px;
        left: 0;
        max-width: 1056px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .table-hover
        > tbody
        > tr.select-row:hover
        > td,
    .donation .donation-table .table-responsive .table .select-row > td {
        background: transparent;
    }
    .donation .donation-table .table-responsive .table thead {
        width: 1024px;
    }
    .donation .donation-table .table-responsive .table thead th {
        overflow: hidden;
        vertical-align: middle !important;
        border-bottom: 0 !important;
        border-top: 0 !important;
        color: #000;
        background: #f4f4f4;
        border-radius: 8px;
        padding: 8px 10px !important;
        font-size: 15px;
    }
    .donation .donation-table .table-responsive .table thead .head {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .donation .donation-table .table-responsive .table thead .head:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: 5px;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d !important;
        margin: 0 5px;
        width: 90%;
    }
    .donation .donation-table .table-responsive .table thead .head-banging {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
        width: 60px !important;
        font-size: 12px;
        line-height: 15px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        thead
        .head-banging:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: 5px;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d !important;
        margin: 0 5px;
        width: 80%;
    }
    .donation .donation-table .table-responsive .table thead .ket1 {
        width: 185px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket2 {
        width: 110px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket3 {
        width: 100px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket4 {
        width: 80px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket5 {
        width: 60px !important;
    }
    .donation .donation-table .table-responsive .table thead .ket6 {
        width: 50px !important;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-moz-scrollbar {
        width: 5px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-moz-scrollbar-track {
        background: #ccc;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-webkit-scrollbar {
        width: 5px;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        .scroll1::-webkit-scrollbar-track {
        background: #ccc;
    }
    .donation .donation-table .table-responsive .table tbody {
        left: 4px !important;
        overflow-y: scroll;
        height: 275px;
        width: 720px !important;
        position: absolute;
    }
    .donation .donation-table .table-responsive .table tbody tr {
        width: 100%;
        display: inline-table;
        margin: -7px 0 !important;
    }
    .donation .donation-table .table-responsive .table tbody tr td {
        background: #fff;
        border: solid 1px #c9c9c9;
        border-radius: 5px;
        padding: 8px 10px !important;
        color: #000;
        font-weight: 600;
    }
    .donation .donation-table .table-responsive .table tbody tr .column1 {
        width: 310px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column2 {
        width: 130px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column3 {
        width: 165px !important;
    }
    .donation .donation-table .table-responsive .table tbody tr .column4 {
        width: 90px;
    }
    .donation .donation-table .table-responsive .table tbody tr .done {
        color: #09ae5d !important;
        width: 90px;
    }
    .donation .donation-table .table-responsive .table tbody tr .upload {
        text-align: center;
        background: #f4f4f4;
        color: #c7c7c7;
        width: 50px;
    }
    .donation .donation-table .table-responsive .table tbody tr .upload span {
        font-weight: 300 !important;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        tbody
        tr
        .upload
        .btn-file {
        position: relative;
        overflow: hidden;
    }
    .donation
        .donation-table
        .table-responsive
        .table
        tbody
        tr
        .upload
        .btn-file
        input[type="file"] {
        position: absolute;
        padding: 0 !important;
        margin: 0 !important;
        top: -10px;
        right: -15px;
        width: 80px;
        height: 40px;
        /*min-width: 100%;
      min-height: 100%;*/
        font-size: 14px !important;
        text-align: left;
        filter: alpha(opacity=0);
        opacity: 0;
        outline: none;
        background: white;
        cursor: inherit;
        display: block;
    }

    .bg-register .section-gap-register {
        padding: 100px 0 100px 0 !important;
    }
    .bg-register .register .register-rebirth {
        padding: 0 100px !important;
    }
    .bg-register .register .box .sub-title {
        padding-top: 20px !important;
    }
    .bg-register .register .box form .form-control {
        font-size: 14px !important;
    }
    .bg-register .register .box form label.form-check-label {
        font-size: 14px !important;
    }

    .search {
        padding-top: 100px !important;
    }
    .search .page-content {
        padding-top: 0;
        padding-bottom: 40px;
    }
    .search .page-content h3 {
        text-transform: uppercase;
        padding-top: 0;
        font-family: Helvetica-Compressed, "Helvetica Neue", Helvetica, Arial,
            sans-serif;
        font-size: 16px !important;
        color: #000;
        margin: 0 0 0 10px;
        line-height: 0.9;
    }
    .search .page-content ul.updates {
        list-style: none;
        margin: 0;
        padding: 0;
        padding-bottom: 30px;
    }
    .search .page-content ul.updates li {
        border-bottom: 1px solid #eee;
        display: block;
    }
    .search .page-content ul.updates li a {
        color: #716e6e;
        font-size: 16px !important;
        padding: 10px;
        display: block;
        -webkit-transition: 0.2s all ease;
        -o-transition: 0.2s all ease;
        transition: 0.2s all ease;
    }
    .search .page-content ul.updates li a:hover {
        padding-left: 20px;
        background-color: #03ad57;
        text-decoration: none;
        color: #000;
    }
    .search .page-content ul.updates li a span {
        display: block;
        font-size: 13px;
    }
}
/* Small Devices, Tablets */
@media only screen and (max-width: 640px) {
    .banner-area img {
        margin-top: 70px !important;
    }

    .banner-about-area img {
        margin-top: 70px !important;
    }

    .banner-partnership img {
        margin-top: 70px !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 20px;
        display: inline-block !important;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 14px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 10px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 334px !important;
        height: 334px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title {
        background: none !important;
        text-align: center !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title h6 {
        max-width: 100% !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 920px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 640px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 640px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 400px !important;
        margin: 0 20px 40px 20px !important;
        border-radius: 10px;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 0 !important;
        right: 0 !important;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 595px !important;
        position: absolute;
        top: 480px !important;
        right: 0 !important;
        /*webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;*/
        overflow: hidden;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 595px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: 1px !important;
        bottom: 0 !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 0 !important;
        position: absolute;
        bottom: -420px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 0 !important;
        left: 0% !important;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 400px !important;
        padding-left: 0;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 130% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 1% !important;
        top: 86% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 1% !important;
        top: 94% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 30px !important;
        height: 30px !important;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px !important;
        padding: 0 10px 10px 10px !important;
    }
    .testimony-area
        .item-testimony
        .testimony-slider
        .col-xs-12
        .thumbnail
        img {
        display: block !important;
        margin: auto !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 182px !important;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .contact-area {
        background: transparent;
        margin: 0 15px !important;
    }
    .contact-area .bg-contact {
        background: url(../img/misc/bg-footer-top-2-mobile.png) no-repeat !important;
    }
    .contact-area .bg-contact .col-md-6 {
        padding: 0 5px;
    }
    .contact-area .bg-contact .address {
        padding: 15px 10px !important;
        margin-top: 10px;
    }
    .contact-area .bg-contact .address h6 {
        color: #09ae5d;
        font-weight: 500;
    }
    .contact-area .bg-contact .address p {
        color: #000;
        font-size: 14px !important;
        font-weight: 500;
        margin-bottom: 0;
    }
    .contact-area .bg-contact .address p span {
        padding-left: 10px;
    }
    .contact-area .bg-contact .address img {
        width: 15x;
        height: 15px;
    }
    .contact-area .bg-contact .sub-menu {
        padding: 10px 0 !important;
        margin-left: -8px;
    }
    .contact-area .bg-contact .sub-menu h5 {
        color: #09ae5d;
        font-weight: 500;
        margin: 0 10px 0 8px;
        text-align: center;
    }
    .contact-area .bg-contact .sub-menu hr {
        margin-top: 5px;
        margin-bottom: 5px;
        margin-left: 8px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li {
        border-right: 1px solid #c6c6c6;
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li a {
        margin: 0 10px 0 8px;
        color: #000;
        font-size: 13px !important;
    }
    .contact-area .bg-contact .sub-menu .sub-menu-item li:last-child {
        border-right: 0px;
    }
    .contact-area .bg-contact .sub-menu ul {
        text-align: center !important;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li {
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a {
        margin: 0 5px 0 8px;
        color: #000;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img {
        max-width: 30px;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img.gp {
        max-width: 125px;
        height: 30px;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .list-category {
        margin-bottom: 40px;
    }
    .bg-category .list-category a img {
        padding-bottom: 10px;
        width: 100% !important;
        height: auto;
    }
    .bg-category .list-category a .title {
        height: 50px;
    }
    .bg-category .list-category a .title h8 {
        text-decoration: none;
        color: #000;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: 600;
        margin: 5px 0 0 0;
    }
    .bg-category .list-category a p {
        padding-top: 5px;
        height: 45px;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 1px;
        color: #000;
        line-height: 13px;
    }
    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 21px !important;
        float: none !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: 315px !important;
    }

    .bg-gallery .videos h4 {
        font-size: 18px !important;
    }

    .bg-gallery .list-gallery a img {
        width: 100% !important;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 24px !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 14px !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 0 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-express .fancy span:before,
    .bg-express .fancy span:after {
        content: "";
        position: absolute;
        height: 5px;
        border-top: 1px solid rgba(0, 0, 0, 0.1);
        top: 10px;
        width: 200px;
    }
    .bg-express .fancy span:after {
        left: 115% !important;
        margin-left: 0;
    }

    .bg-express .box-account {
        padding-bottom: 0 !important;
        padding: 0 30px !important;
    }
    .bg-express .box-account h5 {
        padding-top: 40px !important;
        font-size: 12px !important;
    }

    .bg-express .express-subtitle h5 {
        margin-top: 20px !important;
    }

    .bg-express-2 .box-account h5 {
        padding-top: 45px !important;
        font-size: 11px !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .dashboard-area ul li .item {
        border-right: 0 !important;
        line-height: 18px;
        padding-right: 0;
    }

    #mobile-nav ul li input[type="text"] {
        position: absolute !important;
        top: 8px !important;
        right: 112px !important;
    }
    #mobile-nav ul li a {
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        overflow: hidden;
        padding: 10px 22px 10px 15px;
        position: relative;
        text-decoration: none;
        width: 100%;
        display: block;
        outline: none;
        font-weight: 700;
    }
    #mobile-nav ul li a img {
        width: 20px;
        height: 20px;
    }
    #mobile-nav ul li .fa-user-o {
        display: none;
    }
    #mobile-nav ul li .notifications .fa {
        display: none;
    }
    #mobile-nav ul li .notifications span.num {
        padding-right: 5px !important;
    }

    .bg-dashboard .dashboard-area {
        padding: 90px 0 0 0 !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area hr {
        margin-bottom: 2em !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -25px !important;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d;
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 0 0 0 !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .donation-table {
        display: none;
    }
    .bg-dashboard .table-2 {
        display: block !important;
        /*@media (max-width: 576px) {
        .container-table100 {
            padding-left: 15px;
            padding-right: 15px;
        }
    }*/
    }
    .bg-dashboard .table-2 .limiter {
        width: 100%;
        margin: 0 auto;
    }
    .bg-dashboard .table-2 .container-table100 {
        width: 100%;
        min-height: 80vh !important;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        padding: 33px 30px !important;
    }
    .bg-dashboard .table-2 .wrap-table100 {
        width: 1170px;
    }
    .bg-dashboard .table-2 table {
        border-spacing: 1;
        border-collapse: collapse;
        background: transparent;
        overflow: hidden;
        width: 100%;
        margin: 0 auto;
        position: block;
    }
    .bg-dashboard .table-2 table * {
        position: relative;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        padding-left: 8px;
    }
    .bg-dashboard .table-2 table thead tr {
        background: transparent;
    }
    .bg-dashboard .table-2 table tbody tr:last-child {
        border: 0;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        text-align: left;
    }
    .bg-dashboard .table-2 table td.l,
    .bg-dashboard .table-2 table th.l {
        text-align: left !important;
    }
    .bg-dashboard .table-2 table td.c,
    .bg-dashboard .table-2 table th.c {
        text-align: center;
    }
    .bg-dashboard .table-2 table td.r,
    .bg-dashboard .table-2 table th.r {
        text-align: center;
    }
    .bg-dashboard .table-2 .table100-head th {
        font-size: 14px;
        color: #11110f;
        line-height: 1.2;
        font-weight: 600;
    }
    .bg-dashboard .table-2 .table100-head .columnheader1 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader2 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader3 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader4 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader5 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader6 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 tbody tr:nth-child(even) {
        background-color: transparent !important;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 15px;
        color: #808080;
        line-height: 1.2;
        font-weight: unset;
    }
    .bg-dashboard .table-2 tbody tr:hover {
        color: #555555;
        background-color: #f5f5f5;
        cursor: pointer;
    }
    .bg-dashboard .table-2 .column1 {
        width: 100% !important;
        padding-left: 140px;
    }
    .bg-dashboard .table-2 .column2 {
        width: 270px !important;
    }
    .bg-dashboard .table-2 .column3 {
        width: 245px !important;
    }
    .bg-dashboard .table-2 .column4 {
        width: 110px;
        text-align: left !important;
    }
    .bg-dashboard .table-2 .column5 {
        width: 170px !important;
        text-align: left !important;
        color: #09ae5d !important;
    }
    .bg-dashboard .table-2 .column6 {
        width: 222px !important;
        text-align: left !important;
        padding-right: 62px;
    }
    .bg-dashboard .table-2 .column6 .btn-file {
        background-color: #f4f4f4;
        border-color: #f4f4f4;
        color: #c7c7c7;
    }
}
@media only screen and (max-width: 640px) and (max-width: 640px) {
    .bg-dashboard .table-2 table {
        display: block;
        margin-top: -20px !important;
    }
    .bg-dashboard .table-2 .pagination {
        padding-left: 88px !important;
        text-align: center !important;
        display: flex;
        justify-content: center;
    }
    .bg-dashboard .table-2 .pagination .page-link:focus {
        box-shadow: none;
    }
    .bg-dashboard .table-2 .pagination > .page-item > .page-link,
    .bg-dashboard .table-2 .pagination > .page-item > span {
        border: 0;
        border-radius: 30px !important;
        transition: all 0.3s;
        padding: 0 11px !important;
        margin: 0 3px !important;
        min-width: 30px;
        height: 30px;
        line-height: 30px;
        color: #999;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        background: 0 0;
        text-align: center;
    }
    .bg-dashboard .table-2 .pagination.pagination-info > .page-item.active > a,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:hover,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:hover {
        color: #fff;
        background-color: #09ae5d;
        border-color: #09ae5d;
        box-shadow: 0 4px 5px 0 rgba(0, 188, 212, 0.14),
            0 1px 10px 0 rgba(0, 188, 212, 0.12),
            0 2px 4px -1px rgba(0, 188, 212, 0.2);
    }
    .bg-dashboard .table-2 table > *,
    .bg-dashboard .table-2 table tr,
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        display: block;
    }
    .bg-dashboard .table-2 table thead {
        display: none;
    }
    .bg-dashboard .table-2 table tbody tr {
        height: auto;
        padding: 20px 0;
    }
    .bg-dashboard .table-2 table tbody tr td {
        padding-left: 50% !important;
        margin-bottom: 10px;
    }
    .bg-dashboard .table-2 table tbody tr td:last-child {
        margin-bottom: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:before {
        font-size: 14px;
        color: #000;
        line-height: 1.2;
        font-weight: unset;
        position: absolute;
        width: 40%;
        left: 0;
        top: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(1):before {
        content: "JENIS DONASI";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(2):before {
        content: "NOMINAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(3):before {
        content: "TANGGAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(4):before {
        content: "WAKTU";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(5):before {
        content: "STATUS";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(6):before {
        content: "UNGGAH BUKTI";
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6 {
        text-align: left !important;
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6,
    .bg-dashboard .table-2 .column1,
    .bg-dashboard .table-2 .column2,
    .bg-dashboard .table-2 .column3 {
        width: 100%;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 14px;
    }
}
@media only screen and (max-width: 640px) {
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 0 auto !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 403px !important;
        font-size: 12px;
    }

    .bg-donation .donation {
        padding-top: 100px !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-8 {
        padding-right: 15px !important;
        border-right: 0 !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-4 {
        padding-left: 15px !important;
    }
    .bg-donation .donation .box-card-transfer .btn-submit-donation-2 {
        padding: 5px 15px !important;
    }

    .donation .box-nominal {
        max-width: 450px !important;
        margin: 0 auto !important;
    }
    .donation .box-nominal .check-upper {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .check-down {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .comment {
        margin-left: 10px;
    }
    .donation .box-nominal .opsi {
        padding: 5px !important;
    }
    .donation .box-additional {
        max-width: 450px !important;
        margin: 0 auto !important;
        padding: 20px 20px 0 20px !important;
    }
    .donation .box-additional .col-lg-7 {
        padding: 0 10px !important;
    }
    .donation .box-additional .col-lg-5 {
        padding: 0 10px !important;
    }
    .donation .box-additional .btn-submit-donation-3 {
        padding: 7px 180px !important;
    }
    .donation .box-card-transfer .form-row .form-group {
        margin-bottom: 20px !important;
    }
    .donation
        .box-card-transfer
        .form-row
        .form-group
        ::-webkit-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-moz-placeholder {
        /* Firefox 18- */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group ::-moz-placeholder {
        /* Firefox 19+ */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-ms-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group .form-control {
        padding: 10px 15px 0 15px !important;
        font-size: 14px !important;
    }
    .donation .box-card-transfer .form-row .form-group .break-it {
        margin-left: 0 !important;
        margin-top: 10px !important;
    }

    .bg-register .section-gap-register {
        padding: 100px 0 100px 0 !important;
    }
    .bg-register .register .register-rebirth {
        padding: 0 100px !important;
    }
    .bg-register .register .box .sub-title {
        padding-top: 20px !important;
    }
    .bg-register .register .box form .form-control {
        font-size: 14px !important;
    }
    .bg-register .register .box form label.form-check-label {
        font-size: 14px !important;
    }
    .bg-register .register .box form #inputName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputEmail {
        border-right: 0 !important;
    }
    .bg-register .register .box form #inputFullName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputCity {
        border-right: 0 !important;
    }

    .search {
        padding-top: 90px !important;
    }
    .search .page-content {
        padding-top: 0;
        padding-bottom: 40px;
    }
    .search .page-content h3 {
        text-transform: uppercase;
        padding-top: 0;
        font-family: Helvetica-Compressed, "Helvetica Neue", Helvetica, Arial,
            sans-serif;
        font-size: 16px !important;
        color: #000;
        margin: 0 0 0 10px;
        line-height: 0.9;
    }
    .search .page-content ul.updates {
        list-style: none;
        margin: 0;
        padding: 0;
        padding-bottom: 30px;
    }
    .search .page-content ul.updates li {
        border-bottom: 1px solid #eee;
        display: block;
    }
    .search .page-content ul.updates li a {
        color: #716e6e;
        font-size: 16px !important;
        padding: 10px;
        display: block;
        -webkit-transition: 0.2s all ease;
        -o-transition: 0.2s all ease;
        transition: 0.2s all ease;
    }
    .search .page-content ul.updates li a:hover {
        padding-left: 20px;
        background-color: #03ad57;
        text-decoration: none;
        color: #000;
    }
    .search .page-content ul.updates li a span {
        display: block;
        font-size: 13px;
    }
}
/* Extra Small Devices, Phones */
@media only screen and (max-width: 480px) {
    .banner-area img {
        margin-top: 70px !important;
    }

    .banner-about-area img {
        margin-top: 70px !important;
    }

    .banner-partnership img {
        margin-top: 70px !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 20px;
        display: inline-block !important;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 14px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 100px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 10px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 334px !important;
        height: 334px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title {
        background: none !important;
        text-align: center !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title h6 {
        max-width: 100% !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 750px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 480px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 480px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 295px !important;
        margin: 0 20px 40px 20px !important;
        border-radius: 10px;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 0 !important;
        right: 0 !important;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 440px !important;
        position: absolute;
        top: 360px !important;
        right: 0 !important;
        /*webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;*/
        overflow: hidden;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 440px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: 1px !important;
        bottom: 0 !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 0 !important;
        position: absolute;
        bottom: -313px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 0 !important;
        left: 0% !important;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 295px !important;
        padding-left: 0;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 130% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 1% !important;
        top: 79% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 1% !important;
        top: 90% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 30px !important;
        height: 30px !important;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px !important;
        padding: 0 10px 10px 10px !important;
    }
    .testimony-area
        .item-testimony
        .testimony-slider
        .col-xs-12
        .thumbnail
        img {
        display: block !important;
        margin: auto !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 263px !important;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
        padding: 0 10px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .contact-area {
        background: transparent;
        margin: 0 15px !important;
    }
    .contact-area .bg-contact {
        background: url(../img/misc/bg-footer-top-2-mobile.png) no-repeat !important;
    }
    .contact-area .bg-contact .col-md-6 {
        padding: 0 5px;
    }
    .contact-area .bg-contact .address {
        padding: 15px 0 !important;
        margin-top: 10px;
    }
    .contact-area .bg-contact .address h6 {
        color: #09ae5d;
        font-weight: 500;
    }
    .contact-area .bg-contact .address p {
        color: #000;
        font-size: 14px !important;
        font-weight: 500;
        margin-bottom: 0;
    }
    .contact-area .bg-contact .address p span {
        padding-left: 10px;
    }
    .contact-area .bg-contact .address img {
        width: 15x;
        height: 15px;
    }
    .contact-area .bg-contact .sub-menu {
        padding: 10px 0 !important;
        margin-left: -8px;
    }
    .contact-area .bg-contact .sub-menu h5 {
        color: #09ae5d;
        font-weight: 500;
        margin: 0 10px 0 8px;
    }
    .contact-area .bg-contact .sub-menu hr {
        margin-top: 5px;
        margin-bottom: 5px;
        margin-left: 8px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li {
        border-right: 1px solid #c6c6c6;
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li a {
        margin: 0 10px 0 8px;
        color: #000;
        font-size: 13px !important;
    }
    .contact-area .bg-contact .sub-menu .sub-menu-item li:last-child {
        border-right: 0px;
    }
    .contact-area .bg-contact .sub-menu ul {
        text-align: center !important;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li {
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a {
        margin: 0 5px 0 8px;
        color: #000;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img {
        max-width: 30px;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img.gp {
        max-width: 125px;
        height: 30px;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .list-category {
        margin-bottom: 40px;
    }
    .bg-category .list-category a img {
        padding-bottom: 10px;
        width: 100% !important;
        height: auto;
    }
    .bg-category .list-category a .title {
        height: 50px;
    }
    .bg-category .list-category a .title h8 {
        text-decoration: none;
        color: #000;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: 600;
        margin: 5px 0 0 0;
    }
    .bg-category .list-category a p {
        padding-top: 5px;
        height: 45px;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 1px;
        color: #000;
        line-height: 13px;
    }
    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 21px !important;
        float: none !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: 260px !important;
    }

    .bg-gallery .videos h4 {
        font-size: 18px !important;
    }

    .bg-gallery .list-gallery a img {
        width: 100% !important;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 24px !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 14px !important;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 18px !important;
        font-weight: 700 !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 14px !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 0 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-express .fancy span:before,
    .bg-express .fancy span:after {
        content: "";
        position: absolute;
        height: 5px;
        border-top: 0 !important;
        top: 10px;
        width: 200px;
    }
    .bg-express .fancy span:after {
        left: 0 !important;
        margin-left: 0;
    }

    .bg-express .box-account {
        padding: 0 30px !important;
    }
    .bg-express .box-account h5 {
        padding-top: 135px !important;
        font-size: 19px !important;
    }

    .bg-express-2 .box-account h5 {
        padding-top: 165px !important;
        font-size: 20px !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .dashboard-area ul li .item {
        border-right: 0 !important;
        line-height: 18px;
        padding-right: 0;
    }

    #mobile-nav ul li input[type="text"] {
        position: absolute !important;
        top: 8px !important;
        right: 112px !important;
    }
    #mobile-nav ul li a {
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        overflow: hidden;
        padding: 10px 22px 10px 15px;
        position: relative;
        text-decoration: none;
        width: 100%;
        display: block;
        outline: none;
        font-weight: 700;
    }
    #mobile-nav ul li a img {
        width: 20px;
        height: 20px;
    }
    #mobile-nav ul li .fa-user-o {
        display: none;
    }
    #mobile-nav ul li .notifications .fa {
        display: none;
    }
    #mobile-nav ul li .notifications span.num {
        padding-right: 5px !important;
    }

    .bg-dashboard .dashboard-area {
        padding: 90px 0 0 0 !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area hr {
        margin-bottom: 0 !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -25px !important;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d;
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 0 0 0 !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .donation-table {
        display: none;
    }
    .bg-dashboard .table-2 {
        display: block !important;
        /*@media (max-width: 576px) {
        .container-table100 {
            padding-left: 15px;
            padding-right: 15px;
        }
    }*/
    }
    .bg-dashboard .table-2 .limiter {
        width: 100%;
        margin: 0 auto;
    }
    .bg-dashboard .table-2 .container-table100 {
        width: 100%;
        min-height: 80vh !important;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        padding: 33px 30px !important;
    }
    .bg-dashboard .table-2 .wrap-table100 {
        width: 1170px;
    }
    .bg-dashboard .table-2 table {
        border-spacing: 1;
        border-collapse: collapse;
        background: transparent;
        overflow: hidden;
        width: 100%;
        margin: 0 auto;
        position: block;
    }
    .bg-dashboard .table-2 table * {
        position: relative;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        padding-left: 8px;
    }
    .bg-dashboard .table-2 table thead tr {
        background: transparent;
    }
    .bg-dashboard .table-2 table tbody tr:last-child {
        border: 0;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        text-align: left;
    }
    .bg-dashboard .table-2 table td.l,
    .bg-dashboard .table-2 table th.l {
        text-align: left !important;
    }
    .bg-dashboard .table-2 table td.c,
    .bg-dashboard .table-2 table th.c {
        text-align: center;
    }
    .bg-dashboard .table-2 table td.r,
    .bg-dashboard .table-2 table th.r {
        text-align: center;
    }
    .bg-dashboard .table-2 .table100-head th {
        font-size: 14px;
        color: #11110f;
        line-height: 1.2;
        font-weight: 600;
    }
    .bg-dashboard .table-2 .table100-head .columnheader1 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader2 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader3 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader4 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader5 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader6 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 tbody tr:nth-child(even) {
        background-color: transparent !important;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 15px;
        color: #808080;
        line-height: 1.2;
        font-weight: unset;
    }
    .bg-dashboard .table-2 tbody tr:hover {
        color: #555555;
        background-color: #f5f5f5;
        cursor: pointer;
    }
    .bg-dashboard .table-2 .column1 {
        width: 340px !important;
        padding-left: 140px;
    }
    .bg-dashboard .table-2 .column2 {
        width: 270px !important;
    }
    .bg-dashboard .table-2 .column3 {
        width: 245px !important;
    }
    .bg-dashboard .table-2 .column4 {
        width: 110px;
        text-align: left !important;
    }
    .bg-dashboard .table-2 .column5 {
        width: 170px !important;
        text-align: left !important;
        color: #09ae5d !important;
    }
    .bg-dashboard .table-2 .column6 {
        width: 222px !important;
        text-align: left !important;
        padding-right: 62px;
    }
    .bg-dashboard .table-2 .column6 .btn-file {
        background-color: #f4f4f4;
        border-color: #f4f4f4;
        color: #c7c7c7;
    }
}
@media only screen and (max-width: 480px) and (max-width: 480px) {
    .bg-dashboard .table-2 table {
        display: block;
        margin-top: -20px !important;
    }
    .bg-dashboard .table-2 .pagination {
        padding-left: 88px !important;
    }
    .bg-dashboard .table-2 .pagination .page-link:focus {
        box-shadow: none;
    }
    .bg-dashboard .table-2 .pagination > .page-item > .page-link,
    .bg-dashboard .table-2 .pagination > .page-item > span {
        border: 0;
        border-radius: 30px !important;
        transition: all 0.3s;
        padding: 0 11px !important;
        margin: 0 3px !important;
        min-width: 30px;
        height: 30px;
        line-height: 30px;
        color: #999;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        background: 0 0;
        text-align: center;
    }
    .bg-dashboard .table-2 .pagination.pagination-info > .page-item.active > a,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:hover,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:hover {
        color: #fff;
        background-color: #09ae5d;
        border-color: #09ae5d;
        box-shadow: 0 4px 5px 0 rgba(0, 188, 212, 0.14),
            0 1px 10px 0 rgba(0, 188, 212, 0.12),
            0 2px 4px -1px rgba(0, 188, 212, 0.2);
    }
    .bg-dashboard .table-2 table > *,
    .bg-dashboard .table-2 table tr,
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        display: block;
    }
    .bg-dashboard .table-2 table thead {
        display: none;
    }
    .bg-dashboard .table-2 table tbody tr {
        height: auto;
        padding: 20px 0;
    }
    .bg-dashboard .table-2 table tbody tr td {
        padding-left: 40% !important;
        margin-bottom: 10px;
    }
    .bg-dashboard .table-2 table tbody tr td:last-child {
        margin-bottom: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:before {
        font-size: 14px;
        color: #000;
        line-height: 1.2;
        font-weight: unset;
        position: absolute;
        width: 40%;
        left: 0;
        top: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(1):before {
        content: "JENIS DONASI";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(2):before {
        content: "NOMINAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(3):before {
        content: "TANGGAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(4):before {
        content: "WAKTU";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(5):before {
        content: "STATUS";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(6):before {
        content: "UNGGAH BUKTI";
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6 {
        text-align: left !important;
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6,
    .bg-dashboard .table-2 .column1,
    .bg-dashboard .table-2 .column2,
    .bg-dashboard .table-2 .column3 {
        width: 100%;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 14px;
    }
}
@media only screen and (max-width: 480px) {
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 20px 16px !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 403px !important;
        font-size: 12px;
    }

    .bg-donation .donation {
        padding-top: 100px !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-8 {
        padding-right: 15px !important;
        border-right: 0 !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-4 {
        padding-left: 15px !important;
    }
    .bg-donation .donation .box-card-transfer .btn-submit-donation-2 {
        padding: 5px 15px !important;
    }

    .donation .box-nominal .check-upper {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .check-down {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .comment {
        margin-left: 10px;
    }
    .donation .box-nominal .opsi {
        padding: 5px !important;
    }
    .donation .box-additional .col-lg-7 {
        padding: 0 10px !important;
    }
    .donation .box-additional .col-lg-5 {
        padding: 0 10px !important;
    }
    .donation .box-additional .btn-submit-donation-3 {
        padding: 7px 186px !important;
    }

    .bg-register .section-gap-register {
        padding: 100px 0 100px 0 !important;
    }
    .bg-register .register .register-rebirth {
        padding: 0 100px !important;
    }
    .bg-register .register .box .sub-title {
        padding-top: 20px !important;
    }
    .bg-register .register .box form .form-control {
        font-size: 14px !important;
    }
    .bg-register .register .box form label.form-check-label {
        font-size: 14px !important;
    }
    .bg-register .register .box form #inputName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputEmail {
        border-right: 0 !important;
    }
    .bg-register .register .box form #inputFullName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputCity {
        border-right: 0 !important;
    }

    .search {
        padding-top: 90px !important;
    }
    .search .page-content {
        padding-top: 0;
        padding-bottom: 40px;
    }
    .search .page-content h3 {
        text-transform: uppercase;
        padding-top: 0;
        font-family: Helvetica-Compressed, "Helvetica Neue", Helvetica, Arial,
            sans-serif;
        font-size: 16px !important;
        color: #000;
        margin: 0 0 0 10px;
        line-height: 0.9;
    }
    .search .page-content ul.updates {
        list-style: none;
        margin: 0;
        padding: 0;
        padding-bottom: 30px;
    }
    .search .page-content ul.updates li {
        border-bottom: 1px solid #eee;
        display: block;
    }
    .search .page-content ul.updates li a {
        color: #716e6e;
        font-size: 16px !important;
        padding: 10px;
        display: block;
        -webkit-transition: 0.2s all ease;
        -o-transition: 0.2s all ease;
        transition: 0.2s all ease;
    }
    .search .page-content ul.updates li a:hover {
        padding-left: 20px;
        background-color: #03ad57;
        text-decoration: none;
        color: #000;
    }
    .search .page-content ul.updates li a span {
        display: block;
        font-size: 13px;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 414px) {
    .banner-area img {
        margin-top: 70px !important;
    }

    .banner-about-area img {
        margin-top: 70px !important;
    }

    .banner-partnership img {
        margin-top: 70px !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 20px;
        display: inline-block !important;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 12px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 10px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 50px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 10px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 334px !important;
        height: 334px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title {
        background: none !important;
        text-align: center !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title h6 {
        max-width: 100% !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 650px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 414px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 414px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 200px !important;
        margin: 0 20px 40px 20px !important;
        border-radius: 10px;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 0 !important;
        right: 0 !important;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 372px !important;
        position: absolute;
        top: 310px !important;
        right: 0 !important;
        /*webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;*/
        overflow: hidden;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 372px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: 1px !important;
        bottom: -46px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 0 !important;
        position: absolute;
        bottom: -313px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 0 !important;
        left: 0% !important;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 250px !important;
        padding-left: 0;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 130% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 1% !important;
        top: 79% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 1% !important;
        top: 90% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 20px !important;
        height: 20px !important;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px !important;
        padding: 0 10px 10px 10px !important;
    }
    .testimony-area
        .item-testimony
        .testimony-slider
        .col-xs-12
        .thumbnail
        img {
        display: block !important;
        margin: auto !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 127px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .contact-area {
        background: transparent;
        margin: 0 15px !important;
    }
    .contact-area .bg-contact {
        background: url(../img/misc/bg-footer-top-2-mobile.png) no-repeat !important;
    }
    .contact-area .bg-contact .col-md-6 {
        padding: 0 5px;
    }
    .contact-area .bg-contact .address {
        padding: 15px 0 !important;
        margin-top: 10px;
    }
    .contact-area .bg-contact .address h6 {
        color: #09ae5d;
        font-weight: 500;
    }
    .contact-area .bg-contact .address p {
        color: #000;
        font-size: 11px !important;
        font-weight: 500;
        margin-bottom: 0;
    }
    .contact-area .bg-contact .address p span {
        padding-left: 10px;
    }
    .contact-area .bg-contact .address img {
        width: 15x;
        height: 15px;
    }
    .contact-area .bg-contact .sub-menu {
        padding: 10px 0 !important;
        margin-left: -8px;
    }
    .contact-area .bg-contact .sub-menu h5 {
        color: #09ae5d;
        font-weight: 500;
        margin: 0 10px 0 8px;
    }
    .contact-area .bg-contact .sub-menu hr {
        margin-top: 5px;
        margin-bottom: 5px;
        margin-left: 8px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li {
        border-right: 1px solid #c6c6c6;
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li a {
        margin: 0 10px 0 8px;
        color: #000;
        font-size: 13px !important;
    }
    .contact-area .bg-contact .sub-menu .sub-menu-item li:last-child {
        border-right: 0px;
    }
    .contact-area .bg-contact .sub-menu ul {
        text-align: center !important;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li {
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a {
        margin: 0 5px 0 8px;
        color: #000;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img {
        max-width: 30px;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img.gp {
        max-width: 125px;
        height: 30px;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 21px !important;
        float: none !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: 210px !important;
    }

    .bg-gallery .videos h4 {
        font-size: 14px !important;
    }

    .bg-gallery .list-gallery a img {
        width: 100% !important;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 14px !important;
        font-weight: 700 !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 12px !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 0 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-express .fancy span:before,
    .bg-express .fancy span:after {
        content: "";
        position: absolute;
        height: 5px;
        border-top: 0 !important;
        top: 10px;
        width: 200px;
    }
    .bg-express .fancy span:after {
        left: 0 !important;
        margin-left: 0;
    }

    .bg-express .box-account {
        padding: 0 30px !important;
    }
    .bg-express .box-account h5 {
        padding-top: 130px !important;
        font-size: 19px !important;
    }

    .bg-express-2 .box-account h5 {
        padding-top: 125px !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .dashboard-area ul li .item {
        border-right: 0 !important;
        line-height: 18px;
        padding-right: 0;
    }

    #mobile-nav ul li input[type="text"] {
        position: absolute !important;
        top: 8px !important;
        right: 112px !important;
    }
    #mobile-nav ul li a {
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        overflow: hidden;
        padding: 10px 22px 10px 15px;
        position: relative;
        text-decoration: none;
        width: 100%;
        display: block;
        outline: none;
        font-weight: 700;
    }
    #mobile-nav ul li a img {
        width: 20px;
        height: 20px;
    }
    #mobile-nav ul li .fa-user-o {
        display: none;
    }
    #mobile-nav ul li .notifications .fa {
        display: none;
    }
    #mobile-nav ul li .notifications span.num {
        padding-right: 5px !important;
    }

    .bg-dashboard .dashboard-area {
        padding: 90px 0 0 0 !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area hr {
        margin-bottom: 0 !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -25px !important;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d;
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 0 0 0 !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .donation-table {
        display: none;
    }
    .bg-dashboard .table-2 {
        display: block !important;
        /*@media (max-width: 576px) {
        .container-table100 {
            padding-left: 15px;
            padding-right: 15px;
        }
    }*/
    }
    .bg-dashboard .table-2 .limiter {
        width: 100%;
        margin: 0 auto;
    }
    .bg-dashboard .table-2 .container-table100 {
        width: 100%;
        min-height: 80vh !important;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        padding: 33px 30px !important;
    }
    .bg-dashboard .table-2 .wrap-table100 {
        width: 1170px;
    }
    .bg-dashboard .table-2 table {
        border-spacing: 1;
        border-collapse: collapse;
        background: transparent;
        overflow: hidden;
        width: 100%;
        margin: 0 auto;
        position: block;
    }
    .bg-dashboard .table-2 table * {
        position: relative;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        padding-left: 8px;
    }
    .bg-dashboard .table-2 table thead tr {
        background: transparent;
    }
    .bg-dashboard .table-2 table tbody tr:last-child {
        border: 0;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        text-align: left;
    }
    .bg-dashboard .table-2 table td.l,
    .bg-dashboard .table-2 table th.l {
        text-align: left !important;
    }
    .bg-dashboard .table-2 table td.c,
    .bg-dashboard .table-2 table th.c {
        text-align: center;
    }
    .bg-dashboard .table-2 table td.r,
    .bg-dashboard .table-2 table th.r {
        text-align: center;
    }
    .bg-dashboard .table-2 .table100-head th {
        font-size: 14px;
        color: #11110f;
        line-height: 1.2;
        font-weight: 600;
    }
    .bg-dashboard .table-2 .table100-head .columnheader1 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader2 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader3 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader4 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader5 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader6 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 tbody tr:nth-child(even) {
        background-color: transparent !important;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 15px;
        color: #808080;
        line-height: 1.2;
        font-weight: unset;
    }
    .bg-dashboard .table-2 tbody tr:hover {
        color: #555555;
        background-color: #f5f5f5;
        cursor: pointer;
    }
    .bg-dashboard .table-2 .column1 {
        width: 340px !important;
        padding-left: 140px;
    }
    .bg-dashboard .table-2 .column2 {
        width: 270px !important;
    }
    .bg-dashboard .table-2 .column3 {
        width: 245px !important;
    }
    .bg-dashboard .table-2 .column4 {
        width: 110px;
        text-align: left !important;
    }
    .bg-dashboard .table-2 .column5 {
        width: 170px !important;
        text-align: left !important;
        color: #09ae5d !important;
    }
    .bg-dashboard .table-2 .column6 {
        width: 222px !important;
        text-align: left !important;
        padding-right: 62px;
    }
    .bg-dashboard .table-2 .column6 .btn-file {
        background-color: #f4f4f4;
        border-color: #f4f4f4;
        color: #c7c7c7;
    }
}
@media only screen and (max-width: 414px) and (max-width: 414px) {
    .bg-dashboard .table-2 table {
        display: block;
        margin-top: -20px !important;
    }
    .bg-dashboard .table-2 .pagination {
        padding-left: 60px !important;
    }
    .bg-dashboard .table-2 .pagination .page-link:focus {
        box-shadow: none;
    }
    .bg-dashboard .table-2 .pagination > .page-item > .page-link,
    .bg-dashboard .table-2 .pagination > .page-item > span {
        border: 0;
        border-radius: 30px !important;
        transition: all 0.3s;
        padding: 0 11px !important;
        margin: 0 3px !important;
        min-width: 30px;
        height: 30px;
        line-height: 30px;
        color: #999;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        background: 0 0;
        text-align: center;
    }
    .bg-dashboard .table-2 .pagination.pagination-info > .page-item.active > a,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:hover,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:hover {
        color: #fff;
        background-color: #09ae5d;
        border-color: #09ae5d;
        box-shadow: 0 4px 5px 0 rgba(0, 188, 212, 0.14),
            0 1px 10px 0 rgba(0, 188, 212, 0.12),
            0 2px 4px -1px rgba(0, 188, 212, 0.2);
    }
    .bg-dashboard .table-2 table > *,
    .bg-dashboard .table-2 table tr,
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        display: block;
    }
    .bg-dashboard .table-2 table thead {
        display: none;
    }
    .bg-dashboard .table-2 table tbody tr {
        height: auto;
        padding: 20px 0;
    }
    .bg-dashboard .table-2 table tbody tr td {
        padding-left: 40% !important;
        margin-bottom: 10px;
    }
    .bg-dashboard .table-2 table tbody tr td:last-child {
        margin-bottom: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:before {
        font-size: 14px;
        color: #000;
        line-height: 1.2;
        font-weight: unset;
        position: absolute;
        width: 40%;
        left: 0;
        top: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(1):before {
        content: "JENIS DONASI";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(2):before {
        content: "NOMINAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(3):before {
        content: "TANGGAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(4):before {
        content: "WAKTU";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(5):before {
        content: "STATUS";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(6):before {
        content: "UNGGAH BUKTI";
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6 {
        text-align: left !important;
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6,
    .bg-dashboard .table-2 .column1,
    .bg-dashboard .table-2 .column2,
    .bg-dashboard .table-2 .column3 {
        width: 100%;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 14px;
    }
}
@media only screen and (max-width: 414px) {
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 20px 16px !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 337px !important;
        font-size: 12px;
    }

    .bg-donation .donation {
        padding-top: 100px !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-8 {
        padding-right: 15px !important;
        border-right: 0 !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-4 {
        padding-left: 15px !important;
    }
    .bg-donation .donation .box-card-transfer .btn-submit-donation-2 {
        padding: 5px 15px !important;
    }

    .donation .box-nominal .check-upper {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .check-down {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .comment {
        margin-left: 10px;
    }
    .donation .box-nominal .opsi {
        padding: 5px !important;
    }
    .donation .box-additional .col-lg-7 {
        padding: 0 10px !important;
    }
    .donation .box-additional .col-lg-5 {
        padding: 0 10px !important;
    }
    .donation .box-additional .btn-submit-donation-3 {
        padding: 7px 152px !important;
    }
    .donation .box-card-transfer .form-row .form-group {
        margin-bottom: 20px !important;
    }
    .donation
        .box-card-transfer
        .form-row
        .form-group
        ::-webkit-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-moz-placeholder {
        /* Firefox 18- */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group ::-moz-placeholder {
        /* Firefox 19+ */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-ms-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group .form-control {
        padding: 10px 15px 0 15px !important;
        font-size: 14px !important;
    }
    .donation .box-card-transfer .form-row .form-group .break-it {
        margin-left: 0 !important;
        margin-top: 10px !important;
    }

    .bg-register .section-gap-register {
        padding: 100px 0 100px 0 !important;
    }
    .bg-register .register .box .sub-title {
        padding-top: 20px !important;
    }
    .bg-register .register .box form .form-control {
        font-size: 13px !important;
    }
    .bg-register .register .box form label.form-check-label {
        font-size: 13px !important;
    }
    .bg-register .register .box form #inputName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputEmail {
        border-right: 0 !important;
    }
    .bg-register .register .box form #inputFullName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputCity {
        border-right: 0 !important;
    }

    .search {
        padding-top: 90px !important;
    }
    .search .page-content {
        padding-top: 0;
        padding-bottom: 40px;
    }
    .search .page-content h3 {
        text-transform: uppercase;
        padding-top: 0;
        font-family: Helvetica-Compressed, "Helvetica Neue", Helvetica, Arial,
            sans-serif;
        font-size: 16px !important;
        color: #000;
        margin: 0 0 0 10px;
        line-height: 0.9;
    }
    .search .page-content ul.updates {
        list-style: none;
        margin: 0;
        padding: 0;
        padding-bottom: 30px;
    }
    .search .page-content ul.updates li {
        border-bottom: 1px solid #eee;
        display: block;
    }
    .search .page-content ul.updates li a {
        color: #716e6e;
        font-size: 16px !important;
        padding: 10px;
        display: block;
        -webkit-transition: 0.2s all ease;
        -o-transition: 0.2s all ease;
        transition: 0.2s all ease;
    }
    .search .page-content ul.updates li a:hover {
        padding-left: 20px;
        background-color: #03ad57;
        text-decoration: none;
        color: #000;
    }
    .search .page-content ul.updates li a span {
        display: block;
        font-size: 13px;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 375px) {
    .banner-area img {
        margin-top: 70px !important;
    }

    .banner-about-area img {
        margin-top: 70px !important;
    }

    .banner-partnership img {
        margin-top: 70px !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 20px;
        display: inline-block !important;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 12px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 10px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 50px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 10px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 295px !important;
        height: 295px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title {
        background: none !important;
        text-align: center !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title h6 {
        max-width: 100% !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 650px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 375px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 375px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 200px !important;
        margin: 0 20px 40px 20px !important;
        border-radius: 10px;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 0 !important;
        right: 0 !important;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 332px !important;
        position: absolute;
        top: 280px !important;
        right: 0 !important;
        /*webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;*/
        overflow: hidden;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 332px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: 0 !important;
        bottom: -15px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 0 !important;
        position: absolute;
        bottom: -258px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 0 !important;
        left: 0% !important;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 222px !important;
        padding-left: 0;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 130% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 1% !important;
        top: 79% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 1% !important;
        top: 90% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 20px !important;
        height: 20px !important;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px !important;
        padding: 0 10px 10px 10px !important;
    }
    .testimony-area
        .item-testimony
        .testimony-slider
        .col-xs-12
        .thumbnail
        img {
        display: block !important;
        margin: auto !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 162px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .contact-area {
        background: transparent;
        margin: 0 15px !important;
    }
    .contact-area .bg-contact {
        background: url(../img/misc/bg-footer-top-2-mobile.png) no-repeat !important;
    }
    .contact-area .bg-contact .col-md-6 {
        padding: 0 5px;
    }
    .contact-area .bg-contact .address {
        padding: 15px 0 !important;
        margin-top: 10px;
    }
    .contact-area .bg-contact .address h6 {
        color: #09ae5d;
        font-weight: 500;
    }
    .contact-area .bg-contact .address p {
        color: #000;
        font-size: 11px !important;
        font-weight: 500;
        margin-bottom: 0;
    }
    .contact-area .bg-contact .address p span {
        padding-left: 10px;
    }
    .contact-area .bg-contact .address img {
        width: 15x;
        height: 15px;
    }
    .contact-area .bg-contact .sub-menu {
        padding: 10px 0 !important;
        margin-left: -8px;
    }
    .contact-area .bg-contact .sub-menu h5 {
        color: #09ae5d;
        font-weight: 500;
        margin: 0 10px 0 8px;
    }
    .contact-area .bg-contact .sub-menu hr {
        margin-top: 5px;
        margin-bottom: 5px;
        margin-left: 8px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li {
        border-right: 1px solid #c6c6c6;
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li a {
        margin: 0 10px 0 8px;
        color: #000;
        font-size: 13px !important;
    }
    .contact-area .bg-contact .sub-menu .sub-menu-item li:last-child {
        border-right: 0px;
    }
    .contact-area .bg-contact .sub-menu ul {
        text-align: center !important;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li {
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a {
        margin: 0 5px 0 8px;
        color: #000;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img {
        max-width: 30px;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img.gp {
        max-width: 125px;
        height: 30px;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 21px !important;
        float: none !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: 200px !important;
    }

    .bg-gallery .videos h4 {
        font-size: 14px !important;
    }

    .bg-gallery .list-gallery a img {
        width: 100%;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 14px !important;
        font-weight: 700 !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 12px !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 0 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-express .fancy span:before,
    .bg-express .fancy span:after {
        content: "";
        position: absolute;
        height: 5px;
        border-top: 0 !important;
        top: 10px;
        width: 200px;
    }
    .bg-express .fancy span:after {
        left: 0 !important;
        margin-left: 0;
    }

    .bg-express-2 .box-account h5 {
        padding-top: 125px !important;
    }

    .bg-express .box-account h5 {
        padding-top: 130px !important;
        font-size: 19px !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .dashboard-area ul li .item {
        border-right: 0 !important;
        line-height: 18px;
        padding-right: 0;
    }

    #mobile-nav ul li input[type="text"] {
        position: absolute !important;
        top: 8px !important;
        right: 112px !important;
    }
    #mobile-nav ul li a {
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        overflow: hidden;
        padding: 10px 22px 10px 15px;
        position: relative;
        text-decoration: none;
        width: 100%;
        display: block;
        outline: none;
        font-weight: 700;
    }
    #mobile-nav ul li a img {
        width: 20px;
        height: 20px;
    }
    #mobile-nav ul li .fa-user-o {
        display: none;
    }
    #mobile-nav ul li .notifications .fa {
        display: none;
    }
    #mobile-nav ul li .notifications span.num {
        padding-right: 5px !important;
    }

    .bg-dashboard .dashboard-area {
        padding: 90px 0 0 0 !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area hr {
        margin-bottom: 0 !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -25px !important;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d;
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 0 0 0 !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .donation-table {
        display: none;
    }
    .bg-dashboard .table-2 {
        display: block !important;
        /*@media (max-width: 576px) {
        .container-table100 {
            padding-left: 15px;
            padding-right: 15px;
        }
    }*/
    }
    .bg-dashboard .table-2 .limiter {
        width: 100%;
        margin: 0 auto;
    }
    .bg-dashboard .table-2 .container-table100 {
        width: 100%;
        min-height: 100vh;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        padding: 33px 30px;
    }
    .bg-dashboard .table-2 .wrap-table100 {
        width: 1170px;
    }
    .bg-dashboard .table-2 table {
        border-spacing: 1;
        border-collapse: collapse;
        background: transparent;
        overflow: hidden;
        width: 100%;
        margin: 0 auto;
        position: block;
    }
    .bg-dashboard .table-2 table * {
        position: relative;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        padding-left: 8px;
    }
    .bg-dashboard .table-2 table thead tr {
        background: transparent;
    }
    .bg-dashboard .table-2 table tbody tr:last-child {
        border: 0;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        text-align: left;
    }
    .bg-dashboard .table-2 table td.l,
    .bg-dashboard .table-2 table th.l {
        text-align: left !important;
    }
    .bg-dashboard .table-2 table td.c,
    .bg-dashboard .table-2 table th.c {
        text-align: center;
    }
    .bg-dashboard .table-2 table td.r,
    .bg-dashboard .table-2 table th.r {
        text-align: center;
    }
    .bg-dashboard .table-2 .table100-head th {
        font-size: 14px;
        color: #11110f;
        line-height: 1.2;
        font-weight: 600;
    }
    .bg-dashboard .table-2 .table100-head .columnheader1 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader2 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader3 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader4 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader5 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader6 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 tbody tr:nth-child(even) {
        background-color: transparent !important;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 15px;
        color: #808080;
        line-height: 1.2;
        font-weight: unset;
    }
    .bg-dashboard .table-2 tbody tr:hover {
        color: #555555;
        background-color: #f5f5f5;
        cursor: pointer;
    }
    .bg-dashboard .table-2 .column1 {
        width: 260px;
        padding-left: 40px;
    }
    .bg-dashboard .table-2 .column2 {
        width: 200px !important;
    }
    .bg-dashboard .table-2 .column3 {
        width: 245px;
    }
    .bg-dashboard .table-2 .column4 {
        width: 110px;
        text-align: right;
    }
    .bg-dashboard .table-2 .column5 {
        width: 170px;
        text-align: left !important;
        color: #09ae5d;
    }
    .bg-dashboard .table-2 .column6 {
        width: 222px;
        text-align: left !important;
        padding-right: 62px;
    }
    .bg-dashboard .table-2 .column6 .btn-file {
        background-color: #f4f4f4;
        border-color: #f4f4f4;
        color: #c7c7c7;
    }
}
@media only screen and (max-width: 375px) and (max-width: 375px) {
    .bg-dashboard .table-2 table {
        display: block;
        margin-top: -20px !important;
    }
    .bg-dashboard .table-2 .pagination {
        padding-left: 35px !important;
    }
    .bg-dashboard .table-2 .pagination .page-link:focus {
        box-shadow: none;
    }
    .bg-dashboard .table-2 .pagination > .page-item > .page-link,
    .bg-dashboard .table-2 .pagination > .page-item > span {
        border: 0;
        border-radius: 30px !important;
        transition: all 0.3s;
        padding: 0 11px !important;
        margin: 0 3px !important;
        min-width: 30px;
        height: 30px;
        line-height: 30px;
        color: #999;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        background: 0 0;
        text-align: center;
    }
    .bg-dashboard .table-2 .pagination.pagination-info > .page-item.active > a,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:hover,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:hover {
        color: #fff;
        background-color: #09ae5d;
        border-color: #09ae5d;
        box-shadow: 0 4px 5px 0 rgba(0, 188, 212, 0.14),
            0 1px 10px 0 rgba(0, 188, 212, 0.12),
            0 2px 4px -1px rgba(0, 188, 212, 0.2);
    }
    .bg-dashboard .table-2 table > *,
    .bg-dashboard .table-2 table tr,
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        display: block;
    }
    .bg-dashboard .table-2 table thead {
        display: none;
    }
    .bg-dashboard .table-2 table tbody tr {
        height: auto;
        padding: 20px 0;
    }
    .bg-dashboard .table-2 table tbody tr td {
        padding-left: 40% !important;
        margin-bottom: 10px;
    }
    .bg-dashboard .table-2 table tbody tr td:last-child {
        margin-bottom: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:before {
        font-size: 14px;
        color: #000;
        line-height: 1.2;
        font-weight: unset;
        position: absolute;
        width: 40%;
        left: 0;
        top: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(1):before {
        content: "JENIS DONASI";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(2):before {
        content: "NOMINAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(3):before {
        content: "TANGGAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(4):before {
        content: "WAKTU";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(5):before {
        content: "STATUS";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(6):before {
        content: "UNGGAH BUKTI";
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6 {
        text-align: left;
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6,
    .bg-dashboard .table-2 .column1,
    .bg-dashboard .table-2 .column2,
    .bg-dashboard .table-2 .column3 {
        width: 100%;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 14px;
    }
}
@media only screen and (max-width: 375px) {
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 20px 16px !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 298px !important;
        font-size: 12px;
    }

    .bg-donation .donation {
        padding-top: 100px !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-8 {
        padding-right: 15px !important;
        border-right: 0 !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-4 {
        padding-left: 15px !important;
    }
    .bg-donation .donation .box-card-transfer .btn-submit-donation-2 {
        padding: 5px 15px !important;
    }

    .donation .box-nominal .check-upper {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .check-down {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .comment {
        margin-left: 10px;
    }
    .donation .box-nominal .opsi {
        padding: 5px !important;
    }
    .donation .box-additional .col-lg-7 {
        padding: 0 10px !important;
    }
    .donation .box-additional .col-lg-5 {
        padding: 0 10px !important;
    }
    .donation .box-additional .btn-submit-donation-3 {
        padding: 7px 132px !important;
    }
    .donation .box-card-transfer .form-row .form-group {
        margin-bottom: 20px !important;
    }
    .donation
        .box-card-transfer
        .form-row
        .form-group
        ::-webkit-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-moz-placeholder {
        /* Firefox 18- */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group ::-moz-placeholder {
        /* Firefox 19+ */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-ms-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group .form-control {
        padding: 10px 15px 0 15px !important;
        font-size: 14px !important;
    }
    .donation .box-card-transfer .form-row .form-group .break-it {
        margin-left: 0 !important;
        margin-top: 10px !important;
    }

    .bg-register .section-gap-register {
        padding: 100px 0 100px 0 !important;
    }
    .bg-register .register .box .sub-title {
        padding-top: 20px !important;
    }
    .bg-register .register .box form .form-control {
        font-size: 13px !important;
    }
    .bg-register .register .box form label.form-check-label {
        font-size: 13px !important;
    }
    .bg-register .register .box form #inputName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputEmail {
        border-right: 0 !important;
    }
    .bg-register .register .box form #inputFullName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputCity {
        border-right: 0 !important;
    }

    .search {
        padding-top: 90px !important;
    }
    .search .page-content {
        padding-top: 0;
        padding-bottom: 40px;
    }
    .search .page-content h3 {
        text-transform: uppercase;
        padding-top: 0;
        font-family: Helvetica-Compressed, "Helvetica Neue", Helvetica, Arial,
            sans-serif;
        font-size: 16px !important;
        color: #000;
        margin: 0 0 0 10px;
        line-height: 0.9;
    }
    .search .page-content ul.updates {
        list-style: none;
        margin: 0;
        padding: 0;
        padding-bottom: 30px;
    }
    .search .page-content ul.updates li {
        border-bottom: 1px solid #eee;
        display: block;
    }
    .search .page-content ul.updates li a {
        color: #716e6e;
        font-size: 16px !important;
        padding: 10px;
        display: block;
        -webkit-transition: 0.2s all ease;
        -o-transition: 0.2s all ease;
        transition: 0.2s all ease;
    }
    .search .page-content ul.updates li a:hover {
        padding-left: 20px;
        background-color: #03ad57;
        text-decoration: none;
        color: #000;
    }
    .search .page-content ul.updates li a span {
        display: block;
        font-size: 13px;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 360px) {
    .banner-area img {
        margin-top: 70px !important;
    }

    .banner-about-area img {
        margin-top: 70px !important;
    }

    .banner-partnership img {
        margin-top: 70px !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 20px;
        display: inline-block !important;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 12px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 10px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 50px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 10px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 240px !important;
        height: 240px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title {
        background: none !important;
        text-align: center !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title h6 {
        max-width: 100% !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 600px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 360px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 200px !important;
        margin: 0 20px 40px 20px !important;
        border-radius: 10px;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 0 !important;
        right: 0 !important;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 315px !important;
        position: absolute;
        top: 270px !important;
        right: 0 !important;
        /*webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;*/
        overflow: hidden;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 315px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: 0 !important;
        bottom: -8px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 0 !important;
        position: absolute;
        bottom: -245px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 0 !important;
        left: 0% !important;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 215px !important;
        padding-left: 0;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 130% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 1% !important;
        top: 79% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 1% !important;
        top: 90% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 20px !important;
        height: 20px !important;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px !important;
        padding: 0 10px 10px 10px !important;
    }
    .testimony-area
        .item-testimony
        .testimony-slider
        .col-xs-12
        .thumbnail
        img {
        display: block !important;
        margin: auto !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 162px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .contact-area {
        background: transparent;
        margin: 0 15px !important;
    }
    .contact-area .bg-contact {
        background: url(../img/misc/bg-footer-top-2-mobile.png) no-repeat !important;
    }
    .contact-area .bg-contact .col-md-6 {
        padding: 0 5px;
    }
    .contact-area .bg-contact .address {
        padding: 15px 0 !important;
        margin-top: 10px;
    }
    .contact-area .bg-contact .address h6 {
        color: #09ae5d;
        font-weight: 500;
    }
    .contact-area .bg-contact .address p {
        color: #000;
        font-size: 11px !important;
        font-weight: 500;
        margin-bottom: 0;
    }
    .contact-area .bg-contact .address p span {
        padding-left: 10px;
    }
    .contact-area .bg-contact .address img {
        width: 15x;
        height: 15px;
    }
    .contact-area .bg-contact .sub-menu {
        padding: 10px 0 !important;
        margin-left: -8px;
    }
    .contact-area .bg-contact .sub-menu h5 {
        color: #09ae5d;
        font-weight: 500;
        margin: 0 10px 0 8px;
    }
    .contact-area .bg-contact .sub-menu hr {
        margin-top: 5px;
        margin-bottom: 5px;
        margin-left: 8px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li {
        border-right: 1px solid #c6c6c6;
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li a {
        margin: 0 10px 0 8px;
        color: #000;
        font-size: 13px !important;
    }
    .contact-area .bg-contact .sub-menu .sub-menu-item li:last-child {
        border-right: 0px;
    }
    .contact-area .bg-contact .sub-menu ul {
        text-align: center !important;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li {
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a {
        margin: 0 5px 0 8px;
        color: #000;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img {
        max-width: 30px;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img.gp {
        max-width: 125px;
        height: 30px;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 21px !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: 191px !important;
    }

    .bg-gallery .videos h4 {
        font-size: 14px !important;
    }

    .bg-gallery .list-gallery a img {
        width: 100% !important;
    }

    .bg-gallery .videos h4 {
        font-size: 14px !important;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 14px !important;
        font-weight: 700 !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 12px !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 0 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-express .fancy span:before,
    .bg-express .fancy span:after {
        content: "";
        position: absolute;
        height: 5px;
        border-top: 0 !important;
        top: 10px;
        width: 200px;
    }
    .bg-express .fancy span:after {
        left: 0 !important;
        margin-left: 0;
    }

    .bg-express .box-account h5 {
        padding-top: 130px !important;
        font-size: 19px !important;
    }

    .bg-express-2 .box-account h5 {
        padding-top: 125px !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .dashboard-area ul li .item {
        border-right: 0 !important;
        line-height: 18px;
        padding-right: 0;
    }

    #mobile-nav ul li input[type="text"] {
        position: absolute !important;
        top: 8px !important;
        right: 112px !important;
    }
    #mobile-nav ul li a {
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        overflow: hidden;
        padding: 10px 22px 10px 15px;
        position: relative;
        text-decoration: none;
        width: 100%;
        display: block;
        outline: none;
        font-weight: 700;
    }
    #mobile-nav ul li a img {
        width: 20px;
        height: 20px;
    }
    #mobile-nav ul li .fa-user-o {
        display: none;
    }
    #mobile-nav ul li .notifications .fa {
        display: none;
    }
    #mobile-nav ul li .notifications span.num {
        padding-right: 5px !important;
    }

    .bg-dashboard .dashboard-area {
        padding: 90px 0 0 0 !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -25px !important;
        border-width: 0 0 1px;
        border-bottom: 2px solid #09ae5d;
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 0 0 0 !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .donation-table {
        display: none;
    }
    .bg-dashboard .table-2 {
        display: block !important;
        /*@media (max-width: 576px) {
        .container-table100 {
            padding-left: 15px;
            padding-right: 15px;
        }
    }*/
    }
    .bg-dashboard .table-2 .limiter {
        width: 100%;
        margin: 0 auto;
    }
    .bg-dashboard .table-2 .container-table100 {
        width: 100%;
        min-height: 100vh;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        padding: 33px 30px;
    }
    .bg-dashboard .table-2 .wrap-table100 {
        width: 1170px;
    }
    .bg-dashboard .table-2 table {
        border-spacing: 1;
        border-collapse: collapse;
        background: transparent;
        overflow: hidden;
        width: 100%;
        margin: 0 auto;
        position: block;
    }
    .bg-dashboard .table-2 table * {
        position: relative;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        padding-left: 8px;
    }
    .bg-dashboard .table-2 table thead tr {
        background: transparent;
    }
    .bg-dashboard .table-2 table tbody tr:last-child {
        border: 0;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        text-align: left;
    }
    .bg-dashboard .table-2 table td.l,
    .bg-dashboard .table-2 table th.l {
        text-align: left !important;
    }
    .bg-dashboard .table-2 table td.c,
    .bg-dashboard .table-2 table th.c {
        text-align: center;
    }
    .bg-dashboard .table-2 table td.r,
    .bg-dashboard .table-2 table th.r {
        text-align: center;
    }
    .bg-dashboard .table-2 .table100-head th {
        font-size: 14px;
        color: #11110f;
        line-height: 1.2;
        font-weight: 600;
    }
    .bg-dashboard .table-2 .table100-head .columnheader1 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader2 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader3 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader4 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader5 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader6 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 tbody tr:nth-child(even) {
        background-color: transparent !important;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 15px;
        color: #808080;
        line-height: 1.2;
        font-weight: unset;
    }
    .bg-dashboard .table-2 tbody tr:hover {
        color: #555555;
        background-color: #f5f5f5;
        cursor: pointer;
    }
    .bg-dashboard .table-2 .column1 {
        width: 260px;
        padding-left: 40px;
    }
    .bg-dashboard .table-2 .column2 {
        width: 200px !important;
    }
    .bg-dashboard .table-2 .column3 {
        width: 245px;
    }
    .bg-dashboard .table-2 .column4 {
        width: 110px;
        text-align: right;
    }
    .bg-dashboard .table-2 .column5 {
        width: 170px;
        text-align: left !important;
        color: #09ae5d;
    }
    .bg-dashboard .table-2 .column6 {
        width: 222px;
        text-align: left !important;
        padding-right: 62px;
    }
    .bg-dashboard .table-2 .column6 .btn-file {
        background-color: #f4f4f4;
        border-color: #f4f4f4;
        color: #c7c7c7;
    }
}
@media only screen and (max-width: 360px) and (max-width: 360px) {
    .bg-dashboard .table-2 table {
        display: block;
        margin-top: -20px !important;
    }
    .bg-dashboard .table-2 .pagination {
        padding-left: 10px !important;
    }
    .bg-dashboard .table-2 .pagination .page-link:focus {
        box-shadow: none;
    }
    .bg-dashboard .table-2 .pagination > .page-item > .page-link,
    .bg-dashboard .table-2 .pagination > .page-item > span {
        border: 0;
        border-radius: 30px !important;
        transition: all 0.3s;
        padding: 0 11px !important;
        margin: 0 3px !important;
        min-width: 30px;
        height: 30px;
        line-height: 30px;
        color: #999;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        background: 0 0;
        text-align: center;
    }
    .bg-dashboard .table-2 .pagination.pagination-info > .page-item.active > a,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:hover,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:hover {
        color: #fff;
        background-color: #09ae5d;
        border-color: #09ae5d;
        box-shadow: 0 4px 5px 0 rgba(0, 188, 212, 0.14),
            0 1px 10px 0 rgba(0, 188, 212, 0.12),
            0 2px 4px -1px rgba(0, 188, 212, 0.2);
    }
    .bg-dashboard .table-2 table > *,
    .bg-dashboard .table-2 table tr,
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        display: block;
    }
    .bg-dashboard .table-2 table thead {
        display: none;
    }
    .bg-dashboard .table-2 table tbody tr {
        height: auto;
        padding: 20px 0;
    }
    .bg-dashboard .table-2 table tbody tr td {
        padding-left: 40% !important;
        margin-bottom: 10px;
    }
    .bg-dashboard .table-2 table tbody tr td:last-child {
        margin-bottom: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:before {
        font-size: 14px;
        color: #000;
        line-height: 1.2;
        font-weight: unset;
        position: absolute;
        width: 40%;
        left: 0;
        top: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(1):before {
        content: "JENIS DONASI";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(2):before {
        content: "NOMINAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(3):before {
        content: "TANGGAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(4):before {
        content: "WAKTU";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(5):before {
        content: "STATUS";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(6):before {
        content: "UNGGAH BUKTI";
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6 {
        text-align: left;
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6,
    .bg-dashboard .table-2 .column1,
    .bg-dashboard .table-2 .column2,
    .bg-dashboard .table-2 .column3 {
        width: 100%;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 14px;
    }
}
@media only screen and (max-width: 360px) {
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 20px 16px !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 283px !important;
        font-size: 12px;
    }

    .bg-donation .donation {
        padding-top: 100px !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-8 {
        padding-right: 15px !important;
        border-right: 0 !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-4 {
        padding-left: 15px !important;
    }
    .bg-donation .donation .box-card-transfer .btn-submit-donation-2 {
        padding: 5px 15px !important;
    }

    .donation .box-nominal .check-upper {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .check-down {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .comment {
        margin-left: 10px;
    }
    .donation .box-nominal .opsi {
        padding: 5px !important;
    }
    .donation .box-additional .col-lg-7 {
        padding: 0 10px !important;
    }
    .donation .box-additional .col-lg-5 {
        padding: 0 10px !important;
    }
    .donation .box-additional .btn-submit-donation-3 {
        padding: 7px 125px !important;
    }
    .donation .box-card-transfer .form-row .form-group {
        margin-bottom: 20px !important;
    }
    .donation
        .box-card-transfer
        .form-row
        .form-group
        ::-webkit-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-moz-placeholder {
        /* Firefox 18- */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group ::-moz-placeholder {
        /* Firefox 19+ */
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group :-ms-input-placeholder {
        text-align: center;
    }
    .donation .box-card-transfer .form-row .form-group .form-control {
        padding: 10px 15px 0 15px !important;
        font-size: 14px !important;
    }
    .donation .box-card-transfer .form-row .form-group .break-it {
        margin-left: 0 !important;
        margin-top: 10px !important;
    }

    .bg-register .section-gap-register {
        padding: 100px 0 100px 0 !important;
    }
    .bg-register .register .box .sub-title {
        padding-top: 20px !important;
    }
    .bg-register .register .box form .form-control {
        font-size: 12px !important;
    }
    .bg-register .register .box form label.form-check-label {
        font-size: 12px !important;
    }
    .bg-register .register .box form #inputName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputEmail {
        border-right: 0 !important;
    }
    .bg-register .register .box form #inputFullName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputCity {
        border-right: 0 !important;
    }

    .search {
        padding-top: 90px !important;
    }
    .search .page-content {
        padding-top: 0;
        padding-bottom: 40px;
    }
    .search .page-content h3 {
        text-transform: uppercase;
        padding-top: 0;
        font-family: Helvetica-Compressed, "Helvetica Neue", Helvetica, Arial,
            sans-serif;
        font-size: 16px !important;
        color: #000;
        margin: 0 0 0 10px;
        line-height: 0.9;
    }
    .search .page-content ul.updates {
        list-style: none;
        margin: 0;
        padding: 0;
        padding-bottom: 30px;
    }
    .search .page-content ul.updates li {
        border-bottom: 1px solid #eee;
        display: block;
    }
    .search .page-content ul.updates li a {
        color: #716e6e;
        font-size: 16px !important;
        padding: 10px;
        display: block;
        -webkit-transition: 0.2s all ease;
        -o-transition: 0.2s all ease;
        transition: 0.2s all ease;
    }
    .search .page-content ul.updates li a:hover {
        padding-left: 20px;
        background-color: #03ad57;
        text-decoration: none;
        color: #000;
    }
    .search .page-content ul.updates li a span {
        display: block;
        font-size: 13px;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 320px) {
    .blog-area {
        padding-bottom: 0 !important;
    }

    .banner-area img {
        margin-top: 70px !important;
    }

    .banner-about-area img {
        margin-top: 70px !important;
    }

    .banner-partnership img {
        margin-top: 70px !important;
    }

    .main-menu .navbar-brand a img {
        padding-top: 5px;
        padding-left: 20px;
        display: inline-block !important;
    }

    .single-blog p {
        text-align: left;
        margin-top: 15px;
        height: 85px !important;
    }

    .about-area {
        margin: 0 40px;
    }
    .about-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .about-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .about-area .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .about-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .about-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area {
        margin: 0 40px;
    }
    .partnership-area .sidebar ul li {
        padding: 5px 0 5px 0;
        margin: 0 0 !important;
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none {
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 50px;
        font-size: 1.4em;
        text-align: center;
        position: absolute;
        top: 16px;
        left: 50%;
        margin-left: -20px;
        /*background-color: #999999;*/
        z-index: 100;
        /*
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  */
    }
    .partnership-area .mainbar .timeline > li > .timeline-badge-none a img {
        background: #fff !important;
    }
    .partnership-area
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel {
        float: right;
        left: 33px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
    }
    .partnership-area .mainbar .gallery-activities {
        padding-top: 20px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 {
        margin-left: -10px;
        padding: 15px 15px 5px 15px;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .partnership-area .mainbar .gallery-activities .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 0 10px 10px 10px !important;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        h1 {
        font-size: 12px !important;
        padding: 5px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        p {
        font-size: 10px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 50px !important;
        line-height: 12px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        .btn-more {
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a {
        color: #000;
        text-decoration: none;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay
        a
        .fa {
        font-size: 10px !important;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .partnership-area
        .mainbar
        .gallery-activities
        .col-sm-6
        .caption:hover
        .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .partnership-area .mainbar iframe {
        width: 240px !important;
        height: 240px !important;
        padding-bottom: 10px;
    }
    .partnership-area .col-md-3 {
        padding: 0 !important;
        margin-bottom: 10px;
    }
    .partnership-area .col-md-9 {
        padding: 0 !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title {
        background: none !important;
        text-align: center !important;
    }

    .partnership-area .mainbar .gallery-our-partner .sub-title h6 {
        max-width: 100% !important;
    }

    .gallery-area {
        background: #f9f9ff;
        height: 505px;
    }
    .gallery-area .half {
        max-width: 1140px !important;
    }
    .gallery-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .gallery-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .gallery-area .single-cat-item {
        text-align: center;
    }
    .gallery-area .single-cat-item .thumb img {
        border-radius: 90px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item h4 {
        padding: 20px 0px;
        -webkit-transition: all 0.3s ease 0s;
        -moz-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
    }
    .gallery-area .single-cat-item:hover h4 {
        color: #00aeef;
    }
    .gallery-area .single-cat-item:hover .thumb img {
        transform: scale(1.07);
    }
}
@media only screen and (max-width: 320px) and (max-width: 991px) {
    .gallery-area .single-cat-item {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 320px) {
    .gallery-area .primary-btn {
        border-radius: 0px;
        border: 1px solid #00aeef;
    }
    .gallery-area .primary-btn:hover {
        background: transparent;
        border-color: #00aeef;
        color: #00aeef;
    }
    .gallery-area .bg-gallery {
        background-color: transparent;
        width: 100%;
        height: 200px !important;
        margin: 0 20px 40px 20px !important;
        border-radius: 10px;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya {
        position: absolute;
        top: 0 !important;
        right: 0 !important;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .vertical-gallerya a item {
        width: 100%;
    }
    .gallery-area .bg-gallery .iframe-gallery {
        width: 280px !important;
        position: absolute;
        top: 270px !important;
        right: 0 !important;
        /*webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;*/
        overflow: hidden;
        /*box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);*/
    }
    .gallery-area .bg-gallery .iframe-gallery iframe {
        width: 280px !important;
        height: 100%;
    }
    .gallery-area .bg-gallery .spell {
        display: block;
        position: absolute;
        bottom: -50px;
    }
    .gallery-area .bg-gallery .spell .btn-more-arrow {
        position: absolute;
        left: 0 !important;
        bottom: 0;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 0;
    }
    .gallery-area .bg-gallery .spell a {
        color: #000;
        text-decoration: none;
    }
    .gallery-area .bg-gallery .spell a .fa {
        font-size: 13px;
    }
    .gallery-area .bg-gallery .spell .btn-more {
        right: 0 !important;
        position: absolute;
        bottom: -225px !important;
        background-color: transparent;
        font-size: 12px;
        border: solid 1px #000;
        border-radius: 0;
    }
    .gallery-area .bg-gallery .spell .btn-more a {
        text-decoration: none;
        color: #000;
    }
    .gallery-area .bg-gallery .spell .btn-more a .fa {
        padding-right: 15px;
        font-size: 15px;
    }
    .gallery-area .bg-gallery .arrow .left {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick {
        position: absolute;
        top: 0 !important;
        left: 0% !important;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick .item {
        float: left;
        text-align: center;
    }
    .gallery-area .bg-gallery .slick .item img {
        display: block;
        margin: 0 auto;
        height: 200px !important;
        padding-left: 0;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-track {
        width: 130% !important;
        text-align: center;
        transform: inherit !important;
    }
    .gallery-area .bg-gallery .slick-no-slide .slick-slide {
        float: none;
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-list {
        position: relative;
        overflow: hidden;
    }
    .gallery-area .bg-gallery .slick-dots {
        text-align: center;
        bottom: 45px;
        left: -5px;
        width: 5%;
    }
    .gallery-area .bg-gallery .slick-dots li {
        display: inline-block;
    }
    .gallery-area .bg-gallery .slick-dots li button {
        width: 5px;
        height: 5px;
        font-size: 5px;
        border-radius: 50%;
        border: none;
        position: absolute;
        z-index: 1;
    }
    .gallery-area .bg-gallery .slick-dots li button:before {
        font-size: 4px;
    }
    .gallery-area .bg-gallery .slick-prev {
        left: 1% !important;
        top: 79% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-next {
        left: 1% !important;
        top: 90% !important;
        color: black;
    }
    .gallery-area .bg-gallery .slick-arrow {
        position: absolute;
        z-index: 1;
        width: 20px !important;
        height: 20px !important;
        font-size: 0;
        background-size: 100% 100%;
    }

    .bg-gallery .gallery-title {
        text-align: center;
        padding-bottom: 0 !important;
    }
    .bg-gallery .gallery-title h4 {
        color: #09ae5d;
        letter-spacing: 1px;
        font-size: 20px;
        font-weight: 100;
    }
    .bg-gallery hr.gallery-title {
        padding-bottom: 0 !important;
    }
    .bg-gallery .images {
        padding-top: 0 !important;
    }
    .bg-gallery .images .col-sm-6 {
        padding: 15px 15px 5px 15px;
    }
    .bg-gallery .images .col-sm-6 .caption {
        position: relative;
        overflow: hidden;
        /* Only the -webkit- prefix is required these days */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .bg-gallery .images .col-sm-6 .caption::before {
        content: " ";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: transparent;
        transition: background 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover::before {
        background: rgba(255, 255, 255, 0.5);
    }
    .bg-gallery .images .col-sm-6 .caption__media {
        display: block;
        min-width: 100%;
        max-width: auto;
        height: auto;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: -50%;
        left: 0;
        padding: 10px 10px 10px 10px;
        color: white;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay h1 {
        font-size: 12px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay p {
        font-size: 11px !important;
        padding: 10px 10px 0 10px;
        margin-bottom: 0;
        color: #000;
        height: 60px !important;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more {
        background-color: transparent;
        font-size: 11px !important;
        border: solid 1px #000;
        border-radius: 0;
        margin-left: 10px;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a {
        color: #000;
        text-decoration: none;
    }
    .bg-gallery .images .col-sm-6 .caption__overlay .btn-more a .fa {
        font-size: 11px !important;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    .bg-gallery .images .col-sm-6 .caption__overlay__title {
        -webkit-transform: translateY(-webkit-calc(-100% - 10px));
        transform: translateY(calc(-100% - 10px));
        transition: -webkit-transform 0.35s ease-out;
        transition: transform 0.35s ease-out;
    }
    .bg-gallery .images .col-sm-6 .caption:hover .caption__overlay__title {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    .testimony-area {
        background: #f9f9ff;
        margin-bottom: 20px;
    }
    .testimony-area .labels {
        font-size: 20px;
        font-weight: 500;
        color: #000;
        display: block;
        text-align: center;
        border-bottom: 1px solid #878787;
        margin-bottom: 1rem !important;
    }
    .testimony-area .labels:after {
        content: attr(data-label);
        display: inline-block;
        text-transform: uppercase;
        background-color: #fafafa;
        position: relative;
        top: 9px;
        padding: 0 10px;
        line-height: 1;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 {
        margin: 0 auto;
    }
    .testimony-area .item-testimony .testimony-slider .col-xs-12 .thumbnail {
        padding-bottom: 10px !important;
        padding: 0 10px 10px 10px !important;
    }
    .testimony-area
        .item-testimony
        .testimony-slider
        .col-xs-12
        .thumbnail
        img {
        display: block !important;
        margin: auto !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi {
        color: #000;
        font-weight: 500;
        text-align: justify;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.quote {
        line-height: 20px;
        color: #000;
        font-size: 14px;
        height: 186px !important;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name {
        line-height: 18px;
    }
    .testimony-area .item-testimony .testimony-slider .testi p.name span.title {
        padding-left: 0;
    }
    .testimony-area .item-testimony .testimony-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 35px;
    }
    .testimony-area .item-testimony .testimony-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 105%;
        left: 0;
    }

    .contact-area {
        background: transparent;
        margin: 0 15px !important;
    }
    .contact-area .bg-contact {
        background: url(../img/misc/bg-footer-top-2-mobile.png) no-repeat !important;
    }
    .contact-area .bg-contact .col-md-6 {
        padding: 0 5px;
    }
    .contact-area .bg-contact .address {
        padding: 15px 0 !important;
        margin-top: 10px;
    }
    .contact-area .bg-contact .address h6 {
        color: #09ae5d;
        font-weight: 500;
    }
    .contact-area .bg-contact .address p {
        color: #000;
        font-size: 11px !important;
        font-weight: 500;
        margin-bottom: 0;
    }
    .contact-area .bg-contact .address p span {
        padding-left: 10px;
    }
    .contact-area .bg-contact .address img {
        width: 15x;
        height: 15px;
    }
    .contact-area .bg-contact .sub-menu {
        padding: 10px 0 !important;
        margin-left: -8px;
    }
    .contact-area .bg-contact .sub-menu h5 {
        color: #09ae5d;
        font-weight: 500;
        margin: 0 10px 0 8px;
    }
    .contact-area .bg-contact .sub-menu hr {
        margin-top: 5px;
        margin-bottom: 5px;
        margin-left: 8px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li {
        border-right: 1px solid #c6c6c6;
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .contact-area .bg-contact .sub-menu ul.sub-menu-item li a {
        margin: 0 10px 0 8px;
        color: #000;
        font-size: 13px !important;
    }
    .contact-area .bg-contact .sub-menu .sub-menu-item li:last-child {
        border-right: 0px;
    }
    .contact-area .bg-contact .sub-menu ul {
        text-align: center !important;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li {
        line-height: 14px;
        margin-left: 0;
        margin-right: 0;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a {
        margin: 0 5px 0 8px;
        color: #000;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img {
        max-width: 30px;
    }
    .contact-area .bg-contact .sub-menu ul .sub-menu-social li a img.gp {
        max-width: 125px;
        height: 30px;
    }

    .bg-sponsorship .sponsorship-title-detail {
        padding-bottom: 20px;
        margin-bottom: 10px;
        text-align: left;
        font-size: 20px;
        letter-spacing: 1px;
        padding-left: 0 !important;
    }
    .bg-sponsorship .sponsorship-title-detail h4 {
        color: #000000;
        text-align: center;
    }
    .bg-sponsorship .sponsorship-title-detail h4:after {
        content: "";
        display: block;
        width: 100% !important;
        padding-top: 10px;
        border-bottom: solid 1px lightgray;
    }
    .bg-sponsorship .sponsorship-title-detail p {
        font-size: 14px;
        color: #000;
        font-weight: 600;
        margin-bottom: 0;
    }
    .bg-sponsorship .box-account {
        padding: 20px 10px 20px 10px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail {
        background-color: transparent;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        border-radius: 10px;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.5);
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider {
        padding: 25px 10px 0 10px;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider img {
        width: 890px;
        height: 100%;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        right: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 56% !important;
        left: 15px !important;
    }
    .bg-sponsorship .bg-sponsorship-detail .detail-slider .slick-dots {
        bottom: -30px;
        left: 0 !important;
    }

    .bg-archive .mainbar .timeline > li.timeline-inverted > .timeline-panel {
        float: right;
        left: 23px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-inverted
        > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
    .bg-archive .mainbar .timeline > li.timeline-normal > .timeline-panel {
        float: left;
        right: 22px !important;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        bottom: 35px !important;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:before {
        border-left-width: 15px;
        border-right-width: 0;
        left: auto;
        right: -15px;
        top: 60px;
    }
    .bg-archive
        .mainbar
        .timeline
        > li.timeline-normal
        > .timeline-panel:after {
        border-left-width: 14px;
        border-right-width: 0;
        left: auto;
        right: -14px;
        top: 59px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-year-special a {
        display: block;
        width: 120px;
        margin: 0 -40px;
        font-size: 15px;
        font-weight: 600;
        padding: 5px 25px;
        margin-top: 40px;
        color: #000 !important;
        background: #fff;
        border-top: solid 1.5px #09ae5d !important;
        border-bottom: solid 1.5px #09ae5d !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a {
        display: block;
        width: 90px;
        margin: 0 -20px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month a:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month:active {
        color: #09ae5d;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below {
        text-align: center;
        margin: 0 auto;
        height: 60px;
        width: 40px;
        margin-top: -2px;
        padding-bottom: 10px;
    }
    .bg-archive .mainbar .timeline-badge > .blocking-month-below a {
        display: block;
        width: 90px;
        margin: 0 -25px;
        font-size: 14px;
        font-weight: 600;
        padding: 5px 10px;
        color: #000 !important;
        background: #fff;
        border-bottom: solid 1.5px #0c53a0 !important;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }
    .bg-archive .mainbar .dashed-line {
        position: absolute;
        border-left: dashed 2px #3c3c3b;
        height: 20px;
        left: 50%;
        margin-left: -1.5px;
        margin-top: 0;
    }

    .bg-category .images .detail-slider .slick-next {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 35px;
    }
    .bg-category .images .detail-slider .slick-prev {
        height: 30px;
        width: 30px;
        z-index: 10;
        top: 90% !important;
        left: 5px !important;
    }

    .bg-category .category-title h2 {
        font-size: 21px !important;
    }

    .bg-express .fancy span:before,
    .bg-express .fancy span:after {
        content: "";
        position: absolute;
        height: 5px;
        border-top: 0 !important;
        top: 10px;
        width: 200px;
    }
    .bg-express .fancy span:after {
        left: 0 !important;
        margin-left: 0;
    }

    .bg-express .box-account h5 {
        padding-top: 95px !important;
        font-size: 17px !important;
    }

    .bg-gallery .videos iframe {
        width: 100% !important;
        height: auto !important;
    }

    .bg-gallery .videos h4 {
        font-size: 14px !important;
    }

    .bg-gallery .list-gallery a h8 {
        font-size: 14px !important;
        font-weight: 700 !important;
    }

    .bg-gallery .list-gallery a p {
        font-size: 12px !important;
    }

    .bg-gallery .list-gallery a img {
        width: 100% !important;
    }

    .section-gap-category {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship {
        padding: 80px 0 20px 0 !important;
    }

    .section-gap-sponsorship-detail {
        padding: 80px 0 100px 0 !important;
    }

    .section-gap-express {
        padding: 80px 0 0 0 !important;
    }

    .section-gap-gallery {
        padding: 80px 0 50px 0 !important;
    }

    .section-gap-static {
        padding: 80px 0 0 0 !important;
    }

    .bg-static .bar {
        padding-bottom: 50px;
    }
    .bg-static .bar .sidebar {
        text-align: left;
        margin-bottom: 20px;
    }

    .dashboard-area ul li .item {
        border-right: 0 !important;
        line-height: 18px;
        padding-right: 0;
    }

    #mobile-nav ul li input[type="text"] {
        position: absolute !important;
        top: 8px !important;
        right: 111px !important;
    }
    #mobile-nav ul li a {
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        overflow: hidden;
        padding: 10px 22px 10px 15px;
        position: relative;
        text-decoration: none;
        width: 100%;
        display: block;
        outline: none;
        font-weight: 700;
    }
    #mobile-nav ul li a img {
        width: 20px;
        height: 20px;
    }
    #mobile-nav ul li .fa-user-o {
        display: none;
    }
    #mobile-nav ul li .notifications .fa {
        display: none;
    }
    #mobile-nav ul li .notifications span.num {
        padding-right: 5px !important;
    }

    .bg-dashboard .dashboard-area {
        padding: 90px 0 0 0 !important;
        margin: 0 !important;
    }
    .bg-dashboard .dashboard-area ul li {
        /*border-right: 2px solid #575756;*/
        padding-right: 10px;
    }
    .bg-dashboard .dashboard-area ul li img {
        vertical-align: middle !important;
        padding-bottom: 15px;
    }
    .bg-dashboard .dashboard-area ul li a {
        color: #575756;
    }
    .bg-dashboard .dashboard-area ul li .name {
        font-size: 18px;
        font-weight: 700;
        color: #000;
        padding: 0;
    }
    .bg-dashboard .dashboard-area ul li .item {
        border-right: 1px solid #575756;
        line-height: 18px;
        padding-right: 0;
    }
    .bg-dashboard .dashboard-area ul li .active {
        /*border-bottom: 1px solid #09ae5d;*/
        text-decoration: none;
        position: relative;
    }
    .bg-dashboard .dashboard-area ul li .active:after {
        content: "";
        width: 100%;
        position: absolute;
        left: 5px;
        bottom: -25px !important;
        border-width: 0 0 1px;
        /*border-bottom: 2px solid #09ae5d;*/
        margin: 0 5px;
        width: 78%;
    }
    .bg-dashboard .dashboard-area ul li:first-child {
        border-right: 0px;
    }
    .bg-dashboard .dashboard-area ul .list-inline-item:not(:last-child) {
        margin-right: 0 !important;
    }
    .bg-dashboard .dashboard-area hr {
        margin-bottom: 0 !important;
    }
    .bg-dashboard .section-gap-profile {
        padding: 20px 0 0 0 !important;
    }
    .bg-dashboard .section-gap-profile .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .bg-dashboard .donation-table {
        display: none;
    }
    .bg-dashboard .table-2 {
        display: block !important;
        /*@media (max-width: 576px) {
        .container-table100 {
            padding-left: 15px;
            padding-right: 15px;
        }
    }*/
    }
    .bg-dashboard .table-2 .limiter {
        width: 100%;
        margin: 0 auto;
    }
    .bg-dashboard .table-2 .container-table100 {
        width: 100%;
        min-height: 100vh;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        padding: 33px 30px;
    }
    .bg-dashboard .table-2 .wrap-table100 {
        width: 1170px;
    }
    .bg-dashboard .table-2 table {
        border-spacing: 1;
        border-collapse: collapse;
        background: transparent;
        overflow: hidden;
        width: 100%;
        margin: 0 auto;
        position: block;
    }
    .bg-dashboard .table-2 table * {
        position: relative;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        padding-left: 8px;
    }
    .bg-dashboard .table-2 table thead tr {
        background: transparent;
    }
    .bg-dashboard .table-2 table tbody tr:last-child {
        border: 0;
    }
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        text-align: left;
    }
    .bg-dashboard .table-2 table td.l,
    .bg-dashboard .table-2 table th.l {
        text-align: left !important;
    }
    .bg-dashboard .table-2 table td.c,
    .bg-dashboard .table-2 table th.c {
        text-align: center;
    }
    .bg-dashboard .table-2 table td.r,
    .bg-dashboard .table-2 table th.r {
        text-align: center;
    }
    .bg-dashboard .table-2 .table100-head th {
        font-size: 14px;
        color: #11110f;
        line-height: 1.2;
        font-weight: 600;
    }
    .bg-dashboard .table-2 .table100-head .columnheader1 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader2 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader3 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader4 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader5 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 .table100-head .columnheader6 {
        background: #f4f4f4;
    }
    .bg-dashboard .table-2 tbody tr:nth-child(even) {
        background-color: transparent !important;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 15px;
        color: #808080;
        line-height: 1.2;
        font-weight: unset;
    }
    .bg-dashboard .table-2 tbody tr:hover {
        color: #555555;
        background-color: #f5f5f5;
        cursor: pointer;
    }
    .bg-dashboard .table-2 .column1 {
        width: 260px;
        padding-left: 40px;
    }
    .bg-dashboard .table-2 .column2 {
        width: 200px !important;
    }
    .bg-dashboard .table-2 .column3 {
        width: 245px;
    }
    .bg-dashboard .table-2 .column4 {
        width: 110px;
        text-align: right;
    }
    .bg-dashboard .table-2 .column5 {
        width: 170px;
        text-align: left !important;
        color: #09ae5d;
    }
    .bg-dashboard .table-2 .column6 {
        width: 222px;
        text-align: left !important;
        padding-right: 62px;
    }
    .bg-dashboard .table-2 .column6 .btn-file {
        background-color: #f4f4f4;
        border-color: #f4f4f4;
        color: #c7c7c7;
    }
}
@media only screen and (max-width: 320px) and (max-width: 320px) {
    .bg-dashboard .table-2 table {
        display: block;
        margin-top: -20px !important;
    }
    .bg-dashboard .table-2 .pagination .page-link:focus {
        box-shadow: none;
    }
    .bg-dashboard .table-2 .pagination > .page-item > .page-link,
    .bg-dashboard .table-2 .pagination > .page-item > span {
        border: 0;
        border-radius: 30px !important;
        transition: all 0.3s;
        padding: 0 11px !important;
        margin: 0 3px !important;
        min-width: 30px;
        height: 30px;
        line-height: 30px;
        color: #999;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        background: 0 0;
        text-align: center;
    }
    .bg-dashboard .table-2 .pagination.pagination-info > .page-item.active > a,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > a:hover,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:focus,
    .bg-dashboard
        .table-2
        .pagination.pagination-info
        > .page-item.active
        > span:hover {
        color: #fff;
        background-color: #09ae5d;
        border-color: #09ae5d;
        box-shadow: 0 4px 5px 0 rgba(0, 188, 212, 0.14),
            0 1px 10px 0 rgba(0, 188, 212, 0.12),
            0 2px 4px -1px rgba(0, 188, 212, 0.2);
    }
    .bg-dashboard .table-2 table > *,
    .bg-dashboard .table-2 table tr,
    .bg-dashboard .table-2 table td,
    .bg-dashboard .table-2 table th {
        display: block;
    }
    .bg-dashboard .table-2 table thead {
        display: none;
    }
    .bg-dashboard .table-2 table tbody tr {
        height: auto;
        padding: 20px 0;
    }
    .bg-dashboard .table-2 table tbody tr td {
        padding-left: 40% !important;
        margin-bottom: 10px;
    }
    .bg-dashboard .table-2 table tbody tr td:last-child {
        margin-bottom: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:before {
        font-size: 14px;
        color: #000;
        line-height: 1.2;
        font-weight: unset;
        position: absolute;
        width: 40%;
        left: 0;
        top: 0;
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(1):before {
        content: "JENIS DONASI";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(2):before {
        content: "NOMINAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(3):before {
        content: "TANGGAL";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(4):before {
        content: "WAKTU";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(5):before {
        content: "STATUS";
    }
    .bg-dashboard .table-2 table tbody tr td:nth-child(6):before {
        content: "UNGGAH BUKTI";
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6 {
        text-align: left;
    }
    .bg-dashboard .table-2 .column4,
    .bg-dashboard .table-2 .column5,
    .bg-dashboard .table-2 .column6,
    .bg-dashboard .table-2 .column1,
    .bg-dashboard .table-2 .column2,
    .bg-dashboard .table-2 .column3 {
        width: 100%;
    }
    .bg-dashboard .table-2 tbody tr {
        font-size: 14px;
    }
}
@media only screen and (max-width: 320px) {
    .bg-dashboard .search .bottom-search {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0px 2px 5px 2px rgba(127, 137, 161, 0.5);
        margin: 20px 12px !important;
        padding: 5px 10px;
    }
    .bg-dashboard .search .bottom-search .icon {
        width: 20px;
        height: auto;
        padding: 0 !important;
        margin-top: -5px;
    }
    .bg-dashboard .search .bottom-search input[type="text"] {
        border: none;
        background: transparent;
        width: 250px;
        font-size: 12px;
    }

    .bg-donation .donation {
        padding-top: 100px !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-8 {
        padding-right: 15px !important;
        border-right: 0 !important;
    }
    .bg-donation .donation .box-card-transfer .col-md-4 {
        padding-left: 15px !important;
    }
    .bg-donation .donation .box-card-transfer .btn-submit-donation-2 {
        padding: 5px 15px !important;
    }

    .donation .box-nominal .check-upper {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .check-down {
        display: table;
        margin: 0 auto;
    }
    .donation .box-nominal .comment {
        margin-left: 10px;
    }
    .donation .box-nominal .opsi {
        padding: 5px !important;
    }
    .donation .box-additional .col-lg-7 {
        padding: 0 10px !important;
    }
    .donation .box-additional .col-lg-5 {
        padding: 0 10px !important;
    }
    .donation .box-additional .btn-submit-donation-3 {
        padding: 7px 105px !important;
    }
    .donation .box-card-transfer .form-row .form-group {
        margin-bottom: 20px !important;
    }
    .donation .box-card-transfer .form-row .form-group .form-control {
        padding: 10px 15px 0 15px !important;
        font-size: 14px !important;
    }
    .donation .box-card-transfer .form-row .form-group .break-it {
        margin-left: 0 !important;
        margin-top: 10px !important;
    }

    .bg-register .section-gap-register {
        padding: 100px 0 100px 0 !important;
    }
    .bg-register .register .box .sub-title {
        padding-top: 20px !important;
    }
    .bg-register .register .box form .form-control {
        font-size: 12px !important;
    }
    .bg-register .register .box form label.form-check-label {
        font-size: 12px !important;
    }
    .bg-register .register .box form #inputName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputEmail {
        border-right: 0 !important;
    }
    .bg-register .register .box form #inputFullName {
        border-right: 0 !important;
        border-bottom: 0 !important;
    }
    .bg-register .register .box form #inputCity {
        border-right: 0 !important;
    }

    .search {
        padding-top: 90px !important;
    }
    .search .page-content {
        padding-top: 0;
        padding-bottom: 40px;
    }
    .search .page-content h3 {
        text-transform: uppercase;
        padding-top: 0;
        font-family: Helvetica-Compressed, "Helvetica Neue", Helvetica, Arial,
            sans-serif;
        font-size: 16px !important;
        color: #000;
        margin: 0 0 0 10px;
        line-height: 0.9;
    }
    .search .page-content ul.updates {
        list-style: none;
        margin: 0;
        padding: 0;
        padding-bottom: 30px;
    }
    .search .page-content ul.updates li {
        border-bottom: 1px solid #eee;
        display: block;
    }
    .search .page-content ul.updates li a {
        color: #716e6e;
        font-size: 16px !important;
        padding: 10px;
        display: block;
        -webkit-transition: 0.2s all ease;
        -o-transition: 0.2s all ease;
        transition: 0.2s all ease;
    }
    .search .page-content ul.updates li a:hover {
        padding-left: 20px;
        background-color: #03ad57;
        text-decoration: none;
        color: #000;
    }
    .search .page-content ul.updates li a span {
        display: block;
        font-size: 13px;
    }
}
::-webkit-scrollbar {
    /* display: none; */
    /* make scrollbar transparent */
}

html {
    width: 100%;
}

body {
    background-color: #282828;
    /*.modal {
        padding-right: 0 !important;
        background-color: #000000;

        .modal-full {
            min-width: 100%;
            min-height: 500px;
            margin: 0;

            .modal-content {
                background-color: #000000 !important;
            }
        }
    }*/
}
body #banner {
    padding-bottom: 0;
    max-width: 100%;
    margin: 0 auto;
    height: auto;
}
body #banner .item {
    position: relative;
    min-width: 1366px;
    max-width: 100%;
    height: auto;
    background-repeat: no-repeat;
    background-position: center center;
}
@media screen and (max-width: 1920px) {
    body #banner .item .item-slide {
        width: 100%;
        height: 100%;
    }
    body #banner .item .item-slide img.img-fix {
        position: relative;
        width: 100%;
        height: 100%;
        background: #010208;
        background: linear-gradient(
            0deg,
            rgba(1, 2, 8, 0.8239670868) 57%,
            #f4f5f4 100%
        );
    }
}
body #banner .item .item-slide #topper-box {
    position: absolute;
    top: 0;
    left: 160px;
    margin: 35px 50px;
    width: 400px;
    height: 221px;
    border-radius: 4px;
    background-color: rgba(20, 20, 20, 0.5);
}
body #banner .item .item-slide #topper-box .title-box {
    border-left: solid 2px #da251c;
    margin: 20px 25px;
    padding: 0px 10px;
}
body #banner .item .item-slide #topper-box .title-box .title {
    color: white;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #banner .item .item-slide #topper-box .title-box .date-title {
    width: 100%;
    height: 15px;
    font-family: Helvetica;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
body #banner .item .item-slide #topper-box .mini-description {
    padding-left: 25px;
    width: 370px;
    height: 72px;
    font-family: HelveticaNeue-light;
    font-size: 18px;
    font-style: normal;
    font-variant: normal;
    font-weight: 100;
    line-height: 1.33;
    color: #ffffff;
}
body #banner .item .item-slide #topper-box .watch-trailer-ico {
    padding: 15px 25px;
}
body #banner .item .item-slide #topper-box .watch-trailer-ico img {
    width: 30px;
    height: 30px;
    display: inline;
}
body #banner .item .item-slide #topper-box .watch-trailer-ico span {
    width: 97px;
    height: 19px;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
    padding-left: 13px;
    vertical-align: -3px;
}
body #banner .slick-dots {
    position: absolute;
    bottom: 5%;
    list-style: none;
    display: block;
    text-align: left;
    padding: 0;
    margin: 0;
    width: 100%;
    left: 50px;
    z-index: 10;
}
body #banner .slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 3px;
    padding: 0;
    cursor: pointer;
}
body #banner .slick-dots li.slick-active button:before {
    width: 20px;
    height: 14px;
    border-radius: 8.4px;
    background-color: #ffffff;
}
body #banner .slick-dots li button:before {
    position: absolute;
    top: 0px;
    left: 0;
    content: "•";
    width: 22px;
    height: 20px;
    font-family: "slick";
    font-size: 11px;
    line-height: 18px;
    text-align: center;
    color: #ffffff;
    opacity: 0.5;
}
body #banner .item .item-slide::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(rgba(0, 0, 0, 0), #282828 100%, #1d1d1d);
    opacity: 1;
    height: auto;
}
body #bottom-box {
    position: absolute;
    width: 435px;
    border-radius: 4px;
    top: 320px;
    left: 35px;
    margin-left: 70px;
    margin-bottom: 200px;
    height: 160px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 200;
}
body #bottom-box .left-path {
    padding-right: 100px;
    padding-top: 40px;
}
body #bottom-box .left-path .bottom-text-box {
    width: 100%;
}
body #bottom-box .left-path .bottom-text-box .supertitle .title h1 {
    text-align: right;
    font-family: HelveticaNeue;
    font-size: 28px !important;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff !important;
}
body #bottom-box .left-path .bottom-text-box .supertitle .subtitle h2 {
    text-align: right;
    font-family: HelveticaNeue-light;
    font-size: 20px !important;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff !important;
}
body #bottom-box .left-path .bottom-text-box .icon-left-path {
    text-align: right;
    margin-top: 5px;
}
body #bottom-box .left-path .bottom-text-box .icon-left-path h4 {
    padding-right: 20px;
    vertical-align: text-top;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
body #bottom-box .left-path .bottom-text-box .icon-left-path img {
    display: inline;
    width: 34px;
    height: 34px;
    margin-top: 10px;
}
body #bottom-box .slider-tv-list .slick-prev:before,
body #bottom-box .slider-tv-list .slick-next:before {
    color: #ffffff;
}
body #bottom-box .slider-tv-list .slick-dots {
    bottom: -30px;
}
body #bottom-box .slider-tv-list .slick-slider {
    margin-top: 60px;
}
body #bottom-box .slider-tv-list .slick-prev,
body #bottom-box .slider-tv-list .slick-next {
    left: 50%;
    transform: translate(-50%, 0) rotate(90deg);
}
body #bottom-box .slider-tv-list .slick-next {
    top: unset;
    bottom: 30px;
    left: -20px;
}
body #bottom-box .slider-tv-list .slick-prev {
    top: 30px;
    left: -20px;
}
body #bottom-box .slider-tv-list .right-path {
    text-align: left;
    height: 131px;
    align-items: center;
    display: flex;
}
body #bottom-box .slider-tv-list .right-path .icon-left-path {
    text-align: left;
    margin-top: 25px;
    padding-left: 10px;
}
body #bottom-box .slider-tv-list .right-path .icon-left-path h4 {
    padding-right: 40px;
    vertical-align: text-top;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
body #bottom-box .slider-tv-list .right-path .icon-left-path img {
    display: inline;
    width: 47px;
    height: 57px;
    position: absolute;
    top: 27px;
    right: 25px;
}
body #bottom-box .slider-tv-list .right-path .icon-right img {
    display: inline;
    width: 34px;
    height: 34px;
    position: absolute;
    right: -106px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 100;
}
body #bottom-box .slider-tv-list .right-path .top-text-box {
    width: 100%;
}
body #bottom-box .slider-tv-list .right-path .top-text-box .tv-name h4 {
    width: 333px;
    height: 28px;
    font-family: "Open Sans Bold";
    font-size: 21px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.84px;
    color: #ffffff;
}
body #bottom-box .slider-tv-list .right-path .top-text-box .title {
    width: 100%;
    border-left: solid 2px #fa262f;
}
body #bottom-box .slider-tv-list .right-path .top-text-box .title h6 {
    padding-left: 17px;
    text-align: left;
    font-family: "Open Sans SemiBold";
    font-size: 20px !important;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff !important;
}
body #bottom-box .slider-tv-list .right-path .top-text-box .title h6.light {
    padding-left: 17px;
    text-align: left;
    font-family: HelveticaNeue-light;
    font-size: 20px !important;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff !important;
}
body #bottom-box .slider-tv-list .right-path .bottom-text-box {
    width: 100%;
    border-left: solid 2px #fa262f;
}
body #bottom-box .slider-tv-list .right-path .bottom-text-box .subtitle-light {
    width: 500px;
}
body
    #bottom-box
    .slider-tv-list
    .right-path
    .bottom-text-box
    .subtitle-light
    h7 {
    margin-left: 15px;
    text-align: left;
    font-family: "Open Sans Light";
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff !important;
}
body #bottom-box .slider-tv-list .right-path .bottom-text-box .subtitle-now h6 {
    margin-left: 15px;
    text-align: left;
    font-family: "Open Sans SemiBold";
    font-size: 20px !important;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff !important;
    width: 270%;
}
body
    #bottom-box
    .slider-tv-list
    .right-path
    .bottom-text-box
    .subtitle-next
    h6 {
    margin-left: 15px;
    text-align: left;
    font-family: HelveticaNeue-light;
    font-size: 18px !important;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff !important;
    width: 518px;
}
body #bottom-box .story {
    position: absolute;
    max-width: 500px;
    top: 220px;
    left: 20px;
}
body #bottom-box .story .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #bottom-box #story {
    margin-top: 0;
    padding: 0;
}
body #bottom-box #story .title {
    padding: 0 0 10px 15px;
}
body #bottom-box #story .title h4 {
    padding-top: 10px;
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #bottom-box #story #stories-slick {
    left: -1%;
}
body #bottom-box #story #stories-slick .slider-story {
    padding: 0 70px;
}
body #bottom-box #story #stories-slick .slider-story .slick-prev {
    left: 30px !important;
    top: 42px !important;
    fill: #111111;
}
body #bottom-box #story #stories-slick .slider-story .slick-next {
    right: 30px !important;
    top: 42px !important;
}
body #bottom-box #story #stories-slick .slider-story li a {
    color: #fff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
}
body #bottom-box #story #stories-slick .slider-story li a img.items {
    border-radius: 50%;
    border: 3px solid #fff;
    margin: 0 auto;
    width: 80px;
    height: 80px;
    background-position: center;
    background-size: cover;
}
body #bottom-box #story #stories-slick .slider-story li a p {
    padding-top: 10px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 125px;
}
body #bottom-box #story #stories-slick .slider-story li a:hover {
    text-decoration: none;
}
body .swiper-container-2 {
    width: 100%;
    height: 100%;
}
body .swiper-container-2 .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
body #slick-story {
    padding-top: 60px !important;
}
body .none {
    display: none;
}
body #zuck-modal {
    position: fixed !important;
}
body #zuck-modal-content {
    height: 500%;
}
body .tab-content > .tab-pane,
body .pill-content > .pill-pane {
    display: block;
    /* undo display:none          */
    height: 0;
    /* height:0 is also invisible */
    overflow-y: hidden;
    /* no-overflow                */
}
body .tab-content > .active,
body .pill-content > .active {
    height: auto;
    overflow-y: visible;
}
body #live-now {
    background-color: #282828;
    width: 100%;
    height: auto;
    padding-top: 200px;
    /* .swiper-slide .img-fluid:hover{ */
}
body #live-now .swiper-container {
    width: 100%;
    height: auto !important;
}
body #live-now .swiper-slide {
    transform: translateZ(0);
    transition: 0.2s linear;
    height: auto !important;
    width: 100%;
    padding-left: 10px;
}
body #live-now .swiper-slide .img-fluid {
    padding: 40px 0;
    transition: 0.2s linear;
}
body #live-now .swiper-slide:hover {
    margin: 0 40px !important;
    transform: scale(1.4);
    transition: 0.2s linear;
    position: relative;
    z-index: 999;
}
body #live-now .swiper-button-prev {
    color: #fff;
    opacity: 0.5;
    margin-left: -10px;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}
body #live-now .swiper-button-prev:hover {
    opacity: 1;
}
body #live-now .swiper-button-next {
    color: #fff;
    opacity: 0.5;
    margin-left: -10px;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}
body #live-now .swiper-button-next:hover {
    opacity: 1;
}
body #live-now .live-premier {
    padding: 0 20px;
}
body #live-now .live-premier .title {
    padding: 30px 0;
}
body #live-now .live-premier .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #live-now .live-premier .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
body #live-now .live-premier img {
    width: 200px;
}
body #live-now .live-premier ul {
    list-style: none;
    padding: 0;
}
body #live-now .live-premier li {
    display: inline-block;
}
body #live-now .live-premier .item {
    display: inline-block;
}
body #live-now .live-premier .btn-load-more {
    padding-bottom: 30px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
body #live-now .live-premier .btn-load-more:hover {
    background-color: transparent;
}
body #live-now .live-premier .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
body #live-now .live-premier .all a {
    color: #ffffff;
    text-decoration: none;
}
body #live-now .live-premier .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
body #live-now .live-premier .box19 img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}
body #live-now .live-premier .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
body #live-now .live-premier .box19 .live h7 {
    font-family: "Open Sans Bold Italic";
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #live-now .live-premier .box19 .countdown {
    position: absolute;
    bottom: 38px;
    right: 5px;
    color: #ffffff;
    background-color: white;
    z-index: 1;
    padding: 0 7px;
    border-radius: 5px;
    /* width: 36px; */
}
body #live-now .live-premier .box19 .countdown h7 {
    font-size: 11px;
    color: black;
    font-family: "Open Sans Regular";
}
body #live-now .live-premier .box19 .countdown #time {
    font-size: 12px;
    color: red;
    padding: 0;
    margin: 0;
    font-family: "Open Sans Bold";
    display: inline;
}
body #live-now .live-premier .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
body #live-now .live-premier .box19 .icon,
body #live-now .live-premier .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
body #live-now .live-premier .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
body #live-now .live-premier .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
body #live-now .live-premier .box19:hover .title {
    transform: scale(1);
}
body #live-now .live-premier .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
body #live-now .live-premier .box19:hover .icon {
    opacity: 1;
}
body #live-now .live-premier .box19 .icon li {
    display: inline-block;
}
body #live-now .live-premier .box19 .icon li:first-child a,
body #live-now .live-premier .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
body #live-now .live-premier .box19 .icon li a {
    top: -65px;
}
body #live-now .live-premier .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #live-now .live-premier .box19:hover .icon li a {
    top: -20px;
}
body #live-now .live-premier .box19:hover .icon li a:hover {
    background: transparent;
}
body #live-now .live-premier .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #live-now .live-premier .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #live-now .live-premier .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 90px;
    left: 0;
}
body #live-now .live-premier .box19:hover .subtitle {
    opacity: 1;
}
body #live-now .live-premier .box19 .subtitle li {
    display: inline-block;
}
body #live-now .live-premier .box19 .subtitle li:first-child a h5,
body #live-now .live-premier .box19 .subtitle li:last-child a h5 {
    display: block;
    line-height: 50px;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
body #live-now .live-premier .box19 .subtitle li a {
    top: -80px;
}
body #live-now .live-premier .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #live-now .live-premier .box19:hover .subtitle li a {
    top: -20px;
}
body #live-now .live-premier .box19:hover .subtitle li a:hover {
    background: transparent;
}
body #live-now .live-premier .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #live-now .live-premier .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #live-now .live-premier .box19 .now-playing {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 0;
}
body #live-now .live-premier .box19:hover .now-playing {
    opacity: 1;
}
body #live-now .live-premier .box19 .now-playing li {
    display: inline-block;
}
body #live-now .live-premier .box19 .now-playing li:first-child a h7,
body #live-now .live-premier .box19 .now-playing li:last-child a h7 {
    display: block;
    line-height: 50px;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-light;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
body #live-now .live-premier .box19 .now-playing li a {
    top: -80px;
}
body #live-now .live-premier .box19 .now-playing li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
body #live-now .live-premier .box19:hover .now-playing li a {
    top: -20px;
}
body #live-now .live-premier .box19:hover .now-playing li a:hover {
    background: transparent;
}
body #live-now .live-premier .box19 .now-playing li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #live-now .live-premier .box19 .now-playing li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    body #live-now .live-premier .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    body #live-now .live-premier .box19 .box-content {
        padding-top: 20%;
    }
}
body #popular {
    /*background-color: #1d1d1d;*/
    width: 100%;
    height: auto;
}
body #popular .popular-show {
    padding: 0 20px;
}
body #popular .popular-show .title {
    padding: 0px 0 30px 0;
}
body #popular .popular-show .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #popular .popular-show .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
body #popular .popular-show img {
    width: 200px;
}
body #popular .popular-show ul {
    list-style: none;
    padding: 0;
}
body #popular .popular-show li {
    display: inline-block;
}
body #popular .popular-show .item {
    display: inline-block;
}
body #popular .popular-show .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
body #popular .popular-show .btn-load-more:hover {
    background-color: transparent;
}
body #popular .popular-show .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
body #popular .popular-show .all a {
    color: #ffffff;
    text-decoration: none;
}
body #popular .popular-show .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
body #popular .popular-show .box19 img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}
body #popular .popular-show .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
body #popular .popular-show .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #popular .popular-show .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
body #popular .popular-show .box19 .icon,
body #popular .popular-show .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
body #popular .popular-show .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
body #popular .popular-show .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
body #popular .popular-show .box19:hover .title {
    transform: scale(1);
}
body #popular .popular-show .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
body #popular .popular-show .box19:hover .icon {
    opacity: 1;
}
body #popular .popular-show .box19 .icon li {
    display: inline-block;
}
body #popular .popular-show .box19 .icon li:first-child a,
body #popular .popular-show .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
body #popular .popular-show .box19 .icon li a {
    top: -65px;
}
body #popular .popular-show .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #popular .popular-show .box19:hover .icon li a {
    top: -20px;
}
body #popular .popular-show .box19:hover .icon li a:hover {
    background: transparent;
}
body #popular .popular-show .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #popular .popular-show .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #popular .popular-show .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 90px;
    left: 0;
}
body #popular .popular-show .box19:hover .subtitle {
    opacity: 1;
}
body #popular .popular-show .box19 .subtitle li {
    display: inline-block;
}
body #popular .popular-show .box19 .subtitle li:first-child a h5,
body #popular .popular-show .box19 .subtitle li:last-child a h5 {
    display: block;
    line-height: 50px;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
body #popular .popular-show .box19 .subtitle li a {
    top: -80px;
}
body #popular .popular-show .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #popular .popular-show .box19:hover .subtitle li a {
    top: -20px;
}
body #popular .popular-show .box19:hover .subtitle li a:hover {
    background: transparent;
}
body #popular .popular-show .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #popular .popular-show .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #popular .popular-show .box19 .now-playing {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 0;
}
body #popular .popular-show .box19:hover .now-playing {
    opacity: 1;
}
body #popular .popular-show .box19 .now-playing li {
    display: inline-block;
}
body #popular .popular-show .box19 .now-playing li:first-child a h7,
body #popular .popular-show .box19 .now-playing li:last-child a h7 {
    display: block;
    line-height: 50px;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-light;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
body #popular .popular-show .box19 .now-playing li a {
    top: -80px;
}
body #popular .popular-show .box19 .now-playing li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
body #popular .popular-show .box19:hover .now-playing li a {
    top: -20px;
}
body #popular .popular-show .box19:hover .now-playing li a:hover {
    background: transparent;
}
body #popular .popular-show .box19 .now-playing li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #popular .popular-show .box19 .now-playing li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    body #popular .popular-show .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    body #popular .popular-show .box19 .box-content {
        padding-top: 20%;
    }
}


body #set-category {
    overflow-y: hidden;
    background-color: #282828;
    width: 100%;
    height: auto;
}
body #set-category ::-webkit-scrollbar {
    display: none;
}
body #set-category .trend-cat {
    padding: 0 20px;
}
body #set-category .trend-cat .swiper-container {
    width: 100%;
    height: 100%;
    overflow: visible;
    scrollbar-width: none;
    padding-left: 16px;
}
body #set-category .trend-cat .swiper-container::-webkit-scrollbar {
    display: none;
}
body #set-category .trend-cat .swiper-slide::-webkit-scrollbar {
    display: none;
}
body #set-category .trend-cat .swiper-slide {
    text-align: left;
    font-size: 18px;
    /* Update: Removed the Flex property - IE FIX */
}
body #set-category .trend-cat .swiper-wrapper {
    width: 100%;
    opacity: 1;
}
body #set-category .trend-cat .swiper-slide {
    /* transition: 250ms ease-in; */
    height: auto !important;
}
body #set-category .trend-cat .swiper-slide .img-fluid {
    /* transition: 0.2s linear; } */
}

body #set-category .trend-cat .swiper-slide .item a {
    font-size: 24px;
    font-weight: bold;
    left: 60px;
    top: 50px;
    position: absolute;
}

body #set-category .trend-cat .swiper-slide:hover {
    /* transform: scale(1.2); */
    z-index: 9999;
    border-radius: 5px;
}

body #set-category .trend-cat .title_wt {
    background-color:#000000;
    height:82px;
    padding-left:16px;
    padding-right:16px;
    padding-top:8px;
    border-radius: 0px 0px 8px 8px;
}

body #set-category .trend-cat .swiper-wrapper.disabled {
    transform: translate3d(0px, 0, 0) !important;
}

body #set-category .trend-cat .swiper-pagination.disabled {
    display: none;
}

body #set-category .trend-cat .swiper-button-next {
    right: -30px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 10);
    outline:none;
    cursor: pointer;
    opacity: 0;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(transparent),
        color-stop(rgba(12, 17, 27, 0.7)),
        to(rgba(12, 17, 27, 0.9))
    );

    /* background gradient swiper by, ghaniy */
    background: linear-gradient(270deg, #282828 0%, rgba(40, 40, 40, 0) 100%);
}

body #set-category .trend-cat .swiper-button-next:hover {
    opacity: 1;
}

body #set-category .trend-cat .swiper-button-prev {
    left: -30px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 10);
    outline:none;
    cursor: pointer;
    opacity: 0;
    background: linear-gradient(90deg, #282828 0%, rgba(40, 40, 40, 0) 100%);
}

body #set-category .trend-cat .swiper-button-prev:hover {
    opacity: 1;
}

body #set-category .trend-cat .swiper-button-next:after,
body #set-category .trend-cat .swiper-container-rtl .swiper-button-prev:after {
    content: "next";
    color: white;
}
body #set-category .trend-cat .swiper-button-prev:after,
body #set-category .trend-cat .swiper-container-rtl .swiper-button-prev:after {
    content: "prev";
    color: white;
}

body #set-category .trend-cat .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
body #set-category .trend-cat img {
    width: 200px;
}
body #set-category .trend-cat ul {
    list-style: none;
    padding: 0;
}
body #set-category .trend-cat li {
    display: inline-block;
}

.zhov{
    z-index: 100;
}

.sht {
    margin-right: 10px;
    transition: ease-in transform .2.5s;
    transition-delay:  0.6s;
}

.sht:hover {
    -ms-transform: scale(1.2) !important; /* IE 9 */
    -webkit-transform: scale(1.2) !important; /* Safari 3-8 */
    transform: scale(1.2) !important;
    z-index: 1005 !important;
}

.shtstory {
    margin-right: 10px;
    transition: all 2s cubic-bezier(.55, 0, .1, 1);
}

.shtstory:hover {
    -ms-transform: scale(1.2) !important; /* IE 9 */
    -webkit-transform: scale(1.2) !important; /* Safari 3-8 */
    transform: scale(1.2) !important;
}


.lineup-container{
    left: 80px;
    width: 100vw;
    padding-left: 0px;
}

.lineup-container-thematic{
    left: 80px;
    width: 100vw;
    padding-left: 0px;
}

.zelHov{
    z-index: 1;
}

.row-trend {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
  }

body #now-trending {
    /* overflow-y: hidden; */
    background-color: #282828;
    width: 100%;
    height: auto;
}

.is_tablet{
    overflow-y: hidden;
}

@media screen and (max-device-width: 1000px) and (orientation: landscape) {
    .lineup-container {
        width: 93vw;
    }
    .row-trend {
        overflow-y: hidden;
        margin-right: 0px;
    }
    .row{
        margin-left: 30px;
    }
    .row-category {
        overflow: hidden;
        width: 93vw;
    }
    .navbar-icon-top.navbar-expand-md .navbar-nav .nav-link {
        color: #8F8F8F;
    }

    body #bottom-box {
        top: 80px;
    }
    .swiper-button-next{
        display: none;
    }
    .swiper-button-prev{
        display: none;
    }

}

@media screen and (max-device-width: 850px) and (orientation: portrait) {
    .lineup-container {
        width: 93vw;
    }
    .row-trend {
        overflow-y: hidden;
        margin-right: 0px;
    }
    .row{
        margin-left: 30px;
    }
    .row-category {
        overflow: hidden;
        width: 93vw;
    }
    .navbar-icon-top.navbar-expand-md .navbar-nav .nav-link {
        color: #8F8F8F;
    }

    body #bottom-box {
        top: 130px;
    }

    .swiper-button-next{
        display: none;
    }

    .swiper-button-prev{
        display: none;
    }

}

body #now-trending ::-webkit-scrollbar {
    display: none;
}
body #now-trending .trending {
    padding: 0px;
}
body #now-trending .trending .swiper-container {
    width: 100%;
    height: 100%;
    overflow: visible;
    scrollbar-width: none;
}

body #now-trending .trending .swiper-container-thematic {
    width: calc(100vw - 590px);
    height: 100%;
    overflow: hidden;
    scrollbar-width: none;
    left: -45px;
}


body #now-trending .trending .swiper-container::-webkit-scrollbar {
    display: none;
}
body #now-trending .trending .swiper-slide::-webkit-scrollbar {
    display: none;
}
body #now-trending .trending .swiper-slide {
    text-align: left;
    font-size: 18px;
    /* Update: Removed the Flex property - IE FIX */
}
body #now-trending .trending .swiper-wrapper {
    width: 100%;
    opacity: 1;
}
body #now-trending .trending .swiper-slide {
    /* transition: 250ms ease-in; */
    height: auto !important;
}
body #now-trending .trending .swiper-slide .img-fluid {
    /* transition: 0.2s linear; } */
}
/* body #now-trending .trending .swiper-slide:hover { */
    /* transform: scale(1.2); */
    /* z-index: 9999;
    border-radius: 5px;
} */

body #now-trending .trending .title_wt {
    background-color:#000000;
    height:82px;
    padding-left:16px;
    padding-right:16px;
    padding-top:8px;
    border-radius: 0px 0px 8px 8px;
}

body #now-trending .trending .swiper-wrapper.disabled {
    transform: translate3d(0px, 0, 0) !important;
}
body #now-trending .trending .swiper-pagination.disabled {
    display: none;
}

body #now-trending .trending .swiper-button-prev-thm {
    left: -80px;
    z-index: 2;
    position: absolute;
    top: 110;
    height: 60%;
    width: calc(calc(100vw - 165px) / 10);
    cursor: pointer;
    /* opacity: 0; */
    outline:none;
    /* background gradient swiper by, ghaniy */
    background: linear-gradient(90deg, #282828 0%, rgba(40, 40, 40, 0) 100%);

}
body #now-trending .trending .swiper-button-prev-thm:hover {
    opacity: 1;
}

body #now-trending .trending .swiper-button-next-thm {
    right: 0px;
    z-index: 2;
    position: absolute;
    top: 60;
    height: 100%;
    width: calc(calc(100vw - 165px) / 10);
    cursor: pointer;
    /* opacity: 0; */
    outline:none;
    background: linear-gradient(270deg, #282828 0%, rgba(40, 40, 40, 0) 100%);
}
body #now-trending .trending .swiper-button-next-thm:hover {
    opacity: 1;
}

body #now-trending .trending .swiper-button-prev {
    left: -80px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 10);
    cursor: pointer;
    /* opacity: 0; */
    outline:none;
    /* background gradient swiper by, ghaniy */
    background: linear-gradient(90deg, #282828 0%, rgba(40, 40, 40, 0) 100%);

    /* background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(transparent),
        color-stop(rgba(12, 17, 27, 0.7)),
        to(rgba(12, 17, 27, 0.9))
    );
    background: -webkit-linear-gradient(
        right,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: -o-linear-gradient(
        right,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: linear-gradient(
        to left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
     */
    /* -webkit-transition: opacity 0.6s ease-out;
        -o-transition: opacity 0.6s ease-out;
        transition: opacity 0.6s ease-out; } */
}
body #now-trending .trending .swiper-button-prev:hover {
    opacity: 1;
}
body #now-trending .trending .swiper-button-next {
    right: 80px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 10);
    cursor: pointer;
    /* opacity: 0; */
    outline:none;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(transparent),
        color-stop(rgba(12, 17, 27, 0.7)),
        to(rgba(12, 17, 27, 0.9))
    );

    /* background gradient swiper by, ghaniy */
    background: linear-gradient(270deg, #282828 0%, rgba(40, 40, 40, 0) 100%);

    /* background: -webkit-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: -o-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: linear-gradient(
        to right,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    ); */
    /* -webkit-transition: opacity 0.6s ease-out;
        -o-transition: opacity 0.6s ease-out;
        transition: opacity 0.6s ease-out; } */
}

@media (max-width: 1100px) {
    body #now-trending .trending .swiper-button-next{
        right: 80px;
    }
}
body #now-trending .trending .swiper-button-next:hover {
    opacity: 1;
}
body #now-trending .trending .swiper-button-next:after,
body #now-trending .trending .swiper-container-rtl .swiper-button-prev:after {
    content: "next";
    color: white;
}
body #now-trending .trending .swiper-button-prev:after,
body #now-trending .trending .swiper-container-rtl .swiper-button-prev:after {
    content: "prev";
    color: white;
}
body #now-trending .trending .title {
    padding: 0px 0 15px 0;
}
body #now-trending .trending .title h2 {
    color: white;
    font-family: "Open Sans SemiBold";
    font-size: 21px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #now-trending .trending .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
body #now-trending .trending img {
    /* width: 200px; */
}
body #now-trending .trending ul {
    list-style: none;
    padding: 0;
}
body #now-trending .trending li {
    display: inline-block;
}
body #now-trending .trending .item {
    /* display: inline-block; */
}
body #now-trending .trending .btn-load-more {
    padding-bottom: 30px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
body #now-trending .trending .btn-load-more:hover {
    background-color: transparent;
}
body #now-trending .trending .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
body #now-trending .trending .all a {
    color: #ffffff;
    text-decoration: none;
}
body #now-trending .trending .box20 {
    position: relative;
}
body #now-trending .trending .box20 progress[value] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    height: 5px;
    /* For IE10 */
    color: red;
    position: absolute;
    bottom: 45px;
    width: 94%;
    text-align: center;
    left: 10px;
}
body #now-trending .trending .box20 progress[value]::-webkit-progress-value {
    background-color: red;
}
body #now-trending .trending .box20 progress[value]::-moz-progress-bar {
    background-color: red;
}
body #now-trending .trending .box20s img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}
body #now-trending .trending .box20 img {
    width: 100%;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

body #now-trending .trending .box20 .box-content {
    width: 30%;
    height: 86%;
    background: 0 0;
    padding-top: 15%;
    position: absolute;
    top: 0px;
    left: 0;
    transition: all 0.3s ease 0s;
    margin-left: 100px;
    border-radius: 4px;
}
body #now-trending .trending .box20 .box-content-autoplay {
    width: 100%;
    background: none;
    padding-top: 25%;
    position: absolute;
    top: 0px;
    left: 0;
    transition: all 0.3s ease 0s;
    border-radius: 4px;
}
body #now-trending .trending .box19 {
    /* padding-bottom: 30px; */
    position: relative;
}
body #now-trending .trending .box19 progress[value] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    height: 5px;
    /* For IE10 */
    color: red;
    position: absolute;
    bottom: 45px;
    width: 94%;
    text-align: center;
    left: 10px;
}
body #now-trending .trending .box19 progress[value]::-webkit-progress-value {
    background-color: red;
}
body #now-trending .trending .box19 progress[value]::-moz-progress-bar {
    background-color: red;
}
body #now-trending .trending .box19 img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}

body #now-trending .trending .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
body #now-trending .trending .box19 .live h7 {
    font-family: "Open Sans Bold Italic";
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #now-trending .trending .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
body #now-trending .trending .box19 .live h7 {
    font-family: "Open Sans Bold Italic";
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #now-trending .trending .live2 {
    position: absolute;
    top: 5;
    left: 5;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 7px;
    border-radius: 5px;
}

body #now-trending .trending .live2 h7 {
    font-family: "Open Sans Bold";
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #now-trending .trending .countdown {
    position: absolute;
    left: 0px;
    color: #ffffff;
    background-color: white;
    z-index: 1;
    padding: 0px 7px 0px 7px;
    border-radius: 5px;
}

body #now-trending .trending .countdown h7 {
    font-size: 11px;
    color: black;
    font-family: "Open Sans SemiBold";
}

body #now-trending .trending .countdown .playing-now-button {
    font-size: 12px;
    color: red !important;
    margin-bottom: 0rem;
}

body #now-trending .trending .box19 .countdown {
    position: absolute;
    bottom: 38px;
    right: 5px;
    color: #ffffff;
    background-color: white;
    z-index: 1;
    padding: 0 7px;
    border-radius: 5px;
    /* width: 36px; */
}
body #now-trending .trending .countdown #time {
    font-size: 10px;
    color: red;
    padding: 0;
    margin: 0;
    font-family: "Open Sans Bold";
    display: inline;
}
body #now-trending .trending .box19 .countdown h7 {
    font-size: 11px;
    color: black;
    font-family: "Open Sans Regular";
}
body #now-trending .trending .box19 .countdown #time {
    font-size: 12px;
    color: red;
    padding: 0;
    margin: 0;
    font-family: "Open Sans Bold";
    display: inline;
}
body #now-trending .trending .box19 .box-content {
    width: 100%;
    height: 86%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: 0px;
    left: 0;
    transition: all 0.3s ease 0s;
    border-radius: 4px;
}
body #now-trending .trending .box19 .box-content-autoplay {
    width: 100%;
    background: none;
    padding-top: 25%;
    position: absolute;
    top: 0px;
    left: 0;
    transition: all 0.3s ease 0s;
    border-radius: 4px;
}
body #now-trending .trending .box19 .icon,
body #now-trending .trending .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
body #now-trending .trending .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
body #now-trending .trending .box19:hover .title {
    transform: scale(1);
}
body #now-trending .trending .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -30px 0 0 0;
    opacity: 0;
}
body #now-trending .trending .box19:hover .icon {
    opacity: 1;
}
body #now-trending .trending .box19 .icon li {
    display: inline-block;
}
body #now-trending .trending .box19 .icon li:first-child a,
body #now-trending .trending .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
body #now-trending .trending .box19 .icon li a {
    top: -50px;
}
body #now-trending .trending .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #now-trending .trending .box19:hover .icon li a {
    top: -10px;
}
body #now-trending .trending .box19:hover .icon li a:hover {
    background: transparent;
}
body #now-trending .trending .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #now-trending .trending .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #now-trending .trending .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 80px;
    left: 0;
}
body #now-trending .trending .box19:hover .subtitle {
    opacity: 1;
}
body #now-trending .trending .box19 .subtitle li {
    display: inline-block;
}
body #now-trending .trending .box19 .subtitle li:first-child a h5,
body #now-trending .trending .box19 .subtitle li:last-child a h5 {
    display: block;
    line-height: 1 !important;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
body #now-trending .trending .box19 .subtitle li:first-child a span,
body #now-trending .trending .box19 .subtitle li:last-child a span {
    display: block;
    line-height: 1 !important;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    position: absolute;
    top: 50px;
    left: 5px;
}
body #now-trending .trending .box19 .subtitle li a {
    top: -80px;
}
body #now-trending .trending .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #now-trending .trending .box19:hover .subtitle li a {
    top: -20px;
}
body #now-trending .trending .box19:hover .subtitle li a:hover {
    background: transparent;
}
body #now-trending .trending .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #now-trending .trending .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #now-trending .trending .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 5px;
}
body #now-trending .trending .box19:hover .description {
    opacity: 1;
}
body #now-trending .trending .box19 .description li {
    display: inline-block;
}
body #now-trending .trending .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
body #now-trending .trending .box19 .description li:first-child,
body #now-trending .trending .box19 .description li:second-child {
    padding-left: 10px !important;
}
body #now-trending .trending .box19 .description li a {
    top: -80px;
}
body #now-trending .trending .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
body #now-trending .trending .box19:hover .description li a {
    top: -20px;
}
body #now-trending .trending .box19:hover .description li a:hover {
    background: transparent;
}
body #now-trending .trending .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #now-trending .trending .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    body #now-trending .trending .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    body #now-trending .trending .box19 .box-content {
        padding-top: 20%;
    }
}
body #new-episodes {
    /*background-color: #1d1d1d;*/
    width: 100%;
    height: auto;
}
body #new-episodes .episodes {
    padding: 0 20px;
}
body #new-episodes .episodes .title {
    padding: 0px 0 30px 0;
}
body #new-episodes .episodes .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #new-episodes .episodes .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
body #new-episodes .episodes img {
    width: 200px;
}
body #new-episodes .episodes ul {
    list-style: none;
    padding: 0;
}
body #new-episodes .episodes li {
    display: inline-block;
}
body #new-episodes .episodes .item {
    display: inline-block;
}
body #new-episodes .episodes .btn-load-more {
    padding-bottom: 30px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
body #new-episodes .episodes .btn-load-more:hover {
    background-color: transparent;
}
body #new-episodes .episodes .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
body #new-episodes .episodes .all a {
    color: #ffffff;
    text-decoration: none;
}
body #new-episodes .episodes .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
body #new-episodes .episodes .box19 img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}
body #new-episodes .episodes .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
body #new-episodes .episodes .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #new-episodes .episodes .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
body #new-episodes .episodes .box19 .icon,
body #new-episodes .episodes .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
body #new-episodes .episodes .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
body #new-episodes .episodes .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
body #new-episodes .episodes .box19:hover .title {
    transform: scale(1);
}
body #new-episodes .episodes .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -30px 0 0 0;
    opacity: 0;
}
body #new-episodes .episodes .box19:hover .icon {
    opacity: 1;
}
body #new-episodes .episodes .box19 .icon li {
    display: inline-block;
}
body #new-episodes .episodes .box19 .icon li:first-child a,
body #new-episodes .episodes .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
body #new-episodes .episodes .box19 .icon li a {
    top: -50px;
}
body #new-episodes .episodes .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #new-episodes .episodes .box19:hover .icon li a {
    top: -10px;
}
body #new-episodes .episodes .box19:hover .icon li a:hover {
    background: transparent;
}
body #new-episodes .episodes .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #new-episodes .episodes .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #new-episodes .episodes .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 80px;
    left: 0;
}
body #new-episodes .episodes .box19:hover .subtitle {
    opacity: 1;
}
body #new-episodes .episodes .box19 .subtitle li {
    display: inline-block;
}
body #new-episodes .episodes .box19 .subtitle li:first-child a h5,
body #new-episodes .episodes .box19 .subtitle li:last-child a h5 {
    display: block;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
body #new-episodes .episodes .box19 .subtitle li:first-child a p,
body #new-episodes .episodes .box19 .subtitle li:last-child a p {
    display: block;
    line-height: 0 !important;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    position: absolute;
    top: 65px;
    left: 5px;
}
body #new-episodes .episodes .box19 .subtitle li a {
    top: -80px;
}
body #new-episodes .episodes .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #new-episodes .episodes .box19:hover .subtitle li a {
    top: -20px;
}
body #new-episodes .episodes .box19:hover .subtitle li a:hover {
    background: transparent;
}
body #new-episodes .episodes .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #new-episodes .episodes .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #new-episodes .episodes .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 5px;
}
body #new-episodes .episodes .box19:hover .description {
    opacity: 1;
}
body #new-episodes .episodes .box19 .description li {
    display: inline-block;
}
body #new-episodes .episodes .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
body #new-episodes .episodes .box19 .description li:first-child,
body #new-episodes .episodes .box19 .description li:second-child {
    padding-left: 10px !important;
}
body #new-episodes .episodes .box19 .description li a {
    top: -80px;
}
body #new-episodes .episodes .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
body #new-episodes .episodes .box19:hover .description li a {
    top: -20px;
}
body #new-episodes .episodes .box19:hover .description li a:hover {
    background: transparent;
}
body #new-episodes .episodes .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #new-episodes .episodes .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    body #new-episodes .episodes .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    body #new-episodes .episodes .box19 .box-content {
        padding-top: 20%;
    }
}
body #latest-clips {
    background-color: #282828;
    width: 100%;
    height: auto;
}
body #latest-clips .clips {
    padding: 0 20px;
}
body #latest-clips .clips .title {
    padding: 0px 0 30px 0;
}
body #latest-clips .clips .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #latest-clips .clips .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
body #latest-clips .clips img {
    width: 200px;
}
body #latest-clips .clips ul {
    list-style: none;
    padding: 0;
}
body #latest-clips .clips li {
    display: inline-block;
}
body #latest-clips .clips .item {
    display: inline-block;
}
body #latest-clips .clips .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
body #latest-clips .clips .btn-load-more:hover {
    background-color: transparent;
}
body #latest-clips .clips .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
body #latest-clips .clips .all a {
    color: #ffffff;
    text-decoration: none;
}
body #latest-clips .clips .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
body #latest-clips .clips .box19 img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}
body #latest-clips .clips .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
body #latest-clips .clips .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #latest-clips .clips .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
body #latest-clips .clips .box19 .icon,
body #latest-clips .clips .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
body #latest-clips .clips .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
body #latest-clips .clips .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
body #latest-clips .clips .box19:hover .title {
    transform: scale(1);
}
body #latest-clips .clips .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -50px 0 0 0;
    opacity: 0;
}
body #latest-clips .clips .box19:hover .icon {
    opacity: 1;
}
body #latest-clips .clips .box19 .icon li {
    display: inline-block;
}
body #latest-clips .clips .box19 .icon li:first-child a,
body #latest-clips .clips .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
body #latest-clips .clips .box19 .icon li a {
    top: -35px;
}
body #latest-clips .clips .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #latest-clips .clips .box19:hover .icon li a {
    top: -20px;
}
body #latest-clips .clips .box19:hover .icon li a:hover {
    background: transparent;
}
body #latest-clips .clips .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #latest-clips .clips .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #latest-clips .clips .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
}
body #latest-clips .clips .box19:hover .subtitle {
    opacity: 1;
}
body #latest-clips .clips .box19 .subtitle li {
    display: inline-block;
}
body #latest-clips .clips .box19 .subtitle li:first-child a h7,
body #latest-clips .clips .box19 .subtitle li:last-child a h7 {
    display: block;
    font-size: 13px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
body #latest-clips .clips .box19 .subtitle li:first-child a span,
body #latest-clips .clips .box19 .subtitle li:last-child a span {
    display: block;
    font-size: 10px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
body #latest-clips .clips .box19 .subtitle li a {
    top: -80px;
}
body #latest-clips .clips .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #latest-clips .clips .box19:hover .subtitle li a {
    top: -20px;
}
body #latest-clips .clips .box19:hover .subtitle li a:hover {
    background: transparent;
}
body #latest-clips .clips .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #latest-clips .clips .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #latest-clips .clips .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
}
body #latest-clips .clips .box19:hover .description {
    opacity: 1;
}
body #latest-clips .clips .box19 .description li {
    display: inline-block;
}
body #latest-clips .clips .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
body #latest-clips .clips .box19 .description li:first-child,
body #latest-clips .clips .box19 .description li:second-child {
    padding-left: 10px !important;
}
body #latest-clips .clips .box19 .description li a {
    top: -80px;
}
body #latest-clips .clips .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
body #latest-clips .clips .box19:hover .description li a {
    top: -20px;
}
body #latest-clips .clips .box19:hover .description li a:hover {
    background: transparent;
}
body #latest-clips .clips .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #latest-clips .clips .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    body #latest-clips .clips .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    body #latest-clips .clips .box19 .box-content {
        padding-top: 20%;
    }
}
body #not-seen-on-tv {
    /*background-color: #1d1d1d;*/
    width: 100%;
    height: auto;
}
body #not-seen-on-tv .seen-on-tv {
    padding: 0 20px;
}
body #not-seen-on-tv .seen-on-tv .title {
    padding: 0px 0 30px 0;
}
body #not-seen-on-tv .seen-on-tv .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #not-seen-on-tv .seen-on-tv .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
body #not-seen-on-tv .seen-on-tv img {
    width: 200px;
}
body #not-seen-on-tv .seen-on-tv ul {
    list-style: none;
    padding: 0;
}
body #not-seen-on-tv .seen-on-tv li {
    display: inline-block;
}
body #not-seen-on-tv .seen-on-tv .item {
    display: inline-block;
}
body #not-seen-on-tv .seen-on-tv .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
body #not-seen-on-tv .seen-on-tv .btn-load-more:hover {
    background-color: transparent;
}
body #not-seen-on-tv .seen-on-tv .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
body #not-seen-on-tv .seen-on-tv .all a {
    color: #ffffff;
    text-decoration: none;
}
body #not-seen-on-tv .seen-on-tv .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
body #not-seen-on-tv .seen-on-tv .box19 img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}
body #not-seen-on-tv .seen-on-tv .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
body #not-seen-on-tv .seen-on-tv .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #not-seen-on-tv .seen-on-tv .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
body #not-seen-on-tv .seen-on-tv .box19 .icon,
body #not-seen-on-tv .seen-on-tv .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
body #not-seen-on-tv .seen-on-tv .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
body #not-seen-on-tv .seen-on-tv .box19:hover .title {
    transform: scale(1);
}
body #not-seen-on-tv .seen-on-tv .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -50px 0 0 0;
    opacity: 0;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .icon {
    opacity: 1;
}
body #not-seen-on-tv .seen-on-tv .box19 .icon li {
    display: inline-block;
}
body #not-seen-on-tv .seen-on-tv .box19 .icon li:first-child a,
body #not-seen-on-tv .seen-on-tv .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
body #not-seen-on-tv .seen-on-tv .box19 .icon li a {
    top: -35px;
}
body #not-seen-on-tv .seen-on-tv .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .icon li a {
    top: -20px;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .icon li a:hover {
    background: transparent;
}
body #not-seen-on-tv .seen-on-tv .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #not-seen-on-tv .seen-on-tv .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #not-seen-on-tv .seen-on-tv .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .subtitle {
    opacity: 1;
}
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li {
    display: inline-block;
}
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li:first-child a h7,
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li:last-child a h7 {
    display: block;
    font-size: 13px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li:first-child a span,
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li:last-child a span {
    display: block;
    font-size: 10px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li a {
    top: -80px;
}
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .subtitle li a {
    top: -20px;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .subtitle li a:hover {
    background: transparent;
}
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #not-seen-on-tv .seen-on-tv .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #not-seen-on-tv .seen-on-tv .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .description {
    opacity: 1;
}
body #not-seen-on-tv .seen-on-tv .box19 .description li {
    display: inline-block;
}
body #not-seen-on-tv .seen-on-tv .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
body #not-seen-on-tv .seen-on-tv .box19 .description li:first-child,
body #not-seen-on-tv .seen-on-tv .box19 .description li:second-child {
    padding-left: 10px !important;
}
body #not-seen-on-tv .seen-on-tv .box19 .description li a {
    top: -80px;
}
body #not-seen-on-tv .seen-on-tv .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .description li a {
    top: -20px;
}
body #not-seen-on-tv .seen-on-tv .box19:hover .description li a:hover {
    background: transparent;
}
body #not-seen-on-tv .seen-on-tv .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #not-seen-on-tv .seen-on-tv .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    body #not-seen-on-tv .seen-on-tv .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    body #not-seen-on-tv .seen-on-tv .box19 .box-content {
        padding-top: 20%;
    }
}
body #update-news {
    background-color: #282828;
    width: 100%;
    height: auto;
}
body #update-news .news {
    padding: 0 20px;
}
body #update-news .news .title {
    padding: 0px 0 30px 0;
}
body #update-news .news .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
body #update-news .news .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
body #update-news .news img {
    width: 200px;
}
body #update-news .news ul {
    list-style: none;
    padding: 0;
}
body #update-news .news li {
    display: inline-block;
}
body #update-news .news .item {
    display: inline-block;
}
body #update-news .news .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
body #update-news .news .btn-load-more:hover {
    background-color: transparent;
}
body #update-news .news .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
body #update-news .news .all a {
    color: #ffffff;
    text-decoration: none;
}
body #update-news .news .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
body #update-news .news .box19 img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}
body #update-news .news .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
body #update-news .news .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
body #update-news .news .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
body #update-news .news .box19 .icon,
body #update-news .news .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
body #update-news .news .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
body #update-news .news .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
body #update-news .news .box19:hover .title {
    transform: scale(1);
}
body #update-news .news .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -50px 0 0 0;
    opacity: 0;
}
body #update-news .news .box19:hover .icon {
    opacity: 1;
}
body #update-news .news .box19 .icon li {
    display: inline-block;
}
body #update-news .news .box19 .icon li:first-child a,
body #update-news .news .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
body #update-news .news .box19 .icon li a {
    top: -35px;
}
body #update-news .news .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #update-news .news .box19:hover .icon li a {
    top: -20px;
}
body #update-news .news .box19:hover .icon li a:hover {
    background: transparent;
}
body #update-news .news .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #update-news .news .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #update-news .news .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
}
body #update-news .news .box19:hover .subtitle {
    opacity: 1;
}
body #update-news .news .box19 .subtitle li {
    display: inline-block;
}
body #update-news .news .box19 .subtitle li:first-child a h7,
body #update-news .news .box19 .subtitle li:last-child a h7 {
    display: block;
    font-size: 13px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
body #update-news .news .box19 .subtitle li:first-child a span,
body #update-news .news .box19 .subtitle li:last-child a span {
    display: block;
    font-size: 10px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
body #update-news .news .box19 .subtitle li a {
    top: -80px;
}
body #update-news .news .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
body #update-news .news .box19:hover .subtitle li a {
    top: -20px;
}
body #update-news .news .box19:hover .subtitle li a:hover {
    background: transparent;
}
body #update-news .news .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #update-news .news .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
body #update-news .news .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
}
body #update-news .news .box19:hover .description {
    opacity: 1;
}
body #update-news .news .box19 .description li {
    display: inline-block;
}
body #update-news .news .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
body #update-news .news .box19 .description li:first-child,
body #update-news .news .box19 .description li:second-child {
    padding-left: 10px !important;
}
body #update-news .news .box19 .description li a {
    top: -80px;
}
body #update-news .news .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
body #update-news .news .box19:hover .description li a {
    top: -20px;
}
body #update-news .news .box19:hover .description li a:hover {
    background: transparent;
}
body #update-news .news .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
body #update-news .news .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    body #update-news .news .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    body #update-news .news .box19 .box-content {
        padding-top: 20%;
    }
}
body #footer {
    background-color: #212121;
    min-height: 100px;
    width: 100%;
    margin-top: auto !important;
}
body #footer .line-socmed {
    padding: 20px 20px 0 20px;
}
body #footer .line-socmed .socmed {
    height: 35px;
    margin-right: 15px;
}
body #footer .footer-menu {
    line-height: 100px;
    min-height: 100px;
    padding: 7px 0;
}
body #footer .footer-menu ul li {
    margin-right: 30px;
    padding-left: 20px;
}
body #footer .footer-menu ul li a {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
    text-decoration: none;
}
body #footer .store {
    color: #fff;
    line-height: 100px;
    min-height: 100px;
    padding: 7px 0;
    text-align: right;
}

body #footer .swiper-container-footer {
    overflow: hidden;
    border-radius: 16px;
    background: #282828;
    padding: 16px;
    /* width: 448px; */
    margin: auto;
    margin-right: 0px;
}

body #footer .swiper-slide a {
    display: block;
    margin: 0 8px;
    background: #000;
    border-radius: 8px;
}

body #footer .swiper-container-footer .swiper-button-next-footer {
    left: calc(100%);
    z-index: 2;
    position: absolute;
    top: 50%;
    height: 32px;
    transform: translateY(-50%);
    width: 32px;
    cursor: pointer;
    outline: none;
    display: flex;
    align-items: center;
}

body #footer .swiper-container-footer .swiper-button-prev-footer {
    right: calc(100% - 10px);
    z-index: 2;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    height: 32px;
    width: 32px;
    cursor: pointer;
    outline: none;
    display: flex;
    align-items: center;
}

.box-shadow:after {
    content: "";
    position: absolute;
    width: 100%;
    bottom: 1px;
    z-index: 1;
    transform: scale(1);
    box-shadow: 0 3px 5px 0.5px #000;
}

.sidenav-animation {
    animation: sidenav-animate 2s;
    right: 0;
}

@keyframes sidenav-animate {
    from {
        right: -320px;
    }
    to {
        right: 0;
    }
}
.sidenav-hide {
    right: -320px;
}

.sidenav-hide-animation {
    animation: sidenav-hide-animate 2s;
    right: -320px;
}

@keyframes sidenav-hide-animate {
    from {
        right: 0px;
    }
    to {
        right: -320px;
    }
}
.main-nav-show {
    animation: main-nav-show-animate 2s;
    width: calc(100% - 320px);
}
@keyframes main-nav-show-animate {
    from {
        width: 100%;
    }
    to {
        width: calc(100% - 320px);
    }
}
.main-nav-hide {
    animation: main-nav-hide-animate 2s;
    width: 100%;
}
@keyframes main-nav-hide-animate {
    from {
        width: calc(100% - 320px);
    }
    to {
        width: 100%;
    }
}

.icn-login-show {
    animation: icn-login-show-animate 2s;
    opacity: 1;
}
@keyframes icn-login-show-animate {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.icn-login-hide {
    animation: icn-login-hide-animate 2s;
    opacity: 0;
}
@keyframes icn-login-hide-animate {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

.sidenav {
    height: 100%;
    width: 320px;
    position: fixed;
    z-index: 1;
    top: 0;
    background-color: #212121;
    overflow-x: hidden;
    padding-top: 60px;
}
.sidenav .profile {
    padding: 10px 20px;
    text-decoration: none;
    font-size: 18px;
    color: white;
    display: block;
    object-fit: contain;
}
.sidenav .profile:hover {
    color: #fff;
    text-decoration: none;
}
.sidenav .profile img {
    height: 45px;
}
.sidenav .profile .akun {
    display: inline-block;
}
.sidenav .profile .email {
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    color: #ffffff;
}
.sidenav .profile .display_name {
    font-family: "Open Sans Bold";
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    color: #ffffff;
}
.sidenav .profile .btn-login {
    background-color: red;
    padding: 5px 20px;
    color: white;
    border: none;
    border-radius: 4px;
    margin-left: 10px;
    font-family: "Open Sans Bold";
    font-size: 16.8px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.67px;
    text-align: center;
    color: #ffffff;
}
.sidenav a {
    font-family: "Open Sans Regular";
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.72px;
    color: #ffffff;
    padding: 10px 20px;
    text-decoration: none;
    color: white;
    display: block;
    border-top: solid 1px #333333;
}
.sidenav a:hover {
    color: #fff;
    text-decoration: none;
}
.sidenav a img {
    margin-right: 20px;
    width: 30px;
    height: 35px;
    object-fit: contain;
}
.sidenav .closebtn {
    position: absolute;
    top: 16px;
    font-size: 36px;
    border: 0px;
    padding: 0;
    margin-left: 10px;
}
.sidenav .btn-logout {
    bottom: 0 !important;
    object-fit: contain;
    position: fixed;
    text-align: center;
    display: inline-block;
    width: inherit;
    padding: 10px 20px;
}
.sidenav .btn-logout .text-logout {
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.72px;
    color: #878787;
}

.main {
    width: calc(100% - 320px) !important;
    transition: 0.5s;
}

#sidebar {
    width: 250px;
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    z-index: 999;
    background: #7386d5;
    color: #fff;
    transition: all 0.3s;
}

.navbar-dark {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.navbar-dark .navbar-brand {
    background: url("../image/elements/logo.b9f35229.png") no-repeat;
    background-size: 31px;
    width: 45px;
    height: 36px;
}
.navbar-dark .navbar-nav {
    /* .active {
         color: #06a6e3 !important;
     }*/
}
.navbar-dark .navbar-nav .nav-item .nav-link {
    font-family: "Open Sans SemiBold";
    font-size: 16px;
}
.navbar-dark .navbar-nav .nav-item .nav-link img.more {
    margin-top: -10px;
}
.navbar-dark .navbar-nav .nav-item .nav-link:hover {
    color: #06a6e3 !important;
}
@media only screen and (max-width: 1920px) {
    .navbar-dark .navbar-nav .nav-item .nav-link {
        font-family: "Open Sans SemiBold";
        font-size: 17px;
    }
    .navbar-dark .navbar-nav .nav-item .nav-link img.more {
        margin-top: -10px;
    }
    .navbar-dark .navbar-nav .nav-item .nav-link:hover {
        color: #06a6e3 !important;
    }
}
@media only screen and (max-width: 1660px) {
    .navbar-dark .navbar-nav .nav-item .nav-link {
        font-family: "Open Sans SemiBold";
        font-size: 16px;
    }
    .navbar-dark .navbar-nav .nav-item .nav-link img.more {
        margin-top: -10px;
    }
    .navbar-dark .navbar-nav .nav-item .nav-link:hover {
        color: #06a6e3 !important;
    }
}
@media only screen and (max-width: 1368px) {
    .navbar-dark .navbar-nav .nav-item .nav-link {
        font-family: "Open Sans SemiBold";
        font-size: 15px;
    }
    .navbar-dark .navbar-nav .nav-item .nav-link img.more {
        margin-top: -10px;
    }
    .navbar-dark .navbar-nav .nav-item .nav-link:hover {
        color: #06a6e3 !important;
    }
}
.navbar-dark .navbar-nav .navbar-login {
    background-size: 31px;
    width: 20px;
    height: 20px;
    margin-top: 10px;
}
.navbar-dark .navbar-nav .navbar-explore {
    background-size: 31px;
    width: 20px;
    height: 20px;
    margin-top: 10px;
}
.navbar-dark .navbar-nav .navbar-after-login {
    background-size: 31px;
    width: 20px;
    height: 20px;
    margin-top: 10px;
}
.navbar-dark .feeds .nav-item {
    font-size: 12px;
}
.navbar-dark .feeds .nav-item .fa-circle {
    color: #c41f26 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
.navbar-dark .feeds .nav-item .nav-link {
    color: #ffffff;
    padding-right: 20px !important;
    padding-left: 20px !important;
}
.navbar-dark .explore .nav-item .searchbox {
    top: 10px;
    position: relative;
    min-width: 50px;
    width: 0%;
    height: 50px;
    float: right;
    overflow: hidden;
    -webkit-transition: width 0.7s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.6s;
    transition-timing-function: ease-in-out;
}
.navbar-dark .explore .nav-item .searchbox-input {
    display: none;
    top: 0;
    right: 0;
    border: 0;
    outline: 0;
    background: transparent;
    width: 100%;
    height: 50px;
    margin: 0;
    padding: 0px 55px 0px 20px;
    font-size: 16px;
    font-family: "Open Sans SemiBold";
    color: white;
}
.navbar-dark .explore .nav-item .searchbox-input::-webkit-input-placeholder {
    color: white;
}
.navbar-dark .explore .nav-item .searchbox-input:-moz-placeholder {
    color: white;
}
.navbar-dark .explore .nav-item .searchbox-input::-moz-placeholder {
    color: white;
}
.navbar-dark .explore .nav-item .searchbox-input:-ms-input-placeholder {
    color: white;
}
.navbar-dark .explore .nav-item .searchbox-input::focus {
    border: solid 2px #3c3c3c;
    background-color: rgba(40, 40, 40, 0.3);
}
.navbar-dark .explore .nav-item .searchbox-icon {
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    top: 0;
    font-family: verdana;
    font-size: 22px;
    right: 0;
    padding: 0;
    margin: 0;
    border: 0;
    outline: 0;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    background: transparent;
    padding: 6px 0;
    right: 12px;
    display: block;
}
.navbar-dark .explore .nav-item .close-icon {
    display: none;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    font-family: verdana;
    font-size: 20px;
    right: 0;
    padding: 0;
    margin: 0;
    border: 0;
    outline: 0;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    background: transparent;
    padding: 2px 0;
    right: 12px;
}
.navbar-dark .explore .nav-item .searchbox-submit {
    width: 50px;
    height: 50px;
    display: block;
    position: absolute;
    top: 0;
    font-family: verdana;
    font-size: 22px;
    right: 0;
    padding: 0;
    margin: 0;
    border: 0;
    outline: 0;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    color: #fff;
    background: #282828;
}
.navbar-dark .explore .nav-item .searchbox-open {
    display: block;
    width: 100%;
    border-radius: 25px;
    border: solid 2px #3c3c3c;
    background-color: rgba(40, 40, 40, 0.3);
}
.navbar-dark .explore .nav-item .recommendation {
    position: absolute;
    bottom: -141px;
    width: 534px;
    padding: 25px;
    right: 0px;
    background: #212121;
    border-radius: 10px;
    color: white;
    -webkit-transition: width 1s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.6s;
    transition-timing-function: ease-in-out;
}
.navbar-dark .explore .nav-item .recommendation::after {
    content: "";
    position: absolute;
    width: 5px;
    border-left: 10px dotted transparent;
    border-right: 10px solid transparent;
    border-bottom: 20px solid #212121;
    z-index: 100;
    right: 22px;
    top: -17px;
    z-index: 100;
}
.navbar-dark .explore .nav-item .recommendation h5 {
    font-family: "Open Sans Bold";
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.56px;
    color: #dadada;
}
.navbar-dark .explore .nav-item .recommendation .see-more a {
    font-family: "Open Sans SemiBold";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.56px;
    color: #dadada;
}
.navbar-dark .explore .nav-item .nav-link {
    color: #ffffff;
    padding-right: 12px !important;
    padding-left: 12px !important;
    padding: 15px 0;
}
.navbar-dark .explore .nav-item .nav-link .btn-explore {
    border: solid 1px #ffffff;
    padding: 7px 20px;
    border-radius: 22px;
    vertical-align: center;
    font-size: 12px;
}
.navbar-dark .explore .nav-item .nav-link .btn-explore:hover {
    border: solid 1px #06a6e3;
    padding: 7px 20px;
    border-radius: 22px;
    vertical-align: center;
    font-size: 12px;
}
.navbar-dark .explore .nav-item .nav-link .btn-explore .active {
    border: solid 1px #06a6e3;
    padding: 7px 20px;
    border-radius: 22px;
    vertical-align: center;
    font-size: 12px;
}
.navbar-dark .explore .nav-item .nav-link .active {
    color: #06a6e3 !important;
    border: solid 1px #06a6e3;
    padding: 7px 15px;
    border-radius: 22px;
}
.navbar-dark .explore .nav-item .nav-link .fa-bars {
    font-size: 20px;
}
.navbar-dark .explore .nav-item .nav-link .user-simple-line-icons {
    width: 35px;
    height: 35px;
    background-color: #282828;
    margin-top: -5px;
}
.navbar-dark .explore .nav-item .active {
    color: #06a6e3 !important;
}
.navbar-dark .explore .nav-item .apps-material {
    width: 30px;
    height: 30px;
    margin-top: 7px;
}
.navbar-dark .explore .active {
    color: #06a6e3 !important;
}

.navbar {
    padding: 3px 0;
}

.navbar-nav li.active > a.nav-link {
    color: #ffff !important;
}

.navbar .nav-item{
    /* display: flex; */
 }

 .navbar .nav-item img{
   width: 35px;
   border-radius: 50%;
 }

 .navbar .nav-item .icon_wrap{
   cursor: pointer;
 }

 .navbar .nav-item .profile,
 .navbar .nav-item .notifications{
   position: relative;
 }

 .navbar .nav-item .lgn{
   background-color: #3A3A3A;
   border-radius: 32px;
   Padding: 4px 10px 4px 5px;

 }

 .navbar .profile .profile_dd{
   position: absolute;
   top: 48px;
   right: 0px;
   user-select: none;
   background: #3A3A3A;
   width: 350px;
   height: auto;
   display: none;
   border-radius: 8px;
   box-shadow: 10px 10px 35px rgba(0,0,0,0.125),
               -10px -10px 35px rgba(0,0,0,0.125);
 }

 .navbar .profile .profile_dd:before,
 .notification_dd:before{
     content: "";
     position: absolute;
     top: -20px;
     right: 15px;
     border: 10px solid;
     border-color: transparent transparent #3A3A3A transparent;
 }

 .navbar .nav-item .profile .icon_wrap{
   display: flex;
   align-items: center;
 }

 .navbar .nav-item .profile .name{
   display: inline-block;
   margin: 0 10px;
 }

 .navbar .nav-item .icon_wrap:hover,
 .navbar .nav-item .profile.active .icon_wrap{
   color: #f9f9f9;
 }

 .navbar .profile .profile_dd{
   width: 200px;
 }
 .navbar .profile .profile_dd:before{
   rigth: 10px;
 }

 .navbar .profile .profile_dd ul li {
     border-bottom: 1px solid #535558;
 }
 .navbar .profile .profile_dd ul li:last-child {
    border-bottom: none
  }

 .navbar .profile .profile_dd ul li  a{
     display: block;
     padding: 15px 15px;
     position: relative;
 }

 .navbar .profile .profile_dd ul li  a .picon{
   display: inline-block;
   width: 25px;
 }

 .navbar .profile .profile_dd ul li  a:hover{
   color: #f9f9f9;
   border-radius: 0px 0px 8px 8px;
   background-color: #5e5d5dc2;
 }

 .navbar .profile .profile_dd ul li.profile_li a:hover {
     background: transparent;
     cursor: default;
     color: #f9f9f9;
     background-color: #5e5d5dc2;
     border-radius: 8px 8px 0px 0px;
 }

 .navbar .profile .profile_dd ul li .btn{
     height: 32px;
     padding: 7px 10px;
     color: #fff;
     border-radius: 3px;
     cursor: pointer;
     text-align: center;
     background: #3b80f9;
     width: 125px;
     margin: 5px auto 15px;
 }

 .navbar .profile .profile_dd ul li .btn:hover{
   background: #6593e4;
 }

 .navbar .profile.active .profile_dd,
 .navbar .notifications.active .notification_dd{
   display: block;
 }

 .navbar .button-login{
    width: 96px;
    height: 34px;
    border-radius: 24px;
  }

  .navbar .button-login .button-login-text {
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1.25px;
}


 .profile .shadow {
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.5;
}

.profile .inner_popup {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    height: auto;
}





.search {
    right: 15px;
    top: 30px;
    position: absolute;
    display: inline-block;
}
.search input {
    width: 0px;
    height: 34px;
    background-color: #000;
    box-shadow: none;
    color: #fff;
    border: 1px solid transparent;
    outline: none;
    padding-left: 35px;
    font-size: 16px;
    transition: 0.3s ease all;
}
.search input.toggle {
    width: 240px;
    border-color: #fff;
}
.search img {
    width: 18px;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}

#log {
    width: 100%;
    background-image: radial-gradient(
        circle,
        #265bab,
        #374c87,
        #393f65,
        #333345,
        #282828
    );
    height: 100%;
    object-fit: contain;
}
#log .card-1 {
    padding: 10px 10px 10px 10px;
    /*box-shadow: 0 19px 38px rgba(0, 0, 0, 0.30), 0 15px 12px rgba(0, 0, 0, 0.22);*/
}
#log .card1 {
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
}
#log .card1 .store {
    margin-top: 40px;
}
#log .card {
    max-width: 350px;
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
    border-radius: 30px;
}
#log .card .RCTI_tegak {
    height: 70px;
    margin: 0 auto;
    margin-top: 28.5px;
}
#log .card h4 {
    padding: 30px 0;
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
#log .card p {
    padding: 0 50px;
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
}
#log .card input:focus,
#log .card button:focus,
#log .card input:active,
#log .card button:active {
    outline: none;
}
#log .card a {
    text-decoration: none;
}
#log .card a:focus,
#log .card a:active {
    outline: none;
}
#log .card h1,
#log .card h2,
#log .card h3,
#log .card h4,
#log .card h5,
#log .card h6 {
    font-weight: bold;
    letter-spacing: 1px;
}
#log .card .container {
    height: 100%;
    width: 100%;
    position: relative;
    text-align: center;
}
#log .card .container:before {
    content: "";
    height: 100%;
    width: 0px;
    display: inline-block;
    vertical-align: middle;
}
#log .card .formBox {
    width: 460px;
    max-width: 100%;
    height: 205px;
    margin-left: -4px;
    margin-top: 10px;
    margin-bottom: 40px;
    position: relative;
    vertical-align: middle;
    display: inline-block;
}
#log .card .formBox .box {
    text-align: left;
    border-radius: 8px;
    padding: 0 0px 40px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all 0.2s cubic-bezier(0.35, 0.33, 0.75, 0.9);
}
#log .card .formBox form {
    display: block;
    padding: 0px 10px;
    position: relative;
}
#log .card .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#log .card .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#log .card .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 41%;
}
#log .card .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#log .card .formBox .f_row .forgot {
    text-align: center;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#log .card .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#log .card .formBox .f_row.last {
    margin-bottom: 30px;
}
#log .card .formBox .f_row.last .field-icon {
    float: right;
    margin-left: -25px;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#log .card .formBox .f_row.sign {
    text-align: center;
}
#log .card .formBox .f_row.forgot {
    text-align: center;
    margin-bottom: 0 !important;
}
#log .card .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#log .card .formBox .f_row input {
    background-color: transparent;
    font-family: HelveticaNeue-Light;
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
}
#log .card ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#log .card .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#log .card .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#log .card .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#log .card .formBox .f_row.focus u:before {
    width: 100%;
}
#log .card-sign-in {
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
}
#log .card-sign-in .RCTI_tegak {
    height: 42.5px;
    margin: 0 auto;
    margin-top: 28.5px;
}
#log .card-sign-in h5 {
    padding: 30px 0;
    font-family: HelveticaNeue-Light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
#log .card-sign-in h3 {
    font-family: HelveticaNeue-Light;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#log .card-sign-in h4 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#log .card-sign-in h6 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#log .card-sign-in input[type="checkbox"],
#log .card-sign-in input[type="radio"] {
    opacity: 0;
}
#log .card-sign-in .col-md-6 {
    padding: 0;
}
#log .card-sign-in .genre {
    padding-top: 30px;
}
#log .card-sign-in .btn-focus,
#log .card-sign-in .btn:focus {
    box-shadow: 0 !important;
}
#log .card-sign-in .btn-group-vertical > .btn.active,
#log .card-sign-in .btn-group-vertical > .btn:active,
#log .card-sign-in .btn-group-vertical > .btn:focus,
#log .card-sign-in .btn-group > .btn.active,
#log .card-sign-in .btn-group > .btn:active,
#log .card-sign-in .btn-group > .btn:focus {
    border: solid 2px #da251c !important;
}
#log .card-sign-in .items-collection {
    margin: 20px 0 0 0;
}
#log .card-sign-in .items-collection label.btn-default.active {
    background-color: #da251c;
    border: solid 2px #da251c;
    color: #fff;
}
#log .card-sign-in .items-collection label.btn-default {
    width: 90%;
    border: 1px solid #000000;
    margin: 5px;
    border-radius: 17px;
    color: #305891;
}
#log .card-sign-in .items-collection label .itemcontent {
    width: 100%;
}
#log .card-sign-in .items-collection .btn-group {
    width: 90%;
}
#log .card-sign-in p {
    padding: 0 50px;
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
}
#log .card-sign-in input:focus,
#log .card-sign-in button:focus,
#log .card-sign-in input:active,
#log .card-sign-in button:active {
    outline: none;
}
#log .card-sign-in a {
    text-decoration: none;
}
#log .card-sign-in a:focus,
#log .card-sign-in a:active {
    outline: none;
}
#log .card-sign-in .container {
    height: auto;
    width: 100%;
    position: relative;
    text-align: center;
}
#log .card-sign-in .container:before {
    content: "";
    height: 100%;
    width: 0px;
    display: inline-block;
    vertical-align: middle;
}
#log .card-sign-in .formBox {
    width: 460px;
    max-width: 100%;
    height: 280px;
    margin-left: -4px;
    margin-top: 10px;
    position: relative;
    vertical-align: middle;
    display: inline-block;
}
#log .card-sign-in .formBox .box {
    text-align: left;
    border-radius: 8px;
    padding: 0 0px 40px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all 0.2s cubic-bezier(0.35, 0.33, 0.75, 0.9);
}
#log .card-sign-in .formBox form {
    display: block;
    padding: 0px 10px;
    position: relative;
}
#log .card-sign-in .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#log .card-sign-in .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#log .card-sign-in .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 41%;
    color: #ffffff;
}
#log .card-sign-in .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#log .card-sign-in .formBox .f_row .forgot {
    text-align: center;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#log .card-sign-in .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#log .card-sign-in .formBox .f_row.last {
    margin-bottom: 30px;
}
#log .card-sign-in .formBox .f_row.last .field-icon {
    float: right;
    margin-left: 0;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#log .card-sign-in .formBox .f_row.sign {
    text-align: center;
}
#log .card-sign-in .formBox .f_row.forgot {
    text-align: center;
    margin-bottom: 0 !important;
}
#log .card-sign-in .formBox .f_row.forgot p.forgot a {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
}
#log .card-sign-in .formBox .f_row.policy {
    text-align: center;
    margin-bottom: 0 !important;
}
#log .card-sign-in .formBox .f_row.policy p {
    padding: 25px 15px !important;
}
#log .card-sign-in .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#log .card-sign-in .formBox .f_row input {
    background-color: transparent;
    font-family: HelveticaNeue-Light;
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
}
#log .card-sign-in ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#log .card-sign-in .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#log .card-sign-in .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#log .card-sign-in .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#log .card-sign-in .formBox .f_row.focus u:before {
    width: 100%;
}
#log .card-sign-up {
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
}
#log .card-sign-up .RCTI_tegak {
    height: 42.5px;
    margin: 0 auto;
    margin-top: 28.5px;
}
#log .card-sign-up h5 {
    padding: 30px 0;
    font-family: HelveticaNeue-Light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
#log .card-sign-up h3 {
    font-family: HelveticaNeue-Light;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#log .card-sign-up h4 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#log .card-sign-up h6 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#log .card-sign-up input[type="checkbox"],
#log .card-sign-up input[type="radio"] {
    opacity: 0;
}
#log .card-sign-up .col-md-6 {
    padding: 0;
}
#log .card-sign-up .genre {
    padding-top: 30px;
}
#log .card-sign-up .btn-focus,
#log .card-sign-up .btn:focus {
    box-shadow: 0 !important;
}
#log .card-sign-up .btn-group-vertical > .btn.active,
#log .card-sign-up .btn-group-vertical > .btn:active,
#log .card-sign-up .btn-group-vertical > .btn:focus,
#log .card-sign-up .btn-group > .btn.active,
#log .card-sign-up .btn-group > .btn:active,
#log .card-sign-up .btn-group > .btn:focus {
    border: solid 2px #da251c !important;
}
#log .card-sign-up .items-collection {
    margin: 20px 0 0 0;
}
#log .card-sign-up .items-collection label.btn-default.active {
    background-color: #da251c;
    border: solid 2px #da251c;
    color: #fff;
}
#log .card-sign-up .items-collection label.btn-default {
    width: 90%;
    border: 1px solid #000000;
    margin: 5px;
    border-radius: 17px;
    color: #305891;
}
#log .card-sign-up .items-collection label .itemcontent {
    width: 100%;
}
#log .card-sign-up .items-collection .btn-group {
    width: 90%;
}
#log .card-sign-up p {
    padding: 0 50px;
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
}
#log .card-sign-up input:focus,
#log .card-sign-up button:focus,
#log .card-sign-up input:active,
#log .card-sign-up button:active {
    outline: none;
}
#log .card-sign-up a {
    text-decoration: none;
}
#log .card-sign-up a:focus,
#log .card-sign-up a:active {
    outline: none;
}
#log .card-sign-up .container {
    height: auto;
    width: 100%;
    position: relative;
    text-align: center;
}
#log .card-sign-up .container:before {
    content: "";
    height: 100%;
    width: 0px;
    display: inline-block;
    vertical-align: middle;
}
#log .card-sign-up .formBox {
    width: 460px;
    max-width: 100%;
    height: 280px;
    margin-left: -4px;
    margin-top: 10px;
    margin-bottom: 40px;
    position: relative;
    vertical-align: middle;
    display: inline-block;
}
#log .card-sign-up .formBox .box {
    text-align: left;
    border-radius: 8px;
    padding: 0 0px 40px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all 0.2s cubic-bezier(0.35, 0.33, 0.75, 0.9);
}
#log .card-sign-up .formBox form {
    display: block;
    padding: 0px 10px;
    position: relative;
}
#log .card-sign-up .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#log .card-sign-up .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#log .card-sign-up .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 44%;
    color: #ffffff;
}
#log .card-sign-up .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#log .card-sign-up .formBox .f_row .forgot {
    text-align: center;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#log .card-sign-up .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#log .card-sign-up .formBox .f_row.last {
    margin-bottom: 30px;
}
#log .card-sign-up .formBox .f_row.last .field-icon {
    float: right;
    margin-left: -25px;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#log .card-sign-up .formBox .f_row.sign {
    text-align: center;
}
#log .card-sign-up .formBox .f_row.forgot {
    text-align: center;
    margin-bottom: 0 !important;
}
#log .card-sign-up .formBox .f_row.policy {
    text-align: center;
    margin-bottom: 0 !important;
}
#log .card-sign-up .formBox .f_row.policy p {
    padding: 25px 15px !important;
}
#log .card-sign-up .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#log .card-sign-up .formBox .f_row input {
    background-color: transparent;
    font-family: HelveticaNeue-Light;
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
}
#log .card-sign-up ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#log .card-sign-up .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#log .card-sign-up .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#log .card-sign-up .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#log .card-sign-up .formBox .f_row.focus u:before {
    width: 100%;
}

#reg {
    width: 100%;
    background-image: radial-gradient(
        circle,
        #265bab,
        #374c87,
        #393f65,
        #333345,
        #282828
    );
    height: 100%;
}
#reg .card-1 {
    padding: 10px 10px 10px 10px;
    /*box-shadow: 0 19px 38px rgba(0, 0, 0, 0.30), 0 15px 12px rgba(0, 0, 0, 0.22);*/
}
#reg .card1 {
    margin: 0 auto;
    float: none;
    margin-bottom: 14px;
    font-family: HelveticaNeue;
    font-size: 14px !important;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
}
#reg .card1 .store {
    margin-top: 40px;
}
#reg .card {
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
}
#reg .card .RCTI_tegak {
    height: 70px;
    margin: 0 auto;
    margin-top: 28.5px;
}
#reg .card h4 {
    padding: 30px 0;
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
#reg .card p {
    padding: 0 50px;
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
}
#reg .card input:focus,
#reg .card button:focus,
#reg .card input:active,
#reg .card button:active {
    outline: none;
}
#reg .card a {
    text-decoration: none;
}
#reg .card a:focus,
#reg .card a:active {
    outline: none;
}
#reg .card h1,
#reg .card h2,
#reg .card h3,
#reg .card h4,
#reg .card h5,
#reg .card h6 {
    font-weight: bold;
    letter-spacing: 1px;
}
#reg .card .container {
    height: 100%;
    width: 100%;
    position: relative;
    text-align: center;
}
#reg .card .container:before {
    content: "";
    height: 100%;
    width: 0px;
    display: inline-block;
    vertical-align: middle;
}
#reg .card .formBox {
    width: 460px;
    max-width: 100%;
    height: 205px;
    margin-left: -4px;
    margin-top: 10px;
    margin-bottom: 40px;
    position: relative;
    vertical-align: middle;
    display: inline-block;
}
#reg .card .formBox .box {
    text-align: left;
    border-radius: 8px;
    padding: 0 0px 40px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all 0.2s cubic-bezier(0.35, 0.33, 0.75, 0.9);
}
#reg .card .formBox form {
    display: block;
    padding: 0px 10px;
    position: relative;
}
#reg .card .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#reg .card .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#reg .card .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 43%;
}
#reg .card .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#reg .card .formBox .f_row .forgot {
    text-align: center;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#reg .card .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#reg .card .formBox .f_row.last {
    margin-bottom: 30px;
}
#reg .card .formBox .f_row.sign {
    text-align: center;
}
#reg .card .formBox .f_row.forgot {
    text-align: center;
    margin-bottom: 0 !important;
}
#reg .card .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#reg .card .formBox .f_row input {
    background-color: transparent;
    font-family: HelveticaNeue-Light;
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
}
#reg .card ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#reg .card .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#reg .card .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#reg .card .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#reg .card .formBox .f_row.focus u:before {
    width: 100%;
}
#reg .card-sign-up {
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
    border-radius: 5px;
    padding: 30px 30px 20px 30px;
}
#reg .card-sign-up .RCTI_tegak {
    height: 42.5px;
    margin: 0 auto;
    margin-top: 28.5px;
}
#reg .card-sign-up .btn-sign {
    background-color: #da251c;
    padding: 10px 44%;
    color: #ffffff;
}
#reg .card-sign-up .btn-sign:hover {
    background-color: #ac1d16;
}
#reg .card-sign-up h5 {
    padding: 30px 0;
    font-family: HelveticaNeue-Light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
#reg .card-sign-up h3 {
    font-family: HelveticaNeue-Light;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#reg .card-sign-up h4 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    padding: 5px 0;
}
#reg .card-sign-up h6 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
    margin-left: 0;
    margin-top: -15px;
}
#reg .card-sign-up input[type="checkbox"],
#reg .card-sign-up input[type="radio"] {
    opacity: 0;
}
#reg .card-sign-up .col-md-6 {
    padding: 0;
}
#reg .card-sign-up .genre {
    padding-top: 30px;
}
#reg .card-sign-up .genre .btn-next {
    margin-top: 30px;
    background-color: #da251c;
    padding: 10px 43%;
    color: #ffffff;
}
#reg .card-sign-up .genre .btn-next:hover {
    background-color: #ac1d16;
}
#reg .card-sign-up .btn-focus,
#reg .card-sign-up .btn:focus {
    box-shadow: 0 !important;
}
#reg .card-sign-up .btn-group-vertical > .btn.active,
#reg .card-sign-up .btn-group-vertical > .btn:active,
#reg .card-sign-up .btn-group-vertical > .btn:focus,
#reg .card-sign-up .btn-group > .btn.active,
#reg .card-sign-up .btn-group > .btn:active,
#reg .card-sign-up .btn-group > .btn:focus {
    border: solid 2px #da251c !important;
    width: 150px;
    height: 50px;
    border-radius: 7px;
}
#reg .card-sign-up .btn-group-vertical > .btn,
#reg .card-sign-up .btn-group > .btn {
    border: solid 1px #000000;
    width: 150px;
    height: 50px;
}
#reg .card-sign-up .items-collection {
    margin: 20px 0 0 0;
}
#reg .card-sign-up .items-collection label.btn-default.active {
    background-color: #da251c;
    border: solid 2px #da251c;
    color: #fff;
}
#reg .card-sign-up .items-collection label.btn-default {
    width: 90%;
    border: 1px solid #000000;
    margin: 5px;
    border-radius: 17px;
    color: #305891;
}
#reg .card-sign-up .items-collection label .itemcontent {
    width: 100%;
}
#reg .card-sign-up .items-collection .btn-group {
    width: 90%;
}
#reg .card-sign-up p {
    padding: 0 50px;
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
}
#reg .card-sign-up input:focus,
#reg .card-sign-up button:focus,
#reg .card-sign-up input:active,
#reg .card-sign-up button:active {
    outline: none;
}
#reg .card-sign-up a {
    text-decoration: none;
}
#reg .card-sign-up a:focus,
#reg .card-sign-up a:active {
    outline: none;
}
#reg .card-sign-up .container {
    height: auto;
    width: 100%;
    position: relative;
    text-align: center;
}
#reg .card-sign-up .container:before {
    content: "";
    height: 100%;
    width: 0px;
    display: inline-block;
    vertical-align: middle;
}
#reg .card-sign-up .formBox {
    width: 460px;
    max-width: 100%;
    height: 280px;
    margin-left: -4px;
    margin-top: 10px;
    margin-bottom: 40px;
    position: relative;
    vertical-align: middle;
    display: inline-block;
}
#reg .card-sign-up .formBox .box {
    text-align: left;
    border-radius: 8px;
    padding: 0 0px 40px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all 0.2s cubic-bezier(0.35, 0.33, 0.75, 0.9);
}
#reg .card-sign-up .formBox form {
    display: block;
    padding: 0px 10px;
    position: relative;
}
#reg .card-sign-up .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#reg .card-sign-up .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#reg .card-sign-up .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 43%;
}
#reg .card-sign-up .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#reg .card-sign-up .formBox .f_row .forgot {
    text-align: center;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#reg .card-sign-up .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#reg .card-sign-up .formBox .f_row.last {
    margin-bottom: 30px;
}
#reg .card-sign-up .formBox .f_row.last .field-icon {
    float: right;
    margin-left: -25px;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#reg .card-sign-up .formBox .f_row.sign {
    text-align: center;
}
#reg .card-sign-up .formBox .f_row.forgot {
    text-align: center;
    margin-bottom: 0 !important;
}
#reg .card-sign-up .formBox .f_row.policy {
    text-align: center;
    margin-bottom: 0 !important;
}
#reg .card-sign-up .formBox .f_row.policy p {
    padding: 25px 15px !important;
}
#reg .card-sign-up .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#reg .card-sign-up .formBox .f_row input {
    background-color: transparent;
    font-family: HelveticaNeue-Light;
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
}
#reg .card-sign-up ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#reg .card-sign-up .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#reg .card-sign-up .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#reg .card-sign-up .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#reg .card-sign-up .formBox .f_row.focus u:before {
    width: 100%;
}
#reg .card-sign-up-step-3 {
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
    border-radius: 5px;
    padding: 20px 20px 150px 20px;
}
#reg .card-sign-up-step-3 .back {
    padding-bottom: 50px;
}
#reg .card-sign-up-step-3 .back a {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
}
#reg .card-sign-up-step-3 .back a .fa-arrow-left {
    padding: 0 10px 10px 0;
}
#reg .card-sign-up-step-3 h4 {
    font-family: HelveticaNeue-Light;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    padding: 5px 0 40px 0;
}
#reg .card-sign-up-step-3 h5 {
    font-family: HelveticaNeue-Light;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    padding: 5px 0 15px 0;
}
#reg .card-sign-up-step-3 h6 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
    margin-left: 0;
    margin-top: -15px;
    padding: 5px 0 20px 0;
}
#reg .card-sign-up-step-3 h6.top {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
    margin-left: 0;
    margin-top: -15px;
    padding: 5px 0 10px 0;
    padding-bottom: 60px;
}
#reg .card-sign-up-step-3 h6.top b {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
}
#reg .card-sign-up-step-3 div {
    position: relative;
    z-index: 1;
}
#reg .card-sign-up-step-3 #form {
    width: 100%;
    margin: 0 auto;
    padding: 0 10px;
}
#reg .card-sign-up-step-3 #form input {
    margin: 0 5px;
    text-align: center;
    line-height: 45px;
    font-family: HelveticaNeue;
    font-size: 30px;
    border: 0;
    background: transparent;
    box-shadow: none;
    outline: none;
    width: 20.7%;
    transition: all 0.2s ease-in-out;
    border-radius: 0;
    color: #ffffff;
    position: relative;
    border-bottom: solid 2px #3d3d3d;
}
#reg .card-sign-up-step-3 #form input input::selection {
    background: transparent;
}
#reg .card-sign-up-step-3 .btn-next-email {
    margin-top: 60px;
    background-color: #da251c;
    padding: 10px 44%;
    color: #ffffff;
}
#reg .card-sign-up-step-3 .btn-next-email:hover {
    background-color: #ac1d16;
}
#reg .card-sign-up-step-3 .btn-next {
    margin-top: 30px;
    background-color: #242424;
    padding: 10px 44%;
    color: #ffffff;
}
#reg .card-sign-up-step-3 .btn-next:hover {
    background-color: #242424;
}
#reg .card-sign-up-step-3 .active {
    margin-top: 30px;
    background-color: #da251c;
    padding: 10px 44%;
    color: #ffffff;
}
#reg .card-sign-up-step-3 .active:hover {
    background-color: #ac1d16;
}
#reg .card-sign-up-step-3 .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#reg .card-sign-up-step-3 .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#reg .card-sign-up-step-3 .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 43%;
}
#reg .card-sign-up-step-3 .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#reg .card-sign-up-step-3 .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#reg .card-sign-up-step-3 .formBox .f_row.last {
    margin-bottom: 30px;
}
#reg .card-sign-up-step-3 .formBox .f_row.last .field-icon {
    float: right;
    margin-left: -25px;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#reg .card-sign-up-step-3 .formBox .f_row.sign {
    text-align: center;
}
#reg .card-sign-up-step-3 .formBox .f_row.change {
    text-align: center;
    padding: 30px 0;
}
#reg .card-sign-up-step-3 .formBox .f_row.change p {
    font-family: HelveticaNeue-Light;
    font-size: 12px !important;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
}
#reg .card-sign-up-step-3 .formBox .f_row.change p a {
    font-family: HelveticaNeue-Light;
    font-size: 12px !important;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    border-bottom: solid 1px #ffffff;
}
#reg .card-sign-up-step-3 .formBox .f_row.change p span {
    padding: 0 10px;
    font-family: HelveticaNeue-Light;
    font-size: 12px !important;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
}
#reg .card-sign-up-step-3 .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#reg .card-sign-up-step-3 .formBox .f_row input {
    background-color: transparent;
    font-family: HelveticaNeue;
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
    padding: 0 5px;
}
#reg .card-sign-up-step-3 ::placeholder {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#reg .card-sign-up-step-3 .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#reg .card-sign-up-step-3 .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#reg .card-sign-up-step-3 .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#reg .card-sign-up-step-3 .formBox .f_row.focus u:before {
    width: 100%;
}
#reg .card-sign-up-step-4 {
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
    border-radius: 5px;
    padding: 20px 20px 20px 20px;
    text-align: center;
}
#reg .card-sign-up-step-4 .check {
    margin: 0 auto;
    background-color: #4e8d05;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    margin-top: 40px;
}
#reg .card-sign-up-step-4 .check .fa-check {
    font-size: 40px;
    padding-top: 40px;
}
#reg .card-sign-up-step-4 h4.email {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    padding: 20px 20px 20px 20px;
}
#reg .card-sign-up-step-4 h4 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    padding: 5px 0 70px 0;
}
#reg .card-sign-up-step-4 h6.email {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
    margin-left: 0;
    margin-top: 5px;
    margin-bottom: 40px;
    padding: 5px 30px 20px 30px;
}
#reg .card-sign-up-step-4 h6 {
    font-family: HelveticaNeue-Light;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
    margin-left: 0;
    margin-top: 40px;
    padding: 5px 0 20px 0;
}
#reg .card-sign-up-step-4 div {
    position: relative;
    z-index: 1;
}
#reg .card-sign-up-step-4 .btn-next {
    margin-top: 30px;
    background-color: #da251c;
    padding: 10px 35%;
    color: #ffffff;
}
#reg .card-sign-up-step-4 .btn-next:hover {
    background-color: #ac1d16;
}
#reg .card-sign-up-step-4 .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#reg .card-sign-up-step-4 .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#reg .card-sign-up-step-4 .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 43%;
}
#reg .card-sign-up-step-4 .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}

#regv2 {
    height: 100%;
    /*custom select input gender */
    /*end custom select gender */
}
#regv2 .logo {
    position: absolute;
    left: 40px;
    top: 10px;
}
#regv2 .img-store {
    height: 40px;
    width: 135px;
    margin-left: 5px;
    margin-right: 5px;
}
#regv2 .img-social {
    text-align: left;
    margin-top: 20px;
    padding-left: 180px;
}
@media (min-width: 1920px) {
    #regv2 .img-social {
        text-align: left;
        margin-top: 20px;
        padding-left: 225px;
    }
}
@media (min-width: 1600px) {
    #regv2 {
        height: 100vh;
    }
    #regv2 .img-social {
        text-align: left;
        margin-top: 20px;
        padding-left: 186px;
    }
}
@media (min-width: 1360px) {
    #regv2 .img-social {
        text-align: left;
        margin-top: 20px;
        padding-left: 145px;
    }
}
@media (min-width: 1024px) {
    #regv2 .img-social {
        text-align: left;
        margin-top: 20px;
        padding-left: 115px;
    }
}
@media (min-width: 1368px) {
    #regv2 .img-social {
        text-align: left;
        margin-top: 20px;
        padding-left: 150px;
    }
}
@media (min-width: 2560px) {
    #regv2 .img-social {
        text-align: left;
        margin-top: 20px;
        padding-left: 160px;
    }
}
@media (min-width: 1280px) {
    #regv2 .img-social {
        text-align: left;
        margin-top: 20px;
        padding-left: 140px;
    }
}
@media (min-width: 1440px) {
    #regv2 .img-social {
        text-align: left;
        margin-top: 20px;
        padding-left: 166px;
    }
}
#regv2 .bg {
    background: url("../image/elements/register.jpg");
    background-size: contain;
    height: 100%;
}
#regv2 .bg-gradient {
    background: #000005;
    background: linear-gradient(
        90deg,
        #000005 43%,
        rgba(21, 21, 28, 0.8743872549) 55%,
        rgba(255, 255, 255, 0.5158438375) 100%
    );
    height: inherit;
    display: flex;
    /* vertical-align: middle; */
    /* justify-content: center; */
    align-items: center;
}
#regv2 .nav-pills > li > a {
    color: #fff;
    padding: 7px 20px;
    font-family: "Open Sans Bold";
    font-size: 12px;
}
#regv2 .nav-pills .nav-link {
    border-radius: 0;
    border-bottom: 1px solid #777;
    font-family: "Open Sans SemiBold";
    font-size: 12px;
}
#regv2 .nav-pills .nav-link.active,
#regv2 .nav-pills .show > .nav-link {
    border-bottom: 2px solid #d92730;
    background-color: transparent;
    border-radius: 0;
    font-family: "Open Sans Bold";
    font-size: 12px;
}
#regv2 .section-card {
    align-items: flex-end;
    padding-right: 90px;
    justify-content: flex-end;
    padding: 50px;
}
@media (max-width: 1368px) {
    #regv2 .card {
        max-width: 500px;
        padding: 0 10px;
        border-radius: 20px;
        background: #282828;
        color: #fff;
        font-family: "Open Sans SemiBold";
        font-size: 14px;
    }
    #regv2 .card-title {
        color: white;
        font-family: "Open Sans SemiBold";
    }
    #regv2 .card-body {
        width: 400px;
    }
    #regv2 .card-body .option-country {
        display: none;
    }
    #regv2 .card-body .option-country .country-code {
        background-color: #282828;
        position: absolute;
        height: 85%;
        width: 100%;
        z-index: 10;
        left: 0;
        overflow-y: scroll;
    }
    #regv2 .card-body .option-country .country-code .head-country {
        background-color: #3a3a3a;
        height: 54px;
    }
    #regv2 .card-body .option-country .country-code .head-country .back-form {
        display: flex;
        margin: 10px;
        padding: 15px;
        padding-left: 10px;
    }
    #regv2
        .card-body
        .option-country
        .country-code
        .head-country
        .back-form
        .back {
        cursor: pointer;
    }
    #regv2
        .card-body
        .option-country
        .country-code
        .head-country
        .back-form
        .title-head {
        margin-left: 15px;
    }
    #regv2
        .card-body
        .option-country
        .country-code
        .head-country
        .back-form
        .search {
        width: 24px;
        height: 24px;
        object-fit: contain;
        position: absolute;
        right: 14px;
        cursor: pointer;
    }
    #regv2 .card-body .option-country .country-list {
        position: absolute;
        height: 70%;
        width: 100%;
        z-index: 10;
        left: 0;
        overflow-y: scroll;
        top: 25%;
    }
    #regv2 .card-body .option-country .country-list .list {
        padding: 10px 20px;
        cursor: pointer;
    }
    #regv2 .card-body .option-country .country-list .list .title {
        font-size: 17px;
        font-family: "Open Sans SemiBold";
    }
    #regv2 .card-body .option-country .country-list .list .code {
        font-size: 17px;
        font-family: "Open Sans Regular";
        position: absolute;
        right: 29px;
    }
}
#regv2 .card {
    max-width: 600px;
    padding: 0 10px;
    border-radius: 20px;
    background: #282828;
    color: #fff;
    font-family: "Open Sans SemiBold";
    font-size: 14px;
}
#regv2 .card-title {
    color: white;
    font-family: "Open Sans SemiBold";
}
#regv2 .card-body {
    width: 400px;
}
#regv2 .card-body .option-country {
    display: none;
}
#regv2 .card-body .option-country .country-code {
    background-color: #282828;
    position: absolute;
    height: 85%;
    width: 100%;
    z-index: 10;
    left: 0;
    overflow-y: scroll;
}
#regv2 .card-body .option-country .country-code .head-country {
    background-color: #3a3a3a;
    height: 54px;
}
#regv2 .card-body .option-country .country-code .head-country .back-form {
    display: flex;
    margin: 10px;
    padding: 15px;
    padding-left: 10px;
}
#regv2 .card-body .option-country .country-code .head-country .back-form .back {
    cursor: pointer;
}
#regv2
    .card-body
    .option-country
    .country-code
    .head-country
    .back-form
    .title-head {
    margin-left: 15px;
}
#regv2
    .card-body
    .option-country
    .country-code
    .head-country
    .back-form
    .search {
    width: 24px;
    height: 24px;
    object-fit: contain;
    position: absolute;
    right: 14px;
    cursor: pointer;
}
#regv2 .card-body .option-country .country-list {
    position: absolute;
    height: 70%;
    width: 100%;
    z-index: 10;
    left: 0;
    overflow-y: scroll;
    top: 25%;
}
#regv2 .card-body .option-country .country-list .list {
    padding: 10px 20px;
    cursor: pointer;
}
#regv2 .card-body .option-country .country-list .list .title {
    font-size: 17px;
    font-family: "Open Sans SemiBold";
}
#regv2 .card-body .option-country .country-list .list .code {
    font-size: 17px;
    font-family: "Open Sans Regular";
    position: absolute;
    right: 29px;
}
#regv2 .nav-item {
    width: 50%;
}
#regv2 .form-control {
    background: #282828;
    border-color: #575757;
    color: #a8a8a8;
    border-radius: 5px;
    position: relative;
    font-family: "Open Sans Regular";
}
#regv2 .form-control::placeholder {
    font-family: "Open Sans Regular";
    vertical-align: 30px;
}
#regv2 .form-control:focus {
    color: #495057;
    background-color: #aaaaaa;
    border-color: #80bdff;
    outline: 0;
}
#regv2 ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #a8a8a8;
}
#regv2 .field-icon {
    right: 10px;
    margin-left: -25px;
    margin-top: -25px;
    position: absolute;
    z-index: 9;
}
#regv2 .btn-register {
    background: #d92730;
    color: #fff;
    width: 100%;
    border-radius: 6px;
    font-family: "Open Sans SemiBold";
    margin-top: 10px;
}
#regv2 .btn-social-media {
    background: #fff;
    color: #000;
    width: 100%;
    border-radius: 6px;
    font-family: "Open Sans SemiBold";
    margin-top: 10px;
}
#regv2 .btn-disabled {
    background: #fff;
    color: #000;
    width: 100%;
    border-radius: 6px;
    font-family: "Open Sans SemiBold";
    margin-top: 10px;
    opacity: 0.65;
    cursor: not-allowed;
    pointer-events: none;
}
#regv2 .spinner {
    height: 100px;
    width: 100px;
    margin: auto;
    display: flex;
    position: absolute;
    -webkit-animation: rotation 0.6s infinite linear;
    -moz-animation: rotation 0.6s infinite linear;
    -o-animation: rotation 0.6s infinite linear;
    animation: rotation 0.6s infinite linear;
    border-left: 6px solid rgba(0, 174, 239, 0.15);
    border-right: 6px solid rgba(0, 174, 239, 0.15);
    border-bottom: 6px solid rgba(0, 174, 239, 0.15);
    border-top: 6px solid rgba(0, 174, 239, 0.8);
    border-radius: 100%;
}
#regv2 .overlay {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2;
}
@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(359deg);
    }
}
@-moz-keyframes rotation {
    from {
        -moz-transform: rotate(0deg);
    }
    to {
        -moz-transform: rotate(359deg);
    }
}
@-o-keyframes rotation {
    from {
        -o-transform: rotate(0deg);
    }
    to {
        -o-transform: rotate(359deg);
    }
}
@keyframes rotation {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(359deg);
    }
}
#regv2 .or-container {
    align-items: center;
    color: #ccc;
    display: flex;
    margin: 25px 0;
}
#regv2 .line-separator {
    background-color: #ccc;
    flex-grow: 5;
    height: 1px;
}
#regv2 .or-label {
    flex-grow: 1;
    margin: 0 15px;
    text-align: center;
}
#regv2 .img-social-media {
    float: left;
    height: 25px;
    width: 25px;
}
#regv2 .social-link img {
    height: 25px;
    width: 25px;
    margin-top: 38px;
}
#regv2 .store {
    left: 470px;
    margin-top: 38px;
}
#regv2 .form-group {
    padding: 0px;
}
#regv2 .search-type {
    width: 100%;
    margin-left: 13px;
    left: 50px;
    height: 27px;
    margin-top: -3px;
    background-color: transparent;
    border: none;
    color: white;
    -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
    display: none;
}
#regv2 .search-type:focus {
    outline: none;
}
#regv2 .close-search {
    display: none;
    cursor: pointer;
}
#regv2 .input-country {
    width: 60px;
    border: 1px #575757 solid;
    display: flex;
    vertical-align: middle;
    justify-content: flex-end;
    align-items: center;
    border-left: 0;
    border-right-: 5px;
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
#regv2 .text-phone {
    background: transparent;
    color: white;
    /* border-color: #575757; */
    /* border-left-width: 0; */
    /* position: absolute; */
    /* border-radius: 0px 5px 5px 0px; */
    cursor: pointer;
    font-size: 14px;
    /* height: 38px; */
    padding: 0px;
    order: 1;
    border: 0px;
}
#regv2 .form-control:focus {
    background: transparent;
    color: white;
}
#regv2 .social {
    left: 150px;
}
#regv2 .socmed-icon {
    height: 50px;
    width: 50px;
}
#regv2 .input-phone-mode {
    border-radius: 5px 0px 0px 5px;
    width: calc(100% - 60px);
    border-right: 0;
}
#regv2 .input-phone-mode input::selection {
    background: transparent;
}
#regv2 .input-username {
    border-radius: 5px;
    border-right: 1px #575757 solid;
    width: calc(100% - 60px);
}
#regv2 .input-username input::selection {
    background: transparent;
}
#regv2 #form,
#regv2 #form_1 {
    width: 100%;
    margin: 0 auto;
    padding: 0 10px;
}
#regv2 .text-danger {
    font-family: "Open Sans Regular";
}
#regv2 .text-warning-custom {
    margin-top: 0px;
    font-size: small;
    font-family: "Open Sans Regular";
}
#regv2 .no-signup {
    font-family: "Open Sans Light";
    font-size: 13px;
    text-align: center;
    margin-top: 10%;
    margin-bottom: 7%;
    object-fit: contain;
}
#regv2 .agreement {
    font-family: "Open Sans Light";
    font-size: 11px;
    text-align: center;
    object-fit: contain;
}
#regv2 .forget-password {
    font-family: "Open Sans Light";
    text-align: center;
    margin-top: 0px;
    margin-bottom: 5%;
}
#regv2 .movable-input {
    margin-bottom: 10px;
}
#regv2 .movable-input-register {
    margin-bottom: 25px;
}
#regv2 .select-box {
    display: flex;
    flex-direction: column;
}
#regv2 .select-box .options-container {
    background-image: url("../image/elements/svg/bg_gender.svg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    max-height: 0;
    width: 100%;
    opacity: 0;
    transition: all 0.4s;
    border-radius: 5px;
    overflow: hidden;
    order: 1;
}
#regv2 .selected {
    border-radius: 5px;
    position: relative;
    order: 0;
}
#regv2 .selected::after {
    content: "";
    background: url("../image/elements/svg/arrow_down_triangle.svg");
    background-repeat: no-repeat;
    background-size: 15px 15px;
    background-position: center center;
    position: absolute;
    height: 89%;
    width: 29px;
    right: -11px;
    top: 2px;
    transition: all 0.4s;
}
#regv2 .select-box .options-container.active {
    max-height: 100px;
    opacity: 1;
}
#regv2 .select-box .options-container.active + .selected::after {
    transform: rotateX(180deg);
    background-position: center center;
}
#regv2 .select-box .option {
    padding: 0px 10px;
    cursor: pointer;
    text-align: center;
}
#regv2 .maleOption {
    margin-top: 10px;
}
#regv2 .select-box .option:hover {
    background: "light";
    color: #000;
}
#regv2 .select-box label {
    cursor: pointer;
}
#regv2 .select-box .option .radio {
    display: none;
}
#regv2 .card-verify #form {
    width: 100%;
    margin: 0 auto;
    padding: 0 10px;
}
#regv2 .card-verify #form input {
    margin: 0 5px;
    text-align: center;
    line-height: 45px;
    font-family: "Open Sans Regular";
    font-size: 30px;
    border: 0;
    background: transparent;
    box-shadow: none;
    outline: none;
    width: 12.7%;
    transition: all 0.2s ease-in-out;
    border-radius: 0;
    color: #ffffff;
    position: relative;
    border-bottom: solid 2px #ffffff;
}
#regv2 .card-verify #form input input::selection {
    background: transparent;
}
#regv2 .card-verify h4 {
    /*font-family: 'Open Sans Bold'; */
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    padding: 5px 0 18px 0;
}
#regv2 .card-verify h5 {
    font-family: "Open Sans Light";
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    padding: 5px 0 15px 0;
}
#regv2 .card-verify h6 {
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
    margin-left: 0;
    margin-top: -15px;
    padding: 5px 0 20px 0;
}
#regv2 .card-verify h5.top {
    font-family: "Open Sans SemiBold";
    font-size: 15px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: 0.17;
    text-align: center;
    letter-spacing: 0.73px;
    color: #ffffff;
    margin-left: 0;
    margin-top: -15px;
}
#regv2 .card-verify h5.top b {
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
}
#regv2 .card-verify h6.top {
    font-family: "Open Sans Light";
    font-size: 11px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    text-align: center;
    letter-spacing: 0.84px;
    color: #ffffff;
    margin-left: 0;
}
#regv2 .card-verify h6.top b {
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
}
#regv2 .card-verify .active {
    margin-top: 30px;
    background-color: #da251c;
    padding: 10px 44%;
    color: #ffffff;
}
#regv2 .card-verify .active:hover {
    background-color: #ac1d16;
}
#regv2 .card-verify #form-otp {
    margin-top: 80px;
    margin-bottom: 40px;
}
#regv2 .card-verify .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#regv2 .card-verify .formBox .f_row a {
    color: red;
    font-family: "Open Sans SemiBold";
    font-size: 10px;
}
#regv2 .card-verify .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 43%;
}
#regv2 .card-verify .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#regv2 .card-verify .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#regv2 .card-verify .formBox .f_row.last {
    margin-bottom: 30px;
}
#regv2 .card-verify .formBox .f_row.last .field-icon {
    float: right;
    margin-left: -25px;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#regv2 .card-verify .formBox .f_row.sign {
    text-align: center;
}
#regv2 .card-verify .formBox .f_row.change {
    text-align: center;
    padding: 30px 0;
}
#regv2 .card-verify .formBox .f_row.change p {
    /* font-family: HelveticaNeue-Light;*/
    font-family: "Open Sans Regular";
    font-size: 15px !important;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
}
#regv2 .card-verify .formBox .f_row.change p a {
    font-family: "Open Sans Regular";
    font-size: 15px !important;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #e02020;
    border-bottom: unset;
    text-decoration: underline;
}
#regv2 .card-verify .formBox .f_row.change p span {
    padding: 0 10px;
    font-family: "Open Sans Regular";
    font-size: 15px !important;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #e02020;
}
#regv2 .card-verify .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#regv2 .card-verify .formBox .f_row input {
    background-color: transparent;
    font-family: "Open Sans Regular";
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
    padding: 0 5px;
}
#regv2 .card-verify ::placeholder {
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#regv2 .card-verify .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#regv2 .card-verify .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#regv2 .card-verify .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#regv2 .card-verify .formBox .f_row.focus u:before {
    width: 100%;
}

#res {
    width: 100%;
    background-image: radial-gradient(
        circle,
        #265bab,
        #374c87,
        #393f65,
        #333345,
        #282828
    );
    height: 100%;
}
#res .card-1 {
    padding: 10px 10px 10px 10px;
    /*box-shadow: 0 19px 38px rgba(0, 0, 0, 0.30), 0 15px 12px rgba(0, 0, 0, 0.22);*/
}
#res .card1 {
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
}
#res .card1 .store {
    margin-top: 40px;
}
#res .card {
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
}
#res .card .RCTI_tegak {
    height: 70px;
    margin: 0 auto;
    margin-top: 28.5px;
}
#res .card h5 {
    padding: 30px 0;
    font-family: HelveticaNeue-Light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
#res .card h4 {
    padding: 30px 0;
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
#res .card p {
    padding: 0 50px;
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
}
#res .card input:focus,
#res .card button:focus,
#res .card input:active,
#res .card button:active {
    outline: none;
}
#res .card a {
    text-decoration: none;
}
#res .card a:focus,
#res .card a:active {
    outline: none;
}
#res .card h1,
#res .card h2,
#res .card h3,
#res .card h4,
#res .card h5,
#res .card h6 {
    font-weight: bold;
    letter-spacing: 1px;
}
#res .card .container {
    height: 100%;
    width: 100%;
    position: relative;
    text-align: center;
}
#res .card .formBox {
    width: 460px;
    max-width: 100%;
    height: 205px;
    margin-left: -4px;
    margin-top: 10px;
    margin-bottom: 40px;
    position: relative;
    vertical-align: middle;
    display: inline-block;
}
#res .card .formBox .box {
    text-align: left;
    border-radius: 8px;
    padding: 0 0px 40px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all 0.2s cubic-bezier(0.35, 0.33, 0.75, 0.9);
}
#res .card .formBox form {
    display: block;
    padding: 0px 10px;
    position: relative;
}
#res .card .formBox form .btn-next-reset {
    margin-top: 70px;
    background-color: #da251c;
    padding: 10px 43%;
}
#res .card .formBox form .btn-next-reset:hover {
    background-color: #ac1d16;
}
#res .card .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#res .card .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#res .card .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 43%;
}
#res .card .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#res .card .formBox .f_row .forgot {
    text-align: center;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#res .card .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#res .card .formBox .f_row.first {
    margin-bottom: 0;
}
#res .card .formBox .f_row.first .field-icon {
    float: right;
    margin-left: 0;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#res .card .formBox .f_row.last {
    margin-bottom: 30px;
}
#res .card .formBox .f_row.last .field-icon {
    float: right;
    margin-left: 0;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#res .card .formBox .f_row .next-reset {
    text-align: center;
}
#res .card .formBox .f_row.forgot {
    text-align: center;
    margin-bottom: 0 !important;
}
#res .card .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#res .card .formBox .f_row input {
    background-color: transparent;
    font-family: HelveticaNeue-Light;
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
}
#res .card ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#res .card .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#res .card .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#res .card .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#res .card .formBox .f_row.focus u:before {
    width: 100%;
}
#res .card-forgot {
    margin-top: 50px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
    background-color: #1d1d1d !important;
    border: solid 1px #0d0d0d;
    border-radius: 5px;
    padding: 30px 30px 20px 30px;
}
#res .card-forgot .RCTI_tegak {
    height: 42.5px;
    margin: 0 auto;
    margin-top: 28.5px;
}
#res .card-forgot .back {
    padding-bottom: 50px;
}
#res .card-forgot .back a {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
}
#res .card-forgot .back a .fa-arrow-left {
    padding: 0 10px 10px 0;
}
#res .card-forgot h5 {
    padding: 30px 30px;
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
#res .card-forgot h3 {
    font-family: HelveticaNeue-Light;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#res .card-forgot h4 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
    padding: 5px 0;
    text-align: center;
}
#res .card-forgot h6 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
    margin-left: 0;
    margin-top: -15px;
}
#res .card-forgot input[type="checkbox"],
#res .card-forgot input[type="radio"] {
    opacity: 0;
}
#res .card-forgot .col-md-6 {
    padding: 0;
}
#res .card-forgot .genre {
    padding-top: 30px;
}
#res .card-forgot .genre .btn-next {
    margin-top: 30px;
    background-color: #da251c;
    padding: 10px 43%;
    color: #ffffff;
}
#res .card-forgot .genre .btn-next:hover {
    background-color: #ac1d16;
}
#res .card-forgot .btn-focus,
#res .card-forgot .btn:focus {
    box-shadow: 0 !important;
}
#res .card-forgot .btn-group-vertical > .btn.active,
#res .card-forgot .btn-group-vertical > .btn:active,
#res .card-forgot .btn-group-vertical > .btn:focus,
#res .card-forgot .btn-group > .btn.active,
#res .card-forgot .btn-group > .btn:active,
#res .card-forgot .btn-group > .btn:focus {
    border: solid 2px #da251c !important;
    width: 150px;
    height: 50px;
    border-radius: 7px;
}
#res .card-forgot .btn-group-vertical > .btn,
#res .card-forgot .btn-group > .btn {
    border: solid 1px #000000;
    width: 150px;
    height: 50px;
}
#res .card-forgot .items-collection {
    margin: 20px 0 0 0;
}
#res .card-forgot .items-collection label.btn-default.active {
    background-color: #da251c;
    border: solid 2px #da251c;
    color: #fff;
}
#res .card-forgot .items-collection label.btn-default {
    width: 90%;
    border: 1px solid #000000;
    margin: 5px;
    border-radius: 17px;
    color: #305891;
}
#res .card-forgot .items-collection label .itemcontent {
    width: 100%;
}
#res .card-forgot .items-collection .btn-group {
    width: 90%;
}
#res .card-forgot p {
    padding: 0 50px;
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
}
#res .card-forgot input:focus,
#res .card-forgot button:focus,
#res .card-forgot input:active,
#res .card-forgot button:active {
    outline: none;
}
#res .card-forgot a {
    text-decoration: none;
}
#res .card-forgot a:focus,
#res .card-forgot a:active {
    outline: none;
}
#res .card-forgot .container {
    height: auto;
    width: 100%;
    position: relative;
    text-align: center;
}
#res .card-forgot .container:before {
    content: "";
    height: 100%;
    width: 0px;
    display: inline-block;
    vertical-align: middle;
}
#res .card-forgot .formBox {
    width: 460px;
    max-width: 100%;
    height: 145px;
    margin-left: -4px;
    margin-top: 10px;
    margin-bottom: 40px;
    position: relative;
    vertical-align: middle;
    display: inline-block;
}
#res .card-forgot .formBox .box {
    text-align: left;
    border-radius: 8px;
    padding: 0 0px 40px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all 0.2s cubic-bezier(0.35, 0.33, 0.75, 0.9);
}
#res .card-forgot .formBox form {
    display: block;
    padding: 0px 10px;
    position: relative;
}
#res .card-forgot .formBox form .btn-next-forgot {
    margin-top: 70px;
    background-color: #da251c;
    padding: 10px 39%;
}
#res .card-forgot .formBox form .btn-next-forgot:hover {
    background-color: #ac1d16;
}
#res .card-forgot .formBox .f_row {
    position: relative;
    margin-bottom: 10px;
    height: 52px;
}
#res .card-forgot .formBox .f_row a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#res .card-forgot .formBox .f_row .btn-sign {
    background-color: #da251c;
    padding: 10px 43%;
}
#res .card-forgot .formBox .f_row .btn-sign:hover {
    background-color: #ac1d16;
}
#res .card-forgot .formBox .f_row .forgot {
    text-align: center;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#res .card-forgot .formBox .f_row.shake {
    animation: shake 0.4s linear;
}
#res .card-forgot .formBox .f_row.last {
    margin-bottom: 30px;
}
#res .card-forgot .formBox .f_row.last .field-icon {
    float: right;
    margin-left: 0;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}
#res .card-forgot .formBox .f_row.sign {
    text-align: center;
}
#res .card-forgot .formBox .f_row.forgot {
    text-align: center;
    margin-bottom: 0 !important;
}
#res .card-forgot .formBox .f_row.policy {
    text-align: center;
    margin-bottom: 0 !important;
}
#res .card-forgot .formBox .f_row.policy p {
    padding: 25px 15px !important;
}
#res .card-forgot .formBox .f_row label {
    color: #3f3f3f;
    font-size: 25px;
    font-weight: normal;
    position: absolute;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: all 0.3s cubic-bezier(1, -0.33, 0, 1.15);
    transform: translate(0px, 0px) scale(1);
    transform-origin: left top;
}
#res .card-forgot .formBox .f_row input {
    background-color: transparent;
    font-family: HelveticaNeue-Light;
    border: none;
    color: #ffffff;
    font-size: 14px;
    width: 100%;
    height: 100%;
    position: relative;
}
#res .card-forgot ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#res .card-forgot .formBox .f_row u {
    background-color: #3d3d3d;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
}
#res .card-forgot .formBox .f_row u:before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
    transition: all 0.35s cubic-bezier(0.35, 0.33, 0.84, 0.85);
}
#res .card-forgot .formBox .f_row.focus label {
    opacity: 0.5;
    transform: translate(0px, -30px) scale(0.8);
}
#res .card-forgot .formBox .f_row.focus u:before {
    width: 100%;
}

#exclusive-menu {
    padding-top: 70px;
    margin: 0 auto;
    width: 616px;
}
#exclusive-menu ul.exclusive-menu {
    padding: 20px 0 20px 0;
}
#exclusive-menu ul.exclusive-menu li {
    padding: 0 15px;
    text-align: center;
}
#exclusive-menu ul.exclusive-menu li h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#exclusive-menu ul.exclusive-menu li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#exclusive-menu ul.exclusive-menu li.active h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#exclusive-menu ul.exclusive-menu:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 19px;
    height: 1px;
    width: 614px;
    border-bottom: 2px solid #1d1d1d;
    z-index: -1;
}

#feeds {
    margin-top: 20px;
}
#feeds .card {
    width: 616px;
    border: solid 1px #111111 !important;
    background-color: #1d1d1d;
}
#feeds .card .card-header {
    background-color: #1d1d1d;
    border-bottom: 0;
}
#feeds .card .card-header .user-thumbnail img.user-simple-line-icons {
    width: 40px;
    height: 40px;
}
#feeds .card .card-header .title-postdate ul h2 {
    font-family: "Roboto";
    font-size: 14px;
    color: white;
}
#feeds .card .card-header .title-postdate ul h2.post-date {
    font-family: "Roboto";
    font-size: 11px;
}
#feeds .card .card-header .share img.user-simple-share-icons {
    width: 20px;
    height: 20px;
    margin-top: 15px;
}
#feeds .card .card-body {
    padding: 0;
}
#feeds .card .card-body .video-feeds video {
    width: 614px;
    height: 344px;
}
#feeds .card .card-body .video-feeds .ico-feeds-video {
    position: absolute;
    top: 42%;
    left: 45%;
}
#feeds .card .card-body .video-feeds .ico-feeds-video img {
    width: 64px;
}
#feeds .card .card-body .swiper1 .swiper-wrapper {
    width: 641px;
    height: 350px;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slick-track {
    margin: 0 !important;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slick-slider {
    background: url(../image/elements/loader.gif);
}
#feeds
    .card
    .card-body
    .slider-feeds
    .slider-feeds-all
    .slick-slider
    .slick-list {
    opacity: 0;
    position: absolute;
}
#feeds
    .card
    .card-body
    .slider-feeds
    .slider-feeds-all
    .slick-slider.slick-initialized {
    background: none;
}
#feeds
    .card
    .card-body
    .slider-feeds
    .slider-feeds-all
    .slick-slider.slick-initialized
    .slick-list {
    opacity: 1;
    position: relative;
    transition: opacity 0.2s ease-in;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slide {
    width: 614px;
    height: 100%;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slide img {
    width: 614px;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slick-dots {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
    margin-bottom: -10px;
    list-style-type: none;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slick-dots li {
    margin: 0;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slick-dots button {
    display: block;
    width: 6px;
    height: 6px;
    padding: 0;
    border: none;
    border-radius: 100%;
    background-color: #d8d8d8;
    text-indent: -9999px;
}
#feeds
    .card
    .card-body
    .slider-feeds
    .slider-feeds-all
    .slick-dots
    li.slick-active
    button {
    background-color: #4a90e2;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slick-prev {
    left: 20px;
    z-index: 1;
}
#feeds .card .card-body .slider-feeds .slider-feeds-all .slick-next {
    right: 20px;
    z-index: 1;
}
#feeds .card .card-body .slider-feeds .slick-dotted.slick-slider {
    margin-bottom: 20px !important;
}
#feeds .card .card-footer {
    border-top: 0 !important;
    padding: 20px;
}
#feeds .card .card-footer .description-feeds {
    border-left: solid 2px #313131;
    padding: 0 0 0 20px;
}
#feeds .card .card-footer .description-feeds p.card-text {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#feeds .btn-load-more {
    padding-bottom: 30px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}

#live-or-never {
    margin-top: 61px;
    width: 100%;
    background-color: #282828;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overflow: hidden;
    position: relative;
}
#live-or-never #bgforcontent {
    position: absolute;
    width: 100%;
    height: 580px;
    background-color: #282828;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    top: 408px;
    right: 0;
    z-index: 1;
}
#live-or-never ul.live-event {
    padding: 20px 0px 0px 0px;
    display: flex;
}
#live-or-never ul.live-event li {
    text-align: center;
    width: 50%;
}
#live-or-never ul.live-event li h2 {
    color: #ffffff;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#live-or-never ul.live-event li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#live-or-never ul.live-event li.active h2 {
    color: #ffffff;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#live-or-never ul.live-event:before {
    content: "";
    position: absolute;
    left: 30px;
    top: 0;
    height: 1px;
    width: 94%;
    /* or 100px */
    border-top: 1px solid #000000;
}
#live-or-never .live-video {
    z-index: 2;
}
#live-or-never .live-video .item {
    position: relative;
}
#live-or-never .live-video .item video {
    width: 100%;
    /* height: auto; */
}
#live-or-never .live-video .item .ico-play-live-video {
    position: absolute;
    top: 45%;
    left: 45%;
}
#live-or-never .live-video .item .ico-play-live-video img {
    width: 40px;
}
#live-or-never .live-video .item .error-message {
    display: none;
}

#live-or-never .live-video .title-scene {
    padding: 15px 0;
}
#live-or-never .live-video .title-scene h4 {
    display: inline;
}
#live-or-never .live-video .title-scene h4 a {
    text-decoration: none;
    font-family: HelveticaNeue-light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .live-video .title-scene .icon-share {
    display: inline;
    float: right;
    margin-top: -17px;
}
#live-or-never .live-video .title-scene .icon-share a img {
    margin-right: 10px;
}
#live-or-never .live-video .title-scene .icon-share .btn-share {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 15px;
    margin: 10px;
    cursor: pointer;
}
#live-or-never .scheduler {
    position: inherit;
    width:100%;
}
#live-or-never .scheduler .tabs-style-underline nav {
    background: #171717;
}
#live-or-never .scheduler .tabs-style-underline nav a {
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}
#live-or-never .scheduler .tabs-style-underline nav a span {
    font-weight: 700;
}
#live-or-never .scheduler .tabs-style-underline nav li a::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: red;
    content: "";
    -webkit-transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    -webkit-transform: translate3d(0, 150%, 0);
    transform: translate3d(0, 150%, 0);
}
#live-or-never .scheduler .tabs-style-underline nav li.tab-current a::after {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
#live-or-never .scheduler .menu-tv ul.menu-tv-list {
    padding: 20px 20px 20px 10px;
}
#live-or-never .scheduler .menu-tv ul.menu-tv-list li {
    padding: 0 10px;
    margin: 0 15px 0 0;
}
#live-or-never .scheduler .menu-tv ul.menu-tv-list li a img {
    width: auto;
    height: 20px;
}
#live-or-never .scheduler .menu-tv ul.menu-tv-list li {
    background-color: rgba(255, 255, 255, 0.02);
    border: 0;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#live-or-never .scheduler .menu-tv ul.menu-tv-list li.active {
    border: 1px solid #265bab;
    background-color: transparent;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#live-or-never .scheduler .title {
    background: #212121;
    height: 80px;
    padding: 15px;
    margin-top: 30px;
    border-left: 1px solid red;
}
#live-or-never .scheduler .title .tv-line {
    fill: #c41f26 !important;
}
#live-or-never .scheduler .title img {
    display: inline;
    margin-right: 10px;
    margin-top: -17px;
    fill: green;
    height: 27px;
}
#live-or-never .scheduler .title h2 {
    display: inline;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .scheduler .title h4 {
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0.54px;
    color: #ffffff;
}
#live-or-never .scheduler .title .icon-play {
    display: inline;
    float: right;
    margin: 0;
}
#live-or-never .scheduler .now-playing {
    padding: 15px;
    display: flow-root;
}
#live-or-never .scheduler .current-play {
    background: #212121;
}
#live-or-never .scheduler .now-playing .tv-line {
    fill: #c41f26 !important;
}
#live-or-never .scheduler .now-playing img {
    display: inline;
    margin-right: 10px;
    margin-top: -17px;
    fill: green;
    height: 27px;
}
#live-or-never .scheduler .now-playing h2 {
    display: inline;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .scheduler .now-playing h4 {
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0.54px;
    color: #ffffff;
}
#live-or-never .scheduler .now-playing .icon-share {
    display: inline;
    float: right;
    margin: 0;
}
#live-or-never .scheduler .icon-schedule {
    display: inline-block;
    float: left;
    padding-top: 15px;
    padding-right: 10px;
}
#live-or-never .scheduler .icon-schedule img {
    width: 40px;
    height: 40px;
}
#live-or-never .scheduler .current-play h2 {
    color: #333333 !important;
}
#live-or-never .scheduler .current-play h4 {
    color: #333333 !important;
}
#live-or-never .scheduler .schedule-list {
    overflow-y: scroll;
    height: 325px;
}
#live-or-never .scheduler .btn-date {
    color: #fff;
    background-color: #3A3A3A;
    border-top: 2px solid #3a3a3a;
    border-bottom: 2px solid #3a3a3a;
    border-right: unset !important;
    border-left: unset !important;
    border-radius: unset !important;
}
#live-or-never .scheduler .btn-date:not(:disabled):not(.disabled):active,
#live-or-never .scheduler .btn-date:not(:disabled):not(.disabled):active:focus,
#live-or-never .scheduler .btn-date:focus,
#live-or-never .scheduler .btn-date:hover {
    border-bottom: 2px solid #0062cc;
    box-shadow: none !important;
}
#live-or-never .scheduler .btn-date h4 {
    color: #fff;
    line-height: 1.8em !important;
}
#live-or-never .scheduler .btn-date h5 {
    color: #fff;
    font-size: 14px !important;
    line-height: 1.8em !important;
}
#live-or-never .scheduler .btn-date-active {
    border-bottom: 2px solid #0062cc;
}
#live-or-never .scheduler .label-today {
    background-color: #282828;
    color: #FFFFFF;
    font-size: 10px !important;
    font-weight: bold;
    padding: 5px 20px 5px 20px;
    border-radius: 30px;
}
#live-or-never .scheduler .tv-overlay {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2;
}
#live-or-never .scheduler .btn-tab-channel {
    color: #fff;
    background-color: #1a1a1a;
    border-radius: 8px;
    width: 60%;
    padding: 10px 0 5px 0;
    font-size: 1.5rem;
}
#live-or-never .scheduler .btn-tab-channel:not(:disabled):not(.disabled):active,
#live-or-never
    .scheduler
    .btn-tab-channel:not(:disabled):not(.disabled):active:focus,
#live-or-never .scheduler .btn-tab-channel:focus,
#live-or-never .scheduler .btn-tab-channel:hover {
    border: 2px solid #9dddf3;
}
#live-or-never .scheduler .btn-tab-channel-active {
    border: 2px solid #9dddf3;
    background: linear-gradient(
        0deg,
        rgba(157, 221, 243, 0.2) 0%,
        rgba(41, 186, 236, 0.2) 104.73%
    );
}
#live-or-never .scheduler .spinner {
    height: 100px;
    width: 100px;
    margin: auto;
    display: flex;
    position: absolute;
    -webkit-animation: rotation 0.6s infinite linear;
    -moz-animation: rotation 0.6s infinite linear;
    -o-animation: rotation 0.6s infinite linear;
    animation: rotation 0.6s infinite linear;
    border-left: 6px solid rgba(0, 174, 239, 0.15);
    border-right: 6px solid rgba(0, 174, 239, 0.15);
    border-bottom: 6px solid rgba(0, 174, 239, 0.15);
    border-top: 6px solid rgba(0, 174, 239, 0.8);
    border-radius: 100%;
}
#live-or-never .scheduler .cursor-pointer {
    cursor: pointer;
}
#live-or-never .scheduler span a {
    text-decoration: none;
    font-family: HelveticaNeue-light;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px;
}
#live-or-never .scheduler .jadwal {
    margin: 25px;
    cursor: pointer;
}
#live-or-never .scheduler .jadwal .slick-slide .slick-cloned {
    width: 180px !important;
}
#live-or-never .scheduler .jadwal .active {
    border: red 1px solid;
}
#live-or-never .scheduler .jadwal .slide {
    width: auto;
    height: 60px;
    object-fit: contain;
    border-radius: 30px;
    background-color: #212121;
    padding: 20px 44px;
    text-align: center;
}
#live-or-never .scheduler .jadwal .slide .text-active {
    color: red;
}
#live-or-never .scheduler .jadwal .slide .tanggal {
    width: 142px;
    height: 22px;
    font-family: "Open Sans SemiBold";
    font-size: 12px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.54px;
    color: #ffffff;
}
#live-or-never .scheduler .info {
    padding-bottom: 50px;
}
#live-or-never .scheduler .info ul li {
    height: 60px;
    padding: 20px 15px;
}
#live-or-never .scheduler .info ul li .time {
    display: inline;
    font-family: "Open Sans Light";
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.68px;
    color: #808080;
}
#live-or-never .scheduler .info ul li .sub-title {
    margin-left: 25px;
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.68px;
    color: #808080;
}
#live-or-never .scheduler .info ul li .icon-play {
    display: inline;
    float: right;
    margin: 0;
    margin-top: -5px;
}
#live-or-never .scheduler .info ul li .icon-play img {
    height: 27px;
}
#live-or-never .scheduler .info-catchup {
    padding-bottom: 50px;
}
#live-or-never .scheduler .info-catchup ul li {
    height: 60px;
    padding: 20px 15px;
}
#live-or-never .scheduler .info-catchup ul li .time {
    display: inline;
    font-family: "Open Sans Light";
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.68px;
    color: #808080;
}
#live-or-never .scheduler .info-catchup ul li .sub-title {
    margin-left: 25px;
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.68px;
    color: #808080;
}
#live-or-never .scheduler .info-catchup ul li .icon-play {
    display: inline;
    float: right;
    margin: 0;
    margin-top: -5px;
}
#live-or-never .scheduler .info-catchup ul li .icon-play img {
    height: 27px;
}
#live-or-never .live-chat-on {
    background-color: #3A3A3A;
    border-radius: 8px;
}
#live-or-never .live-chat-on .item .live-header {
    background-color: #171717;
    height: 50px;
    margin: 0px;
    border-radius: 8px;
}
#live-or-never .live-chat-on .item .live-header .warning {
    text-align: center;
    position: absolute;
    width: 100%;
    /* top: 20%; */
    margin-top:60px;
    left: 50%;
    /* bring your own prefixes */
    transform: translate(-50%, -50%);
}
#live-or-never .live-chat-on .item .live-header .warning h5 {
    margin-bottom: 16;
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#live-or-never .live-chat-on .item .live-header .warning p {
    width: 240px;
    margin: 0 auto;
    font-family: "Open Sans Light";
    font-size: 12px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#live-or-never .live-chat-on .item .live-header .warning .btn-red {
    height: 35px;
    padding: 10px 100px;
    background-color: red;
    border-radius: 7px;
    color: white;
}
#live-or-never .live-chat-on .item .live-header .title-messages h5 {
    font-family: "Open Sans Regular";
    font-size: 21px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    margin-top: 12px;
}
#live-or-never .live-chat-on .item .live-header .live-chat-icon-on h5 {
    font-family: "Open Sans Regular";
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live-or-never
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-on
    h5
    .fa-circle {
    color: #7ed321 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live-or-never .live-chat-on .item .live-header .live-chat-icon-off h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live-or-never
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-off
    h5
    .fa-circle {
    color: #c41f26 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live-or-never .live-chat-on .item .messages {
    margin: 10px 0 0 0;
    overflow-y: scroll;
}
#live-or-never .live-chat-on .item .messages .chat-box {
    padding: 15px;
    height: 500px;
    overflow-y: scroll;
    overflow-x: hidden;
}
@media (max-width: 1440px) {
    #live-or-never .live-chat-on .item .messages .chat-box {
        height: 500px !important;
        overflow-y: scroll;
        overflow-x: hidden;
    }
}
@media screen and (max-width: 1920px) {
    #live-or-never .live-chat-on .item .messages .chat-box {
        height: 600px;
        overflow-y: scroll;
        overflow-x: hidden;
    }
}
#live-or-never .live-chat-on .item .messages .message {
    float: left;
    width: 100%;
    margin: 10px 0;
    border-bottom: 1px solid #ccc;
}
#live-or-never .live-chat-on .item .messages .message p {
    font-size: 0.8em;
    width: 90%;
    margin: 5px 0;
}
#live-or-never .live-chat-on .item .messages img {
    border-radius: 100%;
    float: left;
    margin: 0 10px 15px 0;
}
#live-or-never .live-chat-on .item .messages .fill {
    width: 271px;
}
#live-or-never .live-chat-on .item .messages p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: normal;
    color: #ffffff;
    margin-bottom: 5px !important;
}
#live-or-never .live-chat-on .item .messages h6 {
    display: inline;
    font-family: HelveticaNeue-Light;
    font-size: 9px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #909090;
}
#live-or-never .live-chat-on .item .messages h4 {
    display: inline;
    font-family: HelveticaNeue-Medium;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #909090;
}
#live-or-never .live-chat-on .item .messages ul li {
    display: inline-block;
    color: white;
    margin-right: 10px;
}
#live-or-never .live-chat-on .item .messages ul li h5 {
    display: inline;
    color: #81bbff;
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.56px;
    color: #ffffff;
}
#live-or-never .live-chat-on .item .messages ul li p {
    display: inline;
    color: #ffffff;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.56px;
    color: #ffffff;
    margin-bottom: 0 !important;
}
#live-or-never .live-chat-on .item .messages ul li:nth-last-child(1) {
    margin-bottom: 20px;
}
#live-or-never .live-chat-on .item .messages::-webkit-scrollbar {
    display: none;
}
#live-or-never .live-chat-on .item .bottom {
    border-top: solid 0.5px #777777;
}
#live-or-never .live-chat-on .item .bottom .chat-input {
    padding: 5px;
    flex: 0 0 auto;
    height: 46px;
    background: #171717;
    border-radius: 0px 0px 8px 8px;
}
#live-or-never .live-chat-on .item .bottom .chat-input .far {
    padding: 10px 0 10px 10px;
    color: #909090;
    text-decoration: none;
    font-size: 20px;
}
#live-or-never .live-chat-on .item .bottom .chat-input input {
    height: 45px;
    line-height: 60px;
    outline: 0 none;
    border: none;
    width: calc(100% - 60px);
    color: white;
    text-indent: 10px;
    font-family: "Open Sans Light";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    padding: 0;
    background: #303030;
}
#live-or-never .live-chat-on .item .bottom .btn-chat {
    background: none;
    border: none;
    float: right;
    margin-top: -28px;
}
#live-or-never .live-chat-on .item .bottom .btn-chat img {
    height: 17px;
}
#live-or-never .live-chat-on .item .bottom ::placeholder {
    font-family: "Open Sans Italic";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#live-or-never .live-chat-on .side-panel {
    width: 335px;
    position: absolute;
    z-index: 2;
    padding-top: 60px;
    overflow: hidden;
}
#live-or-never .live-chat-on .side-panel h2 {
    font-family: HelveticaNeue-light;
    font-size: 22px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .live-chat-on .side-panel p {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    margin-top: -13px;
    margin-bottom: 5px !important;
}
#live-or-never .live-chat-on .side-panel .date {
    text-align: center;
    background-color: rgba(255, 255, 255, 0.02);
    border: 0;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#live-or-never .live-chat-on .side-panel .date span.left {
    display: inline;
    float: left;
}
#live-or-never .live-chat-on .side-panel .date span.left a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .live-chat-on .side-panel .date .show-time {
    display: inline;
}
#live-or-never .live-chat-on .side-panel .date .show-time a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .live-chat-on .side-panel .date span.right {
    display: inline;
    float: right;
}
#live-or-never .live-chat-on .side-panel .date span.right a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .live-chat-on .side-panel .info-catch-up {
    padding-bottom: 10px;
    height: 310px;
    overflow-y: scroll;
    margin-right: -35px;
}
#live-or-never .live-chat-on .side-panel .info-catch-up ul li {
    border-bottom: solid 1px #202020;
    line-height: 20px;
    padding: 6px 0;
}
#live-or-never .live-chat-on .side-panel .info-catch-up ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px 0 15px;
}
#live-or-never .live-chat-on .side-panel .info-catch-up ul li .sub-title {
    padding-top: 0;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding-left: 15px;
}
#live-or-never .live-chat-on .side-panel .info-catch-up ul li .icon-play {
    display: inline;
    float: right;
    margin: -10px 15px 0 0;
}
#live-or-never .live-chat-on .side-panel .info-catch-up ul li .icon-play img {
    color: #4a90e2;
    display: none;
}
#live-or-never .live-chat-on .side-panel .info-catch-up ul li:hover {
    background-color: #2f2f2f;
}
#live-or-never
    .live-chat-on
    .side-panel
    .info-catch-up
    ul
    li:hover
    .icon-play
    img {
    display: block;
    margin-right: 35px;
    margin-top: 5px;
}
#live-or-never .live-chat-on .side-panel .info-catch-up::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}
#live-or-never .live-chat-on .side-panel .info-catch-up {
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
}
#live-or-never .live-chat-off {
    padding-top: 50px;
    background-color: none;
    height: 0;
    margin: 0 15px;
}
#live-or-never .live-chat-off .item .live-header {
    background-color: rgba(255, 255, 255, 0.02);
    height: 40px;
    position: relative;
}
#live-or-never .live-chat-off .item .live-header .warning {
    position: absolute;
}
#live-or-never .live-chat-off .item .live-header .title-messages h5 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    margin-top: 12px;
}
#live-or-never .live-chat-off .item .live-header .live-chat-icon-on h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live-or-never
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-on
    h5
    .fa-circle {
    color: #7ed321 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live-or-never .live-chat-off .item .live-header .live-chat-icon-off h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live-or-never
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-off
    h5
    .fa-circle {
    color: grey !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live-or-never .live-chat-off .item .messages {
    display: none;
    margin: 10px 0 0 0;
    height: 243px;
}
#live-or-never .live-chat-off .item .messages ul li {
    display: inline-block;
    color: white;
    margin-right: 10px;
}
#live-or-never .live-chat-off .item .messages ul li h5 {
    display: inline;
    color: #81bbff;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
}
#live-or-never .live-chat-off .item .messages ul li p {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    margin-bottom: 0 !important;
}
#live-or-never .live-chat-off .item .messages ul li:nth-last-child(1) {
    margin-bottom: 20px;
}
#live-or-never .live-chat-off .item .bottom {
    margin: 0 -15px 0 -15px;
}
#live-or-never .live-chat-off .item .bottom .chat-input {
    flex: 0 0 auto;
    height: 46px;
    background: #303030;
}
#live-or-never .live-chat-off .item .bottom .chat-input input {
    height: 45px;
    line-height: 60px;
    outline: 0 none;
    border: none;
    width: calc(100% - 60px);
    color: white;
    text-indent: 10px;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    padding: 0;
    background: #303030;
}
#live-or-never .live-chat-off .item .bottom ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#live-or-never .side-panel {
    width: 335px;
    position: absolute;
    z-index: 2;
    overflow: hidden;
    top: 472px;
}
#live-or-never .side-panel h2 {
    font-family: HelveticaNeue-light;
    font-size: 22px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .side-panel p {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    margin-top: -13px;
    margin-bottom: 5px !important;
}
#live-or-never .side-panel .date {
    text-align: center;
    background-color: rgba(255, 255, 255, 0.02);
    border: 0;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#live-or-never .side-panel .date span.left {
    display: inline;
    float: left;
}
#live-or-never .side-panel .date span.left a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .side-panel .date .show-time {
    display: inline;
}
#live-or-never .side-panel .date .show-time a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .side-panel .date span.right {
    display: inline;
    float: right;
}
#live-or-never .side-panel .date span.right a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .side-panel .info-catch-up {
    padding-bottom: 10px;
    height: 310px;
    overflow-y: scroll;
    margin-right: -35px;
}
#live-or-never .side-panel .info-catch-up ul li {
    border-bottom: solid 1px #202020;
    line-height: 20px;
    padding: 6px 0;
}
#live-or-never .side-panel .info-catch-up ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px 0 15px;
}
#live-or-never .side-panel .info-catch-up ul li .sub-title {
    padding-top: 0;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding-left: 15px;
}
#live-or-never .side-panel .info-catch-up ul li .icon-play {
    display: inline;
    float: right;
    margin: -10px 15px 0 0;
}
#live-or-never .side-panel .info-catch-up ul li .icon-play img {
    color: #4a90e2;
    display: none;
}
#live-or-never .side-panel .info-catch-up ul li:hover {
    background-color: #2f2f2f;
}
#live-or-never .side-panel .info-catch-up ul li:hover .icon-play img {
    display: block;
    margin-right: 35px;
    margin-top: 5px;
}
#live-or-never .side-panel .info-catch-up::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}
#live-or-never .side-panel .info-catch-up {
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
}
#live-or-never .back-to-back {
    position: relative;
    width: 100%;
    height: 600px;
    background-color: #282828;
    margin-top: 380px;
}
#live-or-never .back-to-back .top {
    margin-top: 50px;
    margin-bottom: 50px;
    position: absolute;
    top: -380px;
    left: 0;
    z-index: 1;
}
#live-or-never .back-to-back .top .live-video .item {
    position: relative;
}
#live-or-never .back-to-back .top .live-video .item video {
    width: 100%;
    height: 100%;
}
#live-or-never .back-to-back .top .live-video .item .ico-play-live-video {
    position: absolute;
    top: 45%;
    left: 45%;
}
#live-or-never .back-to-back .top .live-video .item .ico-play-live-video img {
    width: 40px;
}
#live-or-never .back-to-back .top .live-video .item .error-message {
    position: absolute;
    top: 30%;
    left: 46%;
    display: none;
    z-index: 9;
}
#live-or-never .back-to-back .top .live-video .item .error-message img {
    width: 60px;
}
#live-or-never .back-to-back .top .live-video .item .error-message h4 {
    font-family: "Open Sans SemiBold";
    position: relative;
    left: -33%;
    color: white;
    line-height: 1.7 !important;
    font-size: 20px;
}
#live-or-never .back-to-back .top .live-video .item .error-message p {
    text-align: center;
    position: relative;
    left: -34%;
    font-family: "Open Sans Light";
    font-size: 15px;
}
#live-or-never .back-to-back .top .live-video .title-scene {
    padding: 15px 0;
}
#live-or-never .back-to-back .top .live-video .title-scene h4 {
    display: inline;
}
#live-or-never .back-to-back .top .live-video .title-scene h4 a {
    text-decoration: none;
    font-family: HelveticaNeue-light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .back-to-back .top .live-video .title-scene .icon-share {
    display: inline;
    float: right;
    margin-top: -17px;
}
#live-or-never .back-to-back .top .live-video .title-scene .icon-share a img {
    margin-right: 10px;
}
#live-or-never
    .back-to-back
    .top
    .live-video
    .title-scene
    .icon-share
    .btn-share {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 15px;
    margin: 10px;
    cursor: pointer;
}
#live-or-never .back-to-back .top .live-chat-on {
    background-color: #282828;
    height: 310px;
}
#live-or-never .back-to-back .top .live-chat-on .item .live-header {
    background-color: #0c5194;
    height: 40px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .title-messages
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    margin-top: 12px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-on
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-on
    h5
    .fa-circle {
    color: #7ed321 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-off
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-off
    h5
    .fa-circle {
    color: #c41f26 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live-or-never .back-to-back .top .live-chat-on .item .messages {
    margin: 10px 0 0 0;
    height: 243px;
}
#live-or-never .back-to-back .top .live-chat-on .item .messages ul li {
    display: inline-block;
    color: white;
    margin-right: 10px;
}
#live-or-never .back-to-back .top .live-chat-on .item .messages ul li h5 {
    display: inline;
    color: #81bbff;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
}
#live-or-never .back-to-back .top .live-chat-on .item .messages ul li p {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    margin-bottom: 0 !important;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-on
    .item
    .messages
    ul
    li:nth-last-child(1) {
    margin-bottom: 20px;
}
#live-or-never .back-to-back .top .live-chat-on .item .bottom {
    margin: 15px -15px 0 -15px;
}
#live-or-never .back-to-back .top .live-chat-on .item .bottom .chat-input {
    flex: 0 0 auto;
    height: 46px;
    background: #303030;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-on
    .item
    .bottom
    .chat-input
    input {
    height: 45px;
    line-height: 60px;
    outline: 0 none;
    border: none;
    width: calc(100% - 60px);
    color: white;
    text-indent: 10px;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    padding: 0;
    background: #303030;
}
#live-or-never .back-to-back .top .live-chat-on .item .bottom ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#live-or-never .back-to-back .top .live-chat-off {
    background-color: #282828;
    height: 0;
}
#live-or-never .back-to-back .top .live-chat-off .item .live-header {
    background-color: #0c5194;
    height: 40px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .title-messages
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    margin-top: 12px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-on
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-on
    h5
    .fa-circle {
    color: #7ed321 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-off
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-off
    h5
    .fa-circle {
    color: #c41f26 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live-or-never .back-to-back .top .live-chat-off .item .messages {
    display: none;
    margin: 10px 0 0 0;
    height: 243px;
}
#live-or-never .back-to-back .top .live-chat-off .item .messages ul li {
    display: inline-block;
    color: white;
    margin-right: 10px;
}
#live-or-never .back-to-back .top .live-chat-off .item .messages ul li h5 {
    display: inline;
    color: #81bbff;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
}
#live-or-never .back-to-back .top .live-chat-off .item .messages ul li p {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    margin-bottom: 0 !important;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-off
    .item
    .messages
    ul
    li:nth-last-child(1) {
    margin-bottom: 20px;
}
#live-or-never .back-to-back .top .live-chat-off .item .bottom {
    margin: 0 -15px -15px;
}
#live-or-never .back-to-back .top .live-chat-off .item .bottom .chat-input {
    flex: 0 0 auto;
    height: 46px;
    background: #303030;
}
#live-or-never
    .back-to-back
    .top
    .live-chat-off
    .item
    .bottom
    .chat-input
    input {
    height: 45px;
    line-height: 60px;
    outline: 0 none;
    border: none;
    width: calc(100% - 60px);
    color: white;
    text-indent: 10px;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    padding: 0;
    background: #303030;
}
#live-or-never .back-to-back .top .live-chat-off .item .bottom ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#live-or-never .back-to-back .top .side-panel {
    padding-top: 105px;
    overflow: hidden;
}
#live-or-never .back-to-back .top .side-panel h2 {
    font-family: HelveticaNeue-light;
    font-size: 22px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .back-to-back .top .side-panel p {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    margin-top: -13px;
    margin-bottom: 5px !important;
}
#live-or-never .back-to-back .top .side-panel .date {
    text-align: center;
    padding-bottom: 10px;
}
#live-or-never .back-to-back .top .side-panel .date span.left {
    display: inline;
    float: left;
}
#live-or-never .back-to-back .top .side-panel .date span.left a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .back-to-back .top .side-panel .date .show-time {
    display: inline;
}
#live-or-never .back-to-back .top .side-panel .date .show-time a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .back-to-back .top .side-panel .date span.right {
    display: inline;
    float: right;
}
#live-or-never .back-to-back .top .side-panel .date span.right a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live-or-never .back-to-back .top .side-panel .info-catch-up {
    padding-bottom: 10px;
    height: 310px;
    overflow-y: scroll;
    margin-right: -35px;
}
#live-or-never .back-to-back .top .side-panel .info-catch-up ul li {
    border-bottom: solid 1px #202020;
    line-height: 20px;
    padding: 6px 0;
}
#live-or-never .back-to-back .top .side-panel .info-catch-up ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px 0 15px;
}
#live-or-never .back-to-back .top .side-panel .info-catch-up ul li .sub-title {
    padding-top: 0;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding-left: 15px;
}
#live-or-never .back-to-back .top .side-panel .info-catch-up ul li .icon-play {
    display: inline;
    float: right;
    margin: -10px 15px 0 0;
}
#live-or-never
    .back-to-back
    .top
    .side-panel
    .info-catch-up
    ul
    li
    .icon-play
    img {
    color: #4a90e2;
    display: none;
}
#live-or-never .back-to-back .top .side-panel .info-catch-up ul li:hover {
    background-color: #2f2f2f;
}
#live-or-never
    .back-to-back
    .top
    .side-panel
    .info-catch-up
    ul
    li:hover
    .icon-play
    img {
    display: block;
    margin-right: 25px;
}
#live-or-never
    .back-to-back
    .top
    .side-panel
    .info-catch-up::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}
#live-or-never .back-to-back .top .side-panel .info-catch-up {
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
}

#live {
    margin-top: 61px;
    width: 100%;
    /* height: auto; */
    background-color: #282828;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overflow: hidden;
    position: relative;
}
#live ul.live-event {
    padding: 20px 0px 0px 0px;
    display: flex;
}
#live ul.live-event li {
    text-align: center;
    width: 50%;
}
#live ul.live-event li h2 {
    color: #ffffff;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#live ul.live-event li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#live ul.live-event li.active h2 {
    color: #ffffff;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#live ul.live-event:before {
    content: "";
    position: absolute;
    left: 30px;
    top: 0;
    height: 1px;
    width: 94%;
    /* or 100px */
    border-top: 1px solid #000000;
}
#live .back-to-back {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #282828;
}
#live .back-to-back .top {
    margin-top: 15px;
    margin-bottom: 50px;
    position: absolute;
    left: 0;
    z-index: 1;
}
#live .back-to-back .top .live-video .item {
    position: relative;
}
#live .back-to-back .top .live-video .item .error-message {
    position: absolute;
    top: 30%;
    left: 46%;
    display: none;
    z-index: 9;
}
#live .back-to-back .top .live-video .item .error-message img {
    width: 60px;
}
#live .back-to-back .top .live-video .item .error-message h4 {
    font-family: "Open Sans SemiBold";
    position: relative;
    left: -18%;
    color: white;
    line-height: 1.7 !important;
    font-size: 20px;
}
#live .back-to-back .top .live-video .item .error-message p {
    text-align: center;
    position: relative;
    left: -34%;
    font-family: "Open Sans Light";
    font-size: 15px;
}
#live .back-to-back .top .live-video .item video {
    width: 100%;
    height: 100%;
}
#live .back-to-back .top .live-video .item .ico-play-live-video {
    position: absolute;
    top: 45%;
    left: 45%;
}
#live .back-to-back .top .live-video .item .ico-play-live-video img {
    width: 40px;
}
#live .back-to-back .top .live-video .title-scene {
    padding: 15px 0;
}
#live .back-to-back .top .live-video .title-scene h2 {
    width: 218px;
    height: 33px;
    font-family: "Open Sans Bold";
    font-size: 24px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.96px;
    color: #ffffff;
}
#live .back-to-back .top .live-video .title-scene h2 {
    display: inline;
}
#live .back-to-back .top .live-video .title-scene h2 a {
    text-decoration: none;
    font-family: HelveticaNeue-light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .live-video .title-scene .icon-share {
    display: inline;
    float: right;
}
#live .back-to-back .top .live-video .title-scene .icon-share .btn-share {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 15px;
    margin: 10px;
    cursor: pointer;
}
#live .back-to-back .top .live-video .coming {
    /* position: absolute; */
    color: #ffffff;
    background-color: white;
    z-index: 1;
    padding: 15px 10px;
    border-radius: 3px;
    display: inline;
    margin-right: 10px;
    height: auto;
    width: 100%;
}
#live .back-to-back .top .live-video .coming h2 {
    text-decoration: none;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: black;
    display: inline;
}
#live .back-to-back .top .live-chat-on {
    background-color: #212121;
}
#live .back-to-back .top .live-chat-on .item .live-header {
    background-color: #212121;
    height: 40px;
}
#live .back-to-back .top .live-chat-on .item .live-header .warning {
    text-align: center;
    position: absolute;
    width: 100%;
    bottom: 42px;
    left: 50%;
    /* bring your own prefixes */
    transform: translate(-50%, -50%);
}
#live .back-to-back .top .live-chat-on .item .live-header .warning h5 {
    margin: 0;
    font-family: "Open Sans SemiBold";
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#live .back-to-back .top .live-chat-on .item .live-header .warning p {
    width: 240px;
    margin: 0 auto;
    font-family: "Open Sans Light";
    font-size: 12px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#live .back-to-back .top .live-chat-on .item .live-header .warning .btn-red {
    height: 35px;
    padding: 10px 100px;
    background-color: red;
    border-radius: 7px;
    color: white;
}
#live .back-to-back .top .live-chat-on .item .live-header .title-messages h5 {
    font-family: "Open Sans Semibold";
    font-size: 21px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    margin-top: 12px;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-on
    h5 {
    font-family: "Open Sans Semibold";
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-on
    h5
    .fa-circle {
    color: #7ed321 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-off
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .item
    .live-header
    .live-chat-icon-off
    h5
    .fa-circle {
    color: #c41f26 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live .back-to-back .top .live-chat-on .item .messages {
    margin: 10px 0 0 0;
    overflow-y: scroll;
}
#live .back-to-back .top .live-chat-on .item .messages .chat-box {
    height: 500px;
    overflow-y: scroll;
    overflow-x: hidden;
}
@media (max-width: 1440px) {
    #live .back-to-back .top .live-chat-on .item .messages .chat-box {
        height: 500px !important;
        overflow-y: scroll;
        overflow-x: hidden;
    }
}
@media screen and (max-width: 1920px) {
    #live .back-to-back .top .live-chat-on .item .messages .chat-box {
        height: 600px;
        overflow-y: scroll;
        overflow-x: hidden;
    }
}
#live .back-to-back .top .live-chat-on .item .messages .message {
    float: left;
    width: 100%;
    margin: 10px 0;
    border-bottom: 1px solid #ccc;
}
#live .back-to-back .top .live-chat-on .item .messages .message p {
    font-size: 0.8em;
    width: 90%;
    margin: 5px 0;
}
#live .back-to-back .top .live-chat-on .item .messages img {
    border-radius: 100%;
    float: left;
    margin: 0 10px 15px 0;
}
#live .back-to-back .top .live-chat-on .item .messages .fill {
    width: 271px;
}
#live .back-to-back .top .live-chat-on .item .messages p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: normal;
    color: #ffffff;
    margin-bottom: 5px !important;
}
#live .back-to-back .top .live-chat-on .item .messages h6 {
    display: inline;
    font-family: HelveticaNeue-Light;
    font-size: 9px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #909090;
}
#live .back-to-back .top .live-chat-on .item .messages h4 {
    display: inline;
    font-family: HelveticaNeue-Medium;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #909090;
}
#live .back-to-back .top .live-chat-on .item .messages ul li {
    display: inline-block;
    color: white;
    margin-right: 10px;
}
#live .back-to-back .top .live-chat-on .item .messages ul li h5 {
    display: inline;
    color: #81bbff;
    font-family: "Open Sans SemiBold";
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.56px;
    color: #ffffff;
}
#live .back-to-back .top .live-chat-on .item .messages ul li p {
    display: inline;
    color: #ffffff;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.56px;
    color: #ffffff;
    margin-bottom: 0 !important;
}
#live .back-to-back .top .live-chat-on .item .messages ul li:nth-last-child(1) {
    margin-bottom: 20px;
}
#live .back-to-back .top .live-chat-on .item .messages::-webkit-scrollbar {
    display: none;
}
#live .back-to-back .top .live-chat-on .item .bottom {
    margin: 15px -15px -15px;
}
#live .back-to-back .top .live-chat-on .item .bottom .chat-input {
    padding: 5px;
    flex: 0 0 auto;
    height: 46px;
    background: #303030;
}
#live .back-to-back .top .live-chat-on .item .bottom .chat-input .far {
    padding: 10px 0 10px 10px;
    color: #909090;
    text-decoration: none;
    font-size: 20px;
}
#live .back-to-back .top .live-chat-on .item .bottom .chat-input input {
    height: 45px;
    line-height: 60px;
    outline: 0 none;
    border: none;
    width: calc(100% - 60px);
    color: white;
    text-indent: 10px;
    font-family: "Open Sans Light";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    padding: 0;
    background: #303030;
}
#live .back-to-back .top .live-chat-on .item .bottom ::placeholder {
    font-family: "Open Sans Italic";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#live .back-to-back .top .live-chat-on .item .bottom .btn-chat {
    background: none;
    border: none;
    float: right;
    margin-top: -28px;
}
#live .back-to-back .top .live-chat-on .item .bottom .btn-chat img {
    height: 17px;
}
#live .back-to-back .top .live-chat-on .side-panel {
    width: 335px;
    position: absolute;
    z-index: 2;
    padding-top: 60px;
    overflow: hidden;
}
#live .back-to-back .top .live-chat-on .side-panel h2 {
    font-family: HelveticaNeue-light;
    font-size: 22px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .live-chat-on .side-panel p {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    margin-top: -13px;
    margin-bottom: 5px !important;
}
#live .back-to-back .top .live-chat-on .side-panel .date {
    text-align: center;
    background-color: rgba(255, 255, 255, 0.02);
    border: 0;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#live .back-to-back .top .live-chat-on .side-panel .date span.left {
    display: inline;
    float: left;
}
#live .back-to-back .top .live-chat-on .side-panel .date span.left a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .live-chat-on .side-panel .date .show-time {
    display: inline;
}
#live .back-to-back .top .live-chat-on .side-panel .date .show-time a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .live-chat-on .side-panel .date span.right {
    display: inline;
    float: right;
}
#live .back-to-back .top .live-chat-on .side-panel .date span.right a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .live-chat-on .side-panel .info-catch-up {
    padding-bottom: 10px;
    height: 310px;
    overflow-y: scroll;
    margin-right: -35px;
}
#live .back-to-back .top .live-chat-on .side-panel .info-catch-up ul li {
    border-bottom: solid 1px #202020;
    line-height: 20px;
    padding: 6px 0;
}
#live .back-to-back .top .live-chat-on .side-panel .info-catch-up ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px 0 15px;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .side-panel
    .info-catch-up
    ul
    li
    .sub-title {
    padding-top: 0;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding-left: 15px;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .side-panel
    .info-catch-up
    ul
    li
    .icon-play {
    display: inline;
    float: right;
    margin: -10px 15px 0 0;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .side-panel
    .info-catch-up
    ul
    li
    .icon-play
    img {
    color: #4a90e2;
    display: none;
}
#live .back-to-back .top .live-chat-on .side-panel .info-catch-up ul li:hover {
    background-color: #2f2f2f;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .side-panel
    .info-catch-up
    ul
    li:hover
    .icon-play
    img {
    display: block;
    margin-right: 35px;
    margin-top: 5px;
}
#live
    .back-to-back
    .top
    .live-chat-on
    .side-panel
    .info-catch-up::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}
#live .back-to-back .top .live-chat-on .side-panel .info-catch-up {
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
}
#live .back-to-back .top .live-chat-off {
    background-color: #282828;
    height: 0;
}
#live .back-to-back .top .live-chat-off .item .live-header {
    background-color: #0c5194;
    height: 40px;
}
#live .back-to-back .top .live-chat-off .item .live-header .title-messages h5 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    margin-top: 12px;
}
#live
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-on
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-on
    h5
    .fa-circle {
    color: #7ed321 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-off
    h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#live
    .back-to-back
    .top
    .live-chat-off
    .item
    .live-header
    .live-chat-icon-off
    h5
    .fa-circle {
    color: #c41f26 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#live .back-to-back .top .live-chat-off .item .messages {
    display: none;
    margin: 10px 0 0 0;
    height: 243px;
}
#live .back-to-back .top .live-chat-off .item .messages ul li {
    display: inline-block;
    color: white;
    margin-right: 10px;
}
#live .back-to-back .top .live-chat-off .item .messages ul li h5 {
    display: inline;
    color: #81bbff;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
}
#live .back-to-back .top .live-chat-off .item .messages ul li p {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    margin-bottom: 0 !important;
}
#live
    .back-to-back
    .top
    .live-chat-off
    .item
    .messages
    ul
    li:nth-last-child(1) {
    margin-bottom: 20px;
}
#live .back-to-back .top .live-chat-off .item .bottom {
    margin: 15px -15px -15px;
}
#live .back-to-back .top .live-chat-off .item .bottom .chat-input {
    flex: 0 0 auto;
    height: 46px;
    background: #303030;
}
#live .back-to-back .top .live-chat-off .item .bottom .chat-input input {
    height: 45px;
    line-height: 60px;
    outline: 0 none;
    border: none;
    width: calc(100% - 60px);
    color: white;
    text-indent: 10px;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    padding: 0;
    background: #303030;
}
#live .back-to-back .top .live-chat-off .item .bottom ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#live .back-to-back .top .side-panel {
    padding-top: 105px;
    overflow: hidden;
}
#live .back-to-back .top .side-panel h2 {
    font-family: HelveticaNeue-light;
    font-size: 22px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .side-panel p {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    margin-top: -13px;
    margin-bottom: 5px !important;
}
#live .back-to-back .top .side-panel .date {
    text-align: center;
    padding-bottom: 10px;
}
#live .back-to-back .top .side-panel .date span.left {
    display: inline;
    float: left;
}
#live .back-to-back .top .side-panel .date span.left a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .side-panel .date .show-time {
    display: inline;
}
#live .back-to-back .top .side-panel .date .show-time a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .side-panel .date span.right {
    display: inline;
    float: right;
}
#live .back-to-back .top .side-panel .date span.right a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#live .back-to-back .top .side-panel .info-catch-up {
    padding-bottom: 10px;
    height: 310px;
    overflow-y: scroll;
    margin-right: -35px;
}
#live .back-to-back .top .side-panel .info-catch-up ul li {
    border-bottom: solid 1px #202020;
    line-height: 20px;
    padding: 6px 0;
}
#live .back-to-back .top .side-panel .info-catch-up ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px 0 15px;
}
#live .back-to-back .top .side-panel .info-catch-up ul li .sub-title {
    padding-top: 0;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding-left: 15px;
}
#live .back-to-back .top .side-panel .info-catch-up ul li .icon-play {
    display: inline;
    float: right;
    margin: -10px 15px 0 0;
}
#live .back-to-back .top .side-panel .info-catch-up ul li .icon-play img {
    color: #4a90e2;
    display: none;
}
#live .back-to-back .top .side-panel .info-catch-up ul li:hover {
    background-color: #2f2f2f;
}
#live .back-to-back .top .side-panel .info-catch-up ul li:hover .icon-play img {
    display: block;
    margin-right: 25px;
}
#live .back-to-back .top .side-panel .info-catch-up::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}
#live .back-to-back .top .side-panel .info-catch-up {
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
}

#content {
    margin-top: 0;
}
#content .schedule .menu-tv ul.menu-tv-list {
    padding: 20px 20px 20px 10px;
}
#content .schedule .menu-tv ul.menu-tv-list li {
    padding: 0 10px;
    margin: 0 15px 0 0;
}
#content .schedule .menu-tv ul.menu-tv-list li a img {
    width: auto;
    height: 20px;
}
#content .schedule .menu-tv ul.menu-tv-list li.active {
    border-bottom: 3px solid #265bab;
    padding-bottom: 15px;
}
#content .schedule .title {
    background: #2f2f2f;
    height: 50px;
    padding: 15px;
}
#content .schedule .title img {
    display: inline;
    margin-right: 10px;
    margin-top: -7px;
}
#content .schedule .title h3 {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#content .schedule .title .icon-play {
    display: inline;
    float: right;
    margin: 0;
}
#content .schedule span a {
    text-decoration: none;
    font-family: HelveticaNeue-light;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px;
}
#content .schedule .info {
    padding-bottom: 50px;
}
#content .schedule .info ul li {
    border-bottom: solid 1px #202020;
    line-height: 50px;
}
#content .schedule .info ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px;
}
#content .schedule .info ul li .sub-title {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#content .side-panel {
    overflow: hidden;
}
#content .side-panel h2 {
    font-family: HelveticaNeue-light;
    font-size: 22px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
}
#content .side-panel p {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    margin-top: -13px;
    margin-bottom: 5px !important;
}
#content .side-panel .date {
    text-align: center;
    padding-bottom: 10px;
}
#content .side-panel .date span.left {
    display: inline;
    float: left;
}
#content .side-panel .date span.left a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#content .side-panel .date .show-time {
    display: inline;
}
#content .side-panel .date .show-time a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#content .side-panel .date span.right {
    display: inline;
    float: right;
}
#content .side-panel .date span.right a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#content .side-panel .info-catch-up {
    padding-bottom: 10px;
    height: 310px;
    overflow-y: scroll;
    margin-right: -35px;
}
#content .side-panel .info-catch-up ul li {
    border-bottom: solid 1px #202020;
    line-height: 20px;
    padding: 6px 0;
}
#content .side-panel .info-catch-up ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px 0 15px;
}
#content .side-panel .info-catch-up ul li .sub-title {
    padding-top: 0;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding-left: 15px;
}
#content .side-panel .info-catch-up ul li .icon-play {
    display: inline;
    float: right;
    margin: -10px 15px 0 0;
}
#content .side-panel .info-catch-up ul li .icon-play img {
    color: #4a90e2;
    display: none;
}
#content .side-panel .info-catch-up ul li:hover {
    background-color: #2f2f2f;
}
#content .side-panel .info-catch-up ul li:hover .icon-play img {
    display: block;
    margin-right: 25px;
}
#content .side-panel .info-catch-up::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}
#content .side-panel .info-catch-up {
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
}

#live-non-fta-list {
    display: block;
    width: 100%;
    background-color: #282828;
    overflow: hidden;
}
#live-non-fta-list .live-premier {
    height: 325px;
    padding: 0 20px;
}
#live-non-fta-list .live-premier .swiper-container {
    width: 100%;
    height: auto;
    overflow: visible;
    scrollbar-width: none;
}
#live-non-fta-list .live-premier .swiper-container::-webkit-scrollbar {
    display: none;
}
#live-non-fta-list .live-premier .swiper-slide::-webkit-scrollbar {
    display: none;
}
#live-non-fta-list .live-premier .swiper-slide {
    text-align: center;
    font-size: 18px;
    width: 297px !important;
    /* Update: Removed the Flex property - IE FIX */
}
#live-non-fta-list .live-premier .swiper-wrapper {
    width: 100%;
    opacity: 1;
    transform: translate3d(-2391px, 0px, 0px);
}
#live-non-fta-list .live-premier .swiper-wrapper.disabled {
    transform: translate3d(0px, 0, 0) !important;
}
#live-non-fta-list .live-premier .swiper-pagination.disabled {
    display: none;
}
#live-non-fta-list .live-premier .swiper-button-prev,
#live-non-fta-list .live-premier .swiper-container-rtl .swiper-button-next {
    left: -40px;
    right: auto;
}
#live-non-fta-list .live-premier .swiper-button-prev {
    right: -50px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 20);
    cursor: pointer;
    opacity: 0;
    outline: none;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(transparent),
        color-stop(rgba(12, 17, 27, 0.7)),
        to(rgba(12, 17, 27, 0.9))
    );
    background: -webkit-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: -o-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: linear-gradient(
        to right,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    -webkit-transition: opacity 0.6s ease-out;
    -o-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;
}
#live-non-fta-list .live-premier .swiper-button-prev:hover {
    opacity: 1;
}
#live-non-fta-list .live-premier .swiper-button-next {
    right: -50px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 20);
    cursor: pointer;
    opacity: 0;
    outline:none;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(transparent),
        color-stop(rgba(12, 17, 27, 0.7)),
        to(rgba(12, 17, 27, 0.9))
    );
    background: -webkit-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: -o-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: linear-gradient(
        to right,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    -webkit-transition: opacity 0.6s ease-out;
    -o-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;
}
#live-non-fta-list .live-premier .swiper-button-next:hover {
    opacity: 1;
}
#live-non-fta-list .live-premier .swiper-button-next:after,
#live-non-fta-list
    .live-premier
    .swiper-container-rtl
    .swiper-button-prev:after {
    content: "next";
    color: white;
}
#live-non-fta-list .live-premier .swiper-button-prev:after,
#live-non-fta-list
    .live-premier
    .swiper-container-rtl
    .swiper-button-prev:after {
    content: "prev";
    color: white;
}
#live-non-fta-list .live-premier .title {
    padding: 20px 0;
}
#live-non-fta-list .live-premier .title h4 {
    color: white;
    font-family: "Open Sans Bold";
    font-size: 21px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.84px;
    color: #ffffff;
}
#live-non-fta-list .live-premier img {
    width: 200px;
}
#live-non-fta-list .live-premier ul {
    list-style: none;
    padding: 0;
}
#live-non-fta-list .live-premier li {
    display: inline-block;
}
#live-non-fta-list .live-premier .item {
    display: inline-block;
}
#live-non-fta-list .live-premier .item .title-event {
    margin-bottom: 10px;
}
#live-non-fta-list .live-premier .item .title-event h2 {
    object-fit: contain;
    font-family: "Open Sans Light";
    font-size: 18px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#live-non-fta-list .live-premier .item .countdown {
    position: absolute;
    left: 0px;
    color: #ffffff;
    background-color: white;
    z-index: 1;
    padding: 5px 7px;
    border-radius: 5px;
    /* width: 36px; */
}
#live-non-fta-list .live-premier .item .countdown h7 {
    font-size: 12.8px;
    color: black;
    font-family: "Open Sans SemiBold";
}
#live-non-fta-list .live-premier .item .countdown #time {
    font-size: 12.8px;
    color: red;
    padding: 0;
    margin: 0;
    font-family: "Open Sans Bold";
    display: inline;
}
#live-non-fta-list .live-premier .item video {
    width: 100%;
    height: 100%;
}
#live-non-fta-list .live-premier .item .error-message {
    position: absolute;
    top: 30%;
    left: 46%;
    display: none;
    z-index: 9;
}
#live-non-fta-list .live-premier .item .error-message img {
    width: 60px;
}
#live-non-fta-list .live-premier .item .error-message h4 {
    font-family: "Open Sans SemiBold";
    position: relative;
    left: -33%;
    color: white;
    line-height: 1.7 !important;
    font-size: 20px;
}
#live-non-fta-list .live-premier .item .error-message p {
    text-align: center;
    position: relative;
    left: -34%;
    font-family: "Open Sans Light";
    font-size: 15px;
}
#live-non-fta-list .live-premier .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#live-non-fta-list .live-premier .all a {
    color: #ffffff;
    text-decoration: none;
}
#live-non-fta-list .live-premier .box19 {
    text-align: center;
    position: relative;
}
#live-non-fta-list .live-premier .box19 img {
    width: 100%;
    height: auto;
    border-radius: 7px;
    background-color: #282828;
}
#live-non-fta-list .live-premier .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#live-non-fta-list .live-premier .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#live-non-fta-list .live-premier .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 40%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#live-non-fta-list .live-premier .box19 .icon,
#live-non-fta-list .live-premier .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#live-non-fta-list .live-premier .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
#live-non-fta-list .live-premier .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#live-non-fta-list .live-premier .box19:hover .title {
    transform: scale(1);
}
#live-non-fta-list .live-premier .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#live-non-fta-list .live-premier .box19:hover .icon {
    opacity: 1;
}
#live-non-fta-list .live-premier .box19 .icon li {
    display: inline-block;
}
#live-non-fta-list .live-premier .box19 .icon li:first-child a,
#live-non-fta-list .live-premier .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#live-non-fta-list .live-premier .box19 .icon li a {
    top: -80px;
}
#live-non-fta-list .live-premier .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#live-non-fta-list .live-premier .box19:hover .icon li a {
    top: -20px;
}
#live-non-fta-list .live-premier .box19:hover .icon li a:hover {
    background: transparent;
}
#live-non-fta-list .live-premier .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#live-non-fta-list .live-premier .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#live-non-fta-list .live-premier .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
}
#live-non-fta-list .live-premier .box19:hover .subtitle {
    opacity: 1;
}
#live-non-fta-list .live-premier .box19 .subtitle li {
    display: inline-block;
}
#live-non-fta-list .live-premier .box19 .subtitle li a h5 {
    display: inline;
    line-height: 50px;
    font-size: 14px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#live-non-fta-list .live-premier .box19 .subtitle li a {
    top: -80px;
    display: inline;
}
#live-non-fta-list .live-premier .box19 .subtitle li a img {
    padding-left: 10px;
    position: absolute;
    right: 15px;
    bottom: 32px;
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#live-non-fta-list .live-premier .box19:hover .subtitle li a {
    top: -20px;
}
#live-non-fta-list .live-premier .box19:hover .subtitle li a:hover {
    background: transparent;
}
#live-non-fta-list .live-premier .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#live-non-fta-list .live-premier .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    #live-non-fta-list .live-premier .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #live-non-fta-list .live-premier .box19 .box-content {
        padding-top: 20%;
    }
}

#missed-event-list {
    background-color: #282828;
    width: 100%;
    height: auto;
}
#missed-event-list .live-premier {
    padding: 0 20px;
}
#missed-event-list .live-premier .swiper-container {
    width: 100%;
    overflow: visible;
    scrollbar-width: none;
}
#missed-event-list .live-premier .swiper-container::-webkit-scrollbar {
    display: none;
}
#missed-event-list .live-premier .swiper-slide::-webkit-scrollbar {
    display: none;
}
#missed-event-list .live-premier .swiper-slide {
    text-align: center;
    font-size: 18px;
    /* Update: Removed the Flex property - IE FIX */
}
#missed-event-list .live-premier .swiper-wrapper {
    width: 100%;
    opacity: 1;
    transform: translate3d(-2391px, 0px, 0px);
    height: auto !important;
}
#missed-event-list .live-premier .swiper-slide {
    transition: 250ms all;
    width: 297px !important;
    height: auto !important;
}
#missed-event-list .live-premier .swiper-slide .img-fluid {
    transition: 0.2s linear;
}
#missed-event-list .live-premier .swiper-slide:hover {
    transform: scale(1.2);
    z-index: 999;
    border-radius: 5px;
}
#missed-event-list .live-premier .swiper-slide:first-child:hover {
    margin: 0 40px;
}
#missed-event-list .live-premier .swiper-slide:last-child:hover {
    margin: 0 -40px;
}
#missed-event-list .live-premier .swiper-wrapper.disabled {
    transform: translate3d(0px, 0, 0) !important;
}
#missed-event-list .live-premier .swiper-pagination.disabled {
    display: none;
}
#missed-event-list .live-premier .swiper-button-prev,
#missed-event-list .live-premier .swiper-container-rtl .swiper-button-next {
    left: -40px;
    right: auto;
}
#missed-event-list .live-premier .swiper-button-prev {
    right: -50px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 20);
    cursor: pointer;
    opacity: 0;
    outline: none;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(transparent),
        color-stop(rgba(12, 17, 27, 0.7)),
        to(rgba(12, 17, 27, 0.9))
    );
    background: -webkit-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: -o-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: linear-gradient(
        to right,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    -webkit-transition: opacity 0.6s ease-out;
    -o-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;
}
#missed-event-list .live-premier .swiper-button-prev:hover {
    opacity: 1;
}
#missed-event-list .live-premier .swiper-button-next {
    right: -50px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 20);
    cursor: pointer;
    opacity: 0;
    outline: none;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(transparent),
        color-stop(rgba(12, 17, 27, 0.7)),
        to(rgba(12, 17, 27, 0.9))
    );
    background: -webkit-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: -o-linear-gradient(
        left,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    background: linear-gradient(
        to right,
        transparent,
        rgba(12, 17, 27, 0.7),
        rgba(12, 17, 27, 0.9)
    );
    -webkit-transition: opacity 0.6s ease-out;
    -o-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;
}
#missed-event-list .live-premier .swiper-button-next:hover {
    opacity: 1;
}
#missed-event-list .live-premier .swiper-button-next:after,
#missed-event-list
    .live-premier
    .swiper-container-rtl
    .swiper-button-prev:after {
    content: "next";
    color: white;
}
#missed-event-list .live-premier .swiper-button-prev:after,
#missed-event-list
    .live-premier
    .swiper-container-rtl
    .swiper-button-prev:after {
    content: "prev";
    color: white;
}
#missed-event-list .live-premier .title {
    padding-bottom: 30px;
}
#missed-event-list .live-premier .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#missed-event-list .live-premier .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#missed-event-list .live-premier img {
    width: 200px;
}
#missed-event-list .live-premier ul {
    list-style: none;
    padding: 0;
}
#missed-event-list .live-premier li {
    display: inline-block;
}
#missed-event-list .live-premier .item {
    display: inline-block;
    display: inline-block;
}
#missed-event-list .live-premier .item .title-event {
    margin-bottom: 10px;
}
#missed-event-list .live-premier .item .title-event h2 {
    object-fit: contain;
    font-family: "Open Sans Light";
    font-size: 18px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 1px;
    color: #ffffff;
}
#missed-event-list .live-premier .item .countdown {
    position: absolute;
    left: 0px;
    color: #ffffff;
    background-color: white;
    z-index: 1;
    padding: 5px 7px;
    border-radius: 5px;
    /* width: 36px; */
}
#missed-event-list .live-premier .item .countdown h7 {
    font-size: 12.8px;
    color: black;
    font-family: "Open Sans SemiBold";
}
#missed-event-list .live-premier .item .countdown #time {
    font-size: 12.8px;
    color: red;
    padding: 0;
    margin: 0;
    font-family: "Open Sans Bold";
    display: inline;
}
#missed-event-list .live-premier .item video {
    width: 100%;
    height: 100%;
}
#missed-event-list .live-premier .item .error-message {
    position: absolute;
    top: 30%;
    left: 46%;
    display: none;
    z-index: 9;
}
#missed-event-list .live-premier .item .error-message img {
    width: 60px;
}
#missed-event-list .live-premier .item .error-message h4 {
    font-family: "Open Sans SemiBold";
    position: relative;
    left: -33%;
    color: white;
    line-height: 1.7 !important;
    font-size: 20px;
}
#missed-event-list .live-premier .item .error-message p {
    text-align: center;
    position: relative;
    left: -34%;
    font-family: "Open Sans Light";
    font-size: 15px;
}
#missed-event-list .live-premier .btn-load-more {
    padding-bottom: 30px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#missed-event-list .live-premier .btn-load-more:hover {
    background-color: transparent;
}
#missed-event-list .live-premier .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#missed-event-list .live-premier .all a {
    color: #ffffff;
    text-decoration: none;
}
#missed-event-list .live-premier .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
#missed-event-list .live-premier .box19 img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    background-color: #282828;
}
#missed-event-list .live-premier .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#missed-event-list .live-premier .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#missed-event-list .live-premier .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 40%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#missed-event-list .live-premier .box19 .icon,
#missed-event-list .live-premier .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#missed-event-list .live-premier .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
#missed-event-list .live-premier .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#missed-event-list .live-premier .box19:hover .title {
    transform: scale(1);
}
#missed-event-list .live-premier .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#missed-event-list .live-premier .box19:hover .icon {
    opacity: 1;
}
#missed-event-list .live-premier .box19 .icon li {
    display: inline-block;
}
#missed-event-list .live-premier .box19 .icon li:first-child a,
#missed-event-list .live-premier .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#missed-event-list .live-premier .box19 .icon li a {
    top: -80px;
}
#missed-event-list .live-premier .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#missed-event-list .live-premier .box19:hover .icon li a {
    top: -20px;
}
#missed-event-list .live-premier .box19:hover .icon li a:hover {
    background: transparent;
}
#missed-event-list .live-premier .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#missed-event-list .live-premier .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#missed-event-list .live-premier .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
}
#missed-event-list .live-premier .box19:hover .subtitle {
    opacity: 1;
}
#missed-event-list .live-premier .box19 .subtitle li {
    display: inline-block;
}
#missed-event-list .live-premier .box19 .subtitle li a h5 {
    display: inline;
    line-height: 50px;
    font-size: 14px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#missed-event-list .live-premier .box19 .subtitle li a {
    top: -80px;
    display: inline;
}
#missed-event-list .live-premier .box19 .subtitle li a img {
    padding-left: 10px;
    position: absolute;
    right: 15px;
    bottom: 32px;
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#missed-event-list .live-premier .box19:hover .subtitle li a {
    top: -20px;
}
#missed-event-list .live-premier .box19:hover .subtitle li a:hover {
    background: transparent;
}
#missed-event-list .live-premier .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#missed-event-list .live-premier .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    #missed-event-list .live-premier .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #missed-event-list .live-premier .box19 .box-content {
        padding-top: 20%;
    }
}

#title-page {
    padding-top: 100px;
    background-color: #282828;
}
#title-page ul.live-event {
    display: flex;
}
#title-page ul.live-event li {
    text-align: center;
    width: 50%;
}
#title-page ul.live-event li h2 {
    color: #ffffff;
    font-family: "Open Sans SemiBold";
    font-size: 21px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#title-page ul.live-event li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#title-page ul.live-event li.active h2 {
    color: #ffffff;
    font-family: "Open Sans SemiBold";
    font-size: 21px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}

#catch-up {
    margin-top: 61px;
    width: 100%;
    background-color: #282828;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overflow: hidden;
    position: relative;
}
#catch-up #bgforcontent {
    position: absolute;
    width: 100%;
    height: 580px;
    background-color: #282828;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    top: 408px;
    right: 0;
    z-index: 1;
}
#catch-up ul.live-event {
    padding: 20px 0px 0px 0px;
    display: flex;
}
#catch-up ul.live-event li {
    text-align: center;
    width: 50%;
}
#catch-up ul.live-event li h2 {
    color: #ffffff;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#catch-up ul.live-event li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#catch-up ul.live-event li.active h2 {
    color: #ffffff;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#catch-up ul.live-event:before {
    content: "";
    position: absolute;
    left: 30px;
    top: 0;
    height: 1px;
    width: 94%;
    /* or 100px */
    border-top: 1px solid #000000;
}
#catch-up .live-video .item {
    position: relative;
}
#catch-up .live-video .item video {
    width: 100%;
    height: auto;
}
#catch-up .live-video .item .ico-play-live-video {
    position: absolute;
    top: 45%;
    left: 45%;
}
#catch-up .live-video .item .ico-play-live-video img {
    width: 40px;
}
#catch-up .live-video .item .error-message {
    position: absolute;
    top: 30%;
    left: 46%;
    display: none;
    z-index: 9;
}
#catch-up .live-video .item .error-message img {
    width: 60px;
}
#catch-up .live-video .item .error-message h4 {
    font-family: "Open Sans SemiBold";
    position: relative;
    left: -33%;
    color: white;
    line-height: 1.7 !important;
    font-size: 20px;
}
#catch-up .live-video .item .error-message p {
    text-align: center;
    position: relative;
    left: -34%;
    font-family: "Open Sans Light";
    font-size: 15px;
}
#catch-up .live-video .title-scene {
    padding: 15px 0;
}
#catch-up .live-video .title-scene h4 {
    display: inline;
}
#catch-up .live-video .title-scene h4 a {
    text-decoration: none;
    font-family: HelveticaNeue-light;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .live-video .title-scene .icon-share {
    display: inline;
    float: right;
    margin-top: -17px;
}
#catch-up .live-video .title-scene .icon-share a img {
    margin-right: 10px;
}
#catch-up .live-video .title-scene .icon-share .btn-share {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 15px;
    margin: 10px;
    cursor: pointer;
}
#catch-up .scheduler {
    position: inherit;
    width:100%;
}
#catch-up .scheduler .tabs-style-underline {
    padding-top: 15px;
}
#catch-up .scheduler .tabs-style-underline nav {
    background: #171717;
}
#catch-up .scheduler .tabs-style-underline nav a {
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}
#catch-up .scheduler .tabs-style-underline nav a span {
    font-weight: 700;
}
#catch-up .scheduler .tabs-style-underline nav li a::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: red;
    content: "";
    -webkit-transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    -webkit-transform: translate3d(0, 150%, 0);
    transform: translate3d(0, 150%, 0);
}
#catch-up .scheduler .tabs-style-underline nav li.tab-current a::after {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
#catch-up .scheduler .menu-tv ul.menu-tv-list {
    padding: 20px 20px 20px 10px;
}
#catch-up .scheduler .menu-tv ul.menu-tv-list li {
    padding: 0 10px;
    margin: 0 15px 0 0;
}
#catch-up .scheduler .menu-tv ul.menu-tv-list li a img {
    width: auto;
    height: 20px;
}
#catch-up .scheduler .menu-tv ul.menu-tv-list li {
    background-color: rgba(255, 255, 255, 0.02);
    border: 0;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#catch-up .scheduler .menu-tv ul.menu-tv-list li.active {
    border: 1px solid #265bab;
    background-color: transparent;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#catch-up .scheduler .title {
    background: #212121;
    height: 80px;
    padding: 15px;
    margin-top: 30px;
    border-left: 1px solid red;
}
#catch-up .scheduler .title .tv-line {
    fill: #c41f26 !important;
}
#catch-up .scheduler .title img {
    display: inline;
    margin-right: 10px;
    margin-top: -17px;
    fill: green;
    height: 31px;
}
#catch-up .scheduler .title h2 {
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .scheduler .title h4 {
    display: inline;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0.54px;
    color: #ffffff;
}
#catch-up .scheduler .title .icon-play {
    display: inline;
    float: right;
    margin: 0;
}
#catch-up .scheduler span a {
    text-decoration: none;
    font-family: HelveticaNeue-light;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px;
}
#catch-up .scheduler .jadwal {
    margin: 25px;
    cursor: pointer;
}
#catch-up .scheduler .jadwal .slick-slide .slick-cloned {
    width: 180px !important;
}
#catch-up .scheduler .jadwal .active {
    border: red 1px solid;
}
#catch-up .scheduler .jadwal .slide {
    width: auto;
    height: 60px;
    object-fit: contain;
    border-radius: 30px;
    background-color: #212121;
    padding: 20px 44px;
    text-align: center;
}
#catch-up .scheduler .jadwal .slide .text-active {
    color: red;
}
#catch-up .scheduler .jadwal .slide .tanggal {
    width: 142px;
    height: 22px;
    font-family: "Open Sans Regular";
    font-size: 12px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.54px;
    color: #ffffff;
}
#catch-up .scheduler .title-catchup-now {
    background: #212121;
    height: 80px;
    padding: 15px;
    margin-top: 30px;
    border-left: 1px solid red;
}
#catch-up .scheduler .title-catchup-now .tv-line {
    fill: #c41f26 !important;
}
#catch-up .scheduler .title-catchup-now img {
    display: inline;
    margin-right: 10px;
    margin-top: -17px;
    fill: green;
    height: 31px;
}
#catch-up .scheduler .title-catchup-now h2 {
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .scheduler .title-catchup-now h4 {
    display: inline;
    font-family: "Open Sans Light";
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0.54px;
    color: #ffffff;
}
#catch-up .scheduler .title-catchup-now .icon-play {
    display: inline;
    float: right;
    margin: 0;
}
#catch-up .scheduler .now-playing {
    padding: 15px;
    display: flow-root;
}
#catch-up .scheduler .current-play {
    background: #212121;
}
#catch-up .scheduler .now-playing .tv-line {
    fill: #c41f26 !important;
}
#catch-up .scheduler .now-playing img {
    display: inline;
    margin-right: 10px;
    margin-top: -17px;
    fill: green;
    height: 27px;
}
#catch-up .scheduler .now-playing h2 {
    display: inline;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .scheduler .now-playing h4 {
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0.54px;
    color: #ffffff;
}
#catch-up .scheduler .now-playing .icon-share {
    display: inline;
    float: right;
    margin: 0;
}
#catch-up .scheduler .icon-schedule {
    display: inline-block;
    float: left;
    padding-top: 15px;
    padding-right: 10px;
}
#catch-up .scheduler .icon-schedule img {
    width: 40px;
    height: 40px;
}
#catch-up .scheduler .current-play h2 {
    color: #333333 !important;
}
#catch-up .scheduler .current-play h4 {
    color: #333333 !important;
}
#catch-up .scheduler .schedule-list {
    overflow-y: scroll;
    height: 325px;
}
#catch-up .scheduler .btn-date {
    color: #fff;
    background-color: #3A3A3A;
    border-top: 2px solid #3a3a3a;
    border-bottom: 2px solid #3a3a3a;
    border-right: unset !important;
    border-left: unset !important;
    border-radius: unset !important;
}
#catch-up .scheduler .btn-date:not(:disabled):not(.disabled):active,
#catch-up .scheduler .btn-date:not(:disabled):not(.disabled):active:focus,
#catch-up .scheduler .btn-date:focus,
#catch-up .scheduler .btn-date:hover {
    border-bottom: 2px solid #0062cc;
    box-shadow: none !important;
}
#catch-up .scheduler .btn-date h4 {
    color: #fff;
    line-height: 1.8em !important;
}
#catch-up .scheduler .btn-date h5 {
    color: #fff;
    font-size: 14px !important;
    line-height: 1.8em !important;
}
#catch-up .scheduler .btn-date-active {
    border-bottom: 2px solid #0062cc;
}
#catch-up .scheduler .label-today {
    background-color: #3a3a3a;
    color: #000;
    font-size: 10px !important;
    font-weight: bold;
    padding: 3px 5px 3px 5px;
    border-radius: 30px;
}
#catch-up .scheduler .tv-overlay {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2;
}
#catch-up .scheduler .btn-tab-channel {
    color: #fff;
    background-color: #1a1a1a;
    border-radius: 8px;
    width: 60%;
    padding: 10px 0 5px 0;
    font-size: 1.5rem;
}
#catch-up .scheduler .btn-tab-channel:not(:disabled):not(.disabled):active,
#catch-up
    .scheduler
    .btn-tab-channel:not(:disabled):not(.disabled):active:focus,
#catch-up .scheduler .btn-tab-channel:focus,
#catch-up .scheduler .btn-tab-channel:hover {
    border: 2px solid #9dddf3;
}
#catch-up .scheduler .btn-tab-channel-active {
    border: 2px solid #9dddf3;
    background: linear-gradient(
        0deg,
        rgba(157, 221, 243, 0.2) 0%,
        rgba(41, 186, 236, 0.2) 104.73%
    );
}
#catch-up .scheduler .spinner {
    height: 100px;
    width: 100px;
    margin: auto;
    display: flex;
    position: absolute;
    -webkit-animation: rotation 0.6s infinite linear;
    -moz-animation: rotation 0.6s infinite linear;
    -o-animation: rotation 0.6s infinite linear;
    animation: rotation 0.6s infinite linear;
    border-left: 6px solid rgba(0, 174, 239, 0.15);
    border-right: 6px solid rgba(0, 174, 239, 0.15);
    border-bottom: 6px solid rgba(0, 174, 239, 0.15);
    border-top: 6px solid rgba(0, 174, 239, 0.8);
    border-radius: 100%;
}
#catch-up .scheduler .cursor-pointer {
    cursor: pointer;
}
#catch-up .scheduler .info {
    padding-bottom: 50px;
}
#catch-up .scheduler .info ul li {
    height: 60px;
    padding: 20px 15px;
}
#catch-up .scheduler .info ul li .time {
    display: inline;
    font-family: "Open Sans Light";
    font-size: 20px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.68px;
    color: #808080;
}
#catch-up .scheduler .info ul li .sub-title {
    margin-left: 25px;
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 20px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.68px;
    color: #808080;
}
#catch-up .scheduler .info ul li .icon-play {
    display: inline;
    float: right;
    margin: 0;
    margin-top: -5px;
}
#catch-up .scheduler .info-catchup {
    padding-bottom: 50px;
}
#catch-up .scheduler .info-catchup ul li {
    height: 60px;
    padding: 20px 15px;
}
#catch-up .scheduler .info-catchup ul li .time {
    display: inline;
    font-family: "Open Sans Light";
    font-size: 20px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.68px;
    color: #808080;
}
#catch-up .scheduler .info-catchup ul li .sub-title {
    margin-left: 25px;
    display: inline;
    font-family: "Open Sans Regular";
    font-size: 20px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.68px;
    color: #808080;
}
#catch-up .scheduler .info-catchup ul li .icon-play {
    display: inline;
    float: right;
    margin: 0;
    margin-top: -5px;
}
#catch-up .live-chat-on {
    background-color: #3A3A3A;
    border-radius: 8px;
}
#catch-up .live-chat-on .item .live-header {
    background-color: #171717;
    height: 50px;
    margin: 0px;
    border-radius: 8px;
}
#catch-up .live-chat-on .item .live-header .warning {
    text-align: center;
    position: absolute;
    width: 100%;
    /* top: 20%; */
    left: 50%;
    margin-top: 60px;
    /* bring your own prefixes */
    transform: translate(-50%, -50%);
}
#catch-up .live-chat-on .item .live-header .warning h5 {
    margin: 0;
    font-family: "Open Sans SemiBold";
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#catch-up .live-chat-on .item .live-header .warning p {
    width: 240px;
    margin: 0 auto;
    font-family: "Open Sans Light";
    font-size: 12px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#catch-up .live-chat-on .item .live-header .warning .btn-red {
    height: 35px;
    padding: 10px 100px;
    background-color: red;
    border-radius: 7px;
    color: white;
}
#catch-up .live-chat-on .item .live-header .title-messages h5 {
    font-family: "Open Sans Regular";
    font-size: 21px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    margin-top: 12px;
}
#catch-up .live-chat-on .item .live-header .live-chat-icon-on h5 {
    font-family: "Open Sans Regular";
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#catch-up .live-chat-on .item .live-header .live-chat-icon-on h5 .fa-circle {
    color: #7ed321 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#catch-up .live-chat-on .item .live-header .live-chat-icon-off h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#catch-up .live-chat-on .item .live-header .live-chat-icon-off h5 .fa-circle {
    color: #c41f26 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#catch-up .live-chat-on .item .messages {
    margin: 10px 0 0 0;
    overflow-y: scroll;
}
#catch-up .live-chat-on .item .messages .chat-box {
    height: 500px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 15px;
}
@media (max-width: 1440px) {
    #catch-up .live-chat-on .item .messages .chat-box {
        height: 500px !important;
        overflow-y: scroll;
        overflow-x: hidden;
    }
}
@media screen and (max-width: 1920px) {
    #catch-up .live-chat-on .item .messages .chat-box {
        height: 600px;
        overflow-y: scroll;
        overflow-x: hidden;
    }
}
#catch-up .live-chat-on .item .messages .message {
    float: left;
    width: 100%;
    margin: 10px 0;
    border-bottom: 1px solid #ccc;
}
#catch-up .live-chat-on .item .messages .message p {
    font-size: 0.8em;
    width: 90%;
    margin: 5px 0;
}
#catch-up .live-chat-on .item .messages img {
    border-radius: 100%;
    float: left;
    margin: 0 10px 15px 0;
}
#catch-up .live-chat-on .item .messages .fill {
    width: 271px;
}
#catch-up .live-chat-on .item .messages p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: normal;
    color: #ffffff;
    margin-bottom: 5px !important;
}
#catch-up .live-chat-on .item .messages h6 {
    display: inline;
    font-family: HelveticaNeue-Light;
    font-size: 9px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #909090;
}
#catch-up .live-chat-on .item .messages h4 {
    display: inline;
    font-family: HelveticaNeue-Medium;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #909090;
}
#catch-up .live-chat-on .item .messages ul li {
    display: inline-block;
    color: white;
    margin-right: 10px;
    height: 40px;
}
#catch-up .live-chat-on .item .messages ul li h5 {
    display: inline;
    color: #81bbff;
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.56px;
    color: #ffffff;
}
#catch-up .live-chat-on .item .messages ul li p {
    display: inline;
    color: #ffffff;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.56px;
    color: #ffffff;
    margin-bottom: 0 !important;
}
#catch-up .live-chat-on .item .messages ul li:nth-last-child(1) {
    margin-bottom: 20px;
}
#catch-up .live-chat-on .item .messages::-webkit-scrollbar {
    display: none;
}
#catch-up .live-chat-on .item .bottom .chat-input {
    padding: 5px;
    flex: 0 0 auto;
    height: 46px;
    background: #303030;
}
#catch-up .live-chat-on .item .bottom .chat-input .far {
    padding: 10px 0 10px 10px;
    color: #909090;
    text-decoration: none;
    font-size: 20px;
}
#catch-up .live-chat-on .item .bottom .chat-input input {
    height: 45px;
    line-height: 60px;
    outline: 0 none;
    border: none;
    width: calc(100% - 60px);
    color: white;
    text-indent: 10px;
    font-family: "Open Sans Light";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    padding: 0;
    background: #303030;
}
#catch-up .live-chat-on .item .bottom ::placeholder {
    font-family: "Open Sans Italic";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#catch-up .live-chat-on .item .bottom .btn-chat {
    background: none;
    border: none;
    float: right;
    margin-top: -28px;
}
#catch-up .live-chat-on .item .bottom .btn-chat img {
    height: 17px;
}
#catch-up .live-chat-on .side-panel {
    width: 335px;
    position: absolute;
    z-index: 2;
    padding-top: 60px;
    overflow: hidden;
}
#catch-up .live-chat-on .side-panel h2 {
    font-family: HelveticaNeue-light;
    font-size: 22px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .live-chat-on .side-panel p {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    margin-top: -13px;
    margin-bottom: 5px !important;
}
#catch-up .live-chat-on .side-panel .date {
    text-align: center;
    background-color: rgba(255, 255, 255, 0.02);
    border: 0;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#catch-up .live-chat-on .side-panel .date span.left {
    display: inline;
    float: left;
}
#catch-up .live-chat-on .side-panel .date span.left a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .live-chat-on .side-panel .date .show-time {
    display: inline;
}
#catch-up .live-chat-on .side-panel .date .show-time a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .live-chat-on .side-panel .date span.right {
    display: inline;
    float: right;
}
#catch-up .live-chat-on .side-panel .date span.right a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .live-chat-on .side-panel .info-catch-up {
    padding-bottom: 10px;
    height: 310px;
    overflow-y: scroll;
    margin-right: -35px;
}
#catch-up .live-chat-on .side-panel .info-catch-up ul li {
    border-bottom: solid 1px #202020;
    line-height: 20px;
    padding: 6px 0;
}
#catch-up .live-chat-on .side-panel .info-catch-up ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px 0 15px;
}
#catch-up .live-chat-on .side-panel .info-catch-up ul li .sub-title {
    padding-top: 0;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding-left: 15px;
}
#catch-up .live-chat-on .side-panel .info-catch-up ul li .icon-play {
    display: inline;
    float: right;
    margin: -10px 15px 0 0;
}
#catch-up .live-chat-on .side-panel .info-catch-up ul li .icon-play img {
    color: #4a90e2;
    display: none;
}
#catch-up .live-chat-on .side-panel .info-catch-up ul li:hover {
    background-color: #2f2f2f;
}
#catch-up .live-chat-on .side-panel .info-catch-up ul li:hover .icon-play img {
    display: block;
    margin-right: 35px;
    margin-top: 5px;
}
#catch-up .live-chat-on .side-panel .info-catch-up::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}
#catch-up .live-chat-on .side-panel .info-catch-up {
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
}
#catch-up .live-chat-off {
    padding-top: 50px;
    background-color: none;
    height: 0;
    margin: 0 15px;
}
#catch-up .live-chat-off .item .live-header {
    background-color: rgba(255, 255, 255, 0.02);
    height: 40px;
}
#catch-up .live-chat-off .item .live-header .title-messages h5 {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    margin-top: 12px;
}
#catch-up .live-chat-off .item .live-header .live-chat-icon-on h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#catch-up .live-chat-off .item .live-header .live-chat-icon-on h5 .fa-circle {
    color: #7ed321 !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#catch-up .live-chat-off .item .live-header .live-chat-icon-off h5 {
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    color: #ffffff;
    text-align: right;
    margin-top: 12px;
}
#catch-up .live-chat-off .item .live-header .live-chat-icon-off h5 .fa-circle {
    color: grey !important;
    margin-left: 10px;
    font-size: 7px !important;
    vertical-align: 2px;
}
#catch-up .live-chat-off .item .messages {
    display: none;
    margin: 10px 0 0 0;
    height: 243px;
}
#catch-up .live-chat-off .item .messages ul li {
    display: inline-block;
    color: white;
    margin-right: 10px;
}
#catch-up .live-chat-off .item .messages ul li h5 {
    display: inline;
    color: #81bbff;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
}
#catch-up .live-chat-off .item .messages ul li p {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    margin-bottom: 0 !important;
}
#catch-up .live-chat-off .item .messages ul li:nth-last-child(1) {
    margin-bottom: 20px;
}
#catch-up .live-chat-off .item .bottom {
    margin: 0 -15px 0 -15px;
}
#catch-up .live-chat-off .item .bottom .chat-input {
    flex: 0 0 auto;
    height: 46px;
    background: #303030;
}
#catch-up .live-chat-off .item .bottom .chat-input input {
    height: 45px;
    line-height: 60px;
    outline: 0 none;
    border: none;
    width: calc(100% - 60px);
    color: white;
    text-indent: 10px;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    letter-spacing: 0.5px;
    padding: 0;
    background: #303030;
}
#catch-up .live-chat-off .item .bottom ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#catch-up .side-panel {
    width: 335px;
    position: absolute;
    z-index: 2;
    overflow: hidden;
    top: 472px;
}
#catch-up .side-panel h2 {
    font-family: HelveticaNeue-light;
    font-size: 22px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .side-panel p {
    font-family: HelveticaNeue-light;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0;
    color: #ffffff;
    margin-top: -13px;
    margin-bottom: 5px !important;
}
#catch-up .side-panel .date {
    text-align: center;
    background-color: rgba(255, 255, 255, 0.02);
    border: 0;
    padding-bottom: 0;
    border-radius: 5px;
    padding: 12px 20px;
}
#catch-up .side-panel .date span.left {
    display: inline;
    float: left;
}
#catch-up .side-panel .date span.left a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .side-panel .date .show-time {
    display: inline;
}
#catch-up .side-panel .date .show-time a {
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .side-panel .date span.right {
    display: inline;
    float: right;
}
#catch-up .side-panel .date span.right a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#catch-up .side-panel .info-catch-up {
    padding-bottom: 10px;
    height: 310px;
    overflow-y: scroll;
    margin-right: -35px;
}
#catch-up .side-panel .info-catch-up ul li {
    border-bottom: solid 1px #202020;
    line-height: 20px;
    padding: 6px 0;
}
#catch-up .side-panel .info-catch-up ul li .time {
    display: inline;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding: 0 20px 0 15px;
}
#catch-up .side-panel .info-catch-up ul li .sub-title {
    padding-top: 0;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
    padding-left: 15px;
}
#catch-up .side-panel .info-catch-up ul li .icon-play {
    display: inline;
    float: right;
    margin: -10px 15px 0 0;
}
#catch-up .side-panel .info-catch-up ul li .icon-play img {
    color: #4a90e2;
    display: none;
}
#catch-up .side-panel .info-catch-up ul li:hover {
    background-color: #2f2f2f;
}
#catch-up .side-panel .info-catch-up ul li:hover .icon-play img {
    display: block;
    margin-right: 35px;
    margin-top: 5px;
}
#catch-up .side-panel .info-catch-up::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}
#catch-up .side-panel .info-catch-up {
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
}

@media only screen and (min-width: 40em) {
    .modal-overlay {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 5;
        background-color: rgba(0, 0, 0, 0.6);
        opacity: 0;
        visibility: hidden;
        backface-visibility: hidden;
        transition: opacity 0.6s cubic-bezier(0.55, 0, 0.1, 1),
            visibility 0.6s cubic-bezier(0.55, 0, 0.1, 1);
    }
    .modal-overlay.active {
        opacity: 1;
        visibility: visible;
    }
    .modal-overlay .modal {
        height: auto !important;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        margin: 0 auto;
        background-color: transparent;
        width: 400px;
        max-width: 75rem;
        min-height: 7rem;
        padding: 0;
        border-radius: 3px;
        opacity: 0;
        overflow-y: auto;
        visibility: hidden;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        backface-visibility: hidden;
        transform: scale(1.2);
        transition: all 0.6s cubic-bezier(0.55, 0, 0.1, 1);
    }
    .modal-overlay .modal .col-md-12 {
        padding-right: 0;
        padding-left: 0;
    }
    .modal-overlay .modal .close-modal {
        position: absolute;
        cursor: pointer;
        top: 0;
        right: 25px;
        opacity: 0;
        backface-visibility: hidden;
        transition: opacity 0.6s cubic-bezier(0.55, 0, 0.1, 1),
            transform 0.6s cubic-bezier(0.55, 0, 0.1, 1);
        transition-delay: 0.3s;
    }
    .modal-overlay .modal .close-modal svg {
        width: 1.75em;
        height: 1.75em;
    }
    .modal-overlay .modal .modal-content {
        opacity: 0;
        backface-visibility: hidden;
        transition: opacity 0.6s cubic-bezier(0.55, 0, 0.1, 1);
        transition-delay: 0.3s;
    }
    .modal-overlay .modal.active {
        visibility: visible;
        opacity: 1;
        transform: scale(1);
    }
    .modal-overlay .modal.active .modal-header {
        opacity: 1;
        background-color: transparent !important;
        border-bottom: 0 !important;
        color: #000;
    }
    .modal-overlay .modal.active .modal-header ul {
        padding: 50px 0;
    }
    .modal-overlay .modal.active .modal-header ul li {
        padding: 0px;
        text-align: center;
    }
    .modal-overlay .modal.active .modal-header ul a {
        color: #fff !important;
        font-size: 26px !important;
    }
    .modal-overlay .modal.active .modal-header ul a:hover {
        color: #fff !important;
        font-size: 26px !important;
    }
    .modal-overlay .modal.active .modal-header .col-md-9,
    .modal-overlay .modal.active .modal-header col-md-3 {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .modal-overlay .modal.active .modal-header .icon-share h6 {
        font-family: HelveticaNeue;
        font-size: 16px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: 0.3px;
        color: #242424;
    }
    .modal-overlay
        .modal.active
        .modal-header
        .icon-share
        .copy-link-all
        input[type="text"] {
        border: 0;
        background-color: transparent;
        padding: 15px;
        font-family: HelveticaNeue;
        font-size: 14px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: 0.3px;
        color: #242424;
        width: 80%;
    }
    .modal-overlay
        .modal.active
        .modal-header
        .icon-share
        .copy-link-all
        input[type="submit"] {
        background-color: transparent;
        border: 0;
        border-radius: 4px;
        color: #0c5194;
        float: right;
        padding: 0.5em;
        text-transform: uppercase;
        width: 4.5em;
        margin-top: 5px;
        font-size: 12px;
    }
    .modal-overlay
        .modal.active
        .modal-header
        .icon-share
        .copy-link-all
        .copy-link-container:not(:first-of-type) {
        margin-top: 1em;
    }
    .modal-overlay
        .modal.active
        .modal-header
        .icon-share
        .copy-link-all
        .copy-link-inner {
        background-color: #f8f8f8;
        border: solid 1px #ececec;
        border-radius: 6px;
        padding: 0;
        float: left;
        width: 100%;
    }
    .modal-overlay .modal.active .close-modal {
        transform: translateY(10px);
        opacity: 1;
    }
}
/**
 * Mobile styling
 */
@media only screen and (max-width: 39.9375em) {
    h1 {
        font-size: 1.5rem;
    }

    .modal {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-overflow-scrolling: touch;
        border-radius: 0;
        transform: scale(1.1);
        padding: 0 !important;
    }

    .close-modal {
        right: 20px !important;
    }
}
#explore .search {
    margin-top: 63px;
    background-color: #1d1d1d;
    width: 100%;
    height: 60px;
    padding: 10px 20px;
}
#explore .search .has-search .form-control {
    padding-left: 2.375rem;
    background-color: transparent !important;
    border: 0;
    color: #ffffff;
}
#explore .search ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#explore .search .has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #ffffff;
}

#explore-content {
    margin-top: 80px;
    padding: 0 55px;
}
#explore-content .explore-content-slider {
    margin: 40px 0;
}
#explore-content .explore-content-slider ul.explore-slide li .genre {
    position: relative;
    width: 100%;
    display: flex;
    border-right: solid 1px #979797;
    justify-content: center;
}
#explore-content .explore-content-slider ul.explore-slide li .genre .title {
    text-align: center;
}
#explore-content .explore-content-slider ul.explore-slide li .genre .title h5 {
    font-family: "Open Sans Regular";
    font-size: 21px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.84px;
    text-align: center;
    color: #ffffff;
}
#explore-content
    .explore-content-slider
    ul.explore-slide
    li
    .genre
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#explore-content
    .explore-content-slider
    ul.explore-slide
    li
    .genre
    .title
    h5.active {
    font-family: "Open Sans Bold";
    font-size: 21px;
    border-bottom: 2px solid #da251c;
}
#explore-content .explore-content-slider ul.explore-slide li.active {
    padding: 20px;
    border-bottom: 3px solid #da251c;
    border-right: solid 1px #979797;
}
#explore-content .explore-content-slider ul.explore-slide li.active .genre {
    position: relative;
}
#explore-content .explore-content-slider ul.explore-slide li.active .genre img {
    position: relative;
    border-radius: 4px;
    width: 150px;
    height: 80px;
}
#explore-content
    .explore-content-slider
    ul.explore-slide
    li.active
    .genre
    .title {
    text-align: center;
}
#explore-content
    .explore-content-slider
    ul.explore-slide
    li.active
    .genre
    .title
    h5 {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    font-family: "Open Sans Bold";
    font-size: 21px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.84px;
    text-align: center;
    color: #ffffff;
}
#explore-content
    .explore-content-slider
    ul.explore-slide
    li.active
    .genre
    .title
    .active {
    font-family: "Open Sans Bold";
}
#explore-content .explore-content-slider ul.explore-slide li.active:after {
    border-bottom: 2px solid #da251c;
}

#explore-search-program ul.search-title {
    padding: 20px 20px 2px 20px;
}
#explore-search-program ul.search-title li {
    padding: 0 15px;
}
#explore-search-program ul.search-title li h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#explore-search-program ul.search-title li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#explore-search-program ul.search-title li.active h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#explore-search-program ul.search-title:before {
    content: "";
    position: absolute;
    left: 35px;
    bottom: 2px;
    height: 1px;
    width: 335px;
    border-bottom: 2px solid #1d1d1d;
    z-index: -1;
}

#explore-sorting {
    margin-top: 61px;
    padding: 0 20px;
    min-height: 80vh;
    padding-top: 0;
    background-color: #282828;
    width: 100%;
    height: auto;
}
#explore-sorting .side-panel {
    background-color: #212121;
    padding: 20px 0;
    min-width: 260px;
    max-width: 100%;
    max-height: 300vw;
    min-height: 768px;
    padding-top: 20px;
}
#explore-sorting .side-panel ul.entry-fta li.item {
    padding: 20px 20px;
    border-bottom: 1px solid #333333;
}
#explore-sorting .side-panel ul.entry-fta li.item a h2 {
    font-family: "Open Sans Regular";
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.72px;
    color: #ffffff;
}
#explore-sorting .side-panel ul.entry-fta li.item .user-profile-list {
    padding: unset;
    margin-top: 10px;
}
#explore-sorting .side-panel ul.entry-fta li.item .user-profile-list a img {
    padding-right: unset;
}
#explore-sorting
    .side-panel
    ul.entry-fta
    li.item
    .user-profile-list
    .user-thumbnail
    img.user-simple-line-icons {
    width: 40px;
    height: 40px;
    margin-left: -7px;
    padding-right: unset;
}
#explore-sorting
    .side-panel
    ul.entry-fta
    li.item
    .user-profile-list
    .title-postprofile {
    margin-top: 0;
    padding-left: 20px;
    padding-right: 0;
}
#explore-sorting
    .side-panel
    ul.entry-fta
    li.item
    .user-profile-list
    .title-postprofile
    ul
    li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#explore-sorting
    .side-panel
    ul.entry-fta
    li.item
    .user-profile-list
    .title-postprofile
    ul
    li.post-email {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#explore-sorting .side-panel ul.entry-fta li.item .user-profile-list .dot {
    margin-top: -3px;
}
#explore-sorting
    .side-panel
    ul.entry-fta
    li.item
    .user-profile-list
    .dot
    .dropdown-toggle::after {
    content: none !important;
}
#explore-sorting
    .side-panel
    ul.entry-fta
    li.item
    .user-profile-list
    .dot
    .dropdown-menu {
    background: #2f2f2f;
}
#explore-sorting
    .side-panel
    ul.entry-fta
    li.item
    .user-profile-list
    .dot
    .dropdown-menu
    .dropdown-item {
    color: #ffffff;
}
#explore-sorting
    .side-panel
    ul.entry-fta
    li.item
    .user-profile-list
    .dot
    .dropdown-menu
    .dropdown-item:hover {
    color: #ffffff;
    background-color: #2f2f2f;
}
#explore-sorting .side-panel ul.entry-fta li.item a {
    font-size: 13px;
    font-family: "Open Sans Regular";
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
}
#explore-sorting .side-panel ul.entry-fta li.item a img {
    padding-right: 20px;
    margin-bottom: 4px;
}
#explore-sorting .side-panel ul.entry-fta li.item a:hover {
    text-decoration: none;
}
#explore-sorting .side-panel ul.entry-fta li.item a .svg-col-white {
    filter: invert(99%) sepia(1%) saturate(2%) hue-rotate(115deg)
        brightness(103%) contrast(100%);
    height: 16px;
}
#explore-sorting .side-panel ul.entry-fta li.active {
    background-color: #282828;
    border-right: 10px solid #d91c55;
}
#explore-sorting .side-panel ul.entry-fta li.active a .svg-col {
    filter: invert(21%) sepia(51%) saturate(6571%) hue-rotate(353deg)
        brightness(89%) contrast(91%);
    height: 16px;
}
#explore-sorting .side-panel ul.entry-fta li.active a .svg-col-etc {
    filter: invert(80%) sepia(51%) saturate(6571%) hue-rotate(353deg)
        brightness(89%) contrast(91%);
    height: 16px;
}
#explore-sorting .side-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #292929;
    margin: 2em 0;
    padding: 0;
}
#explore-sorting .side-panel .guide-static-fta ul.static-fta li.item {
    padding: 10px 20px;
}
#explore-sorting .side-panel .guide-static-fta ul.static-fta li.item a {
    font-size: 13px;
    font-family: HelveticaNeue;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
}
#explore-sorting .side-panel .guide-static-fta ul.static-fta li.item a img {
    padding-right: 20px;
    margin-bottom: 4px;
}
#explore-sorting .side-panel .guide-static-fta ul.static-fta li.item a:hover {
    text-decoration: none;
}
#explore-sorting
    .side-panel
    .guide-static-fta
    ul.static-fta
    li.item
    a
    .svg-col-white {
    filter: invert(99%) sepia(1%) saturate(2%) hue-rotate(115deg)
        brightness(103%) contrast(100%);
    height: 16px;
}
#explore-sorting .side-panel .guide-static-fta ul.static-fta li.active {
    background-color: #343434;
}
#explore-sorting
    .side-panel
    .guide-static-fta
    ul.static-fta
    li.active
    a
    .svg-col {
    filter: invert(21%) sepia(51%) saturate(6571%) hue-rotate(353deg)
        brightness(89%) contrast(91%);
    height: 16px;
}
#explore-sorting
    .side-panel
    .guide-static-fta
    ul.static-fta
    li.active
    a
    .svg-col-etc {
    filter: invert(80%) sepia(51%) saturate(6571%) hue-rotate(353deg)
        brightness(89%) contrast(91%);
    height: 14px;
}
#explore-sorting .title {
    padding: 20px;
}
#explore-sorting .title h6 {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#explore-sorting .title select {
    display: inline;
    width: 11% !important;
}
#explore-sorting .title select option {
    color: #000000;
    background-color: transparent !important;
}
#explore-sorting .title .form-control {
    background-color: transparent;
    border: 0;
    font-size: 14px !important;
    font-family: HelveticaNeue;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    color: #ffffff;
    padding: 0;
}
#explore-sorting .sorting-show .title {
    padding: 30px 0;
}
#explore-sorting .sorting-show .title h2 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#explore-sorting .sorting-show .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#explore-sorting .sorting-show img {
    width: 200px;
}
#explore-sorting .sorting-show ul {
    list-style: none;
    padding: 0;
}
#explore-sorting .sorting-show li {
    display: inline-block;
}
#explore-sorting .sorting-show .item {
    display: inline-block;
}
#explore-sorting .sorting-show .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#explore-sorting .sorting-show .btn-load-more:hover {
    background-color: transparent;
}
#explore-sorting .sorting-show .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#explore-sorting .sorting-show .all a {
    color: #ffffff;
    text-decoration: none;
}
#explore-sorting .sorting-show .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
#explore-sorting .sorting-show .box19 img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    background-color: #282828;
}
#explore-sorting .sorting-show .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#explore-sorting .sorting-show .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#explore-sorting .sorting-show .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#explore-sorting .sorting-show .box19 .icon,
#explore-sorting .sorting-show .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#explore-sorting .sorting-show .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
#explore-sorting .sorting-show .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#explore-sorting .sorting-show .box19:hover .title {
    transform: scale(1);
}
#explore-sorting .sorting-show .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#explore-sorting .sorting-show .box19:hover .icon {
    opacity: 1;
}
#explore-sorting .sorting-show .box19 .icon li {
    display: inline-block;
}
#explore-sorting .sorting-show .box19 .icon li:first-child a,
#explore-sorting .sorting-show .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#explore-sorting .sorting-show .box19 .icon li a {
    top: -80px;
}
#explore-sorting .sorting-show .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#explore-sorting .sorting-show .box19:hover .icon li a {
    top: -20px;
}
#explore-sorting .sorting-show .box19:hover .icon li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#explore-sorting .sorting-show .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
}
#explore-sorting .sorting-show .box19:hover .subtitle {
    opacity: 1;
}
#explore-sorting .sorting-show .box19 .subtitle li {
    display: inline-block;
}
#explore-sorting .sorting-show .box19 .subtitle li:first-child a h5,
#explore-sorting .sorting-show .box19 .subtitle li:last-child a h5 {
    display: block;
    line-height: 50px;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#explore-sorting .sorting-show .box19 .subtitle li a {
    top: -80px;
}
#explore-sorting .sorting-show .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#explore-sorting .sorting-show .box19:hover .subtitle li a {
    top: -20px;
}
#explore-sorting .sorting-show .box19:hover .subtitle li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#explore-sorting .sorting-show .box19 .now-playing {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    text-align: left;
}
#explore-sorting .sorting-show .box19:hover .now-playing {
    opacity: 1;
}
#explore-sorting .sorting-show .box19 .now-playing li {
    display: inline-block;
}
#explore-sorting .sorting-show .box19 .now-playing li:first-child a h7,
#explore-sorting .sorting-show .box19 .now-playing li:last-child a h7 {
    display: block;
    line-height: 50px;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-light;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#explore-sorting .sorting-show .box19 .now-playing li a {
    top: -80px;
}
#explore-sorting .sorting-show .box19 .now-playing li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
#explore-sorting .sorting-show .box19:hover .now-playing li a {
    top: -20px;
}
#explore-sorting .sorting-show .box19:hover .now-playing li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show .box19 .now-playing li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show .box19 .now-playing li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    #explore-sorting .sorting-show .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #explore-sorting .sorting-show .box19 .box-content {
        padding-top: 20%;
    }
}
#explore-sorting .sorting-show-program {
    padding: 0 20px;
}
#explore-sorting .sorting-show-program .title {
    padding: 30px 0;
}
#explore-sorting .sorting-show-program .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#explore-sorting .sorting-show-program .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#explore-sorting .sorting-show-program img {
    width: 200px;
}
#explore-sorting .sorting-show-program ul {
    list-style: none;
    padding: 0;
}
#explore-sorting .sorting-show-program li {
    display: inline-block;
}
#explore-sorting .sorting-show-program .item {
    display: inline-block;
}
#explore-sorting .sorting-show-program .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#explore-sorting .sorting-show-program .btn-load-more:hover {
    background-color: transparent;
}
#explore-sorting .sorting-show-program .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#explore-sorting .sorting-show-program .all a {
    color: #ffffff;
    text-decoration: none;
}
#explore-sorting .sorting-show-program .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
#explore-sorting .sorting-show-program .box19 img {
    width: 316px;
    height: 178.9px;
    border-radius: 4px;
    background-color: #282828;
}
#explore-sorting .sorting-show-program .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#explore-sorting .sorting-show-program .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#explore-sorting .sorting-show-program .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#explore-sorting .sorting-show-program .box19 .icon,
#explore-sorting .sorting-show-program .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#explore-sorting .sorting-show-program .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
#explore-sorting .sorting-show-program .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#explore-sorting .sorting-show-program .box19:hover .title {
    transform: scale(1);
}
#explore-sorting .sorting-show-program .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#explore-sorting .sorting-show-program .box19:hover .icon {
    opacity: 1;
}
#explore-sorting .sorting-show-program .box19 .icon li {
    display: inline-block;
}
#explore-sorting .sorting-show-program .box19 .icon li:first-child a,
#explore-sorting .sorting-show-program .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#explore-sorting .sorting-show-program .box19 .icon li a {
    top: -80px;
}
#explore-sorting .sorting-show-program .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#explore-sorting .sorting-show-program .box19:hover .icon li a {
    top: -20px;
}
#explore-sorting .sorting-show-program .box19:hover .icon li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show-program .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show-program .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#explore-sorting .sorting-show-program .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 90px;
    left: 0;
}
#explore-sorting .sorting-show-program .box19:hover .subtitle {
    opacity: 1;
}
#explore-sorting .sorting-show-program .box19 .subtitle li {
    display: inline-block;
}
#explore-sorting .sorting-show-program .box19 .subtitle li:first-child a h5,
#explore-sorting .sorting-show-program .box19 .subtitle li:last-child a h5 {
    padding-right: 10px;
    display: block;
    line-height: 50px;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#explore-sorting .sorting-show-program .box19 .subtitle li a {
    top: -80px;
}
#explore-sorting .sorting-show-program .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#explore-sorting .sorting-show-program .box19:hover .subtitle li a {
    top: -20px;
}
#explore-sorting .sorting-show-program .box19:hover .subtitle li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show-program .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show-program .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#explore-sorting .sorting-show-program .box19 .now-playing {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 0;
}
#explore-sorting .sorting-show-program .box19:hover .now-playing {
    opacity: 1;
}
#explore-sorting .sorting-show-program .box19 .now-playing li {
    display: inline-block;
}
#explore-sorting .sorting-show-program .box19 .now-playing li:first-child a h7,
#explore-sorting .sorting-show-program .box19 .now-playing li:last-child a h7 {
    display: block;
    line-height: 50px;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-light;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#explore-sorting .sorting-show-program .box19 .now-playing li a {
    top: -80px;
}
#explore-sorting .sorting-show-program .box19 .now-playing li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
#explore-sorting .sorting-show-program .box19:hover .now-playing li a {
    top: -20px;
}
#explore-sorting .sorting-show-program .box19:hover .now-playing li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show-program .box19 .now-playing li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show-program .box19 .now-playing li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    #explore-sorting .sorting-show-program .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #explore-sorting .sorting-show-program .box19 .box-content {
        padding-top: 20%;
    }
}
#explore-sorting .sorting-show-extra {
    padding: 0 20px;
}
#explore-sorting .sorting-show-extra .title {
    padding: 30px 0;
}
#explore-sorting .sorting-show-extra .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#explore-sorting .sorting-show-extra .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#explore-sorting .sorting-show-extra img {
    width: 100%;
}
#explore-sorting .sorting-show-extra ul {
    list-style: none;
    padding: 0;
}
#explore-sorting .sorting-show-extra li {
    display: inline-block;
}
#explore-sorting .sorting-show-extra .item {
    display: inline-block;
}
#explore-sorting .sorting-show-extra .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#explore-sorting .sorting-show-extra .btn-load-more:hover {
    background-color: transparent;
}
#explore-sorting .sorting-show-extra .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#explore-sorting .sorting-show-extra .all a {
    color: #ffffff;
    text-decoration: none;
}
#explore-sorting .sorting-show-extra .box {
    margin-bottom: 10px;
}
#explore-sorting .sorting-show-extra .box .subtitle a h6 {
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: 0.63px;
    color: #ffffff;
}
#explore-sorting .sorting-show-extra .box .subtitle a span {
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: 0.49px;
    color: #878787;
}
#explore-sorting .sorting-show-episodes {
    padding: 0 20px;
}
#explore-sorting .sorting-show-episodes .title {
    padding: 30px 0;
}
#explore-sorting .sorting-show-episodes .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#explore-sorting .sorting-show-episodes .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#explore-sorting .sorting-show-episodes img {
    width: 100%;
}
#explore-sorting .sorting-show-episodes ul {
    list-style: none;
    padding: 0;
}
#explore-sorting .sorting-show-episodes li {
    display: inline-block;
}
#explore-sorting .sorting-show-episodes .item {
    display: inline-block;
}
#explore-sorting .sorting-show-episodes .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#explore-sorting .sorting-show-episodes .btn-load-more:hover {
    background-color: transparent;
}
#explore-sorting .sorting-show-episodes .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#explore-sorting .sorting-show-episodes .all a {
    color: #ffffff;
    text-decoration: none;
}
#explore-sorting .sorting-show-episodes .box {
    margin-bottom: 10px;
}
#explore-sorting .sorting-show-episodes .box .subtitle a h6 {
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: 0.63px;
    color: #ffffff;
}
#explore-sorting .sorting-show-episodes .box .subtitle a span {
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: 0.49px;
    color: #878787;
}
#explore-sorting .sorting-show-clips {
    padding: 0 20px;
}
#explore-sorting .sorting-show-clips .title {
    padding: 30px 0;
}
#explore-sorting .sorting-show-clips .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#explore-sorting .sorting-show-clips .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#explore-sorting .sorting-show-clips img {
    width: 100%;
}
#explore-sorting .sorting-show-clips ul {
    list-style: none;
    padding: 0;
}
#explore-sorting .sorting-show-clips li {
    display: inline-block;
}
#explore-sorting .sorting-show-clips .item {
    display: inline-block;
}
#explore-sorting .sorting-show-clips .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#explore-sorting .sorting-show-clips .btn-load-more:hover {
    background-color: transparent;
}
#explore-sorting .sorting-show-clips .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#explore-sorting .sorting-show-clips .all a {
    color: #ffffff;
    text-decoration: none;
}
#explore-sorting .sorting-show-clips .box {
    margin-bottom: 10px;
}
#explore-sorting .sorting-show-clips .box .subtitle a h6 {
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: 0.63px;
    color: #ffffff;
}
#explore-sorting .sorting-show-clips .box .subtitle a span {
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: 0.49px;
    color: #878787;
}
#explore-sorting .sorting-show-photo {
    padding: 0 20px;
}
#explore-sorting .sorting-show-photo .title {
    padding: 30px 0;
}
#explore-sorting .sorting-show-photo .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#explore-sorting .sorting-show-photo .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#explore-sorting .sorting-show-photo img {
    width: 200px;
}
#explore-sorting .sorting-show-photo ul {
    list-style: none;
    padding: 0;
}
#explore-sorting .sorting-show-photo li {
    display: inline-block;
}
#explore-sorting .sorting-show-photo .item {
    display: inline-block;
}
#explore-sorting .sorting-show-photo .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#explore-sorting .sorting-show-photo .btn-load-more:hover {
    background-color: transparent;
}
#explore-sorting .sorting-show-photo .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#explore-sorting .sorting-show-photo .all a {
    color: #ffffff;
    text-decoration: none;
}
#explore-sorting .sorting-show-photo .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
#explore-sorting .sorting-show-photo .box19 img {
    object-fit: cover;
    object-position: 50% 0;
    width: 316px;
    height: 178.9px;
    border-radius: 4px;
    background-color: #282828;
}
#explore-sorting .sorting-show-photo .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#explore-sorting .sorting-show-photo .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#explore-sorting .sorting-show-photo .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#explore-sorting .sorting-show-photo .box19 .icon,
#explore-sorting .sorting-show-photo .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#explore-sorting .sorting-show-photo .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
#explore-sorting .sorting-show-photo .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#explore-sorting .sorting-show-photo .box19:hover .title {
    transform: scale(1);
}
#explore-sorting .sorting-show-photo .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -50px 0 0 0;
    opacity: 0;
}
#explore-sorting .sorting-show-photo .box19:hover .icon {
    opacity: 1;
}
#explore-sorting .sorting-show-photo .box19 .icon li {
    display: inline-block;
}
#explore-sorting .sorting-show-photo .box19 .icon li:first-child a,
#explore-sorting .sorting-show-photo .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#explore-sorting .sorting-show-photo .box19 .icon li a {
    top: -35px;
}
#explore-sorting .sorting-show-photo .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#explore-sorting .sorting-show-photo .box19:hover .icon li a {
    top: -20px;
}
#explore-sorting .sorting-show-photo .box19:hover .icon li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show-photo .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show-photo .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#explore-sorting .sorting-show-photo .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 1000px;
    left: 0;
}
#explore-sorting .sorting-show-photo .box19:hover .subtitle {
    opacity: 1;
}
#explore-sorting .sorting-show-photo .box19 .subtitle li {
    display: inline-block;
}
#explore-sorting .sorting-show-photo .box19 .subtitle li:first-child a h7,
#explore-sorting .sorting-show-photo .box19 .subtitle li:last-child a h7 {
    padding-right: 10px;
    display: block;
    font-size: 13px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#explore-sorting .sorting-show-photo .box19 .subtitle li:first-child a span,
#explore-sorting .sorting-show-photo .box19 .subtitle li:last-child a span {
    display: block;
    font-size: 10px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#explore-sorting .sorting-show-photo .box19 .subtitle li a {
    top: -80px;
}
#explore-sorting .sorting-show-photo .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#explore-sorting .sorting-show-photo .box19:hover .subtitle li a {
    top: -20px;
}
#explore-sorting .sorting-show-photo .box19:hover .subtitle li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show-photo .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show-photo .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#explore-sorting .sorting-show-photo .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
}
#explore-sorting .sorting-show-photo .box19:hover .description {
    opacity: 1;
}
#explore-sorting .sorting-show-photo .box19 .description li {
    display: inline-block;
}
#explore-sorting .sorting-show-photo .box19 .box-content .description li.left {
    float: left;
}
#explore-sorting .sorting-show-photo .box19 .box-content .description li.right {
    float: right;
    padding-right: 20px;
    position: absolute;
    top: 150px;
    right: 0;
}
#explore-sorting
    .sorting-show-photo
    .box19
    .box-content
    .description
    li.right
    a
    img.collections {
    text-decoration: none;
    width: 20px;
    height: 20px;
}
#explore-sorting .sorting-show-photo .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#explore-sorting .sorting-show-photo .box19 .description li:first-child,
#explore-sorting .sorting-show-photo .box19 .description li:second-child {
    padding-left: 10px !important;
}
#explore-sorting .sorting-show-photo .box19 .description li a {
    top: -80px;
}
#explore-sorting .sorting-show-photo .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
#explore-sorting .sorting-show-photo .box19:hover .description li a {
    top: -20px;
}
#explore-sorting .sorting-show-photo .box19:hover .description li a:hover {
    background: transparent;
}
#explore-sorting .sorting-show-photo .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#explore-sorting .sorting-show-photo .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    #explore-sorting .sorting-show-photo .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #explore-sorting .sorting-show-photo .box19 .box-content {
        padding-top: 20%;
    }
}

#cant-find {
    background-color: #3a3a3a;
}
#cant-find .title {
    padding: 10px 20px;
}
#cant-find .title h6 {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#cant-find .description {
    text-align: center;
    padding: 100px 0;
}
#cant-find .description h6 {
    color: #8f8f8f;
    font-family: HelveticaNeue-Medium;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#cant-find .description h7 {
    color: #8f8f8f;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}

.header-wrapper {
    min-height: 548px;
}

::-webkit-scrollbar {
    /* display: none; */
    /* make scrollbar transparent */
}

html {
    width: 100%;
}

#recomendation-program {
    /* overflow-y: hidden; */
    background-color: #282828;
    width: 100%;
    height: auto;
    /* margin-top: 40px; */
    padding: 30px 30px 0 30px;
}

#recomendation-program ::-webkit-scrollbar {
    display: none;
    /* make scrollbar transparent */
}

#recomendation-program .title {
    padding: 0px 0 15px 15px;
}

#recomendation-program .title h2 {
    color: white;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#recomendation-program .swiper-container {
    width: 100%;
    height: 100%;
    overflow: visible;
    scrollbar-width: none;
    padding-left: 16px;
}
#recomendation-program .swiper-container::-webkit-scrollbar {
    display: none;
}
#recomendation-program .swiper-slide::-webkit-scrollbar {
    display: none;
}
#recomendation-program .swiper-slide {
    text-align: center;
    font-size: 18px;
    /* Update: Removed the Flex property - IE FIX */
}
#recomendation-program .swiper-wrapper {
    width: 100%;
    opacity: 1;
    transform: translate3d(-2391px, 0px, 0px);
}
#recomendation-program .swiper-slide {
    transition: 250ms all;
    height: auto !important;
}
#recomendation-program .swiper-slide .img-fluid {
    transition: 0.2s linear;
}
#recomendation-program .swiper-wrapper.disabled {
    transform: translate3d(0px, 0, 0) !important;
}
#recomendation-program .swiper-pagination.disabled {
    display: none;
}
#recomendation-program .swiper-button-prev {
    left: -30px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 20);
    cursor: pointer;
    outline:none;
    /* background gradient swiper by, ghaniy */
    background: linear-gradient(90deg, #282828 0%, rgba(40, 40, 40, 0) 100%);
}
#recomendation-program .swiper-button-next {
    right: -30px;
    z-index: 2;
    position: absolute;
    top: 0;
    height: 100%;
    width: calc(calc(100vw - 165px) / 20);
    cursor: pointer;
    outline:none;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(transparent),
        color-stop(rgba(12, 17, 27, 0.7)),
        to(rgba(12, 17, 27, 0.9))
    );

    /* background gradient swiper by, ghaniy */
    background: linear-gradient(270deg, #282828 0%, rgba(40, 40, 40, 0) 100%);
}
#recomendation-program .swiper-button-next:after,
#recomendation-program .swiper-container-rtl .swiper-button-prev:after {
    content: "next";
    color: white;
}
#recomendation-program .swiper-button-prev:after,
#recomendation-program .swiper-container-rtl .swiper-button-prev:after {
    content: "prev";
    color: white;
}
#recomendation-program .box19 {
    padding-bottom: 30px;
    position: relative;
}
#recomendation-program .box19 progress[value] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    height: 5px;
    /* For IE10 */
    color: red;
    position: absolute;
    bottom: 45px;
    width: 94%;
    text-align: center;
    left: 10px;
}
#recomendation-program .box19 progress[value]::-webkit-progress-value {
    background-color: red;
}
#recomendation-program .box19 progress[value]::-moz-progress-bar {
    background-color: red;
}
#recomendation-program .box19 img {
    width: 100%;
    border-radius: 4px;
    background-color: #282828;
}
#recomendation-program .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#recomendation-program .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#recomendation-program .box19 .countdown {
    position: absolute;
    bottom: 38px;
    right: 5px;
    color: #ffffff;
    background-color: white;
    z-index: 1;
    padding: 0 7px;
    border-radius: 5px;
    /* width: 36px; */
}
#recomendation-program .box19 .countdown h7 {
    font-size: 11px;
    color: black;
    font-family: "Open Sans Regular";
}
#recomendation-program .box19 .countdown #time {
    font-size: 12px;
    color: red;
    padding: 0;
    margin: 0;
    font-family: "Open Sans Bold";
    display: inline;
}
#recomendation-program .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#recomendation-program .box19 .icon,
#recomendation-program .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#recomendation-program .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.7);
}
#recomendation-program .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#recomendation-program .box19:hover .title {
    transform: scale(1);
}
#recomendation-program .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -30px 0 0 0;
    opacity: 0;
}
#recomendation-program .box19:hover .icon {
    opacity: 1;
}
#recomendation-program .box19 .icon li {
    display: inline-block;
}
#recomendation-program .box19 .icon li:first-child a,
#recomendation-program .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#recomendation-program .box19 .icon li a {
    top: -50px;
}
#recomendation-program .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#recomendation-program .box19:hover .icon li a {
    top: -10px;
}
#recomendation-program .box19:hover .icon li a:hover {
    background: transparent;
}
#recomendation-program .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#recomendation-program .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#recomendation-program .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 80px;
    left: 0;
}
#recomendation-program .box19:hover .subtitle {
    opacity: 1;
}
#recomendation-program .box19 .subtitle li {
    display: inline-block;
}
#recomendation-program .box19 .subtitle li:first-child a h5,
#recomendation-program .box19 .subtitle li:last-child a h5 {
    display: block;
    line-height: 1 !important;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#recomendation-program .box19 .subtitle li:first-child a span,
#recomendation-program .box19 .subtitle li:last-child a span {
    display: block;
    line-height: 1 !important;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    position: absolute;
    top: 50px;
    left: 5px;
}
#recomendation-program .box19 .subtitle li a {
    top: -80px;
}
#recomendation-program .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#recomendation-program .box19:hover .subtitle li a {
    top: -20px;
}
#recomendation-program .box19:hover .subtitle li a:hover {
    background: transparent;
}
#recomendation-program .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#recomendation-program .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#recomendation-program .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 5px;
}
#recomendation-program .box19:hover .description {
    opacity: 1;
}
#recomendation-program .box19 .description li {
    display: inline-block;
}
#recomendation-program .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#recomendation-program .box19 .description li:first-child,
#recomendation-program .box19 .description li:second-child {
    padding-left: 10px !important;
}
#recomendation-program .box19 .description li a {
    top: -80px;
}
#recomendation-program .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
#recomendation-program .box19:hover .description li a {
    top: -20px;
}
#recomendation-program .box19:hover .description li a:hover {
    background: transparent;
}
#recomendation-program .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#recomendation-program .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}

#bg-programs {
    background-image: url("../image/banner/IMGhorizontal-kesempatanke2.png");
}

#bg-programs::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: white;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.206320028) 47%,
        black 92%
    );
    opacity: 1;
}

#bg-programs-etc {
    background-image: url("../image/banner/IMGhorizontal-kesempatanke2.png");
}
#bg-programs-etc .top-descriptions {
    margin-top: 300px;
    z-index: 1;
}
#bg-programs-etc .top-descriptions .photo-program {
    margin-left: 16px;
    display: inline;
    width: 10%;
}
#bg-programs-etc .top-descriptions .title-program {
    margin-left: 10px;
    width: 80%;
    display: inline;
}
#bg-programs-etc .top-descriptions .title-program .title h1 {
    padding-left: 10px;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 26px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#bg-programs-etc .top-descriptions .rating h5 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#bg-programs-etc .top-descriptions .rating h5 img {
    padding-right: 10px;
}
#bg-programs-etc .top-descriptions .rating ul.p-about li .btn-program-about {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 25px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 20px;
    margin: 10px;
    cursor: pointer;
}
#bg-programs-etc
    .top-descriptions
    .rating
    ul.p-about
    li
    .btn-program-about
    img {
    padding-right: 10px;
}
#bg-programs-etc
    .top-descriptions
    .rating
    ul.p-about
    li
    .btn-program-about:hover {
    background-color: transparent;
}
#bg-programs-etc .top-descriptions ul.like-dislike li a {
    padding: 0;
}
#bg-programs-etc .top-descriptions ul.like-dislike li.active a img {
    border-radius: 50%;
    background-color: #265bab !important;
}
#bg-programs-etc .top-descriptions ul.p-about li .btn-program-about {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 25px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 20px;
    margin: 10px;
    cursor: pointer;
}
#bg-programs-etc .top-descriptions ul.p-about li .btn-program-about img {
    padding-right: 10px;
}
#bg-programs-etc .top-descriptions ul.p-about li .btn-program-about:hover {
    background-color: transparent;
}

#bg-programs-etc::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: white;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.206320028) 47%,
        black 92%
    );
    opacity: 1;
}

.bg-about {
    width: 100%;
    padding-top: 100px;
    background-color: #000000;
}
.bg-about .top-descriptions {
    padding-bottom: 50px;
    z-index: 1;
}
.bg-about .top-descriptions .photo-program {
    margin-left: 16px;
    display: inline;
    width: 10%;
}
.bg-about .top-descriptions .list-inline-item {
    margin-right: 0;
}
.bg-about .top-descriptions .title-season {
    font-family: "Open Sans Light";
    font-size: 18px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.72px;
    color: #ffffff;
    margin-left: 10px;
}
.bg-about .top-descriptions .title-program {
    margin-left: 10px;
    display: inline;
    width: 80%;
}
.bg-about .top-descriptions .title-program .title h1 {
    padding-left: 10px;
    color: #ffffff;
    font-family: "Open Sans SemiBold";
    font-size: 21px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.84px;
    color: #ffffff;
}
@media only screen and (max-width: 1280px) {
    .bg-about .top-descriptions .title-program .title h1 {
        padding-left: 10px;
        color: #ffffff;
        font-family: "Open Sans SemiBold";
        font-size: 18px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: 0.84px;
        color: #ffffff;
    }
}
@media only screen and (max-width: 1024px) {
    .bg-about .top-descriptions .title-program .title h1 {
        padding-left: 10px;
        color: #ffffff;
        font-family: "Open Sans SemiBold";
        font-size: 15px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: 0.84px;
        color: #ffffff;
    }
}
.bg-about .top-descriptions .rating {
    padding-top: 20px;
}
.bg-about .top-descriptions .rating h5 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
.bg-about .top-descriptions .rating h5 img {
    padding-right: 10px;
}
.bg-about .top-descriptions .rating ul.p-about li .btn-program-about {
    font-size: 12px;
    font-family: "Open Sans Light";
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 25px;
    border: 1px solid #ffffff;
    outline: 0;
    cursor: pointer;
}
.bg-about .top-descriptions .rating ul.p-about li .btn-program-about img {
    padding-right: 10px;
}
.bg-about .top-descriptions .rating ul.p-about li .btn-program-about:hover {
    background-color: transparent;
}
.bg-about .top-descriptions ul.like-dislike li a {
    padding: 0;
}
.bg-about .top-descriptions ul.like-dislike li.active a img {
    border-radius: 50%;
    background-color: #265bab !important;
}
.bg-about .top-descriptions ul.p-about li .btn-program-about {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 25px;
    border: 1px solid #ffffff;
    outline: 0;
    cursor: pointer;
}
.bg-about .top-descriptions ul.p-about li .btn-program-about img {
    padding-right: 10px;
}
.bg-about .top-descriptions ul.p-about li .btn-program-about-list {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 25px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 20px;
    margin: 10px;
    cursor: pointer;
}
.bg-about .top-descriptions ul.p-about li .btn-program-about-list img {
    padding-right: 10px;
}
.bg-about .top-descriptions ul.p-about li .btn-program-about-list-active {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: #153566 !important;
    border-radius: 25px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 20px;
    margin: 10px;
    cursor: pointer;
}
.bg-about
    .top-descriptions
    ul.p-about
    li
    .btn-program-about-list-active
    .fa-check {
    padding-right: 10px;
}
.bg-about .top-descriptions ul.p-about li .btn-program-about:hover {
    background-color: transparent;
}
.bg-about .detail-description {
    padding: 20px 50px 50px 0px;
    font-family: "Open Sans Light";
    font-size: 18px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
@media only screen and (max-width: 1280px) {
    .bg-about .detail-description {
        padding: 20px 40px;
        font-family: "Open Sans Light";
        font-size: 15px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #ffffff;
    }
}
@media only screen and (max-width: 1024px) {
    .bg-about .detail-description {
        padding: 20px 40px;
        font-family: "Open Sans Light";
        font-size: 12px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #ffffff;
    }
}

#bg-programs-details {
    background-image: url("../image/banner/IMGhorizontal-kesempatanke2.png");
    padding-right: 40px;
    padding-left: 50px;
    z-index: 3;
}
#bg-programs-details .content {
    width: 100%;
}
#bg-programs-details .content .top-details {
    margin-top: 0;
    z-index: 1;
}
#bg-programs-details .content .top-details .videos {
    margin: 0 auto;
    margin-top: 100px;
}

#image-video-two{
    width: 100%;
    font-size: 16px;
    position: relative;
    display: block;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
    font-family: Arial,Helvetica,sans-serif;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline: 0;
}


#bg-programs-details .content .top-details .videos .item video {
    width: 100%;
    height: 100%;
}
#bg-programs-details .content .top-details .ico-play-episode-detail-video {
    position: absolute;
    top: 40%;
    left: 46%;
}
#bg-programs-details .content .top-details .ico-play-episode-detail-video img {
    width: 40px;
}
#bg-programs-details .content .top-details .error-message {
    position: absolute;
    top: 30%;
    left: 46%;
    display: none;
    z-index: 9;
}
#bg-programs-details .content .top-details .error-message img {
    width: 60px;
}
#bg-programs-details .content .top-details .error-message h4 {
    font-family: "Open Sans SemiBold";
    position: relative;
    left: -33%;
    color: white;
    line-height: 1.7 !important;
    font-size: 20px;
}
#bg-programs-details .content .top-details .error-message p {
    text-align: center;
    position: relative;
    left: -34%;
    font-family: "Open Sans Light";
    font-size: 15px;
}
#bg-programs-details .content .top-details .ico-play-clips-detail-video {
    position: absolute;
    top: 40%;
    left: 46%;
}
#bg-programs-details .content .top-details .ico-play-clips-detail-video img {
    width: 40px;
}
#bg-programs-details .content .top-details .ico-play-extras-detail-video {
    position: absolute;
    top: 40%;
    left: 46%;
}
#bg-programs-details .content .top-details .ico-play-extras-detail-video img {
    width: 40px;
}
#bg-programs-details .content .top-details .right {
    text-align: right;
}
#bg-programs-details
    .content
    .top-details
    .right
    ul.p-details-extras
    li
    .btn-extras-details {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 15px;
    margin: 10px;
    cursor: pointer;
}
#bg-programs-details
    .content
    .top-details
    .right
    ul.p-details-extras
    li
    .btn-extras-details
    img {
    padding-right: 10px;
}
#bg-programs-details
    .content
    .top-details
    .right
    ul.p-details-extras
    li
    .btn-extras-detail:hover {
    background-color: transparent;
}
#bg-programs-details
    .content
    .top-details
    .right
    ul.p-details
    li
    .btn-programs-details {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 15px;
    margin: 10px;
    cursor: pointer;
}
#bg-programs-details
    .content
    .top-details
    .right
    ul.p-details
    li
    .btn-programs-details
    img {
    padding-right: 10px;
}
#bg-programs-details
    .content
    .top-details
    .right
    ul.p-details
    li
    .btn-program-about:hover {
    background-color: transparent;
}
#bg-programs-details .content .top-details .left {
    margin-top: 10px;
}
#bg-programs-details
    .content
    .top-details
    .left
    .user-thumbnail
    img.user-simple-line-icons {
    width: 40px;
    height: 40px;
}
#bg-programs-details .content .top-details .left .title-postseason {
    margin-top: 3px;
}
#bg-programs-details .content .top-details .left .title-postseason ul li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#bg-programs-details
    .content
    .top-details
    .left
    .title-postseason
    ul
    li.post-season {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#bg-programs-details .content .top-details .left .title-postextras {
    margin-top: 0;
    padding-left: 0;
    padding-right: 0;
}
#bg-programs-details .content .top-details .left .title-postextras ul li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#bg-programs-details
    .content
    .top-details
    .left
    .title-postextras
    ul
    li.post-extras {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}

#bg-programs-details::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(
        254deg,
        black 19%,
        rgba(255, 255, 255, 0.5942752101) 96%
    );
    opacity: 1;
}

.bg-image-full {
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

#break-line {
    border-top: solid 3px #000000;
}

#programs-about-menu .menu-program {
    width: 100%;
    padding: 30px 30px 0 30px;
}
#programs-about-menu ul.program-title li {
    width: 24%;
}
#programs-about-menu ul.program-title li h2 {
    color: #ffffff;
    font-family: "Open Sans Light";
    font-size: 20px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    text-align: center;
}
#programs-about-menu ul.program-title .list-inline-item:not(:last-child) {
    margin-right: -5px;
}
#programs-about-menu ul.program-title li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#programs-about-menu ul.program-title li.active h2 {
    font-family: "Open Sans Bold";
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    text-align: center;
    color: #ffffff;
}
#programs-about-menu ul.program-title li.not-active {
    border-bottom: 2px solid #ffffff;
    padding-bottom: 10px;
}
#programs-about-menu ul.program-title li.not-active h2 {
    font-family: "Open Sans Light";
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    text-align: center;
    color: #ffffff;
}

#programs-about-menu-details .menu-program {
    width: 100%;
    padding: 30px;
}
#programs-about-menu-details ul.program-title li {
    width: 24%;
}
#programs-about-menu-details ul.program-title li h2 {
    color: #ffffff;
    font-family: "Open Sans Light";
    font-size: 20px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    text-align: center;
}
#programs-about-menu-details
    ul.program-title
    .list-inline-item:not(:last-child) {
    margin-right: -5px;
}
#programs-about-menu-details ul.program-title li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#programs-about-menu-details ul.program-title li.active h2 {
    font-family: "Open Sans Bold";
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    text-align: center;
    color: #ffffff;
}
#programs-about-menu-details ul.program-title li.not-active {
    border-bottom: 2px solid #ffffff;
    padding-bottom: 10px;
}
#programs-about-menu-details ul.program-title li.not-active h2 {
    font-family: "Open Sans Bold";
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    text-align: center;
    color: #ffffff;
}

#about-descriptions {
    margin-top: 40px;
    background-color: #1d1d1d;
}
#about-descriptions .img-thumb img {
    border-radius: 0px;
}
#about-descriptions .title h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    padding-bottom: 20px;
}
#about-descriptions .detail-description p {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    padding-bottom: 20px;
    text-align: justify;
}
#about-descriptions .title h5 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    padding-bottom: 20px;
}
#about-descriptions .title-cast h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    padding-bottom: 20px;
}
#about-descriptions .detail-description-cast p {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38;
    padding-bottom: 20px;
    text-align: justify;
}

#programs-episodes {
    padding-top: 0;
    background-color: #282828;
    width: 100%;
    height: auto;
}
#programs-episodes .title {
    padding: 20px;
}
#programs-episodes .title h6 {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-episodes .title select {
    display: inline;
    width: 11% !important;
}
#programs-episodes .title select option {
    color: #000000;
    background-color: transparent !important;
}
#programs-episodes .title .form-control {
    background-color: transparent;
    border: 0;
    font-size: 14px !important;
    font-family: HelveticaNeue;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    color: #ffffff;
    padding: 0;
}
#programs-episodes .programs-episodes-show {
    padding: 0 20px;
}
#programs-episodes .programs-episodes-show .title {
    padding: 30px 0;
}
#programs-episodes .programs-episodes-show .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#programs-episodes .programs-episodes-show .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#programs-episodes .programs-episodes-show img {
    width: 200px;
}
#programs-episodes .programs-episodes-show ul {
    list-style: none;
    padding: 0;
}
#programs-episodes .programs-episodes-show li {
    display: inline-block;
}
#programs-episodes .programs-episodes-show .item {
    display: inline-block;
}
#programs-episodes .programs-episodes-show .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#programs-episodes .programs-episodes-show .btn-load-more:hover {
    background-color: transparent;
}
#programs-episodes .programs-episodes-show .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#programs-episodes .programs-episodes-show .all a {
    color: #ffffff;
    text-decoration: none;
}
#programs-episodes .programs-episodes-show .box19 {
    text-align: center;
    position: relative;
}
#programs-episodes .programs-episodes-show .box19 img {
    width: 100%;
    height: auto;
    border-radius: 0px;
    background-color: #282828;
}
#programs-episodes .programs-episodes-show .box19 .vision-plus-box .btn-red,
#programs-episodes
    .programs-episodes-show
    .box19
    .vision-plus-box
    .btn-red:not(:disabled):not(.disabled):active,
#programs-episodes
    .programs-episodes-show
    .box19
    .vision-plus-box
    .btn-red:not(:disabled):not(.disabled):active:focus,
#programs-episodes
    .programs-episodes-show
    .box19
    .vision-plus-box
    .btn-red:focus,
#programs-episodes
    .programs-episodes-show
    .box19
    .vision-plus-box
    .btn-red:hover {
    color: #fff;
    background-color: #fa262f;
    padding-left: 15%;
    padding-right: 15%;
}
#programs-episodes .programs-episodes-show .box19 .vision-plus-box {
    width: 100%;
    height: auto;
    border-radius: 0px;
    background-color: #434343;
}
#programs-episodes .programs-episodes-show .box19 .vision-plus-box-content {
    width: 70%;
    margin: 0 auto;
    padding-top: 1.8rem;
}
#programs-episodes .programs-episodes-show .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#programs-episodes .programs-episodes-show .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#programs-episodes .programs-episodes-show .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#programs-episodes .programs-episodes-show .box19 .icon,
#programs-episodes .programs-episodes-show .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#programs-episodes .programs-episodes-show .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#programs-episodes .programs-episodes-show .box19:hover .title {
    transform: scale(1);
}
#programs-episodes .programs-episodes-show .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#programs-episodes .programs-episodes-show .box19:hover .icon {
    opacity: 1;
}
#programs-episodes .programs-episodes-show .box19 .icon li {
    display: inline-block;
}
#programs-episodes .programs-episodes-show .box19 .icon li:first-child a,
#programs-episodes .programs-episodes-show .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#programs-episodes .programs-episodes-show .box19 .icon li a {
    top: -35px;
}
#programs-episodes .programs-episodes-show .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-episodes .programs-episodes-show .box19:hover .icon li a {
    top: -40px;
}
#programs-episodes .programs-episodes-show .box19:hover .icon li a:hover {
    background: transparent;
}
#programs-episodes .programs-episodes-show .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-episodes .programs-episodes-show .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-episodes .programs-episodes-show .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: -10px 0 10px 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 90px;
    left: 0;
}
#programs-episodes .programs-episodes-show .box19:hover .subtitle {
    opacity: 1;
}
#programs-episodes .programs-episodes-show .box19 .subtitle li {
    display: table;
}
#programs-episodes .programs-episodes-show .box19 .subtitle li:first-child a h7,
#programs-episodes .programs-episodes-show .box19 .subtitle li:last-child a h7 {
    padding-right: 10px;
    display: block;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#programs-episodes
    .programs-episodes-show
    .box19
    .subtitle
    li:first-child
    a
    span,
#programs-episodes
    .programs-episodes-show
    .box19
    .subtitle
    li:last-child
    a
    span {
    display: block;
    font-size: 12px;
    color: #fff;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    position: absolute;
    top: 57px;
    left: 5px;
    width: 200px;
}
#programs-episodes .programs-episodes-show .box19 .subtitle li a {
    top: -80px;
}
#programs-episodes .programs-episodes-show .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-episodes .programs-episodes-show .box19:hover .subtitle li a {
    top: -20px;
}
#programs-episodes .programs-episodes-show .box19:hover .subtitle li a:hover {
    background: transparent;
}
#programs-episodes .programs-episodes-show .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-episodes .programs-episodes-show .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-episodes .programs-episodes-show .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 5px;
}
#programs-episodes .programs-episodes-show .box19:hover .description {
    opacity: 1;
}
#programs-episodes .programs-episodes-show .box19 .description li {
    display: inline-block;
}
#programs-episodes .programs-episodes-show .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-episodes .programs-episodes-show .box19 .description li:first-child,
#programs-episodes .programs-episodes-show .box19 .description li:second-child {
    padding-left: 10px !important;
}
#programs-episodes .programs-episodes-show .box19 .description li a {
    top: -80px;
}
#programs-episodes .programs-episodes-show .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
#programs-episodes .programs-episodes-show .box19:hover .description li a {
    top: -20px;
}
#programs-episodes
    .programs-episodes-show
    .box19:hover
    .description
    li
    a:hover {
    background: transparent;
}
#programs-episodes
    .programs-episodes-show
    .box19
    .description
    li:first-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-episodes .programs-episodes-show .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-episodes .programs-episodes-show .title {
    padding: 15px;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: 0.63px;
    color: #ffffff;
}
#programs-episodes .programs-episodes-show .summary {
    padding: 0px 15px 24px;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: 0.49px;
    color: #878787;
}
@media only screen and (max-width: 990px) {
    #programs-episodes .programs-episodes-show .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #programs-episodes .programs-episodes-show .box19 .box-content {
        padding-top: 20%;
    }
}

#programs-episodes-details {
    padding-top: 0;
    background-color: #1d1d1d;
    width: 100%;
    height: auto;
}
#programs-episodes-details .title {
    padding: 20px;
}
#programs-episodes-details .title h6 {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-episodes-details .title select {
    display: inline;
    width: 11% !important;
}
#programs-episodes-details .title select option {
    color: #000000;
    background-color: transparent !important;
}
#programs-episodes-details .title .form-control {
    background-color: transparent;
    border: 0;
    font-size: 14px !important;
    font-family: HelveticaNeue;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    color: #ffffff;
    padding: 0;
}
#programs-episodes-details .programs-episodes-show-details {
    padding: 0 20px;
}
#programs-episodes-details .programs-episodes-show-details .title {
    padding: 30px 0;
}
#programs-episodes-details .programs-episodes-show-details .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#programs-episodes-details .programs-episodes-show-details .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#programs-episodes-details .programs-episodes-show-details img {
    width: 200px;
}
#programs-episodes-details .programs-episodes-show-details ul {
    list-style: none;
    padding: 0;
}
#programs-episodes-details .programs-episodes-show-details li {
    display: inline-block;
}
#programs-episodes-details .programs-episodes-show-details .item {
    display: inline-block;
}
#programs-episodes-details .programs-episodes-show-details .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#programs-episodes-details
    .programs-episodes-show-details
    .btn-load-more:hover {
    background-color: transparent;
}
#programs-episodes-details .programs-episodes-show-details .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#programs-episodes-details .programs-episodes-show-details .all a {
    color: #ffffff;
    text-decoration: none;
}
#programs-episodes-details .programs-episodes-show-details .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
#programs-episodes-details .programs-episodes-show-details .box19 img {
    width: 316px;
    height: 178.9px;
    border-radius: 0px;
    background-color: #282828;
}
#programs-episodes-details .programs-episodes-show-details .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#programs-episodes-details .programs-episodes-show-details .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#programs-episodes-details .programs-episodes-show-details .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 45%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#programs-episodes-details .programs-episodes-show-details .box19 .icon,
#programs-episodes-details .programs-episodes-show-details .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .box-content {
    background: rgba(28, 28, 28, 0.5);
}
#programs-episodes-details .programs-episodes-show-details .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#programs-episodes-details .programs-episodes-show-details .box19:hover .title {
    transform: scale(1);
}
#programs-episodes-details .programs-episodes-show-details .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#programs-episodes-details .programs-episodes-show-details .box19:hover .icon {
    opacity: 1;
}
#programs-episodes-details .programs-episodes-show-details .box19 .icon li {
    display: inline-block;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .icon
    li:first-child
    a,
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .icon
    li:last-child
    a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#programs-episodes-details .programs-episodes-show-details .box19 .icon li a {
    top: -35px;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .icon
    li
    a
    img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .icon
    li
    a {
    top: -20px;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .icon
    li
    a:hover {
    background: transparent;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .icon
    li:first-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .icon
    li:last-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-episodes-details .programs-episodes-show-details .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: -10px 0 10px 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .subtitle {
    opacity: 1;
}
#programs-episodes-details .programs-episodes-show-details .box19 .subtitle li {
    display: table;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .subtitle
    li:first-child
    a
    h7,
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .subtitle
    li:last-child
    a
    h7 {
    display: block;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .subtitle
    li:first-child
    a
    span,
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .subtitle
    li:last-child
    a
    span {
    display: block;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .subtitle
    li
    a {
    top: -80px;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .subtitle
    li
    a
    img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .subtitle
    li
    a {
    top: -20px;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .subtitle
    li
    a:hover {
    background: transparent;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .subtitle
    li:first-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .subtitle
    li:last-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-episodes-details .programs-episodes-show-details .title {
    padding: 15px;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: 0.63px;
    color: #ffffff;
}
#programs-episodes-details .programs-episodes-show-details .summary {
    padding: 0px 15px 38px;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: 0.49px;
    color: #878787;
}
#programs-episodes-details .programs-episodes-show-details .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .description {
    opacity: 1;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .description
    li {
    display: inline-block;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .description
    li
    a
    span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .description
    li:first-child,
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .description
    li:second-child {
    padding-left: 10px !important;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .description
    li
    a {
    top: -80px;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .description
    li
    a
    img {
    width: 20px;
    height: 20px;
    object-fit: contain;
    background-color: transparent;
    margin: -10px 0 0 0;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .description
    li
    a {
    top: -20px;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19:hover
    .description
    li
    a:hover {
    background: transparent;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .description
    li:first-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-episodes-details
    .programs-episodes-show-details
    .box19
    .description
    li:last-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    #programs-episodes-details .programs-episodes-show-details .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #programs-episodes-details
        .programs-episodes-show-details
        .box19
        .box-content {
        padding-top: 20%;
    }
}

#programs-extras {
    padding-top: 40px;
    background-color: #282828;
    width: 100%;
    height: auto;
}
#programs-extras .title {
    padding: 20px;
}
#programs-extras .title h6 {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-extras .title select {
    display: inline;
    width: 11% !important;
}
#programs-extras .title select option {
    color: #000000;
    background-color: transparent !important;
}
#programs-extras .title .form-control {
    background-color: transparent;
    border: 0;
    font-size: 14px !important;
    font-family: HelveticaNeue;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    color: #ffffff;
    padding: 0;
}
#programs-extras .programs-extras-show {
    padding: 0 20px;
}
#programs-extras .programs-extras-show .title {
    padding: 30px 0;
}
#programs-extras .programs-extras-show .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#programs-extras .programs-extras-show .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#programs-extras .programs-extras-show img {
    width: 200px;
}
#programs-extras .programs-extras-show ul {
    list-style: none;
    padding: 0;
}
#programs-extras .programs-extras-show li {
    display: inline-block;
}
#programs-extras .programs-extras-show .item {
    display: inline-block;
}
#programs-extras .programs-extras-show .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#programs-extras .programs-extras-show .btn-load-more:hover {
    background-color: transparent;
}
#programs-extras .programs-extras-show .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#programs-extras .programs-extras-show .all a {
    color: #ffffff;
    text-decoration: none;
}
#programs-extras .programs-extras-show .box19 {
    text-align: center;
    position: relative;
}
#programs-extras .programs-extras-show .box19 img {
    width: 100%;
    height: auto;
    border-radius: 0px;
    background-color: #282828;
}
#programs-extras .programs-extras-show .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#programs-extras .programs-extras-show .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#programs-extras .programs-extras-show .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#programs-extras .programs-extras-show .box19 .icon,
#programs-extras .programs-extras-show .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#programs-extras .programs-extras-show .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#programs-extras .programs-extras-show .box19:hover .title {
    transform: scale(1);
}
#programs-extras .programs-extras-show .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#programs-extras .programs-extras-show .box19:hover .icon {
    opacity: 1;
}
#programs-extras .programs-extras-show .box19 .icon li {
    display: inline-block;
}
#programs-extras .programs-extras-show .box19 .icon li:first-child a,
#programs-extras .programs-extras-show .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#programs-extras .programs-extras-show .box19 .icon li a {
    top: -35px;
}
#programs-extras .programs-extras-show .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-extras .programs-extras-show .box19:hover .icon li a {
    top: -40px;
}
#programs-extras .programs-extras-show .box19:hover .icon li a:hover {
    background: transparent;
}
#programs-extras .programs-extras-show .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-extras .programs-extras-show .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-extras .programs-extras-show .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: -10px 0 10px 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 90px;
    left: 0;
}
#programs-extras .programs-extras-show .box19:hover .subtitle {
    opacity: 1;
}
#programs-extras .programs-extras-show .box19 .subtitle li {
    display: table;
}
#programs-extras .programs-extras-show .box19 .subtitle li:first-child a h7,
#programs-extras .programs-extras-show .box19 .subtitle li:last-child a h7 {
    padding-right: 10px;
    display: block;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#programs-extras .programs-extras-show .box19 .subtitle li:first-child a span,
#programs-extras .programs-extras-show .box19 .subtitle li:last-child a span {
    display: block;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    position: absolute;
    top: 57px;
    left: 5px;
}
#programs-extras .programs-extras-show .box19 .subtitle li a {
    top: -80px;
}
#programs-extras .programs-extras-show .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-extras .programs-extras-show .box19:hover .subtitle li a {
    top: -20px;
}
#programs-extras .programs-extras-show .box19:hover .subtitle li a:hover {
    background: transparent;
}
#programs-extras .programs-extras-show .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-extras .programs-extras-show .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-extras .programs-extras-show .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 5px;
}
#programs-extras .programs-extras-show .box19:hover .description {
    opacity: 1;
}
#programs-extras .programs-extras-show .box19 .description li {
    display: inline-block;
}
#programs-extras .programs-extras-show .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-extras .programs-extras-show .box19 .description li:first-child,
#programs-extras .programs-extras-show .box19 .description li:second-child {
    padding-left: 10px !important;
}
#programs-extras .programs-extras-show .box19 .description li a {
    top: -80px;
}
#programs-extras .programs-extras-show .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
#programs-extras .programs-extras-show .box19:hover .description li a {
    top: -20px;
}
#programs-extras .programs-extras-show .box19:hover .description li a:hover {
    background: transparent;
}
#programs-extras .programs-extras-show .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-extras .programs-extras-show .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-extras .programs-extras-show .title {
    padding: 15px;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: 0.63px;
    color: #ffffff;
}
#programs-extras .programs-extras-show .summary {
    padding: 0px 15px 38px;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: 0.49px;
    color: #878787;
}
@media only screen and (max-width: 990px) {
    #programs-extras .programs-extras-show .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #programs-extras .programs-extras-show .box19 .box-content {
        padding-top: 20%;
    }
}

#programs-extras-details {
    padding-top: 0;
    background-color: #282828;
    width: 100%;
    height: auto;
}
#programs-extras-details .title {
    padding: 20px;
}
#programs-extras-details .title h6 {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-extras-details .title select {
    display: inline;
    width: 11% !important;
}
#programs-extras-details .title select option {
    color: #000000;
    background-color: transparent !important;
}
#programs-extras-details .title .form-control {
    background-color: transparent;
    border: 0;
    font-size: 14px !important;
    font-family: HelveticaNeue;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    color: #ffffff;
    padding: 0;
}
#programs-extras-details .programs-extras-show-details {
    padding: 0 20px;
}
#programs-extras-details .programs-extras-show-details .title {
    padding: 30px 0;
}
#programs-extras-details .programs-extras-show-details .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#programs-extras-details .programs-extras-show-details .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#programs-extras-details .programs-extras-show-details img {
    width: 200px;
}
#programs-extras-details .programs-extras-show-details ul {
    list-style: none;
    padding: 0;
}
#programs-extras-details .programs-extras-show-details li {
    display: inline-block;
}
#programs-extras-details .programs-extras-show-details .item {
    display: inline-block;
}
#programs-extras-details .programs-extras-show-details .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#programs-extras-details .programs-extras-show-details .btn-load-more:hover {
    background-color: transparent;
}
#programs-extras-details .programs-extras-show-details .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#programs-extras-details .programs-extras-show-details .all a {
    color: #ffffff;
    text-decoration: none;
}
#programs-extras-details .programs-extras-show-details .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
#programs-extras-details .programs-extras-show-details .box19 img {
    width: 100%;
    height: auto;
    border-radius: 0px;
    background-color: #282828;
}
#programs-extras-details .programs-extras-show-details .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#programs-extras-details .programs-extras-show-details .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#programs-extras-details .programs-extras-show-details .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 40%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#programs-extras-details .programs-extras-show-details .box19 .icon,
#programs-extras-details .programs-extras-show-details .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#programs-extras-details .programs-extras-show-details .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#programs-extras-details .programs-extras-show-details .box19:hover .title {
    transform: scale(1);
}
#programs-extras-details .programs-extras-show-details .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#programs-extras-details .programs-extras-show-details .box19:hover .icon {
    opacity: 1;
}
#programs-extras-details .programs-extras-show-details .box19 .icon li {
    display: inline-block;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .icon
    li:first-child
    a,
#programs-extras-details
    .programs-extras-show-details
    .box19
    .icon
    li:last-child
    a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#programs-extras-details .programs-extras-show-details .box19 .icon li a {
    top: -35px;
}
#programs-extras-details .programs-extras-show-details .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-extras-details .programs-extras-show-details .box19:hover .icon li a {
    top: -20px;
}
#programs-extras-details
    .programs-extras-show-details
    .box19:hover
    .icon
    li
    a:hover {
    background: transparent;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .icon
    li:first-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .icon
    li:last-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-extras-details .programs-extras-show-details .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: -10px 0 10px 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
}
#programs-extras-details .programs-extras-show-details .box19:hover .subtitle {
    opacity: 1;
}
#programs-extras-details .programs-extras-show-details .box19 .subtitle li {
    display: table;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .subtitle
    li:first-child
    a
    h7,
#programs-extras-details
    .programs-extras-show-details
    .box19
    .subtitle
    li:last-child
    a
    h7 {
    display: block;
    font-size: 13px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .subtitle
    li:first-child
    a
    span,
#programs-extras-details
    .programs-extras-show-details
    .box19
    .subtitle
    li:last-child
    a
    span {
    display: block;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#programs-extras-details .programs-extras-show-details .box19 .subtitle li a {
    top: -80px;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .subtitle
    li
    a
    img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-extras-details
    .programs-extras-show-details
    .box19:hover
    .subtitle
    li
    a {
    top: -20px;
}
#programs-extras-details
    .programs-extras-show-details
    .box19:hover
    .subtitle
    li
    a:hover {
    background: transparent;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .subtitle
    li:first-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .subtitle
    li:last-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-extras-details .programs-extras-show-details .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
}
#programs-extras-details
    .programs-extras-show-details
    .box19:hover
    .description {
    opacity: 1;
}
#programs-extras-details .programs-extras-show-details .box19 .description li {
    display: inline-block;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .description
    li
    a
    span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .description
    li:first-child,
#programs-extras-details
    .programs-extras-show-details
    .box19
    .description
    li:second-child {
    padding-left: 10px !important;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .description
    li
    a {
    top: -80px;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .description
    li
    a
    img {
    width: 20px;
    height: 20px;
    object-fit: contain;
    background-color: transparent;
    margin: -10px 0 0 -30px;
}
#programs-extras-details
    .programs-extras-show-details
    .box19:hover
    .description
    li
    a {
    top: -20px;
}
#programs-extras-details
    .programs-extras-show-details
    .box19:hover
    .description
    li
    a:hover {
    background: transparent;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .description
    li:first-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-extras-details
    .programs-extras-show-details
    .box19
    .description
    li:last-child
    a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-extras-details .programs-extras-show-details .title {
    padding: 15px;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: 0.63px;
    color: #ffffff;
}
#programs-extras-details .programs-extras-show-details .summary {
    padding: 0px 15px 38px;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: 0.49px;
    color: #878787;
}
@media only screen and (max-width: 990px) {
    #programs-extras-details .programs-extras-show-details .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #programs-extras-details .programs-extras-show-details .box19 .box-content {
        padding-top: 20%;
    }
}

#programs-clips {
    padding-top: 40px;
    background-color: #282828;
    width: 100%;
    height: auto;
}
#programs-clips .title {
    padding: 20px;
}
#programs-clips .title h6 {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-clips .title select {
    display: inline;
    width: 11% !important;
}
#programs-clips .title select option {
    color: #000000;
    background-color: transparent !important;
}
#programs-clips .title .form-control {
    background-color: transparent;
    border: 0;
    font-size: 14px !important;
    font-family: HelveticaNeue;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    color: #ffffff;
    padding: 0;
}
#programs-clips .programs-clips-show {
    padding: 0 20px;
}
#programs-clips .programs-clips-show .title {
    padding: 30px 0;
}
#programs-clips .programs-clips-show .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#programs-clips .programs-clips-show .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#programs-clips .programs-clips-show img {
    width: 200px;
}
#programs-clips .programs-clips-show ul {
    list-style: none;
    padding: 0;
}
#programs-clips .programs-clips-show li {
    display: inline-block;
}
#programs-clips .programs-clips-show .item {
    display: inline-block;
}
#programs-clips .programs-clips-show .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#programs-clips .programs-clips-show .btn-load-more:hover {
    background-color: transparent;
}
#programs-clips .programs-clips-show .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#programs-clips .programs-clips-show .all a {
    color: #ffffff;
    text-decoration: none;
}
#programs-clips .programs-clips-show .box19 {
    text-align: center;
    position: relative;
}
#programs-clips .programs-clips-show .box19 img {
    width: 100%;
    height: auto;
    border-radius: 0px;
    background-color: #282828;
}
#programs-clips .programs-clips-show .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#programs-clips .programs-clips-show .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#programs-clips .programs-clips-show .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
}
#programs-clips .programs-clips-show .box19 .icon,
#programs-clips .programs-clips-show .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#programs-clips .programs-clips-show .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#programs-clips .programs-clips-show .box19:hover .title {
    transform: scale(1);
}
#programs-clips .programs-clips-show .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -10px 0 0 0;
    opacity: 0;
}
#programs-clips .programs-clips-show .box19:hover .icon {
    opacity: 1;
}
#programs-clips .programs-clips-show .box19 .icon li {
    display: inline-block;
}
#programs-clips .programs-clips-show .box19 .icon li:first-child a,
#programs-clips .programs-clips-show .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#programs-clips .programs-clips-show .box19 .icon li a {
    top: -35px;
}
#programs-clips .programs-clips-show .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-clips .programs-clips-show .box19:hover .icon li a {
    top: -40px;
}
#programs-clips .programs-clips-show .box19:hover .icon li a:hover {
    background: transparent;
}
#programs-clips .programs-clips-show .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-clips .programs-clips-show .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-clips .programs-clips-show .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: -10px 0 10px 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 90px;
    left: 0;
}
#programs-clips .programs-clips-show .box19:hover .subtitle {
    opacity: 1;
}
#programs-clips .programs-clips-show .box19 .subtitle li {
    display: table;
}
#programs-clips .programs-clips-show .box19 .subtitle li:first-child a h7,
#programs-clips .programs-clips-show .box19 .subtitle li:last-child a h7 {
    padding-right: 10px;
    display: block;
    font-size: 16px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#programs-clips .programs-clips-show .box19 .subtitle li:first-child a span,
#programs-clips .programs-clips-show .box19 .subtitle li:last-child a span {
    display: block;
    font-size: 12px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    position: absolute;
    top: 57px;
    left: 5px;
}
#programs-clips .programs-clips-show .box19 .subtitle li a {
    top: -80px;
}
#programs-clips .programs-clips-show .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-clips .programs-clips-show .box19:hover .subtitle li a {
    top: -20px;
}
#programs-clips .programs-clips-show .box19:hover .subtitle li a:hover {
    background: transparent;
}
#programs-clips .programs-clips-show .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-clips .programs-clips-show .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-clips .programs-clips-show .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
    position: absolute;
    top: 150px;
    left: 5px;
}
#programs-clips .programs-clips-show .box19:hover .description {
    opacity: 1;
}
#programs-clips .programs-clips-show .box19 .description li {
    display: inline-block;
}
#programs-clips .programs-clips-show .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-clips .programs-clips-show .box19 .description li:first-child,
#programs-clips .programs-clips-show .box19 .description li:second-child {
    padding-left: 10px !important;
}
#programs-clips .programs-clips-show .box19 .description li a {
    top: -80px;
}
#programs-clips .programs-clips-show .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
#programs-clips .programs-clips-show .box19:hover .description li a {
    top: -20px;
}
#programs-clips .programs-clips-show .box19:hover .description li a:hover {
    background: transparent;
}
#programs-clips .programs-clips-show .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-clips .programs-clips-show .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-clips .programs-clips-show .title {
    padding: 15px;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: 0.63px;
    color: #ffffff;
}
#programs-clips .programs-clips-show .summary {
    padding: 0px 15px 38px;
    font-family: "Open Sans Light";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: 0.49px;
    color: #878787;
}
@media only screen and (max-width: 990px) {
    #programs-clips .programs-clips-show .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #programs-clips .programs-clips-show .box19 .box-content {
        padding-top: 20%;
    }
}

#programs-photo {
    padding-top: 40px;
    background-color: #282828;
    width: 100%;
    height: auto;
}
#programs-photo .title {
    padding: 20px;
}
#programs-photo .title h6 {
    display: inline;
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-photo .title select {
    display: inline;
    width: 11% !important;
}
#programs-photo .title select option {
    color: #000000;
    background-color: transparent !important;
}
#programs-photo .title .form-control {
    background-color: transparent;
    border: 0;
    font-size: 14px !important;
    font-family: HelveticaNeue;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    color: #ffffff;
    padding: 0;
}
#programs-photo .programs-photo-show {
    padding: 0 20px;
}
#programs-photo .programs-photo-show .title {
    padding: 30px 0;
}
#programs-photo .programs-photo-show .title h4 {
    color: white;
    font-family: HelveticaNeue-Light;
    font-size: 22px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
#programs-photo .programs-photo-show .container {
    width: 1170px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
}
#programs-photo .programs-photo-show img {
    width: 200px;
}
#programs-photo .programs-photo-show ul {
    list-style: none;
    padding: 0;
}
#programs-photo .programs-photo-show li {
    display: inline-block;
}
#programs-photo .programs-photo-show .item {
    display: inline-block;
}
#programs-photo .programs-photo-show .btn-load-more {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 10px;
    cursor: pointer;
}
#programs-photo .programs-photo-show .btn-load-more:hover {
    background-color: transparent;
}
#programs-photo .programs-photo-show .all {
    height: 33px;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 0px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 20px;
    margin: 0 auto;
    cursor: pointer;
}
#programs-photo .programs-photo-show .all a {
    color: #ffffff;
    text-decoration: none;
}
#programs-photo .programs-photo-show .box19 {
    padding-bottom: 30px;
    text-align: center;
    position: relative;
}
#programs-photo .programs-photo-show .box19 img {
    object-fit: cover;
    object-position: 50% 0;
    width: 316px;
    height: 178.9px;
    border-radius: 0px;
    background-color: #282828;
}
#programs-photo .programs-photo-show .box19 .live {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    background-color: #da251c;
    z-index: 1;
    padding: 0 7px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
#programs-photo .programs-photo-show .box19 .live h7 {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
#programs-photo .programs-photo-show .box19 .box-content {
    width: 100%;
    height: 87%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: -1px;
    left: 0;
    transition: all 0.3s ease 0s;
    border-radius: 3px;
    background-color: rgba(0, 0, 0, 0.7);
}
#programs-photo .programs-photo-show .box19 .icon,
#programs-photo .programs-photo-show .box19 .subtitle {
    transition: all 0.2s ease 0s;
}
#programs-photo .programs-photo-show .box19:hover .box-content {
    background: rgba(28, 28, 28, 0.5);
}
#programs-photo .programs-photo-show .box19 .title {
    font-size: 24px;
    color: #fff;
    transform: scale(0);
}
#programs-photo .programs-photo-show .box19:hover .title {
    transform: scale(1);
}
#programs-photo .programs-photo-show .box19 .icon {
    list-style: none;
    padding: 0;
    margin: -50px 0 0 0;
    opacity: 0;
}
#programs-photo .programs-photo-show .box19:hover .icon {
    opacity: 1;
}
#programs-photo .programs-photo-show .box19 .icon li {
    display: inline-block;
}
#programs-photo .programs-photo-show .box19 .icon li:first-child a,
#programs-photo .programs-photo-show .box19 .icon li:last-child a {
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    color: #fff;
    position: relative;
}
#programs-photo .programs-photo-show .box19 .icon li a {
    top: -35px;
}
#programs-photo .programs-photo-show .box19 .icon li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-photo .programs-photo-show .box19:hover .icon li a {
    top: -20px;
}
#programs-photo .programs-photo-show .box19:hover .icon li a:hover {
    background: transparent;
}
#programs-photo .programs-photo-show .box19 .icon li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-photo .programs-photo-show .box19 .icon li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-photo .programs-photo-show .box19 .subtitle {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 20px;
    opacity: 0;
    border-left: solid 2px red;
    text-align: left;
    position: absolute;
    top: 90px;
    left: 0;
    position: absolute;
    top: 90px;
    left: 0;
}
#programs-photo .programs-photo-show .box19:hover .subtitle {
    opacity: 1;
}
#programs-photo .programs-photo-show .box19 .subtitle li {
    display: inline-block;
}
#programs-photo .programs-photo-show .box19 .subtitle li:first-child a h7,
#programs-photo .programs-photo-show .box19 .subtitle li:last-child a h7 {
    display: block;
    font-size: 13px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#programs-photo .programs-photo-show .box19 .subtitle li:first-child a span,
#programs-photo .programs-photo-show .box19 .subtitle li:last-child a span {
    display: block;
    font-size: 10px;
    color: #fff;
    position: relative;
    font-family: HelveticaNeue-Light;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#programs-photo .programs-photo-show .box19 .subtitle li a {
    top: -80px;
}
#programs-photo .programs-photo-show .box19 .subtitle li a img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background-color: transparent;
}
#programs-photo .programs-photo-show .box19:hover .subtitle li a {
    top: -20px;
}
#programs-photo .programs-photo-show .box19:hover .subtitle li a:hover {
    background: transparent;
}
#programs-photo .programs-photo-show .box19 .subtitle li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-photo .programs-photo-show .box19 .subtitle li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
#programs-photo .programs-photo-show .box19 .description {
    list-style: none;
    padding: 0 0 0 5px;
    margin: 0 0 0 15px;
    opacity: 0;
    text-align: left;
}
#programs-photo .programs-photo-show .box19:hover .description {
    opacity: 1;
}
#programs-photo .programs-photo-show .box19 .description li {
    display: inline-block;
}
#programs-photo .programs-photo-show .box19 .box-content .description li.left {
    float: left;
}
#programs-photo .programs-photo-show .box19 .box-content .description li.right {
    float: right;
    padding-right: 20px;
    position: absolute;
    top: 150px;
    right: 0;
}
#programs-photo
    .programs-photo-show
    .box19
    .box-content
    .description
    li.right
    a
    img.collections {
    text-decoration: none;
    width: 20px;
    height: 20px;
}
#programs-photo .programs-photo-show .box19 .description li a span {
    padding: 0 3px;
    margin-right: 10px;
    color: #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#programs-photo .programs-photo-show .box19 .description li:first-child,
#programs-photo .programs-photo-show .box19 .description li:second-child {
    padding-left: 10px !important;
}
#programs-photo .programs-photo-show .box19 .description li a {
    top: -80px;
}
#programs-photo .programs-photo-show .box19 .description li a img {
    width: 14px;
    height: 15px;
    object-fit: contain;
    background-color: transparent;
    margin-top: -3px;
}
#programs-photo .programs-photo-show .box19:hover .description li a {
    top: -20px;
}
#programs-photo .programs-photo-show .box19:hover .description li a:hover {
    background: transparent;
}
#programs-photo .programs-photo-show .box19 .description li:first-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
}
#programs-photo .programs-photo-show .box19 .description li:last-child a {
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}
@media only screen and (max-width: 990px) {
    #programs-photo .programs-photo-show .box19 {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 360px) {
    #programs-photo .programs-photo-show .box19 .box-content {
        padding-top: 20%;
    }
}

#daily-section {
    background-image: linear-gradient(to bottom, #000000, #252525 46%, #000000);
    width: 100%;
    height: auto;
}
#daily-section #daily {
    padding-top: 100px;
}
#daily-section #daily .daily-menu-slider ul.daily-menu {
    padding: 20px 0 20px 0;
}
#daily-section #daily .daily-menu-slider ul.daily-menu li {
    padding: 0;
    text-align: center;
}
#daily-section #daily .daily-menu-slider ul.daily-menu li h2 {
    color: #ffffff;
    font-family: HelveticaNeue-light;
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#daily-section #daily .daily-menu-slider ul.daily-menu li.active {
    border-bottom: 1px solid #da251c;
    padding-bottom: 15px;
}
#daily-section #daily .daily-menu-slider ul.daily-menu li.active h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#daily-section #daily .daily-menu-slider ul.daily-menu:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 19px;
    height: 1px;
    width: 632px;
    border-bottom: 1px solid #1d1d1d;
    z-index: -1;
}
#daily-section #daily .search-daily .search {
    border-bottom: solid 1px #1d1d1d;
    width: 100%;
    height: 57px;
    padding: 10px 0;
    margin: 0 10px;
}
#daily-section #daily .search-daily .search .has-search .form-control {
    padding-left: 2.375rem;
    background-color: transparent !important;
    border: 0;
    color: #ffffff;
}
#daily-section #daily .search-daily .search ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#daily-section #daily .search-daily .search .has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #ffffff;
    font-size: 15px;
}
#daily-section #daily-news .main-news a img {
    max-width: 632px;
    max-height: 356px;
}
#daily-section #daily-news .title {
    padding: 30px 0;
}
#daily-section #daily-news .title a h2 {
    font-family: HelveticaNeue;
    font-size: 26px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.31;
    letter-spacing: normal;
    color: #ffffff;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}
#daily-section #daily-news .description {
    padding: 20px 0;
}
#daily-section #daily-news .description a h5 {
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #ffffff;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}
#daily-section #daily-news .source-news {
    padding: 10px 0;
}
#daily-section #daily-news .source-news a h6 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #808080;
}
#daily-section #daily-news .news-section {
    padding: 20px 0;
}
#daily-section #daily-news .news-section .box-part {
    padding-bottom: 30px;
}
#daily-section #daily-news .news-section .box-part .text {
    padding: 10px 0;
}
#daily-section #daily-news .news-section .box-part .text a span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: normal;
    color: #ffffff;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
#daily-section #daily-news .news-section .box-part a {
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.54;
    letter-spacing: normal;
    color: #808080;
}
#daily-section #daily-details {
    padding-bottom: 50px;
}
#daily-section #daily-details .title h1 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
}
#daily-section #daily-details .subtitle {
    padding: 15px 0;
}
#daily-section #daily-details .subtitle h6 {
    padding-bottom: 5px;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #808080;
}
#daily-section #daily-details .subtitle .col-md-5 {
    padding: 0;
}
#daily-section #daily-details .subtitle ul.social-media li img {
    position: relative;
    width: 32px;
    height: 32px;
}
#daily-section #daily-details .subtitle ul.social-media li .plus {
    background-image: url("../image/elements/love_grey.png");
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
}
#daily-section #daily-details .subtitle ul.social-media li .plusactive {
    background-image: url("../image/elements/love_pink.png");
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
}
#daily-section #daily-details .main-news img {
    max-width: 632px;
    max-height: 356px;
}
#daily-section #daily-details .main-news .description-image h6 {
    padding: 5px 0;
    padding-bottom: 20px;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #808080;
}
#daily-section #daily-details .main-news p {
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.47;
    letter-spacing: normal;
    color: #ffffff;
}
#daily-section #daily-details .main-news p.child {
    padding: 5px 0;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.29;
    letter-spacing: normal;
    color: #808080;
}
#daily-section #daily-details .main-news a.source-news {
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #06a6e3;
}
#daily-section #daily-details .sidebar .title {
    padding-top: 15px;
    padding-bottom: 10px;
}
#daily-section #daily-details .sidebar .title h4 {
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
#daily-section #daily-details .sidebar .thumb {
    padding: 5px 0;
}
#daily-section #daily-details .sidebar .thumb img {
    display: inline;
    width: 120px;
    height: 90px;
}
#daily-section #daily-details .sidebar .thumb .minititle {
    height: 70px;
}
#daily-section #daily-details .sidebar .thumb .minititle h5 {
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.33;
    letter-spacing: normal;
    color: #ffffff;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#daily-section #daily-details .sidebar .thumb .source h6 {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.67;
    letter-spacing: normal;
    color: #808080;
}
#daily-section #daily-search {
    padding-top: 100px;
    padding-bottom: 50px;
    min-height: 768px;
}
#daily-section #daily-search .search-daily .search {
    border-bottom: solid 2px #1d1d1d;
    width: 100%;
    height: 57px;
    padding: 10px 0;
    margin: 0 10px;
}
#daily-section #daily-search .search-daily .search .has-search .btn-search {
    background: transparent;
    color: #ffffff;
    position: absolute;
    z-index: 3;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    color: #ffffff;
    font-size: 15px;
    top: 5px;
    right: 0;
}
#daily-section #daily-search .search-daily .search .has-search .fa-input {
    font-family: FontAwesome, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#daily-section #daily-search .search-daily .search .has-search .form-control {
    padding-left: 2.375rem;
    padding-right: 1.75rem;
    background-color: transparent !important;
    border: 0;
    border-radius: 0;
    color: #ffffff;
}
#daily-section #daily-search .search-daily .search ::placeholder {
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#daily-section
    #daily-search
    .search-daily
    .search
    .has-search
    .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #ffffff;
    font-size: 15px;
}
#daily-section #daily-search .search-daily .search-result-title {
    padding: 20px 0;
}
#daily-section #daily-search .search-daily .search-result-title h4 {
    font-family: HelveticaNeue-light;
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #c0c0c0;
}
#daily-section
    #daily-search
    .search-daily
    .search-result-title
    h4
    span.regular {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #c0c0c0;
}
#daily-section #daily-search .search-daily .search-result-list {
    padding: 10px 0;
}
#daily-section #daily-search .search-daily .search-result-list .col-md-3 {
    max-width: 200px;
}
#daily-section #daily-search .search-daily .search-result-list .title {
    padding-top: 8px;
    height: 100px;
    max-width: 600px;
}
#daily-section #daily-search .search-daily .search-result-list .title a h5 {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.56 !important;
    letter-spacing: normal;
    color: #ffffff;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#daily-section #daily-search .search-daily .search-result-list .source-search {
    vertical-align: bottom;
}
#daily-section
    #daily-search
    .search-daily
    .search-result-list
    .source-search
    a
    h6 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: #808080;
}

#static-page {
    padding-top: 85px;
}
#static-page .col-lg-12 {
    padding-right: 25px !important;
    padding-left: 25px !important;
}
#static-page h3 {
    font-family: HelveticaNeue;
    text-align: center;
    color: #ffffff;
    padding-bottom: 40px;
}
#static-page h4.lead {
    font-family: HelveticaNeue;
    color: #ffffff;
    font-size: 18px;
    padding-bottom: 20px;
    padding-top: 10px;
}
#static-page p {
    text-indent: 1.5em;
    text-align: justify;
}

/* Large Devices, Wide Screens */
@media only screen and (max-width: 1024px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Medium Devices, Desktops */
@media only screen and (max-width: 992px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Small Devices, Tablets */
@media only screen and (max-width: 768px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Small Devices, Tablets */
@media only screen and (max-width: 640px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Extra Small Devices, Phones */
@media only screen and (max-width: 480px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 414px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Custom, Pixel Retina */
@media only screen and (max-width: 411px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 375px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 360px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 320px) {
    nav.mobile {
        display: none;
    }

    #static-page {
        padding-top: 0 !important;
    }

    section.mobile {
        display: none;
    }
}
#coming-soon {
    background: url("../image/elements/bg-coming-soon.jpg") no-repeat center;
    width: 1366;
    height: 667px;
}
#coming-soon .logo {
    padding: 80px 0;
}
#coming-soon .logo img {
    width: 451px;
    height: 155px;
}
#coming-soon .title {
    position: relative;
}
#coming-soon .title h1 {
    text-align: center;
    font-family: Helvetica 73 Bold Extended;
    font-size: 100px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 10px;
    color: #ffffff;
}
#coming-soon .title img {
    position: absolute;
    top: 80px;
    right: 62px;
}
#coming-soon .subtitle {
    padding: 20px 0;
}
#coming-soon .subtitle h3 {
    font-family: HelveticaNeue;
    font-size: 30px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 3px;
    text-align: center;
    color: #ffffff;
}

#not-found {
    background: url("../image/elements/bg-coming-soon.jpg") no-repeat center;
    width: 1366;
    height: 667px;
    padding-top: 110px;
}
#not-found .title h3 {
    text-align: center;
    font-family: HelveticaNeue;
    font-size: 30px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 3px;
    text-align: center;
    color: #ffffff;
}
#not-found .subtitle {
    position: relative;
    padding: 20px 0;
    margin: 0 auto;
    max-width: 425px;
}
#not-found .subtitle h1 {
    text-shadow: 6px 6px 0 rgba(0, 0, 0, 0.16);
    text-align: center;
    font-family: HelveticaNeue;
    font-size: 80px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1;
    letter-spacing: 8px;
    text-align: center;
    color: #ffffff;
}
#not-found .subtitle h1 span {
    color: #fa262f;
}
#not-found .subtitle h3 {
    font-family: HelveticaNeue;
    font-size: 30px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 3px;
    text-align: center;
    color: #ffffff;
}
#not-found .subtitle img {
    position: absolute;
    bottom: -15px;
    right: 10px;
}
#not-found .back-to-home {
    padding-top: 50px;
}
#not-found .back-to-home h5 a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 0.54px;
    text-align: left;
    color: #ffffff;
}
#not-found .back-to-home h5 a .fa-arrow-left {
    margin-right: 10px;
}

#error-page {
    background: url("../image/elements/bg-coming-soon.jpg") no-repeat center;
    width: 1366;
    height: 667px;
    padding-top: 110px;
}
#error-page .title h3 {
    text-align: center;
    font-family: HelveticaNeue;
    font-size: 30px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 3px;
    text-align: center;
    color: #ffffff;
}
#error-page .subtitle {
    position: relative;
    padding: 20px 0;
    margin: 0 auto;
    max-width: 425px;
}
#error-page .subtitle h1 {
    text-shadow: 6px 6px 0 rgba(0, 0, 0, 0.16);
    text-align: center;
    font-family: HelveticaNeue;
    font-size: 80px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1;
    letter-spacing: 8px;
    text-align: center;
    color: #ffffff;
}
#error-page .subtitle h1 span {
    color: #fa262f;
}
#error-page .subtitle h3 {
    font-family: HelveticaNeue;
    font-size: 30px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 3px;
    text-align: center;
    color: #ffffff;
}
#error-page .subtitle img {
    position: absolute;
    bottom: -15px;
    right: 45px;
}
#error-page .back-to-home {
    padding-top: 50px;
}
#error-page .back-to-home h5 a {
    border: 2px solid #ffffff;
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 0.54px;
    text-align: left;
    color: #ffffff;
}
#error-page .back-to-home h5 a .fa-arrow-left {
    margin-right: 10px;
}

.modal {
    background-color: #282828 !important;
}
.modal .modal-dialog {
    max-width: 720px !important;
}
.modal .modal-dialog .modal-content {
    background-color: transparent !important;
    border: 0;
}
.modal .modal-dialog .modal-content .modal-header {
    background-color: transparent !important;
    border-bottom: 0 !important;
    padding: 20px 10px !important;
}
.modal .modal-dialog .modal-content .modal-header .left-stories {
    width: 360px;
}
.modal
    .modal-dialog
    .modal-content
    .modal-header
    .left-stories
    .user-thumbnail {
    display: inline;
}
.modal
    .modal-dialog
    .modal-content
    .modal-header
    .left-stories
    .user-thumbnail
    img {
    width: 30px;
    height: 30px;
}
.modal
    .modal-dialog
    .modal-content
    .modal-header
    .left-stories
    .title-left-stories {
    display: inline;
    padding: 0;
    margin-top: 5px;
}
.modal
    .modal-dialog
    .modal-content
    .modal-header
    .left-stories
    .title-left-stories
    .title {
    font-family: HelveticaNeue-light;
    font-size: 16px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
.modal .modal-dialog .modal-content .modal-header .right-stories {
    width: 360px;
}
.modal .modal-dialog .modal-content .modal-header .right-stories .close {
    color: #ffffff !important;
    margin: -1rem -2rem -2rem auto !important;
}
.modal .modal-dialog .modal-content .modal-body {
    padding: 0 !important;
    margin-top: 20px;
    /* progress bar */
}
.modal .modal-dialog .modal-content .modal-body .slider-for-photo img {
    width: 720px;
    height: 405px;
}
.modal .modal-dialog .modal-content .modal-body .slider-for-photo .slick-track {
    margin: 0 !important;
}
.modal .modal-dialog .modal-content .modal-body .slider-for-photo .slide {
    width: 720px;
    height: 405px;
}
.modal .modal-dialog .modal-content .modal-body .slider-for-photo .slide img {
    width: 720px;
    height: 405px;
}
.modal .modal-dialog .modal-content .modal-body .slider-for-photo .slick-dots {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
    margin-bottom: -10px;
    list-style-type: none;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slider-for-photo
    .slick-dots
    li {
    margin: 0;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slider-for-photo
    .slick-dots
    button {
    display: block;
    width: 6px;
    height: 6px;
    padding: 0;
    border: none;
    border-radius: 100%;
    background-color: #d8d8d8;
    text-indent: -9999px;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slider-for-photo
    .slick-dots
    li.slick-active
    button {
    background-color: #4a90e2;
}
.modal .modal-dialog .modal-content .modal-body .slider-for-photo .slick-prev {
    z-index: 1;
    left: 25px !important;
    width: 30px;
    height: 30px;
}
.modal .modal-dialog .modal-content .modal-body .slider-for-photo .slick-next {
    z-index: 1;
    right: 25px !important;
    width: 30px;
    height: 30px;
}
.modal .modal-dialog .modal-content .modal-body .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;
}
.modal .modal-dialog .modal-content .modal-body .slider-for-stories video {
    width: 704x;
    height: 405px;
}
.modal .modal-dialog .modal-content .modal-body .slider-wrapper {
    width: 720px;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slider-wrapper
    .progressBarContainer {
    position: absolute;
    top: -25px;
    width: 100%;
    left: 14;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slider-wrapper
    .progressBarContainer
    div {
    display: inline-block;
    width: 24%;
    padding: 0;
    cursor: pointer;
    margin-right: 1%;
    float: left;
    color: white;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slider-wrapper
    .progressBarContainer
    div:last-child {
    margin-right: 0;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slider-wrapper
    .progressBarContainer
    div
    span.progressBar {
    width: 100%;
    height: 4px;
    background-color: rgba(255, 255, 255, 0.4);
    display: block;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slider-wrapper
    .progressBarContainer
    div
    span.progressBar
    .inProgress {
    background-color: #4a90e2;
    width: 0%;
    height: 4px;
}
.modal .modal-dialog .modal-content .modal-body .slider-wrapper img.fix-stamp {
    width: 720px;
    height: 405px;
}
.modal .modal-dialog .modal-content .modal-body .slider-wrapper p.left {
    position: absolute;
    top: 45%;
    left: -35px;
    font-size: 20px;
}
.modal .modal-dialog .modal-content .modal-body .slider-wrapper p.right {
    position: absolute;
    top: 45%;
    right: -35px;
    font-size: 20px;
}
.modal .modal-dialog .modal-content .modal-body .slider-for-stories {
    width: 720px;
    height: 405px;
}
.modal .modal-dialog .modal-content .modal-body .slide {
    width: 100%;
    background: #ccc;
}
.modal .modal-dialog .modal-content .modal-body #slick-1 .slick-dots li {
    width: 40px;
    height: 5px;
    background: #ccc;
}
.modal .modal-dialog .modal-content .modal-body #slick-1 .slick-dots li button {
    width: 40px;
    height: 5px;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    #slick-1
    .slick-dots
    li.slick-active,
.modal .modal-dialog .modal-content .modal-body #slick-1 .slick-dots li:hover {
    background: #777;
}
.modal .modal-dialog .modal-content .modal-body #slick-1 .slick-dots li button,
.modal
    .modal-dialog
    .modal-content
    .modal-body
    #slick-1
    .slick-dots
    li
    button:before {
    color: transparent;
    opacity: 0;
}
.modal .modal-dialog .modal-content .modal-body .slick-prev {
    left: -50px !important;
}
.modal .modal-dialog .modal-content .modal-body .slick-next {
    right: -50px;
}
.modal .modal-dialog .modal-content .modal-body .slick-dots {
    bottom: 0 !important;
    top: -30px !important;
    height: 20px !important;
}
.modal
    .modal-dialog
    .modal-content
    .modal-body
    .slick-dots
    li.slick-active
    button {
    background: #4a90e2 !important;
}
.modal .modal-dialog .modal-content .modal-body .slider-progress {
    width: 100%;
    height: 3px;
    background: #eee;
}
.modal .modal-dialog .modal-content .modal-body .slider-progress .progress {
    width: 0%;
    height: 3px;
    background: #4a90e2;
}
.modal .modal-dialog .modal-content .modal-footer {
    border-top: 0 !important;
    padding: 0 !important;
}
.modal .modal-dialog .modal-content .modal-footer .ico-footer-stories {
    text-align: center;
    padding-top: 20px;
}
.modal .modal-dialog .modal-content .modal-footer .ico-footer-stories a {
    margin-top: 30px;
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
    border: solid 1px #ffffff;
}
.modal .modal-dialog .modal-content .modal-footer .right {
    text-align: right;
}
.modal
    .modal-dialog
    .modal-content
    .modal-footer
    .right
    ul.p-details-photos
    li
    .btn-photos-details {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 8px 15px;
    margin: 10px;
    cursor: pointer;
}
.modal
    .modal-dialog
    .modal-content
    .modal-footer
    .right
    ul.p-details-photos
    li
    .btn-photos-details
    img {
    padding-right: 10px;
}
.modal
    .modal-dialog
    .modal-content
    .modal-footer
    .right
    ul.p-details-photos
    li
    .btn-extras-detail:hover {
    background-color: transparent;
}
.modal .modal-dialog .modal-content .modal-footer .left {
    margin-top: 10px;
}
.modal
    .modal-dialog
    .modal-content
    .modal-footer
    .left
    .user-thumbnail
    img.user-simple-line-icons {
    width: 40px;
    height: 40px;
}
.modal .modal-dialog .modal-content .modal-footer .left .title-postphotos {
    margin-top: -5px;
    padding-left: 10px;
    padding-right: 0;
}
.modal
    .modal-dialog
    .modal-content
    .modal-footer
    .left
    .title-postphotos
    ul
    li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
.modal
    .modal-dialog
    .modal-content
    .modal-footer
    .left
    .title-postphotos
    ul
    li.post-photos {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}

#modal-custom .modal-dialog {
    max-width: 720px !important;
}
#modal-custom .modal-dialog .modal-content {
    background-color: #ffffff !important;
    border: 0;
}
#modal-custom .modal-dialog .modal-content .modal-header {
    background-color: #ffffff !important;
    border-bottom: 0 !important;
    padding: 20px 10px !important;
}

#ModalPurchase {
    background-color: transparent !important;
    padding-top: 100px;
}
#ModalPurchase .modal-dialog {
    max-width: 350px !important;
}
#ModalPurchase .modal-dialog .modal-content {
    width: 350px;
}
#ModalPurchase .modal-dialog .modal-content .modal-body {
    text-align: center;
}
#ModalPurchase .modal-dialog .modal-content .modal-body h3 {
    padding: 30px 10px 35px 10px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: center;
    color: #ffffff;
}
#ModalPurchase .modal-dialog .modal-content .modal-body form .form-group input {
    text-align: center;
    color: #ffffff;
}
#ModalPurchase
    .modal-dialog
    .modal-content
    .modal-body
    form
    .form-group
    input::placeholder {
    text-align: center;
    color: #ffffff;
}
#ModalPurchase
    .modal-dialog
    .modal-content
    .modal-body
    form
    .form-group
    ::-webkit-input-placeholder {
    text-align: center;
    color: #ffffff;
}
#ModalPurchase
    .modal-dialog
    .modal-content
    .modal-body
    form
    .form-group
    :-moz-placeholder {
    /* Firefox 18- */
    text-align: center;
    color: #ffffff;
}
#ModalPurchase
    .modal-dialog
    .modal-content
    .modal-body
    form
    .form-group
    ::-moz-placeholder {
    /* Firefox 19+ */
    text-align: center;
    color: #ffffff;
}
#ModalPurchase
    .modal-dialog
    .modal-content
    .modal-body
    form
    .form-group
    :-ms-input-placeholder {
    text-align: center;
    color: #ffffff;
}
#ModalPurchase
    .modal-dialog
    .modal-content
    .modal-body
    form
    .form-group
    .form-control {
    background-color: transparent !important;
    width: 190px;
    margin: 0 auto;
    color: #ffffff;
}
#ModalPurchase
    .modal-dialog
    .modal-content
    .modal-body
    form
    .form-group
    .btn-yes {
    text-decoration: none;
    background-color: #fa262f !important;
    padding: 5px 50px;
    margin-top: 20px;
}
#ModalPurchase .modal-dialog .modal-content .modal-body a {
    text-decoration: none;
    color: #ffffff;
}

#ModalPurchaseSuccess {
    background-color: transparent !important;
    padding-top: 50px;
}
#ModalPurchaseSuccess .modal-dialog {
    max-width: 350px !important;
}
#ModalPurchaseSuccess .modal-dialog .modal-content {
    width: 350px;
}
#ModalPurchaseSuccess .modal-dialog .modal-content .modal-body {
    text-align: center;
}
#ModalPurchaseSuccess .modal-dialog .modal-content .modal-body h3 {
    padding: 30px 10px 35px 10px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: center;
    color: #ffffff;
}
#ModalPurchaseSuccess .modal-dialog .modal-content .modal-body a {
    text-decoration: none;
    color: #ffffff;
}
#ModalPurchaseSuccess .modal-dialog .modal-content .modal-body .btn-yes {
    text-decoration: none;
    background-color: #fa262f !important;
    padding: 10px 50px;
}

#ModalRedeem {
    background-color: transparent !important;
    padding-top: 100px;
}
#ModalRedeem .modal-dialog {
    max-width: 350px !important;
}
#ModalRedeem .modal-dialog .modal-content {
    width: 350px;
}
#ModalRedeem .modal-dialog .modal-content .modal-body {
    text-align: center;
}
#ModalRedeem .modal-dialog .modal-content .modal-body h3 {
    padding: 30px 10px 10px 10px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: center;
    color: #ffffff;
}
#ModalRedeem .modal-dialog .modal-content .modal-body p {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.67px;
    text-align: center;
    color: #8f8f8f;
}
#ModalRedeem .modal-dialog .modal-content .modal-body a {
    text-decoration: none;
    color: #ffffff;
}
#ModalRedeem .modal-dialog .modal-content .modal-body .btn-yes {
    text-decoration: none;
    background-color: #fa262f !important;
    padding: 10px 50px;
}

#ModalNotFound {
    background-color: transparent !important;
    padding-top: 100px;
}
#ModalNotFound .modal-dialog {
    max-width: 220px !important;
    background-color: #ffffff !important;
    border-radius: 7px;
}
#ModalNotFound .modal-dialog .modal-content {
    width: 220px;
    background-color: #ffffff !important;
}
#ModalNotFound .modal-dialog .modal-content .modal-body {
    text-align: center;
    background-color: #ffffff;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}
#ModalNotFound .modal-dialog .modal-content .modal-body h4 {
    padding: 30px 10px 10px 10px;
    font-family: HelveticaNeue;
    font-size: 22px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #1e1e1e;
}
#ModalNotFound .modal-dialog .modal-content .modal-body p {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #1e1e1e;
}

#ModalResend {
    background-color: transparent !important;
    padding-top: 100px;
}
#ModalResend .modal-dialog {
    max-width: 350px !important;
}
#ModalResend .modal-dialog .modal-content {
    width: 350px;
}
#ModalResend .modal-dialog .modal-content .modal-body {
    text-align: center;
}
#ModalResend .modal-dialog .modal-content .modal-body h3 {
    padding: 30px 10px 10px 10px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: center;
    color: #ffffff;
}
#ModalResend .modal-dialog .modal-content .modal-body p {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: center;
    color: #ffffff;
    padding-bottom: 10px;
}
#ModalResend .modal-dialog .modal-content .modal-body a {
    text-decoration: none;
    color: #ffffff;
}
#ModalResend .modal-dialog .modal-content .modal-body .btn-yes {
    text-decoration: none;
    background-color: #fa262f !important;
    width: 188px;
    height: 40px;
}
#ModalResend .modal-dialog .modal-content .modal-body .btn-resend {
    text-decoration: none;
    background-color: #3a3a3a !important;
    width: 188px;
    height: 40px;
    margin-bottom: 10px;
}

#user-pages {
    width: 100%;
    overflow-x: hidden;
}

#user-content .datepicker {
    background: black;
}
#user-content .side-panel {
    background-color: #212121;
    padding: 20px 0;
    min-width: 260px;
    max-width: 100%;
    max-height: 300vw;
    min-height: 768px;
    padding-top: 0px;
    width: 320px;
    display: flex;
    flex-direction: column;
}
#user-content .side-panel .closebtn {
    font-size: 36px;
    border: 0px;
    padding: 0;
    margin-left: 10px;
    margin: 25px 15px 0px 15px;
    color: white;
}
#user-content .side-panel .profile {
    padding: 10px 0px;
    text-decoration: none;
    font-size: 18px;
    color: white;
    display: block;
    transition: 0.3s;
    object-fit: contain;
}
#user-content .side-panel .profile:hover {
    color: #fff;
    text-decoration: none;
}
#user-content .side-panel .profile img {
    height: 45px !important;
}
#user-content .side-panel .profile .akun {
    display: inline-block;
}
#user-content .side-panel .profile .email {
    font-family: "Open Sans Regular";
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    color: #ffffff;
}
#user-content .side-panel .profile .display_name {
    font-family: "Open Sans Bold";
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    color: #ffffff;
}
#user-content .side-panel .profile .btn-login {
    background-color: red;
    padding: 5px 20px;
    color: white;
    border: none;
    border-radius: 4px;
    font-family: "Open Sans Bold";
    font-size: 16.8px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.67px;
    text-align: center;
    color: #ffffff;
}
#user-content .side-panel .user-profile {
    margin-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
}
#user-content
    .side-panel
    .user-profile
    .user-thumbnail
    img.user-simple-line-icons {
    width: 40px;
    height: 40px;
    margin-left: -7px;
}
#user-content .side-panel .user-profile .title-postprofile {
    margin-top: 0;
    padding-left: 20px;
    padding-right: 0;
}
#user-content .side-panel .user-profile .title-postprofile ul li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content .side-panel .user-profile .title-postprofile ul li.post-email {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content .side-panel .user-profile .dot {
    margin-top: -3px;
}
#user-content .side-panel .user-profile .dot .dropdown-toggle::after {
    content: none !important;
}
#user-content .side-panel .user-profile .dot .dropdown-menu {
    background: #2f2f2f;
}
#user-content .side-panel .user-profile .dot .dropdown-menu .dropdown-item {
    color: #ffffff;
}
#user-content
    .side-panel
    .user-profile
    .dot
    .dropdown-menu
    .dropdown-item:hover {
    color: #ffffff;
    background-color: #2f2f2f;
}
#user-content .side-panel .user-profile .rewards-member {
    padding: 20px 0;
}
#user-content .side-panel .user-profile .rewards-member h4 {
    display: inline;
    font-family: "Open Sans Light";
    font-size: 20px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#user-content .side-panel .user-profile .rewards-member span {
    padding-left: 5px;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 9px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#user-content .side-panel .user-profile .rewards-member h6 {
    font-family: HelveticaNeue;
    font-size: 8px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.32px;
    text-align: left;
    color: #ffffff;
}
#user-content .side-panel .user-profile .rewards-member .active {
    color: #c41f26;
}
#user-content .side-panel .user-profile .rewards-member .btn-voucher {
    margin-top: 5px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#user-content .side-panel .user-profile .rewards-member .active-btn {
    color: #c41f26;
    border: solid 1px #c41f26;
}
#user-content .side-panel .btn-logOut {
    height: 100%;
    /* display: flex !important; */
    justify-content: flex-end;
    flex-direction: column;
}
#user-content .side-panel .btn-logOut a {
    color: #878787;
    background-color: #212121;
    width: 100%;
    border: 0;
    font-family: "Open Sans semiBold";
    font-size: 14px;
}
#user-content .side-panel .edit-out {
    padding-bottom: 45px;
    padding-left: 20px;
    padding-right: 20px;
}
#user-content .side-panel .edit-out ul.p-edit-out-description {
    display: table;
    width: 100%;
}
#user-content .side-panel .edit-out ul.p-edit-out-description li {
    display: table-cell;
}
#user-content
    .side-panel
    .edit-out
    ul.p-edit-out-description
    li
    .btn-edit-profile {
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #ffffff;
    outline: 0;
    padding: 5px 35px;
    cursor: pointer;
}
#user-content
    .side-panel
    .edit-out
    ul.p-edit-out-description
    li
    .btn-edit-profile
    img {
    padding-right: 10px;
}
#user-content
    .side-panel
    .edit-out
    ul.p-edit-out-description
    li
    .btn-edit-profile:hover {
    background-color: transparent;
}
#user-content .side-panel .edit-out ul.p-edit-out-description li .btn-sign-out {
    background-color: #282828;
    font-size: 12px;
    font-family: HelveticaNeue-Light;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
    border-radius: 4px;
    outline: 0;
    padding: 5px 15px;
    cursor: pointer;
}
#user-content
    .side-panel
    .edit-out
    ul.p-edit-out-description
    li
    .btn-sign-out
    img {
    padding-right: 10px;
}
#user-content
    .side-panel
    .edit-out
    ul.p-edit-out-description
    li
    .btn-edit-sign-out:hover {
    background-color: transparent;
}
#user-content .side-panel .guide-entry-fta ul.entry-fta li.item {
    padding: 10px 20px;
    border-bottom: 1px solid #333333;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list {
    padding: unset;
    margin-top: 10px;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    a
    img {
    padding-right: unset;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .user-thumbnail
    img.user-simple-line-icons {
    width: 40px;
    height: 40px;
    margin-left: -7px;
    padding-right: unset;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .title-postprofile {
    margin-top: 0;
    padding-left: 20px;
    padding-right: 0;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .title-postprofile
    ul
    li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .title-postprofile
    ul
    li.post-email {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .dot {
    margin-top: -3px;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .dot
    .dropdown-toggle::after {
    content: none !important;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .dot
    .dropdown-menu {
    background: #2f2f2f;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .dot
    .dropdown-menu
    .dropdown-item {
    color: #ffffff;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .dot
    .dropdown-menu
    .dropdown-item:hover {
    color: #ffffff;
    background-color: #2f2f2f;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .rewards-member {
    padding: 15px 0;
    background-color: #212121 !important;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .rewards-member
    h4 {
    display: inline;
    font-family: "Open Sans Light";
    font-size: 20px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .rewards-member
    span {
    padding-left: 5px;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 9px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .rewards-member
    h6 {
    font-family: HelveticaNeue;
    font-size: 8px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.32px;
    text-align: left;
    color: #ffffff;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .rewards-member
    .active {
    color: #c41f26;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .rewards-member
    .btn-voucher {
    margin-top: 5px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    .user-profile-list
    .rewards-member
    .active-btn {
    color: #c41f26;
    border: solid 1px #c41f26;
}
#user-content .side-panel .guide-entry-fta ul.entry-fta li.item a {
    font-size: 13px;
    font-family: "Open Sans Regular";
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
}
#user-content .side-panel .guide-entry-fta ul.entry-fta li.item a img {
    margin-right: 20px;
    margin-bottom: 4px;
    width: 30px;
    height: 35px;
}
#user-content .side-panel .guide-entry-fta ul.entry-fta li.item a:hover {
    text-decoration: none;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.item
    a
    .svg-col-white {
    filter: invert(99%) sepia(1%) saturate(2%) hue-rotate(115deg)
        brightness(103%) contrast(100%);
    height: 16px;
}
#user-content .side-panel .guide-entry-fta ul.entry-fta li.active {
    border-right: 10px solid #d91c55;
}
#user-content .side-panel .guide-entry-fta ul.entry-fta li.active a .svg-col {
    filter: invert(21%) sepia(51%) saturate(6571%) hue-rotate(353deg)
        brightness(89%) contrast(91%);
    height: 16px;
}
#user-content
    .side-panel
    .guide-entry-fta
    ul.entry-fta
    li.active
    a
    .svg-col-etc {
    filter: invert(80%) sepia(51%) saturate(6571%) hue-rotate(353deg)
        brightness(89%) contrast(91%);
    height: 16px;
}
#user-content .side-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #292929;
    margin: 2em 0;
    padding: 0;
}
#user-content .side-panel .guide-static-fta ul.static-fta li.item {
    padding: 10px 20px;
}
#user-content .side-panel .guide-static-fta ul.static-fta li.item a {
    font-size: 13px;
    font-family: HelveticaNeue;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
}
#user-content .side-panel .guide-static-fta ul.static-fta li.item a img {
    padding-right: 20px;
    margin-bottom: 4px;
}
#user-content .side-panel .guide-static-fta ul.static-fta li.item a:hover {
    text-decoration: none;
}
#user-content
    .side-panel
    .guide-static-fta
    ul.static-fta
    li.item
    a
    .svg-col-white {
    filter: invert(99%) sepia(1%) saturate(2%) hue-rotate(115deg)
        brightness(103%) contrast(100%);
    height: 16px;
}
#user-content .side-panel .guide-static-fta ul.static-fta li.active {
    background-color: #343434;
}
#user-content .side-panel .guide-static-fta ul.static-fta li.active a .svg-col {
    filter: invert(21%) sepia(51%) saturate(6571%) hue-rotate(353deg)
        brightness(89%) contrast(91%);
    height: 16px;
}
#user-content
    .side-panel
    .guide-static-fta
    ul.static-fta
    li.active
    a
    .svg-col-etc {
    filter: invert(80%) sepia(51%) saturate(6571%) hue-rotate(353deg)
        brightness(89%) contrast(91%);
    height: 14px;
}
#user-content .side-panel-edit-profile {
    background-color: #282828;
    padding: 40px 0;
    min-width: 260px;
    max-width: 260px;
    margin-left: 145px;
    height: 100vw;
}
#user-content .side-panel-edit-profile .user-edit-profile {
    /*.picture {
        margin-top:10px;
        width:300px;
        height: 300px;
    }*/
}
#user-content .side-panel-edit-profile .user-edit-profile .title img {
    display: inline;
    width: 20px;
    margin-top: -5px;
}
#user-content .side-panel-edit-profile .user-edit-profile .title h4 {
    padding-left: 20px;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
#user-content .side-panel-edit-profile .user-edit-profile .wrapper {
    margin-top: 50px;
    width: 250px;
    height: 200px;
    background-color: #222222;
}
#user-content
    .side-panel-edit-profile
    .user-edit-profile
    .wrapper
    #image-upload-box {
    position: relative;
    width: 140px;
    height: 140px;
    background-color: #111111;
    border-radius: 50%;
    overflow: hidden;
    top: 30px;
    left: 39%;
}
#user-content
    .side-panel-edit-profile
    .user-edit-profile
    .wrapper
    #image-upload-box
    img {
    width: 100%;
    height: 140px;
    border-radius: 5px;
}
#user-content
    .side-panel-edit-profile
    .user-edit-profile
    .wrapper
    #image-upload-box-text {
    position: absolute;
    text-align: center;
    width: 140px;
    top: 30%;
}
#user-content
    .side-panel-edit-profile
    .user-edit-profile
    .wrapper
    #image-upload-box-text
    .fa-camera {
    font-size: 32px;
    padding-bottom: 5px;
}
#user-content
    .side-panel-edit-profile
    .user-edit-profile
    .wrapper
    #image-upload-box-text
    h6 {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
#user-content
    .side-panel-edit-profile
    .user-edit-profile
    .wrapper
    #change-image-button {
    margin-top: 25px;
    text-align: center;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
#user-content .main-panel {
    padding-left: 20px;
    max-width: 815px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#user-content .main-panel .red-box {
    display: none;
}
#user-content .main-panel .btn-save {
    color: white;
    font-family: "Open Sans semiBold";
    width: 45%;
    background-color: red;
    margin: auto;
}
#user-content .main-panel .btnSave {
    /*position:absolute;
    top: 400px;*/
    display: flex;
    height: 200px;
    width: 100%;
}
#user-content .main-panel .must-login {
    padding: 50px;
}
#user-content .main-panel .must-login h3 {
    font-family: "Open Sans SemiBold";
    font-size: 28px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#user-content .main-panel .must-login p {
    font-family: "Open Sans Regular";
    font-size: 21px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
    margin-bottom: 30px;
}
#user-content .main-panel .must-login .loginreg-btn {
    width: 415px;
    border-radius: 7px;
    color: white;
    background-color: #fa262f;
    font-family: "Open Sans Bold";
    font-size: 21px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.84px;
    text-align: center;
    color: #ffffff;
    padding: 15px 30px;
    border: none;
}
#user-content .main-panel .active-red-box {
    display: inline-block;
    background-color: #e74227;
    width: 786px;
    margin-left: -20px;
}
#user-content .main-panel .active-red-box .wrap p {
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #ffffff;
    padding: 15px 5px 0 5px;
}
#user-content .main-panel .active-red-box .wrap p a {
    color: #ffffff;
    text-decoration: underline;
}
#user-content .main-panel .active-red-box .wrap p a:hover {
    text-decoration: none;
}
#user-content .main-panel .termCondition h3 {
    font-family: "Open Sans semiBold";
    color: white;
    height: 100px;
    text-align: center;
    padding-top: 20px;
}
#user-content .main-panel .termCondition ol,
#user-content .main-panel .termCondition ul {
    font-family: "Open Sans SemiBold";
}
#user-content .main-panel .termCondition li {
    font-family: "Open Sans semiBold";
}
#user-content .main-panel .termCondition p {
    font-family: "Open Sans Regular";
    font-size: 13px;
    letter-spacing: 0.72px;
}
#user-content .main-panel .choose-interest .main-panel {
    padding-left: 0px;
    background: #282828;
}
#user-content .main-panel .choose-interest .genre {
    padding-top: 30px;
}
#user-content .main-panel .choose-interest .genre .btn-next {
    margin-top: 30px;
    background-color: #da251c;
    padding: 10px 43%;
    color: #ffffff;
}
#user-content .main-panel .choose-interest .genre .btn-next:hover {
    background-color: #ac1d16;
}
#user-content .main-panel .choose-interest .items-collection {
    margin: 20px 0 0 0;
}
#user-content
    .main-panel
    .choose-interest
    .items-collection
    label.btn-default.active {
    background-color: #da251c;
    border: solid 2px #da251c;
    color: #fff;
}
#user-content .main-panel .choose-interest .items-collection label.btn-default {
    width: 90%;
    border: 1px solid #000000;
    margin: 5px;
    border-radius: 17px;
    color: #305891;
}
#user-content
    .main-panel
    .choose-interest
    .items-collection
    label
    .itemcontent {
    width: 100%;
    font-family: "Open Sans SemiBold";
}
#user-content .main-panel .choose-interest .items-collection .btn-group {
    width: 90%;
}
#user-content .main-panel .choose-interest .btn-group-vertical > .btn,
#user-content .main-panel .choose-interest .btn-group > .btn {
    border: solid 1px #434343;
    width: 180px;
    height: 45px;
}
#user-content .main-panel .choose-interest h6 {
    font-family: "Open Sans SemiBold";
    margin-top: 8px;
    color: white;
}
#user-content .main-panel .choose-interest h3 {
    font-family: "Open Sans Regular";
    color: white;
    font-weight: unset;
    margin: 15px;
}
#user-content .main-panel .choose-interest p {
    font-family: "Open Sans Regular";
}
#user-content .main-panel .choose-interest input[type="checkbox"],
#user-content .main-panel .choose-interest input[type="radio"] {
    display: none;
}
#user-content .main-panel .choose-interest .btn-sign {
    background: red;
    color: white;
    width: 50%;
    font-family: "Open Sans Regular";
}
#user-content .main-panel .continous-watch {
    padding: 20px 20px 0 20px;
    max-width: 550px;
}
#user-content .main-panel .continous-watch .subtitle-continous-watch {
    padding-bottom: 20px;
}
#user-content .main-panel .continous-watch .subtitle-continous-watch h4 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content .main-panel .continous-watch .content-continous-watch {
    padding: 0 15px 0 15px;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .thumbnail-videos
    .wrap {
    position: relative;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .thumbnail-videos
    .wrap
    img {
    width: 160px;
    height: 90px;
    border-radius: 4px;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar {
    margin-top: -3px;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar
    .progress {
    max-width: 160px;
    overflow: hidden;
    height: 3px;
    background-color: #353535;
    border-radius: 0 0 4px 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar
    .progress-bar {
    width: 0;
    height: 100%;
    color: #fff;
    text-align: center;
    background-color: #da251c;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar
    .progress-striped
    .progress-bar {
    background-size: 40px 40px;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar
    .progress.active
    .progress-bar {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite;
    -moz-animation: progress-bar-stripes 2s linear infinite;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .description-videos {
    padding-left: 25px;
    max-width: 282px;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .description-videos
    .title {
    position: relative;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
    padding-bottom: 10px;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .description-videos
    .title:after {
    content: "";
    height: 20px;
    width: 2px;
    position: absolute;
    left: -10px;
    top: 0;
    background-color: #da251c;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .description-videos
    .post-title {
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
}
#user-content .main-panel .continous-watch .content-continous-watch .trash {
    display: none;
    padding-left: 20px;
}
#user-content .main-panel .continous-watch .content-continous-watch .trash a {
    color: #ffffff;
    text-decoration: none;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch
    .trash
    a
    .fa-trash-alt {
    height: 18px;
    width: 15px;
}
#user-content
    .main-panel
    .continous-watch
    .content-continous-watch:hover
    .trash {
    display: block;
}
#user-content .main-panel .history-watch {
    padding: 20px 20px 0 20px;
}
#user-content .main-panel .history-watch .subtitle-history-watch {
    padding-bottom: 20px;
}
#user-content .main-panel .history-watch .subtitle-history-watch h4 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content .main-panel .history-watch .delete-all {
    text-align: right;
    padding-left: 20px;
}
#user-content .main-panel .history-watch .delete-all a {
    color: #ffffff;
    text-decoration: none;
}
#user-content .main-panel .history-watch .delete-all a .fa-trash-alt {
    height: 18px;
    width: 15px;
    padding-right: 20px;
}
#user-content .main-panel .history-watch .content-history-watch {
    padding: 0 15px 0 15px;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .thumbnail-videos
    .wrap {
    position: relative;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .thumbnail-videos
    .wrap
    img {
    width: 160px;
    height: 90px;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar
    .progress {
    max-width: 160px;
    overflow: hidden;
    height: 3px;
    background-color: #353535;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar
    .progress-bar {
    width: 0;
    height: 100%;
    color: #fff;
    text-align: center;
    background-color: #da251c;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar
    .progress-striped
    .progress-bar {
    background-size: 40px 40px;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .thumbnail-videos
    .wrap
    .content-progress-bar
    .progress.active
    .progress-bar {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite;
    -moz-animation: progress-bar-stripes 2s linear infinite;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .description-videos {
    padding-left: 25px;
    max-width: 282px;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .description-videos
    .title {
    position: relative;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
    padding-bottom: 10px;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .description-videos
    .title:after {
    content: "";
    height: 20px;
    width: 2px;
    position: absolute;
    left: -10px;
    top: 0;
    background-color: #da251c;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .description-videos
    .post-title {
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
}
#user-content .main-panel .history-watch .content-history-watch .trash {
    display: none;
    padding-left: 20px;
}
#user-content .main-panel .history-watch .content-history-watch .trash a {
    color: #ffffff;
    text-decoration: none;
}
#user-content
    .main-panel
    .history-watch
    .content-history-watch
    .trash
    a
    .fa-trash-alt {
    height: 18px;
    width: 15px;
}
#user-content .main-panel .history-watch .content-history-watch:hover .trash {
    display: block;
}
#user-content .main-panel .watchlist-watch {
    padding: 50px 20px 0 20px;
    max-width: 870px;
}
#user-content .main-panel .watchlist-watch .subtitle-watchlist-watch {
    padding-bottom: 20px;
}
#user-content .main-panel .watchlist-watch .subtitle-watchlist-watch h4 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content .main-panel .watchlist-watch .content-watchlist-watch {
    padding: 0 15px 0 0;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .thumbnail-videos {
    padding: 0 15px 15px 0;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .thumbnail-videos
    .wrap {
    max-width: 250px;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .thumbnail-videos
    .wrap
    img {
    width: 246px;
    height: 139px;
    border-radius: 4px;
    margin-bottom: 15px;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .thumbnail-videos
    ul.title {
    list-style: none;
    padding: 0 0 0 5px;
    text-align: left;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .thumbnail-videos
    ul.title
    li {
    margin-top: -5px;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .thumbnail-videos
    ul.title
    li
    a
    h7 {
    border-left: solid 2px red;
    padding-left: 5px;
    font-family: HelveticaNeue;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    font-size: 15px;
    color: #fff;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .thumbnail-videos
    ul.title
    li
    a
    span {
    margin-top: -5px;
    font-family: HelveticaNeue-light;
    font-style: normal;
    font-variant: normal;
    font-weight: 300;
    font-size: 11px;
    color: #fff;
    padding-left: 10px;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .thumbnail-videos:first-child {
    padding-left: 0;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .description-videos {
    padding-left: 25px;
    max-width: 282px;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .description-videos
    .title {
    position: relative;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
    padding-bottom: 10px;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .description-videos
    .title:after {
    content: "";
    height: 20px;
    width: 2px;
    position: absolute;
    left: -10px;
    top: 0;
    background-color: #da251c;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .description-videos
    .post-title {
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
}
#user-content .main-panel .watchlist-watch .content-watchlist-watch .trash {
    display: none;
    padding-left: 20px;
}
#user-content .main-panel .watchlist-watch .content-watchlist-watch .trash a {
    color: #ffffff;
    text-decoration: none;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch
    .trash
    a
    .fa-trash-alt {
    height: 18px;
    width: 15px;
}
#user-content
    .main-panel
    .watchlist-watch
    .content-watchlist-watch:hover
    .trash {
    display: block;
}
#user-content .main-panel .watchlist-watch-detail {
    padding: 50px 20px 0 20px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .subtitle-watchlist-watch-detail {
    padding-bottom: 20px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .subtitle-watchlist-watch-detail
    img {
    display: inline;
    width: 20px;
    margin-top: -5px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .subtitle-watchlist-watch-detail
    h4 {
    margin-left: 20px;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content .main-panel .watchlist-watch-detail .menu-watchlist-detail {
    padding-bottom: 30px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .menu-watchlist-detail
    ul.search-title {
    padding: 5px 20px 2px 0;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .menu-watchlist-detail
    ul.search-title
    li {
    padding: 0 30px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .menu-watchlist-detail
    ul.search-title
    li
    h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .menu-watchlist-detail
    ul.search-title
    li.active {
    border-bottom: 2px solid #da251c;
    padding-bottom: 10px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .menu-watchlist-detail
    ul.search-title
    li.active
    h2 {
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .menu-watchlist-detail
    ul.search-title:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 2px;
    height: 1px;
    width: 770px;
    border-bottom: 2px solid #1d1d1d;
    z-index: -1;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail {
    padding: 0 15px 0 15px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .thumbnail-videos
    .wrap {
    position: relative;
    margin-bottom: 20px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .thumbnail-videos
    .wrap
    img {
    width: 160px;
    height: 90px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .description-videos {
    padding-left: 25px;
    max-width: 330px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .description-videos
    .title {
    position: relative;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
    padding-bottom: 10px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .description-videos
    .title:after {
    content: "";
    height: 20px;
    width: 2px;
    position: absolute;
    left: -10px;
    top: 0;
    background-color: #da251c;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .description-videos
    .post-title {
    font-family: HelveticaNeue-light;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #ffffff;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .trash {
    display: none;
    padding-left: 20px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .trash
    a {
    color: #ffffff;
    text-decoration: none;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .trash
    a
    .fa-trash-alt {
    height: 18px;
    width: 15px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .checked-check {
    padding-left: 20px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .checked-check
    a {
    color: #7ed321 !important;
    text-decoration: none;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .checked-check
    a
    .fas {
    height: 18px;
    width: 15px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .unchecked-check {
    padding-left: 20px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .unchecked-check
    a {
    color: #c41f26 !important;
    text-decoration: none;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail
    .unchecked-check
    a
    .fas {
    height: 18px;
    width: 15px;
}
#user-content
    .main-panel
    .watchlist-watch-detail
    .content-watchlist-watch-detail
    .content-watch-detail:hover
    .trash {
    display: block;
}
#user-content .main-panel .contact-us-user .title-contact-us-user {
    padding: 55px 20px 20px 20px;
    max-width: max-content;
}
#user-content .main-panel .contact-us-user .title-contact-us-user h4 {
    font-family: "Open Sans Bold";
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.3;
    letter-spacing: 0.8px;
    color: #ffffff;
}
#user-content .main-panel .contact-us-user .content-contact-us-user {
    padding: 10px 5px;
}
#user-content .main-panel .contact-us-user .content-contact-us-user .subtitle {
    padding-bottom: 20px;
}
#user-content
    .main-panel
    .contact-us-user
    .content-contact-us-user
    .subtitle
    h6 {
    font-family: "Open Sans Regular";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.3;
    letter-spacing: 0.8px;
    color: #a8a8a8;
}
#user-content
    .main-panel
    .contact-us-user
    .content-contact-us-user
    .subtitle-1 {
    padding-bottom: 0;
}
#user-content
    .main-panel
    .contact-us-user
    .content-contact-us-user
    .subtitle-1
    h6 {
    font-family: "Open Sans semiBold";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.3;
    letter-spacing: 0.8px;
    color: white;
}
#user-content
    .main-panel
    .contact-us-user
    .content-contact-us-user
    .form-group
    .form-control {
    background-color: transparent !important;
    border: 0;
    font-family: "Open Sans Regular";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: 0.5px;
    color: #a8a8a8;
    border-bottom: solid 2px #3d3d3d;
    border-radius: 0;
    padding-left: 0;
}
#user-content
    .main-panel
    .contact-us-user
    .content-contact-us-user
    .form-group
    ::placeholder {
    font-family: "Open Sans Regular";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: 0.5px;
    color: white;
}
#user-content
    .main-panel
    .contact-us-user
    .content-contact-us-user
    .message
    form
    textarea {
    width: 490px;
    background-color: transparent !important;
    border: 0;
    font-family: "Open Sans Regular";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: 0.5px;
    color: #ffffff !important;
    border-bottom: solid 2px #3d3d3d;
}
#user-content
    .main-panel
    .contact-us-user
    .content-contact-us-user
    .message
    form
    ::placeholder {
    font-family: "Open Sans Regular";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: 0.5px;
    color: #ffffff !important;
}
#user-content
    .main-panel
    .contact-us-user
    .content-contact-us-user
    .message
    form
    .btn-send-contact-us-user {
    margin-top: 20px;
    color: #ffffff;
    background-color: #da251c;
    padding: 5px 40px;
}
#user-content .main-panel .main-edit-user-profile {
    padding: 0 30px 0 30px;
    width: 100%;
}
#user-content .main-panel .main-edit-user-profile form .form-group {
    margin-bottom: 2rem;
    /* to change arrow fill color, add %23 infront of hex color */
}
#user-content .main-panel .main-edit-user-profile form .form-group label {
    margin-bottom: 0 !important;
    font-family: "Open Sans SemiBold";
    font-size: 12px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
}
#user-content .main-panel .main-edit-user-profile form .form-group select {
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 10px;
    margin: 0;
}
#user-content .main-panel .main-edit-user-profile form .form-group select.one {
    border: 0;
    border-bottom: solid 1px #3d3d3d;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='white'><polygon points='0,0 100,0 50,50'/></svg>")
        no-repeat;
    background-color: transparent;
    font-family: "Open Sans Regular";
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #ffffff;
}
#user-content
    .main-panel
    .main-edit-user-profile
    form
    .form-group
    select.one
    option {
    color: #000000;
}
#user-content .main-panel .main-edit-user-profile form .form-group select.one {
    background-size: 16px;
    background-position: calc(100% - 20px) 17px;
    background-repeat: no-repeat;
}
#user-content
    .main-panel
    .main-edit-user-profile
    form
    .form-group
    .form-control:focus {
    color: #ffffff;
    background-color: #aaaaaa;
    border-color: #80bdff;
    outline: 0;
}
#user-content
    .main-panel
    .main-edit-user-profile
    form
    .form-group
    .form-control {
    -moz-box-sizing: border-box;
    /*-webkit-appearance: none;
        -moz-appearance: none;*/
    cursor: text;
    background-color: transparent !important;
    border: 0;
    border-bottom: solid 1px #3d3d3d;
    border-radius: 0;
    font-family: "Open Sans Regular";
    font-size: 11px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #a8a8a8;
}
#user-content
    .main-panel
    .main-edit-user-profile
    form
    .form-group
    .form-control
    option {
    color: #000000;
}
#user-content
    .main-panel
    .main-edit-user-profile
    form
    .form-group
    .form-control
    option:hover {
    color: #0000;
    background-color: lightgray;
}
#user-content
    .main-panel
    .main-edit-user-profile
    form
    .form-group
    .text-danger {
    font-family: "Open Sans Regular";
    color: #e02020;
}
#user-content .main-panel .main-edit-user-profile form .form-group .text-phone {
    background: transparent;
    color: white;
    border: 0px;
    border-radius: inherit;
    border-color: transparent;
    border-bottom: solid 1px #3d3d3d;
    font-size: 11px;
}
#user-content
    .main-panel
    .main-edit-user-profile
    form
    .form-group
    ::placeholder {
    font-family: "Open Sans Regular";
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.5px;
    color: #a8a8a8;
}
#user-content
    .main-panel
    .main-edit-user-profile
    form
    .submit-edit-user-profile
    button {
    padding: 10px 40px;
    background-color: #da251c;
    font-family: "Open Sans Regular";
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
    width: 75%;
}
#user-content .main-panel #tabs {
    padding-top: 20px;
    color: #eee;
    padding: 0;
}
#user-content .main-panel #tabs .nav-tabs .nav-item.show .nav-link,
#user-content .main-panel .nav-tabs .nav-link.active {
    background-color: transparent;
    border-color: transparent transparent #1d1d1d3;
    border-bottom: 1px solid #d71c55 !important;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#user-content .main-panel #tabs .nav-tabs .nav-link {
    border: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    color: #eee;
    font-size: 15px;
    font-family: HelveticaNeue-Light;
    border-bottom: 1px solid #1d1d1d;
}
#user-content .main-panel .tab-content {
    width: 750px;
}
#user-content .main-panel .tab-content h2 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel .tab-content h1 {
    font-family: HelveticaNeue;
    font-size: 48px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.69px;
    text-align: right;
    color: #ffffff;
}
#user-content .main-panel .tab-content .point-detail h4 {
    display: inline;
    padding-top: 15px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #636363;
}
#user-content .main-panel .tab-content .selecting-box .form-group {
    margin-bottom: 0 !important;
    margin-top: -38px;
    display: inline;
    float: right;
}
#user-content
    .main-panel
    .tab-content
    .selecting-box
    .form-group
    select#reward1 {
    background-color: #282828 !important;
}
#user-content
    .main-panel
    .tab-content
    .selecting-box
    .form-group
    .form-control {
    font-size: 15px !important;
    width: 125px;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 0;
    color: #ffffff !important;
    height: calc(2rem + 0) !important;
}
#user-content .main-panel .tab-content .list {
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 10px;
}
#user-content .main-panel .tab-content .list .title {
    display: inline;
}
#user-content .main-panel .tab-content .list .title h3 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 1.34px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel .tab-content .list .points h5 {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: right;
    color: #ffffff;
}
#user-content .main-panel .tab-content .list .expired-date span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 1.01px;
    text-align: left;
    color: #636363;
}
#user-content .main-panel .tab-content .list .expired-date span .earned {
    padding-right: 5px;
    color: #02adeb;
}
#user-content .main-panel .tab-content .list .expired-date span .purchased {
    padding-right: 5px;
    color: #6fd400;
}
#user-content .main-panel .tab-content .list .expired-date span .expired {
    padding-right: 5px;
    color: #fa262f;
}
#user-content .main-panel .tab-content .list-category {
    border-radius: 7px;
    background-color: #3a3a3a;
    padding: 20px 40px;
}
#user-content .main-panel .tab-content .list-category .col-md-6 {
    padding-bottom: 30px;
}
#user-content .main-panel .tab-content .list-category .reward-data-detail {
    position: relative;
}
#user-content .main-panel .tab-content .list-category .reward-data-detail img {
    border-radius: 7px;
    width: 305px;
    height: 305px;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .gradient-in {
    position: absolute;
    top: 0;
    border-radius: 7px;
    width: 305px;
    height: 305px;
    opacity: 0.8;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), #000000);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0), #000000);
    background-image: linear-gradient(rgba(0, 0, 0, 0), #000000);
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .gradient-out {
    position: absolute;
    z-index: 1;
    top: 0;
    border-radius: 7px;
    width: 305px;
    height: 305px;
    box-shadow: 0 6px 6px 0 rgba(32, 32, 32, 0.3);
    background-color: rgba(32, 32, 32, 0.8);
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    img {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 13%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h3 {
    position: absolute;
    padding: 10px;
    top: 28%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h3
    a {
    text-decoration: none;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h4 {
    position: absolute;
    padding: 10px;
    top: 40%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 36px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.02px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h4
    a {
    text-decoration: none;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h5 {
    position: absolute;
    padding: 10px;
    top: 54%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 155px;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h5
    a {
    text-decoration: none;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h6 {
    position: absolute;
    padding: 10px;
    top: 64%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h6
    a {
    text-decoration: none;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    p {
    position: absolute;
    padding: 10px;
    top: 88%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 130px;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    p
    a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span {
    position: absolute;
    padding: 10px;
    top: 77%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 100px;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-redeem {
    padding: 5px 15px;
    border-radius: 4px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-expired {
    padding: 5px 15px;
    border-radius: 4px;
    background: #fa262f;
    border: solid 1px #fa262f;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .main-panel
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-redeemed {
    padding: 5px 15px;
    border-radius: 4px;
    background: #6fd400;
    border: solid 1px #6fd400;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#user-content .main-panel .content-catalog {
    width: 750px;
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 30px;
    margin-top: 20px;
}
#user-content .main-panel .content-catalog h2 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel .content-catalog h5 {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 0.48px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel .content-catalog h5 a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .main-panel .content-catalog h1 {
    font-family: HelveticaNeue;
    font-size: 48px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.69px;
    text-align: right;
    color: #ffffff;
}
#user-content .main-panel .content-catalog .point-detail h4 {
    display: inline;
    padding-top: 15px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #636363;
}
#user-content .main-panel .content-catalog .selecting-box .form-group {
    margin-bottom: 0 !important;
    margin-top: -38px;
    display: inline;
    float: right;
}
#user-content
    .main-panel
    .content-catalog
    .selecting-box
    .form-group
    select#reward1 {
    background-color: #282828 !important;
}
#user-content
    .main-panel
    .content-catalog
    .selecting-box
    .form-group
    .form-control {
    font-size: 15px !important;
    width: 125px;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 0;
    color: #ffffff !important;
    height: calc(2rem + 0) !important;
}
#user-content .main-panel .content-catalog .list {
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 10px;
}
#user-content .main-panel .content-catalog .list .title {
    display: inline;
}
#user-content .main-panel .content-catalog .list .title h3 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 1.34px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel .content-catalog .list .points h5 {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: right;
    color: #ffffff;
}
#user-content .main-panel .content-catalog .list .expired-date span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 1.01px;
    text-align: left;
    color: #636363;
}
#user-content .main-panel .content-catalog .list .expired-date span .earned {
    padding-right: 5px;
    color: #02adeb;
}
#user-content .main-panel .content-catalog .list .expired-date span .purchased {
    padding-right: 5px;
    color: #6fd400;
}
#user-content .main-panel .content-catalog .list .expired-date span .expired {
    padding-right: 5px;
    color: #fa262f;
}
#user-content .main-panel .reward-detail .top-reward-banner {
    margin-top: 60px;
    padding-bottom: 20px;
}
#user-content .main-panel .reward-detail .top-reward-banner img {
    width: 750px;
    height: 100%;
    border-radius: 7px;
}
#user-content .main-panel .reward-detail .top-reward-choice .form-group label {
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.45px;
    text-align: left;
    color: #8f8f8f;
}
#user-content
    .main-panel
    .reward-detail
    .top-reward-choice
    .form-group
    select#nom {
    background-color: #282828 !important;
}
#user-content
    .main-panel
    .reward-detail
    .top-reward-choice
    .form-group
    .form-control {
    background-color: transparent !important;
    font-family: HelveticaNeue;
    font-size: 15px;
    color: #ffffff;
    border: 1px solid #8f8f8f;
}
#user-content .main-panel .reward-detail .top-reward-description .title h2 {
    padding-bottom: 5px;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 0.54px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel .reward-detail .top-reward-description p {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: normal;
    font-style: bold;
    font-stretch: normal;
    line-height: 1.4;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel .reward-detail .top-reward-description p a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .main-panel .reward-detail .top-reward-description p span {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.83;
    letter-spacing: 0.36px;
    text-align: left;
    color: #8f8f8f;
}
#user-content .main-panel .reward-detail .top-reward-description p img {
    padding-right: 5px;
}
#user-content .main-panel .reward-detail .below-purchase {
    text-align: right;
}
#user-content .main-panel .reward-detail .below-purchase a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: 0.45px;
    text-align: center;
}
#user-content .main-panel .reward-detail .below-purchase .btn-purchase {
    background-color: #fa262f !important;
    padding: 10px 50px;
}
#user-content .main-panel .reward-detail .below-purchase .after-redeem {
    opacity: 0.5;
    pointer-events: none;
    cursor: default;
}
#user-content .main-panel .reward-man {
    margin: 30px 0 !important;
}
#user-content .main-panel .reward-man #reward-category .reward-category-slider {
    margin: 40px 0;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    .slick-prev {
    position: absolute;
    left: -15px;
    top: 38px;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    .slick-next {
    position: absolute;
    right: -15px;
    top: 38px;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li {
    padding: 5px;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    img {
    margin: 0 auto;
    border-radius: 50%;
    background-color: #3a3a3a;
    margin-bottom: 5px;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title {
    text-align: center;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title
    h5 {
    font-family: HelveticaNeue;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active {
    padding: 5px;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    img {
    margin: 0 auto;
    border-radius: 50%;
    background-color: #02adeb;
    margin-bottom: 5px;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title {
    text-align: center;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title
    h5 {
    font-family: HelveticaNeue;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .main-panel
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#user-content .main-panel #reward-special .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel #reward-special ul .slick-prev {
    height: 18px;
    width: 10px;
    position: absolute;
    left: -15px;
    top: 36%;
}
#user-content .main-panel #reward-special ul .slick-next {
    height: 18px;
    width: 10px;
    position: absolute;
    right: -15px;
    top: 36%;
}
#user-content .main-panel #reward-special ul li .reward-data {
    max-width: 220px;
    padding: 10px 0;
    margin: 0 auto;
}
#user-content .main-panel #reward-special ul li .reward-data a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .main-panel #reward-special ul li .reward-data img {
    width: 220px;
    height: 220px;
    border-radius: 7px;
}
#user-content .main-panel #reward-special ul li .reward-data .title-less {
    padding: 5px;
}
#user-content .main-panel #reward-special ul li .reward-data .title-less h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 0.9px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel #reward-special ul li .reward-data .title-less p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
    padding-top: 10px;
}
#user-content .main-panel #reward-category .row {
    padding: 0 30px;
}
#user-content .main-panel #reward-category .col-md-4 {
    padding: 0;
}
#user-content .main-panel #reward-category .title {
    padding: 0 0 10px 10px;
}
#user-content .main-panel #reward-category .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel #reward-category .reward-data {
    margin: 0 auto;
    max-width: 220px;
    padding: 10px 0;
}
#user-content .main-panel #reward-category .reward-data a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .main-panel #reward-category .reward-data img {
    width: 220px;
    height: 220px;
    border-radius: 7px;
}
#user-content .main-panel #reward-category .reward-data .title-less {
    padding: 5px;
}
#user-content .main-panel #reward-category .reward-data .title-less h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 0.9px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel #reward-category .reward-data .title-less p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
    padding-top: 10px;
}
#user-content .main-panel #reward-category .see-all {
    text-align: center;
    padding-bottom: 20px;
}
#user-content .main-panel #reward-category .see-all a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .main-panel #reward-category .see-all .btn-see-all {
    margin: 10px 15px;
    background-color: #515151;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 0.53px;
    text-align: center;
    color: #ffffff;
}
#user-content .main-panel #reward-category-detail {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    background-color: #3a3a3a;
    padding: 20px;
}
#user-content .main-panel #reward-category-detail .col-md-6 {
    padding-bottom: 30px;
}
#user-content .main-panel #reward-category-detail .title {
    padding-bottom: 20px;
}
#user-content .main-panel #reward-category-detail .title h4 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.21;
    letter-spacing: 0.56px;
    text-align: left;
    color: #979797;
}
#user-content .main-panel #reward-category-detail .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#user-content .main-panel #reward-category-detail .reward-data-detail {
    position: relative;
}
#user-content .main-panel #reward-category-detail .reward-data-detail img {
    border-radius: 7px;
    width: 335px;
    height: 335px;
}
#user-content
    .main-panel
    #reward-category-detail
    .reward-data-detail
    .gradient {
    position: absolute;
    top: 0;
    border-radius: 7px;
    width: 335px;
    height: 335px;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);
}
#user-content
    .main-panel
    #reward-category-detail
    .reward-data-detail
    .title-less
    h4 {
    position: absolute;
    padding: 10px;
    bottom: 60px;
}
#user-content
    .main-panel
    #reward-category-detail
    .reward-data-detail
    .title-less
    h4
    a {
    text-decoration: none;
    color: #ffffff;
}
#user-content
    .main-panel
    #reward-category-detail
    .reward-data-detail
    .title-less
    p {
    position: absolute;
    padding: 10px;
    bottom: -15px;
}
#user-content
    .main-panel
    #reward-category-detail
    .reward-data-detail
    .title-less
    p
    a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
}
#user-content
    .main-panel
    #reward-category-detail
    .reward-data-detail
    .title-less
    span {
    position: absolute;
    padding: 10px;
    bottom: 6px;
    right: 15px;
}
#user-content
    .main-panel
    #reward-category-detail
    .reward-data-detail
    .title-less
    span
    a {
    padding: 5px 10px;
    border-radius: 4px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#user-content .main-panel #reward-category-detail .see-all {
    text-align: center;
    padding-bottom: 20px;
}
#user-content .main-panel #reward-category-detail .see-all a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .main-panel #reward-category-detail .see-all .btn-see-all {
    margin: 10px 15px;
    background-color: #515151;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 0.53px;
    text-align: center;
    color: #ffffff;
}
#user-content side-panel-universal {
    padding: 10px !important;
    background-color: #2f2f2f;
}
#user-content side-panel-universal .user-profile {
    margin-top: 60px;
    padding-bottom: 30px;
    width: 100%;
}
#user-content
    side-panel-universal
    .user-profile
    .user-thumbnail
    img.user-simple-line-icons {
    width: 40px;
    height: 40px;
}
#user-content side-panel-universal .user-profile .title-postprofile {
    margin-top: 10px;
    padding-left: 35px;
    padding-right: 0;
}
#user-content
    side-panel-universal
    .user-profile
    .title-postprofile
    ul
    li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#user-content side-panel-universal .user-profile .dot {
    margin-top: -3px;
}
#user-content side-panel-universal .user-profile .dot .dropdown-toggle::after {
    content: none !important;
}
#user-content side-panel-universal .user-profile .dot .dropdown-menu {
    background: #2f2f2f;
}
#user-content
    side-panel-universal
    .user-profile
    .dot
    .dropdown-menu
    .dropdown-item {
    color: #ffffff;
}
#user-content
    side-panel-universal
    .user-profile
    .dot
    .dropdown-menu
    .dropdown-item:hover {
    color: #ffffff;
    background-color: #2f2f2f;
}
#user-content side-panel-universal .user-profile .rewards-member {
    padding: 20px 0;
}
#user-content side-panel-universal .user-profile .rewards-member h4 {
    display: inline;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#user-content side-panel-universal .user-profile .rewards-member span {
    padding-left: 5px;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 9px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#user-content side-panel-universal .user-profile .rewards-member h6 {
    font-family: HelveticaNeue;
    font-size: 8px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.32px;
    text-align: left;
    color: #ffffff;
}
#user-content side-panel-universal .user-profile .rewards-member .btn-voucher {
    margin-top: 5px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#user-content
    side-panel-universal
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item {
    padding: 10px 20px;
}
#user-content
    side-panel-universal
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item
    a {
    font-size: 13px;
    font-family: HelveticaNeue;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
}
#user-content
    side-panel-universal
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item
    a
    img {
    margin-right: 20px;
    margin-bottom: 4px;
    width: 30px;
    height: 35px;
}
#user-content
    side-panel-universal
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item
    a:hover {
    text-decoration: none;
}
#user-content
    side-panel-universal
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.active {
    background-color: #343434;
}
#user-content #tabs {
    padding-top: 20px;
    color: #eee;
    padding: 0;
}
#user-content #tabs .nav-tabs .nav-item.show .nav-link,
#user-content .nav-tabs .nav-link.active {
    background-color: transparent;
    border-color: transparent transparent #1d1d1d3;
    border-bottom: 1px solid #d71c55 !important;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#user-content #tabs .nav-tabs .nav-link {
    border: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    color: #eee;
    font-size: 15px;
    font-family: HelveticaNeue-Light;
    border-bottom: 1px solid #1d1d1d;
}
#user-content .tab-content {
    width: 750px;
}
#user-content .tab-content h2 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: left;
    color: #ffffff;
}
#user-content .tab-content h1 {
    font-family: HelveticaNeue;
    font-size: 48px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.69px;
    text-align: right;
    color: #ffffff;
}
#user-content .tab-content .point-detail h4 {
    display: inline;
    padding-top: 15px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #636363;
}
#user-content .tab-content .selecting-box .form-group {
    margin-bottom: 0 !important;
    margin-top: -38px;
    display: inline;
    float: right;
}
#user-content .tab-content .selecting-box .form-group select#reward1 {
    background-color: #282828 !important;
}
#user-content .tab-content .selecting-box .form-group .form-control {
    font-size: 15px !important;
    width: 125px;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 0;
    color: #ffffff !important;
    height: calc(2rem + 0) !important;
}
#user-content .tab-content .list {
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 10px;
}
#user-content .tab-content .list .title {
    display: inline;
}
#user-content .tab-content .list .title h3 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 1.34px;
    text-align: left;
    color: #ffffff;
}
#user-content .tab-content .list .points h5 {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: right;
    color: #ffffff;
}
#user-content .tab-content .list .expired-date span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 1.01px;
    text-align: left;
    color: #636363;
}
#user-content .tab-content .list .expired-date span .earned {
    padding-right: 5px;
    color: #02adeb;
}
#user-content .tab-content .list .expired-date span .purchased {
    padding-right: 5px;
    color: #6fd400;
}
#user-content .tab-content .list .expired-date span .expired {
    padding-right: 5px;
    color: #fa262f;
}
#user-content .tab-content .list-category {
    border-radius: 7px;
    background-color: #3a3a3a;
    padding: 20px 40px;
}
#user-content .tab-content .list-category .col-md-6 {
    padding-bottom: 30px;
}
#user-content .tab-content .list-category .reward-data-detail {
    position: relative;
}
#user-content .tab-content .list-category .reward-data-detail img {
    border-radius: 7px;
    width: 305px;
    height: 305px;
}
#user-content .tab-content .list-category .reward-data-detail .gradient-in {
    position: absolute;
    top: 0;
    border-radius: 7px;
    width: 305px;
    height: 305px;
    opacity: 0.8;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), #000000);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0), #000000);
    background-image: linear-gradient(rgba(0, 0, 0, 0), #000000);
}
#user-content .tab-content .list-category .reward-data-detail .gradient-out {
    position: absolute;
    z-index: 1;
    top: 0;
    border-radius: 7px;
    width: 305px;
    height: 305px;
    box-shadow: 0 6px 6px 0 rgba(32, 32, 32, 0.3);
    background-color: rgba(32, 32, 32, 0.8);
}
#user-content .tab-content .list-category .reward-data-detail .title-less img {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 13%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
#user-content .tab-content .list-category .reward-data-detail .title-less h3 {
    position: absolute;
    padding: 10px;
    top: 28%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: center;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less h3 a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less h4 {
    position: absolute;
    padding: 10px;
    top: 40%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 36px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.02px;
    text-align: center;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less h4 a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less h5 {
    position: absolute;
    padding: 10px;
    top: 54%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 155px;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: center;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less h5 a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less h6 {
    position: absolute;
    padding: 10px;
    top: 64%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: center;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less h6 a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less p {
    position: absolute;
    padding: 10px;
    top: 88%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 130px;
}
#user-content .tab-content .list-category .reward-data-detail .title-less p a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
}
#user-content .tab-content .list-category .reward-data-detail .title-less span {
    position: absolute;
    padding: 10px;
    top: 77%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 100px;
}
#user-content
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-redeem {
    padding: 5px 15px;
    border-radius: 4px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-expired {
    padding: 5px 15px;
    border-radius: 4px;
    background: #fa262f;
    border: solid 1px #fa262f;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-redeemed {
    padding: 5px 15px;
    border-radius: 4px;
    background: #6fd400;
    border: solid 1px #6fd400;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#user-content .content-catalog {
    width: 750px;
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 30px;
    margin-top: 20px;
}
#user-content .content-catalog h2 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: left;
    color: #ffffff;
}
#user-content .content-catalog h5 {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 0.48px;
    text-align: left;
    color: #ffffff;
}
#user-content .content-catalog h5 a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .content-catalog h1 {
    font-family: HelveticaNeue;
    font-size: 48px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.69px;
    text-align: right;
    color: #ffffff;
}
#user-content .content-catalog .point-detail h4 {
    display: inline;
    padding-top: 15px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #636363;
}
#user-content .content-catalog .selecting-box .form-group {
    margin-bottom: 0 !important;
    margin-top: -38px;
    display: inline;
    float: right;
}
#user-content .content-catalog .selecting-box .form-group select#reward1 {
    background-color: #282828 !important;
}
#user-content .content-catalog .selecting-box .form-group .form-control {
    font-size: 15px !important;
    width: 125px;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 0;
    color: #ffffff !important;
    height: calc(2rem + 0) !important;
}
#user-content .content-catalog .list {
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 10px;
}
#user-content .content-catalog .list .title {
    display: inline;
}
#user-content .content-catalog .list .title h3 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 1.34px;
    text-align: left;
    color: #ffffff;
}
#user-content .content-catalog .list .points h5 {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: right;
    color: #ffffff;
}
#user-content .content-catalog .list .expired-date span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 1.01px;
    text-align: left;
    color: #636363;
}
#user-content .content-catalog .list .expired-date span .earned {
    padding-right: 5px;
    color: #02adeb;
}
#user-content .content-catalog .list .expired-date span .purchased {
    padding-right: 5px;
    color: #6fd400;
}
#user-content .content-catalog .list .expired-date span .expired {
    padding-right: 5px;
    color: #fa262f;
}
#user-content .reward-detail .top-reward-banner {
    margin-top: 60px;
    padding-bottom: 20px;
}
#user-content .reward-detail .top-reward-banner img {
    width: 750px;
    height: 100%;
    border-radius: 7px;
}
#user-content .reward-detail .top-reward-choice .form-group label {
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.45px;
    text-align: left;
    color: #8f8f8f;
}
#user-content .reward-detail .top-reward-choice .form-group select#nom {
    background-color: #282828 !important;
}
#user-content .reward-detail .top-reward-choice .form-group .form-control {
    background-color: transparent !important;
    font-family: HelveticaNeue;
    font-size: 15px;
    color: #8f8f8f;
    border: 1px solid #8f8f8f;
}
#user-content .reward-detail .top-reward-description .title h2 {
    padding-bottom: 5px;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 0.54px;
    text-align: left;
    color: #ffffff;
}
#user-content .reward-detail .top-reward-description p {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: normal;
    font-style: bold;
    font-stretch: normal;
    line-height: 1.4;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#user-content .reward-detail .top-reward-description p a {
    text-decoration: none;
    color: #ffffff;
}
#user-content .reward-detail .top-reward-description p span {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.83;
    letter-spacing: 0.36px;
    text-align: left;
    color: #8f8f8f;
}
#user-content .reward-detail .top-reward-description p img {
    padding-right: 5px;
}
#user-content .reward-detail .below-purchase {
    text-align: right;
}
#user-content .reward-detail .below-purchase a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: 0.45px;
    text-align: center;
}
#user-content .reward-detail .below-purchase .btn-purchase {
    background-color: #fa262f !important;
    padding: 10px 50px;
}
#user-content .reward-detail .below-purchase .after-redeem {
    opacity: 0.5;
    pointer-events: none;
    cursor: default;
}
#user-content .reward-man {
    margin: 30px 0 !important;
}
#user-content .reward-man #reward-category .reward-category-slider {
    margin: 40px 0;
}
#user-content .reward-man #reward-category .reward-category-slider .slick-prev {
    position: absolute;
    left: -15px;
    top: 38px;
}
#user-content .reward-man #reward-category .reward-category-slider .slick-next {
    position: absolute;
    right: -15px;
    top: 38px;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li {
    padding: 5px;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    img {
    margin: 0 auto;
    border-radius: 50%;
    background-color: #3a3a3a;
    margin-bottom: 5px;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title {
    text-align: center;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title
    h5 {
    font-family: HelveticaNeue;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active {
    padding: 5px;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    img {
    margin: 0 auto;
    border-radius: 50%;
    background-color: #02adeb;
    margin-bottom: 5px;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title {
    text-align: center;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title
    h5 {
    font-family: HelveticaNeue;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#user-content
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#user-content #reward-special .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#user-content #reward-special ul .slick-prev {
    height: 18px;
    width: 10px;
    position: absolute;
    left: -15px;
    top: 36%;
}
#user-content #reward-special ul .slick-next {
    height: 18px;
    width: 10px;
    position: absolute;
    right: -15px;
    top: 36%;
}
#user-content #reward-special ul li .reward-data {
    max-width: 220px;
    padding: 10px;
    margin: 0 auto;
}
#user-content #reward-special ul li .reward-data a {
    text-decoration: none;
    color: #ffffff;
}
#user-content #reward-special ul li .reward-data img {
    width: 220px;
    height: 220px;
    border-radius: 7px;
}
#user-content #reward-special ul li .reward-data .title-less {
    padding: 5px;
}
#user-content #reward-special ul li .reward-data .title-less h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 0.9px;
    text-align: left;
    color: #ffffff;
}
#user-content #reward-special ul li .reward-data .title-less p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
    padding-top: 10px;
}
#user-content #reward-category .row {
    padding: 0 30px;
}
#user-content #reward-category .col-md-4 {
    padding: 0;
}
#user-content #reward-category .title {
    padding: 0 0 10px 10px;
}
#user-content #reward-category .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#user-content #reward-category .reward-data {
    margin: 0 auto;
    max-width: 220px;
    padding: 10px;
}
#user-content #reward-category .reward-data a {
    text-decoration: none;
    color: #ffffff;
}
#user-content #reward-category .reward-data img {
    width: 220px;
    height: 220px;
    border-radius: 7px;
}
#user-content #reward-category .reward-data .title-less {
    padding: 5px;
}
#user-content #reward-category .reward-data .title-less h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 0.9px;
    text-align: left;
    color: #ffffff;
}
#user-content #reward-category .reward-data .title-less p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
    padding-top: 10px;
}
#user-content #reward-category .see-all {
    text-align: center;
    padding-bottom: 20px;
}
#user-content #reward-category .see-all a {
    text-decoration: none;
    color: #ffffff;
}
#user-content #reward-category .see-all .btn-see-all {
    margin: 10px 15px;
    background-color: #515151;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 0.53px;
    text-align: center;
    color: #ffffff;
}
#user-content #reward-category-detail {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    background-color: #3a3a3a;
    padding: 20px;
}
#user-content #reward-category-detail .col-md-6 {
    padding-bottom: 30px;
}
#user-content #reward-category-detail .title {
    padding-bottom: 20px;
}
#user-content #reward-category-detail .title h4 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.21;
    letter-spacing: 0.56px;
    text-align: left;
    color: #979797;
}
#user-content #reward-category-detail .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#user-content #reward-category-detail .reward-data-detail {
    position: relative;
}
#user-content #reward-category-detail .reward-data-detail img {
    border-radius: 7px;
    width: 335px;
    height: 335px;
}
#user-content #reward-category-detail .reward-data-detail .gradient {
    position: absolute;
    top: 0;
    border-radius: 7px;
    width: 325px;
    height: 335px;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);
}
#user-content #reward-category-detail .reward-data-detail .title-less h4 {
    position: absolute;
    padding: 10px;
    bottom: 40px;
}
#user-content #reward-category-detail .reward-data-detail .title-less h4 a {
    text-decoration: none;
    color: #ffffff;
}
#user-content #reward-category-detail .reward-data-detail .title-less p {
    position: absolute;
    padding: 10px;
    bottom: -15px;
}
#user-content #reward-category-detail .reward-data-detail .title-less p a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
}
#user-content #reward-category-detail .reward-data-detail .title-less span {
    position: absolute;
    padding: 10px;
    bottom: 6px;
    right: 0;
}
#user-content #reward-category-detail .reward-data-detail .title-less span a {
    padding: 5px 10px;
    border-radius: 4px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#user-content #reward-category-detail .see-all {
    text-align: center;
    padding-bottom: 20px;
}
#user-content #reward-category-detail .see-all a {
    text-decoration: none;
    color: #ffffff;
}
#user-content #reward-category-detail .see-all .btn-see-all {
    margin: 10px 15px;
    background-color: #515151;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 0.53px;
    text-align: center;
    color: #ffffff;
}

#rewards {
    min-height: 768px;
}
#rewards .side-panel {
    padding: 10px !important;
    background-color: #2f2f2f;
    min-width: 260px;
    max-width: 260px;
    max-height: 300vw;
}
#rewards .side-panel .user-profile {
    margin-top: 60px;
    padding-bottom: 30px;
}
#rewards .side-panel .user-profile .user-thumbnail img.user-simple-line-icons {
    width: 40px;
    height: 40px;
}
#rewards .side-panel .user-profile .title-postprofile {
    margin-top: 0;
    padding-left: 20px;
    padding-right: 0;
}
#rewards .side-panel .user-profile .title-postprofile ul li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#rewards .side-panel .user-profile .title-postprofile ul li.post-email {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#rewards .side-panel .user-profile .dot {
    margin-top: -3px;
}
#rewards .side-panel .user-profile .dot .dropdown-toggle::after {
    content: none !important;
}
#rewards .side-panel .user-profile .dot .dropdown-menu {
    background: #2f2f2f;
}
#rewards .side-panel .user-profile .dot .dropdown-menu .dropdown-item {
    color: #ffffff;
}
#rewards .side-panel .user-profile .dot .dropdown-menu .dropdown-item:hover {
    color: #ffffff;
    background-color: #2f2f2f;
}
#rewards .side-panel .user-profile .rewards-member {
    padding: 20px 0;
}
#rewards .side-panel .user-profile .rewards-member h4 {
    display: inline;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#rewards .side-panel .user-profile .rewards-member span {
    padding-left: 5px;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 9px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#rewards .side-panel .user-profile .rewards-member h6 {
    font-family: HelveticaNeue;
    font-size: 8px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.32px;
    text-align: left;
    color: #ffffff;
}
#rewards .side-panel .user-profile .rewards-member .btn-voucher {
    margin-top: 5px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#rewards .side-panel .user-profile .guide-entry-fta ul.entry-fta li.item {
    padding: 10px 20px;
}
#rewards .side-panel .user-profile .guide-entry-fta ul.entry-fta li.item a {
    font-size: 13px;
    font-family: HelveticaNeue;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
}
#rewards .side-panel .user-profile .guide-entry-fta ul.entry-fta li.item a img {
    margin-right: 20px;
    margin-bottom: 4px;
    width: 30px;
    height: 35px;
}
#rewards
    .side-panel
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item
    a:hover {
    text-decoration: none;
}
#rewards .side-panel .user-profile .guide-entry-fta ul.entry-fta li.active {
    background-color: #343434;
}
#rewards #tabs {
    padding-top: 20px;
    color: #eee;
    padding: 0;
}
#rewards #tabs .nav-tabs .nav-item.show .nav-link,
#rewards .nav-tabs .nav-link.active {
    background-color: transparent;
    border-color: transparent transparent #1d1d1d3;
    border-bottom: 1px solid #d71c55 !important;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#rewards #tabs .nav-tabs .nav-link {
    border: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    color: #eee;
    font-size: 15px;
    font-family: HelveticaNeue-Light;
    border-bottom: 1px solid #1d1d1d;
}
#rewards .tab-content {
    width: 750px;
}
#rewards .tab-content h2 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: left;
    color: #ffffff;
}
#rewards .tab-content h1 {
    font-family: HelveticaNeue;
    font-size: 48px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.69px;
    text-align: right;
    color: #ffffff;
}
#rewards .tab-content .point-detail h4 {
    display: inline;
    padding-top: 15px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #636363;
}
#rewards .tab-content .selecting-box .form-group {
    margin-bottom: 0 !important;
    margin-top: -38px;
    display: inline;
    float: right;
}
#rewards .tab-content .selecting-box .form-group select#reward1 {
    background-color: #282828 !important;
}
#rewards .tab-content .selecting-box .form-group .form-control {
    font-size: 15px !important;
    width: 125px;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 0;
    color: #ffffff !important;
    height: calc(2rem + 0) !important;
}
#rewards .tab-content .list {
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 10px;
}
#rewards .tab-content .list .title {
    display: inline;
}
#rewards .tab-content .list .title h3 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 1.34px;
    text-align: left;
    color: #ffffff;
}
#rewards .tab-content .list .points h5 {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: right;
    color: #ffffff;
}
#rewards .tab-content .list .expired-date span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 1.01px;
    text-align: left;
    color: #636363;
}
#rewards .tab-content .list .expired-date span .earned {
    padding-right: 5px;
    color: #02adeb;
}
#rewards .tab-content .list .expired-date span .purchased {
    padding-right: 5px;
    color: #6fd400;
}
#rewards .tab-content .list .expired-date span .expired {
    padding-right: 5px;
    color: #fa262f;
}
#rewards .tab-content .list-category {
    border-radius: 7px;
    background-color: #3a3a3a;
    padding: 20px 40px;
}
#rewards .tab-content .list-category .col-md-6 {
    padding-bottom: 30px;
}
#rewards .tab-content .list-category .reward-data-detail {
    position: relative;
}
#rewards .tab-content .list-category .reward-data-detail img {
    border-radius: 7px;
    width: 305px;
    height: 305px;
}
#rewards .tab-content .list-category .reward-data-detail .gradient-in {
    position: absolute;
    top: 0;
    border-radius: 7px;
    width: 305px;
    height: 305px;
    opacity: 0.8;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), #000000);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0), #000000);
    background-image: linear-gradient(rgba(0, 0, 0, 0), #000000);
}
#rewards .tab-content .list-category .reward-data-detail .gradient-out {
    position: absolute;
    z-index: 1;
    top: 0;
    border-radius: 7px;
    width: 305px;
    height: 305px;
    box-shadow: 0 6px 6px 0 rgba(32, 32, 32, 0.3);
    background-color: rgba(32, 32, 32, 0.8);
}
#rewards .tab-content .list-category .reward-data-detail .title-less img {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 13%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
#rewards .tab-content .list-category .reward-data-detail .title-less h3 {
    position: absolute;
    padding: 10px;
    top: 28%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: center;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less h3 a {
    text-decoration: none;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less h4 {
    position: absolute;
    padding: 10px;
    top: 40%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 36px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.02px;
    text-align: center;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less h4 a {
    text-decoration: none;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less h5 {
    position: absolute;
    padding: 10px;
    top: 54%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 155px;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: center;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less h5 a {
    text-decoration: none;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less h6 {
    position: absolute;
    padding: 10px;
    top: 64%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: center;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less h6 a {
    text-decoration: none;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less p {
    position: absolute;
    padding: 10px;
    top: 88%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 130px;
}
#rewards .tab-content .list-category .reward-data-detail .title-less p a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
}
#rewards .tab-content .list-category .reward-data-detail .title-less span {
    position: absolute;
    padding: 10px;
    top: 77%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 100px;
}
#rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-redeem {
    padding: 5px 15px;
    border-radius: 4px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-expired {
    padding: 5px 15px;
    border-radius: 4px;
    background: #fa262f;
    border: solid 1px #fa262f;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-redeemed {
    padding: 5px 15px;
    border-radius: 4px;
    background: #6fd400;
    border: solid 1px #6fd400;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#rewards .content-catalog {
    width: 750px;
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 30px;
    margin-top: 20px;
}
#rewards .content-catalog h2 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: left;
    color: #ffffff;
}
#rewards .content-catalog h5 {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 0.48px;
    text-align: left;
    color: #ffffff;
}
#rewards .content-catalog h5 a {
    text-decoration: none;
    color: #ffffff;
}
#rewards .content-catalog h1 {
    font-family: HelveticaNeue;
    font-size: 48px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.69px;
    text-align: right;
    color: #ffffff;
}
#rewards .content-catalog .point-detail h4 {
    display: inline;
    padding-top: 15px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #636363;
}
#rewards .content-catalog .selecting-box .form-group {
    margin-bottom: 0 !important;
    margin-top: -38px;
    display: inline;
    float: right;
}
#rewards .content-catalog .selecting-box .form-group select#reward1 {
    background-color: #282828 !important;
}
#rewards .content-catalog .selecting-box .form-group .form-control {
    font-size: 15px !important;
    width: 125px;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 0;
    color: #ffffff !important;
    height: calc(2rem + 0) !important;
}
#rewards .content-catalog .list {
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 10px;
}
#rewards .content-catalog .list .title {
    display: inline;
}
#rewards .content-catalog .list .title h3 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 1.34px;
    text-align: left;
    color: #ffffff;
}
#rewards .content-catalog .list .points h5 {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: right;
    color: #ffffff;
}
#rewards .content-catalog .list .expired-date span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 1.01px;
    text-align: left;
    color: #636363;
}
#rewards .content-catalog .list .expired-date span .earned {
    padding-right: 5px;
    color: #02adeb;
}
#rewards .content-catalog .list .expired-date span .purchased {
    padding-right: 5px;
    color: #6fd400;
}
#rewards .content-catalog .list .expired-date span .expired {
    padding-right: 5px;
    color: #fa262f;
}
#rewards .reward-detail .top-reward-banner {
    margin-top: 60px;
    padding-bottom: 20px;
}
#rewards .reward-detail .top-reward-banner img {
    width: 750px;
    height: 100%;
    border-radius: 7px;
}
#rewards .reward-detail .top-reward-choice .form-group label {
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.45px;
    text-align: left;
    color: #8f8f8f;
}
#rewards .reward-detail .top-reward-choice .form-group select#nom {
    background-color: #282828 !important;
}
#rewards .reward-detail .top-reward-choice .form-group .form-control {
    background-color: transparent !important;
    font-family: HelveticaNeue;
    font-size: 15px;
    color: #8f8f8f;
    border: 1px solid #8f8f8f;
}
#rewards .reward-detail .top-reward-description .title h2 {
    padding-bottom: 5px;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 0.54px;
    text-align: left;
    color: #ffffff;
}
#rewards .reward-detail .top-reward-description p {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: normal;
    font-style: bold;
    font-stretch: normal;
    line-height: 1.4;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#rewards .reward-detail .top-reward-description p a {
    text-decoration: none;
    color: #ffffff;
}
#rewards .reward-detail .top-reward-description p span {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.83;
    letter-spacing: 0.36px;
    text-align: left;
    color: #8f8f8f;
}
#rewards .reward-detail .top-reward-description p img {
    padding-right: 5px;
}
#rewards .reward-detail .below-purchase {
    text-align: right;
}
#rewards .reward-detail .below-purchase a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: 0.45px;
    text-align: center;
}
#rewards .reward-detail .below-purchase .btn-purchase {
    background-color: #fa262f !important;
    padding: 10px 50px;
}
#rewards .reward-detail .below-purchase .after-redeem {
    opacity: 0.5;
    pointer-events: none;
    cursor: default;
}
#rewards .reward-man {
    margin: 30px 0 !important;
}
#rewards .reward-man #reward-category .reward-category-slider {
    margin: 40px 0;
}
#rewards .reward-man #reward-category .reward-category-slider .slick-prev {
    position: absolute;
    left: -15px;
    top: 38px;
}
#rewards .reward-man #reward-category .reward-category-slider .slick-next {
    position: absolute;
    right: -15px;
    top: 38px;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li {
    padding: 5px;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    img {
    margin: 0 auto;
    border-radius: 50%;
    background-color: #3a3a3a;
    margin-bottom: 5px;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title {
    text-align: center;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title
    h5 {
    font-family: HelveticaNeue;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active {
    padding: 5px;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    img {
    margin: 0 auto;
    border-radius: 50%;
    background-color: #02adeb;
    margin-bottom: 5px;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title {
    text-align: center;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title
    h5 {
    font-family: HelveticaNeue;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#rewards #reward-special .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#rewards #reward-special ul .slick-prev {
    height: 18px;
    width: 10px;
    position: absolute;
    left: -15px;
    top: 36%;
}
#rewards #reward-special ul .slick-next {
    height: 18px;
    width: 10px;
    position: absolute;
    right: -15px;
    top: 36%;
}
#rewards #reward-special ul li .reward-data {
    max-width: 220px;
    padding: 10px;
    margin: 0 auto;
}
#rewards #reward-special ul li .reward-data a {
    text-decoration: none;
    color: #ffffff;
}
#rewards #reward-special ul li .reward-data img {
    width: 220px;
    height: 220px;
    border-radius: 7px;
}
#rewards #reward-special ul li .reward-data .title-less {
    padding: 5px;
}
#rewards #reward-special ul li .reward-data .title-less h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 0.9px;
    text-align: left;
    color: #ffffff;
}
#rewards #reward-special ul li .reward-data .title-less p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
    padding-top: 10px;
}
#rewards #reward-category .row {
    padding: 0 30px;
}
#rewards #reward-category .col-md-4 {
    padding: 0;
}
#rewards #reward-category .title {
    padding: 0 0 10px 10px;
}
#rewards #reward-category .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#rewards #reward-category .reward-data {
    margin: 0 auto;
    max-width: 220px;
    padding: 10px;
}
#rewards #reward-category .reward-data a {
    text-decoration: none;
    color: #ffffff;
}
#rewards #reward-category .reward-data img {
    width: 220px;
    height: 220px;
    border-radius: 7px;
}
#rewards #reward-category .reward-data .title-less {
    padding: 5px;
}
#rewards #reward-category .reward-data .title-less h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 0.9px;
    text-align: left;
    color: #ffffff;
}
#rewards #reward-category .reward-data .title-less p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
    padding-top: 10px;
}
#rewards #reward-category .see-all {
    text-align: center;
    padding-bottom: 20px;
}
#rewards #reward-category .see-all a {
    text-decoration: none;
    color: #ffffff;
}
#rewards #reward-category .see-all .btn-see-all {
    margin: 10px 15px;
    background-color: #515151;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 0.53px;
    text-align: center;
    color: #ffffff;
}
#rewards #reward-category-detail {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    background-color: #3a3a3a;
    padding: 20px;
}
#rewards #reward-category-detail .col-md-6 {
    padding-bottom: 30px;
}
#rewards #reward-category-detail .title {
    padding-bottom: 20px;
}
#rewards #reward-category-detail .title h4 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.21;
    letter-spacing: 0.56px;
    text-align: left;
    color: #979797;
}
#rewards #reward-category-detail .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#rewards #reward-category-detail .reward-data-detail {
    position: relative;
}
#rewards #reward-category-detail .reward-data-detail img {
    border-radius: 7px;
    width: 335px;
    height: 335px;
}
#rewards #reward-category-detail .reward-data-detail .gradient {
    position: absolute;
    top: 0;
    border-radius: 7px;
    width: 325px;
    height: 335px;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);
}
#rewards #reward-category-detail .reward-data-detail .title-less h4 {
    position: absolute;
    padding: 10px;
    bottom: 40px;
}
#rewards #reward-category-detail .reward-data-detail .title-less h4 a {
    text-decoration: none;
    color: #ffffff;
}
#rewards #reward-category-detail .reward-data-detail .title-less p {
    position: absolute;
    padding: 10px;
    bottom: -15px;
}
#rewards #reward-category-detail .reward-data-detail .title-less p a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
}
#rewards #reward-category-detail .reward-data-detail .title-less span {
    position: absolute;
    padding: 10px;
    bottom: 6px;
    right: 0;
}
#rewards #reward-category-detail .reward-data-detail .title-less span a {
    padding: 5px 10px;
    border-radius: 4px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#rewards #reward-category-detail .see-all {
    text-align: center;
    padding-bottom: 20px;
}
#rewards #reward-category-detail .see-all a {
    text-decoration: none;
    color: #ffffff;
}
#rewards #reward-category-detail .see-all .btn-see-all {
    margin: 10px 15px;
    background-color: #515151;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 0.53px;
    text-align: center;
    color: #ffffff;
}

.img-replace {
    /* replace text with an image */
    display: inline-block;
    overflow: visible;
    text-indent: 100%;
    color: #3e3e3e;
    white-space: nowrap;
    padding-top: 5px;
}

.bts-popup {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: transparent;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s;
    transition: opacity 0.3s 0s, visibility 0s 0.3s;
}
.bts-popup .pop-up {
    position: relative;
}
.bts-popup .title {
    padding: 60px 0 30px 0;
}
.bts-popup .title h2 {
    font-family: HelveticaNeue;
    font-size: 25px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #042d5a;
}
.bts-popup .subtitle {
    padding: 30px 0;
}
.bts-popup .subtitle h4 {
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #1e1e1e;
}
.bts-popup .logo img {
    width: 176px;
    height: 60px;
}
.bts-popup .app {
    padding: 10px 0;
}
.bts-popup .app .google {
    padding-right: 10px;
    display: inline;
}
.bts-popup .app .ios {
    display: inline;
}

.bts-popup.is-visible {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0s;
    transition: opacity 0.3s 0s, visibility 0s 0s;
    box-shadow: 0 4px 10px 0 rgba(127, 127, 127, 0.5);
}

.bts-popup-container {
    position: relative;
    width: 90%;
    max-width: 800px;
    margin: 4em auto;
    background: #f8f8f8;
    border-radius: none;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
    /* Force Hardware Acceleration in WebKit */
    -webkit-backface-visibility: hidden;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.bts-popup-container img {
    padding: 0;
}

.bts-popup-container a {
    color: #3e3e3e;
    text-decoration: none;
    text-transform: uppercase;
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}

.bts-popup-container .bts-popup-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    margin-right: 60px;
}

.bts-popup-container .bts-popup-close::before,
.bts-popup-container .bts-popup-close::after {
    content: "";
    position: absolute;
    top: 13px;
    width: 16px;
    height: 1px;
    background-color: #3e3e3e !important;
}

.bts-popup-container .bts-popup-close::before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    left: 8px;
}

.bts-popup-container .bts-popup-close::after {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    right: 6px;
    top: 13px;
}

.is-visible .bts-popup-container {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

@media only screen and (min-width: 1170px) {
    .bts-popup-container {
        margin: 8em auto;
    }
}
.img-replace {
    /* replace text with an image */
    display: inline-block;
    overflow: visible;
    text-indent: 100%;
    color: #3e3e3e;
    white-space: nowrap;
    padding-top: 5px;
}

.premium-popup {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
    background-color: transparent;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s;
    transition: opacity 0.3s 0s, visibility 0s 0.3s;
}
.premium-popup .pop-up {
    position: relative;
}
.premium-popup .title {
    padding: 60px 0 30px 0;
}
.premium-popup .title h2 {
    font-family: "Open Sans Regular";
    font-size: 30px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 1.2px;
    text-align: center;
    color: #ffffff;
}
.premium-popup .subtitle {
    padding: 30px 0;
}
.premium-popup .subtitle h4 {
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #1e1e1e;
}
.premium-popup .logo img {
    width: 176px;
    height: 60px;
}
.premium-popup .app {
    padding: 10px 0;
}
.premium-popup .app .google {
    padding-right: 10px;
    display: inline;
}
.premium-popup .app .ios {
    display: inline;
}

.premium-popup.is-visible {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0.3s 0s, visibility 0s 0s;
    -moz-transition: opacity 0.3s 0s, visibility 0s 0s;
    transition: opacity 0.3s 0s, visibility 0s 0s;
    box-shadow: 0 4px 10px 0 rgba(127, 127, 127, 0.5);
}

.premium-popup-container {
    position: relative;
    width: 90%;
    max-width: 630px;
    margin: 4em auto;
    background: #282828;
    border-radius: 7px;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
    /* Force Hardware Acceleration in WebKit */
    -webkit-backface-visibility: hidden;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.premium-popup-container img {
    padding: 0;
}

.premium-popup-container a {
    width: 244px;
    height: 36px;
    object-fit: contain;
    font-family: "Open Sans SemiBold";
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 2;
    letter-spacing: normal;
    text-align: center;
    color: #05b5f6;
}

.premium-popup-container .premium-popup-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    margin-right: 60px;
}

.premium-popup-container .premium-popup-close::before,
.premium-popup-container .premium-popup-close::after {
    content: "";
    position: absolute;
    top: 13px;
    width: 16px;
    height: 1px;
    background-color: #3e3e3e !important;
}

.premium-popup-container .premium-popup-close::before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    left: 8px;
}

.premium-popup-container .premium-popup-close::after {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    right: 6px;
    top: 13px;
}

.is-visible .premium-popup-container {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

@media only screen and (min-width: 1170px) {
    .premium-popup-container {
        margin: 8em auto;
    }
}
#rewards-section {
    padding-top: 59px;
    background-image: linear-gradient(to bottom, #000000, #252525 46%, #000000);
    width: 100%;
}
#rewards-section #rewards {
    min-height: 768px;
}
#rewards-section #rewards .side-panel {
    padding: 10px !important;
    background-color: #2f2f2f;
    min-width: 260px;
    max-width: 260px;
    max-height: 300vw;
}
#rewards-section #rewards .side-panel .user-profile {
    margin-top: 60px;
    padding-bottom: 30px;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .user-thumbnail
    img.user-simple-line-icons {
    width: 40px;
    height: 40px;
}
#rewards-section #rewards .side-panel .user-profile .title-postprofile {
    margin-top: 0;
    padding-left: 20px;
    padding-right: 0;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .title-postprofile
    ul
    li.title {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .title-postprofile
    ul
    li.post-email {
    font-family: HelveticaNeue;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 18px;
    letter-spacing: 0;
    color: #ffffff;
}
#rewards-section #rewards .side-panel .user-profile .dot {
    margin-top: -3px;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .dot
    .dropdown-toggle::after {
    content: none !important;
}
#rewards-section #rewards .side-panel .user-profile .dot .dropdown-menu {
    background: #2f2f2f;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .dot
    .dropdown-menu
    .dropdown-item {
    color: #ffffff;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .dot
    .dropdown-menu
    .dropdown-item:hover {
    color: #ffffff;
    background-color: #2f2f2f;
}
#rewards-section #rewards .side-panel .user-profile .rewards-member {
    padding: 20px 0;
}
#rewards-section #rewards .side-panel .user-profile .rewards-member h4 {
    display: inline;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .side-panel .user-profile .rewards-member span {
    padding-left: 5px;
    display: inline;
    font-family: HelveticaNeue;
    font-size: 9px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.11;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .side-panel .user-profile .rewards-member h6 {
    font-family: HelveticaNeue;
    font-size: 8px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.32px;
    text-align: left;
    color: #ffffff;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .rewards-member
    .btn-voucher {
    margin-top: 5px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue-Light;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item {
    padding: 10px 20px;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item
    a {
    font-size: 13px;
    font-family: HelveticaNeue;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    color: #fff;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item
    a
    img {
    padding-right: 20px;
    margin-bottom: 4px;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.item
    a:hover {
    text-decoration: none;
}
#rewards-section
    #rewards
    .side-panel
    .user-profile
    .guide-entry-fta
    ul.entry-fta
    li.active {
    background-color: #343434;
}
#rewards-section #rewards #tabs {
    padding-top: 20px;
    color: #eee;
    padding: 0;
}
#rewards-section #rewards #tabs .nav-tabs .nav-item.show .nav-link,
#rewards-section #rewards .nav-tabs .nav-link.active {
    background-color: transparent;
    border-color: transparent transparent #1d1d1d3;
    border-bottom: 1px solid #d71c55 !important;
    font-family: HelveticaNeue-Light;
    font-size: 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
#rewards-section #rewards #tabs .nav-tabs .nav-link {
    border: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    color: #eee;
    font-size: 15px;
    font-family: HelveticaNeue-Light;
    border-bottom: 1px solid #1d1d1d;
}
#rewards-section #rewards .tab-content {
    width: 750px;
}
#rewards-section #rewards .tab-content h2 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .tab-content h1 {
    font-family: HelveticaNeue;
    font-size: 48px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.69px;
    text-align: right;
    color: #ffffff;
}
#rewards-section #rewards .tab-content .point-detail h4 {
    display: inline;
    padding-top: 15px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #636363;
}
#rewards-section #rewards .tab-content .selecting-box .form-group {
    margin-bottom: 0 !important;
    margin-top: -38px;
    display: inline;
    float: right;
}
#rewards-section
    #rewards
    .tab-content
    .selecting-box
    .form-group
    select#reward1 {
    background-color: #282828 !important;
}
#rewards-section
    #rewards
    .tab-content
    .selecting-box
    .form-group
    .form-control {
    font-size: 15px !important;
    width: 125px;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 0;
    color: #ffffff !important;
    height: calc(2rem + 0) !important;
}
#rewards-section #rewards .tab-content .list {
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 10px;
}
#rewards-section #rewards .tab-content .list .title {
    display: inline;
}
#rewards-section #rewards .tab-content .list .title h3 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 1.34px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .tab-content .list .points h5 {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: right;
    color: #ffffff;
}
#rewards-section #rewards .tab-content .list .expired-date span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 1.01px;
    text-align: left;
    color: #636363;
}
#rewards-section #rewards .tab-content .list .expired-date span .earned {
    padding-right: 5px;
    color: #02adeb;
}
#rewards-section #rewards .tab-content .list .expired-date span .purchased {
    padding-right: 5px;
    color: #6fd400;
}
#rewards-section #rewards .tab-content .list .expired-date span .expired {
    padding-right: 5px;
    color: #fa262f;
}
#rewards-section #rewards .tab-content .list-category {
    border-radius: 7px;
    background-color: #3a3a3a;
    padding: 20px 40px;
}
#rewards-section #rewards .tab-content .list-category .col-md-6 {
    padding-bottom: 30px;
}
#rewards-section #rewards .tab-content .list-category .reward-data-detail {
    position: relative;
}
#rewards-section #rewards .tab-content .list-category .reward-data-detail img {
    border-radius: 7px;
    width: 305px;
    height: 305px;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .gradient-in {
    position: absolute;
    top: 0;
    border-radius: 7px;
    width: 305px;
    height: 305px;
    opacity: 0.8;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), #000000);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0), #000000);
    background-image: linear-gradient(rgba(0, 0, 0, 0), #000000);
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .gradient-out {
    position: absolute;
    z-index: 1;
    top: 0;
    border-radius: 7px;
    width: 305px;
    height: 305px;
    box-shadow: 0 6px 6px 0 rgba(32, 32, 32, 0.3);
    background-color: rgba(32, 32, 32, 0.8);
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    img {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 13%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h3 {
    position: absolute;
    padding: 10px;
    top: 28%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h3
    a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h4 {
    position: absolute;
    padding: 10px;
    top: 40%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 36px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.02px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h4
    a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h5 {
    position: absolute;
    padding: 10px;
    top: 54%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 155px;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h5
    a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h6 {
    position: absolute;
    padding: 10px;
    top: 64%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 353px;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    h6
    a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    p {
    position: absolute;
    padding: 10px;
    top: 88%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 130px;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    p
    a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span {
    position: absolute;
    padding: 10px;
    top: 77%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 100px;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-redeem {
    padding: 5px 15px;
    border-radius: 4px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-expired {
    padding: 5px 15px;
    border-radius: 4px;
    background: #fa262f;
    border: solid 1px #fa262f;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .tab-content
    .list-category
    .reward-data-detail
    .title-less
    span
    a.btn-redeemed {
    padding: 5px 15px;
    border-radius: 4px;
    background: #6fd400;
    border: solid 1px #6fd400;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#rewards-section #rewards .content-catalog {
    width: 750px;
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 30px;
    margin-top: 20px;
}
#rewards-section #rewards .content-catalog h2 {
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .content-catalog h5 {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: 100;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 0.48px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .content-catalog h5 a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section #rewards .content-catalog h1 {
    font-family: HelveticaNeue;
    font-size: 48px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 2.69px;
    text-align: right;
    color: #ffffff;
}
#rewards-section #rewards .content-catalog .point-detail h4 {
    display: inline;
    padding-top: 15px;
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #636363;
}
#rewards-section #rewards .content-catalog .selecting-box .form-group {
    margin-bottom: 0 !important;
    margin-top: -38px;
    display: inline;
    float: right;
}
#rewards-section
    #rewards
    .content-catalog
    .selecting-box
    .form-group
    select#reward1 {
    background-color: #282828 !important;
}
#rewards-section
    #rewards
    .content-catalog
    .selecting-box
    .form-group
    .form-control {
    font-size: 15px !important;
    width: 125px;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 0;
    color: #ffffff !important;
    height: calc(2rem + 0) !important;
}
#rewards-section #rewards .content-catalog .list {
    background-color: #282828;
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 10px;
}
#rewards-section #rewards .content-catalog .list .title {
    display: inline;
}
#rewards-section #rewards .content-catalog .list .title h3 {
    font-family: HelveticaNeue;
    font-size: 24px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.17;
    letter-spacing: 1.34px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .content-catalog .list .points h5 {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 28px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.18;
    letter-spacing: 1.57px;
    text-align: right;
    color: #ffffff;
}
#rewards-section #rewards .content-catalog .list .expired-date span {
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 1.01px;
    text-align: left;
    color: #636363;
}
#rewards-section #rewards .content-catalog .list .expired-date span .earned {
    padding-right: 5px;
    color: #02adeb;
}
#rewards-section #rewards .content-catalog .list .expired-date span .purchased {
    padding-right: 5px;
    color: #6fd400;
}
#rewards-section #rewards .content-catalog .list .expired-date span .expired {
    padding-right: 5px;
    color: #fa262f;
}
#rewards-section #rewards .reward-detail .top-reward-banner {
    margin-top: 60px;
    padding-bottom: 20px;
}
#rewards-section #rewards .reward-detail .top-reward-banner img {
    width: 750px;
    height: 100%;
    border-radius: 7px;
}
#rewards-section #rewards .reward-detail .top-reward-choice .form-group label {
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.45px;
    text-align: left;
    color: #8f8f8f;
}
#rewards-section
    #rewards
    .reward-detail
    .top-reward-choice
    .form-group
    select#nom {
    background-color: #282828 !important;
}
#rewards-section
    #rewards
    .reward-detail
    .top-reward-choice
    .form-group
    .form-control {
    background-color: transparent !important;
    font-family: HelveticaNeue;
    font-size: 15px;
    color: #8f8f8f;
    border: 1px solid #8f8f8f;
}
#rewards-section #rewards .reward-detail .top-reward-description .title h2 {
    padding-bottom: 5px;
    font-family: HelveticaNeue;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.22;
    letter-spacing: 0.54px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .reward-detail .top-reward-description p {
    object-fit: contain;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: normal;
    font-style: bold;
    font-stretch: normal;
    line-height: 1.4;
    letter-spacing: 0.36px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards .reward-detail .top-reward-description p a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section #rewards .reward-detail .top-reward-description p span {
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.83;
    letter-spacing: 0.36px;
    text-align: left;
    color: #8f8f8f;
}
#rewards-section #rewards .reward-detail .top-reward-description p img {
    padding-right: 5px;
}
#rewards-section #rewards .reward-detail .below-purchase {
    text-align: right;
}
#rewards-section #rewards .reward-detail .below-purchase a {
    text-decoration: none;
    color: #ffffff;
    font-family: HelveticaNeue;
    font-size: 15px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.13;
    letter-spacing: 0.45px;
    text-align: center;
}
#rewards-section #rewards .reward-detail .below-purchase .btn-purchase {
    background-color: #fa262f !important;
    padding: 10px 50px;
}
#rewards-section #rewards .reward-detail .below-purchase .after-redeem {
    opacity: 0.5;
    pointer-events: none;
    cursor: default;
}
#rewards-section #rewards .reward-man {
    margin: 30px 0 !important;
}
#rewards-section #rewards .reward-man #reward-category .reward-category-slider {
    margin: 40px 0;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    .slick-prev {
    position: absolute;
    left: -15px;
    top: 38px;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    .slick-next {
    position: absolute;
    right: -15px;
    top: 38px;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li {
    padding: 5px;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    img {
    margin: 0 auto;
    border-radius: 50%;
    background-color: #3a3a3a;
    margin-bottom: 5px;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title {
    text-align: center;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title
    h5 {
    font-family: HelveticaNeue;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li
    .category
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active {
    padding: 5px;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    img {
    margin: 0 auto;
    border-radius: 50%;
    background-color: #02adeb;
    margin-bottom: 5px;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title {
    text-align: center;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title
    h5 {
    font-family: HelveticaNeue;
    font-size: 10px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.2;
    letter-spacing: 0.3px;
    text-align: center;
    color: #ffffff;
}
#rewards-section
    #rewards
    .reward-man
    #reward-category
    .reward-category-slider
    ul.reward-category-slide
    li.active
    .category
    .title
    h5
    a {
    color: #ffffff;
    text-decoration: none;
}
#rewards-section #rewards #reward-special .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards #reward-special ul .slick-prev {
    height: 18px;
    width: 10px;
    position: absolute;
    left: -15px;
    top: 36%;
}
#rewards-section #rewards #reward-special ul .slick-next {
    height: 18px;
    width: 10px;
    position: absolute;
    right: -15px;
    top: 36%;
}
#rewards-section #rewards #reward-special ul li .reward-data {
    max-width: 220px;
    padding: 10px;
    margin: 0 auto;
}
#rewards-section #rewards #reward-special ul li .reward-data a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section #rewards #reward-special ul li .reward-data img {
    width: 220px;
    height: 220px;
    border-radius: 7px;
}
#rewards-section #rewards #reward-special ul li .reward-data .title-less {
    padding: 5px;
}
#rewards-section #rewards #reward-special ul li .reward-data .title-less h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 0.9px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards #reward-special ul li .reward-data .title-less p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
    padding-top: 10px;
}
#rewards-section #rewards #reward-category .row {
    padding: 0 30px;
}
#rewards-section #rewards #reward-category .col-md-4 {
    padding: 0;
}
#rewards-section #rewards #reward-category .title {
    padding: 0 0 10px 10px;
}
#rewards-section #rewards #reward-category .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards #reward-category .reward-data {
    margin: 0 auto;
    max-width: 220px;
    padding: 10px;
}
#rewards-section #rewards #reward-category .reward-data a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section #rewards #reward-category .reward-data img {
    width: 220px;
    height: 220px;
    border-radius: 7px;
}
#rewards-section #rewards #reward-category .reward-data .title-less {
    padding: 5px;
}
#rewards-section #rewards #reward-category .reward-data .title-less h4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    font-family: HelveticaNeue;
    font-size: 16px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.19;
    letter-spacing: 0.9px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards #reward-category .reward-data .title-less p {
    font-family: HelveticaNeue-Light;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
    padding-top: 10px;
}
#rewards-section #rewards #reward-category .see-all {
    text-align: center;
    padding-bottom: 20px;
}
#rewards-section #rewards #reward-category .see-all a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section #rewards #reward-category .see-all .btn-see-all {
    margin: 10px 15px;
    background-color: #515151;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 0.53px;
    text-align: center;
    color: #ffffff;
}
#rewards-section #rewards #reward-category-detail {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    background-color: #3a3a3a;
    padding: 20px;
}
#rewards-section #rewards #reward-category-detail .col-md-6 {
    padding-bottom: 30px;
}
#rewards-section #rewards #reward-category-detail .title {
    padding-bottom: 20px;
}
#rewards-section #rewards #reward-category-detail .title h4 {
    font-family: HelveticaNeue;
    font-size: 14px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.21;
    letter-spacing: 0.56px;
    text-align: left;
    color: #979797;
}
#rewards-section #rewards #reward-category-detail .title h2 {
    font-family: HelveticaNeue;
    font-size: 20px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.15;
    letter-spacing: 1.12px;
    text-align: left;
    color: #ffffff;
}
#rewards-section #rewards #reward-category-detail .reward-data-detail {
    position: relative;
}
#rewards-section #rewards #reward-category-detail .reward-data-detail img {
    border-radius: 7px;
    width: 335px;
    height: 335px;
}
#rewards-section
    #rewards
    #reward-category-detail
    .reward-data-detail
    .gradient {
    position: absolute;
    top: 0;
    border-radius: 7px;
    width: 325px;
    height: 335px;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);
}
#rewards-section
    #rewards
    #reward-category-detail
    .reward-data-detail
    .title-less
    h4 {
    position: absolute;
    padding: 10px;
    bottom: 40px;
}
#rewards-section
    #rewards
    #reward-category-detail
    .reward-data-detail
    .title-less
    h4
    a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section
    #rewards
    #reward-category-detail
    .reward-data-detail
    .title-less
    p {
    position: absolute;
    padding: 10px;
    bottom: -15px;
}
#rewards-section
    #rewards
    #reward-category-detail
    .reward-data-detail
    .title-less
    p
    a {
    text-decoration: none;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 1.04px;
    text-align: left;
    color: #ffffff;
}
#rewards-section
    #rewards
    #reward-category-detail
    .reward-data-detail
    .title-less
    span {
    position: absolute;
    padding: 10px;
    bottom: 6px;
    right: 0;
}
#rewards-section
    #rewards
    #reward-category-detail
    .reward-data-detail
    .title-less
    span
    a {
    padding: 5px 10px;
    border-radius: 4px;
    border: solid 1px #ffffff;
    font-family: HelveticaNeue;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.25;
    letter-spacing: 0.36px;
    text-align: center;
    color: #ffffff;
}
#rewards-section #rewards #reward-category-detail .see-all {
    text-align: center;
    padding-bottom: 20px;
}
#rewards-section #rewards #reward-category-detail .see-all a {
    text-decoration: none;
    color: #ffffff;
}
#rewards-section #rewards #reward-category-detail .see-all .btn-see-all {
    margin: 10px 15px;
    background-color: #515151;
    font-family: HelveticaNeue;
    font-size: 13px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.23;
    letter-spacing: 0.53px;
    text-align: center;
    color: #ffffff;
}

#error {
    width: 100%;
    background-image: radial-gradient(
        circle,
        #265bab,
        #374c87,
        #393f65,
        #333345,
        #282828
    );
    height: 100%;
}
#error .card-error {
    margin-top: 170px !important;
    margin: 0 auto;
    float: none;
    margin-bottom: 10px;
}
#error .card-error .not-found {
    margin: 0 auto;
    margin-left: -55px;
}
#error .card-error h4 {
    margin-top: -75px;
    padding-bottom: 30px;
    font-family: HelveticaNeue;
    font-size: 23.8px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0;
    color: #ffffff;
}
#error .card-error a {
    text-align: left;
}
#error .card-error a .fa-arrow-left {
    color: #ffffff;
    padding-right: 10px;
}
#error .card-error a h5 {
    padding: 30px 0;
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.8px;
    text-align: center;
    color: #ffffff;
}
#error ul.not-found {
    display: flex;
    width: 100%;
    height: 100vh;
    justify-content: center;
    align-items: center;
    place-items: center center;
    position: relative;
}
#error ul.not-found li.img-error img {
    max-width: 100%;
    max-height: 100%;
}
#error ul.not-found li.error-text-title {
    position: absolute;
    left: 36.5%;
    bottom: 36%;
}
#error ul.not-found li.error-text-title h4.error {
    font-family: HelveticaNeue;
    font-size: 23.8px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}
#error ul.not-found li.error-text-caption {
    position: absolute;
    left: 36.5%;
    bottom: 30%;
}
#error ul.not-found li.error-text-caption .fa-arrow-left {
    display: inline;
    color: #ffffff;
    padding-right: 10px;
}
#error ul.not-found li.error-text-caption h5.error {
    display: inline;
    font-family: HelveticaNeue-Light;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.6px;
    color: #ffffff;
}

html {
    scroll-behavior: smooth;
  }

/*# sourceMappingURL=main.min.css.map */