@import url("https://fonts.googleapis.com/css?family=Source+Code+Pro:200,300,400,500,600,700,800,900,200i,300i,400i,500i,600i,700i,800i,900i&display=swap"); @import url("https://fonts.googleapis.com/css?family=Roboto+Mono:100,200,300,400,500,600,700,100i,200i,300i,400i,500i,600i,700i&display=swap"); @font-face {
    font-family: "Source Sans Pro Topnav";
    font-style: normal;
    font-weight: 400;
    src: url("./fonts/SourceSansPro-Regular.woff2") format("woff2"), url("./fonts/SourceSansPro-Regular.woff") format("woff"), url("./fonts/SourceSansPro-Regular.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: fontawesome;
    font-style: normal;
    font-weight: normal;
    src: url("./fonts/fontawesome.woff2-14663396") format("woff2"), url("./fonts/fontawesome.woff-14663396") format("woff"), url("./fonts/fontawesome.ttf-14663396") format("truetype");
    font-display: swap;
}

body {
    font-family: "Segoe UI", -apple-system, Arial, Verdana, sans-serif;
    font-size: 16px;
    line-height: 1.5;
}

* {
    box-sizing: inherit;
}

html {
    box-sizing: border-box;
}

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

html {
    font-family: "Segoe UI", -apple-system, Arial, Verdana, sans-serif;
    font-size: 16px;
    line-height: 1.5;
}

html {
    overflow: hidden scroll;
}

:root {
    --cmp-color-primary: #0071f2;
    --cmp-color-primary-dark: #0065d9;
    --cmp-color-primary-darker: #005ac1;
    --cmp-color-secondary: #c7ccd3;
    --cmp-color-white: #fff;
    --cmp-color-grey-1: #f4f4f4;
    --cmp-color-grey-2: #eee;
    --cmp-color-grey-8: #2d3339;
    --cmp-color-black: #050a0f;
    --cmp-spacing-5: 20px;
    --cmp-margins-h1-bottom: var(--cmp-spacing-5);
    --cmp-colors-text-link: var(--cmp-color-primary-dark);
    --cmp-colors-text-link-hover: var(--cmp-color-primary-darker);
    --cmp-colors-background-body: var(--cmp-color-white);
    --cmp-colors-background-primary: var(--cmp-color-primary);
    --cmp-colors-background-primary-hover: var(--cmp-color-primary-dark);
    --cmp-colors-background-primary-active: var(--cmp-color-primary-darker);
    --cmp-colors-background-secondary-hover: var(--cmp-color-primary-dark);
    --cmp-colors-background-secondary-active: var(--cmp-color-primary-darker);
    --cmp-colors-background-tertiary: var(--cmp-color-primary);
    --cmp-colors-background-tertiary-hover: var(--cmp-color-primary-dark);
    --cmp-colors-background-tertiary-active: var(--cmp-color-primary-darker);
    --cmp-colors-background-quaternary: var(--cmp-color-grey-1);
    --cmp-colors-background-quaternary-hover: var(--cmp-color-grey-1);
    --cmp-colors-background-quaternary-active: var(--cmp-color-grey-1);
    --cmp-colors-text-default: var(--cmp-color-grey-8);
    --cmp-colors-text-h1: var(--cmp-color-black);
    --cmp-colors-text-on-primary: var(--cmp-color-white);
    --cmp-colors-text-on-primary-hover: var(--cmp-color-white);
    --cmp-colors-text-on-primary-active: var(--cmp-color-white);
    --cmp-colors-text-on-secondary: var(--cmp-color-secondary);
    --cmp-colors-text-on-secondary-hover: var(--cmp-color-secondary);
    --cmp-colors-text-on-secondary-active: var(--cmp-color-secondary);
    --cmp-colors-text-on-tertiary: var(--cmp-color-secondary);
    --cmp-colors-text-on-tertiary-hover: var(--cmp-color-secondary);
    --cmp-colors-text-on-tertiary-active: var(--cmp-color-secondary);
    --cmp-colors-text-on-quaternary: var(--cmp-color-primary);
    --cmp-colors-text-on-quaternary-hover: var(--cmp-color-primary-dark);
    --cmp-colors-text-on-quaternary-active: var(--cmp-color-primary-darker);
    --cmp-colors-border-primary: var(--cmp-color-primary);
    --cmp-colors-border-secondary: var(--cmp-color-secondary);
    --cmp-colors-border-tertiary: var(--cmp-color-secondary);
    --cmp-colors-border-tertiary-hover: var(--cmp-color-secondary);
    --cmp-colors-border-tertiary-active: var(--cmp-color-secondary);
    --cmp-colors-border-quaternary-hover: var(--cmp-color-primary);
    --cmp-colors-border-quaternary-active: var(--cmp-color-primary-dark);
    --cmp-colors-border-header: var(--cmp-color-grey-2);
}

body {
    transition: opacity 0.2s ease-in;
}

body {
    margin: 0px;
}

body {
    font-family: "Segoe UI", -apple-system, Arial, Verdana, sans-serif;
    font-size: 16px;
    line-height: 1.5;
}

body.darkpagetheme {
    background-color: rgb(29, 42, 53) !important;
    color: rgb(221, 221, 221) !important;
}

*, ::before, ::after {
    box-sizing: inherit;
}

#tnb-search-suggestions {
    display: none;
    position: fixed;
    z-index: 200;
    font-family: "Source Sans Pro", sans-serif;
    font-size: 15px;
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    width: 300px;
    top: 49px;
    left: 507px;
    border: 1px solid rgb(221, 221, 221);
    text-align: left;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 4px 0px, rgba(0, 0, 0, 0.12) 0px 2px 10px 0px !important;
}

#top-nav-bar {
    height: 0px;
    display: block;
    width: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 100;
    margin-left: auto;
    margin-right: auto;
    background-color: rgb(255, 255, 255);
}

#top-nav-bar::before {
    display: block;
    content: " ";
    z-index: -1;
    position: fixed;
    width: 100%;
    height: 56px;
    left: 0px;
    top: 0px;
    background-color: white;
}

.darkpagetheme #top-nav-bar::before {
    background-color: rgb(29, 42, 53) !important;
}

.topnavbackground {
    background-color: rgb(40, 42, 53);
    position: fixed;
    width: 100%;
    height: 33px;
    top: 56px;
}

body.darkpagetheme .topnavbackground {
    background-color: rgb(13, 23, 33) !important;
}

.topnavcontainer {
    background-color: rgb(40, 42, 53);
    width: 100%;
    max-width: 1750px;
    left: 0px;
    right: 0px;
    margin: auto;
    height: 33px;
    top: 56px;
    position: fixed;
    z-index: 3;
}

body.darkpagetheme .topnavcontainer {
    background-color: rgb(13, 23, 33) !important;
}

.contentcontainer {
    background-color: rgb(245, 246, 247);
}

body.darkpagetheme .contentcontainer {
    background-color: rgb(41, 53, 62);
}

#wrappercontainer {
    width: 100%;
    height: 100px;
    background-color: red;
    position: relative;
    z-index: 2;
}

canvas {
    display: inline-block;
}

body.darkpagetheme canvas {
    background-color: white;
}

.w3-bar {
    width: 100%;
    overflow: hidden;
}

.w3-white {
    color: rgb(0, 0, 0) !important;
    background-color: rgb(255, 255, 255) !important;
}

body.darkpagetheme .w3-white {
    background-color: rgb(29, 42, 53) !important;
    color: rgb(221, 221, 221) !important;
}

#pagetop {
    position: fixed;
    z-index: 4;
    font-size: 16px;
    background-color: white;
    color: rgb(40, 42, 53);
    padding-left: 1px;
    padding-right: 16px;
    font-family: "Source Sans Pro Topnav", sans-serif;
    min-width: 330px;
}

body.darkpagetheme #pagetop {
    background-color: rgb(21, 32, 43);
    color: rgb(221, 221, 221);
}

#top-nav-bar > #pagetop {
    position: absolute;
    padding: 0px;
    height: 56px;
    top: 0px;
    left: 0px;
    width: 100%;
    right: 0px;
    max-width: 1750px;
    margin-left: auto;
    margin-right: auto;
}

.w3-container::after, .w3-container::before, .w3-panel::after, .w3-panel::before, .w3-row::after, .w3-row::before, .w3-row-padding::after, .w3-row-padding::before, .w3-cell-row::before, .w3-cell-row::after, .w3-clear::after, .w3-clear::before, .w3-bar::before, .w3-bar::after {
    content: "";
    display: table;
    clear: both;
}

nav {
    display: block;
}

.w3-hide {
    display: none !important;
}

#top-nav-bar .tnb-mobile-nav {
    display: none;
    position: fixed;
    width: 100%;
    top: 56px;
    bottom: 0px;
    flex-direction: column;
    overflow: auto scroll;
    font-family: "Source Sans Pro Topnav", sans-serif;
    border-top: 1px solid rgb(40, 42, 53);
    letter-spacing: 0px;
    cursor: default;
    background-color: rgb(245, 246, 247);
    color: rgb(0, 0, 0);
}

.darkpagetheme #top-nav-bar .tnb-mobile-nav {
    background-color: rgb(40, 42, 53);
    color: rgb(255, 255, 255);
}

#top-nav-bar #dropdown-nav-outer-wrapper {
    position: relative;
    display: block;
    margin-top: 56px;
    width: 100%;
    height: 0px;
    z-index: inherit;
}

#googleSearch {
    color: rgb(0, 0, 0);
}

#top-nav-bar #googleSearch {
    position: absolute;
    display: block;
    height: 1px;
    width: 1px;
    top: 0px;
}

#subtopnav {
    position: fixed;
    background-color: rgb(40, 42, 53);
    color: rgb(241, 241, 241);
    padding: 0px;
    letter-spacing: 1px;
    font-family: "Source Sans Pro Topnav", sans-serif;
    font-size: 0px;
    top: 56px;
    z-index: 2;
    width: 100%;
    white-space: nowrap;
    overflow: auto;
    scrollbar-width: none;
    max-width: 1750px;
    margin: auto;
    left: 0px;
    right: 0px;
}

body.darkpagetheme #subtopnav {
    background-color: rgb(13, 23, 33) !important;
}

.belowtopnavcontainer {
    max-width: 1750px;
    margin: auto;
}

#footerwrapper {
    background-color: rgb(40, 42, 53);
}

body.darkpagetheme #footerwrapper {
    background-image: url("./images/bg_sky_darker.gif") !important;
}

a {
    background-color: transparent;
}

a {
    color: inherit;
}

.w3-button {
    border: none;
    display: inline-block;
    padding: 8px 16px;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background-color: inherit;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
}

.w3-button {
    user-select: none;
}

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

.w3-bar .w3-bar-item {
    padding: 8px 16px;
    float: left;
    width: auto;
    border: none;
    display: block;
    outline: 0px;
}

.w3-bar .w3-button {
    white-space: normal;
}

a:active, a:hover {
    outline-width: 0px;
}

a:hover, a:active {
    color: rgb(5, 152, 98);
}

.w3-button:hover {
    color: rgb(0, 0, 0) !important;
    background-color: rgb(204, 204, 204) !important;
}

.w3-hover-none:hover {
    background-color: transparent !important;
}

.w3-hover-none:hover {
    box-shadow: none !important;
}

#top-nav-bar .tnb-desktop-nav {
    padding: 0px;
    display: block;
}

.w3-padding-16 {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

#top-nav-bar .tnb-menu-btn {
    width: 93px;
    display: none;
}

.bar-item-hover:hover {
    background-color: rgb(4, 170, 109) !important;
    color: white !important;
}

#top-nav-bar #tnb-google-search-container {
    position: relative;
    display: block;
    padding: 10px 8px;
}

#top-nav-bar #tnb-menu-toggle-wrapper {
    position: relative;
    float: left;
    display: block;
    height: 49px;
    width: 39px;
    padding-top: 10px;
    box-sizing: border-box;
}

#top-nav-bar .tnb-right-section {
    height: 100%;
    overflow: hidden;
    white-space: nowrap;
}

.w3-container {
    padding: 0.01em 16px;
}

#top-nav-bar .tnb-mobile-nav > .w3-container {
    height: 100%;
    position: relative;
    padding: 84px 0px 100px;
}

.w3-round {
    border-radius: 4px;
}

#top-nav-bar .tnb-close-menu-btn {
    position: absolute;
    display: block;
    top: 10px;
    right: 10px;
    width: 64px;
    height: 64px;
    padding: 0px;
}

#top-nav-bar .tnb-close-menu-btn:hover {
    background-color: rgb(251, 251, 251) !important;
}

#top-nav-bar #dropdown-nav-outer-wrapper #dropdown-nav-inner-wrapper {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

#scroll_left_btn {
    cursor: pointer;
    display: none;
    position: fixed;
    left: 0px;
    top: 56px;
    font-size: 15px;
}

#scroll_left_btn {
    cursor: pointer;
    display: none;
    position: fixed;
    left: auto;
    top: auto;
    font-size: 15px;
}

#scroll_right_btn {
    cursor: pointer;
    float: left;
    font-size: 15px;
    background: linear-gradient(to left, rgb(40, 42, 53) 70%, transparent 100%);
    padding-top: 5px;
    padding-bottom: 5px;
}

#scroll_right_btn {
    cursor: pointer;
    position: fixed;
    font-size: 15px;
    display: none;
}

body.darkpagetheme #scroll_right_btn {
    background: linear-gradient(to left, rgb(13, 23, 33) 70%, transparent 100%);
}

#scroll_right_btn:hover {
    background: linear-gradient(to left, rgb(0, 0, 0) 95%, transparent 100%);
}

#menubtn_container {
    position: fixed;
    left: 0px;
    top: 56px;
    height: 33px;
    color: white;
    font-size: 15px;
}

#subtopnav a {
    display: inline-block;
    width: auto;
    text-decoration: none;
    line-height: 1.5;
    margin: 0px !important;
    padding: 5px 15px !important;
    font-size: 15px !important;
}

#subtopnav a.active {
    background-color: rgb(4, 170, 109) !important;
    color: rgb(255, 255, 255) !important;
}

#subtopnav a:hover, #subtopnav a:active {
    background-color: rgb(0, 0, 0) !important;
    color: rgb(255, 255, 255) !important;
}

#subtopnav a:hover, #subtopnav a:focus, #subtopnav a:active {
    background-color: rgb(0, 0, 0) !important;
    color: rgb(255, 255, 255) !important;
}

.w3-sidebar {
    height: 100%;
    width: 230px;
    background-color: rgb(255, 255, 255);
    z-index: 2;
    overflow: auto;
    position: fixed !important;
}

@media (min-width: 993px) {
    .w3-sidebar.w3-collapse {
        display: block !important;
    }
}

body.darkpagetheme .w3-sidebar {
    background-color: rgb(21, 32, 43);
}

.w3-light-grey {
    color: rgb(0, 0, 0) !important;
    background-color: rgb(241, 241, 241) !important;
}

.w3-main {
    transition: margin-left;
    min-width: 330px;
}

#spacemyfooter {
    padding: 40px 80px 20px;
    max-width: 1500px;
    margin: auto;
}

@media screen and (max-width: 1450px) {
    #spacemyfooter {
        max-width: 1100px;
    }
}

.fa {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    font-size-adjust: none;
    font-language-override: normal;
    font-kerning: auto;
    font-optical-sizing: auto;
    font-feature-settings: normal;
    font-variation-settings: normal;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1;
    font-family: fontawesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    transform: translate(0px, 0px);
}

.fa-logo::before {
    content: "";
}

.fa-caret-down::before {
    content: "";
}

.fa-caret-up::before {
    content: "";
}

#top-nav-bar #tnb-google-search-container > #tnb-google-search-inner-container {
    position: relative;
    display: block;
    width: 175px;
}

#top-nav-bar #tnb-google-search-container #tnb-google-search-mobile-action-btns {
    display: none;
    float: left;
}

.w3-tooltip {
    position: relative;
}

#top-nav-bar #tnb-menu-toggle-wrapper a {
    position: relative;
    border-radius: 50px;
    display: inline-block;
    height: 36px;
    width: 36px;
    padding: 4px 0px;
    box-sizing: border-box;
    overflow: visible;
}

#top-nav-bar #tnb-menu-toggle-wrapper a:hover {
    background-color: rgb(241, 241, 241) !important;
}

.darkpagetheme #top-nav-bar #tnb-menu-toggle-wrapper a:hover {
    background-color: rgb(56, 68, 77) !important;
}

.w3-btn {
    border: none;
    display: inline-block;
    padding: 8px 16px;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background-color: inherit;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
}

.w3-btn {
    user-select: none;
}

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

.w3-btn {
    color: rgb(255, 255, 255);
    background-color: rgb(76, 175, 80);
}

body.w3s-user-anonymous .user-anonymous {
    display: block !important;
}

#top-nav-bar .tnb-right-section > * {
    margin-bottom: 56px;
}

#top-nav-bar .tnb-right-section .w3-btn {
    margin-right: 10px;
    margin-left: 0px;
}

#top-nav-bar .tnb-right-section .tnb-login-btn {
    position: relative;
    width: 95px;
    height: 40px;
    top: 50%;
    margin-top: -20px;
    background-color: rgb(4, 170, 109);
    color: rgb(255, 255, 255);
    border-radius: 8px;
    font-size: 14px;
    line-height: 22px;
    z-index: 4;
    font-family: "Source Sans Pro", sans-serif;
}

.w3-btn:hover {
    box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 16px 0px, rgba(0, 0, 0, 0.19) 0px 6px 20px 0px;
}

.w3-btn:hover, .w3-btn:active {
    box-shadow: none;
    background-color: rgb(5, 152, 98) !important;
}

#top-nav-bar .tnb-right-section .tnb-login-btn:hover {
    background-color: rgb(5, 152, 98) !important;
    color: rgb(255, 255, 255) !important;
}

.user-profile-btn {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    top: 50%;
    margin-top: -22px;
    padding: 0px !important;
}

body.w3s-user-anonymous .user-authenticated {
    display: none !important;
}

#top-nav-bar .user-profile-btn {
    user-select: none;
}

#top-nav-bar .user-profile-btn {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 25px;
    white-space: normal;
    text-align: center;
    cursor: pointer;
    outline: none !important;
    text-decoration: none !important;
    color: rgb(0, 0, 0) !important;
}

#top-nav-bar .user-profile-btn {
    position: relative;
    display: block;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    float: right;
    top: 50%;
    margin-top: -22px;
    text-decoration: none;
}

.darkpagetheme #top-nav-bar .user-profile-btn {
    color: rgb(221, 221, 221) !important;
}

#top-nav-bar .user-authenticated.w3-hide {
    display: none !important;
}

#top-nav-bar .tnb-right-section .w3-alt-btn {
    margin-right: 10px;
    margin-left: 0px;
}

#top-nav-bar .user-profile-btn:hover {
    background-color: rgb(241, 241, 241) !important;
}

.darkpagetheme #top-nav-bar .user-profile-btn:hover {
    background-color: rgb(56, 68, 77) !important;
}

#top-nav-bar .tnb-right-section .w3-button {
    margin-right: 10px;
    margin-left: 0px;
}

#top-nav-bar .tnb-right-section .tnb-right-side-btn {
    position: relative;
    text-align: center;
    height: 40px;
    top: 50%;
    margin-top: -20px;
    border-radius: 25px;
    padding: 8px 16px;
    width: auto !important;
}

#top-nav-bar .tnb-right-section .tnb-certificates-btn {
    position: relative;
    height: 40px;
    top: 50%;
    margin-top: -20px;
    border-radius: 25px;
    padding: 8px 16px;
}

.w3-button:hover.w3-white, .w3-button:active.w3-white {
    background-color: rgb(241, 241, 241) !important;
}

body.darkpagetheme .w3-button:hover.w3-white, body.darkpagetheme .w3-button:active.w3-white {
    background-color: rgb(56, 68, 77) !important;
}

#top-nav-bar .tnb-right-section .tnb-upgrade-btn {
    position: relative;
    display: block;
    border-radius: 25px;
    background-color: rgb(151, 99, 246);
    color: rgb(255, 255, 255);
    width: 115px;
    height: 40px;
    top: 50%;
    margin-top: -20px;
}

body.darkpagetheme .w3-btn:hover.w3-white, body.darkpagetheme .w3-btn:active.w3-white, body.darkpagetheme .w3-button:hover.w3-white, body.darkpagetheme .w3-button:active.w3-white {
    background-color: rgb(56, 68, 77) !important;
}

#top-nav-bar .tnb-right-section .tnb-spaces-btn {
    position: relative;
    text-align: center;
    height: 40px;
    top: 50%;
    margin-top: -20px;
    border-radius: 25px;
    padding: 8px 16px;
    width: auto !important;
}

#top-nav-bar .user-authenticated.w3-hide, #top-nav-bar .tnb-right-side-btn.w3-hide {
    display: none !important;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .w3-button {
    position: relative;
    width: 100%;
    border-bottom: 1px solid rgb(67, 68, 74);
    padding: 20px 30px;
    text-align: left;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .w3-button:hover {
    background-color: rgb(251, 251, 251) !important;
    color: rgb(0, 0, 0) !important;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .tnb-mobile-nav-section > .w3-button:hover, #top-nav-bar .tnb-mobile-nav > .w3-container > .tnb-mobile-nav-section > .w3-button.tnb-active, #top-nav-bar .tnb-mobile-nav > .w3-container > .w3-button:hover, #top-nav-bar .tnb-mobile-nav > .w3-container > .w3-button.tnb-active {
    background-color: rgb(251, 251, 251) !important;
    color: rgb(0, 0, 0) !important;
}

#top-nav-bar .tnb-social-network-btns {
    position: relative;
    display: block;
    width: 100%;
    float: left;
    padding: 100px 17px 20px;
}

#top-nav-bar .tnb-close-menu-btn > span {
    position: absolute;
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-size: 48px;
    top: 50%;
    margin-top: -12px;
    left: 50%;
    margin-left: -12px;
}

#nav_tutorials {
    overflow: auto;
}

#nav_tutorials {
    display: none;
    letter-spacing: 0px;
    position: absolute;
    width: 100%;
    background-color: rgb(40, 42, 53);
    color: white;
    padding-bottom: 40px;
    z-index: 5 !important;
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

body.darkpagetheme #nav_tutorials {
    background-color: rgb(13, 23, 33);
    color: white;
}

#top-nav-bar #dropdown-nav-outer-wrapper #dropdown-nav-inner-wrapper .dropdown-nav {
    position: relative;
    top: 0px;
    height: 100%;
    width: 100%;
    overflow-y: scroll;
    background-color: rgb(40, 42, 53);
    color: white;
    padding-bottom: 60px;
    padding-top: 35px;
}

#top-nav-bar #nav_tutorials::-webkit-scrollbar, #top-nav-bar #nav_references::-webkit-scrollbar, #top-nav-bar #nav_exercises::-webkit-scrollbar, #top-nav-bar #nav_certified::-webkit-scrollbar, #top-nav-bar #nav_services::-webkit-scrollbar {
    width: 10px;
}

#nav_references {
    overflow: auto;
}

#nav_references {
    display: none;
    letter-spacing: 0px;
    position: absolute;
    width: 100%;
    background-color: rgb(40, 42, 53);
    color: white;
    padding-bottom: 40px;
    z-index: 5 !important;
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

body.darkpagetheme #nav_references {
    background-color: rgb(13, 23, 33);
    color: white;
}

#nav_exercises {
    overflow: auto;
}

#nav_exercises {
    display: none;
    letter-spacing: 0px;
    position: absolute;
    width: 100%;
    background-color: rgb(40, 42, 53);
    color: white;
    padding-bottom: 40px;
    z-index: 5 !important;
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

body.darkpagetheme #nav_exercises {
    background-color: rgb(13, 23, 33);
    color: white;
}

#nav_certified {
    overflow: auto;
}

#nav_certified {
    display: none;
    letter-spacing: 0px;
    position: absolute;
    width: 100%;
    background-color: rgb(40, 42, 53);
    color: white;
    padding-bottom: 40px;
    z-index: 5 !important;
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

#nav_services {
    overflow: auto;
}

#nav_services {
    display: none;
    letter-spacing: 0px;
    position: absolute;
    width: 100%;
    background-color: rgb(40, 42, 53);
    color: white;
    padding-bottom: 40px;
    z-index: 5 !important;
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

#top-nav-bar #nav_services {
    border-top: 1px solid rgb(40, 42, 53) !important;
    background-color: rgb(245, 246, 247) !important;
    color: rgb(40, 42, 53) !important;
}

.darkpagetheme #top-nav-bar #nav_services {
    border-top: 1px solid rgb(13, 23, 33) !important;
    background-color: rgb(13, 23, 33) !important;
    color: rgb(255, 255, 255) !important;
}

.darktheme #nav_services::-webkit-scrollbar-track {
    background: rgb(13, 23, 33);
}

#scroll_left_btn span {
    background: linear-gradient(to right, rgb(40, 42, 53) 70%, transparent 100%);
    display: block;
    padding-top: 5px;
    padding-bottom: 5px;
}

body.darkpagetheme #scroll_left_btn span {
    background: linear-gradient(to right, rgb(13, 23, 33) 70%, transparent 100%);
}

#scroll_left_btn span:hover {
    background: linear-gradient(to right, rgb(0, 0, 0) 95%, transparent 100%);
}

#menubtn_container span {
    background-color: rgb(40, 42, 53);
}

#leftmenuinner {
    position: fixed;
    top: 0px;
    padding-bottom: 0px;
    height: 100%;
    width: 230px;
    background-color: transparent;
}

#leftmenuinner {
    padding-top: 87px;
}

#leftmenuinner {
    width: 230px;
}

#footer {
    padding: 32px;
    border-top: 1px solid rgb(241, 241, 241);
}

body.darkpagetheme #footer {
    border-top: 1px solid rgb(56, 68, 77);
    background-color: rgb(29, 42, 53);
}

#err_message {
    padding: 8px 16px 16px 40px;
    border-radius: 5px;
    display: none;
    position: relative;
    background-color: rgb(45, 55, 72);
    color: rgb(255, 244, 163);
    font-family: "Source Sans Pro", sans-serif;
}

.footersome {
    padding: 60px 40px 10px;
    color: rgb(221, 221, 221);
    font-size: 20px;
    text-align: center;
}

.footertext {
    color: rgb(221, 221, 221);
    font-size: 12px;
    line-height: 15px;
    text-align: center;
}

#top-nav-bar .tnb-soft-hide {
    clip: rect(0px, 0px, 0px, 0px);
    border: 0px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0px;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

input {
    font: inherit;
    margin: 0px;
}

input {
    overflow: visible;
}

#top-nav-bar #tnb-google-search-container input {
    padding: 5px 40px 5px 15px;
    border-radius: 25px;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.25) !important;
}

#top-nav-bar #tnb-google-search-container input:placeholder-shown {
    font-style: italic;
}

#top-nav-bar .tnb-button-light {
    user-select: none;
}

#top-nav-bar .tnb-button-light {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 25px;
    white-space: normal;
    text-align: center;
    cursor: pointer;
    outline: none !important;
    text-decoration: none !important;
    color: rgb(0, 0, 0) !important;
}

#top-nav-bar .tnb-button-light {
    color: rgb(0, 0, 0) !important;
}

.darkpagetheme #top-nav-bar .tnb-button-light {
    color: rgb(221, 221, 221) !important;
}

.darkpagetheme #top-nav-bar .tnb-button-light {
    color: rgb(0, 0, 0) !important;
}

#top-nav-bar #tnb-google-search-container #tnb-google-search-submit-btn {
    position: absolute;
    right: 1px;
    top: 1px;
    padding: 8px;
}

#top-nav-bar .tnb-button:hover, #top-nav-bar .user-profile-btn:hover, #top-nav-bar .tnb-button-dark-v2:hover, #top-nav-bar .tnb-button-dark:hover, #top-nav-bar .tnb-button-light:hover, #top-nav-bar .tnb-button-inverted:hover {
    background-color: rgb(241, 241, 241) !important;
}

#top-nav-bar .tnb-button-light:hover {
    background-color: rgb(241, 241, 241) !important;
}

.darkpagetheme #top-nav-bar .tnb-button:hover, .darkpagetheme #top-nav-bar .user-profile-btn:hover, .darkpagetheme #top-nav-bar .tnb-button-dark-v2:hover, .darkpagetheme #top-nav-bar .tnb-button-dark:hover, .darkpagetheme #top-nav-bar .tnb-button-light:hover, .darkpagetheme #top-nav-bar .tnb-button-inverted:hover {
    background-color: rgb(56, 68, 77) !important;
}

.darkpagetheme #top-nav-bar .tnb-button-light:hover {
    background-color: rgb(241, 241, 241) !important;
}

#top-nav-bar .tnb-button {
    user-select: none;
}

#top-nav-bar .tnb-button {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 25px;
    white-space: normal;
    text-align: center;
    cursor: pointer;
    outline: none !important;
    text-decoration: none !important;
    color: rgb(0, 0, 0) !important;
}

.darkpagetheme #top-nav-bar .tnb-button {
    color: rgb(221, 221, 221) !important;
}

#top-nav-bar #tnb-google-search-container #tnb-google-search-mobile-action-btns > .tnb-button {
    padding: 9px;
    float: left;
}

#top-nav-bar #tnb-google-search-container #tnb-google-search-mobile-action-btns #tnb-google-search-mobile-close {
    display: none;
}

.w3-tooltip .w3-text {
    display: none;
}

#top-nav-bar #tnb-menu-toggle-wrapper .w3-text {
    position: absolute;
    background-color: rgb(40, 42, 53);
    color: rgb(255, 255, 255);
    padding: 3px 18px;
    border-radius: 5px;
    z-index: 100;
    left: 50px;
    white-space: nowrap;
    height: 30px;
}

.darkpagetheme #top-nav-bar #tnb-menu-toggle-wrapper .w3-text {
    background-color: rgb(241, 241, 241);
    color: rgb(40, 42, 53);
}

.w3-tooltip:hover .w3-text {
    display: inline-block;
}

#top-nav-bar #tnb-menu-toggle-wrapper a svg {
    width: 27px;
    height: 27px;
    display: block;
    margin: 0px auto;
}

.darkpagetheme #top-nav-bar #tnb-menu-toggle-wrapper svg {
    fill: rgb(241, 241, 241);
}

#top-nav-bar .tnb-right-section .tnb-login-btn .tnb-sign-in-icon {
    position: relative;
    right: 4px;
    top: 2px;
}

#top-nav-bar .tnb-right-section .button-loader {
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 16px;
    height: 16px;
    border-width: 1.5px;
    border-style: solid;
    border-color: white rgba(255, 255, 255, 0.3) rgba(255, 255, 255, 0.3);
    border-image: initial;
    border-radius: 50%;
    animation: 0.8s linear 0s infinite normal none running spin;
}

.user-profile-btn > .user-profile-icon {
    position: relative;
    display: block;
    width: 26px;
    height: 26px;
    top: 7px;
    left: 9px;
}

#top-nav-bar .user-profile-btn > svg {
    user-select: none;
}

.user-profile-btn > .user-progress {
    position: absolute;
    top: -14px;
    left: -4px;
    height: 70px;
    width: 70px;
}

.user-profile-btn > .user-progress-star {
    position: absolute;
    top: -20px;
    left: -12px;
    line-height: normal;
    font-size: 12px;
    animation-name: user-progress-star-animation;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-fill-mode: forwards;
    display: none;
}

#top-nav-bar .user-profile-btn > span {
    user-select: none;
}

.user-profile-btn > .user-progress-point {
    position: absolute;
    top: -6px;
    left: -4px;
    line-height: normal;
    font-size: 12px;
    font-family: consolas, Menlo, monospace;
    background-color: transparent;
    color: transparent;
    border-radius: 5px;
    padding: 1px 3px;
    animation-name: user-progress-point-animation;
    animation-duration: 3s;
    animation-timing-function: linear;
    display: none;
    z-index: 10;
}

#top-nav-bar .tnb-right-section .tnb-right-side-btn > svg {
    position: relative;
    right: 2px;
    top: 3px;
    margin-right: 3px;
    width: 18px;
    height: 18px;
    color: rgb(151, 99, 246);
}

#top-nav-bar .tnb-right-section .tnb-certificates-btn > svg {
    position: relative;
    right: 2px;
    top: 3px;
    margin-right: 3px;
    width: 18px;
    height: 18px;
    color: rgb(151, 99, 246);
}

#top-nav-bar .tnb-right-section .tnb-upgrade-btn > svg {
    position: relative;
    right: 2px;
    top: 2px;
    margin-right: 3px;
    width: 12px;
    height: 16px;
    color: rgb(255, 255, 255);
}

#top-nav-bar .tnb-right-section .tnb-spaces-btn > svg {
    position: relative;
    right: 2px;
    top: 3px;
    margin-right: 3px;
    width: 18px;
    height: 18px;
    color: rgb(151, 99, 246);
}

#top-nav-bar .tnb-toggle-darkmode-switch {
    display: inline-block;
    position: relative;
    width: 50px;
    height: 24px;
    background: rgb(230, 233, 234);
    border-radius: 16px;
    vertical-align: middle;
    margin: 0px 10px;
    cursor: pointer;
    transition: background-color 0.3s;
}

#top-nav-bar .tnb-toggle-darkmode-switch:has(input:checked) {
    background: rgb(4, 170, 109);
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .w3-button > .tnb-title {
    font-size: 21px;
    line-height: 26px;
    font-weight: normal;
    display: inline-block;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .tnb-mobile-nav-section > .w3-button {
    position: relative;
    width: 100%;
    border-bottom: 1px solid rgb(67, 68, 74);
    padding: 20px 30px;
    text-align: left;
}

#sectionxs_tutorials {
    background-color: rgb(40, 42, 53);
    color: white;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .tnb-mobile-nav-section > .tnb-mobile-nav-section-body {
    display: none;
}

#sectionxs_references {
    background-color: rgb(40, 42, 53);
    color: white;
}

#sectionxs_exercises {
    background-color: rgb(40, 42, 53);
    color: white;
}

#sectionxs_certified {
    background-color: rgb(40, 42, 53);
    color: white;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .w3-button > .tnb-icon {
    position: absolute;
    top: 50%;
    right: 30px;
    margin-top: -11px;
    height: 22px;
    width: 22px;
    display: inline-block;
    font-size: 30px;
    text-align: center;
}

#top-nav-bar .tnb-social-network-btns > .w3-button {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
    padding: 0px;
    margin-right: 10px;
}

#top-nav-bar .tnb-social-network-btns > .w3-button:hover {
    background-color: rgb(251, 251, 251) !important;
}

#top-nav-bar .tnb-social-network-btns > .w3-button:hover, #top-nav-bar .tnb-social-network-btns > .w3-button.tnb-active {
    background-color: rgb(251, 251, 251) !important;
}

.w3-content {
    margin-left: auto;
    margin-right: auto;
}

.w3-content {
    max-width: 980px;
}

#top-nav-bar .menu-content {
    max-width: 1100px;
    font-size: 18px;
    padding-left: 3%;
    padding-right: 3%;
    margin: 0px auto 25px;
}

#top-nav-bar .tnb-close-nav-btn {
    position: absolute;
    display: block;
    top: 10px;
    right: 10px;
    width: 64px;
    height: 64px;
    padding: 0px;
}

#top-nav-bar .tnb-close-menu-btn:hover, #top-nav-bar .tnb-close-nav-btn:hover, #top-nav-bar .tnb-close-menu-btn.tnb-active, #top-nav-bar .tnb-active.tnb-close-nav-btn {
    background-color: rgb(251, 251, 251) !important;
}

#top-nav-bar #nav_services > .w3-content {
    max-width: 1100px;
    font-size: 18px;
}

@media (min-width: 993px) {
    .w3-hide-large {
        display: none !important;
    }
}

a.topnav-icons {
    width: 52px !important;
}

a.topnav-icons {
    font-size: 17px !important;
}

a.topnav-icons.fa-menu {
    font-size: 16px !important;
}

.fa-menu::before {
    content: "";
}

#leftmenuinnerinner {
    height: 100%;
    width: 100%;
    background-color: rgb(231, 233, 235);
    overflow: hidden scroll;
    padding-top: 20px;
}

body.darkpagetheme #leftmenuinnerinner {
    background-color: rgb(21, 32, 43);
    color: rgb(204, 204, 204);
}

#sidenav #leftmenuinnerinner {
    position: relative;
}

body.darkpagetheme #leftmenuinnerinner::-webkit-scrollbar {
    width: 12px;
}

body.darkpagetheme #leftmenuinnerinner::-webkit-scrollbar-thumb {
    background: rgb(41, 53, 62);
}

body.darkpagetheme #leftmenuinnerinner::-webkit-scrollbar-track {
    background: rgb(21, 32, 43);
}

body.darkpagetheme #leftmenuinnerinner::-webkit-scrollbar-thumb:hover {
    background-color: rgb(64, 78, 89);
}

.w3-col {
    float: left;
    width: 100%;
}

@media (min-width: 601px) {
    .w3-col.m12 {
        width: 100%;
    }
}

@media (min-width: 993px) {
    .w3-col.l10 {
        width: 83.3333%;
    }
}

#main {
    padding: 16px;
    margin-top: 90px;
}

#main {
    padding: 16px 32px 32px;
    border-right: 1px solid rgb(241, 241, 241);
}

body.darkpagetheme #main {
    border-right: 1px solid rgb(56, 68, 77);
}

@media (min-width: 993px) {
    .w3-col.l2 {
        width: 16.6667%;
    }
}

#right {
    text-align: center;
    padding: 16px 16px 0px 0px;
    margin-top: 90px;
}

#right {
    padding: 16px 8px;
}

hr {
    box-sizing: content-box;
    height: 0px;
    overflow: visible;
}

hr {
    border-width: 1px 0px 0px;
    border-right-style: initial;
    border-bottom-style: initial;
    border-left-style: initial;
    border-right-color: initial;
    border-bottom-color: initial;
    border-left-color: initial;
    border-image: initial;
    border-top-style: solid;
    border-top-color: rgb(238, 238, 238);
    margin: 20px 0px;
}

hr {
    margin: 20px -16px;
}

body.darkpagetheme hr {
    border-top: 1px solid rgb(56, 68, 77);
}

#footer hr:first-child {
    display: none;
}

#bottomads {
    display: none;
}

.footerlinks_1 {
    width: auto;
    float: left;
    padding: 40px 60px;
    color: rgb(255, 244, 163);
    font-family: "Source Sans Pro", sans-serif;
    font-size: 15px;
}

@media screen and (max-width: 1450px) {
    .footerlinks_1 {
        padding-left: 30px;
        padding-right: 30px;
    }
}

.footerlinks_1:nth-child(1) {
    padding: 30px 10px 30px 40px;
}

#err_message #close_err_message {
    position: absolute;
    right: 0px;
    top: 0px;
    font-size: 20px;
    cursor: pointer;
    width: 30px;
    height: 30px;
    text-align: center;
}

#err_message #close_err_message:hover {
    background-color: rgb(255, 244, 163);
    color: rgb(45, 55, 72);
    border-radius: 50%;
}

h2 {
    font-size: 30px;
}

h2 {
    font-family: "Segoe UI", Arial, sans-serif;
    font-weight: 400;
    margin: 10px 0px;
}

h2 {
    font-size: 32px;
}

#err_message h2 {
    font-family: "Source Sans Pro", sans-serif;
}

p {
    margin-top: 1.2em;
    margin-bottom: 1.2em;
    font-size: 16px;
}

#err_message p {
    color: rgb(241, 241, 241);
}

.footerlinks_2 {
    width: auto;
    float: left;
    padding-left: 90px;
    padding-right: 135px;
    color: rgb(221, 221, 221);
    font-family: "Source Sans Pro", sans-serif;
    font-size: 12px;
    line-height: 15px;
    text-align: center;
}

@media screen and (max-width: 1450px) {
    .footerlinks_2 {
        padding-right: 30px;
    }

    .footerlinks_2:nth-child(1) {
        padding-left: 50px;
    }
}

.footerlinks_2:nth-child(4) {
    padding-right: 0px;
}

.footersome a {
    margin-right: 10px;
}

.footersome a:hover, .footersome a:active {
    color: rgb(255, 244, 163);
}

.footersome .textlink {
    font-size: 15px;
    text-decoration: none;
}

.footersome .textlink:active, .footersome .textlink:hover {
    text-decoration: underline;
}

@media screen and (max-width: 1450px) {
    .footer-hide-special {
        display: none;
    }
}

.footertext a:hover, .footertext a:active {
    color: rgb(255, 244, 163);
}

button {
    font: inherit;
    margin: 0px;
}

button {
    overflow: visible;
}

button {
    text-transform: none;
}

button {
    appearance: button;
}

#top-nav-bar .tnb-button-light > svg {
    user-select: none;
}

#top-nav-bar #tnb-google-search-container #tnb-google-search-submit-btn > svg {
    width: 18px;
    height: 18px;
    text-align: center;
    display: block;
    float: left;
}

#top-nav-bar .tnb-button > svg {
    user-select: none;
}

#top-nav-bar #tnb-google-search-container #tnb-google-search-mobile-action-btns > .tnb-button > svg {
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-size: 18px;
    text-align: center;
    display: block;
    float: left;
}

#top-nav-bar .tnb-button > i {
    user-select: none;
}

#top-nav-bar .tnb-button > i {
    font-style: normal !important;
}

#top-nav-bar #tnb-google-search-container #tnb-google-search-mobile-action-btns > .tnb-button > i {
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-size: 18px;
    text-align: center;
    display: block;
    float: left;
}

#top-nav-bar #tnb-google-search-container #tnb-google-search-mobile-action-btns #tnb-google-search-mobile-close > i {
    font-size: 29px;
}

[type="checkbox"] {
    padding: 0px;
}

#top-nav-bar .tnb-toggle-darkmode-switch input {
    display: none;
}

#top-nav-bar .tnb-toggle-darkmode-switch input:checked {
    background: rgb(4, 170, 109);
}

#top-nav-bar .tnb-toggle-darkmode-slider {
    position: absolute;
    top: 1px;
    left: 2px;
    width: 21px;
    height: 21px;
    background: rgb(241, 241, 241);
    border-radius: 50%;
    transition: 0.3s;
    color: black;
    font-size: 26px !important;
}

#top-nav-bar .tnb-toggle-darkmode-switch input:checked + .tnb-toggle-darkmode-slider {
    left: 27px;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .tnb-mobile-nav-section > .w3-button > .tnb-title {
    font-size: 21px;
    line-height: 26px;
    font-weight: normal;
    display: inline-block;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .tnb-mobile-nav-section > .w3-button > .tnb-icon {
    position: absolute;
    top: 50%;
    right: 30px;
    margin-top: -11px;
    height: 22px;
    width: 22px;
    display: inline-block;
    font-size: 30px;
    text-align: center;
}

#top-nav-bar .tnb-mobile-nav > .w3-container > .tnb-mobile-nav-section > .w3-button > .tnb-icon.fa-caret-down {
    height: 10px;
    margin-top: -5px;
    line-height: 12px;
}

#top-nav-bar .tnb-social-network-btns > .w3-button > .tnb-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -12px;
    margin-left: -12px;
    height: 24px;
    width: 24px;
    line-height: 24px;
    font-size: 24px;
    display: inline-block;
    text-align: center;
}

#top-nav-bar .tnb-social-network-btns > .w3-button > .tnb-icon.fa-youtube {
    font-size: 20px;
    margin-left: -13px;
}

.fa-youtube::before {
    content: "";
}

#top-nav-bar .tnb-social-network-btns > .w3-button > .tnb-icon.-discord {
    font-size: 20px;
    margin-left: -13px;
}

.w3-row-padding {
    padding: 0px 8px;
}

#top-nav-bar .tnb-close-nav-btn > span {
    position: absolute;
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-size: 48px;
    top: 50%;
    margin-top: -12px;
    left: 50%;
    margin-left: -12px;
}

#sidenav h2 {
    font-size: 21px;
    padding-left: 16px;
    margin: -4px 0px 4px;
    width: 204px;
}

#sidenav a {
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 15px;
    text-decoration: none;
    display: block;
    padding: 2px 1px 1px 16px;
}

#sidenav a.active {
    background-color: rgb(4, 170, 109) !important;
    color: rgb(255, 255, 255) !important;
}

#sidenav #leftmenuinnerinner a {
    position: relative;
    padding: 2px 15px 1px 17px;
    width: 100%;
}

#sidenav #leftmenuinnerinner a:not(.no-checkmark)::before {
    display: none;
    font-family: fontawesome;
    content: "";
    opacity: 0.1;
    position: absolute;
    top: 4px;
    left: 12px;
    margin-right: 3px;
    font-size: 18px;
    z-index: 3;
}

#sidenav #leftmenuinnerinner:not(.checkmarks-enabled) a::before, #sidenav #leftmenuinnerinner:not(.checkmarks-enabled) a::after {
    display: none !important;
}

.darktheme #sidenav #leftmenuinnerinner a:not(.no-checkmark)::before {
    opacity: 0.3;
}

#sidenav #leftmenuinnerinner a:not(.no-checkmark):not(.done).active::before {
    color: rgb(255, 255, 255);
    opacity: 0.3;
}

#sidenav #leftmenuinnerinner a:not(.no-checkmark)::after {
    font-family: fontawesome;
    content: " ";
    position: absolute;
    display: inline-block;
    border-left: 2px solid rgb(0, 0, 0);
    opacity: 0.1;
    height: 100%;
    left: 4px;
    top: 0px;
    z-index: 2;
}

.darktheme #sidenav #leftmenuinnerinner a:not(.no-checkmark)::after {
    opacity: 0.3;
    border-left: 2px solid rgb(221, 221, 221);
}

#sidenav a:hover {
    color: rgb(0, 0, 0);
    background-color: rgb(204, 204, 204);
}

body.darkpagetheme #sidenav a:hover {
    color: rgb(221, 221, 221);
    background-color: rgb(56, 68, 77);
}

#sidenav a:hover, #sidenav a:focus {
    color: rgb(0, 0, 0);
    background-color: rgb(204, 204, 204);
}

body.darkpagetheme #sidenav a:hover, body.darkpagetheme #sidenav a:focus {
    color: rgb(221, 221, 221);
    background-color: rgb(56, 68, 77);
}

.tut_overview {
    display: none;
    margin-left: 10px;
    background-color: rgb(221, 221, 221);
    line-height: 1.8em;
}

body.darkpagetheme .tut_overview {
    background-color: rgb(56, 68, 77);
}

#sidenav #leftmenuinnerinner .overview_body, #sidenav #leftmenuinnerinner .tut_overview {
    margin-left: 0px !important;
    background-color: rgb(255, 255, 255) !important;
    line-height: 1.5 !important;
}

.darktheme #sidenav #leftmenuinnerinner .overview_body, .darktheme #sidenav #leftmenuinnerinner .tut_overview {
    background-color: rgb(41, 53, 62) !important;
}

#mainLeaderboard {
    height: 90px;
}

#mainLeaderboard {
    text-align: center;
    margin-left: -16px;
    margin-right: -16px;
}

#mainLeaderboard {
    height: 250px;
}

h1 {
    font-size: 36px;
}

h1 {
    font-family: "Segoe UI", Arial, sans-serif;
    font-weight: 400;
    margin: 10px 0px;
}

h1 {
    font-size: 42px;
}

#main h1.with-bookmark {
    position: relative;
    padding-right: 20px;
}

.w3-example {
    background-color: rgb(231, 233, 235);
    border-radius: 5px;
    padding: 0.01em 16px;
    margin: 20px 0px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 4px 0px, rgba(0, 0, 0, 0.12) 0px 2px 10px 0px !important;
}

.w3-example {
    padding: 8px 20px;
    margin: 24px -20px;
    box-shadow: none !important;
}

body.darkpagetheme .w3-example {
    background-color: rgb(56, 68, 77);
}

#midcontentadcontainer {
    text-align: center;
    margin-left: -16px;
    margin-right: -16px;
}

#exercisecontainer {
    font-family: "Source Sans Pro", sans-serif;
    background-color: rgb(45, 55, 72);
    text-align: center;
    padding: 20px 20px 40px;
    border-radius: 15px;
    position: relative;
    z-index: 0;
}

.w3-panel {
    padding: 0.01em 16px;
}

.w3-panel {
    margin-top: 16px;
    margin-bottom: 16px;
}

#getdiploma {
    position: relative;
    padding: 0px 60px 50px;
    margin-bottom: 125px;
    background-color: rgb(40, 42, 53);
    color: white;
    border-radius: 10px;
    font-family: "Source Sans Pro", sans-serif;
}

body.darkpagetheme #getdiploma {
    background-color: rgb(13, 23, 33) !important;
}

.w3-padding {
    padding: 8px 16px !important;
}

.user-profile-bottom-wrapper {
    position: relative;
    display: block;
    clear: both;
    width: 100%;
    text-align: center;
    float: left;
}

.sidesection {
    margin-bottom: 32px;
}

#footer-skyscraper {
    display: none;
}

.sidesection:has(#upperfeatureshowcaselink) {
    margin-top: 0px !important;
}

#vidpos {
    display: none;
}

.footerlinks_1 a {
    text-decoration: none;
}

.footerlinks_1 a:hover, .footerlinks_1 a:active {
    text-decoration: underline;
    color: rgb(255, 244, 163);
}

.footerlinks_1 a:hover, .footerlinks_1 a:active {
    text-decoration: underline;
}

h5 {
    font-size: 18px;
}

h5 {
    font-family: "Segoe UI", Arial, sans-serif;
    font-weight: 400;
    margin: 10px 0px;
}

.footerlinks_2 h5 {
    margin-bottom: 20px;
}

.footerlinks_2 a:visited {
    text-decoration: none;
}

.footerlinks_2 a:hover, .footerlinks_2 a:active {
    color: rgb(255, 244, 163);
}

.footerlinks_2 a:visited, .footerlinks_2 a:link {
    text-decoration: none;
}

#top-nav-bar .nav-heading-container {
    display: block;
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

#top-nav-bar .nav-heading-container::before {
    content: none;
}

@media (min-width: 601px) {
    .w3-col.m6 {
        width: 50%;
    }
}

@media (min-width: 993px) {
    .w3-col.l4 {
        width: 33.3333%;
    }
}

.w3-row-padding > .w3-col {
    padding: 0px 8px;
}

#top-nav-bar .menu-content > div > .w3-col {
    margin-top: -10px;
}

#top-nav-bar .serviceboxes {
    margin-top: 20px;
    padding: 0px;
}

#sidenav #leftmenuinnerinner a > .w3s-accordion {
    position: absolute;
    right: 0px;
    top: 0px;
}

#sidenav #leftmenuinnerinner a > .w3s-accordion::after {
    display: block;
    font-family: fontawesome;
    content: "";
    opacity: 0.1;
    position: absolute;
    top: 4px;
    right: 7px;
    font-size: 18px;
}

.darktheme #sidenav #leftmenuinnerinner a > .w3s-accordion::after {
    opacity: 0.3;
}

#sidenav #leftmenuinnerinner .overview_body > a, #sidenav #leftmenuinnerinner .tut_overview > a {
    padding-left: 35px !important;
}

#sidenav #leftmenuinnerinner .overview_body:not(.no-checkmark) > a::before, #sidenav #leftmenuinnerinner .tut_overview:not(.no-checkmark) > a::before, #sidenav #leftmenuinnerinner .ref_overview:not(.no-checkmark) > a::before {
    left: 8px;
}

#sidenav #leftmenuinnerinner .overview_body:not(.no-checkmark) > a::after, #sidenav #leftmenuinnerinner .tut_overview:not(.no-checkmark) > a::after, #sidenav #leftmenuinnerinner .ref_overview:not(.no-checkmark) > a::after {
    left: 14px;
}

body.darkpagetheme #sidenav .tut_overview a:hover {
    background-color: rgb(41, 53, 62);
}

body.darkpagetheme #sidenav .tut_overview a:hover, body.darkpagetheme #sidenav .ref_overview a:hover, body.darkpagetheme #sidenav .tut_overview a:focus, body.darkpagetheme #sidenav .ref_overview a:focus {
    background-color: rgb(41, 53, 62);
}

#sidenav #leftmenuinnerinner .overview_body:not(.no-checkmark) > a:last-child::after, #sidenav #leftmenuinnerinner .tut_overview:not(.no-checkmark) > a:last-child::after, #sidenav #leftmenuinnerinner .ref_overview:not(.no-checkmark) > a:last-child::after {
    transform: rotate(21deg);
    top: 0px;
    height: 28px;
    left: 9px !important;
}

.bookmark-btn {
    position: absolute;
    top: 10px;
    right: 0px;
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.nextprev a {
    font-size: 18px;
    font-family: "Source Sans Pro", sans-serif;
    padding-left: 19px;
    padding-right: 19px;
    border: 1px solid rgb(204, 204, 204);
    border-radius: 5px;
}

.w3-btn, .w3-btn:link {
    color: rgb(255, 255, 255);
    background-color: rgb(76, 175, 80);
}

.nextprev a:link {
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
}

.nextprev a.w3-left {
    background-color: rgb(4, 170, 109);
    color: rgb(255, 255, 255);
    border-color: rgb(4, 170, 109);
}

.w3-btn, .w3-btn:visited {
    color: rgb(255, 255, 255);
    background-color: rgb(76, 175, 80);
}

.nextprev a:visited {
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
}

.nextprev a.w3-right {
    background-color: rgb(4, 170, 109);
    color: rgb(255, 255, 255);
    border-color: rgb(4, 170, 109);
}

.html-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin-top: 20px;
    margin-left: -20px;
    margin-right: -20px;
    position: relative;
}

h3 {
    font-size: 24px;
}

h3 {
    font-family: "Segoe UI", Arial, sans-serif;
    font-weight: 400;
    margin: 10px 0px;
}

.w3-code {
    font-family: Consolas, Menlo, "courier new", monospace;
    font-size: 16px;
}

.w3-code {
    width: auto;
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    padding: 8px 12px;
    border-left: 4px solid rgb(76, 175, 80);
    overflow-wrap: break-word;
}

.w3-code {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
}

.w3-code {
    border-left: 4px solid rgb(4, 170, 109);
}

.w3-code {
    font-size: 15px;
}

.darktheme .w3-code {
    background-color: rgb(40, 44, 52);
    color: white;
    border-left-color: rgb(40, 44, 52);
}

.darktheme .w3-code {
    background-color: rgb(21, 32, 43);
}

.w3-margin-bottom {
    margin-bottom: 16px !important;
}

.w3-example .w3-btn {
    border-radius: 5px;
    font-size: 17px;
    font-family: "Source Sans Pro", sans-serif;
    padding: 6px 18px;
    background-color: rgb(4, 170, 109) !important;
}

strong {
    font-weight: bolder;
}

.ws-grey {
    background-color: rgb(231, 233, 235) !important;
    color: black !important;
}

.ws-btn {
    font-size: 17px;
    font-family: "Source Sans Pro", sans-serif;
    border: none;
    border-radius: 5px;
    display: inline-block;
    padding: 6px 18px;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: rgb(255, 255, 255);
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
    background-color: rgb(4, 170, 109);
}

body.darkpagetheme .ws-grey {
    background-color: rgb(56, 68, 77) !important;
    color: rgb(221, 221, 221) !important;
}

.w3-hover-green:hover {
    color: rgb(255, 255, 255) !important;
    background-color: rgb(76, 175, 80) !important;
}

.ws-btn:hover, .ws-btn:active {
    background-color: rgb(5, 152, 98) !important;
    color: rgb(255, 255, 255);
}

.remove-ads-container {
    width: 100%;
    text-align: center;
    margin-top: 5px;
}

#exercisecontainer h2 {
    color: rgb(255, 255, 255);
}

#exercisecontainer p {
    color: rgb(255, 255, 255);
    margin: auto;
    font-size: 18px !important;
    max-width: 600px !important;
}

.ws-green {
    background-color: rgb(4, 170, 109) !important;
    color: white !important;
}

.w3-blue {
    color: rgb(255, 255, 255) !important;
    background-color: rgb(33, 150, 243) !important;
}

.w3-blue:hover {
    background-color: rgb(13, 139, 242) !important;
}

.containerlog {
    display: flex;
    gap: 50px;
    margin: 0px -16px 0px 0px;
    font-family: Arial, sans-serif;
}

.w3-third {
    float: left;
    width: 100%;
}

@media (min-width: 601px) {
    .w3-third {
        width: 33.3333%;
    }
}

.w3-row-padding > .w3-third {
    padding: 0px 8px;
}

#getdiploma h2 {
    font-size: 45px;
    margin-top: 1em;
    margin-bottom: 1em;
    font-family: "Source Sans Pro", sans-serif;
}

#getdiploma p {
    font-size: 32px;
    margin-top: 1em;
    margin-bottom: 1em;
    font-family: "Source Sans Pro", sans-serif;
}

#getdiploma a {
    border-radius: 50px;
    font-size: 18px;
    background-color: rgb(4, 170, 109);
    padding: 17px 55px;
}

#getdiploma a:hover, #getdiploma a:active {
    background-color: rgb(5, 152, 98) !important;
}

#w3_cert_arrow {
    position: absolute;
    right: 220px;
    width: 220px;
    transform: rotate(10deg);
    bottom: 0px;
    z-index: 1;
}

@media screen and (max-width: 1442px) {
    #w3_cert_arrow {
        right: 212px;
        bottom: -15px;
    }
}

#w3_cert_badge {
    position: absolute;
    right: 5%;
    width: 220px;
    transform: rotate(10deg);
    bottom: -20%;
}

.nextprev a:link, .nextprev a:visited {
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
}

.w3s-pathfinder {
    font-family: "Source Sans Pro Topnav", sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
}

.w3s-pathfinder.-teaser {
    color: rgb(255, 255, 255);
    border-radius: 8px;
    position: relative;
    margin: 20px 0px 0px;
    width: 100%;
    padding: 30px;
    z-index: 0;
    background-color: rgb(40, 42, 53) !important;
}

.w3s-pathfinder.-teaser {
    background-color: transparent !important;
}

#skyscraper {
    min-height: 600px;
}

#right a {
    text-decoration: none;
}

h4 {
    font-size: 20px;
}

h4 {
    font-family: "Segoe UI", Arial, sans-serif;
    font-weight: 400;
    margin: 10px 0px;
}

#stickyadcontainer {
    z-index: 1;
}

.footerlinks_1 .fa-logo {
    font-size: 46px !important;
    color: rgb(221, 221, 221);
}

#top-nav-bar .nav-heading-container > .nav-heading-container-title {
    float: left;
    width: 33.3333%;
    height: 68px;
    padding: 0px 8px;
}

#top-nav-bar .nav-heading-container > .filter-input-wrapper {
    position: relative;
    float: left;
    width: 33.3333%;
    min-width: 330px;
    height: 46px;
    margin-top: 11px;
    margin-bottom: 11px;
    padding: 0px 8px;
}

#top-nav-bar h3 {
    font-family: "Source Sans Pro", sans-serif;
}

#nav_exercises h3 {
    padding-left: 6px;
    color: rgb(255, 244, 163);
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

#top-nav-bar .tnb-nav-section-title {
    margin-top: 35px;
}

#nav_services p {
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

#top-nav-bar .tnb-services-headlines {
    font-size: 17px;
    margin: 0px;
    padding: 30px 13px 15px;
}

#top-nav-bar .serviceboxes > .servicebox {
    display: block;
    padding: 10px;
    float: left;
    width: 33.3333%;
}

.bookmark-btn > .-svg-icon {
    position: absolute;
    display: block;
    top: 0px;
    right: 0px;
    opacity: 0;
    width: 100%;
    height: 100%;
    color: rgb(4, 170, 109);
    background-color: rgb(4, 170, 109);
}

.bookmark-btn > .-svg-icon.-active {
    opacity: 1;
}

.html-card {
    flex: 1 1 350px;
    padding: 28px 20px;
    text-decoration: none;
    text-align: center;
    border-radius: 6px;
}

.html-tutorial {
    background-color: rgb(230, 246, 240);
    color: rgb(34, 34, 34);
}

body.darkpagetheme .html-tutorial {
    background-color: rgb(21, 32, 43);
    color: rgb(221, 221, 221);
}

.float-or {
    background-color: white;
    color: black;
    position: absolute;
    top: 51%;
    left: 50%;
    padding: 8px;
    border-radius: 8px;
    font-size: 14px;
    border: 1px solid rgb(238, 238, 238);
    transform: translate(-50%, -50%);
}

body.darkpagetheme .float-or {
    background-color: rgb(0, 0, 0);
    color: white;
}

.html-course {
    background-color: rgb(244, 239, 254);
    color: black;
}

body.darkpagetheme .html-course {
    background-color: rgb(36, 52, 66);
    color: rgb(221, 221, 221);
}

.tagnamecolor {
    color: rgb(153, 0, 85);
}

.darktheme .tagnamecolor {
    color: rgb(255, 153, 153) !important;
}

.remove-ads {
    font-size: 14px;
    font-weight: 600;
    color: rgb(35, 116, 255);
    text-decoration: none;
    width: 100%;
    text-align: center;
    margin-top: 5px;
}

.remove-ads:hover {
    text-decoration: none;
    color: rgb(26, 92, 199) !important;
}

#exercisecontainer .questionmark {
    font-family: "Source Sans Pro Topnav", sans-serif;
    display: inline-block;
    position: absolute;
    cursor: pointer;
    font-size: 18px;
    padding: 0px 10px;
    background-color: rgb(66, 75, 90);
    border-radius: 15px;
    max-width: 240px;
    z-index: 1;
}

#exercisecontainer .quizoption {
    position: relative;
    font-family: "Source Sans Pro Topnav", sans-serif;
    background-color: rgba(255, 255, 255, 0.2);
    color: rgb(255, 255, 255);
    border-radius: 5px;
    width: 100%;
    padding: 8px 16px;
    margin: auto auto 4px;
    font-size: 16px;
    text-align: left;
    cursor: pointer;
    max-width: 650px !important;
}

#exercisecontainer .quizoption:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

button, [type="submit"] {
    appearance: button;
}

.left-panel {
    flex: 1 1 50%;
}

.right-panel {
    flex: 1 1 50%;
    display: flex;
    background-image: url("./images/banner_3.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: -50px;
    border-radius: 8px;
    border: 1px solid rgb(241, 241, 241);
}

.darkpagetheme .right-panel {
    background-image: url("./images/banner_dm.png");
    border: 1px solid rgb(51, 51, 51);
}

.w3-third .bigbtn {
    margin-bottom: 16px;
    width: 100%;
    padding: 20px 0px;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    border-radius: 5px;
    text-decoration: none !important;
}

body.darkpagetheme .w3-third .bigbtn {
    border: 1px solid rgb(56, 68, 77) !important;
    background-color: rgb(56, 68, 77) !important;
    color: rgb(221, 221, 221) !important;
}

.ws-hover-black:hover {
    background-color: rgb(0, 0, 0) !important;
    color: white !important;
}

body.darkpagetheme .ws-hover-black:hover {
    background-color: rgb(13, 23, 33) !important;
    color: white !important;
    border-color: rgb(13, 23, 33) !important;
}

@media all {
    .cls-2 {
        font-size: 23px;
    }

    .cls-2 {
        fill: rgb(255, 255, 255);
    }

    .cls-2 {
        font-family: RobotoMono-Medium, "Roboto Mono";
        font-weight: 500;
    }

    .cls-3 {
        fill: rgb(255, 255, 255);
    }

    .cls-3 {
        font-family: RobotoMono-Medium, "Roboto Mono";
        font-weight: 500;
    }

    .cls-3 {
        font-size: 20.08px;
    }
}

.user-profile-bottom-wrapper .user-profile-btn {
    transform: scale(1.2);
    top: 4px;
    margin-top: 10px;
}

.track-progress-btn-wrapper {
    display: flex;
    justify-content: center;
}

picture {
    border-style: none;
}

picture {
    vertical-align: middle;
}

.sharethis a:hover {
    color: inherit;
}

#top-nav-bar h2 {
    font-family: "Source Sans Pro", sans-serif;
}

#top-nav-bar .nav-heading-container > .filter-input-wrapper > .filter-input-inner-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}

#nav_tutorials h3 {
    padding-left: 6px;
    color: rgb(255, 244, 163);
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

#nav_references h3 {
    padding-left: 6px;
    color: rgb(255, 244, 163);
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

#top-nav-bar .black-box-container {
    margin-top: 35px;
}

.acctop-link {
    border-radius: 3px;
    width: auto !important;
    display: inline-block !important;
    font-size: 18px !important;
}

.w3-bar-block .w3-bar-item {
    width: 100%;
    display: block;
    padding: 8px 16px;
    text-align: left;
    border: none;
    white-space: normal;
    float: none;
    outline: 0px;
}

#nav_exercises a {
    font-size: 18px;
    padding: 2px 6px !important;
}

#top-nav-bar .w3-bar-block .w3-bar-item {
    padding: 2px 8px;
}

.acclink-text {
    border-radius: 3px;
    padding-right: 8px;
    background-color: rgb(40, 42, 53) !important;
    color: rgb(255, 244, 163) !important;
    text-decoration: underline !important;
    font-size: 12px !important;
    opacity: 0.9 !important;
}

#top-nav-bar .ws-btn {
    padding: 2px 8px;
}

.acclink-text:hover {
    color: rgb(255, 255, 255) !important;
}

#nav_certified h3 {
    padding-left: 6px;
    color: rgb(255, 244, 163);
    font-family: "Source Sans Pro Topnav", sans-serif !important;
}

.serviceslink {
    color: inherit;
    text-decoration: none;
}

#top-nav-bar .serviceboxes > .servicebox > .serviceslink {
    display: inline-block;
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 137px;
}

.html-card h2 {
    margin-top: 0px;
    font-size: 19px;
    font-weight: 550;
    margin-bottom: 12px;
}

.html-card p {
    margin: 0px;
    font-size: 16px;
    color: inherit;
}

.w3-margin-top {
    margin-top: 16px !important;
}

.ws-hover-green:hover {
    background-color: rgb(5, 152, 98) !important;
    color: white !important;
}

.ws-purple {
    background-color: rgb(151, 99, 246) !important;
    color: rgb(255, 255, 255) !important;
}

.ws-purple:hover {
    background-color: rgb(125, 83, 204) !important;
    color: rgb(255, 255, 255) !important;
}

.html-course .ws-purple:hover {
    background-color: rgb(125, 83, 204) !important;
    color: rgb(255, 255, 255) !important;
}

.tagcolor {
    color: mediumblue;
}

.darktheme .tagcolor {
    color: rgb(136, 204, 187) !important;
}

[type="radio"] {
    padding: 0px;
}

#exercisecontainer .quizoption [type="radio"] {
    position: absolute;
    top: 33%;
}

#exercisecontainer .quizoption label {
    display: inline-block;
    margin-left: 29px;
    cursor: pointer;
}

h6 {
    font-size: 16px;
}

h6 {
    font-family: "Segoe UI", Arial, sans-serif;
    font-weight: 400;
    margin: 10px 0px;
}

.checklist {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

a.track-progress-btn {
    position: absolute;
    padding: 8px 20px;
    border: 1px solid rgb(221, 221, 221);
    top: -65px;
    background-color: rgb(255, 255, 255);
    color: rgb(51, 51, 51);
    border-radius: 5px;
    cursor: pointer;
    font-size: 18px;
}

img {
    border-style: none;
}

img {
    vertical-align: middle;
}

.w3-hover-text-red:hover {
    color: rgb(244, 67, 54) !important;
}

.fa-linkedin-square {
    padding: 0px 2px;
}

.fa-linkedin-square::before {
    content: "";
}

.fa-linkedin-square:hover {
    color: rgb(40, 103, 178);
}

.fa-discord::before {
    content: "";
}

.fa-discord:hover {
    color: rgb(88, 101, 242);
}

.fa-facebook-square {
    padding: 0px 2px;
}

.fa-facebook-square::before {
    content: "";
}

.fa-facebook-square:hover {
    color: rgb(59, 89, 152);
}

.fa-instagram {
    padding: 0px 2px;
}

.fa-instagram::before {
    content: "";
}

.fa-instagram:hover {
    color: rgb(138, 58, 185);
}

.fa-tiktok::before {
    content: "";
}

.w3-hover-text-grey:hover {
    color: rgb(117, 117, 117) !important;
}

b {
    font-weight: bolder;
}

#top-nav-bar .filter-input {
    flex-grow: 1;
    background-color: rgb(70, 70, 70);
    color: white;
    font-size: 16px;
    outline: none;
    font-family: "Source Sans Pro", sans-serif;
    padding: 10px 20px;
    border-radius: 25px;
    width: 100%;
    border: 1px solid rgba(255, 244, 163, 0.2);
}

#top-nav-bar .tnb-button-dark-v2 {
    user-select: none;
}

#top-nav-bar .tnb-button-dark-v2 {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 25px;
    white-space: normal;
    text-align: center;
    cursor: pointer;
    outline: none !important;
    text-decoration: none !important;
    color: rgb(0, 0, 0) !important;
}

#top-nav-bar .tnb-button-dark-v2 {
    color: rgb(221, 221, 221) !important;
}

.darkpagetheme #top-nav-bar .tnb-button-dark-v2 {
    color: rgb(221, 221, 221) !important;
}

#top-nav-bar .nav-heading-container > .filter-input-wrapper > .filter-input-inner-wrapper > .filter-clear-btn {
    position: absolute;
    top: 1px;
    right: 1px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
}

#top-nav-bar .tnb-button-dark-v2:hover {
    background-color: rgba(52, 52, 52, 0.5) !important;
}

.darkpagetheme #top-nav-bar .tnb-button-dark-v2:hover {
    background-color: rgba(52, 52, 52, 0.5) !important;
}

#nav_tutorials a {
    font-size: 18px;
    padding: 2px 6px !important;
}

#nav_references a {
    font-size: 18px;
    padding: 2px 6px !important;
}

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

#nav_certified a {
    font-size: 18px;
    padding: 2px 6px !important;
}

#top-nav-bar .tnb-toggle-darkmode-switch.w3-tooltip .w3-text {
    font-size: 15px;
    font-weight: bold;
    position: absolute;
    left: -50px;
    top: 42px;
    width: 130px;
    text-align: left;
    background-color: rgb(255, 255, 255);
    padding: 5px 5px 5px 30px;
    border-radius: 5px;
    color: rgb(0, 0, 0);
    font-family: "Source Sans Pro Topnav", sans-serif !important;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 4px 0px, rgba(0, 0, 0, 0.12) 0px 2px 10px 0px !important;
}

#top-nav-bar #nav_services .filter-input {
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    border: 1px solid rgb(204, 204, 204);
}

#top-nav-bar #services_list .filter-input {
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    border: 1px solid rgb(204, 204, 204);
}

.darkpagetheme #top-nav-bar #nav_services .filter-input {
    background-color: rgba(255, 255, 255, 0.2);
    color: rgb(255, 255, 255);
    border: 1px solid rgb(153, 153, 153);
}

.services {
    background-color: rgba(255, 255, 255, 0.1);
}

#top-nav-bar .services {
    box-shadow: rgba(100, 100, 100, 0.1) 0px 2px 2px 0px, rgba(100, 100, 100, 0.1) 0px 2px 2px 0px;
}

#top-nav-bar .services-color-1 {
    background-color: rgb(231, 233, 235) !important;
}

.darkpagetheme #top-nav-bar .services-color-1 {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

#top-nav-bar .serviceboxes > .servicebox > .serviceslink > .services {
    display: inline-block;
    overflow: hidden;
    margin: 0px;
    width: 100%;
    height: 100%;
}

.services:hover {
    background-color: rgb(0, 0, 0);
    color: white;
}

#top-nav-bar .services:hover {
    color: rgb(40, 42, 53) !important;
}

#top-nav-bar .services-color-1:hover {
    background-color: rgb(213, 217, 220) !important;
}

.darkpagetheme #top-nav-bar .services:hover {
    color: rgb(255, 255, 255) !important;
}

.darkpagetheme #top-nav-bar .services-color-1:hover {
    background-color: rgb(0, 0, 0) !important;
}

#top-nav-bar .services-color-2 {
    background-color: rgb(231, 233, 235) !important;
}

.darkpagetheme #top-nav-bar .services-color-2 {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

#top-nav-bar .services-color-2:hover {
    background-color: rgb(213, 217, 220) !important;
}

.darkpagetheme #top-nav-bar .services-color-2:hover {
    background-color: rgb(0, 0, 0) !important;
}

#top-nav-bar .services-color-3 {
    background-color: rgb(231, 233, 235) !important;
}

.darkpagetheme #top-nav-bar .services-color-3 {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

#top-nav-bar .services-color-3:hover {
    background-color: rgb(213, 217, 220) !important;
}

.darkpagetheme #top-nav-bar .services-color-3:hover {
    background-color: rgb(0, 0, 0) !important;
}

#top-nav-bar .services-color-4 {
    background-color: rgb(231, 233, 235) !important;
}

.darkpagetheme #top-nav-bar .services-color-4 {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

#top-nav-bar .services-color-4:hover {
    background-color: rgb(213, 217, 220) !important;
}

.darkpagetheme #top-nav-bar .services-color-4:hover {
    background-color: rgb(0, 0, 0) !important;
}

#top-nav-bar .services-color-5 {
    background-color: rgb(231, 233, 235) !important;
}

.darkpagetheme #top-nav-bar .services-color-5 {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

#top-nav-bar .services-color-5:hover {
    background-color: rgb(213, 217, 220) !important;
}

.darkpagetheme #top-nav-bar .services-color-5:hover {
    background-color: rgb(0, 0, 0) !important;
}

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

#exercisecontainer code {
    padding-left: 4px;
    padding-right: 4px;
    padding-bottom: 2px;
    border-radius: 2px;
    color: rgb(255, 255, 255) !important;
}

.checklist li {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    font-size: 16px;
}

#top-nav-bar .tnb-button-dark-v2 > span {
    user-select: none;
}

#top-nav-bar .nav-heading-container > .filter-input-wrapper > .filter-input-inner-wrapper > .filter-clear-btn > span {
    display: inline-block;
    width: 12px;
    line-height: 12px;
    height: 12px;
    font-size: 24px;
    position: absolute;
    top: 50%;
    margin-top: -6px;
    left: 50%;
    margin-left: -7px;
}

.learn-span {
    font-size: 15px;
    color: rgb(221, 221, 221);
}

.acctop-link:hover .learn-span {
    color: black;
}

.ribbon-topnav {
    font-size: 11px;
    font-weight: bold;
    padding: 3px 10px;
    margin-left: 3px;
    text-align: center;
    color: black;
    border-radius: 25px;
    border: 1px solid black;
    position: relative;
    top: -2px;
    background-color: white;
}

#top-nav-bar .acctop-link-ref {
    color: rgb(255, 244, 163);
}

#top-nav-bar .acctop-link:hover .acctop-link-ref {
    color: rgb(0, 0, 0);
}

.services h4 {
    color: rgb(255, 244, 163);
}

#top-nav-bar h4 {
    font-family: "Source Sans Pro", sans-serif;
}

#top-nav-bar .services h4 {
    color: rgb(40, 42, 53) !important;
}

#top-nav-bar #nav_services h4 {
    color: rgb(40, 42, 53) !important;
}

.darkpagetheme #top-nav-bar #nav_services h4 {
    color: rgb(255, 244, 163) !important;
}

.checklist img {
    width: 20px;
    height: 20px;
    margin-right: 15px;
}

@media screen and (max-width: 1100px) {
    #spacemyfooter {
        max-width: 1000px;
    }
}

#top-nav-bar #tnb-menu-toggle-wrapper a:hover, #top-nav-bar #tnb-menu-toggle-wrapper a.mystyle {
    background-color: rgb(241, 241, 241) !important;
}

.darkpagetheme #top-nav-bar #tnb-menu-toggle-wrapper a:hover, .darkpagetheme #top-nav-bar #tnb-menu-toggle-wrapper a.mystyle {
    background-color: rgb(56, 68, 77) !important;
}

@media screen and (max-width: 1100px) {
    .footerlinks_1 {
        padding-left: 20px;
        padding-right: 20px;
    }

    .footerlinks_2 {
        padding-right: 20px;
    }

    .footerlinks_2:nth-child(1) {
        padding-left: 20px;
    }
}

@media screen and (max-width: 1202px) {
    #w3_cert_arrow {
        display: none;
    }
}

@media (max-width: 1250px) and (min-width: 993px) {
    .right-panel {
        display: none;
    }
}

@media (max-width: 954px) {
    #tnb-search-suggestions {
        left: 378px;
    }
}

@media (max-width: 828px) {
    #tnb-search-suggestions {
        left: 10px;
        width: 91%;
    }
}

@media screen and (max-width: 992px) {
    #wrappercontainer {
        z-index: 0;
    }
}

@media (max-width: 688px) {
    #top-nav-bar .tnb-desktop-nav {
        display: none;
    }

    #top-nav-bar .tnb-menu-btn {
        display: block;
    }
}

@media (max-width: 399px) {
    #top-nav-bar .tnb-menu-btn {
        width: 76px;
        padding: 8px;
    }

    #top-nav-bar #tnb-google-search-container {
        padding: 10px 6px;
    }
}

@media (max-width: 688px) {
    #top-nav-bar #tnb-menu-toggle-wrapper {
        display: none;
    }
}

@media (max-width: 600px) {
    .w3-hide-small {
        display: none !important;
    }
}

@media screen and (max-width: 992px) {
    #subtopnav a.subtopnav_firstitem {
        margin-left: 50px !important;
    }
}

@media (max-width: 992px) {
    .w3-sidebar.w3-collapse {
        display: none;
    }

    #sidenav {
        width: 230px;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    }

    #sidenav {
        width: 260px;
    }

    .w3-main {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
}

@media (max-width: 954px) {
    #top-nav-bar .tnb-desktop-nav #navbtn_certified {
        display: none;
    }
}

@media (max-width: 616px) {
    #top-nav-bar #tnb-google-search-container #tnb-google-search-inner-container {
        display: none;
    }

    #top-nav-bar #tnb-google-search-container #tnb-google-search-mobile-action-btns {
        display: block;
    }
}

@media (max-width: 350px) {
    #top-nav-bar .tnb-right-section .tnb-login-btn {
        width: 80px;
    }
}

@media (max-width: 688px) {
    #top-nav-bar #dropdown-nav-outer-wrapper #dropdown-nav-inner-wrapper .dropdown-nav {
        display: none !important;
    }
}

@media (max-width: 954px) {
    #top-nav-bar #nav_certified {
        display: none !important;
    }
}

@media (max-width: 992px) {
    #leftmenuinner {
        overflow: auto;
        height: 100%;
        position: relative;
        width: auto;
        padding-top: 0px;
        background-color: rgb(241, 241, 241);
    }

    #leftmenuinner {
        width: 260px;
    }
}

@media screen and (max-width: 992px) {
    .footertext {
        padding: 0px;
    }
}

@media (max-width: 350px) {
    #top-nav-bar .tnb-right-section .tnb-login-btn .tnb-sign-in-icon {
        display: none;
    }
}

@media (max-width: 992px) {
    #leftmenuinnerinner {
        overflow-y: scroll;
    }
}

@media only screen and (max-width: 500px) {
    #main {
        padding: 16px;
    }
}

@media (max-width: 992px) {
    #right {
        margin-top: 0px;
    }
}

@media screen and (max-width: 992px) {
    .footerlinks_1 {
        width: 100%;
        margin: auto;
        float: none;
        text-align: center;
        font-size: 20px;
        padding: 10px 20px !important;
    }

    .footerlinks_1:nth-child(1) {
        padding: 40px 20px;
    }
}

@media only screen and (max-width: 500px) {
    h2 {
        font-size: 25px;
    }
}

@media screen and (max-width: 992px) {
    .footerlinks_2 {
        width: 100%;
        float: none;
        margin: auto;
        font-size: 16px;
        line-height: 20px;
        padding: 0px;
    }

    .footer-hide-special {
        display: none;
    }
}

@media (max-width: 992px) {
    #sidenav h2 {
        font-size: 26px;
        width: 100%;
    }

    #sidenav a {
        padding: 3px 2px 3px 24px;
        font-size: 17px;
    }
}

@media screen and (max-width: 700px) {
    #mainLeaderboard {
        height: 60px;
    }
}

@media only screen and (max-width: 500px) {
    h1 {
        font-size: 30px;
    }
}

@media screen and (max-width: 600px) {
    .w3-example {
        margin-left: -16px;
        margin-right: -16px;
    }

    .w3-example {
        margin-left: -32px;
        margin-right: -32px;
        border-radius: 0px;
    }
}

@media only screen and (max-width: 500px) {
    .w3-example {
        padding: 8px 16px;
        margin: 24px -16px;
    }
}

@media screen and (max-width: 800px) {
    #getdiploma {
        margin-bottom: 55px;
    }
}

@media screen and (max-width: 992px) {
    .footerlinks_2 h5 {
        font-size: 26px;
        margin-top: 40px;
    }
}

@media screen and (max-width: 600px) {
    .html-links {
        margin-left: -16px;
        margin-right: -16px;
    }
}

@media only screen and (max-device-width: 480px) {
    .w3-code {
        font-family: "Source Code Pro", Menlo, Consolas, monospace;
    }

    .w3-code {
        font-size: 14px;
    }
}

@media (max-width: 860px) and (min-width: 0px) {
    .containerlog {
        margin-right: 0px !important;
    }
}

@media screen and (max-width: 800px) {
    #getdiploma h2 {
        font-size: 44px;
    }

    #getdiploma p {
        font-size: 30px;
    }

    #getdiploma a {
        width: 100%;
    }
}

@media screen and (max-width: 992px) {
    #w3_cert_arrow {
        display: block;
    }
}

@media screen and (max-width: 800px) {
    #w3_cert_arrow {
        display: none;
    }

    #w3_cert_badge {
        top: -16px;
        right: -8px;
        width: 100px;
    }
}

@media (max-width: 992px) {
    #skyscraper {
        min-height: 60px;
    }
}

@media (max-width: 688px) {
    #top-nav-bar .nav-heading-container > .nav-heading-container-title {
        display: none;
    }

    #top-nav-bar .nav-heading-container > .filter-input-wrapper {
        width: 100%;
        min-width: auto;
    }
}

@media (max-width: 600px) {
    #top-nav-bar #toggle-darkmode-wrapper {
        display: none;
    }
}

@media (max-width: 688px) {
    #top-nav-bar .tnb-services-headlines {
        margin-top: 0px;
    }

    #top-nav-bar .serviceboxes > .servicebox {
        width: 50%;
    }
}

@media (max-width: 600px) {
    #top-nav-bar .serviceboxes > .servicebox {
        width: 100%;
    }
}

@media screen and (max-width: 600px) {
    .float-or {
        font-size: 13px;
    }
}

@media (max-width: 860px) and (min-width: 0px) {
    .right-panel {
        display: none;
    }
}

@media screen and (max-width: 992px) {
    .bigbtn {
        display: block;
        width: 100%;
    }
}

@media screen and (max-width: 600px) {
    .acctop-link {
        margin-left: -2px;
        padding: 4px 8px !important;
    }

    .acclink-text {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
}

@media (max-width: 600px) {
    #top-nav-bar .acclink-text {
        border: 1px solid rgba(255, 244, 163, 0.5);
        border-radius: 30px;
        text-decoration: none !important;
        padding: 2px 8px !important;
    }
}

@media (max-width: 688px) {
    #top-nav-bar .serviceboxes > .servicebox > .serviceslink {
        height: 160px;
    }
}

@media (max-width: 600px) {
    #top-nav-bar .serviceboxes > .servicebox > .serviceslink {
        height: auto;
    }
}

@media screen and (max-width: 600px) {
    a.track-progress-btn {
        top: 6px;
        width: 100%;
    }

    .fixpaddingsmallmenu {
        margin-left: -2px;
        padding: 4px 8px !important;
    }

    .services {
        margin-top: 16px;
    }
}

@media (max-width: 992px) and (min-width: 601px) {
    .w3-hide-medium {
        display: none !important;
    }
}

@media (min-width: 689px) and (max-width: 828px) {
    #top-nav-bar #tnb-google-search-container #tnb-google-search-inner-container {
        display: none;
    }

    #top-nav-bar #tnb-google-search-container #tnb-google-search-mobile-action-btns {
        display: block;
    }
}

@media (max-width: 992px) and (min-width: 601px) {
    #top-nav-bar .nav-heading-container > .nav-heading-container-title {
        width: 38%;
    }

    #top-nav-bar .serviceboxes > .servicebox > .serviceslink {
        height: 160px;
    }
}

@media (min-width: 689px) and (max-width: 828px) {
    #top-nav-bar .serviceboxes > .servicebox > .serviceslink {
        height: 182px;
    }
}

@keyframes mmfadeOut {
    0% {
    }

    100% {
    }
}

@keyframes mmslideOut {
    0% {
    }

    100% {
    }
}

@keyframes spin {
    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@keyframes user-progress-star-animation {
    0% {
        color: rgb(255, 215, 0);
        transform: rotate(0deg);
    }

    100% {
        font-size: 40px;
        color: rgb(255, 215, 0);
        transform: rotate(360deg);
    }
}

@keyframes user-progress-point-animation {
    0% {
        background-color: transparent;
        color: transparent;
    }

    1% {
        background-color: rgb(4, 170, 109);
        color: rgb(255, 255, 255);
    }

    5% {
        font-size: 16px;
    }

    14% {
        font-size: 12px;
    }

    16% {
        font-size: 16px;
    }

    25% {
        font-size: 12px;
    }

    27% {
        font-size: 16px;
    }

    29% {
        font-size: 12px;
        background-color: rgb(4, 170, 109);
        color: rgb(255, 255, 255);
    }

    50% {
        background-color: transparent;
        color: transparent;
    }
}

#style-AW4wG.style-AW4wG {
    position: relative;
    z-index: 1;
    color: rgb(4, 170, 109);
    font-size: 36px !important;
}

#style-CwNo4.style-CwNo4 {
    display: none;
    font-size: 15px;
}

#style-g8Dxr.style-g8Dxr {
    display: none;
    font-size: 15px;
}

#style-iXmnX.style-iXmnX {
    display: none;
    font-size: 15px;
}

#style-H4dMJ.style-H4dMJ {
    display: none;
    font-size: 15px;
}

#style-SbQ9C.style-SbQ9C {
    display: none;
    font-size: 15px;
}

#style-vUQiv.style-vUQiv {
    font-size: 120px;
}

#toggle-darkmode-mobile-wrapper.style-JAVpM {
    position: absolute;
    top: 28px;
    left: 20px;
}

#style-8eGYa.style-8eGYa {
    user-select: none;
}

#style-a2GKU.style-a2GKU {
    position: absolute;
    left: 0px;
    top: -2px;
}

#style-1jYCU.style-1jYCU {
    background-color: rgb(217, 33, 44);
    color: white;
}

#style-tXYh3.style-tXYh3 {
    background-color: rgb(217, 33, 44);
    color: white;
}

#style-oBRGY.style-oBRGY {
    background-color: rgb(217, 33, 44);
    color: white;
}

#style-EYDcb.style-EYDcb {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
    margin-bottom: 16px;
}

#style-dkLeC.style-dkLeC {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
}

#style-yvoy5.style-yvoy5 {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
    margin-bottom: 16px;
}

#style-EMI4E.style-EMI4E {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
}

#style-APAni.style-APAni {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
    margin-bottom: 16px;
}

#style-IZsI3.style-IZsI3 {
    font-size: 13px;
    font-weight: normal;
}

#style-pY8bz.style-pY8bz {
    font-size: 13px;
    font-weight: normal;
}

#style-LXYe7.style-LXYe7 {
    font-size: 13px;
    font-weight: normal;
}

#style-Q6Z1S.style-Q6Z1S {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
    margin-bottom: 16px;
}

#toggle-darkmode-wrapper.style-OGNke {
    float: right;
    text-align: center;
    padding: 20px 40px 0px 0px;
}

#style-3wV1X.style-3wV1X {
    user-select: none;
}

#style-qO62U.style-qO62U {
    position: absolute;
    left: -1px;
    top: -2px;
}

#style-Mh3ha.style-Mh3ha {
    margin-left: 15px;
    width: 35px;
    position: absolute;
    top: 15px;
    right: 15px;
}

#style-RQKTH.style-RQKTH {
    margin-left: 15px;
    width: 35px;
    position: absolute;
    top: 7px;
    right: 15px;
}

#style-wc11h.style-wc11h {
    margin-left: 15px;
    width: 35px;
    position: absolute;
    top: 15px;
    right: 15px;
    display: inline-block;
}

#style-22by8.style-22by8 {
    display: none;
}

#style-ZpoUh.style-ZpoUh {
    display: none;
    visibility: hidden;
}

#scroll_left_btn.style-U3OhF {
    display: none;
}

#scroll_right_btn.style-kYOtx {
    display: block;
    right: 0px;
}

#style-ANWL7.style-ANWL7 {
    line-height: 1.1;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

#style-lLkEE.style-lLkEE {
    width: 50px;
    visibility: hidden;
}

#leftmenuinner.style-6qGCc {
    height: 837px;
}

#belowtopnav.style-EwXV2 {
    margin-left: 230px;
}

#mainLeaderboard.style-MfihL {
    overflow: hidden;
}

#style-JalGD.style-JalGD {
}

#style-53j7G.style-53j7G {
}

#style-aomOb.style-aomOb {
    font-family: "Source Sans Pro Topnav", sans-serif;
}

#style-SGBw8.style-SGBw8 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    margin-bottom: -5px;
}

#style-tl7yR.style-tl7yR {
    flex-grow: 1;
    background-color: rgb(231, 233, 235);
    border-radius: 10px;
    height: 10px;
}

#style-SIZqj.style-SIZqj {
    width: 3%;
    height: 100%;
    background-color: rgb(4, 170, 109);
    border-radius: 10px;
}

#style-yLHfF.style-yLHfF {
    font-size: 16px;
}

#midcontentadcontainer.style-bEPYF {
    overflow: auto;
    text-align: center;
}

#div-gpt-ad-1493883843099-0.style-qM7Fx {
    display: inline-block;
}

#style-6y9zh.style-6y9zh {
    display: block;
    text-align: left;
}

#style-UYlQx.style-UYlQx {
    border-radius: 5px;
    font-size: 18px;
    padding-left: 25px;
    padding-right: 25px;
    font-family: "Source Sans Pro", sans-serif;
    margin-top: 6px;
}

#myLearningFromDefault.style-oysVs {
    margin-top: 16px;
    border-radius: 5px;
    font-size: 18px;
    padding-left: 25px;
    padding-right: 25px;
    font-family: "Source Sans Pro", sans-serif;
}

#style-7Zd8F.style-7Zd8F {
    margin-top: 16px;
}

#style-kykrT.style-kykrT {
    margin-left: -16px;
    margin-right: -16px;
}

#style-lAveZ.style-lAveZ {
    background-color: rgb(40, 43, 53);
    color: white;
    margin-bottom: 10px;
}

#style-H6fF5.style-H6fF5 {
    max-width: 720px;
    position: relative;
    margin: auto;
    text-decoration: none;
    text-align: center;
}

#yt_container.style-5qoRr {
    max-width: 720px;
    position: relative;
    margin: auto;
}

#style-TeGJn.style-TeGJn {
    position: absolute;
    top: 40%;
    text-align: center;
    margin: auto;
}

#style-PZ8Ce.style-PZ8Ce {
    width: 30%;
}

#style-bMjPe.style-bMjPe {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
}

#style-8sswT.style-8sswT {
    margin-top: 20px;
    margin-bottom: 20px;
}

#upperfeatureshowcase3001.style-oPjIW {
    border-radius: 5px;
}

#upperfeatureshowcase120.style-nPg8c {
    border-radius: 5px;
}

#upperfeatureshowcase160.style-qPdpN {
    border-radius: 5px;
}

#upperfeatureshowcase300.style-B6E1K {
    width: auto;
    border-radius: 5px;
}

#style-GAfKs.style-GAfKs {
    font-size: 25px;
}

#style-58lav.style-58lav {
    font-size: 25px;
}

#style-Cx1Zm.style-Cx1Zm {
    font-size: 25px;
}

#style-NTZOp.style-NTZOp {
    font-size: 25px;
}

#style-C1mn9.style-C1mn9 {
    font-size: 25px;
}

#style-tQCqt.style-tQCqt {
    font-size: 20px;
}

#vidpos.style-ojPNi {
    text-align: center;
    margin-bottom: 0px;
    height: 0px;
}

#stickypos.style-QQAd6 {
    text-align: center;
    position: sticky;
    top: 50px;
}

#style-jWevT.style-jWevT {
    position: relative;
    margin: auto;
}

#style-RZ73T.style-RZ73T {
    overflow: hidden;
}

#style-951xD.style-951xD {
    overflow: hidden;
}

#style-oCedN.style-oCedN {
    font-family: "Source Sans Pro", sans-serif;
}

#style-elPRq.style-elPRq {
    font-family: "Source Sans Pro", sans-serif;
}

#style-gyMyv.style-gyMyv {
    font-family: "Source Sans Pro", sans-serif;
}

#style-TJj2d.style-TJj2d {
    font-family: "Source Sans Pro", sans-serif;
}

#style-mwNbd.style-mwNbd {
    cursor: pointer;
    text-decoration: underline;
}

#style-RdwnL.style-RdwnL {
    top: -2px;
    left: 230px;
    height: 0px;
    width: 0px;
}

#style-Ix2Jc.style-Ix2Jc {
    top: -4px;
    left: -4px;
    height: 0px;
    width: 0px;
}

#style-mnck6.style-mnck6 {
    top: -4px;
    left: -4px;
    height: 0px;
    width: 0px;
}

#style-clliX.style-clliX {
    top: -2px;
    left: 228px;
    height: 0px;
    width: 0px;
}

#style-Ak5l8.style-Ak5l8 {
    top: -2px;
    left: 0px;
    height: 0px;
    width: 0px;
}

#style-GrMS3.style-GrMS3 {
    top: -4px;
    left: -4px;
    height: 0px;
    width: 0px;
}

#style-k3NyI.style-k3NyI {
    top: -4px;
    left: -4px;
    height: 0px;
    width: 0px;
}

#style-wroPl.style-wroPl {
    top: -2px;
    left: -2px;
    height: 0px;
    width: 0px;
}

#style-DCWDN.style-DCWDN {
    top: 0px;
    left: 0px;
    position: absolute;
}

#snipcss-kiwi.style-tYgXG {
    left: 1170px;
    top: 0px;
}

#style-eXhfn.style-eXhfn {
    position: relative;
    z-index: 1;
    color: rgb(4, 170, 109);
    font-size: 36px !important;
}

#style-Cyjod.style-Cyjod {
    display: none;
    font-size: 15px;
}

#style-6sXLx.style-6sXLx {
    display: none;
    font-size: 15px;
}

#style-hJAjJ.style-hJAjJ {
    display: none;
    font-size: 15px;
}

#style-CoTLk.style-CoTLk {
    display: none;
    font-size: 15px;
}

#style-Tcq81.style-Tcq81 {
    display: none;
    font-size: 15px;
}

#style-OLkEO.style-OLkEO {
    font-size: 120px;
}

#toggle-darkmode-mobile-wrapper.style-UYHDx {
    position: absolute;
    top: 28px;
    left: 20px;
}

#style-HejkN.style-HejkN {
    user-select: none;
}

#style-PoiLk.style-PoiLk {
    position: absolute;
    left: 0px;
    top: -2px;
}

#style-RDjd2.style-RDjd2 {
    background-color: rgb(217, 33, 44);
    color: white;
}

#style-zor8O.style-zor8O {
    background-color: rgb(217, 33, 44);
    color: white;
}

#style-EUWcd.style-EUWcd {
    background-color: rgb(217, 33, 44);
    color: white;
}

#style-f1DLC.style-f1DLC {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
    margin-bottom: 16px;
}

#style-svj2V.style-svj2V {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
}

#style-XpNYx.style-XpNYx {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
    margin-bottom: 16px;
}

#style-orAUv.style-orAUv {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
}

#style-9XAdI.style-9XAdI {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
    margin-bottom: 16px;
}

#style-edBKg.style-edBKg {
    font-size: 13px;
    font-weight: normal;
}

#style-AbVZv.style-AbVZv {
    font-size: 13px;
    font-weight: normal;
}

#style-KWabe.style-KWabe {
    font-size: 13px;
    font-weight: normal;
}

#style-YNiHN.style-YNiHN {
    display: block;
    background-color: rgb(33, 35, 44);
    border: 1px solid grey;
    width: 195px;
    margin-bottom: 16px;
}

#toggle-darkmode-wrapper.style-ne4mt {
    float: right;
    text-align: center;
    padding: 20px 40px 0px 0px;
}

#style-k6Vkm.style-k6Vkm {
    user-select: none;
}

#style-JclHP.style-JclHP {
    position: absolute;
    left: -1px;
    top: -2px;
}

#style-blEF8.style-blEF8 {
    margin-left: 15px;
    width: 35px;
    position: absolute;
    top: 15px;
    right: 15px;
}

#style-Ha4jr.style-Ha4jr {
    margin-left: 15px;
    width: 35px;
    position: absolute;
    top: 7px;
    right: 15px;
}

#style-7SBcK.style-7SBcK {
    margin-left: 15px;
    width: 35px;
    position: absolute;
    top: 15px;
    right: 15px;
    display: inline-block;
}

#style-UyS1N.style-UyS1N {
    display: none;
}

#style-mWtx3.style-mWtx3 {
    display: none;
    visibility: hidden;
}

#scroll_left_btn.style-jmGiW {
    display: none;
}

#scroll_right_btn.style-48b6k {
    display: block;
    right: 0px;
}

#style-6nIXN.style-6nIXN {
    line-height: 1.1;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

#style-j2zdZ.style-j2zdZ {
    width: 50px;
    visibility: hidden;
}

#leftmenuinner.style-UKlkx {
    height: 837px;
}

#belowtopnav.style-g32wG {
    margin-left: 230px;
}

#mainLeaderboard.style-NRq8x {
    overflow: hidden;
}

#style-VToYC.style-VToYC {
}

#style-Z4rSq.style-Z4rSq {
}

#style-XI4av.style-XI4av {
    font-family: "Source Sans Pro Topnav", sans-serif;
}

#style-BQFmc.style-BQFmc {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    margin-bottom: -5px;
}

#style-vQYIs.style-vQYIs {
    flex-grow: 1;
    background-color: rgb(231, 233, 235);
    border-radius: 10px;
    height: 10px;
}

#style-9Kk9w.style-9Kk9w {
    width: 3%;
    height: 100%;
    background-color: rgb(4, 170, 109);
    border-radius: 10px;
}

#style-A7RLM.style-A7RLM {
    font-size: 16px;
}

#midcontentadcontainer.style-kwt9s {
    overflow: auto;
    text-align: center;
}

#div-gpt-ad-1493883843099-0.style-qb4t1 {
    display: inline-block;
}

#style-9Q5qw.style-9Q5qw {
    display: block;
    text-align: left;
}

#style-ryywi.style-ryywi {
    border-radius: 5px;
    font-size: 18px;
    padding-left: 25px;
    padding-right: 25px;
    font-family: "Source Sans Pro", sans-serif;
    margin-top: 6px;
}

#myLearningFromDefault.style-gEday {
    margin-top: 16px;
    border-radius: 5px;
    font-size: 18px;
    padding-left: 25px;
    padding-right: 25px;
    font-family: "Source Sans Pro", sans-serif;
}

#style-Q5z5V.style-Q5z5V {
    margin-top: 16px;
}

#style-BSctl.style-BSctl {
    margin-left: -16px;
    margin-right: -16px;
}

#style-OBh88.style-OBh88 {
    background-color: rgb(40, 43, 53);
    color: white;
    margin-bottom: 10px;
}

#style-GEX3o.style-GEX3o {
    max-width: 720px;
    position: relative;
    margin: auto;
    text-decoration: none;
    text-align: center;
}

#yt_container.style-jzGv8 {
    max-width: 720px;
    position: relative;
    margin: auto;
}

#style-74VMv.style-74VMv {
    position: absolute;
    top: 40%;
    text-align: center;
    margin: auto;
}

#style-pCYr2.style-pCYr2 {
    width: 30%;
}

#style-sYzcU.style-sYzcU {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
}

#style-Moh3P.style-Moh3P {
    margin-top: 20px;
    margin-bottom: 20px;
}

#upperfeatureshowcase3001.style-pya6k {
    border-radius: 5px;
}

#upperfeatureshowcase120.style-lFoSK {
    border-radius: 5px;
}

#upperfeatureshowcase160.style-Poi7Z {
    border-radius: 5px;
}

#upperfeatureshowcase300.style-DUOvP {
    width: auto;
    border-radius: 5px;
}

#style-4RQAQ.style-4RQAQ {
    font-size: 25px;
}

#style-8regh.style-8regh {
    font-size: 25px;
}

#style-JYChn.style-JYChn {
    font-size: 25px;
}

#style-NWFBh.style-NWFBh {
    font-size: 25px;
}

#style-2NoFq.style-2NoFq {
    font-size: 25px;
}

#style-I6yLe.style-I6yLe {
    font-size: 20px;
}

#vidpos.style-ohKvb {
    text-align: center;
    margin-bottom: 0px;
    height: 0px;
}

#stickypos.style-6eL8q {
    text-align: center;
    position: sticky;
    top: 50px;
}

#style-Y61oL.style-Y61oL {
    position: relative;
    margin: auto;
}

#style-tUHXX.style-tUHXX {
    overflow: hidden;
}

#style-kW7Hs.style-kW7Hs {
    overflow: hidden;
}

#style-wP8ZM.style-wP8ZM {
    font-family: "Source Sans Pro", sans-serif;
}

#style-WDJRg.style-WDJRg {
    font-family: "Source Sans Pro", sans-serif;
}

#style-tP2PT.style-tP2PT {
    font-family: "Source Sans Pro", sans-serif;
}

#style-KWl74.style-KWl74 {
    font-family: "Source Sans Pro", sans-serif;
}

#style-8Heea.style-8Heea {
    cursor: pointer;
    text-decoration: underline;
}

#style-WaTi3.style-WaTi3 {
    top: -2px;
    left: 230px;
    height: 0px;
    width: 0px;
}

#style-GShiO.style-GShiO {
    top: -4px;
    left: -4px;
    height: 0px;
    width: 0px;
}

#style-8V73b.style-8V73b {
    top: -4px;
    left: -4px;
    height: 0px;
    width: 0px;
}

#style-XS3Dz.style-XS3Dz {
    top: -2px;
    left: 228px;
    height: 0px;
    width: 0px;
}

#style-yaAhZ.style-yaAhZ {
    top: -2px;
    left: 0px;
    height: 0px;
    width: 0px;
}

#style-dg921.style-dg921 {
    top: -4px;
    left: -4px;
    height: 0px;
    width: 0px;
}

#style-HIxx6.style-HIxx6 {
    top: -4px;
    left: -4px;
    height: 0px;
    width: 0px;
}

#style-lqzbY.style-lqzbY {
    top: -2px;
    left: -2px;
    height: 0px;
    width: 0px;
}

#style-mRhjD.style-mRhjD {
    top: 0px;
    left: 0px;
    position: absolute;
}

#snipcss-kiwi.style-Rq9js {
    left: 1170px;
    top: 0px;
}