/* Tema Argentina  */
/* ¡¡¡Para cuando Argentina gane el mundial!!! */

@import "./syntax/a11y-light.css";
:root {
 --background-color: #1f182b;
 --background-gradient: none;
 --text-color: white;
 --text-shadow-color: #D5B048;
 --contrast-color: #00000080 ;
 --background-highlight-color: none;
 --horizon-sep-color: #000;
 --marked-color: #FCBF49;
 --marked-border-color: #000;
 --marked-text-color: var(--text-color);
 --link-color: #12ffff;
 --link-hover-color: #ffd700;
 --navbar-text-color: #f5f5f5;
 --subject-color: var(--link-color);
 --role-color: var(--red-text-color);
 --thread-navbar-background: #d2b200;
 --thread-navbar-color: #fff;
 --border-color: #000;
 --logo-image: url('/.media/t_d7ac278e6c09925a307e7f0e6df9d5b0c7598a3979648fc7f8bf156498862573');
 --button-push-color: #D5B048;
 --button-color: #74ACDF;
 --reload-button-color: #ecebe5;
 --reload-button-push-color: #d8d0c4;
 --reload-button-border-color: #8f8f9d;
 --green-text-color: #00ff00;
 --red-text-color: #ff3b3b;
 --pink-text-color: #ff90a8;
 --name-color: #5a82a5;
 --post-border-color: #000;
 scrollbar-color: var(--thread-navbar-background) var(--contrast-color);
}

/* --------------- LAS ADICIONES AL TEMA COMIENZAN AQUÍ --------------- */

.opCell > .innerOP {
    display: inline-block;
    width: 95%;
    background-color: #00000080;
    border: solid 0.2em gold;
    border-radius: 20px;
    color: #ffffff;
}

.modalTableBody input[type="text"], .modalTableBody select,
#modalAnswer,
#cssInput, #jsInput,
#postingForm input[type="text"], #postingForm textarea,
#quick-reply input[type="text"], #quick-reply textarea {
    color: var(--text-color);
    background-color: #171717;
}

.innerPost {
    padding: 0.25em;
    max-width: 100%;
    border: 2px solid gold;
    border-top-width: 0;
    border-left-width: 0;
    border-radius: 8px;
}

.youName::after {
    content: ' (Vos)';
    font-style: italic;
    font-family: helvetica;
    color: #000;
    text-shadow: 0px 0px #fff0;
}

.quoteLink.you:after {
  content: " (Vos)";
}

nav.navHeader {
 background-color: Black;
 box-shadow: 0 2px 4px -1px rgb(13 16 22 / 14%),0 4px 5px 0 rgb(13 16 22 / 12%),0 1px 10px 0 rgb(13 16 22 / 20%);
 color: #c0c0c0;
 text-align: right;
}
.boardHeader #labelName {
 color: var(--link-color);
}
.boardHeader p,
#overboardId {
 color: var(--link-color);
}
.innerUtility.top {
 border-radius: 5px;
}
#newPostFieldset legend {
 background-image: url('https://8chan.moe/.media/4581cc683edc75b8a0330a8b71658e6a83964e2241c416e0eda9955e36428887.jpg');
 border-color: var(--border-color);
 border-radius: 5px;
 font-family:Arial;
		font-size:14px;
        text-shadow:  1px 1px 0px #000, -1px 1px 0px #000, 1px -1px 0px #000, -1px -1px 0px #000, 0px 1px 0px #000, 0px -1px 0px #000, -1px 0px 0px #000, 1px 0px 0px #000, 2px 2px 0px #000, -2px 2px 0px #000, 2px -2px 0px black, -2px -2px 0px black, 0px 2px 0px black, 0px -2px 0px black, -2px 0px 0px black, 2px 0px 0px black, 1px 2px 0px black, -1px 2px 0px black, 1px -2px 0px black, -1px -2px 0px black, 2px 1px 0px black, -2px 1px 0px black, 2px -1px 0px black, -2px -1px 0px black;
        text-align:center;
        color:#7FC9FF;
 border-color: var(--border-color);
 border-radius: 5px;
 color: var(--text-color);
}
input[type=text],
input[type=password],
input[type=number],
input[type=url],
textarea {
 background: var(--background-color);
 border-color: var(--field-border-color);
 border-radius: 5px;
}

#postingForm th {
 background-image: url('https://8chan.moe/.media/4581cc683edc75b8a0330a8b71658e6a83964e2241c416e0eda9955e36428887.jpg');
 border-color: var(--border-color);
 border-radius: 5px;
 font-family:Arial;
		font-size:14px;
        text-shadow: 1px 1px 0px #000, -1px 1px 0px #000, 1px -1px 0px #000, -1px -1px 0px #000, 0px 1px 0px #000, 0px -1px 0px #000, -1px 0px 0px #000, 1px 0px 0px #000, 2px 2px 0px #000, -2px 2px 0px #000, 2px -2px 0px black, -2px -2px 0px black, 0px 2px 0px black, 0px -2px 0px black, -2px 0px 0px black, 2px 0px 0px black, 1px 2px 0px black, -1px 2px 0px black, 1px -2px 0px black, -1px -2px 0px black, 2px 1px 0px black, -2px 1px 0px black, 2px -1px 0px black, -2px -1px 0px black;
        text-align:center;
        color:#7FC9FF;
}
.modalTableBody th {
 background: var(--thread-navbar-background);
 border: none;
 border-radius: 5px;
 color: var(--thread-navbar-color);
}
a,
.glowOnHover {
 color: var(--link-color);
 text-shadow: none;
}
a:hover,
.glowOnHover:hover {
 color: var(--link-hover-color);
 text-shadow: 1px 0px 20px var(--text-shadow-color);
}
.dropzone {
 background: var(--reload-button-color);
 border: 1px solid var(--reload-button-border-color);
 border-radius: 5px;
 color: black;
}
.dropzone:hover {
 background: var(--reload-button-push-color);
 border: 1px solid var(--reload-button-border-color);
 border-radius: 5px;
 color: black;
}
input[type="submit"] {
 background:var(--button-color) !important;
 border: 1px solid;
 border-radius: 5px;
 border-color: var(--border-color);
 color: #000;
}
input[type="submit"]:hover {
 background:var(--button-push-color) !important;
 border: 1px solid;
 border-radius: 5px;
 border-color: var(--border-color);
 color: #000;
}
input[value="Cancel"] {
 background:var(--button-color) !important; border: 1px solid;
 border-radius: 5px;
 border-color: var(--border-color);
 color: #000;
}
input[value="Cancel"]:hover {
 background:var(--button-push-color) !important;
 border: 1px solid;
 border-radius: 5px;
 border-color: var(--border-color);
 color: #000;
}
input[value="Reload"] {
 background-color:var(--reload-button-color) !important;
 border: 1px solid var(--reload-button-border-color);
 border-radius: 5px;
 color: black;
}
input[value="Reload"]:hover {
 background-color:var(--reload-button-push-color) !important;
 border: 1px solid var(--reload-button-border-color);
 border-radius: 5px;
 color: black;
}
button {
 background-color:var(--reload-button-color) !important;
 border: 1px solid var(--reload-button-border-color);
 border-radius: 5px;
 color: black;
}
button:hover {
 background-color:var(--reload-button-push-color) !important;
 border: 1px solid var(--reload-button-border-color);
 border-radius: 5px;
 color: black;
}

}
.innerPost {
 border: 1px solid var(--border-color);
 border-radius: 5px;
 padding: 5px;
}
span.labelCreated {
 color: var(--link-color);
}
.linkName {
 color: var(--name-color);
}
.linkSelf,
.linkQuote,
.labelStats {
 color: var(--link-color);
 font-weight: bold;
 text-decoration: none;
}
.floatingList,
.floatingMenu,
.modalForm {
 background: var(--contrast-color);
 border-color: var(--border-color);
 color: var(--text-color);
}
.quoteLink {
 color: var(--link-color);
}
#panelMessage {
 color: var(--red-text-color);
}
.noEmailName {
 color: #000;
}
.noEmailName:hover {
 color: #000;
 text-shadow: none;
}
.greenText {
 color: var(--green-text-color);
}
.pinkText {
 color: var(--pink-text-color);
}
.redText {
 color: var(--red-text-color);
}
.diceRoll {
  color: var(--red-text-color);
}
.containPages {
 border-color: var(--marked-border-color);
 border-radius: 5px;
}
#indexWrapper > fieldset {
 border-radius: 5px;
}
#indexWrapper > fieldset:not(#welcomeMessage) {
 border-color: var(--thread-navbar-background);
 border-radius: 5px;
}
.titleFieldset {
 border-color: var(--thread-navbar-background);
}
.jsenabled .catalogCell {
 background: var(--contrast-color);
 border-color: var(--border-color);
 border-radius: 5px;
}
#quick-reply {
  background: var(--contrast-color);
 border-color: var(--border-color);
 border-radius: 5px;
}
#quick-reply th {
 background-image: url('https://8chan.moe/.media/4581cc683edc75b8a0330a8b71658e6a83964e2241c416e0eda9955e36428887.jpg');
 border-color: var(--border-color);
 border-radius: 5px;
 font-family:Arial;
		font-size:14px;
        text-shadow: 1px 1px 0px #000, -1px 1px 0px #000, 1px -1px 0px #000, -1px -1px 0px #000, 0px 1px 0px #000, 0px -1px 0px #000, -1px 0px 0px #000, 1px 0px 0px #000, 2px 2px 0px #000, -2px 2px 0px #000, 2px -2px 0px black, -2px -2px 0px black, 0px 2px 0px black, 0px -2px 0px black, -2px 0px 0px black, 2px 0px 0px black, 1px 2px 0px black, -1px 2px 0px black, 1px -2px 0px black, -1px -2px 0px black, 2px 1px 0px black, -2px 1px 0px black, 2px -1px 0px black, -2px -1px 0px black;
        text-align:center;
        color:#7FC9FF;
 border-radius: 5px;
 border: none;
 color: var(--thread-navbar-color);
}
#quick-reply .close-btn.coloredIcon {
 color: var(--thread-navbar-color);
 text-shadow: none;
}
#quick-reply .close-btn.coloredIcon:hover {
 color: var(--link-hover-color);
 text-shadow: none;
}
.modalForm {
 border-radius: 5px;
}
.captchaImage {
 border-radius: 5px;
}
.floatingMenu {
 border-radius: 5px;
}
div#multiboardMenu.floatingMenu {
 border-radius: 5px;
}
.floatingMenu hr {
 border-color: var(--thread-navbar-background);
}
.floatingList ul li {
 background: var(--contrast-color);
 border-bottom: 1px solid var(--text-color);
}
.floatingList ul li:hover {
 background-color: #D5B048;
}
.splitField > * {
 border-radius: 5px;
}
.labelCreated:after {
 content: " (UTC)";
}
.linkSelf {
  display: none;
}
.linkQuote:before {
  content: "/#/";
  font-weight: bolder;
}
input[type=text],
input[type=password],
input[type=number],
input[type=url],
textarea {
 border-color: var(--post-border-color);
 color: var(--text-color);
}
#themeSelector {
 color: black;
}
.titleFieldset legend {
 background: var(--thread-navbar-background);
 border-color: var(--thread-navbar-background);
 border-top-left-radius: 5px;
 border-top-right-radius: 5px;
 color: var(--thread-navbar-color);
 margin-left: -17px;
 padding-right: 28px;
}

/* Corner Mascot & Background */
body {
	background-image: 
                url(/.media/d72abd058a0dafed4434863f1ed87b53707a925719e42c02475d819fb0de4a93.png),

		conic-gradient(rgba(5,5,5,.3), rgba(5,5,5,.3)),

		url(/.media/454eb9ebd9c9494591df3c7bd9b31bd3da427f2f91919171d5739c3f40b1f80e.gif);       
		
	background-repeat:  no-repeat, no-repeat;
	background-attachment: fixed, fixed;
	background-position: right bottom, center, center;
        background-blend-mode: normal, normal;
        background-size: 25vmin, auto, auto;
}    

/* Banners con borde y hover */
#bannerImage {
      border: 5px ridge #75AADB;-webkit-border-radius:5px;-khtml-border-radius:5px;-moz-border-radius:5px;border-radius:5px;
}
    #bannerImage:hover, img.board_image:hover {
        border: 6px ridge #FFFFFF;-webkit-border-radius15px;-khtml-border-radius:5px;-moz-border-radius:5px;border-radius:5px;
    }

 /* Buzz Script that makes the board banner buzz when you hover over it. */
     
    #bannerImage, img.banner, img.board_image {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    }
     
    #bannerImage:hover, img.banner:hover, img.board_image:hover {
        -webkit-animation-name: buzz;
        animation-name: buzz;
        -webkit-animation-duration: 0.15s;
        animation-duration: 0.15s;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }
     
    @keyframes buzz {
        50% {
            -webkit-transform: translateX(3px) rotate(2deg);
            transform: translateX(3px) rotate(2deg);
        }
        100% {
            -webkit-transform: translateX(-3px) rotate(-2deg);
            transform: translateX(-3px) rotate(-2deg);
        }
    }
     
    @-webkit-keyframes buzz {
        50% {
            -webkit-transform: translateX(3px) rotate(2deg);
            transform: translateX(3px) rotate(2deg);
        }
        100% {
            -webkit-transform: translateX(-3px) rotate(-2deg);
            transform: translateX(-3px) rotate(-2deg);
        }
    }

.boardHeader p#labelDescription {
    font-family: MedievalSharp;
    font-size: 110%;
    text-shadow: 1px 1x 1px;
        text-shadow: 1px 1px 0px #000, -1px 1px 0px #000, 1px -1px 0px #000, -1px -1px 0px #000, 0px 1px 0px #000, 0px -1px 0px #000, -1px 0px 0px #000, 1px 0px 0px #000, 2px 2px 0px 

#000, -2px 2px 0px #000, 2px -2px 0px black, -2px -2px 0px black, 0px 2px 0px black, 0px -2px 0px black, -2px 0px 0px black, 2px 0px 0px black, 1px 2px 0px black, -1px 2px 0px black, 

1px -2px 0px black, -1px -2px 0px black, 2px 1px 0px black, -2px 1px 0px black, 2px -1px 0px black, -2px -1px 0px black;
        color:#0fffff;

-webkit-animation:colorRotate 6s linear 0s infinite;
        -moz-animation:colorRotate 6s linear 0s infinite;
        -o-animation:colorRotate 6s linear 0s infinite;
        animation:colorRotate 6s linear 0s infinite;
}
@keyframes flip {
  0%,80% {
    transform: rotateX(360deg) 
  }
}

/*Estrella Favorita (Gracias /404/) */
label#favoriteButtonLabel:after{ 
  content: " "; 
  font-size:0px;
}
label#favoriteButtonLabel::before{
  content: "✩✩✩"; 
  font-size:35px;
  color:white;
}
label#favoriteButtonLabel:hover:before{
   content: "✩✩✩"; 
  font-size:35px;
  color:yellow;
} 

/* Captcha */
.captchaImage {
    filter: sepia() saturate(500%) hue-rotate(220deg) opacity(59%)  ;
    animation: 1.5s linear 0s normal none infinite running glow;
}
@keyframes glow {
    0% {
        box-shadow: 0 0 50px #452981;
    }
    50% {
        box-shadow: 0 0 0 #452981;
    }
    100% {
        box-shadow: 0 0 50px #452981;
    }
}

 /* cursor */
html, *, hover, #postingForm th { 
  cursor: url(/.media/b3fab04d0a1a2605571d0e8ca03ba7d97beb7e836cb5584874d0ab8dafbc74a1.png), default; 
}

/* Spoiler mejorado */
span.spoiler, span.spoiler a{
  background: transparent;
  color: transparent;
  text-shadow: 0 0 5px #d3d2ff, 0 0 7px #d3d2ff, 0 0 8px #d3d2ff;
  padding: 0 1px;
  transition: 1s;
}
span.spoiler:hover{ 
  background: transparent;
  color: #FFF;
}

/* Mejorar nombre del tablón y mensaje */
.boardHeader #labelName {
    color: #cccccc;
    font-family: MedievalSharp;
letter-spacing: 2px;
        font-size: 28pt;
        margin: 0px;
        text-shadow: 1px 1px 0px #000, -1px 1px 0px #000, 1px -1px 0px #000, -1px -1px 0px #000, 0px 1px 0px #000, 0px -1px 0px #000, -1px 0px 0px #000, 1px 0px 0px #000, 2px 2px 0px 

#000, -2px 2px 0px #000, 2px -2px 0px black, -2px -2px 0px black, 0px 2px 0px black, 0px -2px 0px black, -2px 0px 0px black, 2px 0px 0px black, 1px 2px 0px black, -1px 2px 0px black, 

1px -2px 0px black, -1px -2px 0px black, 2px 1px 0px black, -2px 1px 0px black, 2px -1px 0px black, -2px -1px 0px black;
        color:#0fffff;

-webkit-animation:colorRotate 6s linear 0s infinite;
        -moz-animation:colorRotate 6s linear 0s infinite;
        -o-animation:colorRotate 6s linear 0s infinite;
        animation:colorRotate 6s linear 0s infinite;
    }

     
    @-webkit-keyframes colorRotate {
        from {
            color: rgb(255, 255, 255);
        }
        33% {
            color: rgb(117, 170, 219);
        }
		66% {
			color: rgb(252, 191, 73);
		}
        to {
            color: rgb(255, 255, 255);
        }
    }
     
     
    @-moz-keyframes colorRotate {
        from {
            color: rgb(255, 255, 255);
        }
        33% {
            color: rgb(117, 170, 219);
        }
		66% {
			color: rgb(252, 191, 73);
		}
        to {
            color: rgb(255, 255, 255);
        }
    }
     
    @-o-keyframes colorRotate {
           from {
            color: rgb(255, 255, 255);
        }
        33% {
            color: rgb(117, 170, 219);
        }
		66% {
			color: rgb(252, 191, 73);
		}
        to {
            color: rgb(255, 255, 255);
        }
    }
}