.scroll-style::-webkit-scrollbar {
width: 9px;
}
.scroll-style::-webkit-scrollbar-thumb  {
background-color: #c3c3c3;
border-radius: 0;
}
.scroll-style::-webkit-scrollbar-track  {
background: transparent;
}


/*!
Theme: Tokyo-night-Dark
origin: https://github.com/enkia/tokyo-night-vscode-theme
Description: Original highlight.js style
Author: (c) Henri Vandersleyen <hvandersleyen@gmail.com>
License: see project LICENSE
Touched: 2022
*/

/*  Comment */
.hljs-meta,
.hljs-comment {
color: #565f89;
}

/* Red */
/*INFO: This keyword, HTML elements, Regex group symbol, CSS units, Terminal Red */
.hljs-tag,
.hljs-doctag,
.hljs-selector-id,
.hljs-selector-class,
.hljs-regexp,
.hljs-template-tag,
.hljs-selector-pseudo,
.hljs-selector-attr,
.hljs-variable.language_,
.hljs-deletion {
color: #f7768e;
}

/*Orange */
/*INFO: Number and Boolean constants, Language support constants */
.hljs-variable,
.hljs-template-variable,
.hljs-number,
.hljs-literal,
.hljs-type,
.hljs-params,
.hljs-link {
color: #ff9e64;
}


/*  Yellow */
/* INFO:  	Function parameters, Regex character sets, Terminal Yellow */
.hljs-built_in, 
.hljs-attribute {
color: #e0af68;
}
/* cyan */
/* INFO: Language support functions, CSS HTML elements */
.hljs-selector-tag {
color: #2ac3de;
}

/* light blue */
/* INFO: Object properties, Regex quantifiers and flags, Markdown headings, Terminal Cyan, Markdown code, Import/export keywords */
.hljs-keyword,
.hljs-title.function_,
.hljs-title,
.hljs-title.class_,
.hljs-title.class_.inherited__,
.hljs-subst,
.hljs-property {color: #7dcfff;}

/*Green*/
/* INFO: Object literal keys, Markdown links, Terminal Green */
.hljs-selector-tag { color: #73daca;}


/*Green(er) */
/* INFO: Strings, CSS class names */
.hljs-quote,
.hljs-string,
.hljs-symbol,
.hljs-bullet,
.hljs-addition {
color: #9ece6a;
}

/* Blue */
/* INFO:  	Function names, CSS property names, Terminal Blue */
.hljs-code,
.hljs-formula,
.hljs-section {
color: #7aa2f7;
}



/* Magenta */
/*INFO: Control Keywords, Storage Types, Regex symbols and operators, HTML Attributes, Terminal Magenta */
.hljs-name,
.hljs-keyword,
.hljs-operator,
.hljs-keyword,
.hljs-char.escape_,
.hljs-attr {
color: #bb9af7;
}

/* white*/
/* INFO: Variables, Class names, Terminal White */
.hljs-punctuation {color: #c0caf5}

.hljs {
background: #1a1b26;
color: #9aa5ce;
}

.hljs-emphasis {
font-style: italic;
}

.hljs-strong {
font-weight: bold;
}


body{
background:#e7e7e7;
word-break: break-all;
font-size: 13px;
}

label{
display: block !important;;
}
.titulo2-error{
color: black;
}


.div-error{
    background: white;
    padding: 27px 34px;
    border: 9px solid #c7c7c7;
    display: block;
    margin: 10% 0;
    font-family: sans-serif;
    word-break: break-word;
    border-radius: 15px;
}
.titulo-error{
color: darkslateblue;
}
@media (min-width: 768px) {
body{
font-size:initial;
}

.div-error{
padding: 79px;
}
}


.code-error{

margin-bottom: 0;
background: #22223b;
display: block;
padding: 30px;
}

.code-error .error{
color: black;
background: aliceblue;
padding: 1px 20px;
}

.code-error .error .hljs-number{
color:gray;
}

.code-error span{
display: inline-block !important;
}

.f{
font-style: italic;
font-weight: 400;
color: gray;
}



.cl-1{
color: #009053;
}

.cl-2{
color: #933232;
}

.cl-3{
color: #d57b00;
}


.cl-4{
color: #6357c3;
}


.cl-5{
color: #6ba758;
}


.cl-6{
color: darkgray;
}


.cl-7{
color: darkgray;
}



.res{
background: #09063c;
color: white;
padding: 3px 19px;
}




body{
background:linear-gradient(45deg, #0e003570, #2c425094), url(../img/fondo.webp);
background-position: top;
}

.div-shell{
position: relative;
background: #04031be8;
height: 35rem;
margin: 0 auto;
margin-top: 5rem;
font-family: sans-serif;
word-break: break-word;
font-size: 11px;
color: white;
border-radius: 15px;
border:9px dashed #24224c;
overflow: hidden;
}
.div-shell .div-load{
    position: absolute;
    background: #000116b3;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    align-content: center;
    z-index: 99;
    display: none;
}

.div-shell .div-load img{
width: 30%;
filter: hue-rotate(383deg);
}



.div-shell .btn-send{
background: transparent;
width: 51px;
font-size: 26px;
border: none;
color: white;
box-shadow: none;
}


.div-shell .inp-shell input, .div-shell .inp-shell input:focus, .div-shell .inp-shell-login input, .div-shell .inp-shell-login input:focus{
    border-radius: 0;
    background: transparent;
    border: none;
    color: white;
    box-shadow: none;
    padding: 12px 18px;
    padding-top: 23px;
    padding-left: 33px;
    padding-right: 10px;
}


.div-shell .inp-shell-login input, .div-shell .inp-shell-login input:focus{
    border: none;
}


.div-shell .inp-shell-login input:disabled{
    background: #141414;
    cursor: not-allowed;
}

.div-shell .mi-disp{
    background: #26194d;
    padding: 13px;
    border: 2px dashed gray;
}


.div-shell .lock{
padding: 13px;
border: 2px dashed gray;
background:#3f0000!important;
}


.div-shell .cl-1{
color: gray;
}

.div-shell .cl-2{
color: #d1b6ff;
}


.div-shell .cl-3{
color: #50ffd9;
}


.div-shell .cl-4{
color: #b93838;
}


.div-shell .cl-5 {
    color: #4bcf5b;
}

.div-shell .version{
    display: inline-block;
    border: 1px solid #5f5f5f;
    padding: 1px 9px;
    border-radius: 28px;
    margin-bottom: 8px;
}


p{
word-break: break-word;
}


.font-bg1{
    background: gray;
    padding: 1px 11px;
}

.font-bg2{
    background: #53218b;
    padding: 1px 11px;
}

.font-bg3{
    background: #384483;
    padding: 1px 11px;
}

.font-bg4{
    background: #770000;
    padding: 1px 11px;
}

.cyber{
    background: #312e94;
    padding: 1px 7px;
    display: inline-block;
}


.logo-shell{
width: 50%;
}



.div-shell .inp-new-clave{
padding: 1px 14px;
width: 26%;
outline: none;
border: none;
border-radius: 18px;
}


.div-shell .fm{
color: #c0a9ff;
}
.div-shell .pt{
color: #9decff;
margin: 1px 6px;
font-weight: 600
}





.div-shell a{
text-decoration: none;
}

.div-shell span{
display: block;
}

.div-shell .resp-command{
    height:310px;
    overflow: auto;
}

.div-shell #form-shell{
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin-bottom: 0;
border-top: 1px solid #4e4e4e;
background: #020412;
}



.div-shell .inp-shell, .div-shell .inp-shell-login    {
    display: flex;
}

.div-shell .inp-shell-login{
    margin: 0 auto;
    width: 90%;
    background: #0a0c1c;
    display: flex;
    border-bottom: 3px solid #434987;
}

.div-shell .t-sesion{
    font-size: 18px;
    color: #b9b9b9;
    letter-spacing: 2px;
    font-weight: 800;
}

.aviso{
    font-size: 16px;
}

.text-error{
    font-size: 16px;
    color: #9e98ff;
}
.div-shell .btn-lock{
    background: #910000;
    padding: 1px 10px;
    border: none !important;
    color: white !important;
    box-shadow: none !important;
}


.div-shell .btn-unlock{
    background: #656565;
    padding: 1px 10px;
    border: none !important;
    color: white !important;
    box-shadow: none !important;
}



.div-shell .div-login{
text-align: center;
margin-top: 5rem;
padding: 0px 40px;
}

.div-shell .div-login.options{
margin-top: 0rem;
text-align: left;
padding: 20px 32px;
}





@media (min-width: 768px) {
.div-shell{
width: 70%;
font-size: initial;
}
.div-shell .div-load img{
width: 20%;
}

.logo-shell{
width: 30%;
}

.div-shell .inp-shell-login{
    width: 50%;
}
.div-shell .t-sesion{
    font-size: 20px;
}
.aviso{
    font-size: 18px;
}

}








.div-estado-sitio{
position: fixed;
background: white;
color: black;
top: 0;
z-index: 99999;
left: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
padding: 0px 20px;
border-bottom: 10px solid #afafaf;
font-size: 18px;
}



.div-estado-sitio .titulo-status{
    font-size: 19px;
    color: black;
    background: aliceblue;
    display: inline-block;
    padding: 3px 20px;
    margin-bottom: 7px;
    color: #181936;
    border-radius: 5rem;
}

.div-estado-sitio img{
width: 50%;
animation:anicon .56s ease-in-out infinite alternate;
}

.div-estado-sitio .motivo{
    display: inline-block;
    font-size: 15px;
    background: #55319b;
    color: white;
    padding: 2px 10px;
    border-radius: 4rem;
    margin-bottom: 6px;
    font-weight: 700;
}

@keyframes anicon{
0%{
transform: translateY(0px);
}
100%{
transform: translateY(15px);
}
}


.div-estado-sitio hr{
background: #d9d9d9;
opacity: 1;
}


.div-estado-sitio .img-logo-s{
width: 150px;
}


.img-st{
width: 130px;
filter: saturate(0.6);
}


.div-block{
display: flex;
align-items: center;
height: 100%;
position: fixed;
text-align: center;
left: 0;
right: 0;
justify-content: center;
font-family: monospace;
font-size: 22px;
flex-direction: column;
overflow: auto;
padding: 1px 20px;
color: white;
}

.div-block a{
    text-decoration: none;
    color: #9f8eff;
}

.table-process table{
color: darkgrey;
width: 74rem;
}
.table-process table .tr-title{
background: #272f4d;
color: white;
}

.table-process table .kill-process{
background: #590000;
color: white;
padding: 1px 11px;
box-shadow: none !important;
}
.table-process table .kill-process.active{
background: #1a6f50;
}

.table-process table .kill-process2{
    background: #590000;
    color: white;
    padding: 4px 0px;
    box-shadow: none !important;
}
.table-process table .kill-process2.active{
background: #1a6f50;
}

.copy-right{
    color: gray;
    font-weight: 700;
    display: block;
    margin-top: 5px;
}

.fm-secure{
    background: #191919;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}


.fm-secure .fm-section{
    width: 90%;
}

.fm-secure .fm-content{
    background: #222222;
    color: #d9d9d9;
    padding: 28px;
}

.fm-secure .fm-content .fm-title{
    font-weight: 600;
    font-size: 27px;
}

.fm-secure .fm-content .item-desc{
    display: block;
    font-size: 20px;
}

.fm-secure .fm-content .fm-copyright{
    color: #a3a3a3;
    font-weight: 700;
    font-size: 15px;
    background: #110b1f;
    padding: 3px 18px;
    display: inline-block;
    border-radius: 13rem;
}

.name-app{
    display:block;
    color: #ababab;
    font-weight: 600;
}

/*  Medium devices */
@media (min-width: 768px) {
.div-block{
    font-size: 2rem;
}

.div-estado-sitio .titulo-status{
font-size: 36px;
padding: 3px 40px;
}

.div-estado-sitio{
padding: 0px 47px;
font-size: 25px;
}

.div-estado-sitio img{
width: 100%;
}

.div-estado-sitio .line{
    border-left: 2px solid #ebebeb;
    padding-left: 59px;
}
.div-estado-sitio .motivo{
    font-size: 20px;
}

.fm-secure .fm-section{
    width: 73%;
}
.fm-secure .fm-content{
    padding: 63px;
}
.fm-secure .fm-content .fm-title{
    font-size: 40px;
}
.fm-secure .fm-content .item-desc{
    font-size: 25px;
}
.fm-secure .fm-content .fm-copyright{
    font-size: 20px;
}
}