
html, body {
    background: #282828;
    color: #dcdcdc;
}

.header {
    background-color: #303030;
    box-shadow: 15px 5px 20px 10px rgb(19 19 19 / 83%);
}

.footer {
    background: #202020;
}

.active {
    color: #ffffff;
}

.nav__link {
    color: #bbbbbb;
}

.lightmode {
    display: none
}
    
.fas, .fa-solid {
    color: #bdbdbd;
}
    
@media screen and (min-width: 1023px) {
    .nav__link {
         color: #ececec;
    }
    
    .dropdown__menu {
        background: #303030;
    }
}

@media screen and (max-width: 1023px) {
    .nav {
        background-color: #303030;
        }
}

.section2 {
    border-top: 1px solid #373737;
    background: #2e2d2d;
}

.icontext {
    color: #bdbdbd;
}

.toolgroup {
    background: #302f2f;
    border: 1px solid #474646;
}


.col.span_1_of_3.sticky {
    border: 1px solid #4d4b4b;
}

.single-feature {
    box-shadow: 5px 5px 10px 2px #1a1a1ac2;
}

#faq ul li {
    box-shadow: 0 3px 10px -2px rgb(0 0 0 / 42%);
}










/* Jodit Text Editor */


.jodit-toolbar__box:not(:empty) {
    background-color: #525252;
    border-bottom: 1px solid #000000;
}

.jodit-icon {
    stroke: #ababab;
}

.jodit-icon {
    fill: #ffffff;
}

svg {
    fill: white;
}

.jodit-toolbar-button__button:hover:not([disabled]) {
    background-color: #3b3a3a;
}

.jodit-ui-group_separated_true:not(:last-child):not(.jodit-ui-group_before-spacer_true):after {
    border-right: 1px solid #6c6c6c;
}

.jodit-container:not(.jodit_inline) {
    border: 1px solid #565656;
}

.jodit-status-bar {
    background-color: #4b4b4b;
    color: rgb(245 245 245 / 75%);
}

.jodit-workplace+.jodit-status-bar:not(:empty) {
    border-top: 1px solid #616161;
}

.jodit-toolbar-editor-collection_mode_horizontal:after {
    background-color: #5f5f5f;
}

.jodit-popup__content {
    background: #6d6b6b;
}

.jodit-toolbar-button__button {
    color: rgb(255 255 255);
}

.jodit-dialog__panel {
    background-color: #424242;
}

.jodit-drag-and-drop__file-box:hover {
    background-color: #5a5a5a;
}

.jodit-toolbar-button__trigger:hover:not([disabled]) {
    background-color: #6d6b6b;
}


/* Avatar Generator */


.svga-no-touch.svga-boys .svga-bodyzones:hover, .svga-boys .svga-bodyzones.svga-active, .svga-no-touch.svga-boys .svga-blocks:hover, .svga-boys .svga-blocks.svga-active, .svga-no-touch.svga-girls .svga-bodyzones:hover, .svga-girls .svga-bodyzones.svga-active, .svga-no-touch.svga-girls .svga-blocks:hover, .svga-girls .svga-blocks.svga-active{
    color: #DDD;
}

.svga-light .svga-elements {
    background-color: #666;
}

#svga-container.svga-light, .svga-light .svga-glob-controls, .svga-light .svga-col-left .sp-replacer, .svga-light #svga-footermenu ul li ul li, .svga-light #svga-start-overlay, .svga-light #svga-gender, .svga-light #svga-dialog, .svga-light #svga-gravatar, .svga-light #svga-message, .svga-light #svga-gravatar-message, .svga-light #svga-ios, .svga-light #svga-share-block {
    background-color: #282828;
}

.svga-light .svga-colors-set > div, .svga-light .svga-elements {
    border-color: #111;
}

img.smallmyicon {
    filter:opacity(0.3) invert(1);
}

.svga-active img.smallmyicon, .svga-bodyzones:hover img {
    filter: invert(44%) sepia(41%) saturate(2323%) hue-rotate(14deg) brightness(100%) contrast(95%);
}

svg.svga-control-icon {
    filter: invert(77%) sepia(11%) saturate(9773%) hue-rotate(38deg) brightness(159%) contrast(88%);
}

.svga-col-left {
    background: #666;
}

#svga-container.svga-boys, #svga-container.svga-girls {
    border-color: #444;
}

.svga-light #svga-dialog-ok, .svga-light #svga-dialog-cancel, .svga-light #svga-gravatar-ok, .svga-light #svga-gravatar-cancel, .svga-light .svga-close {
    border-color: #ecf0f1;
    background: #ea8a00;
    color: #fff;
    font-weight: 900;
}

#svga-container.svga-light, #svga-container.svga-light .svga-nosvg, .svga-light .svga-input {
    color: #ececec;
}

.svga-no-touch.svga-light .svga-blocks:hover,  .svga-no-touch.svga-dark .svga-blocks:hover {
    background: none;
}

.svga-light .svga-blocks.svga-active, .svga-light .svga-blocks.svga-active:hover, .svga-dark .svga-blocks.svga-active, .svga-dark .svga-blocks.svga-active:hover
{
    background: #666 !important;
}


.svga-no-touch.svga-light .svga-glob-controls:hover, .svga-no-touch.svga-light #svga-footermenu ul li:hover {
    background-color: #666 !important;
}

.svga-light #svga-bodyzones {
    background-color: #666666;
}

#svga-container.svga-light, .svga-light .svga-row.row-glob-controls, .svga-light .svga-glob-controls, .svga-light .svga-glob-controls:last-child, .svga-light .svga-row.row-colors, .svga-light .svga-row.row-svgcanvas, .svga-light .svga-row.row-controls, .svga-light .svga-controls, .svga-light .svga-row.row-elements, .svga-light .svga-row.row-bodyzones, .svga-light .svga-blocks, .svga-light #svga-footermenu, .svga-light #svga-footermenu ul li, .svga-light #svga-footermenu ul li ul li, .svga-light .svga-blocks:first-child {
    border-color: #4c4c4c;
}

.svga-no-touch.svga-boys .svga-elements:hover, .svga-no-touch.svga-boys .svga-colors-set > div:hover, .svga-boys .svga-colors-set > div.svga-active, .svga-boys .svga-elements.svga-active-element {
    border-color: #ff8820;
}

svg.svga-menu-icon {
    filter: invert(1) brightness(3.5);
}

.svga-no-touch.svga-light .svga-controls:hover {
    background-color: #535252;
}

div#svga-start-overlay {
    background: url(/tools/avatar-generator/myicons/collage.JPG) #000 !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    filter: opacity(1) !important;
}

div#svga-gender {
    background-color: #b65818 !important;
    color: #fff;
    box-shadow: 0px 0px 45px 35px #272626;
}

.svga-light .svga-icon-boy, .svga-light .svga-icon-girl {
    fill: #fff;
}

#svga-start-boys:hover .svga-icon-boy {
    fill: #7ed3ff;
}

#svga-start-girls:hover .svga-icon-girl {
    fill: #f493f4;
}

#svga-loader {
    font-size: 20px;
    font-color: #fff;
    height: fit-content;
    width: 240px;
    background-color: #b65818 !important ;
    box-shadow: 0px 0px 45px 35px #272626;
    text-align: center;
    padding: 20px 10px 40px 10px !important;
}



/* IP Lookup */


div#map_canvas {
    filter: grayscale(10%) invert(92%) brightness(120%);
}

.posty {
    background: #111;
}

.posty .postytext {
    color: #cfcfcf;
}


.mycol.myspan_2_of_3 {
    background: #074f69;
    border: 1px solid #504f4f;
}

.mycol.myspan_1_of_3 {
    border: 1px solid #5e5757;
    background: #333;
}

fieldset {
    background: transparent;
}

input[type="text"] {
    background: #565656;
    border: 1px solid #858585;
    color: #fff;
}

::placeholder { 
  color: #b7b7b7;
  opacity: 1; 
}

table.darkTable {
    filter: invert(0.9);
}



/* RSS to HTML */


iframe#live-example {
    filter: invert(0.83);
}

h1 {
    color: #DDD;
}

input[type="text"], textarea {
    border: 1px solid #717171;
    background: #333;
    color: #bdbaba;
}


.form-control {
    background-color: #333;
    color: #9b9b9b;
}




/* Photo Editor */




.ri-xl {
    color: #fff;
}
       
       
.layout .sidebar .menu .menu-item a {
    color: #ffffff;
}
       
.sidebar {
    background-color: #262626;
}

.lighto{
    display: none;
}

editor-controls .button-with-image .button-overlay {
    color: #1f6dc9;
}

.mat-fab.mat-accent, .mat-flat-button.mat-accent, .mat-mini-fab.mat-accent, .mat-raised-button.mat-accent {
    background-color: #1d84fa;
}

.layout.fixed-sidebar .sidebar {
    border-right: 1px solid #262626;
}

.be-dark-mode .canvas-wrapper {
    background-color: #343333;
}

editor-controls {
    background-color: #262626;
    
}

pixie-editor .cdk-overlay-backdrop {
    background-color: rgb(255 255 255 / 20%);
}

#svga-container.svga-boys, #svga-container.svga-girls, pixie-editor {
    box-shadow: 0 0 30px #000000;
}




/* Imapsync */

#account1, #account2 {
    border: 1px solid #000000;
    box-shadow: 0 0 20px 6px #00000078;
}


pre {
    background-color: black;
    color: lime;
    box-shadow: 0 0 20px 5px #535353;
}

.input-group-addon {
    color: #fff;
    background-color: #504d4d;
    border: 1px solid #919090;
}

.form-control {
    border: 1px solid #676767;
}



/* TinyMCE 5 Text Editor */

.tox-tinymce {
    border: 1px solid #343434;
    box-shadow: 0 0 15px 15px #000000eb;
}

.tox .tox-menubar {
    background: unset;
    background-color: #333232;
}

.tox .tox-toolbar, .tox .tox-toolbar__overflow, .tox .tox-toolbar__primary {
    background: unset;
    background-color: #595959;
}
    
.tox .tox-menubar + .tox-toolbar, .tox .tox-menubar + .tox-toolbar-overlord .tox-toolbar__primary {
    border-top: 0px solid #363636;
}

.tox .tox-mbtn {
    color: #f7f7f7;
    }
    
.tox .tox-tbtn svg {
    fill: #e1e1e1;
}

.tox .tox-tbtn {
    color: #e4e4e4;
    }
    
.tox .tox-tbtn--disabled svg, .tox .tox-tbtn--disabled:hover svg, .tox .tox-tbtn:disabled svg, .tox .tox-tbtn:disabled:hover svg {
    fill: rgb(251 251 251 / 42%);
}

.tox:not([dir="rtl"]) .tox-toolbar__group:not(:last-of-type) {
    border-right: 1px solid #373737;
}

.tox .tox-pop__dialog {
    background-color: #656565;
}

.tox .tox-tbtn--enabled, .tox .tox-tbtn--enabled:hover {
    background: #898b8b;
    color: #222f3e;
}

button.tox-tbtn.tox-tbtn--enabled svg {
    fill: #000;
}

.popup {
    background: #111;
    box-shadow: 0 0 15px 15px #dddddd70;
}

.popup h2 {
    color: #fff;
}

iframe body#tinymce {
    background: #606060 !important;
    color: white !important;
}





/* Image Base64 Encoder */

form#img2b64 {
    border-top: 1px solid #454040;
}

#base64, .theimg {
    background: #000;
}


/* QR Generator */

.nav-pills > li > a span{
    color: #fff;
}

a.nav-link.active span {
    color: #f1f1f1;
    font-weight: bold;
}


.accordion {
    --bs-accordion-color: #f8f8f8;
    --bs-accordion-bg: #282828;
}

.accordion .btn {
    color: #f8f8f8;
    border: 0px solid #575757;
    box-shadow: 3px 3px 5px 1px #1e1e1e;
}

.accordion .btn:hover {
    color: #fff;
    border: 0px solid #fdfdfd;
}

.btn-check:active + .btn, .btn-check:checked + .btn {
    background-color: #6c6c6c;
    border-color: #b8b8b8;
}

.form-control:focus {
    color: #ffffff;
    background-color: #484848;
    border-color: #000000;
}

.form-select {
    color: #f1f1f1;
    background-color: #3c3c3c;
    border: 1px solid #6e6e6e;
}

.placeresult {
    background-color: #333 !important;
}

placeresult .linksholder .btn {
    font-size: 2.5rem;
    background: #212121;
}

.preloader {
    background: #434343;
}