@charset "UTF-8";
/* ======================================= global ======================================= */

@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap");

:root {
   /* https://www.color-name.com/ https://www.colourlovers.com/palette/1606220/colorful_banaani */
   --primary: #9f111b;
   /* Encabezados */
   --secondary: #c60000;
   /* Ligas 524656 */
   --auxiliar: #524656;
   --contrast: #eb7b59;
   /* Contraste/hover */
   --text: #191919;
   /* Lotion */
   --background: #f9f9f9;
   /* Lotion */
   --beige: #eedfcc;
   /* AntiqueWhite2 */
}

body {
   font-family: "Open Sans", sans-serif;
   font-weight: 400;
   color: var(--text);
   background-color: var(--background);
}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-family: "Lato", Helvetica, sans-serif;
   color: var(--primary);
   font-weight: 700;
}

a {
   font-family: "Lato", Helvetica, sans-serif;
   font-weight: 500;
   color: var(--secondary);
}

a:hover {
   color: var(--contrast);
}

/* ======================================= header ======================================= */

#main_header {
   position: sticky;
   top: 0;
   background-color: var(--primary);
   color: var(--background);
}

#main_header h3 {
   color: var(--background);
}

#main_content {
   display: flex;
}

/* ======================================= right side ======================================= */

#right_side {
   display: flex;
   flex-direction: column;
}


/* ======================================= left side ======================================= */

/*#left_side { } */

.img_status {
   margin: 0.625rem;
   vertical-align: middle;
}

.nombre_equipo h3 {
   color: var(--auxiliar);
   margin: 0;
}

.nombre_suerte,
.nombre_suerte h3 {
   color: var(--background);
   background-color: var(--secondary);
}

.nombre_suerte h3 {
   display: inline-block;
}

div.nombre_suerte {
   margin: 1.625em auto;
}

table.table_stats {
   min-width: 86.78%;
   text-align: center;
}

table.table_stats,
table.table_stats th,
table.table_stats td {
   border: 1px var(--auxiliar) solid;
   border-collapse: collapse;
   border-spacing: unset;
}

.bkg-red {
   color: #f0f0f0;
   background-color: var(--secondary);
}

.text-red {
   color: var(--secondary);
}

.text-black {
   color: var(--text);
}

input[type="text"].big {
   height: 1.625rem;
   width: 1.625rem;
   font-size: large;
}

.size-small {
   width: 2.625rem;
}

.size-medium {
   width: 6.975rem;
   /*  4.35 6.975 */
}


p {
   margin: 2.625rem 0;
}

input[type='number']:disabled,
input[type='text']:disabled {
   border-width: 0;
}

.row-ishead>.col {
   text-align: center;
}


/* -------------------------------- */

#main_content div.row {
   padding-bottom: 0.625em;
}

input[type='number'].size-small {
   height: 2.625rem;
   width: 4.35rem;
   padding: 0.125rem;
   font-size: 1.0rem;
   text-align: center;
}