/*====================================================*/
/* Dark mode */
/*====================================================*/
.dark-mode-btn {
    position: fixed;
    left: 20px;
    bottom: 20px;
    padding: 15px;
    border-radius: 50%;
    transition: all 0.5s;
    z-index: 9999;
    background: #363636;
    text-align: center;
    top: auto;
    right: auto;
    display: flex;
}
.dark-mode-btn.animateSwitch{
    animation: JTswitchNightMode 1s linear;
    animation-iteration-count: 1;
}
@keyframes JTswitchNightMode {
    20% {
        top: auto;
        left: 50%;
        right: auto;
        bottom: 50%;
        transform: scale(1) translateY(50px) translateX(50px);
        opacity: 1;
    }
    30% {
        top: auto;
        left: 50%;
        right: auto;
        bottom: 50%;
        opacity: 1;
        transform: scale(1) translateY(50px) translateX(50px);
        opacity: 1;
    }
    60% {
        transform: scale(100);
        opacity: 0.8;
    }
    70%{
        opacity: 1;
    }
    85%{
        transform: scale(100);
        opacity: 1;
    }
    90% {
        opacity: 0.5;
        transform: scale(1);
    }
    95% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.dark-mode-btn .fas {
    font-size: 20px;
    width: 20px;
    height: 20px;
    display: block;
    animation: JTswing 2s infinite ease;
    margin: auto;
}
.dark-mode-btn .fa-sun,
.dark-mode.dark-mode-btn .fa-moon{
    display: none;
}
.dark-mode.dark-mode-btn .fa-sun{
    display: block;
}
.dark-mode-btn.animateSwitch .fas{
    display: none;
}
@keyframes JTswing {
    0%,100% {transform: rotateZ(0deg);}
    70% {transform: rotateZ(-30deg);}
}
.dark-mode.dark-mode-btn{
    background: #fff;
}
.dark-mode-btn .fa-sun{
    color: #ffcc33;
}
/*--------------------------------------*/
/*BRAND #51b067                         */
/*color*/
body.dark-mode a,
body.dark-mode .owl-prev i,
body.dark-mode .owl-next i,
body.dark-mode .MainHeader .nav-icon-toggle,
body.dark-mode progress[value]{
    color: #ffcc33;
    border: none;
}
body.dark-mode .MainHeader .serchIcon {
    color: #ffcc33 !important;
}
/*background*/
body.dark-mode #ajax-load-more .alm-btn-wrap .alm-load-more-btn,
body.dark-mode .loadmoreBtn,
body.dark-mode .sectiontitle::after,
body.dark-mode progress[value]::-webkit-progress-value,
body.dark-mode progress[value]::-moz-progress-bar{
    background: #ffcc33;
}
/*border-color*/
body.dark-mode .MainHeader .logo::before,
body.dark-mode .MainHeader .logo::after{
    border-color:  #ffcc33;
}
/*--------------------------------------*/
/*WHITE #ffffff #c6c6c6 #7b7b7b         */
.dark-mode-btn .fa-moon,
body.dark-mode .loadmoreBtn,
body.dark-mode #ajax-load-more .alm-btn-wrap .alm-load-more-btn,
body.dark-mode .sectiontitle::after,
body.dark-mode .XVtitleBig h1,
body.dark-mode .MainHeader nav .nav__menu li a,
body.dark-mode section#News .articleVX.h-600 .title{
    color: #ffffff;
}
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode .sidenav nav ul li a,
body.dark-mode #team .member .name,
body.dark-mode .articleVX .title,
body.dark-mode #amazon-ai-player-label,
body.dark-mode footer aside a,
body.dark-mode footer aside span,
body.dark-mode footer .newsletter {
    color: #d7d7d7;
}
body.dark-mode p,
body.dark-mode .entryArticle > p,
body.dark-mode .entryArticle li,
body.dark-mode .wp-block-table td {
    color: #b3b3b3;
}
/*--------------------------------------*/
/*BLACK #393939 #2e2e2e #1f1f1f #1a1a1a */
.singlePage article .socialShare,
body.dark-mode .singlePage .articleFooter,
body.dark-mode .wp-block-table td {
    border-color: #393939;
}
body.dark-mode .SearchBox,
body.dark-mode .SearchBox .gsc-control-cse-tr,
body.dark-mode .MainHeader:after,
body.dark-mode section#News .articleVX.h-600.A_Story .title,
body.dark-mode .articleVX.h-600.A_Story .A_icon,
body.dark-mode .MainHeader nav .nav__menu > li ul li a:hover,
body.dark-mode .sidenav .nav__dropdown-menu{
    background: #2e2e2e;
}
body.dark-mode,
body.dark-mode .loader-mask,
body.dark-mode footer .copyright,
body.dark-mode .entryArticle blockquote::before,
body.dark-mode .sidenav,
body.dark-mode .crossMedia .corssMedia-inner,
body.dark-mode .crossMedia .corssMedia-content,
body.dark-mode .crossMedia #main-container,
body.dark-mode .crossMedia .articleVX .title-inner,
body.dark-mode .crossMedia .corssMedia-extra,
body.dark-mode .MainHeader nav .nav__menu > li > ul
{
    background: #1f1f1f;
}
body.dark-mode #owl-hero-slider{
    background-color: #1f1f1f !important;
}
body.dark-mode .owl-prev,
body.dark-mode .owl-next,
body.dark-mode .owl-prev:hover,
body.dark-mode .owl-next:hover,
body.dark-mode .SearchBox form button,
body.dark-mode footer,
body.dark-mode .MainHeader nav .nav__menu > li:hover > a {
    background-color: #1a1a1a;
}
body.dark-mode .entryArticle pre{
    background-color: #111;
}

/*--------------------------------------*/
/*others                                */
body.dark-mode img {
    filter: brightness(80%) contrast(120%);
}
body.dark-mode .alm-load-more-btn.more.loading,
body.dark-mode .amazon-ai-player {
    filter: invert(1);
}
body.dark-mode .logo svg path:nth-of-type(2) {
    fill: #FFF;
}
body.dark-mode .singlePage article #myInput {
    border: 1px solid #393939;
    background: #2b2b2b;
    color: #7b7b7b;
}
body.dark-mode .searchSection input,
body.dark-mode .SearchBox .gsc-input-box,
body.dark-mode .SearchBox form input {
    background: #404040;
    color: #e4e4e4;
}
body.dark-mode .SearchBox .gsc-control-cse-tr,
body.dark-mode .SearchBox form button,
body.dark-mode .SearchBox .gsc-input-box
{
    border: none;
}
@media only screen and (min-width: 811px) {
    body.dark-mode .sectiontitle.style2 {
        background: #000;
        color: #26C4B3;
        border-right: 3px solid #26C4B3;
    }
}