/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/


/*******BODY & PAGES******/

body p, p, li { line-height: 1.5!important; font-size: 20px!important; }

h1, h2, h3, h4, h5, h6 { color: #000!important; line-height: 1.3!important; font-weight: 700!important; letter-spacing: -1px!important;  }


#heading h1 { font-size: 10px!important; line-height: 1.3!important; text-transform: uppercase; letter-spacing: 1px!important; opacity: 0.3!important; font-weight: normal!important; margin-bottom: 20px!important;  }
#heading span.larger { font-size: 62px!important; line-height: 1!important; font-weight: 700!important; color: #000!important; letter-spacing: -1px!important; display: block!important; margin-bottom: 5px!important;  }



#learnmore .colortool, #heading .colortool { max-width: 700px!important; margin: 0px auto!important; }
#learnmore h2 { font-size: 28px!important; margin-top: 20px!important; font-weight: 500!important; }
#learnmore h3 { font-size: 24px!important; margin-top: 20px!important; font-weight: 500!important; }
#learnmore p, #learnmore li { line-height: 1.5!important; font-size: 18px!important; }

#learnmore section#faqs h2 { text-align: center!important; margin-bottom: 20px!important; }
#learnmore section#faqs strong { color: #000!important; font-size: 20px!important; font-weight: 600!important;   }

.twentytwenty-wrapper { padding: 0px 0px!important; border-radius: 0.6rem!important; margin-bottom: 50px!important; }

.nectar-button { font-size: 19px!important; line-height: 1.1!important; }

span.coded {
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background: -webkit-gradient(linear, left top, right top, from(#f1e2ff), to(#dcf5ff));
    background: linear-gradient(to right, #f1e2ff, #dcf5ff);
    font-size: 90%; color: #000!important;
    overflow-wrap: break-word;
    word-wrap: break-word;
    padding: .1rem .3rem .2rem;
    border-radius: .3rem;
}

img.samples { aspect-ratio: 16/9; object-fit: cover!important; margin: 0!important; border-radius: 0.6rem!important; }



/******TABS*******/

.tabbed[data-style=minimal]>ul li:not(.cta-button) .active-tab, .tabbed[data-style=minimal]>ul li:not(.cta-button) a, .tabbed[data-style=minimal_alt]>ul li:not(.cta-button) .active-tab, .tabbed[data-style=minimal_alt]>ul li:not(.cta-button) a { padding: 0px 10px!important; font-size: 15px!important; color: #000!important;  }
.tabbed li { font-size: 18px!important; line-height: 1.4!important; }
.tabbed[data-style=minimal] .wpb_tabs_nav { margin-bottom: 12px!important; border:none!important; }



/*******COLOR TOOL******/

.color-identifier-tool {border: 3px dashed #ccc; padding: 2rem; border-radius: 1rem; margin-bottom: 2rem!important;}
.color-identifier-upload-wrapper {text-align: center; margin-bottom: 1em;}
.color-identifier-instructions {font-size: 1.1em; margin-bottom: 0.5em;}
.color-identifier-upload-button {display: inline-block; background: #3452ff; color: #fff; padding: 0.6em 1.2em; border-radius: 4px; cursor: pointer;}
.color-identifier-upload-button:hover {background: #2b44d4;}
.color-identifier-note {font-size: 12px!important; color: #999; margin-top: 0.5em; line-height: 1.2!important;}
.color-identifier-spinner {text-align: center; margin-top: 1em; font-weight: bold;}
.color-identifier-columns {display: flex; flex-wrap: wrap; gap: 0px; align-items: stretch; background: #1a1b26!important; border-radius: 1rem!important; padding: 1rem!important; border: 1px solid #9aa5ce!important;  }
.color-identifier-columns > div {flex: 1 1 48%; min-width: 250px; display: flex; flex-direction: column; height: auto;}
.color-identifier-image {flex: 1 1 auto; display: flex; flex-direction: column; justify-content: space-between;}
.color-identifier-image img {flex: 0 0 auto; height: 344px!important; object-fit: cover!important; width: 100%; border-radius: 0.6rem!important; }
.color-identifier-swatches {display: flex; flex-wrap: wrap; gap: 5px; margin-top: 0.5em; flex: 0 0 auto;}
.color-identifier-swatches div {width: 35px; height: 35px; border-radius: 50%; margin-right: -10px!important; border: 1px solid rgba(25,255,255,0.1)!important; }
.color-identifier-json {flex: 1 1 auto; display: flex; flex-direction: column; height: 400px;}
.color-identifier-json pre {flex: 1 1 auto; background: #f5f5f5; padding: 10px; overflow: auto; margin: 0;}
.color-identifier-json pre::-webkit-scrollbar {width: 8px;}
.color-identifier-json pre::-webkit-scrollbar-thumb {background-color: #00aeef; border-radius: 4px;}
.color-identifier-json pre::-webkit-scrollbar-track {background: #e0e0e0;}
.color-identifier-json pre {scrollbar-width: thin; scrollbar-color: #9aa5ce #e0e0e0;}
.color-identifier-result {background: #111; border-radius: 1rem; padding: 2rem;}
.color-identifier-json pre, .color-identifier-json pre.prettyprinted { padding: 3% 4%!important; overflow: auto!important; margin: 0; flex: 1 1 auto; height: 400px!important; white-space: pre; word-wrap: normal!important; overflow-wrap: normal!important; border-radius: 0!important; }


#coloridentifierexamples .color-identifier-swatches div { height: 20px; width: 20px; border: none!important; margin-left: 0px!important; opacity: 0; animation: fadeIn 0.1s forwards; }
#coloridentifierexamples .color-identifier-swatches div:nth-child(1) { animation-delay: 1.4s; }
#coloridentifierexamples .color-identifier-swatches div:nth-child(2) { animation-delay: 1.5s; }
#coloridentifierexamples .color-identifier-swatches div:nth-child(3) { animation-delay: 1.6s; }
#coloridentifierexamples .color-identifier-swatches div:nth-child(4) { animation-delay: 1.7s; }
#coloridentifierexamples .color-identifier-swatches div:nth-child(5) { animation-delay: 1.8s; }
#coloridentifierexamples .color-identifier-swatches div:nth-child(6) { animation-delay: 1.9s; }
#coloridentifierexamples .color-identifier-swatches div:nth-child(7) { animation-delay: 2s; }
#coloridentifierexamples .color-identifier-swatches div:nth-child(n+8) { display: none!important; }
@keyframes fadeIn { to { opacity: 1; } }



/*******PRE CODE*********/


pre, pre.prettyprinted {
    background-color: #1a1b26!important;
    color: #9aa5ce !important;
    padding: 5% 3% !important;
    border-radius: 0.9rem !important;
    overflow: auto !important;
    position: relative !important;
    font-family: monospace!important;
    font-weight: inherit !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    white-space: pre-wrap;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: none;
}

pre.grey { background-color: #f6f6f6!important; }

pre span, pre.prettyprinted span, pre p, pre.prettyprinted p, pre li, pre.prettyprinted li { font-size: 14px!important; font-family: 'courier',monospace!important; }


pre.prettyprinted .linenums { padding-right: 10px !important;  }
pre.prettyprinted .linenums li { list-style-type: decimal !important; padding-left: 30px!important;  counter-increment: line-number!important; vertical-align: middle!important;    }

pre.prettyprinted .linenums li::marker { color: #4a575c!important; text-align: left!important; font-family: monospace!important; font-size: 12px!important; content: counter(line-number)!important; line-height: 1.7!important;   }
.prettyprinted .kwd { color: #a26cdd !important; }
.prettyprinted .lit { color: #f78c6c!important; }
.prettyprinted .pln { color: #a6accd!important; }
.prettyprinted .str { color: #9aa5ce!important; }
.prettyprinted .com { color: #7dcfff!important; }
.prettyprinted .typ { color: #57d1b7 !important; }
.prettyprinted .fun { color: #82aaff!important; }
.prettyprinted .pun { color: #89ddff!important; }
.prettyprinted .tag { color: #c3e88d!important; }
.prettyprinted .atn { color: #ffcb6b!important; }
.prettyprinted .atv { color: #ecc48d!important; }

pre.grey .kwd { color: #c792ea !important; }
pre.grey .lit { color: #e06c75 !important; }
pre.grey .pln { color: #111111 !important; }
pre.grey .str { color: #444b5d !important; }
pre.grey .com { color: #c792ea !important; }
pre.grey .typ { color: #57d1b7 !important; }
pre.grey .fun { color: #9d7cd8 !important; }
pre.grey .pun { color: #89ddff !important; }
pre.grey .tag { color: #c3e88d !important; }
pre.grey .atn { color: #ffcb6b !important; }
pre.grey .atv { color: #d29f62 !important; }



#intro pre.prettyprinted { border: 2px solid #151515!important; }
li.L1, li.L3, li.L5, li.L7, li.L9 { background: none!important;  }

span.codespan { -webkit-box-decoration-break: clone;  box-decoration-break: clone;  background: #f1f1f1; border: 1px solid #ccc;  overflow-wrap: break-word;  word-wrap: break-word;  padding: .1rem .3rem .2rem;  border-radius: .2rem;  overflow-wrap: break-word; word-wrap: break-word; word-break: break-word; hyphens: auto!important; }
