@font-face {
	font-family: 'A';
	src: url(/r.ttf);
	font-weight: normal;
}
@font-face {
	font-family: 'A';
	src: url(/b.ttf);
	font-weight: bold;
}
:root {
    --main: #9db73e;
    --accent: #0070ba;
    --black: #000;
    --white: #fff;
    --red: #c00;
    --yellow0: #ffdf90;
    --yellow: #fc3;
    --silver: #ddd;
    --gray: rgba(0, 0, 0, 0.5);
    --shadow0: rgba(0, 0, 0, 0.0625);
    --shadow: rgba(0, 0, 0, 0.125);
    --shadow1: rgba(0, 0, 0, 0.1875);
    --shadow2: rgba(0, 0, 0, 0.25);
    --light: rgba(255, 255, 255, 0.75);
    --light2: rgba(255, 255, 255, 0.25);
}
*, ::after, ::before {
    outline: 0;
    border: 0;
    margin: 0;
    padding: 0;
    box-sizing: border-box;

	scrollbar-color: var(--main) var(--white);
	scrollbar-width: thin;

    scroll-behavior: smooth;
    transition: all 0.125s;

    font-family: "A", -apple-system, BlinkMacSystemFont,
    "Segoe UI", system-ui, Roboto, Oxygen-Sans, Ubuntu, Cantarell,
    "Helvetica Neue", sans-serif;

    font-size: inherit;
    word-spacing: 0.25rem;
    line-height: 1.25;
    /*color-scheme: dark;*/
    accent-color: var(--main);
}
:active, :focus {
    outline: 0;
    -webkit-tap-highlight-color: transparent;
}
::selection {
    opacity: 1;
    background: var(--black);
    color: var(--white);
}
::placeholder {
    opacity: 1;
    color: var(--gray);
    font-weight: bold;
}
::-webkit-scrollbar {
    width: 0.5rem;
    height: 0.5rem;
}
::-webkit-scrollbar-thumb { background: var(--main); }
::-webkit-scrollbar-track { background: var(--white); }
html, body {
    width: 100%;
    min-height: 100%;
}
a {
    color: var(--accent);
    text-decoration: none;
}
a[href]:hover, a[href]:active, a[href]:focus { text-decoration: underline; }
html { background-color: var(--white); }
body {
    overscroll-behavior: none;
    text-align: left;
    font-size: 1rem;
    text-shadow: 0 0.05rem 0.05rem var(--shadow);
    color: var(--black);
    overflow: hidden;
	overflow-y: auto;
}
ol, ul { list-style: none; }
[data-hidden]{ display: none !important; }
#OKZGN, #COPY {
    padding-top: 1rem;
    margin-top: 1.5rem;
    border-top: 1px solid var(--shadow);
}
#OKZGN a {
    color: #004e9b;
    display: flex;
    font-size: 0.85rem;
}
#OKZGN a img { height: 1.25rem; }
#OKZGN a img, #OKZGN a span {
    margin: 0.5rem;
    align-self: center;
}
#OKZGN a, footer, header { justify-content: center; }
#COPY {
    padding-top: 1.5rem;
    text-align: center;
}
[data-logo], header > ul { margin: 1rem; }
[data-logo] { line-height: 0; }
[data-logo] a {
  display: inline-block;
  height: 4rem;
}
[data-logo] a img { height: 100%; }
header, main, footer, main > article {
    padding: 1rem;
    display: flex;
    flex-wrap: wrap;
}
footer > *:not(.all-width) { max-width: 20rem; }
iframe {
    border: 0;
    width: 100%;
    height: 20rem;
    margin-top: 1rem;
}
.iframe, iframe {
    border: 1px solid var(--shadow2);
    background: var(--shadow);
}
header { padding: 0 !important; }
header > ul {
    align-self: center;
    display: flex;
}
header > ul > li { border-right: 1px solid var(--shadow); }
header > ul > li:last-child { border-right: 0; }
header > ul > li:not(.N) > a::after {
    content: '>';
    display: inline-block;
    margin-left: 0.5rem;
    transform: rotate(90deg);
}
[data-logo] a, .block { padding: 0.5rem; }
header > ul > li > a {
    color: var(--black);
    font-weight: bold;
    display: inline-block;
    padding: 0.5rem 1rem;
}
header > ul > li > a:hover,
header > ul > li > a:active,
header > ul > li > a:focus,
header > ul li a[data-s] {
    background: var(--main);
    color: var(--white);
}
header > ul ul {
    display: none;
    background: var(--main);
}
header > ul ul li { border-top: 1px solid var(--shadow2); }
header > ul ul a {
    padding: 0.5rem 1rem;
    display: block;
    color: var(--white);
}
header > ul ul a:hover,
header > ul ul a:active,
header > ul ul a:focus { background: var(--light2); }
header > ul ul[data-s] {
    display: block;
    position: absolute;
    z-index: 1;
    box-shadow: 0 0.5rem 0.5rem var(--shadow2);
}
@media screen and (max-width: 640px){
    header { flex-flow: column; }
    [data-logo] {
        align-self: center;
        margin-bottom: 0;
    }
    [data-logo] a { height: 3rem; }
    header > ul {
        width: 100%;
        padding: 0 1rem;
        text-align: center;
        margin-bottom: 1.5rem;
        flex-flow: column;
    }
    header > ul > li {
       width: 100%;
       border-right: 0 !important;
       border-bottom: 1px solid var(--shadow);
    }
    header > ul > li:last-child { border-bottom: 0; }
    header > ul ul[data-s] {
        display: block;
        position: static;
        z-index: 1;
    }
    header > ul ul a { display: block; }
}
main { background: var(--shadow0); }
hr {
    border-top: 1px solid var(--shadow);
    margin: 0.5rem 0;
}
footer { background: url(t.png) bottom right no-repeat; }
footer h4 {
    text-transform: uppercase;
    color: var(--main);
}
input[type="text"], input[type="password"], input[type="button"], input[type="submit"], select, input[type="date"], [contenteditable] { padding: 0.5rem; }
input[type="text"], input[type="password"], select, input[type="date"], input[type="file"], [contenteditable] {
    width: 100%;
    border: 1px solid var(--shadow2);
    background: var(--white);
}
input[type="text"]:hover, input[type="password"]:hover, select:hover,
input[type="text"]:focus, input[type="password"]:focus, select:focus,
input[type="date"]:hover, input[type="date"]:focus,
input[type="checkbox"]:hover, input[type="checkbox"]:focus,
input[type="radio"]:hover, input[type="radio"]:focus,
input[type="file"]:hover, input[type="file"]:focus,
[contenteditable]:hover, [contenteditable]:focus { border-color: var(--black); }

input[type="button"]:hover, input[type="submit"]:hover,
input[type="button"]:focus, input[type="submit"]:focus,
input[type="text"]:hover, input[type="password"]:hover, select:hover,
input[type="text"]:focus, input[type="password"]:focus, select:focus,
input[type="date"]:hover, input[type="date"]:focus,
input[type="checkbox"]:hover, input[type="checkbox"]:focus,
input[type="radio"]:hover, input[type="radio"]:focus,
input[type="file"]:hover, input[type="file"]:focus,
[contenteditable]:hover, [contenteditable]:focus { filter: drop-shadow(0 0 0.125rem var(--gray)); }

input[type="button"], input[type="submit"] {
    padding-left: 1rem;
    padding-right: 1rem;
    background: var(--accent);
    color: var(--white);
    font-weight: bold;
    cursor: pointer;
}
input[type="button"]:hover, input[type="submit"]:hover,
input[type="button"]:active, input[type="submit"]:active,
input[type="button"]:focus, input[type="submit"]:focus { background: var(--main); }

input[type="checkbox"], label > * {
    display: inline-block;
    vertical-align: middle;
}
input[type="checkbox"], input[type="radio"] {
    width: 1.5rem;
    height: 1.5rem;
}
input[type="radio"] { margin-right: 0.5rem; }
label { display: inline-block; }
input[type="file"] {
    max-width: 30rem;
    padding: 0.5rem;
}

.links-block { padding: 1rem; }
.links-block li, .links-block ul { margin-top: 1rem; }
.links-block a {
    opacity: 0.5;
    color: var(--black);
    display: inline-block;
}
.links-block a:hover, .links-block a:active, .links-block a:focus { opacity: 1; }
.links-block li img {
  height: 1.5rem;
  vertical-align: middle;
  margin-right: 0.5rem;
}

.main-bg-color { background: var(--main) !important; }
.accent-bg-color { background: var(--accent) !important; }
.trans-bg-color { background: transparent !important; }

.main-color, .main-color a { color: var(--main) !important; }
.accent-color, .accent-color a { color: var(--accent) !important; }
.light-color, .light-color a { color: var(--light); }

.sweet-yellow, .sweet-yellow a { color: var(--yellow0); }
.yellow, .yellow a { color: var(--yellow); }
.black, .black a { color: var(--black); }
.white, .white a { color: var(--white); }

.small-width { width: 11rem !important; }
.all-width { width: 100% !important; }
.half-width { width: 50% !important; }
.welcome-text {
    font-size: 1.25rem;
    margin-bottom: 1.75rem;
    text-align: center;
    padding: 0 2rem;
    background: linear-gradient(to left, var(--main), var(--accent));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.image-inside > * {
    display: inline-block;
    vertical-align: middle;
}
.image-inside > img { margin: 0 !important; }
.small-image { height: 1rem !important; }

.small-indent {
    padding-left: 2rem;
    text-indent: -2rem;
    display: block;
}

.distance-bottom {
    margin-bottom: 0.5rem;
    display: inline-block;
}
.distance-top-bottom {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.horizontal-features {
    display: flex;
    background: var(--black);
}
.horizontal-features li, .points-list li {
    padding: 1rem 1rem 1rem 2.5rem;
    text-indent: -2.5rem;
}
.points-list li {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 1.75rem;
}
.horizontal-features li::before, .points-list li::before {
    content: '';
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 0.5rem;
    background: var(--accent);
    display: inline-block;
    margin-right: 2rem;
    position: relative;
    left: 1rem;
}
.points-list li::before { background: var(--main); }
.page ul {
    list-style: disc !important;
    padding-left: 2rem;
}
@media screen and (max-width: 640px), (max-width: 960px) {
    .horizontal-features {
      flex-flow: column;
      padding: 0.5rem 0;
    }
    .horizontal-features li {
      width: 100%;
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
}

.image-wrapper {
    overflow: hidden;
    line-height: 0;
}
.image-wrapper img {
    transition: all 1s;
}
.image-wrapper img:hover {
    transform: scale(1.1);
    filter: saturate(1.5);
}

.arrow-button::before {
    content: '>';
    display: inline-block;
    vertical-align: middle;
    position: relative;
    left: -2rem;
    animation: _A 1s ease-in-out 0s alternate infinite;
    opacity: 0;
}
@keyframes _A {
    to {
     left: -1rem;
     transform: scale(2);
     opacity: 1;
     color: var(--yellow0);
    }
}

[data-loading] {
    padding-bottom: 1rem !important;
    border-bottom: 2px solid transparent;
    animation: _B 0.5s ease-in-out 0s alternate infinite;
}
@keyframes _B {
    to {
     border-color: var(--main);
    }
}
.page {
    width: 75%;
    display: block;
    margin: 0 auto;
    overflow-x: hidden;
}
.page h2 {
    font-size: 1.25rem;
    color: var(--main);
}
[data-not-found]{
    font-size: 2rem;
    display: block;
    text-align: center;
    padding: 10rem 1rem;
    color: var(--gray)
}
[data-response] {
    background: var(--red);
    padding: 0.5rem 1rem;
    color: var(--white);
    margin-bottom: 0.5rem;
}

[data-bad] {
    border-color: var(--red) !important;
    background-color: var(--red) !important;
    color: var(--white) !important;
}

.full-modal {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    justify-content: center;
    color: var(--white);
    backdrop-filter: blur(3px);
}
.full-modal, .full-modal > fieldset { background: var(--gray); }
.full-modal > fieldset {
    padding: 0.5rem 1rem 1rem 1rem;
    align-self: center;
    width: 15rem;
}
.full-modal > fieldset > * { margin-top: 0.5rem; }
.careers > ul {
    display: flex;
    list-style: none !important;
    padding-left: 0 !important;
    flex-wrap: wrap;
}
.careers > ul li {
    width: calc(25% - 1rem);
    margin: 0.5rem;
    transition: all 0.5s;
    cursor: pointer;
}
.careers > ul li:hover { transform: scale(1.025); }
.careers > ul li:hover img { filter: saturate(1.5); }
.careers > ul li h4, .careers > ul li h5 {
    background: var(--accent);
    color: var(--white);
    padding: 0.5rem 1rem;
    height: 9rem;
    display: flex;
    flex-flow: column;
    justify-content: center;
    padding: 1rem;
}
.careers > ul li h5 {
    background: var(--shadow1);
    height: 4rem;
    color: var(--black);
}
.info-button {
    display: block;
    padding: 1rem;
    border: 1px solid var(--shadow1);
    background: var(--main);
    text-align: center;
    color: var(--white);
    font-weight: bold;
}
.info-button::after, .big-button::after {
    content: '>';
    display: inline-block;
    width: 1rem;
    height: 1rem;
    opacity: 0;
    color: var(--white);
    position: relative;
    top: 0;
    left: 0;
}
.info-button:hover::after, .info-button:active::after, .info-button:focus::after,
.big-button:hover::after, .big-button:active::after, .big-button:focus::after {
    opacity: 1;
    animation: _C 0.5s ease-in-out 0s alternate infinite;
}
@keyframes _C {
    to {
        transform: scale(1.5);
        top: -0.125rem;
        left: 1rem;
    }
}
.careers > ul li img {
    width: 100%;
}

@media screen and (max-width: 640px){
    .careers > ul { flex-flow: column; }
    .careers > ul li { width: calc(100% - 1rem) !important; }
    .careers > ul li h4 { height: 6rem; }
    .careers > ul li h5 { height: 3.5rem; }
}

[data-response] ul {
    color: var(--black);
    border-top: 0 !important;
    border: 1px solid var(--shadow);
    list-style: none !important;
    padding-left: 0 !important;
}
[data-response] li {
    border-top: 1px solid var(--shadow);
    padding: 0.5rem;
}

.big-button {
    display: block;
    border: 1px solid var(--accent);
    background: var(--shadow0);
    padding: 0.5rem 1rem;
    color: var(--accent);
    font-size: 1.25rem;
    text-align: center;
    margin: 0 auto;
    font-weight: bold;
}
.big-button:hover, .big-button:active, .big-button:focus {
    background: var(--gray);
    border-color: var(--shadow1);
    color: var(--white);
}

.main-block, .focus-block { margin-top: 2rem; }
.main-block h2 {
    font-size: 2rem;
    color: var(--gray);
    margin-bottom: 1rem;
}


.focus-block {
    border: 1px solid var(--shadow);
    background: var(--white) linear-gradient(135deg, transparent, var(--shadow0));
    padding: 2rem;
}
  .focus-block h3 {
    font-size: 1.5rem;
    color: var(--gray);
    margin-bottom: 1rem;
}
@media screen and (max-width: 640px) {
    .focus-block {
        padding: 1rem;
    }
}

.spaced-block > * {
    margin-top: 1rem;
}

[data-previous] {
    color: var(--gray);
    margin-bottom: 1rem;
    padding: 0 1rem;
    text-align: center;
    cursor: pointer;
    position: relative;
    left: 0;
    opacity: 0.5;
}

[data-previous]:hover, [data-previous]:active, [data-previous]:focus {
    opacity: 1;
    animation: _D 0.25s ease-in-out 0s alternate 4;
}
@keyframes _D {
    to {
        left: -2rem;
    }
}
[data-previous]:before {
    content: '< Regresar a: ';
    display: inline-block;
    margin-right: 0.5rem;
    color: var(--black);
}

@media screen and (max-width: 640px), (max-width: 960px) {
.page {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}
}

@media screen and (max-width: 640px), (max-width: 960px) {
    main { flex-flow: column; }
}
/*
@media screen and (min-width: 961px){  }
@media (prefers-color-scheme: light/dark) {

}*/