@font-face {
    font-family: "BrainyfontOne";
    src: url("../fonts/BrainyfontOne-Regular.otf");
    font-display: swap;
}
:root {
    --greenbt: #00d67a;
    --cyanbt: #0e7cd0;
    --bluebt: #2020d8;
    --purplebt: #6612d5;
    --magentabt: #d100d1;
    --darkbluebt: #000015;
    --lightbluebt: #FAFAFF;
    --mtogbt: linear-gradient(135deg, var(--magentabt) 5%, var(--purplebt) 25%, var(--bluebt) 45%, var(--bluebt) 55%, var(--cyanbt) 75%, var(--greenbt) 95%);
}
body,
.ssfont {
    font-family: Verdana, sans-serif;
}
.btfont {
    font-family: 'BrainyfontOne', monospace;
	text-transform: uppercase;
    font-size: 1.1em;
}
.fstitle {
	font-size: 2.65rem !important;
}
a,
a:hover,
a:focus,
a:visited,
a:active,
a.active,
.btn,
.nav-link,
.navbar-toggler,
button,
.card {
    transition:
        color .5s ease,
        background-color .5s ease,
        background-position .5s ease,
        box-shadow .5s ease,
        transform .5s ease;
    text-decoration: none;
}
input,
.form-control,
.form-select {
    transition:
        border-color .5s ease,
        box-shadow .5s ease;
}
svg {
    transition:
        transform .5s ease,
        opacity .5s ease;
}
#btheader,
#btnav {
    transition:
        border-radius .5s ease,
        background-color .5s ease,
        box-shadow .5s ease;
}
.boxshad {
    box-shadow: 0 0.25rem 0.5rem #00001599;
}
.bgmtog {
    background-image: var(--mtogbt);
    background-size: 100%;
    background-position: 50% 50%;
}
.textblue {
    color: var(--bluebt);
}
.textgreen {
    color: var(--greenbt);
}
.textmagenta {
    color: var(--magentabt);
}
.textcyan {
    color: var(--cyanbt);
}
.textpurple {
    color: var(--purplebt);
}
.textdarkblue {
    color: var(--darkbluebt);
}
.textlightblue {
    color: var(--lightbluebt);
}
.bgblue {
    background-color: var(--bluebt);
    color: var(--lightbluebt);
}
.bggreen {
    background-color: var(--greenbt);
    color: var(--darkbluebt);
}
.bgmagenta {
    background-color: var(--magentabt);
    color: var(--darkbluebt);
}
.bgcyan {
    background-color: var(--cyanbt);
    color: var(--darkbluebt);
}
.bgpurple {
    background-color: var(--purplebt);
    color: var(--lightbluebt);
}
.bgdarkblue {
    background-color: var(--darkbluebt);
    color: var(--lightbluebt);
}
.bglightblue {
    background-color: var(--lightbluebt);
    color: var(--darkbluebt);
}
.bgmtop {
    background-image: linear-gradient(135deg, var(--magentabt) 5%, var(--purplebt) 95%);
    color: var(--lightbluebt) !important;
}
.bgptom {
    background-image: linear-gradient(135deg, var(--purplebt) 5%, var(--magentabt) 95%);
    color: var(--lightbluebt) !important;
}
.bgptob {
    background-image: linear-gradient(135deg, var(--purplebt) 5%, var(--bluebt) 95%);
    color: var(--lightbluebt) !important;
}
.bgbtop {
    background-image: linear-gradient(135deg, var(--bluebt) 5%, var(--purplebt) 95%);
    color: var(--lightbluebt) !important;
}
.bgmtob {
    background-image: linear-gradient(135deg, var(--magentabt) 5%, var(--purplebt) 40%, var(--purplebt) 60%, var(--bluebt) 95%);
    color: var(--lightbluebt) !important;
}
.bgbtom {
    background-image: linear-gradient(135deg, var(--bluebt) 5%, var(--purplebt) 40%, var(--purplebt) 60%, var(--magentabt) 95%);
    color: var(--lightbluebt) !important;
}
.bgptoc {
    background-image: linear-gradient(135deg, var(--purplebt) 5%, var(--bluebt) 40%, var(--bluebt) 60%, var(--cyanbt) 95%);
    color: var(--lightbluebt) !important;
}
.bgctop {
    background-image: linear-gradient(135deg, var(--cyanbt) 5%, var(--bluebt) 40%, var(--bluebt) 60%, var(--purplebt) 95%);
    color: var(--lightbluebt) !important;
}
.bgbtoc {
    background-image: linear-gradient(135deg, var(--bluebt) 5%, var(--cyanbt) 95%);
    color: var(--lightbluebt) !important;
}
.bgctob {
    background-image: linear-gradient(135deg, var(--cyanbt) 5%, var(--bluebt) 95%);
    color: var(--lightbluebt) !important;
}
.bgctog {
    background-image: linear-gradient(135deg, var(--cyanbt) 5%, var(--greenbt) 95%);
    color: var(--lightbluebt) !important;
}
.bggtoc {
    background-image: linear-gradient(135deg, var(--greenbt) 5%, var(--cyanbt) 95%);
    color: var(--lightbluebt) !important;
}
.bgbtog {
    background-image: linear-gradient(135deg, var(--bluebt) 5%, var(--cyanbt) 40%, var(--cyanbt) 60%, var(--greenbt) 95%);
    color: var(--lightbluebt) !important;
}
.bggtob {
    background-image: linear-gradient(135deg, var(--greenbt) 5%, var(--cyanbt) 40%, var(--cyanbt) 60%, var(--bluebt) 95%);
    color: var(--lightbluebt) !important;
}
.bglbtob {
    background-image: linear-gradient(135deg, var(--lightbluebt) 30%, var(--bluebt) 95%);
    color: var(--darkbluebt) !important;
}
.bgbtolb {
    background-image: linear-gradient(135deg, var(--bluebt) 5%, var(--lightbluebt) 70%);
    color: var(--darkbluebt) !important;
}
.bgdbtob {
    background-image: linear-gradient(135deg, var(--darkbluebt) 30%, var(--bluebt) 95%);
    color: var(--lightbluebt) !important;
}
.bgbtodb {
    background-image: linear-gradient(135deg, var(--bluebt) 5%, var(--darkbluebt) 70%);
    color: var(--lightbluebt) !important;
}
.borderblue {
    border-color: var(--bluebt) !important;
}
.bordergreen {
    border-color: var(--greenbt) !important;
}
.bordermagenta {
    border-color: var(--magentabt) !important;
}
.bordercyan {
    border-color: var(--cyanbt) !important;
}
.borderpurple {
    border-color: var(--purplebt) !important;
}
.borderlightblue {
    border-color: var(--lightbluebt) !important;
}
.borderdarkblue {
    border-color: var(--darkbluebt) !important;
}
.grayscale-hover {
    filter: grayscale(100%);
    transition: filter 0.5s ease;
}
.grayscale-hover:hover {
    filter: grayscale(0%);
}
.btn {
    background-size: 180%;
    background-position: 0% 0%;
    box-shadow: 0 0.25rem 0.5rem #00001599, inset 0 0 0 #00001599;
    text-shadow: 2px 2px 2px var(--darkbluebt);
}
.btn.bgcenter {
    background-position: 50% 50%;
}
.btn.bginverse {
    background-position: 100% 100%;
}
.btn:hover {
    background-position: 100% 100%;
    box-shadow: 0 0 0 #00001599, inset 0 0.25rem 0.5rem #00001599;
}
.btn.bgcenter:hover {
    background-size: 100%;
}
.btn.bginverse:hover {
    background-position: 0% 0%;
}
.bgbtodb.accordion-item .accordion-button {
    background-size: 200%;
    transition: background-position 0.5s;
    background-position: 0% 0%;
    background-image: linear-gradient(135deg, var(--darkbluebt) 5%, var(--bluebt) 40%, var(--bluebt) 60%, var(--darkbluebt) 95%);
    color: var(--lightbluebt) !important;
}
.bglightblue.accordion-item .accordion-button {
    background: var(--lightbluebt);
    color: var(--bluebt) !important;
}
.bgbtodb.accordion-item .accordion-button:not(.collapsed) {
    background-position: 100% 100%;
}
.bgbtodb.accordion-item .accordion-button::after {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fafaff' stroke-linecap='round' stroke-linejoin='round'><path d='m2 5 6 6 6-6'/></svg>");
}
.bglightblue.accordion-item .accordion-button::after {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%232020D8' stroke-linecap='round' stroke-linejoin='round'><path d='m2 5 6 6 6-6'/></svg>");
}
.bgbtodb.accordion-item .accordion-button,
.bgbtodb.accordion-item .accordion-button:focus {
    box-shadow: 0 0.25rem 0.5rem #FAFAFF99;
}
.bglightblue.accordion-item .accordion-button,
.bglightblue.accordion-item .accordion-button:focus {
    box-shadow: 0 0.25rem 0.5rem #00001599;
}
.collapselink::after {
    width: 1.25rem;
    height: 1.25rem;
    margin-left: 0.5rem;
    content: "";
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' stroke-width='2' fill='none' stroke='%23fafaff99' stroke-linecap='round' stroke-linejoin='round'><path d='m2 5 6 6 6-6'/></svg>");
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform 0.25s ease-in-out;
}
.collapselink:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' stroke-width='2' fill='none' stroke='%23fafaff' stroke-linecap='round' stroke-linejoin='round'><path d='m2 5 6 6 6-6'/></svg>");
    transform: rotate(-180deg);
    display: block;
}
.form-control,
.form-select {
    border-color: var(--bluebt);
}
.form-control:focus,
.form-select:focus {
    border-color: var(--cyanbt);
    box-shadow: 0 0.25rem 0.5rem #0e7cd099;
}
#toggler,
#toggler:focus{
    box-shadow: none;
    border: none;
}
.ham {
    -webkit-tap-highlight-color: transparent;
    transition: transform 500ms;
}
#btnav.active #toggler .hamRotate {
    transform: rotate(45deg);
}
.line {
    fill:none;
    transition: stroke-dasharray 500ms, stroke-dashoffset 500ms, transform 500ms;
    stroke: var(--lightbluebt);
    stroke-width:6px;
    stroke-linecap:round;
    stroke-dasharray: 80 160;
    transform-origin: 50%;
}
#btnav.active #toggler .ham .top,
#btnav.active #toggler .ham .bottom {
    stroke-dashoffset: -108px;
}
#btnav.active #toggler .ham .middle {
    transform: rotate(90deg);
}
#menu a.nav-link {
    white-space: nowrap;
}
#btnav a.nav-link,
a.footer-link {
    color: #FAFAFF99;
}
footer a.nav-link,
#ecodesign a.nav-link,
.breadcrumb .breadcrumb-item a,
#contactform a {
    color: var(--bluebt);
}
.breadcrumb .breadcrumb-item.active,
.breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: var(--cyanbt);
}
#btnav a.nav-link:focus,
#btnav a.nav-link:hover,
#btnav a.nav-link.active,
a.footer-link:hover,
a.footer-link:focus {
    color: var(--lightbluebt);
}
footer a.nav-link:focus,
footer a.nav-link:hover,
#ecodesign a.nav-link:focus,
#ecodesign a.nav-link:hover,
.breadcrumb .breadcrumb-item a:hover,
.breadcrumb .breadcrumb-item a:focus,
#contactform a:hover,
#contactform a:focus {
    color: var(--cyanbt);
}
.bttitle {
    font-size: 2rem;
}
.btsubtitle {
    font-size: 0.772rem;
}
.text-justify {
    text-align: justify;
}
.bt-pill {
    background: linear-gradient(135deg, #FAFAFF33 5%, #FAFAFF00 95%);
    border: 1.25px solid #FAFAFF;
    font-size: .75rem;
    display: inline-block;
    font-weight: 600;
    letter-spacing: .05rem;
    text-transform: uppercase;
    color: var(--lightbluebt);
}
.bt-pill-inverse {
    background: linear-gradient(135deg, #2020D833 5%, #2020D800 95%);
    border: 1.25px solid #2020D8;
    color: var(--darkbluebt);
}
.bt-pill-primary {
    background: linear-gradient(135deg, #00d67a 5%, #FAFAFF 95%);
    border: 1.25px solid #2020D8;
    color: var(--darkbluebt);
}
.card.bgdbtob .bt-pill-primary,
.card.bgbtodb .bt-pill-primary {
    border: 1.5px solid #FAFAFF;
}
.btbrand:hover,
.navbar-toggler:hover,
.js [data-reveal].col.reveal-in:hover,
.nav-link:hover,
.btn:hover:not(.reveal-in),
.js a[data-reveal].reveal-in:hover,
.js [data-reveal].reveal-in .card:hover,
.js [data-reveal].accordion-item.reveal-in:hover{
    transform: translateY(-0.25rem);
}
.waves-top,
.waves-bottom {
    display: block;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    transform: translateX(-2px) translateY(-2px);
}
.zi-2 {
    z-index: 2;
}
.zi-3 {
    z-index: 3;
}
.c {
    fill: url(#b);
}
.f {
    fill: url(#e);
}
svg.svg-shadow {
    -webkit-filter: drop-shadow(2px 2px 2px var(--darkbluebt));
    filter: drop-shadow(2px 2px 2px var(--darkbluebt));
}