html {
        width: 100%;
        height: 100%;
        background-color: #17162a !important;
        scroll-behavior: smooth;
        font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
    }
    /* DARK MODE */
    
    .darkmode-bg {
        background-color: #17162a !important;
    }
    
    .darkmode-bg-nav {
        background-color: #262444 !important;
        box-shadow: 0px 0.01em 2px 2px #1b063383;
    }
    
    .darkmode-bg-bnav {
        background-color: #262444 !important;
        box-shadow: 0px -0.01em 2px 1.5px #1b063383;
    }
    
    .darkmode-card {
        background-color: #2c2a50 !important;
    }
    /* CUSTOM COLOURS */
    
    .darkmode-accent-txt {
        color: #1be6f4 !important;
    }
    
    .darkmode-accent2-txt {
        color: #08565c !important;
    }
    /* CUSTOM CARDS */
    
    .card-dashboard {
        max-width: 100%;
        height: 100%;
    }
    
    .explore-img-climateChange {
        background-image: url("../explore/assets/ClimateChange.jpg");
        background-size: cover;
        background-position: 50% 50%;
    }
    
    .explore-img-coldWar2 {
        background-image: url("../explore/assets/ColdWar2.jpg");
        background-size: cover;
        background-position: 50% 50%;
    }
    
    .explore-img-civilUnrest {
        background-image: url("../explore/assets/civilUnrest.jpg");
        background-size: cover;
        background-position: 50% 50%;
    }
    
    .explore-img-surveillanceState {
        background-image: url("../explore/assets/surveillanceState.jpg");
        background-size: cover;
        background-position: 50% 50%;
    }
    
    .explore-img-EconomicInequality {
        background-image: url("../explore/assets/EconomicInequality.jpg");
        background-size: cover;
        background-position: 50% 50%;
    }
    
    .explore-img-Prepping {
        background-image: url("../explore/assets/Prepping.jpg");
        background-size: cover;
        background-position: 50% 50%;
    }
    
    .explore-img-Theories {
        background-image: url("../explore/assets/industry.jpg");
        background-size: cover;
        background-position: 50% 50%;
    }
    
    .about-img-logo {
        display: block;
        margin: auto;
        max-width: 8em;
    }
    /*   MAIN & NAV */
    
    .navbar {
        width: 100%;
        position: fixed !important;
        z-index: 999 !important;
    }
    
    main {
        padding-top: 4em;
    }
    
    .article-card {
        border-radius: 0.5em;
        box-shadow: 0 0 4px 0 rgba(0, 0, 0, .14), 0 3px 4px 0 rgba(0, 0, 0, .12), 0 1px 5px 0 rgba(0, 0, 0, .2);
        padding: 1em 0.5em 0.5em 0.5em;
        background-color: #2c2a50;
        width: 90%;
        margin: auto;
    }
    
    .explore-card {
        max-width: 95% !important;
        height: 20vh !important;
        margin: auto;
        -ms-flex-direction: column;
        border-radius: 0.5em;
        box-shadow: 0 0 4px 0 rgba(0, 0, 0, .14), 0 3px 4px 0 rgba(0, 0, 0, .12), 0 1px 5px 0 rgba(0, 0, 0, .2);
        display: -ms-flexbox;
        display: flex;
        flex-direction: column;
        min-width: 0;
        position: relative;
        word-wrap: break-word
    }
    
    .card-dash-item {
        max-width: 95% !important;
        margin: auto;
        -ms-flex-direction: column;
        border-radius: 2px;
        box-shadow: 0 0 4px 0 rgba(0, 0, 0, .14), 0 3px 4px 0 rgba(0, 0, 0, .12), 0 1px 5px 0 rgba(0, 0, 0, .2);
        display: -ms-flexbox;
        display: flex;
        flex-direction: column;
        min-width: 0;
        position: relative;
        word-wrap: break-word
    }
    /* Responsive card-dash-item-index */
    /* Extra Extra small devices (phones, 320px and down) */
    
    @media only screen and (max-width: 320px) {
        .card-dash-item-index {
            max-width: 100% !important;
            height: 1700vh;
            margin: auto;
            -ms-flex-direction: column;
            border-radius: 0.5em;
            display: -ms-flexbox;
            display: flex;
            flex-direction: column;
            min-width: 0;
            position: relative;
            word-wrap: break-word;
            font-family: 'Signika';
            font-size: 1rem !important;
            font-weight: 300 !important;
        }
    }
    /* Extra small devices (phones, 500px and down) */
    
    @media only screen and (max-width: 500px) {
        .card-dash-item-index {
            max-width: 100% !important;
            height: 1000vh;
            margin: auto;
            -ms-flex-direction: column;
            border-radius: 0.5em;
            display: -ms-flexbox;
            display: flex;
            flex-direction: column;
            min-width: 0;
            position: relative;
            word-wrap: break-word;
            font-family: 'Signika';
            font-size: 1rem !important;
            font-weight: 300 !important;
        }
    }
    /* Small devices (portrait tablets and large phones, 600px and up) */
    
    @media only screen and (min-width: 600px) {
        .card-dash-item-index {
            max-width: 100% !important;
            height: 550vh;
            margin: auto;
            -ms-flex-direction: column;
            border-radius: 0.5em;
            display: -ms-flexbox;
            display: flex;
            flex-direction: column;
            min-width: 0;
            position: relative;
            word-wrap: break-word;
            font-family: 'Signika';
            font-size: 1rem !important;
            font-weight: 300 !important;
        }
    }
    /* Medium devices (landscape tablets, 768px and up) */
    
    @media only screen and (min-width: 768px) {
        .card-dash-item-index {
            max-width: 100% !important;
            height: 500vh;
            margin: auto;
            -ms-flex-direction: column;
            border-radius: 0.5em;
            display: -ms-flexbox;
            display: flex;
            flex-direction: column;
            min-width: 0;
            position: relative;
            word-wrap: break-word;
            font-family: 'Signika';
            font-size: 1rem !important;
            font-weight: 300 !important;
        }
    }
    /* Large devices (laptops/desktops, 992px and up) */
    
    @media only screen and (min-width: 992px) {
        .card-dash-item-index {
            max-width: 100% !important;
            height: 450vh;
            margin: auto;
            -ms-flex-direction: column;
            border-radius: 0.5em;
            display: -ms-flexbox;
            display: flex;
            flex-direction: column;
            min-width: 0;
            position: relative;
            word-wrap: break-word;
            font-family: 'Signika';
            font-size: 1rem !important;
            font-weight: 300 !important;
        }
    }
    /* Extra large devices (large laptops and desktops, 1200px and up) */
    
    @media only screen and (min-width: 1200px) {
        .card-dash-item-index {
            max-width: 100% !important;
            height: 500vh;
            margin: auto;
            -ms-flex-direction: column;
            border-radius: 0.5em;
            display: -ms-flexbox;
            display: flex;
            flex-direction: column;
            min-width: 0;
            position: relative;
            word-wrap: break-word;
            font-family: 'Signika';
            font-size: 1rem !important;
            font-weight: 300 !important;
        }
    }
    
    .card-dash-item-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 1rem
    }
    
    .card-dash-item-body:first-child {
        border-top-left-radius: 2px;
        border-top-right-radius: 2px
    }
    
    .card-dash-item-body:last-child {
        border-bottom-left-radius: 2px;
        border-bottom-right-radius: 2px
    }
    /* CUSTOM POISITION */
    
    .bottom-nav {
        position: fixed !important;
        bottom: 0 !important;
        -ms-flex-pack: center!important;
        justify-content: center!important
    }
    
    .navbar-button {
        position: relative;
        z-index: 900;
    }
    
    .bottom-nav-item {
        line-height: 3em;
    }
    
    .wiki-margin {
        margin-bottom: 20vh;
    }
    /* CUSTOM Width */
    
    .width-100 {
        width: 100%;
    }
    
    .height-4em {
        height: 4em;
    }
    /* CUSTOM FONTS */
    
    @font-face {
        font-family: 'Goldman';
        src: url('../fonts/Goldman-Regular.ttf') format('truetype');
    }
    
    @font-face {
        font-family: 'Transport';
        src: url('../fonts/Transport.ttf') format('truetype');
    }
    
    @font-face {
        font-family: 'MavenPro-Regular';
        src: url('../fonts/MavenPro-Regular.ttf') format('truetype');
    }
    /* CUSTOM FONTS */
    
    .font-Goldman {
        font-family: Goldman;
        font-smooth: auto;
    }
    
    .font-Transport {
        font-family: 'Transport' !important;
        font-smooth: auto;
    }
    /* HEADER FONT */
    
    h1,
    h4,
    h6 {
        font-family: 'Transport' !important;
        color: #1be6f4 !important;
        font-smooth: auto;
    }
    
    h2 {
        font-family: 'Transport' !important;
        color: #fff !important;
        font-smooth: auto;
    }
    
    h3 {
        font-family: VMS !important;
        color: #f4af1b !important;
        font-smooth: auto;
        font-size: 1rem !important;
    }
    
    h5 {
        font-family: 'Roboto' !important;
        font-smooth: auto;
        color: #1be6f4 !important;
        font-size: 1rem !important;
    }
    
    p {
        font-family: 'Roboto' !important;
        font-smooth: auto;
    }
    
    .text-cyan {
        color: #1be6f4 !important;
    }
    
    a {
        color: #1be6f4 !important;
    }
    
    .nav-item {
        font-family: 'MavenPro-Regular' !important;
        font-smooth: auto;
    }
    /* TICKER FONT */
    
    .font-ticker {
        font-family: VMS !important;
        font-smooth: auto;
    }
    /* CUSTOM FONT SIZE */
    
    .text-respon {
        font-size: 1rem !important;
    }
    
    .text-respon2 {
        font-size: 1.7rem !important;
        text-shadow: 0.07em 0.07em #000000d3;
    }
    /* Ticker Styling */
    
    #ticker-wrapper.has-js {
        padding: 0px 20px;
        max-width: 100%;
        overflow: hidden;
        height: 3em;
        display: block;
        background-color: #0e0e0e;
        font-size: 0.75em;
    }
    
    #ticker {
        width: 710px;
        height: 23px;
        display: block;
        position: relative;
        overflow: hidden;
        background-color: #0e0e0e;
    }
    
    #ticker-title {
        padding-top: 9px;
        color: #e53935;
        font-weight: bold;
        background-color: #0e0e0e;
        text-transform: uppercase;
    }
    
    #ticker-content {
        margin: 0px;
        padding-top: 11px;
        position: absolute;
        color: #eba640 !important;
        font-weight: bold;
        background-color: #0e0e0e;
        overflow: hidden;
        white-space: nowrap;
        line-height: 1.2em;
        text-transform: uppercase;
    }
    
    #ticker-content a {
        text-decoration: none;
        color: #ffb300 !important;
    }
    
    #ticker-content a:hover {
        text-decoration: underline;
        color: #fff;
    }
    
    #ticker-swipe {
        padding-top: 9px;
        position: absolute;
        top: 0px;
        background-color: #0e0e0e;
        display: block;
        width: 800px;
        height: 23px;
    }
    
    #ticker-swipe span {
        margin-left: 1px;
        background-color: #0e0e0e;
        border-bottom: 1px solid #1f527b00;
        height: 12px;
        width: 7px;
        display: block;
    }
    
    #ticker-controls {
        padding: 0px 0px 0px 0px;
        list-style-type: none;
        float: right !important;
    }
    
    #ticker-controls li {
        padding: 0px;
        margin-left: 5px;
        float: left;
        cursor: pointer;
        height: 16px;
        width: 16px;
        display: block;
    }
    
    #ticker-controls li#play-pause {
        background-image: url('../images/controls.png');
        background-position: 32px 16px;
    }
    
    #ticker-controls li#play-pause.over {
        background-position: 32px 32px;
    }
    
    #ticker-controls li#play-pause.down {
        background-position: 32px 0px;
    }
    
    #ticker-controls li#play-pause.paused {
        background-image: url('../images/controls.png');
        background-position: 48px 16px;
    }
    
    #ticker-controls li#play-pause.paused.over {
        background-position: 48px 32px;
    }
    
    #ticker-controls li#play-pause.paused.down {
        background-position: 48px 0px;
    }
    
    #ticker-controls li#prev {
        background-image: url('../images/controls.png');
        background-position: 0px 16px;
    }
    
    #ticker-controls li#prev.over {
        background-position: 0px 32px;
    }
    
    #ticker-controls li#prev.down {
        background-position: 0px 0px;
    }
    
    #ticker-controls li#next {
        background-image: url('../images/controls.png');
        background-position: 16px 16px;
    }
    
    #ticker-controls li#next.over {
        background-position: 16px 32px;
    }
    
    #ticker-controls li#next.down {
        background-position: 16px 0px;
    }
    
    .js-hidden {
        display: none;
    }
    
    #no-js-news {
        padding: 10px 0px 0px 45px;
        color: #F8F0DB;
    }
    
    .left #ticker-swipe {
        left: 80px;
    }
    
    .left #ticker-controls,
    .left #ticker-content,
    .left #ticker-title,
    .left #ticker {
        float: left;
    }
    
    .left #ticker-controls {
        padding-left: 6px;
    }
    
    .right #ticker-swipe {
        right: 80px;
    }
    
    .right #ticker-controls,
    .right #ticker-content,
    .right #ticker-title,
    .right #ticker {
        float: right;
    }
    
    .right #ticker-controls {
        padding-right: 6px;
    }