/* @import "@fortawesome/fontawesome-free/css/fontawesome.css";
@import '@fortawesome/fontawesome-free/css/regular.css';
@import '@fortawesome/fontawesome-free/css/solid.css';
@import '../../node_modules/@fortawesome/fontawesome-free/css/brands.css'; */




/* *********************** */
/* LOADING OVERLAY */
/* *********************** */
div#app {
  background: url('/imagenes/app/background-lightblue.jpg');
  background-position:top center;
  background-size:cover;
}

div.loading {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    min-height: 100%;
    float: left;
    z-index: 99999;
    /* min-height:4080px; */
    background-color: rgba(255, 255, 255, 0.98);
}

div.loading div.centrador {
    position: absolute;
    width: 240px;
    height: auto;
    text-align: center;
    margin: 0;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    animation: reveal 1s 0s ease both 1;
}

div.loading span.text {
    color: #545454;
    font-size: 1.3rem;
}


/* LOADER */
div.loading svg {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(45deg) scale(1);
          transform: translate(-50%, -50%) rotate(45deg) scale(1);
}

div.loading .stroke-still {
  stroke: #232323;
}

div.loading .stroke-animation {
  -webkit-animation: stroke-spacing 1.2s ease-in, stroke-color 4.8s linear;
          animation: stroke-spacing 1.2s ease-in, stroke-color 4.8s linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-delay: 0;
          animation-delay: 0;
  -webkit-animation-direction: normal;
          animation-direction: normal;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-play-state: running;
          animation-play-state: running;
  -webkit-transform-origin: center center;
          transform-origin: center center;
}

@-webkit-keyframes stroke-spacing {
  0% {
    stroke-dasharray: 0 200;
  }
  45% {
    stroke-dashoffset: 0;
    stroke-dasharray: 200 200;
  }
  90% {
    stroke-dashoffset: -200;
    stroke-dasharray: 200 200;
  }
  100% {
    stroke-dashoffset: -200;
    stroke-dasharray: 200 200;
  }
}

@keyframes stroke-spacing {
  0% {
    stroke-dasharray: 0 200;
  }
  45% {
    stroke-dashoffset: 0;
    stroke-dasharray: 200 200;
  }
  90% {
    stroke-dashoffset: -200;
    stroke-dasharray: 200 200;
  }
  100% {
    stroke-dashoffset: -200;
    stroke-dasharray: 200 200;
  }
}

@-webkit-keyframes stroke-color {
  0%  { stroke: #3498DB; }
  24% { stroke: #643232; }
  25% { stroke: #327864; }
  49% { stroke: #327864; }
  50% { stroke: #32326e; }
  74% { stroke: #32326e; }
  75% { stroke: #78325a; }
  99% { stroke: #78325a; }
}

@keyframes stroke-color {
  0%  { stroke: #3498DB; }
  24% { stroke: #643232; }
  25% { stroke: #327864; }
  49% { stroke: #327864; }
  50% { stroke: #32326e; }
  74% { stroke: #32326e; }
  75% { stroke: #78325a; }
  99% { stroke: #78325a; }
}


/* MAIN */

main {
  padding-top:60px;
  padding-bottom:60px;
  min-height:100vh;
}

div.top-menu {

}

div.top-menu span.app-name {
  font-size:1rem;
  text-transform: uppercase;
  letter-spacing: 3px;
  margin-left:30px;
}

div.top-menu img.logo {
  max-height:50px;
}

@media screen and (max-width: 600px) {
  div.top-menu img.logo {
    max-height:240px;
  }
}

div.full-width-btn-red {
  text-align: center;
  background-color: #de1118;
}

div.full-width-btn-blue,
.btn-full-width-blue {
  text-align: center;
  background-color: #1f1b96;
}

div.full-width-btn-green {
  text-align: center;
  background-color: #51aa43;
}

div.full-width-btn-yellow {
  text-align: center;
  background-color: #a28a25;
}

div.full-width-btn-grey {
  text-align: center;
  background-color: #2b2b2b;
}

div.full-width-btn-grey-light {
  text-align: center;
  background-color: #adadad;
}

div.full-width-btn-red:hover {
  background-color: #ff0008;
}

div.full-width-btn-blue:hover {
  background-color: #100e55;
}

div.full-width-btn-grey:hover {
  background-color: #111111;
}

div.full-width-btn-grey-light:hover {
  background-color: #747373;
}

.btn-add-hover,

div.full-width-btn-red:hover,

div.full-width-btn-blue:hover,

div.full-width-btn-green:hover,

div.full-width-btn-grey:hover,

div.full-width-btn-grey-light:hover {
  cursor:pointer;
}

div.bottom-rounded {
  /* border-bottom-left-radius: 10px; */
  /* border-bottom-right-radius: 10px; */
  border-bottom-left-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);
  border-bottom-right-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);
}

div.bottom-rounded-left {
  border-bottom-left-radius: 10px;
}

div.bottom-rounded-right {
  border-bottom-right-radius: 10px;
}

span.ver-mas
{
  font-size:1.4rem;
  text-transform: uppercase;
  letter-spacing: 3px;
  color:#ffffff;
}

div.card-header {
  text-align:center;
  font-size:1.4rem;
  text-transform:uppercase;
  background-color:#000000;
  color:#ffffff;
}

div.card-footer.bg-transparent {
  background-color:transparent;
  padding: 0;
  border-bottom:0;
}

div.row.no-margins {
  margin-left:0px;
  margin-right:0px;
  margin:0px;
}

div.my-btn {
  height:60px;
  vertical-align: center;
  justify-content: center;
  align-items: center;
  display: flex;
}

div.my-btn span {
  line-height:60px;
}

div.my-btn-left {
  border-right:1px solid #f1f1f1;
}

div.my-btn-right {
  border-left:1px solid #f1f1f1;

}

div.my-btn-center {
  border-left:1px solid #f1f1f1;
  border-right:1px solid #f1f1f1;

}

div.text-right {
  text-align: right;
}

div.text-left {
  text-align: left;
}

div.card.proximo {
  min-height:400px;
}


  @media screen and (max-width: 600px) {

    div.card-header {
      font-size:1rem;
    }

    div.card.proximo {
      margin-bottom:30px;
    }
  }


div.card.proximo::before {
  content: "";
  background:url('/imagenes/app/match-stadium.jpeg');
  background-size:cover;
  background-position:center center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.15;
}

div.card.proximo span {
  font-size:1.2rem;
}


div.card.proximo div.datos-partido {

}

div.card.proximo div.datos-partido ul {
  width:100%;
  margin-top:40px;
  padding-left:0px;
  background-color: rgba(1, 1, 1, 0.2);
}

div.card.proximo div.datos-partido ul li {
  font-size:1.4rem;
  text-decoration:none;
  list-style-type: none;
  border-top:1px solid #f1f1f1;
  border-bottom:1px solid #f1f1f1;
  width:100%;
  display:block;
  padding-left:15px;
  color:#2e2e2e;
}

div.card.ultimo {
  min-height:400px;
}

div.card.ultimo::before {
  content: "";
  background:url('/imagenes/app/match-stadium.jpeg');
  background-size:cover;
  background-position:center center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.1;
}

div.card.ultimo span {
  font-size:1.2rem;
}

div.card.ultimo div.datos-partido {

}

div.card.ultimo div.datos-partido ul {
  width:100%;
  margin-top:40px;
  padding-left:0px;
  background-color: rgba(1, 1, 1, 0.2);
}

div.card.ultimo div.datos-partido ul li {
  font-size:1.4rem;
  text-decoration:none;
  list-style-type: none;
  border-top:1px solid #f1f1f1;
  border-bottom:1px solid #f1f1f1;
  width:100%;
  display:block;
  padding-left:15px;
  color:#2e2e2e;
}



div.card.noticias::before {
  content: "";
  background:url('/imagenes/app/periodicos-min.jpg');
  background-size:cover;
  background-position:center center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.1;
}


div.card.clasificacion::before {
  content: "";
  background:url('/imagenes/app/chilena-cut.png');
  background-size:cover;
  background-position:center center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.15;
}

div.card.vitrina::before {
  content: "";
  background:url('/imagenes/app/vitrina-3.webp');
  background-size:cover;
  background-position:center top;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.15;
}

div.card.jornada::before {
  content: "";
  background:url('/imagenes/app/childrenscut.png');
  background-size:cover;
  background-position:left center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.2;
}




/* * HOME * */
/* NOTICIAS */


.profile-card-2 {
    /* width:100%; */
    width:auto;
    height:100%;
    max-height:360px;
    background-color: #FFF;
    box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.1);
    background-position: center center;
    background-size:cover;
    overflow: hidden;
    position: relative;
    margin: 0px;
    cursor: pointer;
    /* border-radius: 10px; */
}


.profile-card-2 img {
    transition: all linear 0.25s;
    width:100%;
    filter: contrast(70%);
}

.profile-card-2 .profile-name {
    position: absolute;
    left: 30px;
    bottom: 70px;
    font-size: 30px;
    color: #FFF;
    text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
    font-weight: bold;
    transition: all linear 0.25s;
}

.profile-card-2 .profile-icons {
    position: absolute;
    bottom: 30px;
    right: 30px;
    color: #FFF;
    transition: all linear 0.25s;
}

.profile-card-2 .profile-username {
    position: absolute;
    bottom: 50px;
    left: 30px;
    color: #FFF;
    font-size: 13px;
    transition: all linear 0.25s;
}

.profile-card-2 .profile-icons .fa {
    margin: 5px;
}

.profile-card-2:hover img {
    filter: grayscale(100%);
    opacity: 0.4;
}

.profile-card-2:hover .profile-name {
    bottom: 80px;
}

.profile-card-2:hover .profile-username {
    bottom: 60px;
}

.profile-card-2:hover .profile-icons {
    right: 40px;
}


.profile-card-2.mini {
  width: 100%;
  height:33%;
  max-height:120px;
  background-color: #FFF;
  box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.1);
  background-position: center center;
  overflow: hidden;
  position: relative;
  margin: 0px;
  cursor: pointer;
  /* border-radius: 10px; */
}

.profile-card-2.mini.guest {
  width: 100%;
  height:48%;
  max-height:180px;
  background-color: #FFF;
  box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.1);
  background-position: 40% center;
  overflow: hidden;
  position: relative;
  margin: 0px;
  cursor: pointer;
  /* border-radius: 10px; */
}

.profile-card-2.mini .profile-name {
  bottom: 50px;

}

.profile-card-2.mini .profile-username {
  bottom: 20px;
}

@media screen and (max-width: 600px) {

  .profile-card-2.mini {
    width: 100%;
    height:100%;
    max-height:200px;
    background-color: #FFF;
    box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.5);
    background-position: center center;
    overflow: hidden;
    position: relative;
    margin: 0px;
    cursor: pointer;
    /* border-radius: 10px; */
  }

  .profile-card-2.mini .profile-name {
    font-size:1.2rem;
    bottom: 50px;

  }

  .profile-card-2.mini .profile-username {
    bottom: 20px;
  }

}



.profile-card-2:hover .profile-name {
    bottom: 60px;
    color:#202020;
}

.profile-card-2:hover .profile-username {
    bottom: 40px;
    color:#202020;
}






.noselect {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
		-webkit-tap-highlight-color: transparent;
}

.bottom-menu button {
	width: 25%;
	height: 50px;
	cursor: pointer;
	font-size: 20px;
	font-family: 'Staatliches', cursive;
	letter-spacing: 5px;
	background: #de1118;
	border: 1px solid #ffffff;
	box-shadow: 0px 0px 0px rgba(0,0,0,0.4);
	transition: 500ms;
  color:#ffffff
}

.bottom-menu button:after {
	content: '';
	position: absolute;
	transform: translateX(-55px) translateY(-40px);
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background: transparent;
	box-shadow: 0px 0px 50px transparent;
	transition: 500ms;
}

.bottom-menu button:hover {
	transform: translateY(-5px);
	box-shadow: 0px 10px 10px rgba(0,0,0,0.4);
  background-color: #ff0000;
}

.bottom-menu button:hover:after {
	background: white;
	box-shadow: 0px 0px 20px #ffc421, 0px 0px 30px #d02e2e, inset 0px 0px 10px #cf3535;
	animation: spin 1s infinite linear;
}

@keyframes spin{
	25%{transform: translateX(-25px) translateY(-35px);
			width: 15px;
			height: 15px;}
	50% {transform: translateX(-55px) translateY(-30px);
			width: 5px;
			height: 5px;}
	75% {transform: translateX(-85px) translateY(-35px);
			width: 15px;
			height: 15px;}
}

.bottom-menu button:focus {
	outline: none;
}



/* ******************* */
/* CARD DATOS PARTIDO */
/* ******************* */


div.datos-partido li span.index {
  font-size:1rem;
}

div.card span.proximo-fecha {
    font-size: 1rem;
}

  @media screen and (max-width: 600px) {
    div.datos-partido li span.index {
      font-size:1rem;
    }
    div.datos-partido li span.index:after {
      content:"\a";
      white-space: pre;
    }
  }





  /* ******************* */
  /* -600 Especial Queries medias */
  /* ******************* */

  @media screen and (max-width: 600px) {

    .mobile-right {
      text-align:right!important;
    }
    .mobile-left {
      text-align:left!important;
    }
    .mobile-center {
      text-align:center!important;
    }
  }


  .top-submenu {
    top:80px!important;
  }

  .bottom-submenu {
    bottom:60px!important;
  }



  /* EVENTOS CSS */


div.match-goals {
  text-align: center;
}

div.match-goals span {
  line-height: 10rem;
  font-size: 8rem;
}

div.match-datos {
  text-align: center;
  width:100%;
}

div.match-datos div.small-row {
  position:relative;
  width:100%;
  text-align:center;
  font-size: 1.4rem;

}

div.match-datos div.small-row span {
  font-size: 1.4rem;
}

div.match-datos div.small-row span.resaltado {
  font-size: 1.4rem;
  color:#0f0f0f;

}

div.match-datos div.small-row-line {
  position:relative;
  width:100%;
  font-size: 1rem;
  color:#e9e9e9;

}


div.match-escudo {

}

div.match-escudo-text {
  padding-top:10px;
  text-align:center;
  font-size:1.2rem;
}


/* CARD NEXT MATCH */

div.card.match-next::before {
  content: "";
  background:url('/imagenes/app/match-stadium.jpeg');
  background-size:cover;
  background-position:center center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.1;
}

div.card.match-next {
  top:20px;
}

div.card.match-next .card-body {
  background-color:#1c1c1c;
}


div.card.match-next div.match-datos {
  text-align: center;
  width:100%;
}

div.card.match-next div.match-datos div.small-row {
  position:relative;
  width:100%;
  text-align:center;
  font-size: 1.4rem;

}

div.card.match-next div.match-datos div.small-row span {
  font-size: 1.4rem;
}

div.card.match-next div.match-datos div.small-row span.resaltado {
  font-size: 1.4rem;
  color:#0f0f0f;

}

div.card.match-next div.match-datos div.small-row-line {
  position:relative;
  width:100%;
  font-size: 1rem;
  color:#e9e9e9;

}


div.card.match-next div.match-escudo {

}

div.card.match-next div.match-escudo-text {
  padding-top:10px;
  text-align:center;
  font-size:0.8rem;
  color:#ffffff;
}


div.card.match-next div.match-escudo-text-x2 {
  padding-top:10px;
  text-align:center;
  font-size:1rem;
  color:#ffffff;
}

div.card.match-next div.row.teams {
  padding-bottom:10px;
  border-bottom:1px solid #d0513a;
}

div.card.match-next div.row.teams span.vs-text {
  position: relative;
  width: 100%;
  font-size: 4rem;
  color: #ededed;
  display: block;
}

div.card.match-next div.row.info {
  padding-top:12px;
}

/* CARD prev MATCH */

div.card.match-prev::before {
  content: "";
  background:url('/imagenes/app/match-stadium.jpeg');
  background-size:cover;
  background-position:center center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.1;
}

div.card.match-prev {
  top:20px;
}

div.card.match-prev .card-body {
  background-color:#1c1c1c;
}


div.card.match-prev div.match-datos {
  text-align: center;
  width:100%;
}

div.card.match-prev div.match-datos div.small-row {
  position:relative;
  width:100%;
  text-align:center;
  font-size: 1.4rem;

}

div.card.match-prev div.match-datos div.small-row span {
  font-size: 1.4rem;
}

div.card.match-prev div.match-datos div.small-row span.resaltado {
  font-size: 1.4rem;
  color:#0f0f0f;

}

div.card.match-prev div.match-datos div.small-row-line {
  position:relative;
  width:100%;
  font-size: 1rem;
  color:#e9e9e9;

}


div.card.match-prev div.match-escudo {

}

div.card.match-prev div.match-escudo-text {
  padding-top:10px;
  text-align:center;
  font-size:0.8rem;
  color:#ffffff;
}

div.card.match-prev div.match-escudo-text-x2 {
  padding-top:10px;
  text-align:center;
  font-size:1rem;
  color:#ffffff;
}

div.card.match-prev div.row.teams {
  padding-bottom:10px;
  border-bottom:1px solid #d0513a;
}

div.card.match-prev div.row.teams span.vs-text {
  position: relative;
  width: 100%;
  font-size: 4rem;
  color: #ededed;
  display: block;
}

div.card.match-prev div.row.teams div.score-text {
  position: relative;
  width: 100%;
  font-size: 2rem;
  color: #ededed;
  display: block;
}


div.card.match-prev div.row.info {
  padding-top:12px;
}

/* CARD all MATCH */

div.card.match-all::before {
  content: "";
  background:url('/imagenes/app/match-stadium.jpeg');
  background-size:cover;
  background-position:center center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.1;
}

div.card.match-all {
  top:20px;
}

div.card.match-all .card-body {
  background-color:#1c1c1c;
}


div.card.match-all div.match-datos {
  text-align: center;
  width:100%;
}

div.card.match-all div.match-datos div.small-row {
  position:relative;
  width:100%;
  text-align:center;
  font-size: 1.4rem;

}

div.card.match-all div.match-datos div.small-row span {
  font-size: 1.4rem;
}

div.card.match-all div.match-datos div.small-row span.resaltado {
  font-size: 1.4rem;
  color:#0f0f0f;

}

div.card.match-all div.match-datos div.small-row-line {
  position:relative;
  width:100%;
  font-size: 1rem;
  color:#e9e9e9;

}


div.card.match-all div.match-escudo {

}

div.card.match-all div.match-escudo-text {
  padding-top:10px;
  text-align:center;
  font-size:0.8rem;
  color:#ffffff;
}

div.card.match-all div.match-escudo-text-x2 {
  padding-top:10px;
  text-align:center;
  font-size:1rem;
  color:#ffffff;
}

div.card.match-all div.row.teams {
  padding-bottom:10px;
  border-bottom:1px solid #d0513a;
}

div.card.match-all div.row.teams span.vs-text {
  position: relative;
  width: 100%;
  font-size: 4rem;
  color: #ededed;
  display: block;
}

div.card.match-all div.row.teams div.score-text {
  position: relative;
  width: 100%;
  font-size: 2rem;
  color: #ededed;
  display: block;
}


div.card.match-all div.row.info {
  padding-top:12px;
}



/* ******************* */
/* -600 Especial Queries medias */
/* ******************* */

@media screen and (max-width: 800px) {

  div.container.top-menu {
    display:block;

  }

  div.container.top-menu span.app-name {
    font-size:1rem;
    letter-spacing: 1px;
    margin-left: 0px;
  }

  div.match-datos div.small-row {
    font-size: 1rem;

  }

}

div.second-menu {
  position:fixed;
  bottom: 0px!important;
  left:0px;
  width:100%;
}

/* DATOS SECTION - CARD JUGADORES STATS */

div.card.jugadores-stats td {
  font-size:1rem;
}

div.card.jugadores-stats td.small-font {
  font-size:0.8rem;
}

div.card.jugadores-stats td.small-font span.isLink:hover {
  cursor:pointer;
  color:#cb6640;
}

div.card.jugadores-stats th {
  font-size:0.8rem;
}

div.title-table {
  margin-bottom: 20px;
  margin-top: 20px;
  width:100%;
  text-align:center;
  background-color:#e6e0c3;
  padding:10px 0 10px 0;
  color:#333333;
  border-left:4px solid #c7ad50;
  border-right:4px solid #c7ad50;
}

div.card.jugadores-stats div.title-table {

}

div.card.jugadores-stats div.title-table span {
  font-size:0.8rem;
}


div.card.equipo-stats th {
  font-size:0.8rem;
}

div.card.equipo-stats div.title-table {

}

div.card.equipo-stats div.title-table span {
  font-size:0.8rem;
}






/* DATOS SECTION - CARD JUGADORES STATS */

div.card.jugador-stats td {
  font-size:1rem;
}

div.card.jugador-stats td.small-font {
  font-size:0.8rem;
}

div.card.jugador-stats th {
  font-size:0.8rem;
}

div.card.jugador-stats div.title-table {
  margin-bottom: 20px;
  width:100%;
}

div.card.jugador-stats div.title-table span {
  font-size:0.8rem;
}

div.card.jugador-stats table td.jugado {
  font-size:1.2rem;
}

div.card.jugador-stats table td.jugado.black {
  background-color:#000000;
  color:white;
}
div.card.jugador-stats table td.jugado.red {
  background-color:#c74b4b;
  color:white;
}
div.card.jugador-stats table td.jugado.orange {
  background-color:#db7a2b;
  color:white;
}
div.card.jugador-stats table td.jugado.green {
  background-color:#206016;
  color:white;
}


div.card.jugador-stats div.personales-texto-normal {
  border: 1px solid #b3b3b3;
}

div.card.jugador-stats div.personales-texto-normal .previo {
  background-color:#d7ceb5;
  color:#5d5d5d;
}

div.card.jugador-stats div.personales-texto-normal .col-9 {

}

div.card.jugador-stats div.personales-texto-destacado {

}

div.card.jugador-stats div.datos-player {
  margin-bottom:20px;
  margin-top:20px;
}

div.card.jugador-stats div.personales-texto-destacado .dorsal {
  font-size: 4rem;
  width:100%;
}

div.card.jugador-stats div.personales-texto-destacado .dorsal span.nick {
  font-size: 1.2rem;
}

div.card.jugador-stats div.personales-texto-noborder {
  padding-top:10px;
  border: 1px solid transparent;
  font-size:1.2rem;
}

/* ******************* */
/* -600 Especial Queries medias */
/* ******************* */

@media screen and (max-width: 800px) {

  div.card.jugador-stats div.personales-texto-noborder {
    text-align: center;
  }

}

div.card.jugador-stats div.personales-texto-noborder .icon {
  padding-top:4px;
}

div.card.jugador-stats div.personales-texto-noborder .icon i {
  font-size:24px;
}


div#pitch-positions {
  display:block;
  min-height:280px;
  background:url('/imagenes/app/football-pitch-vertical.jpg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center top;
  padding-left:10px;
  padding-right:10px;
}

div#pitch-positions .linea {
  min-height: 12.5%;
}

div#pitch-positions .linea div span {
  background-color: #d45932;
  color:#ffffff;
  padding: 8px;
  border-radius: 50%;
  box-shadow: 0px 4px 2px 1px rgba(0, 0, 0, 0.5);
  font-size:0.7rem;
}


/* ******************* */
/* -600 Especial Queries medias */
/* ******************* */

@media screen and (max-width: 800px) {

  div#pitch-positions {
    min-height:360px;
    padding-left:20px;
    padding-right:20px;
    margin-top:0px;
    margin-bottom:0px;

  }

}



/* CARD cuadro MATCH */

div.card.match-cuadro::before {
  content: "";
  background:url('/imagenes/app/match-stadium.jpeg');
  background-size:cover;
  background-position:center center;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.2;
}

div.card.match-cuadro {
  top:20px;
  margin-bottom:60px;
}

div.card.match-cuadro .card-body {
  background-color:#1c1c1c;
}


div.card.match-cuadro div.match-datos {
  text-align: center;
  width:100%;
}

div.card.match-cuadro div.match-datos div.small-row {
  position:relative;
  width:100%;
  text-align:center;
  font-size: 1.4rem;

}

div.card.match-cuadro div.match-datos div.small-row span {
  font-size: 1.4rem;
}

div.card.match-cuadro div.match-datos div.small-row span.resaltado {
  font-size: 1.4rem;
  color:#0f0f0f;

}

div.card.match-cuadro div.match-datos div.small-row-line {
  position:relative;
  width:100%;
  font-size: 1rem;
  color:#e9e9e9;

}


div.card.match-cuadro div.match-escudo {

}

div.card.match-cuadro div.card-footer {
  text-align: center;
}

div.card.match-cuadro div.match-escudo-text {
  padding-top:10px;
  text-align:center;
  font-size:0.8rem;
  color:#ffffff;
}

div.card.match-cuadro div.match-escudo-text-x2 {
  padding-top:10px;
  text-align:center;
  font-size:1rem;
  color:#ffffff;
}

div.card.match-cuadro div.row.teams {
  padding-bottom:10px;
  border-bottom:1px solid #d0513a;
}

div.card.match-cuadro div.row.teams span.vs-text {
  position: relative;
  width: 100%;
  font-size: 4rem;
  color: #ededed;
  display: block;
}

div.card.match-cuadro div.row.teams div.score-text {
  position: relative;
  width: 100%;
  font-size: 2rem;
  color: #ededed;
  display: block;
}


div.card.match-cuadro div.row.info {
  padding-top:12px;
}


div.text-middle {
  display: table-cell;
  height:4rem;
  vertical-align: middle;
  line-height: 4rem;
}

/* ******************* */
/* -600 Especial Queries medias */
/* ******************* */

@media screen and (max-width: 800px) {
  div.text-middle {
    display: table-cell;
    height:2rem;
    vertical-align: middle;
    line-height: 2rem;
  }
}


/* *************************** */
/* POST NOTICIAS               */
/* *************************** */

div.opened-noticia  {

}

div.opened-noticia .banner {
  margin-bottom:30px;
}

div.opened-noticia .banner .profile-card-2 {

}

div.opened-noticia .banner .profile-card-2 .profile-name {
  margin:0;
  left:0px;
  padding-left:30px;
  padding-top:20px;
  width:100%;
  background-color:rgba(87, 87, 87, 0.7);
}

div.opened-noticia .banner .profile-card-2 .profile-username {

  margin:0;
  left:0px;
  bottom:20px;
  padding-left:30px;
  padding-bottom:30px;
  width:100%;
  background-color:rgba(87, 87, 87, 0.7);
}

div.opened-noticia .banner .profile-card-2:hover .profile-name {
    bottom: 60px;
    color: #202020;
}
div.opened-noticia .banner .profile-card-2:hover .profile-username {
    bottom: 10px;
    color: #202020;
}

div.opened-noticia .title-div {
  margin-bottom:30px;
  padding: 10px 0 10px 0;
  border-top:1px solid #d5d5d5;
  border-bottom:1px solid #d5d5d5;
}

div.opened-noticia .title-div .title {
  font-size:1.2rem;
  color:#545454;
}

div.opened-noticia .title-div .subtitle {
  font-size:1rem;
  color:#8e8e8e;
}

div.opened-noticia .text {
  margin-bottom:30px;
}

div.opened-noticia .footer-div {
  margin-bottom:30px;
  padding: 10px 0 10px 0;
  border-top:1px solid #d5d5d5;
  border-bottom:1px solid #d5d5d5;
}

div.opened-noticia .footer-div .writen-by {
  font-size:0.8rem;
  color:#999999;
}

div.opened-noticia .footer-div .writen-by span {
  font-size:1rem;
  color:#4b5d62;
}

div.noticias-page .card {
  padding:1px;
  margin-bottom:30px;
}

div.noticias-page .card .card-body {
  padding:1px;
}



div.profile-page .card {
  margin-bottom:30px;
}

div.profile-page .card .card-body {

}

div.profile-page .card .card-body .profile-image {

  /* max-height:360px; */
}



.text-white {
  color:#ffffff;
}

.small-chars8 {
  font-size:0.8rem!important;
}

.small-chars6 {
  font-size:0.6rem!important;
}

.small-chars9 {
  font-size:0.9rem!important;
}

.chars1 {
  font-size:1rem!important;
}

.big-chars2 {
  font-size:1.2rem!important;
}
.big-chars3 {
  font-size:1.4rem!important;
}
.big-chars4 {
  font-size:1.8rem!important;
}
.big-chars5 {
  font-size:2rem!important;
}

.text-dark2 {
  color:rgba(33, 33, 33, 1);
  font-weight: bold;
}

.text-dark1 {
  color:rgba(57, 57, 57, 1);
  font-weight: bold;
}

td.back-grey {
  background-color:#505050;
  color:#ffffff;
}


.navbar-toggler {
    right: 20px;
    position: absolute;
    top: 20px;
}

/* JORNADAS */

.row-jornada {
  border:1px solid rgba(212, 229, 238, 0.8);
  background-color:rgba(0, 0, 0, 0.3);
  padding:12px 2px 12px 2px;
  margin:0px 0px 4px 0px;
  border-radius: 10px;
}

.row-jornada:hover {
  background-color:rgba(0, 0, 0, 0.6);
  cursor:pointer;
}


.time-jornada {
  border:1px solid rgba(212, 229, 238, 0.8);
  background-color:rgba(245, 244, 234, 0.6);
  padding:4px 2px 4px 2px;
  margin:2px 0px 4px 0px;
}

.escudo-jornada {
  border:1px solid rgba(212, 229, 238, 0);
  background-color:rgba(245, 244, 234, 0);
  padding:8px;
  margin:0px 0px 0px 0px;
  border-radius: 10px;

}

.row-jornada:hover .escudo-jornada {
  background-color:rgba(245, 244, 234, 0.1);
}

.score-jornada {
  border:1px solid rgba(212, 229, 238, 1);
  background-color:rgba(155, 207, 103, 0.1);
  padding:4px 2px 4px 2px;
}

.row-jornada:hover .score-jornada {
  background-color:rgba(245, 244, 234, 0.8);
}


/* Ver partido liga */

.goal-left {
  position:relative;
  width:100%;
  left:0px;
  padding-right:20%;
  display:inline-block;
}

.goal-right {
  position:relative;
  width:100%;
  right:0px;
  padding-left:20%;
  display:inline-block;
}

.score-text-liga {
  background-color:rgba(255, 255, 255, 0.1);
  font-size: 5rem!important;
}

/* ******************* */
/* -600 Especial Queries medias */
/* ******************* */

@media screen and (max-width: 800px) {
    .score-text-liga {
      background-color:rgba(255, 255, 255, 0.1);
      font-size: 1.7rem!important;
    }
}


/* Comments match */

.g-height-50 {
    height: 50px;
}

.g-width-50 {
    width: 50px !important;
}

@media (min-width: 0){
    .g-pa-30 {
        padding: 2.14286rem !important;
    }
}

.g-bg-secondary {
    background-color: #fafafa !important;
}

.u-shadow-v18 {
    box-shadow: 0 5px 10px -6px rgba(0, 0, 0, 0.15);
}

.g-color-gray-dark-v4 {
    color: #777 !important;
}

.g-font-size-12 {
    font-size: 0.85714rem !important;
}

.media-comment {
    margin-top:20px
}

.comment-text-comment {
  font-size:1rem;
  color:rgba(103, 103, 103, 1);
  border:1px solid rgba(235, 235, 235, 1);
  padding:10px 10px;
  border-radius: 10px;
}

/* span.btn-jornada */

/* div.cont-btn-jornada {
    position: relative;
    display: block;
    float: left;
    padding: 5px;
    border-radius: 6px;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(82, 82, 82, 1);
    text-align: center;
    margin-right: 8px;
}

div.cont-btn-jornada:hover {
  border:1px solid rgba(255, 255, 255, 1);
  background-color:rgba(22, 22, 22, 1);
  color:rgba(255, 255, 255, 1);
  cursor:pointer;
}

span.btn-jornada {
  position:relative;
  width:36px;
  font-size: 0.7rem;
} */

/* Jornadas Navigation Section - Professional Design */
.jornadas-navigation-section {
  margin: 25px 0 35px 0;
  position: relative;
}

.jornadas-title {
  text-align: center;
  margin-bottom: 20px;
}

.jornadas-title h5 {
  color: #2c3e50;
  font-weight: 600;
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.jornadas-title i {
  color: #353535;
  font-size: 1rem;
}

.jornadas-container {
  background: linear-gradient(135deg, 
    rgba(255, 255, 255, 0.95) 0%, 
    rgba(248, 249, 250, 0.95) 100%);
  backdrop-filter: blur(15px);
  border-radius: 10px;
  padding: 15px 0px;
  margin: 0 auto;
  border: 2px solid rgba(52, 152, 219, 0.1);
  box-shadow: 
    0 10px 40px rgba(0, 0, 0, 0.08),
    0 2px 8px rgba(0, 0, 0, 0.04);
  position: relative;
  overflow: hidden;
}

.jornadas-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, 
    #000000 0%, 
    #464646 25%, 
    #646464 50%, 
    #929292 75%, 
    #969696 100%);
  border-radius: 10px 10px 0 0;
}

.jornadas-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  align-items: center;
  padding: 0px 0;
}

.jornada-btn {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 2px solid transparent;
  background: linear-gradient(135deg, 
    #ffffff 0%, 
    #f8f9fa 100%);
  color: #737f8b;
  font-weight: 700;
  font-size: 15px;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 
    0 4px 15px rgba(0, 0, 0, 0.08),
    0 1px 3px rgba(0, 0, 0, 0.04);
  display: flex;
  align-items: center;
  justify-content: center;
}

.jornada-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, 
    transparent, 
    rgba(52, 152, 219, 0.15), 
    transparent);
  transition: left 0.6s ease;
}

.jornada-btn:hover {
  transform: translateY(-3px) scale(1.05);
  border-color: rgba(0, 0, 0, 0.3);
  background: linear-gradient(135deg, 
    rgba(52, 152, 219, 0.05) 0%, 
    rgba(255, 255, 255, 0.95) 100%);
  box-shadow: 
    0 8px 30px rgba(52, 152, 219, 0.15),
    0 4px 15px rgba(0, 0, 0, 0.1);
  color: #2c3e50;
}

.jornada-btn:hover::before {
  left: 100%;
}

.jornada-btn.active {
  background: linear-gradient(135deg, 
    #4b4b4b 0%, 
    #383838 100%);
  color: #d4d4d4;
  border-color: #707070;
  box-shadow: 
    0 8px 25px rgba(112, 112, 112, 0.4),
    0 4px 15px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  transform: translateY(-2px) scale(1.1);
  z-index: 2;
}

.jornada-btn.active::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 50%;
  transform: translateX(-50%);
  width: 8px;
  height: 8px;
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 
    0 0 15px rgba(255, 255, 255, 0.8),
    0 0 5px rgba(255, 255, 255, 1);
  animation: pulse-active 2s infinite;
}

@keyframes pulse-active {
  0%, 100% {
    opacity: 1;
    transform: translateX(-50%) scale(1);
  }
  50% {
    opacity: 0.7;
    transform: translateX(-50%) scale(1.2);
  }
}

.jornada-btn:active {
  transform: translateY(-1px) scale(1.02);
  transition: transform 0.1s;
}

.jornada-btn:focus {
  outline: none;
  box-shadow: 
    0 0 0 3px rgba(54, 54, 54, 0.2),
    0 4px 15px rgba(0, 0, 0, 0.08);
}

/* Responsive Design */
@media (max-width: 768px) {
  .jornadas-container {
    padding: 15px;
    margin: 0 10px;
  }
  
  .jornada-btn {
    width: 35px;
    height: 35px;
    font-size: 14px;
  }
  
  .jornadas-wrapper {
    gap: 8px;
  }
  
  .jornadas-title h5 {
    font-size: 1rem;
  }
}

@media (max-width: 480px) {
  .jornadas-navigation-section {
    margin: 20px 0 25px 0;
  }
  
  .jornadas-container {
    padding: 12px;
    margin: 0 5px;
    border-radius: 10px;
  }
  
  .jornada-btn {
    width: 30px;
    height: 30px;
    font-size: 13px;
    border-radius: 10px;
  }
  
  .jornadas-wrapper {
    gap: 6px;
  }
  
  .jornadas-title h5 {
    font-size: 0.9rem;
    flex-direction: column;
    gap: 4px;
  }
}

/* Loading and Content Transitions */
#jornada-loading {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 15px;
  margin: 20px 0;
  animation: fadeIn 0.3s ease-in;
}

#jornada-dynamic-content {
  animation: fadeIn 0.5s ease-in;
}

.jornada-content-container {
  animation: slideInUp 0.4s ease-out;
}

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

@keyframes slideInUp {
  from { 
    opacity: 0;
    transform: translateY(20px); 
  }
  to { 
    opacity: 1;
    transform: translateY(0); 
  }
}

.no-sanctions-message {
  text-align: center;
  padding: 20px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  margin: 15px 0;
  color: #495057;
}

div.cont-btn-jornada.finales {
  position:relative;
  display:block;
  float:left;
  padding:0px;
  padding-top:6px;
  border-radius: 6px;
  width: auto;
  height: 48px;
  border:1px solid rgba(82, 82, 82, 1);
  text-align: center;
  margin-right: 4px;
  margin-bottom: 4px;
}

div.cont-btn-jornada.finales:hover {
  border:1px solid rgba(255, 255, 255, 1);
  background-color:rgba(22, 22, 22, 1);
  color:rgba(255, 255, 255, 1);
  cursor:pointer;
}

span.btn-jornada.finales {
  position:relative;
  width:auto;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 1.2rem;
}


div.equipos .team-escudo {

}

div.equipos .team-escudo:hover {
  background-color:rgba(255, 255, 255, 0.15);
  cursor:pointer;
}

div.equipos .team-escudo img {
  transition: transform .3s; /* Animation */
  filter: grayscale(60%);
}

div.equipos .team-escudo:hover img {
  transform: scale(1.5);
  filter: grayscale(0%);
}

div.equipos .team-escudo.active img {
  transform: scale(1.5);
  filter: grayscale(0%);
}

div.equipos .escudo {

}

div.equipos .acronimo {
  margin-top:40px;
  font-size: 2rem;
}

div.equipos .match-desc {
  width:100%;
  font-size: 0.8rem;
  text-align: center!important;
}

div.equipos .row-jornada:hover .match-desc {
  color:rgba(255, 255, 255, 1);
}

#contenido-vista-equipo {
  min-width:100%;
}


table#table-jugadores tr {
  border-top: 2px solid transparent;
  border-bottom: 2px solid transparent;
}

table#table-jugadores tr:hover {
  border-top: 2px solid rgba(149, 162, 27, 1)!important;
  border-bottom: 2px solid rgba(149, 162, 27, 1)!important;
  cursor:pointer;
}

table#table-jugadores tr td {
  vertical-align: middle!important;
  line-height: 40px;
  height:40px;
}

table#table-jugadores tr td.pos {
  padding-left:20px;
}

table#table-jugadores tr td.nombre {
  font-size:1.2rem;
  font-weight: bolder;
}

table#table-jugadores tr td.goles {
  font-size:1rem;
  font-weight: bolder;
  color:rgba(255, 255, 255, 1);
  background-color: rgba(34, 34, 34, 1);
}

table#table-jugadores tr td.pos.Portero {
  background-color: rgba(74, 204, 126, 0.6);
}

table#table-jugadores tr td.pos.Defensa {
  background-color: rgba(74, 185, 204, 0.6);
}

table#table-jugadores tr td.pos.Centrocampista {
  background-color: rgba(204, 183, 74, 0.6);
}

table#table-jugadores tr td.pos.Delantero {
  background-color: rgba(204, 78, 74, 0.6);
}


div.one-player {
  margin-top:8px!important;
  margin-bottom:8px!important;
}

div.one-player .p-row {
  width:100%;
}

div.one-player .p-row span {
  width:100%;
}

div.one-player .p-row span.small{
  font-size:0.8rem;
}

div.one-player .p-row span.v-black{
  font-weight: bolder;
}

div.one-player span.v-dorsal {
  position:absolute;
  left:-20px;
  text-align: center;
  padding-top:4px;
  padding-bottom:4px;
  min-width: 30px;
  /* background-color: rgba(40, 40, 40, 0.8); */
  color:rgba(255, 255, 255, 1);
  font-weight: bolder;
  border-radius: 50%;
}

div.one-player input {
  position:absolute;
  left:10px;
  top:0px;
  text-align: center;
  padding-top:4px;
  padding-bottom:4px;
  min-width: 30px;
  /* background-color: rgba(40, 40, 40, 0.8); */
  color:rgba(255, 255, 255, 1);
  font-weight: bolder;
  border-radius: 50%;
}



div.one-player span.v-dorsal.down {
  position:absolute;
  left:-36px;
  top: 100px;
}

div.one-player img.v-team {
  position:absolute;
  right:0px;
  bottom:0px;
  text-align: center;
  padding-top:4px;
  padding-bottom:4px;
  min-width: 30px;
}

div.one-player span.v-dorsal.pos.Portero {
  background-color: rgba(74, 204, 126, 0.9);
}

div.one-player span.v-dorsal.pos.Defensa {
  background-color: rgba(74, 185, 204, 0.9);
}

div.one-player span.v-dorsal.pos.Centrocampista {
  background-color: rgba(204, 183, 74, 0.9);
}

div.one-player span.v-dorsal.pos.Delantero {
  background-color: rgba(204, 78, 74, 0.9);
}

div.one-player .p-row span span.destacado {
  font-weight: bold;
  font-size: 18px;
  padding-left:3px;
  color:rgba(74, 74, 74, 1);
  padding-right: 23px;
}

div.one-player .p-row img {
  left:0px;
  margin-right: 20px;
}



.whatsapp_btn {
    background-image: url('icon.png');
    border: 1px solid rgba(0, 0, 0, 0.1);
    display: inline-block !important;
    position: relative;
    font-family: Arial,sans-serif;
    letter-spacing: .4px;
    cursor: pointer;
    font-weight: 400;
    text-transform: none;
    color: #fff;
    border-radius: 2px;
    background-color: #5cbe4a;
    background-repeat: no-repeat;
    line-height: 1.2;
    text-decoration: none;
    text-align: left;
}

.whatsapp_btn_small {
    font-size: 12px;
    background-size: 16px;
    background-position: 5px 2px;
    padding: 3px 6px 3px 6px;
}

.whatsapp_btn_medium {
    font-size: 16px;
    background-size: 20px;
    background-position: 4px 2px;
    padding: 4px 6px 4px 6px;
}

.whatsapp_btn_large {
    width:100%;
    font-size: 16px;
    background-size: 20px;
    background-position: 5px 5px;
    text-align:center;
    padding: 10px 10px 10px 10px;
    color: #fff;
}
a.whatsapp { color: #fff;}


a.stadium-link {
  color:white;
  font-size: 1rem;
}

a.stadium-link:visited {
  color:white;
  font-size: 1rem;
}

/* ******************* */
/* -600 Especial Queries medias */
/* ******************* */

@media screen and (max-width: 800px) {
  div.jornadas-menu {
    display: block;
    margin-left: 5%;
    width: 90%;
  }

  .to-front {
    z-index:999;
  }

  div.cont-btn-jornada {
    position:relative;
    display:block;
    float:left;
    padding:0px;
    padding-top:0px;
    border-radius: 6px;
    width: 28px;
    height: 28px;
    border:1px solid rgba(82, 82, 82, 1);
    text-align: center;
    margin-right: 4px;
    margin-bottom: 4px;
  }

  div.cont-btn-jornada:hover {
    border:1px solid rgba(255, 255, 255, 1);
    background-color:rgba(22, 22, 22, 1);
    color:rgba(255, 255, 255, 1);
    cursor:pointer;
  }

  span.btn-jornada {
    position:relative;
    width:28px;
    font-size: 0.6rem;
  }

  div.cont-btn-jornada.finales {
    position:relative;
    display:block;
    float:left;
    padding:0px;
    padding-top:6px;
    border-radius: 6px;
    width: auto;
    height: 28px;
    border:1px solid rgba(82, 82, 82, 1);
    text-align: center;
    margin-right: 4px;
    margin-bottom: 4px;
  }

  div.cont-btn-jornada.finales:hover {
    border:1px solid rgba(255, 255, 255, 1);
    background-color:rgba(22, 22, 22, 1);
    color:rgba(255, 255, 255, 1);
    cursor:pointer;
  }

  span.btn-jornada.finales {
    position:relative;
    width:auto;
    padding-left: 4px;
    padding-right: 4px;
    font-size: 0.6rem;
  }

}