@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Charm:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');
h1 {
    font-size:1.75em;
    margin-block:0.67em;
}
a {
    font-weight:bold;
    font-size:large;
}
/*Gwobal stywes; genewal site ~aesthwetics~ */
body {
    background-color:#000;
    color:#dfdfdf;
    font-family:"Public Sans";
    font-weight:bold;
    margin:0%;
}
a.active {
    background-color:#00407f
}


/*Navbar stywing*/
nav {
    padding:0.5% 0.5% 0 0.5%;
    position:sticky;
    top:0px;
    background-color:#00000070;
}
.nav-items {
    display:flex;
    width:100%;
    text-align:left;
    padding-bottom:0.5%;
    border-bottom:1px solid #505050;
    .branding {
        padding:0.3% 2% 0 2%;
        .logo {
            content:url(w3-logo.png);
            display:inline-block;width:120px;height:40px;
        };
    };
    .nav-links {
        margin-left:auto;
        width:20%;
        display:flex;
        .nav-link {
            width:calc(99%/3);
            display:grid;
            place-items:center;
            a {
                padding:15% 15% 15% 15%;
                text-align:center;
                text-decoration:none;
                line-height:100%;
                color:#dfdfdf;
            };
            a:hover {
                transition:0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
                background-color: #0080ff;
                color: #fff;
            };
        };
    };
}
/*Navbar dwopdowns*/

#drop-products {
    z-index: 1;
    width:10%;
    position:relative;
    display:none;
}
#drop-services {
    z-index: 1;
    width:10%;
    position:relative;
    display:none;
}
/*Main content stywing (dogshit)*/
.main {
    padding: 0 15%;
    h1:first-child {
        font-size:72px;
        margin-block-end:0.2em;
    };
    p {
    line-height:30px;
    };
}
.code {
    font-family: "Roboto Mono"
}
.censored {
    font-family:"Charm";color:#00000025;
    padding:0 5px 0 5px;
    vertical-align:middle;
    background-image:linear-gradient(#000,#00000000,#00000000,#00000000,#000),linear-gradient(90deg,#000,#00000000,#00000000,#00000000,#000), linear-gradient(0.3rad, #ff2020, #ffdd00, #ff8000, #ff2020);
}
.string {
    font-family:"Roboto Mono";
    padding: 0 5px 0 5px;
}
.string:before {
    content: "⌜";
}
.string:after {
    content:"⌟";
}
.redacted {
    background-color:#ffffff05;
}
/*Fowoter wayout and stywing (doodoo)*/
.footer {
    font-size:initial;
    position:relative;
    top:75em;
    padding: 0 5% 0.5% 5%;
    background-size:auto;
    .footer-container {
        width:100%;
        display:flex;
        .footer-column {
            text-align:left;
            margin-left:auto;
            width:12.5%;
            h3 {
                line-height:0.5%;
                font-size:revert;
            }
            ul {
                padding:0 0 0 15px;
                list-style:none;
                line-height:normal;
            }
            a {
                font-size:small;
                font-weight:bold;
                text-decoration:none;
                color:#fff;
            }
            a:hover {
                transition:0.2s cubic-bezier(0.215, 0.610, 0.355, 1);
                color:#0080ff;
            }
        }
        .footer-column:first-child {
            margin-left:0;
        }
        #contact {
            width:17.5%;
            a.nlink:hover {
                color:#fff;
            }
        }
        .footer-placeholder {
            width:40%;
        }
        .footer-image {
            width:10%;
            margin-left:auto;
            background-image:url(moai-footer-2.png);
            background-size: contain;
            background-repeat: no-repeat;
        }
    }
    h5 {
        text-align:right;
        font-size:revert;
    }
}
.sub {
    color:#505050;
    font-size:revert;
}
