body{
    --defaultColor: white;
}

span.cmdCode{
    width: 800px;
    color: white;
    display: flex;
    justify-content: left;
    align-items: center;
    padding: 10px;
    font-family: "consolas", "courier new", monospace;
    background-color: black;
}

pre.code{
    width: 80%;
    padding: 0;
    margin: 10px auto;
    left: 0;
    display: flex;
}

p.codeHighlighter{
    width: 100%;
    padding: 10px;
    color: white;
    background-color: black;
    font-family: 'Consolas', 'Courier New', monospace;
    overflow-x: scroll;
}

span.comilla{
    color: orange
}

span.llave{
    color:aqua;
}

span.parentesis{
    font-weight: bold;
    color: #80007a;
}

span.boolean{
    color: rgb(135, 135, 175);
}

span.conditional{
    color: pink;
}

span.print{
    color: yellow;
}

span.function{
    color: rgb(102, 204, 245);
}

span.default{
    color: var(--defaultColor);
}

span.cppInclude{
    color: rgb(13, 104, 104);
}

span.cppConditional{
    color: rgb(134, 12, 12);
}

span.variable{
    color: rgb(28, 234, 241);
}

span.method{
    color:rgb(211, 119, 13)
}
@media screen and (max-width:600px){
    span.cmdCode{
        width: 90%;
    }

    pre.code{
        width: 100%;
    }

    pre.code p{
        width: 100%;
        overflow-x: scroll;
    }
}