@import url('../icomoon.css');
/* IcoMoon icon font. Both templates still link /media/jui/css/icomoon.css, which
   Joomla 4 deletes, so every icon-* glyph vanished: the person by each author,
   the calendar by each date, the read-more chevron, and the Start/Prev/Next/End
   pagination controls, which collapsed to zero width. The stylesheet and its woff
   now live in this template, where a Joomla update cannot remove them.
   Must stay at the very top: an @import after any rule is ignored. */

.titillium
{font-family: titillium;}

.raxo-prime .raxo-title {
    font-family: titillium web !important;
}
@media only screen and (min-width: 768px) {	.jdb-container {		max-width: 1250px !important;	}}


body {
    
    --black: #000000;

    --white: #ffffff;

    --fcpcyan: #04abdd;

    --fcplightcyan: #88c1d4;
    
    --fcpdarkgrey: #1c1c1c;

    --fcppurple: #542164;

    --fcppurple: #503585;
    
    --brown: #815016;
    
    --maroon: #8a5f6e;
    
    --rust: #883e15;
    
    --darkteal: #175747;

    --lightgrey: #acacac;
        
    --navy: #1d3454;
    
    --tan: #614f13;
    
    --waterblue: #2b3463;

    background-color: rgb(0,0,0);
    color: rgb(255,255,255)!important;
}

    .readMoreFade {
        background-image: -ms-linear-gradient(top, rgba(35,40,43,0) 0%, rgb(35 40 43) 100%);
        background-image: -moz-linear-gradient(top, rgba(35,40,43,0) 0%, rgb(35 40 43) 100%);
        background-image: -o-linear-gradient(top, rgba(35,40,43,0) 0%, rgb(35 40 43) 100%);
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(35,40,43,0)), color-stop(100, rgba(35 40 43)));
        background-image: -webkit-linear-gradient(top, rgba(35,40,43,0) 0%, rgba(0 0 0) 100%);
        background-image: linear-gradient(to bottom, rgba(35,40,43,0) 0%, rgb(35 40 43) 100%);}
        
        
    .ochblog.author-page .author-avatar.overlay {
        position: relative;
        margin-top: 0px;
        margin-left: 10px;
    }
    
    /* horizontal space between menu links */
    .nav-link {
        display: block;
        padding: 0.5rem .4rem;
    }
    /* border around author thumbnail */
    .thumbnail {
        border: 0px solid #ddd;
        }
    
    .ochblog.author-page .author-avatar img {
            min-width: 175px;
        max-width: 175px;
        background-color: var(--fcpdarkgrey);
    }
    
    /*author bio text colour*/
    .text-muted {
        color: #adb9c0 !important;
    }
    
            
        .btn-primary:not(:disabled):not(.disabled):active, .btn-backtohome:not(:disabled):not(.disabled):active, .item-page .pager.pagenav li .hasTooltip:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .btn-backtohome:not(:disabled):not(.disabled).active, .item-page .pager.pagenav li .hasTooltip:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle, .show > .btn-backtohome.dropdown-toggle, .item-page .pager.pagenav li .show > .hasTooltip.dropdown-toggle {
        color: #fff;
        background-color: var(--fcpcyan);
        border-color: var(--fcpcyan);
    }
    
    .btn:hover, .btn:focus {
        background-position: 0 0px;}
        
    /* Social Share Buttons */
    .jssocials-share-link {
        padding: .5em .6em;
        border-radius: 0.1em;
        border-color:var(--fcpcyan);
        color:var(--fcpcyan);
        transition: background 200ms ease-in-out, color 200ms ease-in-out, border-color 200ms ease-in-out;
    }
    
    .jssocials-share-link:hover, .jssocials-share-link:focus, .jssocials-share-link:active {
        border: 2px solid;
        border-color:var(--fcpcyan);
        color:var(--lightgrey);
    }
    
    .jssocials-share-label {
    color: var(--light);
}
[class^="och-icon-"], [class*=" och-icon-"] {
    color: var(--lightgrey);
}
    
         
    
    authsmicon {
       font-size: 2rem;
       }
    
    authsmicon a {
       color: var(--fcpcyan);
       }
       
    authsmicon a:hover{
       color: var(--fcpcyan);
       }
       
    .form-control:disabled, .acym_module .acym_fulldiv .acym_module_form .acym_form input:disabled, .form-control[readonly], .acym_module .acym_fulldiv .acym_module_form .acym_form input[readonly],.form-control {
        background-color:var(--fcpdarkgrey)!important;
        opacity: 1;
    }
    
    
    textarea.form-control {
        height: auto;
        color: white !important;
    }
    
    .alert-info {
        color: #ffffff;
        background-color: var(--fcplightcyan);
        border-color: var(--fcpcyan);
    }
    .alert {
        text-shadow: 0 1px 0 rgb(255 255 255 / 0%);
    }
    .alert-info h4 {
        color: #ffffff;
    }
    .panel {
       background-color: var(--fcpdarkgrey);
    }
    .panel-default > .panel-heading {
        color: #fff;
        border-color: var(--fcpcyan)!important;
        background: var(--fcpcyan)!important;
    }
    .panel-default {
        border-color: var(--fcpcyan);
        padding-left: 2px;
    padding-right: 2px;
    }
    .kwho-admin {
        color: #ffffff;
        font-weight: 700;
    }.btn-group>.btn, .btn-group>.dropdown-menu, .btn-group>.popover {
        font-size: 14px;
        background: var(--darkteal);
        border: 0px;
    }
    
    .badge-light {
        color: #212529;
        background-color: var(--fcpdarkgrey);
    }
    .label-info[href], .badge-info[href] {
        background-color: var(--darkteal);
    }
    
    

    
    .card p {
        text-align: justify;
        background-color: var(--darkteal);
    }
    
    
    .thumbnail {
        border: 0px solid #ddd;
        object-fit: cover !important;
        min-width: 80px !important;
        min-height: 80px !important;
    }
    
    .kdiscuss-title {
        background: var(--fcpcyan);
        border-bottom: 1px;
        border-bottom-color: var(--fcpcyan);
    }
    .klogin-to-discuss {
        background-color: var(--fcpcyan);
        border: 1px;
        border-color: var(--fcpcyan);
        color: #ffffff;
        }
        
    .klogin-to-discuss:hover {
    color: var(--white)!important;
    border: 1px;
    border-color: var(--waterblue)!important;
    background-color: var(--waterblue)!important;
}


 .item-page { display: block !important; }


    .blog .items-row .item .card-body {
        padding: 15px 15px 15px 15px;
        background-color: rgb(35 40 43);
    }
    .card {
        border: 1px solid rgb(35 40 43);
        background-color: rgb(35 40 43);
    }
    
    
    .label-info[href], .badge-info[href] {
        background-color: var(--darkteal);
        color: white;
        padding: 2px 4px;
        border-radius: 3px;
        font-size: 11.844px;
        font-weight: bold;
        line-height: 14px;
        text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
        white-space: nowrap;
        vertical-align: baseline;
    }
    
    .blog .pagination {
        margin-top: 30px;
        font-weight: bold;
        font-size: 1.1rem;
    }
    
    ul.pagination li a {
        border: 0;
        background-color: var(--darkteal);
        color: #ffffff;
    }
    
    
    
    
    
    .ochblog-authorinfo-container .authorinfo .authorbio {
        margin-top: 1rem;
        max-width: 210px;
        word-wrap: break-word;
        text-align: center;
    }
    



/* horizontal ruler made invisible by matching grey */

hr {
    border-top: 1px solid rgb(35 40 43) !important;
}

.authoravatar {
    display: block;
    padding: 0px;
    line-height: 20px;
    background-color: #fff;
    border: 0px solid #ddd;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.module-title {
    margin-bottom: 0px !important;
}

.raxo-pagination {
    margin: -5px 0 2px;
    overflow: hidden;
}

.raxo-prime .allmode-name, .raxo-prime .allmode-showall, .raxo-prime .raxo-category {
    background-color: var(--fcppurple)!important;
}

.raxo-prime .raxo-title:after {
	background-color: var(--fcplightcyan);
}

.raxo-normal .raxo-wrap .raxo-prime a {
    color: #fff !important;
    text-decoration: none;
    outline: 0;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    width: 100%;
    overflow-wrap: break-word;
    white-space: normal;
    line-height: normal;
    font: message-box;
	font-variant-caps: petite-caps;
}


.ad-padding {
    padding-top: 50px;
    padding-bottom: 50px;}
    
    .raxo-prime .raxo-title {
    font-size: 1.3rem;
    line-height: 1.3rem;
    margin-bottom: 20px;
    padding: 2px 14px 2px 20px;
    background: rgba(44,44,44,.64);
}

/* horizontal ruler made invisible by matching grey */

hr {
    border-top: 1px solid rgb(35 40 43) !important;
}


.titillium
{font-family: titillium;}

.raxo-prime .raxo-title {
    font-family: titillium web !important;
}
@media only screen and (min-width: 768px) {	.jdb-container {		max-width: 1250px !important;	}}



    
    
    .readMoreFade {
        background-image: -ms-linear-gradient(top, rgba(35,40,43,0) 0%, rgb(35 40 43) 100%);
        background-image: -moz-linear-gradient(top, rgba(35,40,43,0) 0%, rgb(35 40 43) 100%);
        background-image: -o-linear-gradient(top, rgba(35,40,43,0) 0%, rgb(35 40 43) 100%);
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(35,40,43,0)), color-stop(100, rgba(35 40 43)));
        background-image: -webkit-linear-gradient(top, rgba(35,40,43,0) 0%, rgba(0 0 0) 100%);
        background-image: linear-gradient(to bottom, rgba(35,40,43,0) 0%, rgb(35 40 43) 100%);}
        
        
    .ochblog.author-page .author-avatar.overlay {
        position: relative;
        margin-top: 0px;
        margin-left: 10px;
    }
    
    /* horizontal space between menu links */
    .nav-link {
        display: block;
        padding: 0.5rem .4rem;
    }
    /* border around author thumbnail */
    .thumbnail {
        border: 0px solid #ddd;
        }
    
    .ochblog.author-page .author-avatar img {
            min-width: 175px;
        max-width: 175px;
        background-color: var(--fcpdarkgrey);
    }
    
    /*author bio text colour*/
    .text-muted {
        color: #adb9c0 !important;
    }
    
        
    .btn-primary, .btn-backtohome, .btn-prosandcons, div.jd-register-login-wrapper .jd-register-login-box .jd-button-control .jd-form-button  {
        color: var(--white)!important;
        text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
        background-color: var(--fcpcyan)!important;
        background-image: none;
        border-color: var(--fcpcyan)!important;
    }
        
        .btn-primary:not(:disabled):not(.disabled):active, .btn-backtohome:not(:disabled):not(.disabled):active, .item-page .pager.pagenav li .hasTooltip:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .btn-backtohome:not(:disabled):not(.disabled).active, .item-page .pager.pagenav li .hasTooltip:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle, .show > .btn-backtohome.dropdown-toggle, .item-page .pager.pagenav li .show > .hasTooltip.dropdown-toggle {
        color: #fff;
        background-color: var(--fcpcyan);
        border-color: var(--fcpcyan);
    }
    
    .btn:hover, .btn:focus {
        background-position: 0 0px;}
        
    /* Social Share Buttons */
    .jssocials-share-link {
        padding: .5em .6em;
        border-radius: 0.1em;
        border-color:var(--fcpcyan);
        color:var(--fcpcyan);
        transition: background 200ms ease-in-out, color 200ms ease-in-out, border-color 200ms ease-in-out;
    }
    
    .jssocials-share-link:hover, .jssocials-share-link:focus, .jssocials-share-link:active {
        border: 2px solid;
        border-color:var(--fcpcyan);
        color:var(--lightgrey);
    }
    
    .jssocials-share-label {
    color: var(--light);
}
[class^="och-icon-"], [class*=" och-icon-"] {
    color: var(--lightgrey);
}
    
      
    
    
    
    
    authsmicon {
       font-size: 2rem;
       }
    
    authsmicon a {
       color: var(--fcpcyan);
       }
       
    authsmicon a:hover{
       color: var(--fcpcyan);
       }
       
    .form-control:disabled, .acym_module .acym_fulldiv .acym_module_form .acym_form input:disabled, .form-control[readonly], .acym_module .acym_fulldiv .acym_module_form .acym_form input[readonly] {
        background-color: #000000;
        opacity: 1;
    }
    
    body textarea, body input[type="text"], body input[type="password"], body input[type="datetime"], body input[type="datetime-local"], body input[type="date"], body input[type="month"], body input[type="time"], body input[type="week"], body input[type="number"], body input[type="email"], body input[type="url"], body input[type="search"], body input[type="tel"], body input[type="color"], body .uneditable-input {
        border: 1px;
        border-color: var(--fcpcyan);
        box-shadow: none;
        color: white;
        background-color: var(--fcpdarkgrey);
    }
    
    
    body input[type="search"] {
    border: 10px;
    border-color: var(--fcpcyan);
    box-shadow: none;
    color: white !important;
    background-color: var(--fcppurple)
    }
    
    
    textarea.form-control {
        height: auto;
        color: white !important;
    }
    
    .alert-info {
        color: #ffffff;
        background-color: var(--fcplightcyan);
        border-color: var(--fcpcyan);
    }
    .alert {
        text-shadow: 0 1px 0 rgb(255 255 255 / 0%);
    }
    .alert-info h4 {
        color: #ffffff;
    }
    .panel {
       background-color: var(--fcpdarkgrey);
    }
    
    .panel-default {
        border-color: var(--fcpcyan);
    }
    .kwho-admin {
        color: #ffffff;
        font-weight: 700;
    }.btn-group>.btn, .btn-group>.dropdown-menu, .btn-group>.popover {
        font-size: 14px;
        background: var(--darkteal);
        border: 0px;
    }
    
    
    .badge-light {
        color: #212529;
        background-color: var(--fcpdarkgrey);
    }
    .label-info[href], .badge-info[href] {
        background-color: var(--darkteal);
    }
    
    
    .item-page .item-title + div[itemprop="articleBody"], .item-page .icons + div[itemprop="articleBody"], .item-page .article-info + div[itemprop="articleBody"], .item-page .entry-image + div[itemprop="articleBody"] {
        margin-top: 0px;
        text-align: justify;
    }

    
    .card p {
        text-align: justify;
        background-color: var(--darkteal);
    }
    
    
    .thumbnail {
        border: 0px solid #ddd;
        object-fit: cover !important;
        min-width: 80px !important;
        min-height: 80px !important;
    }
    
    
    .item-page { display: block !important; }
    
    .blog .items-row .item .card-body {
        padding: 15px 15px 15px 15px;
        background-color: rgb(35 40 43);
    }
    .card {
        border: 1px solid rgb(35 40 43);
        background-color: rgb(35 40 43);
    }
    
    
    .label-info[href], .badge-info[href] {
        background-color: var(--darkteal);
        color: white;
        padding: 2px 4px;
        border-radius: 3px;
        font-size: 11.844px;
        font-weight: bold;
        line-height: 14px;
        text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
        white-space: nowrap;
        vertical-align: baseline;
    }
    
    .blog .pagination {
        margin-top: 30px;
        font-weight: bold;
        font-size: 1.1rem;
    }
    
    ul.pagination li a {
        border: 0;
        background-color: var(--darkteal);
        color: #ffffff;
    }
    
    
    
    
    .ochblog-authorinfo-container .authorinfo .authorbio {
        margin-top: 1rem;
        max-width: 150px;
        word-wrap: break-word;
        text-align: center;
    }
    
    
 

/* horizontal ruler made invisible by matching grey */

hr {
    border-top: 1px solid rgb(35 40 43) !important;
}

.authoravatar {
    display: block;
    padding: 0px;
    line-height: 20px;
    background-color: #fff;
    border: 0px solid #ddd;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    margin-bottom: 15px;
}

.module-title {
    margin-bottom: 0px !important;
}



.cb_template .border-top {
    border-top: 1px;
    border-color: var(--fcpcyan);
}
.cb_template .bg-white {
    background-color: rgb(35 40 43) !important;
    color: white;
}
.cb_template .text-muted {
    color: #ffffff !important;
}
.ad-padding {
    padding-top: 50px;
    padding-bottom: 50px;}
    
    .raxo-prime .raxo-title {
    font-size: 1.3rem;
    line-height: 1.3rem;
    margin-bottom: 0px;
    padding: 2px 14px 2px 20px;
    background-color: rgba(44,44,44,.64);
}

/* horizontal ruler made invisible by matching grey */

hr {
    border-top: 1px solid rgb(35 40 43) !important;
}

.w1500 {
    max-width: 1500px;
    background-color: #23282b;

}


.moduletable:first-child.searchmodulehomepage {
    margin-top: 0;
    
}
.footermenu a{
    color:var(--white)!important;
}


#kunena.layout #jumpto .inputbox {
    max-width: 275px;
    background-color: var(--fcppurple)!important;
    color: var(--white)!important;
}
#kunena.layout option, #kunena.layout option:focus, #kunena.layout option:active, #kunena.layout option:hover {
    color: var(--white)!important;
    background-color: var(--fcppurple)!important;
}
#kunena.layout .kpagination a:link, #kunena.layout .kpagination a:visited {
    color: var(--white)!important;
    background-color: var(--fcppurple)!important;
}

#kunena.layout select, #kunena.layout select:focus, #kunena.layout select:hover {
    color: var(--white)!important;
    background-color: var(--fcppurple)!important;
}
#kunena.layout button.btn, #kunena.layout .btn-primary {
    
    background-color: var(--fcpcyan) !important;
    color: var(--white) !important;
}

#kunena.layout .button, #kunena.layout .kbutton {
    color: var(--white)!important;
    background-color: var(--fcpcyan) !important;
    width: auto;
}
#kunena.layout #btn_thankyou, #kunena.layout #btn_unthankyou, #kunena.layout #btn_list, #kunena.layout .klist-actions .btn, #kunena.layout .kmessage-left .btn, #kunena.layout #topic-actions .btn, #kunena.layout .kmessage-buttons-row .btn, #kunena.layout #btn_reply, #kunena.layout #btn_quote, #kunena.layout #btn_quickreply {
    background-color: var(--fcpcyan)!important;
    color: var(--white)!important;
    padding: 2px;
    margin-top: 5px;
    font-size: 1rem;
}
.layout#kunena .kcol-ktopicicon a:link, .layout#kunena .kcol-ktopicicon a:visited, .layout#kunena .kcol-ktopicicon a:active {
    color: var(--fcpcyan)!important;
}
.hasTooltip {
    color:var(--white)!important;
}

#kunena.layout td.kprofile-left {
    background-color: #23282b;
}
#kunena.layout #btn_sticky, #kunena.layout #btn_unsticky, #kunena.layout #btn_unlock, #kunena.layout #btn_lock, #kunena.layout #btn_moderate, #kunena.layout #btn_delete, #kunena.layout #btn_edit {
    color: var(--white)!important;
    background-color: var(--rust)!important;
    padding: 2px;
}

#kunena.layout .kunapproved td {
    background-color: var(--lightgrey)!important;
}

#kunena.layout div.kmsg-header h2 {
    background-color: var(--fcpdarkgrey)!important;
    font-size: 1.5rem!important;
    font-weight: 100!important;
    font-family: 'Titillium Web'!important;
}

#kunena.layout .ktopactions, #kunena.layout .kpost-profile .img-polaroid {
    border: 0px solid var(--fcppurple)!important;
}
#kunena.layout .klist-actions-goto {
    border-right: 0px solid var(--fcppurple)!important;
    padding: 0 0px;
}

#btn_permdelete, #btn_undelete, #btn_edit {
    color: var(--white)!important;
    background-color: var(--rust)!important;
    padding: 2px;
  }
  
  #kunena.layout #btn_unfavorite, #kunena.layout #btn_favorite, #kunena.layout #btn_unsubscribe, #kunena.layout #btn_subscribe {
    padding: 2px;
}

#kunena.layout div.kblock div.khelprulescontent, #kunena.layout div.kblock div.kfheadercontent, #kunena.layout td.kuadesc, #kunena.layout td.kcreditsdesc {
    background-color: var(--rust)!important;
    color: var(--white)!important;
    margin-top: 45px;
}

/* hides the little closing "x"s */
.close {
    visibility: hidden;
    height: 0px;
}


#kunena.layout .topic-list-tr {
    border-bottom: 0px solid var(--fcppurple)!important;
    border-top: 0px solid var(--fcppurple)!important;
    background-color: #23282b!important;
}
#kunena.layout .klist-actions {
    border: 1px solid;
    border-top-color: var(--fcppurple)!important;
}

.layout#kunena #ktab a {
    background-color: var(--fcppurple)!important;
}

/*community builder
*/
.cb_template .border {
    border: 1px;
    border-color: var(--fcppurple)!important;
    background-color: var(--fcpdarkgrey)!important;
}

.cb_template .btn-primary:not(:disabled):not(.disabled):active, .cb_template .btn-primary:not(:disabled):not(.disabled).active, .show > .cb_template .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--fcpcyan)!important;
    border-color:var(--fcpcyan)!important;
}

.cb_template .nav-tabs .nav-link.active, .cb_template .nav-tabs .nav-item.show .nav-link {
    color: #ffffff;
    background-color: var(--fcpcyan);
    border-color: var(--fcpcyan);
    border-left: 0px solid #dee2e6!important;
    border-right: 0px solid #dee2e6!important;
}

.cb_template a {
    color: var(--fcpcyan);
    text-decoration: none;
}

.cb_template .nav-tabs {
    border-bottom: 1px;
    border-color: var(--fcpcyan);
}

.cb_template .border-bottom {
    border-bottom: 1px;
    border-color: var(--fcpcyan);
}

.cb_template .form-control {
    border: 1px;
    border-color: var(--fcpcyan);
    display: block;
   color: var(--white)!important;
    background-color: var(--fcpdarkgrey)!important;
}

.cb_template .btn-primary {
    color: #fff;
    background-color: var(--fcpcyan);
    border-color: var(--fcpcyan);
}

.cb_template a:hover {
    color: #ffffff;
}

.cb_template .btn-primary:hover {
    color: rgb(0 0 0);
    background-color: var(--fcpcyan);
    border-color: var(--fcpcyan);

}

.cb_template .navbar-light .navbar-nav .nav-link {
    color: var(--fcpcyan);
}
.cb_template .navbar-light .navbar-nav .show > .nav-link, .cb_template .navbar-light .navbar-nav .active > .nav-link, .cb_template .navbar-light .navbar-nav .nav-link.show, .cb_template .navbar-light .navbar-nav .nav-link.active {
    color: var(--white);
}
.cb_template .table {
    color: var(--white);
}
.cb_template .form-control-plaintext {
    color: var(--white);
}

.cb_template .input-group > .input-group-prepend > .btn, .cb_template .input-group > .input-group-prepend > .input-group-text, .cb_template .input-group > .input-group-append:not(:last-child) > .btn, .cb_template .input-group > .input-group-append:not(:last-child) > .input-group-text, .cb_template .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle), .cb_template .input-group > .input-group-append:last-child > .input-group-text:not(:last-child) {
    background-color: var(--fcpcyan)!important;
}
.cb_template .input-group-text {
        border: 1px solid var(--fcpcyan)!important;
}
.cb_template .input-group-text {
    color: var(--white)!important;
}
.cb_template .input-group > .form-control:not(:first-child), .cb_template .input-group > .custom-select:not(:first-child) {
       background-color: var(--fcpcyan)!important;
    color: var(--white)!important;
}


.cb_template .dropdown-item.active, .cb_template .dropdown-item:active {
    color: #fff;
    background-color: var(--fcppurple);
}
.cb_template.qtip-nostyle .qtip-content {
    margin: 0;
    padding: 0;
    border: 0;
    overflow: visible;
    background-color: var(--fcppurple);
}
.cb_template .dropdown-menu {
    color: var(--white)!important;
    background-color: var(--fcppurple);
    border: 1px solid rgba(0, 0, 0, 0.15);
}
.cb_template .dropdown-item {
    color: var(--white)!important;
}
.cb_template .dropdown-item:hover, .cb_template .dropdown-item:focus {
    background-color: var(--fcppurple)!important;
}

.cb_template .btn-secondary:not(:disabled):not(.disabled):active, .cb_template .btn-secondary:not(:disabled):not(.disabled).active, .show > .cb_template .btn-secondary.dropdown-toggle {
    color: #fff;
    background-color: var(--fcppurple)!important;
    border-color: var(--fcppurple)!important;
}
.cb_template .btn {
    color: var(--white);
}

.cb_template .btn-secondary {
    color: var(--white)!important;
    background-color: var(--fcppurple)!important;
    border-color: var(--fcppurple)!important;
}



.moduletable.loginmodulehomepage {
    background: var(--black);
    color: white;
    padding-top: 20px!important;
    padding-bottom: 5px!important;
    margin-left: 36px;
    margin-right: 36px;
}


#kunena.layout .krow1-stickymsg {
    background-color: #444444!important;
}
#kunena.layout .krow2-stickymsg {
    background-color: #444444!important;
}

#kunena.layout div.kthead-title a {
    font-size: 1.3rem!important;
    font-weight: 600!important;
    color: var(--fcpcyan)!important;
}

#kunena.layout h1, #kunena.layout h2 {
    font-size: 2rem!important;
    padding-bottom: 10px;
}


.svg-inline--fa.fa-w-14 {
    width: 2rem!important;
}

.moduletable.toprightsocialicons {
    padding-top: 20px!important;
    padding-right: 6px!important;
}



.header-center-section.d-none.d-lg-flex.justify-content-center.flex-lg-grow-1 {
    justify-content: normal!important;
    margin-left: -15px;
}

#kunena.layout .kheader a:link, #kunena.layout .kheader a:visited, #kunena.layout h1, #kunena.layout h2{
    color: var(--fcplightcyan)!important;
    font-family: 'Titillium Web'!important;
    font-size: 1.7rem!important;
}

#kunena.layout div.kthead-desc, #kunena.layout div.kthead-moderators, #kunena.layout div {
    font-family: 'Open Sans'!important;
    font-size: 1rem!important;
    background-color:#23282b!important;
}
.moderators {
    font-size: .9rem!important;
    font-family: 'Open Sans'!important;
}
#kunena.layout .kwho-admin, #kunena.layout a.kwho-admin {
    color: var(--fcplightcyan)!important;
}
#kunena.layout .kwho-globalmoderator, #kunena.layout a.kwho-globalmoderator {
    color: var(--blue)!important;
}
#kunena.layout td.kprofileboxcnt ul.kprofilebox-welcome li input.kbutton {
    background-color: var(--fcpcyan)!important;
    margin: 0;
    color: var(--white)!important;
    padding-left: 10px;
    padding-right: 10px;
    width: auto;
}
#kunena.layout td.kprofileboxcnt ul.kprofilebox-welcome li input.kbutton:hover {
    background-color: #609FBF!important;
}

#kunena.layout span {
    font-family: 'Titillium Web'!important;
}

.ochblog-authorprofile-container .articleinfo .category, .ochblog-authorprofile-container .articleinfo .writtenby, .ochblog-authorsoverview-container .articleinfo .category, .ochblog-authorsoverview-container .articleinfo .writtenby, .ochblog-authorinfo-container .articleinfo .category, .ochblog-authorinfo-container .articleinfo .writtenby, .ochblog-articleinfo-container .articleinfo .category, .ochblog-articleinfo-container .articleinfo .writtenby, .article-info-articleinfo-container .articleinfo .category, .article-info-articleinfo-container .articleinfo .writtenby {
    font-size: 90%;
}

.jdb-row {
    margin-right: -15px!important;
    margin-left: 2px!important;
}

.jdb-container {
    padding-right: 0px;
}
#jde-5k0040097599444207v {
    margin-bottom: 5px!important;
    margin-top: 10px;
}
#jde-kk003009759944420b8 {
    margin-bottom: -10px!important;
    margin-top: 15px;
}

#jdc-jz00309759944420ub {
    margin-bottom: -10px!important;
    margin-top: 15px;
}



#jde-qt0040061820510120r {
    margin-bottom: 5px!important;
    margin-top: 10px;
}

#jde-dh002009759944419jo {
    margin-bottom: 0px!important;
    margin-top: -5px;
    padding-left: 15px!important;
}

#jde-nf002019759944419fu {
    padding-left: 15px!important;
}

#jdc-xc00406182051012od {
    padding-bottom: 27px;
}

#jde-rq005009759944420t1 {
    margin-bottom: 5px!important;
    margin-top: 10px;
}

.allmode-list {
    margin-bottom: 10px!important;
}
.jdb-heading-heading {
    font-size: 2.5rem!important;
    font-weight: 400!important;
}

#kunena.layout .fa-rss {
    color: var(--fcppurple)!important;
}

.tooltip-inner {
    color: #fff !important;
    background-color: black!important;
}

.kunenadiscuss {
    border-bottom: 1px;
    border-bottom-color: var(--fcpcyan);
    padding-bottom: 10px;
    margin-bottom: 10px;
}
#kunena.layout span.kmsgtitle-new {
    font-weight: 400!important;
    font-size: 1.333rem!important;
    float: left!important;
    padding-top: 10px!important;
}

#kunena.layout div.kmsg-header-left span.kmsgdate-left {
    font-size: 1.1rem!important;
    text-decoration: underline;
    text-decoration-color: var(--fcpcyan)!important;
    padding-left: 20px;
    font-weight: 100;
}
#kunena.layout div.kmsg-header-left span.kmsg-id-left a {
    color: var(--fcpcyan) !important;
    font-size: 1.1rem!important;
    font-weight: 400!important;
}


#kunena.layout tr.krow1 td {
    background-color: #23282b!important;
}
#kunena.layout .kforum-pathway {
    color: #000!important;
    background-color: #23282b!important;
    line-height: 18px;
    border: 1px solid #23282b!important;
    margin: -5px 0 0;
    padding: 5px;
}
#kunena.layout .kprofilebox-left {
    width: 5%;
    border-right: 1px solid #23282b!important;
    vertical-align: middle;
    padding: 8px;
}
#kunena.layout div.kblock div.kbody {
    overflow: hidden;
    word-wrap: break-word;
    border-left: 1px solid #23282b!important;
    border-right: 1px solid #23282b!important;
}

#kunena.layout .klist-actions {
    background-color: #23282b!important;
    color: #000;
    margin-top: -1px;
}
#kunena.layout div.kblock {
    background-color: #23282b!important;
}

#kunena.layout td.kcol-first {
    border-left: none;
    border-bottom: 1px solid #23282b!important;
    padding-top: 35px;
    padding-bottom: 35px;
}

#kunena.layout td.kcol-mid, #kunena.layout td.kcol-last {
    border-left: none;
    border-bottom: 1px solid #23282b!important;
}

#kunena.layout .klist-markallcatsread {
    background-color: #23282b;
    min-height: 27px;
    overflow: hidden;
    border: 1px solid #23282b;
    padding: 0;
}
#kunena.layout .kannouncement {
    border-bottom: 1px solid #23282b !important;
}
#kunena.layout .button, #kunena.layout .kbutton {
    border: var(--darkteal)!important;
}
#kunena.layout div.kthead-child {
    clear: left;
    border-top: 0px dotted #DDD5BF!important;
    margin-top: 4px;
}
#kunena.layout .kwhoonline {
    border-bottom: 0px dotted #CCC!important;
    width: 100%;
    padding-bottom: 5px;
}
#kunena.layout .klist-actions {
    background-color: #23282b;
    color: #000;
}
#kunena.layout .klist-actions {
    border: 0px solid var(--fcppurple)!important;
}
#kunena.layout .klist-times-all {
    border-left: 0px solid #BFC3C6;
}

#kunena.layout .klist-jump-all {
    border-left: 0px solid #BFC3C6;
}

#kunena.layout .klist-pages-all {
    border-left: 10px solid #BFC3C6;}
            
#kunena.layout .klist-pages-all {
    border-left: 0px solid #BFC3C6;
}

#kunena.layout .klist-times-all .inputboxusl {
    border-color: var(--fcppurple);
}
#kunena.layout .kpagination span {
    border: 1px solid var(--fcppurple);
}

#kunena.layout select, #kunena.layout select:focus, #kunena.layout select:hover {
    border-color: var(--fcpcyan);
}
#kunena.layout div.kmessage-editmarkup-cover {
    border-bottom: 0px dotted #BFC3C6;
}

#kunena.layout span.kmessage-editmarkup {
    color: #fff;
    background: var(--fcppurple) no-repeat left center;
    border: 0px dotted #BFC3C6;
}

#kunena.layout span.kmessage-informmarkup {
    color: #fff;
    background: var(--rust) no-repeat left center;
    border-top: 0px dotted var(--rust);
    border-right: 0px dotted var(--rust);
    border-left: 0px dotted var(--rust);
    font-size: 1rem;
}
#kunena.layout span.kmessage-informmarkup a {
    color: #fff;
    background: var(--rust) no-repeat left center;
    border-top: 0px dotted var(--rust);
    border-right: 0px dotted var(--rust);
    border-left: 0px dotted var(--rust);
    font-size: 1rem;
}

#kunena.layout div.kmessage-buttons-row {
    padding: 5px;
}
#kunena.layout span.kmsgtitle, #kunena.layout span.kmsgtitle-new {
    font-weight: 400!important;
    padding-left: 25px;
    line-height: 22px;
    float: left;
    font-size: 1.5rem!important;
    padding-top: 9px!important;
}
            
#kunena.layout .img-circle {
        display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    margin-top: 15px;
}

#kunena.layout #btn_approve {
    color: var(--white)!important;
    background-color: var(--fcpcyan)!important;
    padding: 2px;
}
#kunena.layout #btn_delete {
    color: var(--white)!important;
    background-color: var(--red)!important;
    padding: 2px;
}


#kunena.layout .klist-actions-forum {
    border-left: 0px solid #BFC3C6!important;
}

#kunena.layout fieldset {
    background-color: #23282b!important;
    border: 1px solid #23282b!important;
}

.right-column-margin {
    margin-right: 37px;
    margin-left: 37px;
}

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

.m-bottom-25{
    margin-bottom: 25px;
}
#kunena.layout .kcontenttablespacer {
    border-bottom: 0px solid #BFC3C6;
}

#kunena.layout .wysibb-toolbar-btn span {
    font-family: 'WysiBBiconFont'!important;
}

.wysibb {
    background-color: black!important;
}

#wbbmodal .wbbm {
    background: var(--fcppurple);
    text-align: left;
    max-width: 90%;
    max-height: 90%;
    margin: 30px auto;
    border: 1px solid var(--fcppurple);
    box-shadow: 0 0 5px #333;
    overflow: auto;
    color: white;
}

#wbbmodal .wbbm-title .wbbm-title-text {
    font-size: 1.6em;
    line-height: 2em;
    margin: 0;
    padding: 0;
    color: white;
}

#wbbmodal .wbbm-bottom {
    border-top: 1px var(--teal);
    padding: 10px;
    background: var(--teal);
}

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn .fonticon {
    color: #fff;
    font-family: 'WysiBBiconFont';
    font-size: 1.3rem!important;
    line-height: 28px;
    text-shadow: none;
    text-align: center;
    speak-as: none;
}

.wbb-select .option.selected {
    background: var(--fcppurple);
    color: #fff;
}

#kunena.layout .wysibb-toolbar-btn span {
    font-family: 'WysiBBiconFont'!important;
    background-color: black;
}

.wysibb .wysibb-toolbar .wysibb-toolbar-container .wysibb-toolbar-btn:hover {
    padding: 0 1px;
    border: 1px solid transparent;
    border-radius: 0;
    background: var(--teal);
    color: white;
}
#kunena.layout .wysibb-toolbar-btn span:hover {
    color: #ffffff;
}

sup.knewchar {
    color: var(--fcplightcyan);
    font-weight: 700;
}

.loginmodulehomepage .cb_template img {
    vertical-align: middle;
    border-style: none;
    width: 125px;
    align-content: center;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.loginmodulehomepage .cb_template p {
    text-align: center;
}

.loginmodulehomepage .logout-button {
    text-align: center;
}

.allmode-list .allmode-right {
    padding-right: 20px!important;
}

.klatest-subject a {
    font-weight: bold;
    font-size: .8rem;
    line-height: .8rem;
    letter-spacing: 0.05rem;
    text-decoration: none;
}

.klatest-avatar img {
    margin: 2px 2px 2px 10px;
    border: 0px solid #CCCCCC;
    padding: 1px;
    float: left;
    margin-right: 10px;
    margin-bottom: 7px;
    margin-top: 7px;
}

.klatest-items .knewchar {
    font-size: .6rem;
}

img {
    height: auto;
    max-width: 100%;
    display: inline-block;
    vertical-align: middle;
    border: 0;
}

.moduletable.latestforumposts {
    background: var(--fcpdarkgrey);
    color: white;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 20px!important;
    padding-bottom: 5px!important;
    margin-left: 36px;
    margin-right: 36px;
    margin-bottom: 20px!important;
}

.moduletable.latestforumposts ul ul {
    list-style-type: none;
    margin-block-start: 0px;
    margin-block-end: 0px;
}

.moduletable.latestforumposts ul {
    display: block;
    list-style-type: none;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;
    overflow: auto;
}

.moduletable.latestforumposts li.klatest-author {
    color: var(--fcpcyan);
    padding-bottom: 1.2px;
    font-size: .8rem;
}

.moduletable.latestforumposts a.kwho-user.hasTooltip {
    font-size: .7rem;
}

.ochblog .label-warning {
    color: var(--white);
    background-color: var(--fcppurple);
}

.wysibb {
    border: 1px solid #ddd;
    position: relative;
    background: #000000!important;
    font-size: 12px;
}

.fa-fw {
    text-align: center;
    width: .9em!important;
}

.articleinfo {
    font-size: 1.3rem;
}

.articlebadges {
    font-size: 1.1rem;
}

tr.krow2.krow2 {
    height: 160px;
}

tr.krow1.krow1 {
    height: 160px;
}

.allmode-list .allmode-item .allmode-title, .allmode-list .allmode-item .allmode-title a {
    color: var(--fcplightcyan)!important;
}

#kunena.layout div.kmsgtext-article {
    background-color: #23282b!important;
}


#kunena.layout div.kmsgsignature {
    color: #fff;
    border-top: 1px dotted var(--fcppurple);
}

.modal-header {
    width: 100%;
    border-bottom: 1px var(--fcppurple);
}

.modal-body {
    width: 100%;
}

#kunena.layout input {
    width: 100%;
    height: auto;
    margin: 0;
}
.form-inline label {
        display: none;
        text-align: left!important;
}

#kunena.layout div.kmsgattach {
    border: 1px dotted var(--fcppurple);
}

.modal-footer {
    width: 100%;
    border-bottom: 1px var(--fcppurple);
}
.cb_template .border-top {
    border-top: 1px solid var(--fcppurple)!important;
}
.cb_template .table thead th {
    border-bottom: 2px solid var(--fcppurple)!important;
}

.cb_template .table th, .cb_template .table td {
    border-top: 1px solid var(--fcppurple)!important;
}
.jssocials-share-count-box {
    background: var(--fcppurple);
}
.jssocials-share-count-box .jssocials-share-count {
    color: #ffffff;
}

tr.krow2.krow2krow2unapproved.krow2unapproved {
    background-color: dimgrey!important;
}

.moduletable.usermenumodule.jmoddiv {
    padding-left: 15px;
    background-color: var(--fcppurple);
    margin-left: 36px;
    margin-right: 37px;
    padding-bottom: 20px;
}

.moduletable.usermenumodule.jmoddiv.jmodinside a {
    color: white!important;
}

.raxo-pagination .raxo-image {
    border: 0px solid #666666!important;
}
.raxo-pagination .raxo-title {
    text-align: left!important;
}

.nav-tabs {
    border-bottom: 1px solid var(--fcpcyan)!important;
}

#kunena.layout .nav-tabs li {
    border-left-color: var(--fcpcyan)!important;
    border-right-color: var(--fcpcyan)!important;
    border-top-color: var(--fcpcyan)!important;
    background-color: var(--fcppurple);
}

.layout#kunena a:link, .layout#kunena a:visited, .layout#kunena a:active {
    color: #ffffff;
}

#kunena.layout .button, #kunena.layout .kbutton {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 3px!important;
    padding-bottom: 3px!important;
}

.layout#kunena a:link, .layout#kunena a:visited, .layout#kunena a:active {
    padding-top: 5px!important;
    padding-bottom: 5px!important;
    background-color: #23282b!important;
}

#kunena.layout div.kmoderate-message {
    border: 1px solid var(--fcpcyan)!important;
}

.img-thumbnail {
    padding: 0.25rem;
    background-color: #23282b!important;
    border: 0px solid #dee2e6!important;
}

.cb_template .page-item.disabled .page-link, .cb_template .page-link {
    color: var(--white)!important;
    background-color: var(--fcpcyan)!important;
    border-color: var(--fcppurple)!important;
}
.pagination .page-item.active .page-link {
    color: #dee2e6!important;
    background-color: var(--fcppurple)!important;
    border-color: var(--fcpcyan)!important;
}
.mceModernSkinTouch .mceToolbar .mceButton {
    padding: 9px 11px;
    background-color: var(--fcpcyan);
}

.mcePathLabel, .mceDefaultSkin .mceStatusbar .mceWordCount, .mceDefaultSkin .mceStatusbar .mceWordCount .mceText {
    color: white;
}
span#cb_bio_word_count {
    color: white;
}
.mceDefaultSkin .mceStatusbar {
    background-color: #000;
}
.mceModernSkin .mceToolbar {
    background: #000000;
}

.mceModernSkinTouch .mceToolbar .mceListBox .mceText, .mceModernSkinTouch .mceToolbar .mceSourceSearch .mceTextBox {
    background-color: black;
    color: white;
}
.mceListBoxMenu .mceMenuItems .mceText {
    color: white;
}
.mceListBoxMenu .mceMenuItems {
    background-color: black;
}
.mceModernSkinTouch .mceToolbar .mceListBox .mceOpen, .mceModernSkinTouch .mceToolbar .mceSplitButton .mceOpen {
    background: var(--fcpcyan);
}

.mceMenu {
    border: 1px solid var(--fcpcyan);
    background-color: var(--fcpcyan);
}
.mceDefaultSkin .mceToolbar {
    border-bottom: 1px solid var(--fcpcyan);
}
.mceDefaultSkin .mceIframeContainer:last-child {
    border-top: 1px solid var(--fcpcyan);
}
.mceDefaultSkin .mceLayout {
    border: 1px solid var(--fcpcyan);
}
.mceModernSkin .mceListBox .mceText, .mceModernSkin .mceListBox .mceOpen {
    border-top-color: var(--fcpcyan);
    border-bottom-color: var(--fcpcyan);
    border-left-color: var(--fcpcyan);
}
.mceDefaultSkin .mceListBoxSelected::after {
    background-color: var(--fcplightcyan);
}

div#editor-xtd-buttons {
    visibility: hidden;
    height: 0px;
}
.mceModernSkin .mceButtonActive, .mceModernSkin .mceButtonSelected, .mceModernSkin .mcePanelButtonActive {
    border-color: var(--fcpcyan);
}
.mceModernSkin .mceColorPreview {
    outline: #04abdd solid 1px;
}
.mceModernSkin .mceSplitButton .mce_backcolor .mceAction, .mceModernSkin .mceSplitButton .mce_forecolor .mceAction {
    color: white;
}

.mceModernSkin .mceSplitButton:focus .mceOpen, .mceModernSkin .mceSplitButton:focus .mceText, .mceModernSkin .mceSplitButton:hover .mceOpen, .mceModernSkin .mceSplitButton:hover .mceText, .mceModernSkin .mceSplitButtonActive .mceOpen, .mceModernSkin .mceSplitButtonActive .mceText {
    border-color: var(--fcpcyan);
    background-color: var(--fcpcyan);
}
.mceModernSkinTouch .mceToolbar .mceListBox .mceOpen, .mceModernSkinTouch .mceToolbar .mceSplitButton .mceOpen {
    border-color: var(--fcpcyan);
}

.mceDefaultSkin .mceToolbarRow>button, .mceDefaultSkin .mceToolbarRow>div {
    background-color: var(--fcpcyan);
    height: 40px;
}
.mceModernSkin .mceSplitButton:focus .mceOpen, .mceModernSkin .mceSplitButton:focus .mceText, .mceModernSkin .mceSplitButton:hover .mceOpen, .mceModernSkin .mceSplitButton:hover .mceText, .mceModernSkin .mceSplitButtonActive .mceOpen, .mceModernSkin .mceSplitButtonActive .mceText {
    border-color: #ccc;
    background-color: #000000;
}
.mceModernSkin .mce_numlistButton:focus .mceOpen, .mceModernSkin .mce_numlistButton:focus .mceText, .mceModernSkin .mce_numlistButton:hover .mceOpen, .mceModernSkin .mce_numlistButton:hover .mceText, .mceModernSkin .mce_numlistButtonActive .mceOpen, .mceModernSkin .mce_numlistButtonActive .mceText {
    border-color: #ccc;
    background-color: #000000;
    color:white;
}

.mceModernSkin span.mce_numlist:focus, .mceModernSkin span.mce_source_linenumbers:focus {
    content: "\ec55";
    color: white;
}

#kunena.layout div.kavatar-lg {
    background-color: #23282b;
    text-align: center;
    border-color: #999;
}

#kunena.layout .nav-tabs li.active {
    background-color: var(--fcpcyan);
}

#kunena.layout .kheader h2, #kunena.layout .kheader h2 a, #kunena.layout .kheader h3, #kunena.layout .kheader h3 a, #kunena.layout .label-default {
    text-decoration: none;
}

@media (max-width: 579px) {
#kunena.layout #ktab ul.menu li a span {
    line-height: 150%;
    color: white!important;
}

#kunena.layout #ktab ul.menu li:nth-child(odd) a {
    background-color: var(--fcpcyan)!important;
}

#kunena.layout .kprofilebox .kprofilebox-left, #kunena.layout .kprofilebox .kprofilebox-right {
    width: 100px !important;
}

#kunena.layout tr.category-stickymsg, #kunena.layout tr.category, #kunena.layout .krow1, #kunena.layout .krow2 {
    display: inline-table;
    border-bottom: 1px solid #bfc3c6;
}
#kunena.layout tr.krow2 td {
    padding: 2px 8px!important;
}
#kunena.layout .img-circle {
    display: block;
    margin-left: auto;
    margin-right: auto;
    /* margin-bottom: 15px; */
    /* margin-top: 15px; */
}
.moderators {
    padding-bottom: 0px;
}

#kunena.layout tr.krow0 td, #kunena.layout tr.krow1 td, #kunena.layout tr.krow2 td, #kunena.layout table.kblock .kcol {
    padding: 0px;
}}

.img-circle {
    margin-top: 0.5em;
    position: relative;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 0px #fff, 0 0 0 4px #ccc, 0 0px 0px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 0 0px #fff, 0 0 0 0px #ccc, 0 0px 0px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 0 0px #fff, 0 0 0 0px #ccc, 0 0px 0px 0px rgba(0, 0, 0, 0.1);
}

.jssocials-shares {
    padding-top: 10px!important;
    padding-bottom: 15px!important;
}

.form-control {
    border: 1px solid var(--fcppurple)!important;
}
.kmsgtext-quote, .kmsgtext-hide {
    background-color: var(--fcpcyan)!important;
}
.card-body {
    background: #23282b;
}

@media (max-width: 767.98px)
{body, .body {
    font-size: 1.1em;
    letter-spacing: 0.05rem;
    line-height: 26px;
    background-color: #23282b!important;
}}

.header-mobilemenu-trigger.d-lg-none.burger-menu-button.align-self-center {
    padding-left: 10px;
}

@media (max-width: 1025px)
{
a.nav-link.item-link-alias.item-level-1 {
padding-left: .5px;
padding-right: .5px;
}

.allmode-box.allmode-list {
    /* padding-top: 0px!important; */
    margin-top: 10px;
}

h3.jdb-heading-heading {
    line-height: 1.8rem;
    padding-bottom: 10px!important;
}

div#jdb-layout-2 {
    width: 740px;
}

div#ac-1528971561366 {
    padding-right: 35px;
}

.moduletable.latestforumposts {
    background: var(--fcpdarkgrey);
    color: white;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 20px!important;
    padding-bottom: 5px!important;
    margin-left: 4px;
    margin-right: 0px;
}

.moduletable:first-child.searchmodulehomepage {
    margin-top: 0;
    padding-left: 20px;
    padding-right: 20px;
    background: var(--fcppurple);
    margin-left: 4px;
    margin-right: 0px;
}

.moduletable.loginmodulehomepage {
    background: var(--fcpcyan);
    color: white;
    padding-top: 20px!important;
    padding-bottom: 5px!important;
    margin-left: 4px;
    margin-right: 0px;
    margin-bottom: 20px!important;
    padding-left: 30px;
}

}

@media (max-width: 767.98px)

{

div#jdb-layout-2 {
width: 350px;
}


h2, .h2 {
    font-size: 1.5rem;
    letter-spacing: 0em;
    line-height: 1.7rem;
}

.moduletable:first-child.searchmodulehomepage {
    margin-top: 0;
    padding-left: 20px;
    padding-right: 20px;
    background: var(--fcppurple);
    margin-left: 36px;
    margin-right: 0px;
}

.moduletable.loginmodulehomepage {
    background: var(--fcpcyan);
    color: white;
    padding-top: 20px!important;
    padding-bottom: 5px!important;
    margin-left: 36px;
    margin-right: 0px;
    margin-bottom: 20px!important;
    padding-left: 30px;
}

.mod_ijoomlazone {
    width: 100%;
    max-width: 100%;
    overflow: hidden !important;
    
}

div#lfp-t9yvcj5k7 {
    padding-right: 43px;
}

div#ac-1528971561366
{
    padding-right: 0px;
}

h3.jdb-heading-heading {
    line-height: 2.08rem;
    padding-bottom: 10px!Important;
}

.moduletable.latestforumposts {
    background: var(--fcpdarkgrey);
    color: white;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 20px!important;
    padding-bottom: 5px!important;
    margin-left: 30px;
    margin-right: 0px;
}

}

.megamenu-container, .megamenu-container .nav-submenu .nav-submenu {
    border-top: 4px solid rgb(4 171 221 / 40%)!important;
}

.allmode-list article.allmode-item {
    padding: 8px 36px 4px 0px !important;
    padding: 14px 0px 10px;
}

.forum-ad-background {
    background-color: #23282b;
}

span.cbModuleUsernameIcon.fa.fa-user {
    padding-left: 30px!important;
}
.cb_template .fa-lock:before {
    content: "\f023";
    padding-left: 30px!important;
}


button.bpadding.button {
    margin-left: 45px;
}

a.btn.readmore-btn {
color: var(--fcplightcyan)!Important;
}

.right-column-margin-bottom {
    margin-bottom: 20px!important;
}

#lfp-89rf6l8je {
    padding-top: 0px!important;
}

#kunena.layout div.kmsg-header {
    background-color: var(--fcpdarkgrey);
    border: 1px solid var(--fcppurple);
}

.table {
    color: white!important;
}

.moduletable.usermenumodule.right-column-margin-bottom {
    padding-left: 15px;
    background-color: var(--fcppurple);
    margin-left: 36px;
    margin-right: 37px;
    padding-bottom: 20px;
}

.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: #ffffff;
    background-color: var(--fcpcyan)!important;
    border-color: #dee2e6 #dee2e6 black;
}

.nav-tabs .nav-link {
    border: 0px solid transparent!important;
}

.cb_template .navbar-light .navbar-nav .nav-link:hover, .cb_template .navbar-light .navbar-nav .nav-link:focus {
    color: var(--fcpcyan)!important;
}

/* ck editor fixes in kunena */
textarea.cke_source.cke_reset.cke_enable_context_menu.cke_editable.cke_editable_themed.cke_contents_ltr {
    color: black;
    font-size: 1rem!important;
}

/* Kunena Forum Fixes */
tr#kpost-subject {
    height: auto;
}
tr.krow1.krow1 {
    height: auto;
}
#kunena.layout .controls input[type=radio]:checked + label, #kunena.layout .kmoderate-topicicons input[type=radio]:checked + label {
    background: rgb(4 171 221) none;
}
#kunena.layout div.kmsgtext-article, #kunena.layout div.kmsgtext-quote, #kunena.layout div.kmsgtext-hide, #kunena.layout div.kmsgtext-confidential {
    border: 4px dotted var(--fcppurple)!important;
    font-size: 1.2rem!important;
}
#kunena.layout .kspoiler-wrapper {
    border: 4px dotted var(--fcppurple)!important;
    color: black;
}
#kunena.layout .kspoiler-content {
    margin: 10px 5px;
    font-size: 1.2rem!important;
}
#kunena.layout div.kmsgtext-confidential {
    color: black;
    font-size: 1.2rem!important;
}

/* Joomla Template Fixes */

input#search-searchword {
    color: white;
}

#login-form a {
    color: white;
    text-decoration: none;
}

#jdc-n300009759944418y7 {
    padding-left: 15!important;
}

#jde-b30000197599444186d {
    padding-left: 0px!important;
}

#jdc-ha001097599444187g {
    padding-left: 15px!important;
    padding-right: 15px!important;
}
#jdc-vk00209759944419na {
    padding-left: 0px!important;
}
#jdc-jz00309759944420ub {
    padding-left: 15px!important;

}
#jdc-4200409759944420yp {
    padding-left: 15px!important;
}
div#jdc-ty00509759944420wp {
    padding-right: 0px!important;
}

.allmode-box.allmode-list {
    padding-right: 0!important;
    padding-left: 0!important;
}

h3.raxo-title {
    line-height: 30px!important;
    padding-top: 10px!important;
    padding-bottom: 20px!important;
}

#Kunena div.kmsgtext-quote {
    background-color: rgba(128, 128, 128, 0.4);
    border: 1px solid #4488FF;
    color: #4488FF;
}

blockquote{
    margin: .75em 0;
    background: #000000!important;
    border: 1px solid #e0e0e0!important;
    border-left: 2px solid #e0e0e0!important;
    padding-right: 20px!important;
    padding-bottom: 15px!important;
}

.allmode-list {
    position: relative;
    margin-bottom: 24px;
    padding: 14px 0px 10px 0px!important;
    background-color: rgb(35, 40, 43);
    border-radius: 4px;
}

div#default-template-content-left-padding {
    padding-left: 30px!important;
}



/* Above from Astroid Site Version */


#maincontent > .inner
{
    padding-right: 0;
}

.tck-wrapper, .tck-relative, .tck-module{
    position: relative;
    
}


ul.menu li {
    display: inline !important;
}

#menu ul.menu li a, #menu ul.menu li span.separator, #menu ul.nav li a, #menu ul.nav li span.separator {
  display: inline;
}



h3{
  color: #04abdd;
}
.userdata
{
  background-color: black;
  text-align: center;
}

#form-login-username, #form-login-password, #form-login-remember, #form-login-submit
{
  text-align: center;
  margin: 10px;
}

/*center image when logged in*/

.cb_template img
{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.cb_template p
{
    text-align: center;
}

.right-column-login h3.tck-module-title
{
    text-align:center;
}

[type="submit"]:not(:disabled), button:not(:disabled)
{
    display: block;
    margin-left: auto;
    margin-right: auto;
}


ul
{
  list-style-type: none;
}


/*Big sur and apple silicon margin on top*/
#raxo-module-id362 {
    margin-top: 10px;
}

.raxo-link title
{
  border: solid;
  color: black !important;
  background-color: black;
}

.raxo-prime .raxo-title {
    font-size: 1.3rem;
    line-height: 1.3rem;
    margin-bottom: 0px;
    padding: 2px 14px 2px 10px;
    background-color: rgba(44,44,44,.64)!important;
}
  
#front-page-content {
    display: none!important;
}
  
 .hideme {
    display: none!important;
}

#menu a {
    font-weight: normal;
}

div#maximenuck355 ul.maximenuck
{
  position: sticky;
}

a.mainlevel
{
    color: #8383a9;
    font-weight: 300;
    text-transform: none;
    font-size: 1.1rem;
    letter-spacing: 0.05rem;
    line-height: 24px;
    font-family: Open Sans, Arial, Helvetica, sans-serif;
    text-decoration:none;
}

h2.tck-module-title, h3.tck-module-title
{
    
    text-align: left;
    font-family: Titillium Web, Arial, Helvetica, sans-serif;
    color: #04ABDD;
  	font-size: 2.5rem;
}

#columns h2.tck-module-title
{
  line-height: .2px;
  font-size: 1.7rem;
}

h3.raxo-title
{
  	font-weight: 400!important;
    text-transform: none!important;
    font-size: 1.5rem!important;
    letter-spacing: 0px!important;
    font-family: Titillium Web, Arial, Helvetica, sans-serif!important;
}

.raxo-columns a
{
  color: #04ABDD !important;
  
}

#user-stories h2.tck-module-title,#big-sur-apple-silicon h2.tck-module-title
{
  
}

#raxo-module-id322, #raxo-module-id307, #raxo-module-id308
{
  margin-top: 10px;
}

div#maximenuck355 div.floatck
{
  border: none;
}


div#maximenuck355.maximenufixed ul.maximenuck
{
  text-align:center;
}


#modlgn-username, #modlgn-passwd
{
  width: 80%;
}

body input[type="password"], body input[type="text"], body input[type="search"], #form-login-remember label, .button, #form-login-links
{
  font-size: large;
}

ul#form-login-links {
  
    padding-top: 10px;
    background-color: black;
    text-align: center;
  	margin: 0px;
  	text-decoration: none;
}

body input[type="search"]
{
    width: 100%;
    min-height: 45px;
}

#latest-forum-posts .tck-module
{
    background-color: #1c1c1c;
    max-width: 300px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.raxo-columns .raxo-top .raxo-image img, .raxo-columns
{
    box-shadow: none;
    border: none;
    border-color: transparent;
}

.raxo-pagination
{
    margin: -50px 0 2px;
}


.maximenuck img
{
    display:none;
}


.maximenufixed img
{
    display: inline-block;
   
}


.column.column2 .tck-module-text
{
    max-width: 300px;
}

.rotating_zone
{
    padding: 0px;
}
.rotating_zone img, .adg_row img
{
   min-width: 300px;
}

.raxo-columns .raxo-top .raxo-wrap {
    border-bottom: 0 solid transparent;
}

div#maximenuck355 ul.maximenuck li.maximenuck.level1 > a
{
    margin-top: 7px;
}


div#maximenuck355.maximenufixed
{
    max-width: 1500px;
}

div#maximenuck355 div.floatck
{
    padding: 0;
}

div#maximenuck355 ul.maximenuck li.maximenuck ul.maximenuck2 li > a, div#maximenuck355 ul.maximenuck2 li > a
{
    padding: 10px 20px;
}

/*For Footer Menu*/
div#maximenuck364.maximenuckh ul.maximenuck li.maximenuck.level1
{
    padding: 0;
}

div#maximenuck364 ul.maximenuck li.maximenuck.level1 > a
{
    padding: 0 15px;
}



@media only screen and (min-width: 1500px) 
{
  #wrapper {
    max-width: 1500px;
    margin: 0 auto;
  }
}

@media only screen and (max-width: 1325px)
{
    .cb_template .fa
    {
        display:none;
    }
}

/*Mobile display media rules*/
@media screen and (max-width: 1500px)
{
    .tck-container
    {
        width: 100%
    }

}

@media screen and (max-width: 767.98px)
{
    #right div.moduletable, #right .tck-module
    {
        margin-left: 0;
    }
    
    .column.column2 .tck-module-text, #latest-forum-posts .tck-module
    {
        max-width: 100%;
    }
    
    #maincontent > .inner {
    padding-right: 0px;
    padding-left: 0px;
    }
    
    #desktop-logo-right img
    {
        display: none;
    }
    
    #motion-tutorials h2, #podcasts-live-shows h2
    {
        margin-top: 15px;
    }
    
}


[data-id="maximenuck355"] .mobilemenuck-item > .level1 a, 
[data-id="maximenuck355"] .mobilemenuck-item > .level2 a
{
    text-decoration: none;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 5px;
    font-family: Open Sans, Arial, Helvetica, sans-serif;
}

[data-id="maximenuck355"] .mobilemenuck-bar-button 
{
    font-size: 60px;
}

.mobilemenuck-togglericon:after
{
    padding: 15px;
    border-left: 1px solid white;
}

[data-id="maximenuck355"] .mobilemenuck-item > .level1 a:hover,
[data-id="maximenuck355"] .mobilemenuck-item > .level2 a:hover, 
[data-id="maximenuck355"] .mobilemenuck-item > .level1 a:active
{
    background-color: #04abdd;
    color: #fff;
}

div#maximenuck355.maximenuckh ul.maximenuck, div#maximenuck355.maximenuckh ul.maximenuck li.maximenuck.level1.active
{
    
}

div#maximenuck355.maximenufixed ul.maximenuck
{
    background-color: #1a1a1a;
}

div#maximenuck355.maximenuckh ul.maximenuck li.maximenuck.level1.active
{
    background-color: transparent;
}

/* ===== J4: Smart Search (mod_finder) matched to the old mod_search box =====
   Values measured directly from the live Joomla 3 site on 4 Sep 2026:
     input  bg rgb(80,53,133)  color #fff  width 300px  height 45px
            border 0 none  radius 0  padding 5px 8px  font 18px Arial
            box-sizing border-box, so 300x45 is the whole box
            display inline-block  box-shadow none
     label  display none
     module keeps its 40px left margin, same as every other right-column module
   Joomla 4 replaced com_search with com_finder. The old box was purple because
   the template styles input[type="search"]; mod_finder emits type="text", and its
   form is .mod-finder not .search, so the label was no longer hidden either. */
.mod-finder label,
label.finder,
.searchmodulehomepage .mod-finder label {
    display: none !important;
}
.mod-finder input[type="text"],
.mod-finder .js-finder-search-query,
.searchmodulehomepage .mod-finder .form-control {
    width: 300px !important;
    max-width: 100%;
    height: 45px;
    min-height: 45px;
    background-color: var(--fcppurple) !important;
    color: #ffffff !important;
    border: 0 none !important;
    border-radius: 0 !important;
    padding: 5px 8px !important;
    margin: 0;
    box-sizing: border-box;
    font-size: 18px;
    display: inline-block;
    box-shadow: none !important;
}
.mod-finder input[type="text"]::placeholder,
.mod-finder .js-finder-search-query::placeholder {
    /* live never styled the placeholder, so it fell back to Chrome's default
       grey. Setting it explicitly keeps every browser looking like live did. */
    color: rgb(117, 117, 117);
    opacity: 1;
}
.mod-finder input[type="text"]:focus,
.mod-finder .js-finder-search-query:focus {
    outline: 0 none !important;
    box-shadow: none !important;
    border: 0 none !important;
    background-color: var(--fcppurple) !important;
    color: #ffffff !important;
}
/* Smart Search suggestion dropdown, readable on the dark theme */
.mod-finder .awesomplete > ul {
    background: var(--fcpdarkgrey);
    color: #ffffff;
}


/* ===== J4: RAXO Content Spotlight matched to the old All-mode appearance =====
   Measured against live on 6 September 2026.

   template.css, default.css and mobile.css are byte-identical between live and
   the sandbox, so nothing below is a redesign. Content Spotlight simply emits
   different markup from All-mode, so several existing template rules stopped
   matching:
     - normal-section titles are now <h4> where All-mode used <h3>
     - title text is wrapped in <span> instead of <a>
     - the Prime/Pagination 2.1 layouts ship their own type and colours
   Everything here re-points the original appearance at the new markup. */

/* Prime, top and normal. Live renders both at 24px/30px weight 400 on a dark
   band, with the visible text white. Content Spotlight was rendering the normal
   section at 18px/20.8px weight 700. */
.raxo-prime .raxo-title,
.raxo-prime .raxo-top .raxo-title,
.raxo-prime .raxo-normal .raxo-title {
    font-size: 24px;
    line-height: 30px;
    font-weight: 400;
    padding: 10px 14px 20px 10px;
    margin: 10px 0 0;
}
.raxo-prime .raxo-title span,
.raxo-prime .raxo-title a {
    font-size: 24px;
    line-height: 30px;
    font-weight: 400;
    color: #ffffff;
}

/* Pagination list items. Live: 14px/18px weight 700 Helvetica Neue, links in
   rgb(136,193,212). The 2.1 layout defaulted to 16px Arial in rgb(14,15,16),
   which is very nearly unreadable on the dark theme. */
.raxo-pagination .raxo-title {
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: rgb(43, 43, 43);
}
.raxo-pagination .raxo-title a,
.raxo-pagination .raxo-title span {
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: rgb(136, 193, 212);
}

/* Intro text: live is 14px/20px in rgb(224,224,224) with no negative margin. */
.raxo-text {
    line-height: 20px;
    color: rgb(224, 224, 224);
    margin-top: 0;
}

/* Columns titles keep live's spacing. */
.raxo-columns .raxo-title {
    margin: 10px 8px 8px;
}

/* The 2.1 pagination layout draws a dashed separator between items as a
   background gradient on the item itself, not a border. Live has none. */
.raxo-pagination article,
.raxo-pagination .raxo-item,
.raxo-pagination .raxo-item-top,
.raxo-pagination .raxo-item-nor {
    background-image: none;
}

/* Pagination block spacing, measured off live:
   module margin -50px 0 2px, items 15px vertical padding, thumb 1px padding
   with a 9.6px margin and no frame. */
.raxo-pagination {
    margin: -50px 0 2px;
}
.raxo-pagination article,
.raxo-pagination .raxo-item-nor {
    padding-top: 15px;
    padding-bottom: 15px;
}
.raxo-pagination article:first-child,
.raxo-pagination .raxo-item-nor:first-child {
    padding-top: 0;
}
.raxo-pagination .raxo-image {
    padding: 1px;
    margin: 9.6px;
    background: none;
    border: 0 none;
}

/* Intro text again, with enough specificity to beat the layout CSS. */
.raxo-prime .raxo-text,
.raxo-columns .raxo-text,
.raxo-pagination .raxo-text,
.raxo-bricks .raxo-text {
    line-height: 20px;
    color: rgb(224, 224, 224);
}

/* The 2.1 layout wins on specificity for these two, so they need forcing.
   Live pulls the pagination block up under the columns block, and its thumbs
   sit in a flex row whose negative margin cancels the thumb margin. Content
   Spotlight has no such wrapper, so the margin has to go instead or every row
   grows by ~19px. */
.raxo-content-spotlight.raxo-pagination,
.raxo-pagination {
    margin: -50px 0 2px !important;
}
.raxo-pagination .raxo-image {
    margin: 0 !important;
}

/* ===== Kunena 6 typography, matched to live's Kunena 5 =====
   Kunena 5 and Kunena 6 ship completely different templates, so the two forums
   are not structurally comparable and should not be. These rules only bring the
   type back in line with live: category titles were rendering white in Open Sans
   at 18px where live has them cyan in Titillium at 20.8px semibold.
   Scoped to .kfrontend so nothing leaks into the rest of the site. */
.kfrontend tr.category h3 a,
.kfrontend td h3 a.hasTooltip {
    font-family: "Titillium Web", Arial, Helvetica, sans-serif !important;
    font-size: 20.8px;
    line-height: 24px;
    font-weight: 600;
    /* the site's own .hasTooltip rule forces white !important, and Kunena 6
       adds that class to category links where Kunena 5 did not, so live is
       unaffected and this needs to outrank it. */
    color: rgb(4, 171, 221) !important;
}
.kfrontend h1.card-header {
    font-weight: 700;
    line-height: 40.8px;
}

/* Kunena 6 ships Bootstrap 5 defaults that assume a light theme. On this dark
   template they produce three visible faults that live does not have:
     1. a white navbar strip (bg-light) carrying white links, so the
        Index / Recent Topics / Search links were invisible
     2. light grey table borders reading as white lines around the categories
     3. category descriptions in pure black
   All scoped to .kfrontend so nothing else on the site is affected. */
#kunena .navbar,
#kunena .navbar.bg-light,
#kunena .navbar-light {
    background-color: transparent !important;
    border: 0 none;
}
#kunena .navbar .nav-link,
#kunena .navbar .navbar-brand {
    color: #ffffff;
}
#kunena .navbar .nav-link:hover,
#kunena .navbar .nav-link:focus {
    color: rgb(4, 171, 221);
}

/* Kunena 6's navbar rendered as a white Bootstrap strip carrying white links,
   so the Index / Recent Topics / Search tabs were invisible. Live styles them
   as coloured tabs; these are live's exact measured values:
     active   background rgb(4,171,221), inactive rgb(80,53,133)
     white text, 16px weight 400, padding 5px 10px, radius 12px 12px 0 0
     list items spaced 2px 2px 0 0 */
#kunena .navbar .navbar-nav .nav-item {
    margin: 2px 2px 0 0;
}
#kunena .navbar .navbar-nav .nav-link {
    background-color: rgb(80, 53, 133);
    color: #ffffff;
    font-size: 16px;
    font-weight: 400;
    padding: 5px 10px;
    border-radius: 12px 12px 0 0;
}
#kunena .navbar .navbar-nav .nav-item.active > .nav-link,
#kunena .navbar .navbar-nav .nav-item.current > .nav-link,
#kunena .navbar .navbar-nav .nav-link.active,
#kunena .navbar .navbar-nav .nav-link[aria-current] {
    background-color: rgb(4, 171, 221);
    color: #ffffff;
}
#kunena .navbar .navbar-nav .nav-link:hover {
    background-color: rgb(4, 171, 221);
    color: #ffffff;
}

/* Bootstrap's .border and .shadow-lg utility classes on the Kunena navbar use
   !important, so they need outranking. Live has neither a border nor a shadow
   around the tab strip. */
#kunena .navbar.border,
#kunena nav.navbar {
    border: 0 none !important;
    box-shadow: none !important;
}

/* ===== Kunena 6 on a dark template: Bootstrap 5 light-theme defaults =====
   Kunena 6 leans on Bootstrap 5 utility classes (.border, .shadow-lg, .bg-faded,
   .bg-light) which all assume a light background. On this dark template that
   produces a white outline around every panel and black body text. Rather than
   chase each element, fix it at the root and let inheritance carry it.
   Everything is scoped to #kunena, so the rest of the site is untouched. */

/* 1. No light utility borders or shadows anywhere in the forum. Live has none. */
#kunena .border,
#kunena .kfrontend,
#kunena [class*="shadow"] {
    border: 0 none !important;
    box-shadow: none !important;
}
/* Anything that still draws a border does it subtly, not in Bootstrap grey. */
#kunena table,
#kunena td,
#kunena th,
#kunena tr {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* 2. Readable text. #kunena sets the colour once and the descendants inherit it,
      which overrides Bootstrap's black without naming every element. Anchors are
      deliberately excluded so link colours keep working. */
#kunena {
    color: #ffffff;
}
#kunena div,
#kunena p,
#kunena span,
#kunena td,
#kunena th,
#kunena li,
#kunena dt,
#kunena dd,
#kunena small {
    color: inherit;
}

/* ==========================================================================
   RAXO list layout - match the live site
   --------------------------------------------------------------------------
   Live runs All-mode PRO, whose classes are named .allmode-*. Its successor,
   Content Spotlight, renames them .raxo-*, so every .allmode-list rule further
   up this file matches nothing and the vendor's light default theme shows
   through: a grey rounded box, a white inner panel, small bold blue titles,
   grey body text and row separators.

   Rather than fight each rule, point the vendor's own palette variables at the
   site's dark colours, then restore the few values the palette does not cover.
   Everything is scoped to .raxo-list so the prime and columns layouts, which
   were matched separately, are untouched.

   Note on specificity: the vendor stylesheet uses CSS nesting, so its rules
   compile to .raxo-list .raxo-title (0,2,0) and .raxo-list .raxo-wrap > div
   (0,2,1). The selectors below meet or beat those; a plain > * does not.
   ========================================================================== */

.raxo-list {
    --raxo-theme-color: rgb(136, 193, 212);
    --raxo-gray-100: rgb(35, 40, 43);   /* items panel      */
    --raxo-gray-120: transparent;       /* item hover       */
    --raxo-gray-200: rgb(35, 40, 43);   /* module block     */
    --raxo-text-base: #ffffff;
    --raxo-text-muted: #ffffff;
    --raxo-text-light: #737373;         /* read-more arrow  */
    --raxo-border-top: transparent;     /* live has no row  */
    --raxo-border-bot: transparent;     /* separators       */

    padding: 14px 0 10px;
    margin: 0 0 10px;
    border-radius: 4px;
    line-height: 24px;
}

.raxo-list .raxo-body { overflow: visible; }

.raxo-list article,
.raxo-list article.raxo-item-top {
    padding: 8px 36px 4px 0;
    border: 0 none;
}

/* The vendor fakes a flex gap with -6px on the wrap and +6px on each child.
   Live has no gap: the text column carries a 20px right padding instead. */
.raxo-list .raxo-wrap { margin: 0; }
.raxo-list .raxo-wrap > div { margin: 0; }
.raxo-list .raxo-wrap > div.raxo-image { margin: 0 -4px 0 0; }
.raxo-list .raxo-right { padding-right: 20px; }

.raxo-list .raxo-title,
.raxo-list .raxo-item-top .raxo-title {
    margin: 0 0 5px;
    font: 400 30px/32px "Titillium Web", Arial, Helvetica, sans-serif;
}
.raxo-list .raxo-title a {
    color: rgb(136, 193, 212);
    font: inherit;
}

.raxo-list .raxo-text {
    margin: 0;
    font-size: 14.4px;
    line-height: 24px;
    color: #ffffff;
}

.raxo-list .raxo-image img {
    margin: 0 0 4px 4px;
    border-radius: 3px;
}

/* Live's read-more is a two-state sprite, not the new module's SVG chevron.
   The sprite is inlined because mod_raxo_allmode no longer exists to serve it. */
.raxo-list .raxo-readmore svg { display: none; }
.raxo-list .raxo-readmore {
    width: 32px;
    background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAALCAQAAABl/0P6AAAAhklEQVR4AaXSsQ2EMBBE0ZWpgOi4tnBRFOAL6WFacgUcEnLg6FMBEvJMA/9ptfE0JVWtMTwSlTWcqahbhB/dImhRcwh8aS5hExZhA4ugWX+HwMzpEnYhdGkaJOwAXEyjFziEuvLwBQ6gk70fyMYPWPmPmpVfaEY+QsXJR1C8fFK18on6Jn8DiGp9eY482VAAAAAASUVORK5CYII=") no-repeat 0 50%;
    background-size: 64px 11px;
}
.raxo-list article:hover .raxo-readmore {
    background-color: transparent;
    background-position: -32px 50%;
}

/* Live swaps to a 3x sprite on high-density displays, so match that too or the
   arrow is visibly softer than live on a retina screen. Same 64px 11px box. */
@media
    only screen and (-webkit-min-device-pixel-ratio: 1.3),
    only screen and (min-device-pixel-ratio: 1.3),
    only screen and (min-resolution: 120dpi)
{
    .raxo-list .raxo-readmore {
        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAAAhCAQAAAAlzWyrAAABV0lEQVR4Ae3bIQ7CQBSE4fYAGICEWrD4es4FprIOgxvDBcADnoBgr4EjARBN2J8DbCUhmaTTC5D5stmm75H9Nqr00F7DzDRUPNjj+vs1UBRCV08CBkQArqYEynUSvgTknMCbYC6sCebgTnA0JziaE6hUdCagJLoT7IQ1wQ6sCTTTx5mAGR93go2wJtiANYGmapwJmNK4E6yFNcEarAlU6O1MQMHbnaAW1gQ1WBOor7szAX3u7gRLkTzBiGBJmmBEoJ5uLQRn5SYAPW6kOZP7EKxEyzPOTMKKtoy9T8DF/ARcbE6AFq13wCgzCQvSBEbOb0HB6y3I+wqunepPQ+1df6GXdf0Fr7R+529Bwe1bkHf9EzXW9U9ojOtP5gHBfB4QGDpPxIL5RCz4zQK2Sf1WYetdf6loXX9JtKy/2wvqNuO6zbhuN/R36bajPaNKTx2s/x/w5PDP+r+ktsICTisxrQAAAABJRU5ErkJggg==");
    }
}

/* ==========================================================================
   RAXO prime layout - caption geometry
   --------------------------------------------------------------------------
   All-mode PRO wrapped the caption in a block .raxo-content inside a
   .raxo-overlay. Content Spotlight drops the overlay and makes .raxo-content
   an absolutely positioned column flexbox with align-items: flex-start, so
   the caption shrinks to its text instead of spanning the card. That is why
   the translucent bar was narrower than live and long titles wrapped early.
   Live insets the caption by 32px on the large items and 20px on the small
   ones, both measured off the running site.
   ========================================================================== */

.raxo-prime article { background-color: transparent; }
.raxo-prime article .raxo-content { align-items: stretch; }
.raxo-prime .raxo-top article .raxo-content { padding: 20px 16px 16px 32px; }
.raxo-prime .raxo-normal article .raxo-content { padding: 20px 16px 16px 20px; }
.raxo-prime .raxo-title::after { height: 3px; }

/* Live lays every item out in ONE flex container, so a lone final item sits
   double-width and fills the row. Content Spotlight splits them into two separate
   CSS grids, .raxo-top and .raxo-normal, so an odd last item sits alone in a single
   column and leaves a gap. Stretch it across both columns to match live.
   :last-child:nth-child(odd) fires only when the count is odd, which is exactly when
   the last item would otherwise be alone. Modules with an even count are untouched. */
.nor-lg-col2 .raxo-normal > article:last-child:nth-child(odd) { grid-column: 1 / -1; }

/* Columns layout, top item. Live has no .raxo-content wrapper here, the title sits
   directly under the image. Content Spotlight adds one with 24px top padding and
   17.875px sides, and puts a 5px light lavender border with a 5px radius around the
   image, which is its light-theme default. Together those push the title 39px below
   the image where live has 10px, and draw a frame live does not have.
   Verified against live: image 358x201, title top 211, title width 342. */
.raxo-columns .raxo-item-top .raxo-image { border: 0 none; border-radius: 0; }
.raxo-columns .raxo-item-top .raxo-content { padding: 0; }

/* Live gives the columns top item margin: 16px 0. Content Spotlight gives it none, so
   the section heading above sits tight against the picture. Live also has padding 0 14px
   on this item, which is deliberately NOT copied: live's article is 386 wide inside a 358
   column and overflows, whereas ours is 358, so adding side padding would shrink the image
   to 330. The image is 358 on both without it. */
.raxo-columns .raxo-item-top { margin: 16px 0; }

/* ==========================================================================
   Kunena Discuss article comments
   --------------------------------------------------------------------------
   The Joomla 4 rewrite of plg_content_kunenadiscuss ships NO CSS at all. Live
   loads plugins/content/kunenadiscuss/css/discuss.css and discussb2.css, and
   neither file exists in the new version, which has the namespaced src/ tmpl/
   layout instead. On top of that Bootstrap 5 renamed .panel to .card, so live
   styling for .panel and .panel-heading no longer matches anything either.
   Result: comments render as flat unstyled text.
   All values below measured off live. */

.kunenadiscuss .card {
    background-color: rgb(28, 28, 28);
    border: 1px solid rgb(4, 171, 221);
    border-radius: 4px;
    padding: 0 2px;
    margin: 0 0 20px;
}
.kunenadiscuss .card-header {
    background-color: rgb(4, 171, 221);
    color: #ffffff;
    border-radius: 3px 3px 0 0;
    padding: 10px 15px;
}
.kunenadiscuss .card-body {
    background-color: transparent;
    padding: 15px;
}
/* Live rounds avatars with Bootstrap 2 .img-circle, which Bootstrap 5 dropped. */
.kunenadiscuss .avatar img {
    border-radius: 50%;
    margin-top: 8.8px;
}
/* Vendor default paints this light grey on a dark page. */
.kunenadiscuss .kdiscuss-topic {
    background-color: transparent;
    color: rgb(17, 118, 166);
    padding: 0;
}

/* "Discuss this article" bar. The new plugin wraps the text in an <h3>, which picks
   up the site cyan heading colour and lands cyan on the cyan bar, invisible. Live has
   no inner heading, just white 14px text with 5px padding. Same failure as the Kunena
   navbar tabs, white on white. */
.kunenadiscuss .kdiscuss-title { padding: 5px; font-size: 14px; }
.kunenadiscuss .kdiscuss-title h1,
.kunenadiscuss .kdiscuss-title h2,
.kunenadiscuss .kdiscuss-title h3,
.kunenadiscuss .kdiscuss-title h4 {
    color: #ffffff;
    font-size: 14px;
    line-height: 24px;
    margin: 0;
    padding: 0;
}

/* ==========================================================================
   ochBlog article info block, the author byline at the head and foot of articles
   --------------------------------------------------------------------------
   ochBlog 3.0.5 made this container a flex row, avatar left and details right,
   where live stacks them full width. It also shrank the text and turned the
   badges into pills. And it RAISED ITS OWN SPECIFICITY: the vendor now sets
   .ochblog-articleinfo-container .articleinfo div.writtenby (0,2,1), so the
   site rule that matched .writtenby (0,2,0) silently stopped winning and the
   text dropped from 90% to 75%. Hence div.writtenby below, not .writtenby.
   All values measured off live: container 1103x187, byline 18.72px, plain badges.
   ========================================================================== */

.ochblog-articleinfo-container { display: block; margin: 0; }
.ochblog-articleinfo-container .authorinfo { width: 100%; margin: 0; }
.ochblog-articleinfo-container .articleinfo { width: 100%; }
div.ochblog-articleinfo-container .articleinfo div.writtenby,
div.ochblog-articleinfo-container .articleinfo div.category { font-size: 90%; }
/* Live shows these as plain text, not pills. */
.ochblog-articleinfo-container .label {
    display: inline;
    font-size: 17.6px;
    line-height: 24px;
    padding: 0;
    margin: 0;
    background-color: transparent;
}

/* Author bio at the foot of the article. Same ochBlog 3.0.5 flex change as the
   byline block above: live stacks avatar over details, both full width. */
.ochblog-authorinfo-container { display: block; margin: 0; }
.ochblog-authorinfo-container .authorinfo { width: 100%; margin: 0; }
.ochblog-authorinfo-container .authorabout { width: 100%; }
.ochblog-authorinfo-container .label {
    display: inline;
    font-size: 17.6px;
    line-height: 24px;
    padding: 0;
    margin: 0;
    background-color: transparent;
}

/* Live: title margin 10px 0 40px, button padding 12px 15px. Without these the
   "Log in to comment" button sits tight under the bar and is 10px shorter. */
.kunenadiscuss .kdiscuss-title { margin: 10px 0 40px; }
.kunenadiscuss .klogin-to-discuss { padding: 12px 15px; }

/* Prime layout: the vendor sets min-height 192px on every item. A normal item is
   273px wide and its thumbnail is generated 16:9 (524x295), so its natural height is
   154px, exactly what live renders. The 192px floor overrides that and object-fit:cover
   then crops the picture, making User Stories and Mobile Creator 79px taller than live.
   Modules whose thumbnails are naturally taller than 192px, such as Big Sur at 204px,
   are unaffected either way.
   NOTE: the module image settings and the generated files are both CORRECT (524x295).
   This is purely the CSS floor. Do not go changing thumbnail sizes. */
.raxo-prime .raxo-normal > article { min-height: 0; }

/* ==========================================================================
   Kunena 6 forum: left-edge alignment and light-grey leaks
   --------------------------------------------------------------------------
   Both faults come from the TEMPLATE's own Joomla 3 era rules meeting Kunena 6
   markup. Neither is a Kunena bug.

   1. ALIGNMENT. template.css and default.css set  ul, ol { margin-left: 35px }
      meant for bulleted lists in articles. Kunena 6 builds its nav, breadcrumbs,
      pagination and attachment thumbnails as lists, so all inherited a prose
      indent and nothing lined up. Bulleted lists inside posts carry no class and
      are deliberately untouched.

   2. LIGHT GREY. template.css sets  .btn { background: #e8e8e8 }  and Kunena 6
      puts .btn on things that are not visually buttons, notably the post title
      bar and the "More" toggle, so they rendered light grey with white text.

   SPECIFICITY: the post header needs  #kunena.layout .mykmsg-header  (id PLUS
   class) because Kunena's own rule uses that. A plain #kunena .mykmsg-header
   loses. Same trap as ochBlog div.writtenby.
   All values measured against live, 7 September 2026.
   ========================================================================== */

#kunena .navbar-nav,
#kunena .nav,
#kunena .list-inline,
#kunena .list-unstyled,
#kunena .inline,
#kunena .thumbnails,
#kunena .pagination,
#kunena .dropdown-menu { margin-left: 0; }

#kunena .breadcrumb { margin-left: 16px; }
#kunena .navbar .container-fluid { padding-left: 16px; }

#kunena .heading { background-color: transparent; color: #ffffff; }

#kunena .page-link {
    background-color: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, .15);
}

#kunena .badge.bg-secondary { background-color: transparent !important; color: #ffffff; }

#kunena.layout .mykmsg-header { background-color: transparent; }

/* The first card in a RAXO module sits in .raxo-item-top and inherits 16px,
   while every other card in the same module is 14px. Live renders every teaser
   at 14px. Scoped to .raxo-item-top so the In-Depth Tutorials module, which is
   legitimately 14.4px on both sites, is left alone. */
.raxo-item-top .raxo-text {
    font-size: 14px;
}

/* ------------------------------------------------------------------
   RAXO Content Spotlight 2.1 spacing, matched back to the old
   All-mode PRO layout. 9 September 2026.

   Content Spotlight adds margin-bottom:32px to every .raxo-prime
   module, which drew a visible #23282b band between the story rows.
   The original All-mode raxo-prime.css (19,030 bytes, preserved at
   /home/fcp/removed-from-sandbox-20260904/allmode-layouts-from-live/)
   sets no module margin at all and uses a 2px gutter:
   "Default Gutter 2px (1px on each side of a item)".
   ------------------------------------------------------------------ */
.raxo-content-spotlight.raxo-prime {
    margin-bottom: 0;
}

.raxo-content-spotlight.raxo-prime .raxo-top,
.raxo-content-spotlight.raxo-prime .raxo-nor {
    gap: 2px;
}

/* ------------------------------------------------------------------
   Left edge alignment. 9 September 2026.

   template.css gives the content column 30px of left padding via
   .inner.clearfix, but sets no padding on #menu > .inner, so the main
   navigation sat 15px left of everything below it. The Kunena tab
   strip and breadcrumb are already flush at the 30px content edge.

   SWEEP-2026-09-07 records the intended result: the tab strip and
   breadcrumb "sit flush at 30, level with the site navigation".
   This brings the navigation onto that same 30px edge.
   ------------------------------------------------------------------ */
#menu > .inner {
    padding-left: 15px;
}

/* ------------------------------------------------------------------
   Blog listing article separation. 9 September 2026.

   .tck-article carries no bottom margin or padding, so on a category
   blog the "Read more ..." link of one story sat flush against the
   next story's full width image, with a measured gap of 0px.

   Not a regression: the sandbox measured 0px too. This is a
   deliberate improvement requested by Peter.
   ------------------------------------------------------------------ */
.tck-blog .tck-article {
    margin-bottom: 30px;
}

/* ------------------------------------------------------------------
   Kunena category search box. 9 September 2026.

   Two Bootstrap 2 to 5 faults on the forum category pages:

   1. The magnifier button dropped BELOW the field. The input was
      254.5px inside a 254.5px .input-group, and Bootstrap 5 sets
      flex-wrap: wrap, so the 38px button had nowhere to sit.
   2. The "Search" placeholder was Bootstrap 5's default
      rgba(33,37,41,.75), near black on the near black rgb(28,28,28)
      field, so it could not be read at all.

   Present on the sandbox too, so it predates the migration and was
   simply never looked at.
   ------------------------------------------------------------------ */
#kunena .input-group {
    flex-wrap: nowrap;
}

#kunena .input-group > .form-control {
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
}

#kunena .form-control::placeholder {
    color: #999999;
    opacity: 1;
}

/* ------------------------------------------------------------------
   Forum announcement close button, and login box colour.
   9 September 2026, both requested by Peter.

   1. Kunena's pinned announcement carries a Bootstrap 5 .btn-close,
      drawn as a dark SVG which reads as a small black cross against
      the dark panel. Hidden. Note this also removes the ability to
      dismiss the announcement, which is the intent.

   2. The login box was flat black, painted by fieldset.userdata and
      #form-login-links, not by the module wrapper which is
      transparent. Moved to --darkteal #175747, an established site
      colour already used about ten times as a background, so the
      right column no longer reads as purple over black.
   ------------------------------------------------------------------ */
#kunena .alert .btn-close {
    display: none;
}

.right-column-login fieldset.userdata,
.right-column-login #form-login-links {
    background-color: var(--darkteal);
}
