/*@import url('https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300ita‌​lic,400italic,500,500italic,700,700italic,900italic,900');
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Russo+One&display=swap');*/


@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600;700;800;900&display=swap');


@font-face {
    font-family : 'Montserrat';
    font-style  : normal;
    font-weight : 400;
    font-display: swap;
    src         : url(/fonts/MontserratAlternates-Medium.ttf) format('opentype');

}

@font-face {
    font-family : 'Montserrat';
    ` font-style: normal;
    font-weight : 500;
    font-display: swap;
    src         : url(/fonts/MontserratAlternates-Bold.ttf) format('opentype');

}

html,
body {
    min-height: 100%;
    height    : 100%;
}

::-webkit-scrollbar {
    width : 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background   : #F1F1F1;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background   : #C1C1C1;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background   : #a8a8a8;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:active {
    background   : #787878;
    border-radius: 10px;
}

header {
    height: 60px;
}

html,
body,
html * {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, sans-serif;
}


.parachain_logo_img {
    max-height  : 50px;
    height      : 50px;
    width       : 45px;
    margin-right: 8px;
}


.main_logo {
    font-family  : 'Montserrat', sans-serif !important;
    padding-top  : 12px;
    font-weight  : 400;
    /*font-family: 'Russo One', sans-serif !important;*/
}

.main_logo span {
    font-family: 'Montserrat', sans-serif !important;

    /*font-family: 'Russo One', sans-serif !important;*/
}



/*.archivo {
    font-family: 'Archivo Black', sans-serif;
}*/

main {
    margin-bottom: 1rem;
    z-index      : 1;
}

.switchers .col-4 {
    padding-left : 0px;
    padding-right: 10px;
}

/************/

/* info page*/

.info_content {
    padding-left : -15px;
    padding-right: -15px;
}

.info-tabs {
    /*margin-top: 10px;
    max-width : 960px;*/
    padding-top: 50px;
}

.contacts_row {
    margin-top: 30px;
}

.info_token_table {
    margin-bottom: 1rem;
    max-width    : 70%;
}

.info_token_table td {
    vertical-align: middle;
    text-align    : right;
}

.info_token_table_td_content {
    padding-left: 8px;
    text-align  : left !important;
}

#news {}


.main.contact_div_cell {
    font-size: 16px;
}




.label_nt_kusama {
    background-color: #000;
    color           : #fff;
}

.label_nt_polkadot {
    background-color: #E6007A;
    color           : #fff;
}

.label_nt_testnet {
    background-color: gray;
    color           : #fff;
}

.github_color:hover {
    color: #24292E !important;
}

.twitter_color:hover {
    color: #1DA1F2 !important;
}

.label_telegram {
    background: #24A2DF;
    color     : #fff;
}

.telegram_color:hover {
    color: #24A2DF !important;
}

.email_color:hover {
    color: #DE5448 !important;
}

.home_color:hover {
    color: #6699cc;
}

.label_twitter {
    background: #1DA1F2;
    color     : #fff;
}



.label_github {
    background: #24292E;
    color     : #fff;
}

.label_nt_substrate {
    background-color: #E6007A;
    color           : #fff;
}

.label_dt_lockdrop {
    background-color: #0CA789 !important;
    color           : #fff;
}

.label_dt_stakedrop {
    background-color: #3490dc !important;
    color           : #fff;
}

.label_dt_ipo {
    background-color: #FEF445 !important;
    color           : #000;
}

.label_st_genesis {
    background-color: #38c172 !important;
    color           : #fff;
}

.label_not_listed {
    background-color: #9e9e9e !important;
    color           : #fff !important;
    letter-spacing  : 1px;
}


.label_w3f {
    background-color: #000;
    color           : #fff;
}

.card_tab {
    min-height : 180px;
    padding-top: 10px;
}

.nav-pills-underline>li.nav-item>a.nav-link.active:hover,
.nav-pills-underline>li.nav-item>a.nav-link:hover {
    color           : #111;
    font-weight     : bold;
    background-color: inherit;
}

.nav-pills-underline>li.nav-item>a.nav-link.active:hover,
.nav-pills-underline>li.nav-item>a.nav-link:hover {
    background-color: inherit !important;
}

.nav-pills-underline>li.nav-item>a.nav-link.active {
    color           : #111;
    font-weight     : bold;
    background-color: inherit;
}

.nav-pills-underline>li.nav-item>a.nav-link {
    color: #111;
}



.team_member_lastname {
    font-weight: bold;
}

.team_member_box {
    padding       : 8px;
    border        : 1px #e0e0e0 solid;
    border-radius : var(--radius-md);
    display       : inline-block;
    text-align    : center;
    vertical-align: top;
    margin        : 10px;
    max-width     : 12em;
    width         : 40%;
    height        : 8em;
}

.commits_count {
    font-size: 0.7em;
}

/********** switches colors ************/

/* Switch info */

.switch-info label input[type=checkbox]:checked+.lever {
    background-color: #33b5e5;
}

.switch-info label input[type=checkbox]:checked+.lever:after {
    background-color: #0099CC;
}

/* Switch danger */

.switch-danger label input[type=checkbox]:checked+.lever {
    background-color: #ff4444;
}

.switch-danger label input[type=checkbox]:checked+.lever:after {
    background-color: #CC0000;
}

/* Switch warning */

.switch-warning label input[type=checkbox]:checked+.lever {
    background-color: #ffbb33;
}

.switch-warning label input[type=checkbox]:checked+.lever:after {
    background-color: #FF8800;
}

/* Switch success */

.switch-success label input[type=checkbox]:checked+.lever {
    background-color: #00C851;
}

.switch-success label input[type=checkbox]:checked+.lever:after {
    background-color: #007E33;
}

/* Switch pink */

.switch-pink label input[type=checkbox]:checked+.lever {
    background-color: #E6007A;
}

.switch-pink label input[type=checkbox]:checked+.lever:after {
    background-color: #cf006d;
}

strong {
    font-weight: 700;
}

.outgoing_links {
    /*    margin-top: 1rem;*/
}

.outgoing_links a {

    /*   background: #6699cc !important;*/
}

.parachains_tags {
    max-width       : 20rem;
    z-index         : 1;
    background-color: #fff;
}

.customSuggestionsList {
    z-index         : 1;
    background-color: #fff;
}

/*
select columns
*/

.div_visible_columns {
    float      : right;
    margin-left: 30px;
}

#colsDrop {
    padding-left : 10px;
    padding-right: 10px;
}

.global_filter .btn-sm {
    font-size: 0.7rem !important;
}

.switch.success-switch label input[type=checkbox]:checked+.lever {
    background-color: #2ACC6C;
}

.switch.success-switch label input[type=checkbox]:checked+.lever:after {
    background-color: #00C851;
}

.switch.round label .lever {
    width        : 2.2em;
    height       : 1em;
    border-radius: 3em;
}

.switch.round label .lever:after {
    width        : 1.2em;
    height       : 1.2em;
    border-radius: 50%;
    left         : -4px;
    top          : -2px;
}

#parachains_table_filter {
    /*margin-bottom: 33px !important;
    margin-top:16px !important;*/
}

#main {
    max-width : 100% !important;
    min-height: 600px;
}

.pagination .page-item .page-link:focus {
    /*background-color: #4285f4 !important;*/
}

.active_color_general {
    background-color: #ff7043 !important;
}

.active_color_token {
    background-color: #00c851 !important;
}

.active_color_auction {
    background-color: #3f51b5 !important;
}

.active_color_social {
    background-color: #4285f4 !important;
}

.dataTables_paginate {
    float      : right;
    height     : 50px;
    display    : flex;
    align-items: center;
}

ul.pagination {
    margin         : 2px 0;
    white-space    : nowrap;
    justify-content: flex-end;
}

table.dataTable {
    margin-top: 0px !important;
}

table.dataTable .page-item.active .page-link {
    z-index: unset;
}

.watchlist_button {
    font-size     : 0.8rem;
    display       : inline-block;
    margin-left   : 20px;
    text-transform: none;
    font-weight   : normal;
}

.watchlist_color {

    color: #FAC22F;
}

.add_to_watchlist {
    cursor: pointer;
}

.add_to_watchlist_details {
    cursor     : pointer;
    width      : 2rem;
    height     : 2rem;
    margin-left: 1rem;

}

.relnetwork_img_details {

    width     : 24px;
    height    : 24px;
    object-fit: contain;
    padding   : 2px;


}

#more_screenshots,
.more_items {
    cursor         : pointer;
    /*background   : #f5f5f5;*/

    /*max-width    : 20rem;*/
    max-height: 35px;
    height    : 35px;
    width     : 100%;
}

.break {
    flex-basis: 100%;
    height    : 0;
}

.row_star {
    position      : absolute;
    right         : 50%;
    top           : 50%;
    transform     : translate(50%, -50%);
    /*margin-left : 20px;
    margin-right  : 30px;*/
}

.add_to_watchlist {
    position : absolute;
    top      : 50%;
    left     : 50%;
    transform: translate(-50%, -50%);
}

.text-no-wrap {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .rw_pool {
        white-space: initial !important;
    }
}

.filters_box {
    /*    width    : 210px;
    min-width: 210px;*/
    font-size     : 0.9rem;
    /*margin-right: 20px;
    margin-top    : 20px;*/
    /*padding     :16px;*/
}

.filters_box .card-body {
    /*padding: 4px;*/
}

.filters_box.card {
    border      : 0 !important;
    border-right: 1px solid #dee2e6 !important;
    /*box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);*/
}

.card.card-cascade .view.view-cascade.gradient-card-header {
    padding: 0;
}

.filters_box .switch label .lever {
    transform   : scale(0.6);
    margin-right: 0;
}


.project_column {
    width      : 15rem !important;
    min-width  : 15rem !important;
    /*max-width: 15rem !important;*/
}

.truncate_short_desc {
    width          : 12rem;
    /*white-space  : nowrap;*/
    overflow       : hidden;
    /*text-overflow: ellipsis;*/
    font-size      : 0.8rem;
    margin-top     : 8px;
    height         : 2.5rem !important;
}

.fader {
    position: relative;
    height  : 2.5rem;
    /* exactly three lines */
}

.fader:after {
    content   : "";
    text-align: right;
    position  : absolute;
    bottom    : 0;
    right     : 0;
    width     : 70%;
    height    : 1.2rem;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 50%);
}

.truncate_short_desc a {
    text-decoration: none;
}

.country_img {
    height      : auto;
    /* 0.8rem */
    margin-right: 8px;
    top         : 0px;
    right       : 8px;
    position    : absolute;
}

.country_filter,
.category_filter {
    /*margin-left : 4px;
    margin-right: 16px;*/
}

.main_table th {
    font-weight: 700;
}

.main_table {
    border-top: 1px solid #DEE2E6 !important;
}

.switch label .lever {
    margin-left: 0;
}

.form-check-input[type="checkbox"]+label,
label.btn input[type="checkbox"]+label {
    padding-left: 25px !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, .02);
}

/**************************** progress bars ************************/

@-webkit-keyframes animate-positive {
    0% {
        width: 0;
    }
}

@keyframes animate-positive {
    0% {
        width: 0;
    }
}

.country_filter img {
    height    : auto !important;
    width     : auto !important;
    margin-top: 14px !important;
    position  : absolute;
    top       : 0;
    right     : -6px;
    transform : (-50%, 0)
}

.country_filter filtrable label {
    font-size: 0.8rem;
}

.country_filter li {
    position: relative;
}

.md-inner-main {
    font-size: 0.8rem !important;
}

.black_to_pink {
    background: linear-gradient(40deg, #000, #E6007A) !important;
}

.pills-black_to_pink .show>.nav-link {
    background: linear-gradient(40deg, #000, #E6007A) !important;
}

.pills-black_to_pink .nav-link.active {
    background: linear-gradient(40deg, #000, #E6007A) !important;
}

.pills-polkadot .show>.nav-link {
    background-color: #E6007A !important;
}

.pills-polkadot .nav-link.active {
    background-color: #E6007A !important;
}



/*.btn.btn-sm {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    font-size: .8rem !important;
}*/

.table_sections_navigation label {
    position: relative;

    background-color: #f5f5f5 !important;

    /*border-radius: 0.25rem !important;*/
}

.table_sections_navigation .section-arrow-down {
    content        : '';
    position       : absolute;
    left           : 0;
    right          : 0;
    margin         : 0 auto;
    bottom         : 6px;
    width          : 50%;
    height         : 2px;
    /*border-bottom: 1px solid #fff;*/
    /*width        :0;
    height         :0;
    bottom         :2px;
    border-top     : 5px solid #fff;
    border-left    : 5px solid transparent;
    border-right   : 5px solid transparent;
    */
    display        : none;
}

.btn-light:not([disabled]):not(.disabled):active,
.btn-light:not([disabled]):not(.disabled).active,
.show>.btn-light.dropdown-toggle {
    color: #fff !important;
}

.btn-blue-grey:not([disabled]):not(.disabled):active,
.btn-blue-grey:not([disabled]):not(.disabled).active,
.show>.btn-blue-grey.dropdown-toggle {
    color: #fff !important;
}

.btn-light-blue:not([disabled]):not(.disabled):active,
.btn-light-blue:not([disabled]):not(.disabled).active,
.show>.btn-light-blue.dropdown-toggle {
    color: #fff !important;
}

.btn-mdb-color:not([disabled]):not(.disabled):active,
.btn-mdb-color:not([disabled]):not(.disabled).active,
.show>.btn-mdb-color.dropdown-toggle {
    color: #fff !important;
}

.btn-indigo:not([disabled]):not(.disabled):active,
.btn-indigo:not([disabled]):not(.disabled).active,
.show>.btn-indigo.dropdown-toggle {
    color: #fff !important;
}

.country_filter,
.category_filter {
    /*  max-width: 12rem;*/
}

.btn.form-check-label {
    margin-top: 0;
}

.network_type_navigation {
    font-weight: 500;
}

.table_sections_navigation>label {
    font-weight: normal !important;
}

#btn_clear_filters {
    font-size  : 0.8rem;
    font-weight: normal;
}


.star_column {
    position: relative;
}

.tag_parent span {
    font-size  : 0.6rem;
    font-weight: normal !important;
}

.info_icon {
    display      : inline-block;
    margin-left  : 5px;
    height       : 12px;
    margin-bottom: 8px;
}

.info_icon_small {
    display      : inline-block;
    position     : relative;
    margin-left  : 5px;
    height       : 12px;
    margin-bottom: 12px;
}

.info_con_tr {

    position: absolute;
    top     : 0;
    right   : -0.5em;
}

/* FIXED COLUMNS code */

table.DTFC_Cloned tr {
    background-color: white;
    margin-bottom   : 0;
}

div.DTFC_LeftHeadWrapper table,
div.DTFC_RightHeadWrapper table {
    border-bottom   : none !important;
    margin-bottom   : 0 !important;
    background-color: white;
}

div.DTFC_LeftBodyWrapper table,
div.DTFC_RightBodyWrapper table {
    border-top: none;
    margin    : 0 !important;
    z-index   : 2;
}

div.DTFC_LeftBodyWrapper table thead .sorting:before,
div.DTFC_LeftBodyWrapper table thead .sorting:after,
div.DTFC_LeftBodyWrapper table thead .sorting_asc:before,
div.DTFC_LeftBodyWrapper table thead .sorting_asc:after,
div.DTFC_LeftBodyWrapper table thead .sorting_desc:before,
div.DTFC_LeftBodyWrapper table thead .sorting_desc:after,
div.DTFC_LeftBodyWrapper table thead .sorting:before,
div.DTFC_LeftBodyWrapper table thead .sorting:after,
div.DTFC_LeftBodyWrapper table thead .sorting_asc:before,
div.DTFC_LeftBodyWrapper table thead .sorting_asc:after,
div.DTFC_LeftBodyWrapper table thead .sorting_desc:before,
div.DTFC_LeftBodyWrapper table thead .sorting_desc:after,
div.DTFC_RightBodyWrapper table thead .sorting:before,
div.DTFC_RightBodyWrapper table thead .sorting:after,
div.DTFC_RightBodyWrapper table thead .sorting_asc:before,
div.DTFC_RightBodyWrapper table thead .sorting_asc:after,
div.DTFC_RightBodyWrapper table thead .sorting_desc:before,
div.DTFC_RightBodyWrapper table thead .sorting_desc:after,
div.DTFC_RightBodyWrapper table thead .sorting:before,
div.DTFC_RightBodyWrapper table thead .sorting:after,
div.DTFC_RightBodyWrapper table thead .sorting_asc:before,
div.DTFC_RightBodyWrapper table thead .sorting_asc:after,
div.DTFC_RightBodyWrapper table thead .sorting_desc:before,
div.DTFC_RightBodyWrapper table thead .sorting_desc:after {
    display: none;
}

div.DTFC_LeftBodyWrapper table tbody tr:first-child th,
div.DTFC_LeftBodyWrapper table tbody tr:first-child td,
div.DTFC_RightBodyWrapper table tbody tr:first-child th,
div.DTFC_RightBodyWrapper table tbody tr:first-child td {
    border-top: none;
}

div.DTFC_LeftFootWrapper table,
div.DTFC_RightFootWrapper table {
    border-top      : none;
    margin-top      : 0 !important;
    background-color: white;
}

div.DTFC_Blocker {
    background-color: white;
}

table.dataTable.table-striped.DTFC_Cloned tbody {
    background-color: white;
}

table.DTFC_Cloned {
    overflow: hidden;
}

.DTFC_LeftBodyLiner table.DTFC_Cloned {
    /*margin-top:16px !important;*/
}

.dataTables_scrollHeadInner table {
    margin-bottom: 0 !important;
}

/************* tagify country ********************/

.tagify__dropdown.extra-properties .tagify__dropdown__item>img {
    display       : inline-block;
    vertical-align: middle;
    height        : 20px;
    transform     : scale(.75);
    margin-right  : 5px;
    border-radius : 50%;
    overflow      : hidden;
    transition    : .12s ease-out;
}

.tagify__dropdown.extra-properties .tagify__dropdown__item--active>img,
.tagify__dropdown.extra-properties .tagify__dropdown__item:hover>img {
    transform   : none;
    margin-right: 12px;
}

.tagify.countries .tagify__input {
    min-width: 175px;
}

.tagify.countries tag {
    white-space: nowrap;
}

.tagify.countries tag img {
    display      : inline-block;
    height       : 16px;
    margin-right : 3px;
    border-radius: 2px;
}

/*
.tagify {
    width     : 100%;
    max-width : 700px;
    background: rgba(255, 255, 255, 0.8);
}


.tagify__dropdown.users-list {
    font-size: 14px;
}

.tagify__dropdown.users-list .tagify__dropdown__item {
    padding              : 0.5em 0.7em;
    display              : grid;
    grid-template-columns: auto 1fr;
    gap                  : 0 1em;
    grid-template-areas  : "avatar name";
}

.tagify__dropdown.users-list .tagify__dropdown__item:hover .tagify__dropdown__item__avatar-wrap {
    transform: scale(1.2);
}

.tagify__dropdown.users-list .tagify__dropdown__item__avatar-wrap {
    grid-area    : avatar;
    width        : 36px;
    height       : 36px;
    border-radius: 50%;
    overflow     : hidden;
    background   : #EEE;
    transition   : 0.1s ease-out;
}

.tagify__dropdown.users-list img {
    width         : 100%;
    vertical-align: top;
}

.tagify__dropdown.users-list strong {
    grid-area  : name;
    width      : 100%;
    align-self : center;
    font-weight: 500;
}

.tagify__dropdown.users-list .addAll {
    border-bottom: 1px solid #DDD;
    gap          : 0;
}


.tagify__tag {
    white-space: nowrap;
}

.tagify__tag:hover .tagify__tag__avatar-wrap {
    transform: scale(1.6) translateX(-10%);
}

.tagify__tag .tagify__tag__avatar-wrap {
    width        : 16px;
    height       : 16px;
    white-space  : normal;
    background   : silver;
    border-radius: 50%;
    margin-right : 5px;
    transition   : 0.12s ease-out;
}

.tagify__tag img {
    width         : 100%;
    vertical-align: top;
}

.tagify__input:empty::before {

    color: #000;
}*/

.tagify__tag__removeBtn {
    width : 18px !important;
    height: 18px !important;
}


#watchlist_btn,
.md-pills .nav-link {

    padding: 0.25rem 0.75rem !important;
}

.table_sections_navigation .btn-sm {

    padding-top   : 0.4rem !important;
    padding-bottom: 0.4rem !important;
    padding-left  : 1rem !important;
    padding-right : 1rem !important;
}

.body_wrapper {

    min-height        : 100%;
    display           : grid;
    grid-template-rows: auto 1fr auto;
    -ms-grid-rows     : auto 1fr auto;
}


.small_relative_img {
    width     : 14px !important;
    max-height: 14px !important;
    position  : absolute;
    bottom    : -8px;
    left      : 32px;
}










/***************************** counter **************************/


.projects_counter {
    color          : #6B41A3;
    background     : #6B41A3;
    text-align     : center;
    width          : 200px;
    height         : 200px;
    padding        : 20px 15px;
    /*margin       : 0 auto;*/
    margin-left    : 3rem;
    margin-right   : 3rem;
    border-radius  : 20px;
    box-shadow     : 0 7px 5px -3px rgba(0, 0, 0, 0.3);
    overflow       : hidden;
    position       : relative;
    z-index        : 1;
    zoom           : 80%;
}

.projects_counter:before,
.projects_counter:after {
    content   : "";
    background: #fff;
    width     : 100%;
    height    : 50%;
    box-shadow: 0 -5px 5px rgba(0, 0, 0, 0.2);
    position  : absolute;
    bottom    : 0;
    left      : 0;
    z-index   : -1;
}

.projects_counter:before {
    background-color: transparent;
    height          : 130px;
    width           : 130px;
    border          : 5px solid #fff;
    border-radius   : 50%;
    box-shadow      : none;
    transform       : translateX(-50%);
    left            : 50%;
    top             : 15px;
    bottom          : auto;
}

.projects_counter .projects_counter-value {
    color        : #888;
    background   : #fff;
    font-size    : 35px;
    font-weight  : 600;
    line-height  : 110px;
    width        : 120px;
    height       : 120px;
    margin       : 0 auto 15px;
    border       : 5px solid #6B41A3;
    border-radius: 100%;
    box-shadow   : 0 5px 10px rgba(0, 0, 0, 0.3);
    display      : block;
}

.projects_counter h3 {
    font-size     : 15px;
    font-weight   : 700;
    text-transform: uppercase;
    padding       : 5px 5px 4px;
    margin        : 0;
    border        : 1px solid #6B41A3;
    border-radius : 20px;
}

.projects_counter.pink {
    color     : #E6007A;
    background: #E6007A;
}

.projects_counter.pink .projects_counter-value,
.projects_counter.pink h3 {
    border-color: #E6007A;
}

.projects_counter.blue {
    color     : #39B4EF;
    background: #39B4EF;
}

.projects_counter.blue .projects_counter-value,
.projects_counter.blue h3 {
    border-color: #39B4EF;
}

.projects_counter.orange {
    color     : #F39436;
    background: #F39436;
}

.projects_counter.orange .projects_counter-value,
.projects_counter.orange h3 {
    border-color: #F39436;
}

@media screen and (max-width:990px) {
    .projects_counter {
        margin-bottom: 40px;
    }
}


.home_news_date,
.home_event_date {

    font-size: 0.9rem;
}

.home_news_body,
.home_event_body {

    font-size: 0.9rem;
}


/*********************************** step progress bar ******************************/
/*.multi-steps > li.is-active ~ li:before, .multi-steps > li.is-active:before {
    content: counter(stepNum);
    font-family: inherit;
    font-weight: 700;
  }*/

.multi-steps>li.is-active~li:after,
.multi-steps>li.is-active:after {
    background-color: #ededed;
}

.multi-steps {
    display     : table;
    table-layout: fixed;
    width       : 180px;
}

.multi-steps>li {
    counter-increment: stepNum;
    text-align       : center;
    display          : table-cell;
    position         : relative;
    color            : #E6007A;

}

.multi-steps>li:before {
    /*  content: "";
    content: "✓;";
    content: "𐀃";
    content: "𐀄";
    content: "✓";*/
    display         : block;
    margin          : 0 auto 0px;
    background-color: #fff;
    width           : 24px;
    height          : 24px;
    line-height     : 20px;
    text-align      : center;
    font-weight     : bold;
    border-width    : 2px;
    border-style    : solid;
    border-color    : #E6007A;
    border-radius   : 50%;
}

.multi-steps>li:after {
    content         : "";
    height          : 2px;
    width           : 100%;
    background-color: #E6007A;
    position        : absolute;
    top             : 12px;
    left            : 50%;
    z-index         : -1;
}

.multi-steps>li:last-child:after {
    display: none;
}

.multi-steps>li.is-active:before {
    background-color: #fff;
    border-color    : #E6007A;
}

.multi-steps>li.is-active~li {
    color: #808080;
}

.multi-steps>li.is-active~li:before {
    background-color: #ededed;
    border-color    : #ededed;
}

.multi-steps li {
    margin-bottom: 0 !important;
}

.multi-steps {
    margin-bottom: 0 !important;
}




.multi-steps>li.announced:before {
    content: "A";

}

.multi-steps>li.testnet:before {
    content    : "T";
    font-family: inherit;
    font-weight: 700;
}

.multi-steps>li.rococo:before {
    content    : "R";
    font-family: inherit;
    font-weight: 700;
}

.multi-steps>li.parathread:before {
    content    : "PT";
    font-family: inherit;
    font-weight: 700;
}

.multi-steps>li.auction:before {
    content    : "A";
    font-family: inherit;
    font-weight: 700;
}

.multi-steps>li.kusama:before {
    content    : "K";
    font-family: inherit;
    font-weight: 700;
}


.multi-steps>li.polkadot:before {
    content    : "P";
    font-family: inherit;
    font-weight: 700;
}


.first_letter_filter {
    display      : inline-block;
    color        : #E6007A;
    border       : 1px solid #E6007A;
    font-weight  : bold;
    border-radius: 50%;
    width        : 1.2rem;
    height       : 1.2rem;
    text-align   : center;
    line-height  : 1.1rem;


    margin-right: 2px;
}


/*** main timeline ***/

.main-timeline {
    overflow: auto;

}

#project_timeline .main-timeline {
    width: 376px !important;
}

.ready_auction_first {

    width   : 20px;
    position: absolute;
    top     : 8px;
    left    : -8px;
    z-index : 100;
}

.ready_auction_last {

    /*width   : 32px;*/
    height: 48px;

}

.announced_text,
.rococo_text,
.parathread_text,
.auction_text,
.parachain_text {


    font-size: 0.7rem;



}

.parachain_text {

    /*position: absolute;*/
    padding-left: 10px;

}

.rococo_text {

    left    : 14px !important;
    position: absolute;
}

.parathread_text {

    left    : 6px !important;
    position: absolute;
}



.auction_timeline_img {

    position: absolute !important;
    top     : 2px;
    left    : 22px;
    height  : 22px !important;
}

.parathread_timeline_img {

    position: absolute !important;
    top     : 2px;
    left    : 22px;
    height  : 22px !important;
}

@media screen and (max-width:990px) {

    .auction_timeline_img {

        left: 12px;
    }

    .parathread_timeline_img {

        left: 12px;

    }

    .main-timeline-big .timeline-icon>*:first-child {

        margin-left: 12px !important;
    }

    .main-timeline-big .timeline-icon:before {

        margin-left: 12px !important;
    }

    .main-timeline-big .timeline:first-of-type .timeline-icon:after {
        width: 18px !important;

    }

    .main-timeline-big .timeline:last-of-type .timeline-icon:after {

        width: 38px !important;
        
    }

    #project_timeline .main-timeline {
        width       : 264px !important;
        padding-left: 6px !important
    }

    .ready_auction_first {

        left: -16px;
    }

    .ready_auction_last {

        height: 20px;

    }

    .ready_auction_home_mobile {

        height     : 20px;
        margin-left: -10px;
    }

    .announced_text {


        font-size: 0.7rem;
        left     : 2px !important;
    }

    .rococo_text {


        font-size: 0.7rem;
        left     : 8px !important;
        position : absolute;

    }

    .parathread_text {
        left    : 2px !important;
        position: absolute;

        font-size: 0.7rem;
    }

    .auction_text {


        font-size: 0.7rem;
        left     : 12px !important;
        position : absolute;
    }

    .parachain_text {

        font-size: 0.7rem;

    }
}

.main-timeline .timeline {
    padding     : 0;
    text-align  : center;
    /*overflow  : hidden;*/
}


/************ big timeline ************/
.main-timeline-big .timeline {

    text-align: left;
}




.main-timeline-big .timeline-icon>*:first-child {


    font-size  : 18px;
    height     : 18px;
    line-height: 18px !important;
    margin-left: 24px;

}



/************ big timeline ************/


.main-timeline .timeline-icon {
    padding-bottom: 5px;
    margin-bottom : 10px;
    font-size     : 0.9rem;
    color         : #ccc;
    border-bottom : 2px solid #ccc;
    position      : relative;
}

.main-timeline-big .timeline-icon {
    padding-bottom: 7px;
    font-size     : 18px;
    margin-bottom : 10px;

}

.main-timeline-mobile .timeline:last-of-type>img {

    width   : 18px;
    position: absolute;
    top     : 16px;
    left    : -15px;
    z-index : 100;


}

.main-timeline-mobile .timeline:last-of-type .timeline-icon:after {

    width: 44px !important;

}

.main-timeline-mobile .timeline-icon {

    padding-bottom: 7px;
    font-size     : 26px;
    margin-bottom : 10px;
}

.main-timeline-mobile .timeline-icon:first-of-type {

    margin-left : -4px !important;
    margin-right: 4px !important;
}

.main-timeline-mobile .timeline:last-of-type .timeline-icon {

    /*margin-left: -4px !important;*/
    margin-right: 0px !important;
}

.main-timeline-mobile .timeline-icon i {

    margin-left: -10px !important;

}

.main-timeline-mobile .timeline:last-of-type .timeline-icon:before {


    margin-left: 10px !important;


}


.main-timeline-mobile .timeline:first-of-type .timeline-icon:after {

    border-bottom: 5px solid #F2F2F2 !important;
    z-index      : 10;
}

.main-timeline-mobile .timeline:last-of-type .timeline-icon:after {

    border-bottom: 5px solid #F2F2F2 !important;
}


.main-timeline .timeline-icon:before {
    content      : "";
    width        : 8px;
    height       : 8px;
    border-radius: 50%;
    background   : #ccc;
    margin       : 0 auto;
    position     : absolute;
    bottom       : -5px;
    left         : 6px;

    right      : 0;
    margin-left: 12px;
    border     : 2px solid #fff;
}

.timeline_status_column .main-timeline .timeline-icon:before {

    margin-left: 8px !important;
}

.timeline_status_column .main-timeline .timeline:first-of-type .timeline-icon:after {
    width: 14px !important;
}

.timeline_status_column .main-timeline .timeline:last-of-type .timeline-icon:after {
    width: 24px !important;
}

.main-timeline-big .timeline-icon:before {

    width      : 10px;
    height     : 10px;
    top        : 30px;
    margin-left: 22px;

}

.main-timeline .timeline:last-of-type .timeline-icon:before {

    /*width        : 10px;
    height       : 10px;
    */
}

.main-timeline .timeline:last-of-type .timeline-icon:after {
    content      : "";
    display      : block;
    position     : absolute;
    width        : 12px;
    bottom       : -4px;
    right        : 0;
    border-bottom: 5px solid white;
}


.main-timeline-big .timeline:last-of-type .timeline-icon:before {


    margin-left: 22px;

}

.main-timeline-big .timeline:last-of-type .timeline-icon:after {


    width : 56px;
    bottom: -4px;
    right : 0px;

}


.main-timeline .timeline:first-of-type .timeline-icon:after {
    content      : "";
    display      : block;
    position     : absolute;
    width        : 18px;
    bottom       : -4px;
    left         : 0;
    border-bottom: 5px solid white;
}

.main-timeline-big .timeline:first-of-type .timeline-icon:after {

    width : 30px;
    bottom: -4px;
    left  : 0;

}


.main-timeline .timeline-content {
    padding: 0 10px;
}


.timeline-icon {

    color: #555;
}

.main-timeline.kusama .active .timeline-icon {

    color        : #212529 !important;
    border-bottom: 2px solid #E6007A;
}

/** old green #66bb6a **/

.main-timeline.kusama .active .timeline-icon:before {

    background: #E6007A !important;
    border    : 2px solid #fff;
}


.main-timeline.polkadot .active .timeline-icon {

    color        : #212529 !important;
    border-bottom: 2px solid #E6007A;
}

.main-timeline.polkadot .active .timeline-icon:before {

    background: #E6007A !important;
    border    : 2px solid #fff;
}


/*
.main-timeline .timeline:nth-child(2n) .timeline-icon,
.main-timeline .timeline:nth-child(2n) .post {
    color: #008b8b;
}

.main-timeline .timeline:nth-child(2n) .year,
.main-timeline .timeline:nth-child(2n) .timeline-icon:before {
    background: #008b8b;
}

.main-timeline .timeline:nth-child(3n) .timeline-icon,
.main-timeline .timeline:nth-child(3n) .post {
    color: #e77e21;
}

.main-timeline .timeline:nth-child(3n) .year,
.main-timeline .timeline:nth-child(3n) .timeline-icon:before {
    background: #e77e21;
}

.main-timeline .timeline:nth-child(4n) .timeline-icon,
.main-timeline .timeline:nth-child(4n) .post {
    color: #3498db;
}

.main-timeline .timeline:nth-child(4n) .year,
.main-timeline .timeline:nth-child(4n) .timeline-icon:before {
    background: #3498db;
}

.main-timeline .timeline:nth-child(5n) .timeline-icon,
.main-timeline .timeline:nth-child(5n) .post {
    color: #cca872;
}

.main-timeline .timeline:nth-child(5n) .year,
.main-timeline .timeline:nth-child(5n) .timeline-icon:before {
    background: #cca872;
}

.main-timeline .timeline:nth-child(6n) .timeline-icon,
.main-timeline .timeline:nth-child(6n) .post {
    color: #ed687c;
}

.main-timeline .timeline:nth-child(6n) .year,
.main-timeline .timeline:nth-child(6n) .timeline-icon:before {
    background: #ed687c;
}*/

.rectangle {
    width     : 54px;
    height    : 54px;
    padding   : 8px 8px 8px 8px;
    background: #616161;
}

.triangle {
    width     : 15px;
    height    : 10px;
    transform : rotate(180deg);
    background: #616161;
}

.tooltip {
    pointer-events: none !important;
}

.color-kusama {
    color: #000 !important;
}

.color-polkadot {
    color: #E6007A !important;
}

#selected_filters {

    height: 40px;

}

/** tagify fixes **/
.tagify {
    --tag-inset-shadow-size    : 2rem !important;
    /*--tags-focus-border-color: #CED4DA !important;*/
    --tags-hover-border-color  : #CED4DA !important;
    --tags-border-color        : #CED4DA !important;
    --tags-focus-border-color  : #CED4DA !important;

    --placeholder-color: gray !important;
    border-radius      : 4px;

}

.tagify__dropdown__wrapper {
    border: 1px solid #CED4DA !important;
}


.tagify_filter {

    --tag-inset-shadow-size: 5rem !important;

    border: 0px !important;
}

.tagify__dropdown .tagify__dropdown__wrapper {
    max-height: 20rem !important;
}




.news_image {

    width        : 32px;
    height       : 32px;
    object-fit   : contain;
    border-radius: var(--radius-sm);
    padding      : 2px;
    background   : #fff;
}



.partners_image_details {
    object-fit: contain;
    padding   : 1px;
    height    : 35px;
    width     : 35px;

}

.partners_cells_details {

    align-items: center;
    padding    : 0.5rem;

}




.table_sections_navigation .btn.active {
    background-color: #4a5b64 !important;
    color           : #fff !important;
}




/*.details_investor_cell {
    display    : flex;
    flex-flow  : row nowrap;
    align-items: center;
    padding    : 0.5rem;
    text-align : center;
    color      : #747373;
    font-size  : 0.8rem !important;
}*/


.details_investor_img {

    position : relative;
    top      : 50%;
    transform: translateY(-50%);

    display     : block;
    margin-left : auto;
    margin-right: auto;
    max-height  : 45px;
    width       : auto;
    max-width   : 90px;

}


/********* news card ****/

.news-list {

    padding: 0px;
}

.news_card_small {
    margin-top: 1rem;
}

.news_card:not(:last-child) {
    border-bottom: 1px solid lightgray;
}

.news_card {
    padding-bottom: 1rem;
    padding-top   : 1rem;
}

.news_card_main {

    padding-bottom: 3rem !important;
}

.big_watchlist_image {
    width : 45px !important;
    height: 45px !important;

}

.watchlist_image {

    width        : 35px;
    height       : 35px;
    object-fit   : contain;
    border-radius: 50%;
    padding      : 2px;
    background   : #fff;
}


.fc-event-time,
.fc-event-title {
    padding    : 0 1px;
    white-space: normal;
}

.fc-event-title {

    text-align: left;
}


.fc-toolbar-chunk .btn {

    /*padding: 0.2*/
    padding: .64rem 1.7rem;


}

.heading_image {

    width       : 2.3rem;
    object-fit  : scale-down;
    height      : 2.3rem;
    /*padding   : 2px;*/

}

.heading_image_big {

    height    : 48px;
    object-fit: contain;

    /*padding   : 2px;*/
}


.heading_image2 {

    width     : 40px;
    object-fit: scale-down;
    height    : 40px;

}

.heading_image3 {

    width     : 1.5rem;
    object-fit: scale-down;
    height    : 1.5rem;
}

.home_info_center {
    font-size: 1rem !important;
}

.alt_font_value {

    font-size: 1.1rem;
}

.alt_font_value2 {

    font-size: 0.9rem;
}

/*.info_tokens_locked {
    font-size: 0.8rem;
}*/

.home_info_auction_title {

    min-width: 5.4rem;
}


@media (min-width: 900px) {
    .home_top_content {

        position     : relative;
        padding-left : 0;
        padding-right: 1.25rem;
    }

    .home_news_content {

        position     : relative;
        padding-left : 0 !important;
        padding-right: 1.25rem !important;
    }

    .home_events_content {

        position    : relative;
        padding-left: 0;

    }
}

@media (max-width: 900px) {

    .home_info_auction_title {

        min-width: 4.4rem;
    }

    .heading_image {

        width       : 2rem;
        object-fit  : scale-down;
        height      : 2rem;
        /*padding   : 2px;*/

    }

    .heading_image3 {

        width     : 1.2rem;
        object-fit: scale-down;
        height    : 1.2rem;
    }

    /*.home_top_content {
        padding-left:0px;
        padding-right:0px;
    }*/



    .home_cards {
        /*margin-left:0px !important;
        margin-right:0px !important;*/
        max-width: 100%;
    }

    .home_info_center {
        font-size    : 0.8rem !important;
        padding-left : 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    .home_info_center .info_content {

        margin-left : 1rem !important;
        margin-right: 0.5rem !important;
    }


    .auction_bid_img {
        padding-right: 0.5rem !important;
    }

    .home_info_center .alt-font {

        font-size: 0.8rem !important;
    }

    .home_info_center .h4 {

        font-size: 1rem !important;

    }
}

.card-title,
.card-title a {
    font-family: 'Kanit', sans-serif;
}


.card-title a:hover {

    color: #212529;

}

.alt-font {
    font-family: 'Kanit', sans-serif;
    color      : #212529 !important;
}

.pills-rounded .nav-item .nav-link {
    /*border-radius: 10rem;*/

    border-radius: var(--radius-sm);
}

#parachains_table_info {

    font-size: 0.9rem;
}

.fc-day-grid-container.fc-scroller {
    height    : auto !important;
    overflow-y: auto;
}



.datetime {

    font-size: 0.8rem;
    color    : #636363;
}

.card-header {
    text-align: center;
    font-size : 1.3rem;

}

/**************************************** for mobiles *****************/
/**************************************** for mobiles *****************/
/**************************************** for mobiles *****************/
@media (max-width: 420px) {

    .h1,
    h1 {
        font-size: 1.6rem !important;
    }

    .h2,
    h2 {
        font-size: 1.5rem !important;
    }

    .h3,
    h3 {
        font-size: 1.4rem !important;
    }

    .h4,
    h4 {
        font-size: 1.3rem !important;
    }

    .h5,
    h5 {
        font-size: 1.2rem !important;
    }

    .h6,
    h6 {
        font-size: 1.1rem !important;
    }

}

@media (max-width: 575px) {


    h2 {
        font-size: 1.7rem !important;
    }

    h3 {
        font-size: 1.5rem !important;
    }

    h4 {
        font-size: 1.3rem !important;
    }

    h5 {
        font-size: 1.2rem !important;
    }

    h6 {
        font-size: 1.1rem !important;
    }

    .footer_row {

        margin-top   : 16px;
        margin-bottom: 16px;
    }

    .home_news_body,
    .home_event_body {
        font-size: 0.9rem;
    }





    .popover-header {

        font-size: 0.9rem !important;
    }

    .card-body {

        padding: 0.5rem !important;

    }

    #search_filters .switch {

        height: 2rem !important;
    }

    #search_filters {
        /*position: sticky;
        position: -webkit-sticky;
        top:0;
        z-index:200;
        background: #fff;*/
    }

    .switch-pink,
    .label_status {

        padding-left    : 8px;
        font-size       : 0.8rem !important;
        font-weight     : 500 !important;
        /*  font-family : 'Roboto', sans-serif !important;*/
    }

    .switch label .lever {

        -webkit-transition: background 0.05s ease !important;
        transition        : background 0.05s ease !important;
    }

    .switch label .lever:after {

        -webkit-transition: left 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.25s ease !important;
        transition        : left 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.25s ease !important;
        transition        : left 0.1s ease, background 0.1s ease, box-shadow 0.25s ease !important;
        transition        : left 0.1s ease, background 0.1s ease, box-shadow 0.25s ease, -webkit-box-shadow 0.25s ease !important;
    }

    a {
        /*padding-top   : 4px !important;
        padding-bottom: 4px !important;
        display       : inline-block !important;*/
    }



    .mobile_partners_icon {


        height : 25px;
        margin : 8px;
        display: inline-block;
        padding: 2px;
    }

}

.text_lightgray {
    color: #838383;
}

.text_grey {
    color: #757575;
}



.badge-small {
    font-size: 0.75rem !important;
}

.badge-legend {

    font-size: 0.8rem !important;

}


.label_filters {
    font-size  : 0.8rem !important;
    font-weight: 300 !important;

}

.day_div {

    padding-left      : 0.75rem;
    padding-top       : 0.75rem;
    padding-bottom    : 0.75rem;
    /*background-color: #efebe9 ;*/
    background        : #eceff1;

}

.parachain_url {
    color: #212529 !important;
}

.parachain_url:hover {

    /*color  : #000;*/

}

.parachain_small_font {

    font-size: 0.9rem;
}


.details_more_button {
    padding-top   : 4px;
    border-radius : var(--radius-sm);
    padding-left  : 10px;
    padding-right : 10px;
    font-size     : 1rem;
    padding-bottom: 8px;
    background    : #f5f5f5;
    max-width     : 320px;
    width         : 100%;
    text-align    : center;
}


.auction_video {

    overflow  : visible;
    width     : 320px;
    /*height  : 165px;*/
}

@media screen and (max-width:990px) {

    .auction_video {
        margin-top   : 1rem;
        margin-bottom: 1rem;
    }
}

.auction_video img {

    object-fit: scale-down;
    width     : 100%;
    height    : 100%;

}




.div_screenshot {

    overflow       : visible;
    border-radius  : var(--radius-md);
    border-width   : 2px !important;
    float          : right;
    width          : 320px;
    /*height       : 165px;*/

}

@media screen and (max-width:990px) {

    .div_screenshot {
        margin-top   : 1rem;
        margin-bottom: 1rem;
    }
}

.div_screenshot img {

    object-fit: scale-down;
    width     : 100%;
    height    : 100%;
    max-height: 350px;

}


@media (max-width: 575px) {

    .div_screenshot {

        width: 100%;


    }



    .details_more_button {
        width: 100% !important;
    }
}


#navbarParachainsMenu {

    font-weight: 400;
}

@media (min-width: 576px) {

    #navbarParachainsMenu {
        height    : 1rem;
        margin-top: 1.6rem;
    }

    .navbarParachainsMenuNoLogin {

        margin-top: 1.2rem !important;
    }
}

.news_text {

    font-size: 1rem;

}



.details_network_type {

    position: absolute;

    right    : 0;
    top      : 0;
    font-size: 1.7rem;
}

@media (max-width: 575px) {

    .details_network_type {

        position: absolute;

        right    : 0;
        top      : 3rem;
        font-size: 1.2rem;
    }

}


.investor_row {

    /*border-bottom: 1px solid  #E6007A ;*/

}




/******************************************* typeahead *****************************/

.typeahead__container button {

    padding-left : 2px;
    padding-right: 2px;
}

.typeahead__dropdown,
.typeahead__list {


    margin-top: 0px;
}

.typeahead__list>.typeahead__group:first-child {
    border-top: solid 1px #ECEFF1;

}

.typeahead__list>li.typeahead__group+li.typeahead__item {
    border-color: #ECEFF1;
}

.typeahead__list>.typeahead__group {
    border-color: #ECEFF1;

}

.typeahead__field .typeahead__hint:active,
.typeahead__field .typeahead__hint:focus,
.typeahead__field [contenteditable]:active,
.typeahead__field [contenteditable]:focus,
.typeahead__field input:active,
.typeahead__field input:focus,
.typeahead__field textarea:active,
.typeahead__field textarea:focus {
    border-color: #949494;
}

.typeahead__list>.typeahead__group.active>a,
.typeahead__list>.typeahead__group>a,
.typeahead__list>.typeahead__group>a:focus,
.typeahead__list>.typeahead__group>a:hover {

    color: #212529;

    /*background: linear-gradient(40deg, #000, #E6007A) !important;*/
    background: #eaeaea !important;

}

/*
.typeahead__container {
    height:36px;
}
.typeahead__container button {

    padding: 2px 2px 2px 2px;
}
.typeahead__field .typeahead__hint, .typeahead__field [contenteditable], .typeahead__field input, .typeahead__field textarea {
    min-height: 1rem !important;
    padding: 2px 8px 2px 8px;
}*/



.search_area {

    z-index    : 2;
    position   : relative;
    height     : 54px;
    line-height: 54px;
    color      : #fff;
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

footer.page-footer {
    overflow: hidden;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

@media screen and (max-width:990px) {
    .search_area {
        height     : 110px;
        line-height: 50px;
    }
}



.card .card-body .card-text {

    color: #212529 !important;
}


.url_parachain {

    color: #212529;
}

.url_parachain:hover {

    color: #212529;
}

.url_black {

    color  : #212529;
    display: inline-block;
}

.url_black:hover {

    /*color  : #000;*/

}


.global_filter {
    position  : sticky;
    position  : -webkit-sticky;
    top       : 0px;
    background: #fff;
    z-index   : 2;
}

.filters_box div:first-child {

    position  : sticky;
    position  : -webkit-sticky;
    top       : 10px;
    background: #fff;
    z-index   : 2;
}


.project_details_logo {
    height      : 4rem;
    width       : 4rem;
    margin-right: 16px;
    object-fit  : contain;
    padding     : 2px;
}

.investor_details_logo {
    max-height    : 4rem;
    max-width     : 10rem;
    margin-right  : 16px;
    object-fit    : contain;
    /*padding     : 2px;*/
}

.video_description {
    font-size: 0.9rem !important;
}

.parachain_rewards_column_logo {

    width     : 25px;
    height    : 25px;
    object-fit: contain;
    padding   : 1px;
}

.crowdloan_column_logo,
.auction_column_logo {
    width     : 50px;
    height    : 50px;
    object-fit: contain;
    padding   : 2px;
}

.project_image_logo {

    width     : 40px;
    height    : 40px;
    object-fit: contain;
    padding   : 2px;
}

.project_image_news {
    height    : 40px;
    width     : 40px;
    object-fit: contain;
    padding   : 2px;
}


.project_repres {
    font-size : 0.8rem;
    float     : right;
    margin-top: 1rem;

}




@media (max-width: 575px) {


    .auction_column_logo,
    .crowdloan_column_logo {

        width : 40px;
        height: 40px;
    }

    .project_image_logo {

        width : 40px;
        height: 40px;
    }

    .project_image_news {
        height    : 40px;
        width     : 40px;
        object-fit: contain;
        padding   : 2px;
    }

    .news_parachain_name {

        min-width: 85px !important;
    }


    .project_repres {
        margin-left: 8px;
        margin-top : 1rem;
        font-size  : 0.9rem;
    }

}


.project_contacts {
    /*background: #f5f5f5;*/
    right: 0;
    top  : -8px;
}

.project_contacts div:last-child {

    padding-right: 0 !important;
    margin-right : 0 !important;
}




.main_div {
    /*min-height: 100%;*/
    max-width : 1600px !important;
    margin-top: 60px !important;
}

@media (max-width: 975px) {
    .main_div {

        margin-top: 80px !important;
    }
}



.df-switch {
    margin-top: 20px;
    padding   : 2rem;
    text-align: center;
}

.btn-toggle {
    top      : 50%;
    transform: translateY(-50%);
}

.btn-toggle {
    margin       : 0 4rem;
    padding      : 0;
    position     : relative;
    border       : none;
    height       : 1.5rem;
    width        : 5rem;
    border-radius: 1.5rem;
    color        : #6b7381;
    background   : #0885da;
}

.btn-toggle:focus,
.btn-toggle.focus,
.btn-toggle:focus.active,
.btn-toggle.focus.active {
    outline: none;
}

.btn-toggle:before,
.btn-toggle:after {
    line-height   : 1.5rem;
    width         : 4rem;
    text-align    : center;
    font-weight   : 600;
    font-size     : 0.75rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    position      : absolute;
    bottom        : 0;
    transition    : opacity 0.25s;
}

.btn-toggle:before {
    content: 'ENGLISH';
    left   : -5rem;
    color  : #109fff;
}

.btn-toggle:after {
    content: 'SPANISH';
    right  : -5rem;
    opacity: 0.5;
    color  : #F47280;
}

.btn-toggle>.inner-handle {
    border-radius   : 13px;
    width           : 65px;
    height          : 13px;
    position        : absolute;
    top             : 6px;
    left            : 8px;
    background-color: #0f71bd;
    box-shadow      : inset 1px 1px 2px -1px black;
}

.btn-toggle.active>.inner-handle {
    background-color: #BD4053;
}

.btn-toggle>.handle:before {
    content          : "";
    position         : absolute;
    height           : 34px;
    width            : 34px;
    top              : 35%;
    left             : 11px;
    background-image : radial-gradient(circle at center, #0785da 5px, transparent 5px);
    background-size  : 10px 10px;
    background-repeat: no-repeat;
}

.btn-toggle.active>.handle:before {
    background-image: radial-gradient(circle at center, #F47280 5px, transparent 5px);
}

.btn-toggle>.handle {
    position     : absolute;
    top          : -0.2875rem;
    left         : 0.3875rem;
    width        : 2.125rem;
    height       : 2.125rem;
    border-radius: 1.125rem;
    background   : #fff;
    transition   : left 0.25s;
    border       : 1px solid #ccc;
}

.btn-toggle.active {
    transition: background-color 0.25s;
}

.btn-toggle.active>.handle {
    left      : 2.4175rem;
    transition: left 0.25s;
}

.btn-toggle.active:before {
    opacity: 0.5;
}

.btn-toggle.active:after {
    opacity: 1;
    color  : #F47280;
}

.btn-toggle.active {
    background-color: #F47280;
}


.network-tab {
    font-size: 1.2rem !important;
}

.auction-tab {
    font-size: 1.1rem !important;
}

.auction_subheader,
.auction_subheader span,
.auction_subheader div {

    font-family: 'Kanit' !important;
    font-size  : 1.2rem !important;
}

.auctions_date {

    font-size: 1.1rem !important;
}

.small_font_9 {

    font-size: 0.9rem !important;
}

.small_font_8 {

    font-size: 0.8rem !important;
}



.parachain_reward_project_column {

    min-width: 12rem !important;
    max-width: 12rem !important;
    width    : 12rem;
}

@media (max-width: 900px) {

    .parachain_reward_project_column {

        min-width: 12rem !important;

        max-width: 12rem !important;
        width    : 12rem;
    }
}







.embera-embed-responsive {
    position      : relative;
    display       : block;
    width         : 100%;
    padding       : 0;
    overflow      : hidden;
    padding-bottom: 50%;
}

.embera-embed-responsive-item {
    position: absolute;
    top     : 0;
    bottom  : 0;
    left    : 0;
    width   : 100%;
    height  : 100%;
    border  : 0;
}



.line_break {

    width: 100%;
}

.news_embed,
.news_article {

    width           : 100%;
    padding-top     : 1rem;
    padding-bottom  : 1rem;
    /*padding-left  : 1rem;*/
    padding-right   : 1rem;
}

.news_embed {

    padding-top: 1rem !important;
}

@media (max-width: 900px) {

    .news_embed,
    .news_article {

        padding       : 0;
        padding-top   : 0.5rem;
        padding-bottom: 1rem;

    }

    .news_article {
        padding-left : 0.5rem;
        padding-right: 0.5rem;
    }
}


@media (min-width: 901px) {
    .news_addon {

        /*max-height:100%;*/
        /*margin-left: 160px;*/
    }
}



.embed_content_desktop:hover,
.embed_content:hover {
    background: rgb(247, 249, 249);
}

.embed_content {


    max-width: 550px;
    width    : 100%;

    border-left   : 0.25rem solid #CFD9DE;
    border-radius : var(--radius-md);
    padding       : 0.8rem;
    padding-top   : 0.1rem;
    padding-bottom: 0.4rem;
    font-size     : 0.9rem;
}

.embed_content_desktop {


    /*max-width: 550px;*/
    width: 100%;

    border-left   : 0.25rem solid #CFD9DE;
    border-radius : var(--radius-md);
    padding       : 0.8rem;
    padding-top   : 0.4rem;
    padding-bottom: 0.4rem;
    font-size     : 0.9rem;
}

.embed_description {

    margin-bottom: 0.5rem;

}

.embed_image {

    margin    : 0 auto;
    text-align: left;
    width     : 100%;
}


.embed_image img {

    max-width : 100%;
    width     : 100%;
    object-fit: scale-down;

}

.embed_image_desktop {

    /*   margin    : 0 auto;*/
    /*max-height: 200px;*/
    text-align: right;
    max-width : 180px;
    width     : 100%;
}


.embed_image_desktop img {

    max-width  : 180px;
    /* width   :100%;*/
    /*height   : 100%;*/

    object-fit: scale-down;


}

@media (max-width: 900px) {
    .embed_image img {

        max-width: 100%;
        width    : 100%;

    }
}

.details_blockquote {
    padding    : .25rem 0.5rem;
    border-left: .2rem solid #eceeef;
}



.more_news {

    font-size: 0.9rem;

}

@media (max-width: 900px) {
    .more_news {
        margin-top: 1.5rem !important;
    }
}


.comments_to_tables {
    color         : #616161;
    padding-bottom: 2rem;
    font-weight   : 400;
    font-size     : 0.8rem
}


.auction_chart_body {
    width : 100%;
    height: 350px;
}

/*
@media (max-width: 750px) {

    .auction_chart_body {
        width:100%;
        height:200px;
    }
}
*/


.info_content .nav-link {

    font-weight: 400;
}

.js-typeahead-global_search::placeholder {

    font-sizE: 0.9rem;
}


.replay_contrib_progress {
    bottom       : 0;
    left         : 150px;
    padding-left : 1rem !important;
    padding-right: 1rem !important;
}




.faq_question {

    font-weight: 500;
}




.md-accordion .card .card-body {

    font-size  : 1rem !important;
    font-weight: 400 !important;
    padding-top: 0 !important;
}


.md-accordion .faq-header>a {

    padding-bottom: 0.8rem !important;
    padding-top   : 0.8rem !important;
    display       : inline-block;
    width         : 100%;
}

.md-accordion .faq-header {
    padding-bottom: 0rem !important;
    padding-top   : 0rem !important;
}

.md-accordion .faq-header .h5 {

    font-size  : 1.1rem !important;
    font-weight: 500 !important;
    text-align : left;


}


/*
@media (min-width: 901px) {

    #div-networks-tabs {

        position   : -webkit-sticky;
        position   : sticky;
        top        : 0px;
        z-index    : 100;
        padding-top: 0px !important;
    }

    #div-networks-tabs a {
        transition: 0s !important;
    }

    #div-networks-tabs.isSticky {
        text-align: right !important;
    }

    #div-networks-tabs.isSticky {

        opacity: 0.9;


    }

    #div-networks-tabs.isSticky a {


        font-size    : 0.9rem !important;
        padding      : 0.45rem 0.8rem !important;
     
    }


    #div-networks-tabs.isSticky #network-polkadot img {

        
        height      : 1.3rem !important;

    }

    #div-networks-tabs.isSticky #network-kusama img {

        
        height      : 1rem !important;

    }




}

*/

@media (max-width: 900px) {

    .replay_contrib_progress {

        left         : 6rem;
        bottom       : -16px;
        padding-left : 1rem !important;
        padding-right: 1rem !important;

    }

    .mobile_column {

        padding-left : 5px;
        padding-right: 5px;
    }

    .auctions_timetable {

        font-size: 0.9rem;
    }


    #faq_accordion {

        /*max-width: 20rem;*/
    }

    .md-accordion .faq-header .h5 {

        font-size: 1rem !important;
    }

    .md-accordion .card .card-body {

        font-size: 0.9rem !important;

    }
}


.crowdloan_button {
    min-width  : 116px;
    text-align : center;
    font-size  : 0.9rem !important;
    font-weight: 500 !important;
    padding    : 0.3rem 0.8rem !important;
}

.crowdloan_join {
    font-size  : 0.9rem !important;
    font-weight: 500 !important;
    padding    : 0.3rem 1.2rem !important;
}

.ref_code_popup {

    max-width    : 95% !important;
    border-radius: 0.5rem;
}


.popover-body {
    font-size: 0.8rem;
}

.popover-body ul {

    margin-bottom       : 0;
    padding-inline-start: 1rem;
    margin-block-start  : 0em;


}

.auction_date_badge_kusama {

    border-color: #000 !important;
}

.auction_date_badge_polkadot {

    /*border-color: #E6007A !important;
    color: #E6007A;*/
}



.auction_date_badge {

    font-size : 0.8rem;
    text-align: center;
    width     : 140px !important;
    border    : 1px solid #DEE2E6;


    /*padding-left  : .4rem;
    padding-right : .4rem;*/
    padding-top   : .25rem;
    padding-bottom: .25rem;
    border-radius : var(--radius-sm);

}

.border2px {


    /*border: 1px solid #a6b1bc;*/
    border: 1px solid #909dab;
}

/*
.auctions_timetable div:first-child {

    border-left: 1px solid #000 !important;
}*/


.crowdloan_more_btn {}



.th_funds_raised {
    /*min-width: 150px;*/
    /*max-width: 220px;*/
}

.th_contributions {
    max-width: 10rem;
    min-width: 10rem;
}

.th_tokenomics {
    /*min-width:11rem !important;
    width:11rem !important;*/
}

@media (max-width: 900px) {

    .th_funds_raised {
        min-width: 120px;
        max-width: 150px;
    }

    .th_contributions {
        max-width: 8rem;
        min-width: 8rem;
    }

    .th_tokenomics {
        min-width: 13rem !important;
        width    : 13rem !important;
    }
}



.crowdloan_project_name {

    min-height: 60px;
}

.main_table_info_box {
    float         : right;
    color         : #636363;
    padding-top   : 1rem;
    padding-bottom: 1rem;
    font-weight   : 400;
    font-size     : 0.8rem
}


.w3f_badge_mt {
    border       : 1px solid #fff;
    border-radius: 50%;
    position     : absolute;
    height       : 2rem;
    top          : 50%;
}



.filters_desc {
    color    : #636363 !important;
    font-size: 0.9rem;
}

.comment_text_after_table {
    color         : #616161;
    padding-bottom: 1rem;
    font-weight   : 400;
    font-size     : 0.8rem;
}

.networks_tabs {
    display   : inline-block;
    background: #fff !important;
    border    : 0px solid #ccc;
}


.progress-bar-kusama {
    background: #212529 !important;

}

.progress-bar-polkadot {
    background: #E6007A !important;
}

.investor_title {
    color: #212529;
}

.investor_mobile_title {

    background: #eee;
    color     : #212559;
}

.btn-auctions-history {

    font-size : 1.1rem !important;
    margin-top: 0px;

}

/**************************************************************************************************************/
/***********
                                DARKMODE
****************/
/**************************************************************************************************************/

/** main darl color **/
/*.darkmode--activated ::-webkit-scrollbar-track{background-color: #333;}*/
/*.darkmode--activated ::-webkit-scrollbar-thumb{background-color:#d6872c; */

.darkmode--activated .btn-link {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .progress {

    background: rgba(255, 255, 255, 0.67) !important;
}

.darkmode--activated .progress-bar-polkadot {

    background: #CE0065 !important;

}

.darkmode--activated .logo_in_filter {
    background: #e0e0e0 !important;
    padding   : 1px !important;
}



.darkmode--activated .main_table_investors_count {
    color: #121212 !important;
}

.darkmode--activated .badge_top_investor {
    border          : 0px solid rgba(255, 255, 255, 0.77) !important;
    background-color: #383838 !important;

}

.darkmode--activated .pagination .page-item .page-link:hover {


    background: #383838 !important;
}

.darkmode--activated .pills-polkadot .nav-link.active {


    background: #CE0065 !important;
}

.darkmode--activated .pagination .page-item.active .page-link {

    background: #CE0065 !important;
}

.darkmode--activated .investor_mobile_title {

    background: #383838;
    color     : rgba(255, 255, 255, 0.87) !important
}

.darkmode--activated pre {

    color: rgba(255, 255, 255, 0.87) !important
}

.darkmode--activated .dropzone {

    background  : #1E1E1E !important;
    border-color: #2c2c2c;
}

.darkmode--activated a {
    /*color: #3700B3;*/
}

.darkmode--activated .card-header {

    background-color: #383838 !important;

}


.darkmode--activated .fc-event-title {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .fc .fc-scrollgrid-section-sticky>* {

    background: #1E1E1E !important;
}

.darkmode--activated .investor_title {
    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .dark_theme {

    padding   : 1px;
    background: rgba(255, 255, 255, 0.87) !important
}

.darkmode--activated .auction_date_badge {

    border-color: #2c2c2c !important;

}

.darkmode--activated .border2px {

    border-color: #e1e1e1 !important;
}

.darkmode--activated .embed_content_desktop:hover,
.darkmode--activated .embed_content:hover {
    background: #383838;
}

.darkmode--activated .badge-success {

    background-color: #28a745 !important;
}

.darkmode--activated .text-success-dark {

    color: #00c851 !important;
}

.darkmode--activated .text-danger-dark {

    color: #ff3547 !important;
}


.darkmode--activated table.table a {

    color: #e1e1e1 !important;
}

.darkmode--activated .url_top25 {
    color: #e1e1e1 !important;
}

.darkmode--activated .coingecko_url {

    color: #e1e1e1 !important;
}


.darkmode--activated .close {

    color      : #e1e1e1 !important;
    text-shadow: unset;
}

.darkmode--activated .modal-header {

    background  : #1E1E1E !important;
    color       : #e1e1e1 !important;
    border-color: #2c2c2c !important;

}

.darkmode--activated .modal-content {

    background  : #1E1E1E !important;
    color       : #e1e1e1 !important;
    border-color: #2c2c2c !important;

}

.darkmode--activated #news .border-bottom {

    border-color: #2c2c2c !important;
}

.darkmode--activated .contact_img {
    filter: brightness(0) invert(0.89);
}

.darkmode--activated .contact_div_cell a {
    color: #e1e1e1 !important;
}

.darkmode--activated .news_card:not(:last-child) {
    border-bottom: unset;
}

.darkmode--activated .card .card-body .card-text {
    color: #e1e1e1 !important;
}

.darkmode--activated .details_more_button {

    background: #383838 !important;
}

.darkmode--activated .border-white {

    border: unset !important;
}

.darkmode--activated .badge-secondary {

    background-color: #705097 !important;
}

.darkmode--activated .badge-primary {

    background-color: #3700B3 !important;
}

.darkmode--activated .datetime {

    color: #c1c1c1 !important;
}

.darkmode--activated .with-border {

    border-color: #2c2c2c !important;
}

.darkmode--activated .badge-dark {
    background: #585858 !important;
}

.darkmode--activated .day_div {
    background: #2c2c2c !important;
}

.darkmode--activated .news_card:not(:last-child) {
    border-bottom: 1px solid #2C2C2C;
}

.darkmode--activated .progress {
    /*background: #1E1E1E;*/
}

.darkmode--activated .progress-bar-kusama {
    background: #585858 !important;
    border    : #e1e1e1;

}


.darkmode--activated .btn-info {
    color           : rgba(255, 255, 255, 0.87) !important;
    background-color: #1a9bcb !important;
}

.darkmode--activated .btn-info:hover {

    background-color: #33b5e5 !important;
}



.darkmode--activated .btn-success {
    color           : rgba(255, 255, 255, 0.87) !important;
    border-color    : #1e7e34 !important;
    background-color: #28a745 !important;

}



.darkmode--activated .btn-success:hover {
    color           : rgba(255, 255, 255, 0.87) !important;
    background-color: #2dbc4e !important;
    border-color    : #1e7e34 !important;
}

.darkmode--activated .btn-mdb-color:hover {
    color           : rgba(255, 255, 255, 0.87) !important;
    background-color: #63759d !important;
}

.darkmode--activated .form-control {

    background  : #1E1E1E !important;
    color       : #e1e1e1 !important;
    border-color: #4c4c4c !important;

}

.darkmode--activated .md-tabs {
    box-shadow: unset;
    /* 0 5px 11px 0 rgb(255 255 255 / 18%), 0 4px 15px 0 rgb(255 255 255 / 15%);*/
}

.darkmode--activated .more_middle_column {

    background-color: #272727 !important;
}

.darkmode--activated .more_hover:hover {
    background-color: #2D2D2D !important;
}

.darkmode--activated #tabs_faq {
    background: transparent !important;
    ;
}

.darkmode--activated .text-kusama,
.darkmode--activated .classic-tabs .nav.text-kusama li a {

    color: #e1e1e1 !important;
}


.darkmode--activated .nav-link.bg-kusama:hover {

    background-color: #e1e1e1 !important;
}

.darkmode--activated .nav-link.bg-kusama.active {

    background-color  : #000;
    /*border          : 1px solid #1D1D1D !important;*/
    border            : 1px solid #2c2c2c !important;


}

.darkmode--activated .nav-link.bg-kusama.active:hover {

    background-color: #191919 !important;
}

.darkmode--activated .nav-link.bg-kusama {

    background-color: #c1c1c1 !important;
}




.darkmode--activated .div-networks-tabs ul,
.darkmode--activated .networks_tabs {

    background: var(--surface-page) !important;
}

.darkmode--activated .nav-link.bg-polkadot.active {

    background: #CE0065 !important;

}

.darkmode--activated .nav-link.bg-polkadot:hover {
    background-color: #e1e1e1 !important;
}

.darkmode--activated .nav-link.bg-polkadot.active:hover {
    background: #E6007A !important;
}

.darkmode--activated .nav-link.bg-polkadot {

    background-color: #c1c1c1 !important;

    color             : #CE0065 !important;
    /*color           : #D20066 !important;*/
}


.darkmode--activated .pagination .page-item .page-link {

    color: rgba(255, 255, 255, 0.77) !important;
}

.darkmode--activated .nav-link.bg-kusama.active {

    color: #e1e1e1 !important;

}

.darkmode--activated .nav-link.bg-polkadot.active {

    color           : #e1e1e1 !important;
    background-color: #CE0065 !important;
}

.darkmode--activated .comment_text_after_table {

    color: rgba(255, 255, 255, 0.67) !important;
}

.darkmode--activated .pc_cards {


    background: var(--surface-page) !important;
    color     : #e1e1e1 !important;
}

.darkmode--activated .md-accordion .card .card-body {

    color: rgba(255, 255, 255, 0.77) !important;
}

.darkmode--activated #tabs_networks,
.darkmode--activated .auctions_list_area .tab-pane {
    background: var(--surface-page) !important;
}

.darkmode--activated .crowdloans_rewards_rating {

    margin-top   : 0rem !important;
    margin-bottom: 1rem !important;

}

.darkmode--activated #tab-faq-questions {
    border-radius: var(--radius-sm);
}


.darkmode--activated .md-accordion .card {

    border-color: #2c2c2c !important;
}

.darkmode--activated .parachain_url,
.darkmode--activated .url_parachain {
    color: rgba(255, 255, 255, 0.87) !important;

}

.darkmode--activated .pc_card {

    background  : #1E1E1E !important;
    color       : #e1e1e1 !important;
    border-color: #2c2c2c !important;
}



.darkmode--activated .dropdown-item {
    background: #242424 !important;
    color     : #e1e1e1 !important;
}

.darkmode--activated .bootstrap-select {

    background      : #1E1E1E !important;
    /*    border    : #2c2c2c !important;*/

}

input[type="search"] {
    border-bottom: 1px solid gray;
    padding      : .2em .4em;
    border-radius: .2em;
}

/*.darkmode--activated input[type="search"] {
    background: #222 !important;
    color     : #fff !important;
}*/

input[type="search"] {
    background: #fff;
    color     : #222;
}

input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    height            : 1em;
    width             : 1em;
    border-radius     : 50em;
    background        : url(fontawesome/svgs/solid/times-circle.svg) no-repeat 50% 50%;
    background-size   : contain;
    opacity           : 0;
    pointer-events    : none;
}

input[type="search"]:focus::-webkit-search-cancel-button {
    opacity       : .3;
    pointer-events: all;
}

.darkmode--activated input[type="search"]::-webkit-search-cancel-button {
    filter: invert(1);
}

.darkmode--activated #search-box {

    background: #1E1E1E !important;
    color     : #e1e1e1 !important;
    border    : #2c2c2c !important;

}

.darkmode--activated ::-webkit-scrollbar {
    width: 10px;
}

.darkmode--activated ::-webkit-scrollbar-track {
    background   : rgb(149, 147, 147);
    border-radius: 10px;
}

.darkmode--activated ::-webkit-scrollbar-thumb {
    background   : rgb(88, 88, 88);
    border-radius: 10px;
}

.darkmode--activated ::-webkit-scrollbar-thumb:hover {
    background   : rgb(68, 68, 68);
    border-radius: 10px;
}

.darkmode--activated ::-webkit-scrollbar-thumb:active {
    background   : rgb(48, 48, 48);
    border-radius: 10px;
}

.darkmode--activated,
.darkmode--activated html,
.darkmode--activated body,
.darkmode--activated main {

    background: var(--surface-page) !important;
    color     : rgba(255, 255, 255, 0.87) !important;
}

/** remove blending from body wrapper */
.darkmode--activated .body_wrapper {
    isolation : isolate;
    background: var(--surface-page) !important;
}

.darkmode--activated .bg-polkadot {
    /*background-color: #d20066 !important;*/
    background-color: #CE0065 !important;


}



.darkmode--activated .alt-font {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .card,
.darkmode--activated .home_info_center {
    background  : #1e1e1e !important;
    /*color     : #e1e1e1 !important;*/
    color       : rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .dropdown-menu {
    background  : #242424 !important;
    color       : rgba(255, 255, 255, 0.87) !important;
    border-color: #2c2c2c !important;
}

.darkmode--activated .auctions_history_search {

    background: #242424 !important;


}


/* Was .25rem. No !important here, but two classes beat the single class of the
   `.card, .home_info_center` rule in the radius scale block, so the coretime
   cards stayed at 4px in dark mode while every other card was 12px. */
.darkmode--activated .home_info_center {
    border-radius: var(--radius-md);
}

/** card border-light color  **/
.darkmode--activated .border-light {

    border-color: #2c2c2c !important;
}

/** main menu bar **/
.darkmode--activated header,
.darkmode--activated .navbar,
.darkmode--activated .navbar-light .navbar-brand,
.darkmode--activated .navbar.navbar-light .breadcrumb .nav-item .nav-link,
.darkmode--activated .navbar.navbar-light .navbar-nav .nav-item .nav-link,
.darkmode--activated .navbar .dropdown-menu a.dropdown-item {

    background: #1f1f1f !important;
    color     : rgba(255, 255, 255, 0.87) !important;
}


/*.darkmode--activated .navbar .dropdown-menu a:not(.active)*/
/* dropdown active menu item */

.darkmode--activated .dropdown .dropdown-menu .dropdown-item:hover,
.darkmode--activated .dropdown .dropdown-menu .dropdown-item:active,
.darkmode--activated .dropup .dropdown-menu .dropdown-item:hover,
.darkmode--activated .dropup .dropdown-menu .dropdown-item:active,
.darkmode--activated .dropleft .dropdown-menu .dropdown-item:hover,
.darkmode--activated .dropleft .dropdown-menu .dropdown-item:active,
.darkmode--activated .dropright .dropdown-menu .dropdown-item:hover,
.darkmode--activated .dropright .dropdown-menu .dropdown-item:active {


    background: #353535 !important;
    color     : #e1e1e1 !important;
}

/*** search area ***********/
.darkmode--activated .typeahead__field .typeahead__hint,
.darkmode--activated .typeahead__field [contenteditable],
.darkmode--activated .typeahead__field input,
.darkmode--activated .typeahead__field textarea {

    background: #1E1E1E !important;
    color     : #e1e1e1 !important;
    border    : #2c2c2c !important;
}

.darkmode--activated .typeahead__dropdown,
.darkmode--activated .typeahead__list,
.darkmode--activated .typeahead__dropdown .typeahead__dropdown-item>a,
.darkmode--activated .typeahead__list .typeahead__item>a {

    background  : #1E1E1E !important;
    color       : #e1e1e1 !important;
    border-color: #2c2c2c !important;
}

.darkmode--activated ::-webkit-input-placeholder {

    color  : #e1e1e1 !important;
    opacity: 0.8;
}

.darkmode--activated .typeahead__field {
    color: #e1e1e1 !important;
}

.darkmode--activated .typeahead__list li {

    border-color: #2c2c2c !important;
}

/* hover, active */

.darkmode--activated .typeahead__dropdown .typeahead__dropdown-item:not([disabled]).active>a,
.darkmode--activated .typeahead__dropdown .typeahead__dropdown-item:not([disabled])>a:focus,
.darkmode--activated.typeahead__dropdown .typeahead__dropdown-item:not([disabled])>a:hover,
.darkmode--activated .typeahead__list .ty peahead__item:not([disabled]).active>a,
.darkmode--activated .typeahead__list .typeahead__item:not([disabled])>a:focus,
.darkmode--activated .typeahead__list .typeahead__item:not([disabled])>a:hover {

    /*background: #E3E4E6 !important;
    color     : #111 !important;*/

    background: #353535 !important;
    color     : #e1e1e1 !important;
}


.darkmode--activated .typeahead__field .typeahead__hint,
.darkmode--activated .typeahead__field [contenteditable],
.darkmode--activated .typeahead__field input,
.darkmode--activated .typeahead__field textarea {
    border-color: #2c2c2c !important;
}

.darkmode--activated .typeahead__list>.typeahead__group.active>a,
.darkmode--activated .typeahead__list>.typeahead__group>a,
.darkmode--activated .typeahead__list>.typeahead__group>a:focus,
.darkmode--activated .typeahead__list>.typeahead__group>a:hover {

    background: #484848 !important;
    color     : #e1e1e1 !important;

}

.darkmode--activated .typeahead__list.empty>li {
    color: #e1e1e1 !important;
}

.darkmode--activated .typeahead__search-icon {

    background: url(data:image/svg+xml;charset=utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTguMS4xLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDI1MC4zMTMgMjUwLjMxMyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjUwLjMxMyAyNTAuMzEzOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCI+CjxnIGlkPSJTZWFyY2giPgoJPHBhdGggc3R5bGU9ImZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkOyIgZD0iTTI0NC4xODYsMjE0LjYwNGwtNTQuMzc5LTU0LjM3OGMtMC4yODktMC4yODktMC42MjgtMC40OTEtMC45My0wLjc2ICAgYzEwLjctMTYuMjMxLDE2Ljk0NS0zNS42NiwxNi45NDUtNTYuNTU0QzIwNS44MjIsNDYuMDc1LDE1OS43NDcsMCwxMDIuOTExLDBTMCw0Ni4wNzUsMCwxMDIuOTExICAgYzAsNTYuODM1LDQ2LjA3NCwxMDIuOTExLDEwMi45MSwxMDIuOTExYzIwLjg5NSwwLDQwLjMyMy02LjI0NSw1Ni41NTQtMTYuOTQ1YzAuMjY5LDAuMzAxLDAuNDcsMC42NCwwLjc1OSwwLjkyOWw1NC4zOCw1NC4zOCAgIGM4LjE2OSw4LjE2OCwyMS40MTMsOC4xNjgsMjkuNTgzLDBDMjUyLjM1NCwyMzYuMDE3LDI1Mi4zNTQsMjIyLjc3MywyNDQuMTg2LDIxNC42MDR6IE0xMDIuOTExLDE3MC4xNDYgICBjLTM3LjEzNCwwLTY3LjIzNi0zMC4xMDItNjcuMjM2LTY3LjIzNWMwLTM3LjEzNCwzMC4xMDMtNjcuMjM2LDY3LjIzNi02Ny4yMzZjMzcuMTMyLDAsNjcuMjM1LDMwLjEwMyw2Ny4yMzUsNjcuMjM2ICAgQzE3MC4xNDYsMTQwLjA0NCwxNDAuMDQzLDE3MC4xNDYsMTAyLjkxMSwxNzAuMTQ2eiIgZmlsbD0iI2UxZTFlMSIvPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=) no-repeat scroll center center
}

.darkmode--activated .typeahead__container button {
    background  : #1E1E1E !important;
    color       : #e1e1e1 !important;
    border-color: #2c2c2c;
}

.darkmode--activated .search_area {
    color: #e1e1e1 !important;
}



/** news section **/

.darkmode--activated .news_image {
    background: rgba(255, 255, 255, 0.87) !important;

}

.darkmode--activated .url_black {

    color: rgba(255, 255, 255, 0.77) !important;
}

.darkmode--activated .heading_image_kusama {

    filter: invert(91%);
}

.darkmode--activated .polkadot-dark-logo {

    filter: brightness(0) invert(1);
}

.darkmode--activated .utc_badge {

    background: unset !important;

}

.darkmode--activated .home_news_date {

    color: rgba(255, 255, 255, 0.87) !important;
}

/********** main table ****************/
.darkmode--activated .global_filter {

    background-color: #1E1E1E;
    color           : rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .table_sections_navigation label {

    background-color: #272727 !important;
    color           : rgba(255, 255, 255, 0.67) !important;
}

.darkmode--activated .table_sections_navigation .btn.active {

    background-color: #484848 !important;
}

.darkmode--activated .table_sections_navigation .btn.active {
    color: rgba(255, 255, 255, 0.87) !important;
}


.darkmode--activated .md-pills .nav-link {

    color: rgba(255, 255, 255, 0.67) !important;
}

.darkmode--activated .md-pills .nav-link.active {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .btn:hover {
    color: rgba(255, 255, 255, 0.87) !important;
}


.darkmode--activated .table {
    color             : rgba(255, 255, 255, 0.87) !important;
    background-color  : #1E1E1E !important;
    /*border-radius   : .25rem !important;*/



}

.darkmode--activated .dataTables_scrollHeadInner .table {

    border-top-left-radius        : var(--radius-md) !important;

    border-top-right-radius        : var(--radius-md) !important;
}


.darkmode--activated #investors_table th:first-child {

    border-top-left-radius        : var(--radius-md) !important;

    border-bottom-left-radius        : var(--radius-md) !important;

}

.darkmode--activated #investors_table th:last-child {

    border-top-right-radius        : var(--radius-md) !important;

    border-bottom-right-radius        : var(--radius-md) !important;

}

.darkmode--activated .dataTables_scrollBody .table,
.darkmode--activated .main_table {

    border-bottom-left-radius        : var(--radius-md) !important;

    border-bottom-right-radius        : var(--radius-md) !important;
}

.darkmode--activated .table thead th {

    background-color: #2C2C2C !important;
}

/* The filter bar sits flush on top of the projects table: same width, zero
   gap. They are one panel, so only the top corners round and the bottom ones
   stay square, otherwise a rounded corner cuts across a continuous surface.
   The matching bottom corners live on .main_table. */
.darkmode--activated .global_filter {
    border-radius: var(--radius-md) var(--radius-md) 0 0 !important;
}

.darkmode--activated table.fixedHeader-floating {
    background-color: #1E1E1E !important;
}

.darkmode--activated .main_table_info_box {

    color: rgba(255, 255, 255, 0.77) !important;
}

.darkmode--activated .page-footer {

    background-color: #1F1F1F !important;
}

.darkmode--activated footer.page-footer a,
.darkmode--activated footer .white-text {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .footer_img {

    filter: brightness(0) invert(0.89);
}


.nav-link.bg-polkadot,
.nav-link.bg-kusama {
    border-radius: var(--radius-sm) !important;
}

.darkmode--activated #investors_table th {

    border-color      : #1E1E1E !important;
    /*border-color    : #151515 !important;*/
    /*border-radius   : .25rem !important;*/

}

.darkmode--activated .main_table,
.darkmode--activated .table td,
.darkmode--activated .table th,
.darkmode--activated .table thead th {

    border-color      : #2c2c2c !important;
    /*border-color    : #151515 !important;*/
    /*border-radius   : .25rem !important;*/

}



.darkmode--activated .dataTables_scrollHeadInner thead th:first-child {

    border-top-left-radius        : var(--radius-md) !important;

}

.darkmode--activated .dataTables_scrollHeadInner thead th:last-child {

    border-top-right-radius        : var(--radius-md) !important;


}



.darkmode--activated .w3f_badge_mt {

    border-color: rgba(255, 255, 255, 0.57) !important;
}


.darkmode--activated .label_w3f {
    background-color: #1E1E1E;
    color           : rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .badge {
    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .badge.badge-warning {
    color: rgba(0, 0, 0, 0.87) !important;
}

.darkmode--activated .main-timeline.polkadot .active .timeline-icon:before,
.darkmode--activated .main-timeline.kusama .active .timeline-icon:before,
.darkmode--activated .main-timeline .timeline-icon:before {

    border-color: #1E1E1E !important;
}

.darkmode--activated .main-timeline .timeline:first-of-type .timeline-icon:after,
.darkmode--activated .main-timeline .timeline:last-of-type .timeline-icon:after {

    border-color: #1E1E1E !important;
}

.darkmode--activated .main-timeline.polkadot .active .timeline-icon,
.darkmode--activated .main-timeline.kusama .active .timeline-icon {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .in_auciton_table,
.darkmode--activated .ready_auction_last,
.darkmode--activated .ready_auction_home_mobile,
.darkmode--activated .status_img_table {

    filter: invert(91%);
}


.darkmode--activated .z-depth-1 {

    box-shadow: unset !important;
    background: rgba(255, 255, 255, 0.95) !important;

}

.darkmode--activated .filters_box.border-right {

    border-color      : #1E1E1E !important;
    border-right-width: 0px !important;
}

.darkmode--activated .filters_box {
    background    : #1E1E1E;
    padding-left  : 8px;
    padding-right : 8px;
    padding-top   : 8px;
    padding-bottom: 8px;
    border-radius : var(--radius-md) !important;
}

.darkmode--activated .parachains_tags {
    background: #1E1E1E !important;
}


.darkmode--activated .category_filter input {

    border-color: #383838 !important;
    color       : rgba(255, 255, 255, 0.57) !important;
}

.darkmode--activated .filters_box div:first-child {
    background: #1E1E1E;

}


.darkmode--activated .point-color-4 {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .point-color-3 {

    color: rgba(255, 255, 255, 0.77) !important;
}

.darkmode--activated .point-color-2 {

    color: rgba(255, 255, 255, 0.67) !important;
}

.darkmode--activated .point-color-1 {

    color: rgba(255, 255, 255, 0.57) !important;
}

.darkmode--activated .point-color-0 {

    color: rgba(255, 255, 255, 0.47) !important;
}

.darkmode--activated table.table a.point-color-4 {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated table.table a.point-color-3 {

    color: rgba(255, 255, 255, 0.77) !important;
}

.darkmode--activated table.table a.point-color-2 {

    color: rgba(255, 255, 255, 0.67) !important;
}

.darkmode--activated table.table a.point-color-1 {

    color: rgba(255, 255, 255, 0.57) !important;
}

.darkmode--activated table.table a.point-color-0 {

    color: rgba(255, 255, 255, 0.47) !important;
}


.darkmode--activated .form-check-label span {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .label_status_development {

    background: linear-gradient(to right, #a5a5a5, #1E1E1E 30%);

}

.darkmode--activated .label_status_testnet {

    background: linear-gradient(to right, #a5a5a5, #1E1E1E 40%);
}

.darkmode--activated .label_status_rococo,
.darkmode--activated .label_status_rococo:after {
    background: linear-gradient(to right, #a5a5a5, #1E1E1E 40%);
}

.darkmode--activated .label_status_parathread,
.darkmode--activated .label_status_parathread:after {
    background: linear-gradient(to right, #a5a5a5, #1E1E1E 60%);
}

.darkmode--activated .label_status_auction,
.darkmode--activated .label_status_auction:after {
    background: linear-gradient(to right, #a5a5a5, #1E1E1E 80%);
}

.darkmode--activated .label_status_parachain,
.darkmode--activated .label_status_parachain:after {
    background: linear-gradient(to right, #a5a5a5, #1E1E1E 200%);
}

.darkmode--activated #btn_clear_filters {
    background-color: #383838 !important;

}

.darkmode--activated .filters_desc {

    color: rgba(255, 255, 255, 0.57) !important;
}

.darkmode--activated .badge-light {
    background-color: #383838 !important;
}

.darkmode--activated .tagify__dropdown,
.darkmode--activated .tagify__dropdown__wrapper {
    background-color: #1f1f1f !important;
    color           : rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .embed_content_desktop {

    border-color: #383838;
}

.darkmode--activated .tagify__dropdown__wrapper {
    border-color: #383838 !important;
}

.darkmode--activated .tagify__dropdown__item--active {

    background: #353535 !important;
}


.darkmode--activated .tagify {
    --tag-inset-shadow-size    : 2rem !important;
    /*--tags-focus-border-color: #CED4DA !important;*/
    --tags-hover-border-color  : #383838 !important;
    --tags-border-color        : #383838 !important;
    --tags-focus-border-color  : #383838 !important;
    --tagify-dd-color-primary  : #383838 !important;
    --tag-bg                   : #383838 !important;
    --tag-hover                : #484848 !important;
    --tag-remove-btn-color     : rgba(255, 255, 255, 0.67) !important;
    --tag-text-color           : rgba(255, 255, 255, 0.87) !important;
    --placeholder-color        : rgba(255, 255, 255, 0.57) !important;

    /* was 4px */
    border-radius: var(--radius-sm);
}

.darkmode--activated #select-options-filter_category,
.darkmode--activated .dropdown-content.select-dropdown,
.darkmode--activated .dropdown-content input {
    background-color: #1f1f1f !important;
    color           : rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .dropdown-content li>a,
.darkmode--activated .dropdown-content li>span,
.darkmode--activated .select-wrapper.md-form>ul li label {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .btn-primary {
    background-color: #3700B3 !important;
}

.darkmode--activated .dropdown-content li:hover,
.darkmode--activated .dropdown-content li.active {
    background-color: #383838;
}

.darkmode--activated .info_con_tr {
    color: rgba(255, 255, 255, 0.70) !important;
}

.darkmode--activated .popover-header {
    background  : #242424 !important;
    color       : rgba(255, 255, 255, 0.87) !important;
    border-color: #2c2c2c !important;
}

/*

.darkmode--activated .bs-popover-bottom>.arrow::after,
.darkmode--activated .bs-popover-auto[x-placement^="bottom"]>.arrow::after,
.darkmode--activated .bs-popover-bottom>.arrow::before,
.darkmode--activated .bs-popover-auto[x-placement^="bottom"]>.arrow::before,


.darkmode--activated .bs-popover-auto[x-placement^=top]>.arrow::before,
.darkmode--activated .bs-popover-top>.arrow::before,
.darkmode--activated .bs-popover-auto[x-placement^=top]>.arrow::after,
.darkmode--activated .bs-popover-top>.arrow::after,


.darkmode--activated .bs-popover-auto[x-placement^=left]>.arrow::before,
.darkmode--activated .bs-popover-left>.arrow::before,
.darkmode--activated .bs-popover-auto[x-placement^=left]>.arrow::after,
.darkmode--activated .bs-popover-left>.arrow::after,

.darkmode--activated .bs-popover-auto[x-placement^=right]>.arrow::before,
.darkmode--activated .bs-popover-right>.arrow::before,
.darkmode--activated .bs-popover-auto[x-placement^=right]>.arrow::after,
.darkmode--activated .bs-popover-right>.arrow::after,
*/
.darkmode--activated .bs-popover-top,
.darkmode--activated .bs-popover-bottom,
.darkmode--activated .bs-popover-left,
.darkmode--activated .bs-popover-right {

    background      : #222222 !important;
    color           : rgba(255, 255, 255, 0.87) !important;
    border-color    : #2c2c2c !important;
    /*border-color  : transparent !important;*/
}

.darkmode--activated .popover .arrow::before {

    border-bottom-color: #5c5c5c !important;
    border-top-color   : #5c5c5c !important;
}

.darkmode--activated .popover .arrow::after {

    border-bottom-color: #2e2e2e !important;
    border-top-color   : #2e2e2e !important;
}



.darkmode--activated .popover,
.darkmode--activated .popover-body {

    background  : #2e2e2e !important;
    color       : rgba(255, 255, 255, 0.81) !important;
    border-color: #5c5c5c !important;
}


.darkmode--activated .navbar.navbar-light .navbar-toggler {

    color: rgba(255, 255, 255, 0.87) !important;
}

.darkmode--activated .navbar-light .navbar-toggler-icon {

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.87)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.darkmode--activated .text_lightgray {
    color: rgba(255, 255, 255, 0.67) !important;
}

.darkmode--activated .no-border-dark {
    border: 0 !important;
}

@media (max-width: 900px) {
    .darkmode--activated .events_card_home {

        margin-top: 1rem;
    }

    .darkmode--activated #projects {
        border-top: unset !important;
    }



}

/**************************************************************************************************************/
/**************************************************************************************************************/
/**************************************************************************************************************/

.dtswitch {
    position: relative;
    display : inline-block;
    width   : 20px;
    height  : 20px;
}

/* Hide default HTML checkbox */
.dtswitch input {
    opacity: 0;
    width  : 0;
    height : 0;
}

/* The slider */
.slider {
    position        : absolute;
    cursor          : pointer;
    top             : 0;
    left            : 0;
    right           : 0;
    bottom          : 0;
    background-color: #ccc -webkit-transition: 0.4s;
    transition      : 0.4s;
}

.slider:before {
    position: absolute;

    font-family            : "Font Awesome 6 Pro";
    font-weight            : 900;
    content                : "\f185";
    height                 : 28px;
    width                  : 28px;
    left                   : 0px;
    bottom                 : 4px;
    top                    : 0;
    bottom                 : 0;
    margin                 : auto 0;
    -webkit-transition     : 0.4s;
    transition             : 0.4s;
    /*box-shadow           : 0 0px 15px #2020203d;*/
    /*background           : #ccc url('/images/moon.png');
    background-repeat      : no-repeat;
    background-position    : center;*/

}

/*
input:checked+.slider {
    background-color: #F4B13C;
}

input:focus+.slider {
    box-shadow: 0 0 1px #F4B13C;
}*/

input:checked+.slider:before {
    font-family          : "Font Awesome 6 Pro";
    font-weight          : 900;
    content              : "\f186";
    /*-webkit-transform  : translateX(24px);
    -ms-transform        : translateX(24px);
    transform            : translateX(24px);*/
    /*background         : white url('/images/sunny.png');
    background-repeat    : no-repeat;
    background-position  : center;*/
}

/* Rounded sliders */
.slider.round {
    border-radius: 28px;
}

.slider.round:before {
    border-radius: 50%;
}


.md-accordion .faq-header {
    padding-bottom: 0rem !important;
    padding-top   : 0rem !important;
    padding-left  : 1rem;
    padding-right : 1rem;
    background    : transparent;
    border-bottom : 0;
}

.md-accordion .faq-header .h5 {
    font-size  : 1.1rem !important;
    font-weight: 500 !important;
    text-align : left;

}

/* Was 0.25rem !important with -moz- and -webkit- prefixes. The !important is
   what beat the radius scale further down this file, and the prefixed
   properties have been dead in every browser for years. */
.js-typeahead-global_search {

    border-top-left-radius   : var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
}


/* Was 0.25rem !important, the twin of the .js-typeahead-global_search rule
   above. Both were beating the radius scale defined at the end of this file. */
.typeahead__button button {

    border-top-right-radius   : var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
}

.md_crowdloan_column_logo {

    width     : 50px;
    height    : 50px;
    object-fit: contain;
    padding   : 2px;
}

.badge_top_investor {
    top             : -.7em;
    position        : relative;
    font-size       : 60%;
    line-height     : 0;
    border          : 0px solid rgba(0, 0, 0, 0.7);
    background-color: #F5F5F5 !important;
    vertical-align  : baseline;
    padding-left    : 3px;
    padding-right   : 3px;
    padding-top     : 1px;
    padding-bottom  : 1px;
    font-weight     : bold;
}

.badge_top_investor_big {

    padding-left  : 8px;
    padding-right : 8px;
    padding-top   : 3px;
    padding-bottom: 3px;
}

.project-logo {

    border-radius: 50%;
}

.main_table_investors_count {
    font-weight: 400;
    display    : inline-block;
    width      : 2rem;
    height     : 2rem;
    color      : #212529;
    line-height: 2rem;
    background : #E2E2E2;
}


.md-form input:not([type]):focus:not([readonly]),
.md-form input[type="text"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="password"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="email"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="url"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="time"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="date"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="datetime"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="datetime-local"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="tel"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="number"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="search"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="phone"]:not(.browser-default):focus:not([readonly]),
.md-form input[type="search-md"]:focus:not([readonly]),
.md-form textarea.md-textarea:focus:not([readonly]) {
    border-bottom     : 1px solid #212529 !important;
    -webkit-box-shadow: unset !important;
    box-shadow        : unset !important;

}



.darkmode--activated .md-form input:not([type]):focus:not([readonly]),
.darkmode--activated .md-form input[type="text"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="password"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="email"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="url"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="time"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="date"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="datetime"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="datetime-local"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="tel"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="number"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="search"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="phone"]:not(.browser-default):focus:not([readonly]),
.darkmode--activated .md-form input[type="search-md"]:focus:not([readonly]),
.darkmode--activated .md-form textarea.md-textarea:focus:not([readonly]) {

    border-bottom     : 1px solid #c5c5c5 !important;
    -webkit-box-shadow: unset !important;
    box-shadow        : unset !important;

}


.auction_table td {

    /*padding-left: 0.6rem !important;
    padding-right: 0.6rem !important;*/
    padding-bottom: 1rem !important;
    padding-top   : 1.1rem !important;

}

.part_in_crowdloan {
    bottom     : 0px;
    font-size  : 0.8rem !important;
    left       : 50%;
    font-weight: 500;
    transform  : translateX(-50%)
}

.auction_table .part_in_crowdloan {

    bottom: 2px !important;
}

.dataTables_empty {
    padding-left: 1rem !important;
}

.darkmode--activated .bg-kusama-tab {
    background-color: #2C2C2C !important;
}

.darkmode--activated .ref_code_popup {

    background-color: #2C2C2C !important;

}

.darkmode--activated .ref_code_box {

    background-color: #383838 !important;
}

.ref_code_box {
    cursor: pointer;
}

.darkmode--activated .text-primary {
    color: #BB86FC !important;
}

.form-control:focus {
    box-shadow  : none;
    border-color: unset;
}

.crowdloan_id {

    font-size: 0.7rem;
}

.typeahead__container button {

    min-height: calc(.5rem * 2 + 1.25rem + 2px) !important;

}



.faq_img {
    border-radius: var(--radius-md);
    width        : 50%;
}

@media (max-width: 900px) {
    .faq_img {
        width     : 90%;
        
    }
  
}

@media screen and (max-width:575px) {
    .search_area {
        border-radius: 0 0 var(--radius-lg) var(--radius-lg);
    }

    footer.page-footer {
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    }
}


/* ==========================================================================
   Surfaces and corner radius scale
   --------------------------------------------------------------------------
   Loaded last, after mdb.min.css and styles_common.css, so these win without
   needing !important except where an existing rule already uses it.

   Two problems this section fixes:

   1. mdb.min.css sets `.card { border-radius: 0 }`, so every card on the site
      had square corners while nested `.rounded` elements had 4px and the
      search band had 32px. There was no radius scale at all, 14 different
      values were in use.

   2. In dark mode the card colour (#1e1e1e) sat 1.12:1 against the page
      (#121212) and 1.01:1 against the navbar (#1f1f1f), and
      `.no-border-dark` stripped the borders, so nothing delineated a card.
      Below, the page goes darker, the card lighter, and a visible hairline
      comes back.
   ========================================================================== */

:root {
    /* radius scale, use these instead of literal values from now on */
    --radius-sm  : 8px;    /* inputs, badges, small nested boxes */
    --radius-md  : 12px;   /* cards, panels, controls */
    --radius-lg  : 16px;   /* page level chrome: search band, footer */
    --radius-xl  : 24px;   /* large feature panels: coretime hero, sections */
    --radius-pill: 999px;

    /* light theme surfaces */
    --surface-page       : #ffffff;
    --surface-card       : #ffffff;
    --surface-raised     : #f7f7f8;
    --surface-line       : rgba(0, 0, 0, 0.12);
    --surface-line-strong: rgba(0, 0, 0, 0.24);

    /* Softer line for dense internal dividers such as table rows. Using the
       container hairline there would turn a long table into a grid. */
    --surface-line-soft  : rgba(0, 0, 0, 0.07);
}

.darkmode--activated {
    /* dark theme surfaces: page darker, card lighter, hairline visible */
    --surface-page       : #0e0e10;
    --surface-card       : #1c1c20;
    --surface-raised     : #232328;
    --surface-line       : #3a3a40;
    --surface-line-strong: #53535a;
    --surface-line-soft  : #2a2a2e;
}


/* --- radius ------------------------------------------------------------- */

.card,
.home_info_center {
    border-radius: var(--radius-md);
}

/* mdb gives .card a bottom border only (border-bottom: 1px solid #e0e0e0),
   which looks wrong once the corners are rounded. Drop it.

   Deliberately NOT adding a full border to every .card: in this codebase .card
   is also used as a plain layout wrapper (`tab-content card` on the auctions
   page, for example), and a hairline there draws a frame around a whole tab
   panel. The hairline is applied per card family further down instead. */
.card {
    border-bottom: 0;
}

.card > .card-body:first-child,
.card > .card-content:first-child,
.card > .view:first-child img {
    border-top-left-radius : inherit;
    border-top-right-radius: inherit;
}

.card > .card-body:last-child,
.card > .card-content:last-child {
    border-bottom-left-radius : inherit;
    border-bottom-right-radius: inherit;
}

.card-header:first-child {
    border-top-left-radius : var(--radius-md);
    border-top-right-radius: var(--radius-md);
}

/* controls inside cards stay one step tighter than the card itself.
   Deliberately not targeting `.rounded`, that utility is also used on avatars
   and thumbnails where a different radius would be wrong. */
.card .form-control,
.card .btn:not(.btn-floating):not(.btn-rounded) {
    border-radius: var(--radius-sm);
}

/* page level chrome: 32px was almost three times the card radius */
.search_area {
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

footer.page-footer {
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}


/* --- dark mode surfaces ------------------------------------------------- */

.darkmode--activated,
.darkmode--activated html,
.darkmode--activated body,
.darkmode--activated main,
.darkmode--activated .body_wrapper {
    background: var(--surface-page) !important;
}

.darkmode--activated .card,
.darkmode--activated .home_info_center {
    background: var(--surface-card) !important;
}

/* The hairline goes on the homepage cards only, where it is the thing that
   separates the box from the page. Applying it to every .card framed layout
   wrappers elsewhere on the site. */
.home_news_content > .card,
.home_events_content > .card,
.darkmode--activated .home_news_content > .card,
.darkmode--activated .home_events_content > .card {
    border: 1px solid var(--surface-line);
}

/* the navbar drops back to the page colour so the cards are the only
   raised surface, previously navbar and card were the same #1f1f1f */
.darkmode--activated header,
.darkmode--activated .navbar,
.darkmode--activated .navbar-light .navbar-brand,
.darkmode--activated .navbar.navbar-light .breadcrumb .nav-item .nav-link,
.darkmode--activated .navbar.navbar-light .navbar-nav .nav-item .nav-link {
    background: var(--surface-page) !important;
}

.darkmode--activated .navbar {
    border-bottom: 1px solid var(--surface-line);
}

.darkmode--activated .navbar .dropdown-menu,
.darkmode--activated .navbar .dropdown-menu a.dropdown-item {
    background: var(--surface-raised) !important;
}

.darkmode--activated .dropdown-menu {
    border-radius: var(--radius-md);
    border       : 1px solid var(--surface-line);
}

.darkmode--activated .card-header {
    background-color: var(--surface-raised) !important;
    border-bottom   : 1px solid var(--surface-line);
}

/* This used to be `border: 0 !important`, which removed the only thing
   separating the homepage boxes from the background. Keep the hairline. */
.darkmode--activated .no-border-dark {
    border: 1px solid var(--surface-line) !important;
}

.darkmode--activated .news_card:not(:last-child) {
    border-bottom: 1px solid var(--surface-line);
}


/* ==========================================================================
   Homepage heading block
   ========================================================================== */

/* --- total projects ----------------------------------------------------- */

/* The count is the only reason this box exists, so it carries the weight.
   It used to be an h2 next to an h4 label, which read as equal siblings. */
.home_total_card,
.home_total_card:hover,
.home_total_card:focus {
    display        : block;
    text-decoration: none;
}

/* the whole box is a link to #projects, give it an affordance */
.home_total_card:hover {
    border-color: var(--surface-line-strong);
}

.home_total_label {
    font-size: 1rem;
    font-weight: 400;
}

.home_total_value {
    font-size  : 2.75rem;
    line-height: 1;
    font-weight: 500;
}


/* --- coretime cards ----------------------------------------------------- */

.home_coretime_network {
    font-size  : 0.9rem;
    line-height: 1.2;
    font-weight: 500;
}

/* Secondary line, so it must not compete with the network name above, but it
   still needs the same typeface. `body, html *` sets the system font stack and
   Kanit only arrives via .alt-font, which also forces a colour with
   !important, so the family is set directly here instead.
   A colour rather than opacity: opacity on text drifts per surface. */
.home_coretime_label {
    font-family: 'Kanit', sans-serif;
    font-size  : 0.8rem;
    line-height: 1.2;
    font-weight: 400;
    color      : #6c757d;
}

.darkmode--activated .home_coretime_label {
    color: #b0b0b2;
}


/* --- "more news" / "more events" ---------------------------------------- */

/* These were 0.9rem text links with a ~20px hit area, well under the 44px
   minimum touch target. Now a quiet button with real padding. */
.more_link {
    display        : inline-flex;
    align-items    : center;
    gap            : 0.45rem;
    min-height     : 44px;
    padding        : 0 1rem;
    border         : 1px solid var(--surface-line);
    border-radius  : var(--radius-sm);
    text-decoration: none;
}

.more_link:hover,
.more_link:focus {
    border-color   : var(--surface-line-strong);
    text-decoration: none;
}

.more_link .fas {
    font-size: 0.75em;
}


/* --- top promo banner --------------------------------------------------- */

.banner_icon {
    margin-right: 0.5rem;
}

.banner_arrow {
    margin-left: 0.5rem;
    font-size  : 0.75em;
}


/* ==========================================================================
   Global search field
   ========================================================================== */

/* Width used to be inline on the wrapper div as max-width:350px;width:350px,
   so the field stayed narrow while the pink band stretched. */
.global_search_wrap {
    width    : 100%;
    max-width: 560px;
}

/* jquery.typeahead ships `border-radius: 2px 0 0 2px` on the input and 2px on
   the button, which is not on the radius scale.

   --radius-md rather than --radius-sm: the field renders ~65px tall, and an 8px
   corner on a box that size reads as square. */
.typeahead__field input,
.typeahead__field textarea {
    border-top-left-radius    : var(--radius-md);
    border-bottom-left-radius : var(--radius-md);
    border-top-right-radius   : 0;
    border-bottom-right-radius: 0;
}

.typeahead__button button {
    border-top-right-radius   : var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
    border-top-left-radius    : 0;
    border-bottom-left-radius : 0;
}

/* The previous dark mode rule was `border: #2c2c2c !important`, a shorthand
   with no style or width, which resets border-style to none. The field and its
   button had no edge at all and no line between them. */
.darkmode--activated .typeahead__field .typeahead__hint,
.darkmode--activated .typeahead__field [contenteditable],
.darkmode--activated .typeahead__field input,
.darkmode--activated .typeahead__field textarea,
.darkmode--activated .typeahead__container button {
    background: var(--surface-card) !important;
    color     : #ededed !important;
    border    : 1px solid var(--surface-line) !important;
}

.darkmode--activated .typeahead__container button:hover {
    background: var(--surface-raised) !important;
}

/* Focus has to read against the dark field and against the pink band behind
   it, so the ring is light rather than brand coloured: #e6e6e6 is 13.6:1 on
   the field and 4.4:1 on the band. */
.darkmode--activated .typeahead__field input:focus,
.darkmode--activated .typeahead__field input:active {
    border-color: #e6e6e6 !important;
    box-shadow  : 0 0 0 2px rgba(230, 230, 230, 0.35);
    outline     : none;
}

/* Colour was set only through ::-webkit-input-placeholder, so Firefox never
   got it, and it used opacity on text. #b8b8ba matches what the old
   #e1e1e1 at 0.8 opacity actually resolved to. */
.darkmode--activated ::placeholder {
    color  : #b8b8ba !important;
    opacity: 1;
}


/* ==========================================================================
   Projects area: filters panel, table, segmented controls
   --------------------------------------------------------------------------
   This part of the site never went through the token pass: it painted its own
   hardcoded greys (#1E1E1E, #2C2C2C, #272727) and hand rolled every corner at
   .25rem with vendor prefixes. Values are lifted onto the scale here rather
   than edited in place, because the originals are spread over ~200 lines and
   all use !important.
   ========================================================================== */

/* --- surfaces ----------------------------------------------------------- */

/* .global_filter is included so the sticky bar and the table under it are the
   same colour: they were #1E1E1E and #1c1c20, which left a visible seam
   across what should read as one panel. */
.darkmode--activated .table,
.darkmode--activated table.fixedHeader-floating,
.darkmode--activated .global_filter,
.darkmode--activated .filters_box,
.darkmode--activated .filters_box div:first-child {
    background-color: var(--surface-card) !important;
}

.darkmode--activated .table thead th,
.darkmode--activated .table_sections_navigation label {
    background-color: var(--surface-raised) !important;
}

/* Row dividers stay on the soft line. The container hairline (#3a3a40) is
   correct for a card edge but reads as a spreadsheet grid on 200 rows. */
.darkmode--activated .main_table,
.darkmode--activated .table td,
.darkmode--activated .table th,
.darkmode--activated .table thead th,
.darkmode--activated #investors_table th {
    border-color: var(--surface-line-soft) !important;
}

/* the panel needs an edge of its own, it sits directly on the page colour */
.darkmode--activated .filters_box {
    border: 1px solid var(--surface-line) !important;
}


/* --- corners ------------------------------------------------------------ */

/* The filters panel is a standalone column, all four corners round. */
.darkmode--activated .filters_box {
    border-radius: var(--radius-md) !important;
}

/* The filter bar sits flush on top of the projects table: same width, zero
   gap. They are one panel, so only the top corners round and the bottom ones
   stay square, otherwise a rounded corner cuts across a continuous surface.
   The matching bottom corners live on .main_table. */
.darkmode--activated .global_filter {
    border-radius: var(--radius-md) var(--radius-md) 0 0 !important;
}

/* Projects table corners.

   The header corners could never round: the table is border-collapse: collapse,
   and browsers ignore border-radius on cells in a collapsed table. Switching to
   separate borders with zero spacing renders identically here, because
   bootstrap only puts border-top on cells, so nothing doubles up.

   Not scoped to dark mode: the corners should match in both themes.

   The projects table is NOT inside .dataTables_scrollHeadInner, which is why
   the rules below it never matched anything on this page. */
.main_table {
    border-collapse: separate;
    border-spacing : 0;
}

/* The header keeps square top corners on purpose: .global_filter sits flush
   above it and carries the rounded top of the panel. Rounding here too would
   put a second corner in the middle of one continuous surface. */
.main_table thead th:first-child,
.main_table thead th:last-child {
    border-top-left-radius : 0;
    border-top-right-radius: 0;
}

.main_table {
    border-bottom-left-radius : var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
}

/* table: top corners live on the header cells, bottom corners on the body
   table, matching how the existing rules are structured */
.darkmode--activated .dataTables_scrollHeadInner .table,
.darkmode--activated .dataTables_scrollHeadInner thead th:first-child,
.darkmode--activated #investors_table th:first-child {
    border-top-left-radius   : var(--radius-md) !important;
    border-bottom-left-radius: 0 !important;
}

.darkmode--activated .dataTables_scrollHeadInner thead th:last-child,
.darkmode--activated #investors_table th:last-child {
    border-top-right-radius   : var(--radius-md) !important;
    border-bottom-right-radius: 0 !important;
}

.darkmode--activated .dataTables_scrollBody .table,
.darkmode--activated .main_table {
    border-bottom-left-radius : var(--radius-md) !important;
    border-bottom-right-radius: var(--radius-md) !important;
}

/* network switch: ALL / KUSAMA / POLKADOT */
.nav-link.bg-polkadot,
.nav-link.bg-kusama {
    border-radius: var(--radius-sm) !important;
}

/* segmented control: GENERAL / TOKEN / AUCTION / SOCIAL.
   Corners go on the end labels, which is the btn-group pattern, so no
   overflow:hidden is needed and the active state cannot poke out. */
.table_sections_navigation > label:first-of-type {
    border-top-left-radius   : var(--radius-sm);
    border-bottom-left-radius: var(--radius-sm);
}

.table_sections_navigation > label:last-of-type {
    border-top-right-radius   : var(--radius-sm);
    border-bottom-right-radius: var(--radius-sm);
}

/* project filter, a tagify widget rather than a plain input */
.tagify.countries {
    border-radius: var(--radius-sm);
}


/* --- column balance ----------------------------------------------------- */

/* At lg and up the three homepage columns are siblings in a stretched row, but
   the middle one is driven by its content and used to stop ~100px short of the
   news and events columns. Letting the coretime cards grow closes the gap. */
@media (min-width: 992px) {

    .home_top_content {
        display       : flex;
        flex-direction: column;
    }

    .home_top_content > .row {
        flex: 0 0 auto;
    }

    .home_top_content .home_cards {
        flex: 1 1 auto;
    }

    .home_top_content .home_cards .home_info_center {
        flex       : 1 1 auto;
        align-items: center;
    }
}
