/* =====================================================================================================
// Project      : CoinMachine platform
// Context      : blockchain/cryptocurrency education and consulting, IT developement
// File         : web3toolbox.css
// Role         : web3toolbox.php special CSS stylesheet
// Author       : CoinMachine
// Creation     : 2023-06-14
// Last update  : 2021-07-16
// ===================================================================================================== */
/* 
    lightblue   : #1491ff
    darblue     : #141bff
    violet      : #8214ff
    turquoise   : #14fff8
    lightgreen  : #14ff82
    orange      : #ff8214
    anis        : #91ff14
    rose        : #fe14ff
*/
/* *** *** *** CONTAINERS *** *** *** */
#index-intro-cm {
    margin: 30px auto;
}
#arborescence{
    display: none;
    font-family: "Share Tech Mono", monospace;
    background-clip: text;
    -moz-background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(45deg, #06c883, #ebef7b);
}
#see-map {
    opacity: 0.95;
    margin-bottom: 5px;
    border: none;
    border-radius: 25px;
    background-color: #000;
    color: #06c883;
    font-family: "Share Tech Mono", monospace;
    font-size: 1.1em;
    text-align: right;
    cursor: pointer;
}#see-map:hover {
    background-color: #06c883;
    color: #000;
}
#see-map span {
    margin-left: 5px;
}
#index-news {
    overflow: hidden;
}
/* *** *** *** NEWS BAR *** *** *** */
.index-news-marquee {
    margin: 0 auto;
    padding: 0;
    padding-bottom: 5px;
    text-align: center;
    font-family: "Aldrich", sans-serif;
    font-size: 1.1em;
    letter-spacing: 0.1em;
    overflow: hidden;
}
.index-news-marquee li, .index-news-marquee li a {
    background-clip: text;
    -moz-background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    text-decoration: none;
}
.index-news-marquee li a {
    background-image: linear-gradient(45deg, #06c883, #ebef7b);
    animation: blink-me 5s infinite;
}
.index-news-marquee li a i {
    margin-left: 6px;
    font-size: 0.9em;
    color: #06acc8;
}
.index-news-marquee li:hover, .index-news-marquee li a:hover {
    background-image: linear-gradient(45deg, #8306c8, #06acc8);
}
.breaking-news {
    display: flex;
    align-items: center;
    padding: 0;
    overflow: hidden;
    font-family: "Share Tech Mono", monospace;
    font-size: 1em;
    font-weight: 600;
    font-variant: small-caps;
    color: #4c5d6e;
}
.breaking-news span {
    white-space: nowrap;
    animation: slide-left 20s linear infinite;
}
.breaking-news span:after {
    content: "BREAKING NEWS - BREAKING NEWS - BREAKING NEWS - BREAKING NEWS - BREAKING NEWS - BREAKING NEWS - BREAKING NEWS - BREAKING NEWS - BREAKING NEWS - BREAKING NEWS - ";
}
.index-news-date {
    font-family: "Share Tech Mono", monospace;
    font-size: 0.9em;
    color: #06acc8;
}
/* *** *** *** TOP 10 PRICES *** *** *** */
#topten-prices, .topten-scroller {
    height: 1.2em;
    line-height: 1.2em;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    color: #4c5d6e;
    align-self: center;
    justify-content: center;
}
#topten-prices > span {
    position: absolute;
    top: 0;
    width: 100%;
    animation: slide-topten 10s infinite;
    color: #4c5d6e;
    text-align: center;
    justify-content: center;
}
@keyframes slide-topten {
    0% {
      top: 0;
    }
    10% {
      top: 0;
    }
    20% {
      top: 0em;
    }
    30% {
      top: 0em;
    }
    40% {
        top: -1.2em;
    }
    50% {
        top: -1.2em;
    }
    60% {
        top: -1.2em;
    }
    70% {
        top: -1.2em;
    }
    80% {
        top: -1.2em;
    }
    90% {
        top: 0em;
    }
}
/* *** *** *** TITRAGES *** *** *** */
#index-title {
    opacity: 0.95;
    margin: 10px auto;
    padding: 0;
    font-family: "AudioWide", sans-serif;
    font-size: 2.5rem;
    font-weight: 700;
    text-align: center;
    background-clip: text;
    -moz-background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(45deg, #ebef7b, #06c883);
}
#index-intro-cm .row h2 {
    opacity: 0.95;
    font-family: "Frijole", cursive;
    font-size: 1.5rem;
    background-clip: text;
    -moz-background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(45deg, #06c883, #ebef7b);
}
#index-intro-cm .row h2 a {
    background-clip: text;
    -moz-background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(45deg, #ebef7b, #06c883);
    text-decoration: none;
    transition: all 0.3s ease-in-out;
    animation: blink-me 4s infinite;
}
#index-intro-cm .row h2 a:hover {
    color: #ebef7b;
}
/* *** *** *** USER CLASSES *** *** *** */
#index-intro p {
    opacity: 0.95;
    margin: 10px auto;
    padding: 0 100px;
    font-family: "Aldrich", sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
    background-clip: text;
    -moz-background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(90deg, #06c883, #ebef7b);
}
#index-intro-cm-text .row p,
.intro-cm-fulltext, .intro-cm-contact {
    font-family: "Aldrich", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    text-align: justify;
    background-clip: text;
    -moz-background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
#index-intro-cm-text .row p {
    margin: 5px auto;
    padding: 0 40px;
    font-size: 1.2em;
    text-align: justify;
    background-image: linear-gradient(90deg, #ebef7b, #06c883);
}
.intro-cm-fulltext {
    opacity: 0.95;
    margin: 10px auto;
    padding: 0 40px;
    font-size: 1em;
    text-align: justify;
    text-indent: 20px;
    background-image: linear-gradient(90deg, #06c883, #ebef7b);
}
.intro-cm-shorttext {
    opacity: 0.95;
}
.intro-cm-contact {
    opacity: 0.95;
    margin: 0px auto;
    margin-bottom: 20px;
    padding: 0 40px;
    font-size: 1.1em;
    text-align: center;
    background-image: linear-gradient(90deg, #ebef7b, #06c883);
}
#index-intro-cm div img {
    opacity: 0.95;
}
/* *** *** *** WEBSITE TREE MAP *** *** *** */
#arborescence a {
    color: #ebef7b;
}
#arborescence a:hover {
    color: #06acc8;
}
/* *** *** *** DISCLAIMER *** *** *** */
:root {
    --colour1: #f1c40f;
    --colour2: #2c3e50;
    --speed: 4s;
  }
.disclaimer-warning {
    margin: 10px auto;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.warning-bar {
    width: 90%;
    min-height: 40px;
    max-height: 60px;
    border-radius: 10px;
    box-shadow: 0px 10px 13px -6px rgba(44, 62, 80, 1);
    background-color: var(--colour2);
    background-image: repeating-linear-gradient(
        45deg,
        transparent,
        transparent 40px,
        var(--colour1) 40px,
        var(--colour1) 80px
    );
    animation: slide var(--speed) linear infinite;
    will-change: background-position;
}
#disclaimer-main {
    margin: 10px auto;
    padding: 0;
}
.disclaimer-title {
    margin: 0 auto;
    padding: 5px 10px;
    display: block;
    justify-content: center;
    align-items: center;
    align-self: center;
    font-family: "Share Tech Mono", monospace;
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
    color: darkred;
    animation: fade-out-in 4s infinite;
}
#disclaimer-main .row span {
    color: darkred;
    font-size: 2em;
    vertical-align: middle;
    text-align: center;
    animation: fade-in-out 3s infinite;
}
#disclaimer-content {
    margin: 0 auto;
    padding: 5px 10px;
    display: block;
    justify-content: center;
    align-items: center;
    align-self: center;
    font-family: "Share Tech Mono", monospace;
    font-size: 1rem;
    font-weight: 500;
    text-align: justify;
    color: #38618a;
}
#disclaimer-content ul li {
    margin-left: 60px;
}
/* *** *** *** ANIMATIONS *** *** *** */
@keyframes fade-out-in {
    0% {
      opacity: 1;
    }
    50% {
      opacity: 0.95;
    }
    100% {
      opacity: 1;
    }
}
@keyframes fade-in-out {
    0% {
      opacity: 0.95;
    }
    50% {
      opacity: 1;
    }
    100% {
      opacity: 0.95;
    }
}
@keyframes slide {
    from {
      background-position-x: 0;
    }
    to {
      background-position-x: 113px;
    }
}
@keyframes blink-me {
    0% {
        background-image: linear-gradient(45deg, #ebef7b, #06c883);
    }
    50% {
        background-image: linear-gradient(45deg, #06c883, #ebef7b);
    }
    100% {
        background-image: linear-gradient(45deg, #ebef7b, #06c883);
    }
}
@keyframes slide-left {
    from {
      -webkit-transform: translateX(0);
              transform: translateX(0);
    }
    to {
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
    }
}
/* *** *** *** MEDIA QUERIES *** *** *** */
@media screen and (max-width: 1350px) {
    #index-intro-cm-text .row p {
        font-size: 1em;
    }
}
@media screen and (max-width: 1200px) {
    #index-intro-cm-text .row p,
    .intro-cm-fulltext, .intro-cm-contact {
        font-size: 0.9em;
    }
}
@media screen and (max-width: 992px) {
    #index-title {
        font-size: 2rem;
    }
    #index-intro-cm-text .row p,
    .intro-cm-fulltext, .intro-cm-contact {
        font-size: 0.7em;
    }
}
@media screen and (max-width: 768px) {
    #index-title {
        font-size: 1.5rem;
    }
    #index-intro-cm-text .row p,
    .intro-cm-fulltext, .intro-cm-contact {
        font-size: 0.6em;
    }
}
@media screen and (max-width: 576px) {
    #index-title {
        font-size: 1.2rem;
    }
    #index-intro-cm .row h2 {
        font-size: 1rem;
    }
    #index-intro-cm-text .row p,
    .intro-cm-fulltext, .intro-cm-contact {
        font-size: 0.5em;
    }
        #index-intro-cm .row img {
        display: none;
    }
}
@media screen and (max-width: 480px) {
    .index-news-marquee {
        font-size: 0.6em;
    }
    .index-news-marquee li a i {
        font-size: 0.6em;
    }
    #index-title {
        font-size: 1rem;
    }
    #index-intro p {
        font-size: 0.55em;
        padding: 0 5px;
    }
    #index-intro-cm-text .row p,
    .intro-cm-fulltext, .intro-cm-contact {
        font-size: 0.5em;
    }
    #index-intro-cm .row img {
        display: none;
    }
    .disclaimer-warning {
        margin: 5px auto;
        max-height: 20px;
    }
    .disclaimer-title {
        font-size: 1em;
      }
      #disclaimer-content {
        font-size: 0.3em;
      }
    #see-map {
        font-size: 0.5em;
    }
    #arborescence{
        font-size: 0.3em;
    }
}
@media screen and (max-width: 360px) {
    hr {
        margin: 5px auto;
        padding: 0;
    }
    #index-news {
        margin: 2px auto;
        padding-top: 0;
        padding-bottom: 0;
    }
    .breaking-news {
        font-size: 0.5em;
    }
    .index-news-marquee {
        font-size: 0.5em;
        font-weight: 600;
    }
    #index-title {
        font-size: 0.8rem;
    }
    #index-intro p {
        font-size: 0.55em;
        padding: 0 5px;
    }
    #index-intro-cm .row h2 {
        font-size: 0.8rem;
    }
    #index-intro-cm .row img {
        display: none;
    }
    #index-intro-cm-text .row p, .intro-cm-shorttext,
    .intro-cm-fulltext, .intro-cm-contact {
        font-size: 0.5em;
    }
    #see-map {
        font-size: 0.3em;
    }
    #arborescence{
        font-size: 0.2em;
    }
}