/* 
Description: Cursor is a simple, clean and responsive theme for your terminal.
Author: @Poltanek
Version: 1.0
Tags: terminal, theme, clean, simple, responsive, minimal
Text Domain: cursor 
*/

.root {
    --text-colour: rgb(232, 238, 233);
    --command-colour: lightgreen;
    --command-shadow-colour: green;
    --cursor-colour: #77ff89;
    --cursor-background-colour: #6aff5d;
}

body {
    margin: 0;
    padding: 15px 20px;
    min-height: 99%;
    width: 100%;
    min-width: 550px;
    color: #00ff00;
    background: #000000;
    font-family: cursor, monospace;
    overflow-x: hidden;
    font-size: 15px;
}


::selection {
    background: rgba(255, 255, 255, 0.6);
    color: black;
}

::-moz-selection {
    background: #5199;
    color: black;
}

textarea {
    left: -1000px;
    position: absolute;
    color: #87ffb3;
}

b {
    font-weight: bold;
}

.cursor {
    font-size: 12px;
    color: rgb(147, 255, 163);
    background-color: rgb(74, 205, 74);
    position: relative;
    opacity: 1;
    height: 1.5em;
    width: 10px;
    max-width: 10px;
    transform: translateY(4px);
    overflow: hidden;
    text-indent: -5px;
    display: inline-block;
    text-decoration: blink;
    animation: blinker 1s linear infinite;
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}

#command {
    cursor: text;
    height: 50px;
    color: #4fff87;
}

#folder {
    cursor: text;
    height: 50px;
    color: #63ff7f;
}

#liner {
    line-height: 1.3em;
    margin-top: -2px;
    animation: show 0.5s ease forwards;
    animation-delay: 1.2s;
    opacity: 0;
}

linear.password::before {
    content: "Password:";
}

@keyframes show {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

p {
    display: black;
    line-height: 1.3em;
    margin: 0;
    overflow: hidden;
    white-space: normal;
    margin: 0;
    letter-spacing: 0.05em;
    animation: typing 0.5s steps(30, end);
}

.no-animation {
    animation: typing 0 steps(30, end);
}

.margin {
    margin-left: 20px;
}

@keyframes typing {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}

/* Header */
.index {
    color: #9c7aec;
}


 /* text variant */
.color2 {
    color: #aaffc2;
}

.command {
    color: #c5ffd6;
    text-shadow: 0 0 5px #c4ffcd;
}

.folder {
    color: #b4fdff;
    text-shadow: 0 0 5px #a9fcff;
}
.error {
    color: #B89076;
}
.white {
    color: white;
}

.inherit,
a {
    color: #65ff5d;
}
a {
    text-decoration: inherit;
}
a:hover {
    background: #52ff8c;
    color: #211830;
}
a:focus {
    outline: 0;
}

.javascript {
    color: rgb(255, 212, 132);
    text-shadow: 0 0 5px rgb(255, 210, 127);
}

.python {
    color: rgb(112, 112, 255);
    text-shadow: 0 0 5px rgb(32, 32, 255);
}

.databases {
    color: red;
    text-shadow: 0 0 5px #ff7d7d;
}

.networksecurity {
    color: rgb(214, 118, 255);
    text-shadow: 0 0 5px #9c7aec;
}

.terminal-image {
    max-width: 100%;
    height: auto;
    margin: 10px 0;
    border: 2px solid #04ff00;
    border-radius: 5px;
}

.terminal-profile {
    max-width: 200px;
    height: 200px;
    margin: 10px 0;
    border: 2px solid #04ff00;
    border-radius: 50%;
    object-fit: cover;
}

.terminal-image-box {
    display: block;
    max-width: 500px;
    height: 300px;
    margin: 10px 0;
    border: 2px solid #04ff00;
    border-radius: 10px;
    object-fit: cover;
}



@media only screen and (max-width: 550px) {
    body {
        padding: 20px;
        min-width: unset;
    }
    #command {
        height: 100px;
    }
    #folder {
        height: 100px;
    }
    #liner::before {
        content: "visitor@localhost:~$";
    }
    .cursor {
        width: 5px;
        max-width: 5px;
    }
    p {
        font-size: 14px;
    }

    #textSet {
        height: 100px;
    }
}