/*  
------------------------------------------------------------------------------------------------
Abajo es Area de pruebas
---------------------------------------------------------------------------------------------
*/


/* Variebles de colores */

:root {
  --green: #005959;
  --teal: #75C7CF;
  --magenta: #CF1DB4;

  --green-dark: #004747;
  --green-light: #0a7a7a;

  --text-dark: #1a1a1a;
}

/* 
Estilos generales
*/ 
h1, h2, h3 {
  color: var(--green);
}

.brand-text {
  color: var(--green) !important;
}


/*
   Botones
 */
.btn-primary {
  background-color: var(--green) !important;
  border-color: var(--green-dark) !important;
}

.btn-primary:hover {
  background-color: var(--teal) !important;

}



/* 
   Menu lateral
 */

/* =========================
   SIDEBAR (MENÚ LATERAL)
========================= */


                    /* PRUEBA INTERNA EN ESTA AREA PARA ELC OLOR AZUL RARO*/
                    

.nav-sidebar .nav-link,
.nav-sidebar .nav-link:hover,
.nav-sidebar .nav-link:focus,
.nav-sidebar .nav-link:active {
  background-color: transparent;
  color: inherit;
  outline: none !important;
  box-shadow: none !important;
}


/* Extra */
a {
  transition: none !important;
}

                    /* FIN DE PRUEBA ESPECIFICA*/




.nav-sidebar .nav-link {
  border-radius: 10px;
  margin: 6px 10px;
  transition: all 0.3s ease;
}

.nav-sidebar .nav-link:hover,
.nav-sidebar .nav-link:focus {
  background-color: var(--green-light) !important;
  color: #fff !important;
  transform: translateX(5px);
}

.nav-sidebar .nav-link.active {
  background-color: var(--green) !important;
  color: #fff !important;
  box-shadow: 0 4px 10px rgba(0, 89, 89, 0.3) !important;
}

.nav-sidebar .nav-link i {
  transition: color 0.3s ease;
}

.nav-sidebar .nav-link:hover i {
  color: var(--teal);
}

.nav-sidebar .nav-link.active i {
  color: #fff !important;
}

/* -------------------------------------------------------------------------------------------------------
   TABLAS
   --------------------------------------------------------------------------------------------
 */


.table thead {
  background-color: var(--green-light);
}


/*  
--------------------------------------------------
DASHBOARD
----------------------------------------------------

*/

.table thead th {
  background-color: var(--green) !important;
  color: #fff !important;
}



/* Tablas de    "Bitacora" que abarcan show 25 rows/ Excel/ Imprimir/ Columnas */




.dt-buttons .btn {
  background-color: var(--green) !important;
  border-color: var(--green-dark) !important;
  color: #fff !important;
}

.dt-button-collection 

/* Retoque */

.dt-buttons .btn {
  background-color: var(--green) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  margin-right: 5px;
  transition: all 0.3s ease;
}

.dt-buttons .btn:hover {
  background-color: var(--green-light) !important;
  transform: translateY(-2px);
}

/* Parte interna del apartado de "columnas"*/

/* Fondo del dropdown */
.dt-button-collection {
  background-color: var(--teal) !important;
  border: none !important;
}

/* Items dentro del dropdown */
.dt-button-collection .dropdown-item {
  color: #000 !important;
  background-color: transparent !important;
}

/* Hover en items */
.dt-button-collection .dropdown-item:hover {
  background-color: var(--green) !important;
  color: #fff !important;
}

.dt-buttons .btn.active,
.dt-buttons .btn:active,
.dt-buttons .btn.show {
  background-color: var(--teal) !important;
  color: #000 !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}


.dataTables_length select {
  border-radius: 8px;
  padding: 4px 8px;
  border: 1px solid var(--green);
  color: var(--green);
}

/* Focus */
.dataTables_length select:focus {
  outline: none;
  border-color: var(--green-light);
  box-shadow: 0 0 5px rgba(0, 89, 89, 0.3);
}

.dt-buttons {
  margin-bottom: 10px;
}

/* ---------------------------------------------------------------------------------------------
   SIDEBAR
   -------------------------------------------------------------------------------------------
 */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active {
  background-color: var(--green);
  color: #fff;
}

/*

/* 
------------------------------------------------------------------------------------
PAGINACIÓN
-------------------------------------------------------------------------------------

*/ 
/* Botones base */
.dataTables_wrapper .pagination .page-link {
  color: var(--green) !important;
  background-color: transparent !important;
  border: none !important;
}

/* Hover */
.dataTables_wrapper .pagination .page-link:hover {
  background-color: var(--green-light) !important;
  color: #fff !important;
}

/* Cuando esta zctivo */
.dataTables_wrapper .pagination .page-item.active .page-link {
  background-color: var(--green) !important;
  color: #fff !important;
  border: none !important;
}

/* Esto es por si sale algo en azul espero ayude a quitarlo */
.dataTables_wrapper .pagination .page-link:focus {
  box-shadow: none !important;
  outline: none !important;
}

/* Crea un redondeo en los botones */
.dataTables_wrapper .pagination .page-link {
  border-radius: 8px;
  margin: 0 3px;
}


/*

*******************************************************************************
Fin de Area de Pruebas
***********************************************************************************

*/
.balance-info {
    border: 1px solid #666;
    border-radius: 20px;
}
.bg-duelazo {
	background: url('/images/bg/background11.png') repeat center center;
}
.bg-primary {
  background-color: var(--green) !important;
}

.bg-secondary {
  background-color: rgba(117, 199, 207, 0.3) !important;
}


/*  */
.brand-text {
    font-weight: 500 !important;
    font-style: normal !important;
    font-size: 14pt !important;
    color: #103061 !important;
    margin-bottom: 2px;
}



.btn-save-phase2 {
    position: absolute;
    top: 420px;
    left: 590px;
}
.c-primary{
	color: #013369 !important;
}
.c-secondary{
	color: rgba(2, 87, 229, 0.3) !important;
}
.c-black {
	color: #000000 !important;
}
.c-blue {
    color: #62D1F4;
}
.c-gray-dark {
    color: #333333;
}
.c-gray-light {
    color: #cccccc;
}
.c-green {
    color: #62F48B;
}
.c-red {
    color: #E8516C;
}
.c-white {
	color: #FFFFFF !important;
}
.c-yellow {
    color: #EBBC70;
}
.card-item {
    background-color: rgba(18, 55, 77, 0.7);
    border-radius: 25px;
    position: absolute;
    width: 128px;
    height: 48px;
}
.card-primary.card-outline {
    border-top: 3px solid #011036;
}
.cur-pointer{
	cursor: pointer;	
}
.display-inline {
    display: inline;
}
.fs-0_8 {
    font-size: 0.8rem;
}
.fs-0_9 {
    font-size: 0.9rem;
}
.fs-1_0 {
    font-size: 1.0rem;
}
.item-icon {
    position: absolute;
    right: 8px;
    top: 18px;
    text-align: center;
    width: 10px;
    font-size: 10px;
}
.item-img {
    position: absolute;
    left: 16px;
    top: 12px;
    text-align: left;
    width: 26px;
    height: 26px;
}
.item-text {
    position: absolute;
    left: 6px;
    top: 12px;
    text-align: center;
    width: 114px;
}
.left-78 {
    left: 78px;
}
.left-181 {
    left: 181px;
}
.left-182 {
    left: 182px;
}
.left-238 {
    left: 238px;
}
.left-349 {
    left: 349px;
}
.left-351 {
    left: 351px;
}
.left-366 {
    left: 366px;
}
.left-408 {
    left: 408px;
}
.left-426 {
    left: 426px;
}
.left-586 {
    left: 586px;
}
.left-606 {
    left: 606px;
}
.left-662 {
    left: 662px;
}
.left-789 {
    left: 789px;
}
.left-864 {
    left: 864px;
}
.left-960 {
    left: 960px;
}
.left-1032 {
    left: 1032px;
}
.left-1034 {
    left: 1034px;
}
.left-1092 {
    left: 1092px;
}
.left-1196 {
    left: 1196px;
}
.left-1198 {
    left: 1198px;
}
.left-1258 {
    left: 1258px;
}
.loading-invisible {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
	opacity: 0.8;
	background-color: #011036;
}
.loading-spinner {
	position: absolute;
	top: 40%;
	left: 50%;
	width: auto;
	height: 100px;
}
.loading-text {
	width: auto;
	height: 100px;
	text-align: center;
	margin: 0 auto;
}
.mrg-lr-10 {
	margin: 0 10px;
}
.mrg-top-10 {
	margin-top: 10px;
}
.mrg-top-20 {
	margin-top: 20px;
}
.mrg-top-30 {
	margin-top: 30px;
}
.pad-left-30 {
    padding-left: 30px;
}
.pad-lr-10 {
	padding: 0 10px;
}
.pad-top-32 {
	padding-top: 32px;
}
.pos-abs {
	position: absolute;
}
.pos-rel {
	position: relative;
}
.scroll-horizontal {
	overflow-x: auto;
}
.scroll-vertical {
	overflow-y: auto;
}
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active {
    background-color: rgba(2, 87, 229, 0.3);
    color: #343a40;
}
.sport-selected {
	border: 5px solid #013369;
    border-radius: 10px;
    padding: 5px;
}
.team-coach {
	text-align: center;
}
.text-normal {
	font-weight: normal !important;
}
.top-18neg{
    top: -18px;
}
.top-0{
    top: 0;
}
.top-50{
    top: 50px;
}
.top-84{
    top: 84px;
}
.top-97{
    top: 97px;
}
.top-120{
    top: 120px;
}
.top-168{
    top: 168px;
}
.top-174{
    top: 174px;
}
.top-210{
    top: 210px;
}
.top-246{
    top: 246px;
}
.top-257{
    top: 257px;
}
.top-266{
    top: 266px;
}
.top-280{
    top: 280px;
}
.top-320{
    top: 320px;
}
.top-332{
    top: 332px;
}
.top-360{
    top: 360px;
}
.top-396{
    top: 396px;
}
.top-407{
    top: 407px;
}
.top-430{
    top: 430px;
}
.top-480{
    top: 480px;
}
.top-490{
    top: 490px;
}
.top-520{
    top: 520px;
}
.top-558{
    top: 558px;
}
.top-567{
    top: 567px;
}
.top-590{
    top: 590px;
}
.v-align-mid {
	vertical-align: middle;
}

@media (min-width: 480px) and (max-width: 768px) {
	.team-coach {
		text-align: center;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.team-coach {
		text-align: left;
	}
}

@media (min-width: 1024px) and (max-width: 1280px) {
	.team-coach {
		text-align: left;
	}
}

@media (min-width: 1280px) {
	.team-coach {
		text-align: left;
	}
}
@media only screen and (min-width: 1440px) {
    /* styles for browsers larger than 1440px; */
	.team-coach {
		text-align: left;
	}
}