@font-face {
    font-family: "BankGothicMdBT";
    font-weight: normal;
    src: url("/fonts/bank-gothic-medium-bt-2.ttf");
}

.video-inicio {
	padding-bottom: 200%;
    background: black;
    border-radius: 30px;
}

body {
	background: #fff;
	overflow: auto;
	max-height: 100vh;
	font-size: 0.9rem;
	background-color: var(--color-corporativo-1);
	color: #fff;
	font-family: 'BankGothicMdBT', sans-serif;
}

.imagen-play {
	
	cursor: pointer;
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    /* text-align: center; */
    width: 100%;
    height: 100%;
    color: #fa7268;
 	font-size: 2rem;
    align-items: center;
    justify-content: center;
/*	background-color: rgb(128, 128, 128, 0.2);*/
	
}

.clienteVideoConferenciaFecha {
	font-size: 0.9rem;
}

.imagen-play-icono {
		font-size: 1.3rem;
	}

@media ( min-width : 576px) {
	.imagen-play-icono {
		font-size: 1.6rem;
	}
}

@media ( min-width : 768px) {
	.imagen-play-icono {
		font-size: 1.8rem;
	}
}




.fa-play:before {
    margin-left: 2px;
}


/*Selección texto*/
::selection {
	background: var(--color-corporativo-2);
}

.btn {
	box-shadow: none!important;
}

/*.form-control {*/
/*	border: 2px solid #ced4da;*/
/*}*/

/* Anchear borde cuando hay error en selects. Tambien poner le mismo color que inputs. */
.bootstrap-select.is-invalid .dropdown-toggle, .error .bootstrap-select .dropdown-toggle, .has-error .bootstrap-select .dropdown-toggle, .was-validated .bootstrap-select .selectpicker:invalid+.dropdown-toggle {
    border-color: #dc3545;
/*    border-width: 2px;*/
    padding-right: calc(1.5em + .75rem);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}


.bootstrap-select.is-valid .dropdown-toggle, .was-validated .bootstrap-select .selectpicker:valid+.dropdown-toggle {
/*    border-width: 2px;*/
 	padding-right: calc(1.5em + .75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

/* Anchear borde cuando hay error en inputs */
.form-control.is-invalid, .was-validated .form-control:invalid {
/*	border-width: 2px;*/
}
.form-control.is-valid, .was-validated .form-control:valid {
/*	border-width: 2px;*/
}

.form-control:focus {
    border-color: #fa7268;
    box-shadow: 0 0 0 0.2rem rgba(250, 114, 104, 0.25);
} 

/*@font-face {*/
/*    font-family: "BankGothicMdBT";*/
/*    */
/*    src: url("/fonts/bold.ttf");*/
/*}*/

:root {
  --color-corporativo-1: #3b3b3b;
  --color-corporativo-2: #fa7268;
  --color-corporativo-3: #ffffff;
}

/*Cambios para los inputs de fechas, que no cabía*/
.year {
	font-size: 0.8rem;
}

.month {
	font-size: 0.8rem;
}

.day {
	font-size: 0.8rem;
}

/*Cambio para botón cerrar de modales*/
.close {
	color: #fff;
}

.close:hover {
	color: #fff;
}



.modal-content {
	background-color: #3b3b3b;
}



.custom-file-input ~ .custom-file-label::after {
	font-family: "Font Awesome 5 Free";
	content: "\f574";
	display: inline-block;
	padding-right: 3px;
	vertical-align: middle;
	font-weight: 900;
}

.custom-file-label-sm {
	height: calc(1.5em + .5rem + 2px);
	padding: .25rem .5rem;
	font-size: .875rem;
	line-height: 1.5;
	border-radius: .2rem;
}

.custom-file-label-sm::after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 3;
	display: block;
	height: calc(1.3em + .58rem + 2px);
	padding: .25rem .25rem;
	font-size: .875rem;
	line-height: 1.5;
	border-radius: .2rem;
	color: #495057;
	content: "Browse";
	background-color: #e9ecef;
	border-left: inherit;
	border-radius: 0 .25rem .25rem 0;
}

.btn-borrar-input:focus {
	box-shadow: none;
}

.btn-borrar-input {
	border-left: none;
	border-color: #ccc;
	background: #fff;
}

.fa-disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.input-daterange input {
	text-align: left !important;
}

/** Video **/
#videoContainer1 {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
}

#videoContainer2 {
	left: 0;
	right: 0;
	top: 0;
	width: 100%;
}

.filaTablaSeleccionada {
	background: rgba(0, 0, 0, .05) !important;
}

.bootstrap-select>.dropdown-menu {
	z-index: 1035;
}

.filter-option-inner-inner img {
	display: none;
}

#mensaje-plantilla {
	border-radius: 0;
	position: fixed;
	top: 0px;
	z-index: 0;
	width: 100%;
	opacity: 0;
}

a {
	color: #FA7268;
	text-decoration: none !important;
}

a:hover {
	color: #FA7268;
}

@media ( min-width : 0px) {
	#contenido {
		padding-top:105px;
		min-height: 100vh;
	}
	
	h1 {
		font-size: 1.5rem;
	}
	
	h5 {
		font-size: 1rem;
	}
}

@media ( min-width : 576px) {
	.container {
		max-width: 768px;
	}
	
	.navbar-expand-lg>.container {
		padding: 0 15px;
	}
	
	.navbar-expand-lg {
		padding: 0;
	}
	
	body {
		font-size: 1rem;
	}
	
	h1 {
		font-size: 1.8rem;
	}
	
	h5 {
		font-size: 1rem;
	}
	
}

@media ( min-width : 768px) {
	.container {
		max-width: 992px;
	}
	
	.navbar-expand-lg>.container {
		padding: 0 15px;
	}
	
	.navbar-expand-lg {
		padding: 0;
	}
	
	h1 {
		font-size: 2.5rem;
	}
	
	h5 {
		font-size: 1.25rem;
	}

}

@media ( min-width : 992px) {
	.container {
		max-width: 1200px;
	}
	
	.navbar-expand-lg>.container {
		padding: 0 15px;
	}
	
	.navbar-expand-lg {
		padding: 0;
	}
	
	#videoconferenciaRutinaZona {
		max-height: calc(100vh - 200px);
		overflow: auto;
	}
	
	#contenido {
		padding-top:135px;
		min-height: 100vh;
	}
}

@media ( min-width : 1200px) {
	.navbar-expand-lg>.container {
		padding: 0 15px;
	}
	.navbar-expand-lg {
		padding: 0;
	}
}


.navbar-blanco {
 	background: var(--color-corporativo-1);
	height: 60px;
}

.cursor-pointer {
	cursor: pointer;
}

#recepcion-indicaciones a {
	text-decoration: none;
	color: #FA7268;
}

/** TITULO **/
#submenu-titulo span {
/*	*/
	color: #FA7268;
	vertical-align: middle;
}

/** SUBMENU **/
#submenu-seccion-izquierda span {
/*	*/
	vertical-align: sub;
	color: #fff;
}

/** EJERCICIOS **/
.ejercicio {
	padding: 0px;
	position: relative;
	background-color: #fff;
}

.ejercicio-con-advertencia {
	border: 6px solid rgba(255, 0, 0, 0.5);
}

.ejercicio .advertencia-material-grande {
	position: absolute;
	top: 0;
	padding-left: 30px;
}

.ejercicio .nombre-grande {
	z-index: 500;
	margin-left: 0;
	padding: 2px;
	text-align: center;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 40px;
	background-color: rgba(0, 0, 0, 0.3);
	font-size: 0.9rem;
	line-height: 1rem;
}

.ejercicio .advertencia-material-pequenho {
	position: absolute;
	top: 0;
}

.ejercicio .nombre-pequenho {
	z-index: 500;
	margin-left: 0;
	padding: 2px;
	text-align: center;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 35px;
	background-color: rgba(0, 0, 0, 0.3);
	font-size: 0.7rem;
	line-height: 1rem;
}

.ejercicio-uso-actual {
	background-color: rgba(0, 0, 0, 0.9) !important;
	color: #fff !important;
}

.ejercicio-uso-actual.dropdown-item:hover, .ejercicio-uso-actual.dropdown-item:focus {
	background-color: rgba(0, 0, 0, 1.0) !important;;
	color: #fff !important;
}

.ejercicio-uso-un-mes {
	background-color: rgba(255, 0, 0, 0.8) !important;
	color: #fff !important;
}

.ejercicio-uso-un-mes.dropdown-item:hover, .ejercicio-uso-un-mes.dropdown-item:focus {
	background-color: rgba(255, 0, 0, 0.9) !important;;
	color: #fff !important;
}

.ejercicio-uso-dos-meses {
	background-color: rgba(255, 153, 0, 0.9) !important;
	color: #fff !important;
}

.ejercicio-uso-dos-meses.dropdown-item:hover, .ejercicio-uso-dos-meses.dropdown-item:focus {
	background-color: rgba(255, 153, 0, 1.0) !important;;
	color: #fff !important;
}

.ejercicio-uso-tres-meses {
	background-color: rgba(0, 204, 0, 0.9) !important;
	color: #fff !important;
}


.ejercicio-uso-tres-meses.dropdown-item:hover, .ejercicio-uso-tres-meses.dropdown-item:focus {
	background-color: rgba(0, 204, 0, 1.0) !important;;
	color: #fff !important;
}


.ejercicio-uso-cuatro-doce-meses {
	background-color: rgba(15, 76, 129, 0.8) !important;
	color: #fff !important;
}


.ejercicio-uso-cuatro-doce-meses.dropdown-item:hover, .ejercicio-uso-cuatro-doce-meses.dropdown-item:focus {
	background-color: rgba(15, 76, 129, 0.9) !important;
	color: #fff !important;
}


.ejercicio .nombre span {
	color: white;
	width: 100%;
}

.ejercicio .foto {
	object-fit: scale-down;
}

.ejercicio .video {
	object-fit: scale-down;
}

/** EJERCICIOS **/

/** EDITOR RUTINAS **/
.rutina-fase-grupo-ejercicio-pie .dropdown-toggle::after {
	content: none;
}

.rutina-fase-grupo-ejercicio-pie .btn-select,
	.rutina-fase-grupo-ejercicio-pie .input-group-text,
	.rutina-fase-grupo-ejercicio-pie textarea {
	border: none;
	background: transparent;
}

/** EDITOR RUTINAS **/

/** MENU SUPERIOR **/
nav .dropdown-toggle::after {
	content: none;
}

/** TAB **/
.nav-tabs {
	border: none;
	width: 100%;
}

.nav-tabs .nav-link {
	border: none;
	padding: .5rem .5rem;
}

.nav-tabs .nav-link.active {
	border-bottom: 2px solid #FA7268;
	color: #fff;
	background-color: transparent;
}

/** BOOSTRAP DATETIMEPICKER **/

/*Tabla*/
table .datetimepicker-input {
	background-color: transparent;
	background-clip: padding-box;
	border: none;
}

.bootstrap-datetimepicker-widget table td.active {
    background-color: var(--color-corporativo-2) !important; 
}


.bootstrap-datetimepicker-widget table tr:hover{
	   color: #495057 !important; 
}

/** BOOSTRAP DATETIMEPICKER **/

/** BOOSTRAP SELECT **/

/*General*/
.btn-select {
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
}

/*Tabla*/
table .btn-select {
	background-color: transparent;
	background-clip: padding-box;
	border: none;
}

table .form-control {
	background: transparent;
}

.table td, .table th {
	vertical-align: middle;
	font-weight: normal;
}

.form-control-sm.bootstrap-select .dropdown-item {
	font-size: .875rem;
}

.bootstrap-select .active .dropdown-item:hover {
	color: #fff;
	background: var(--color-corporativo-2);
}

.bootstrap-select .dropdown-item:focus {
	color: #fff;
	background: var(--color-corporativo-2);
}

.bootstrap-select .active .dropdown-item {
	color: #fff;
	background: var(--color-corporativo-2);
}
/** BOOSTRAP SELECT **/

/** BOTONES **/
.btn-redondeado-debajo {
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: .25rem;
	border-bottom-right-radius: .25rem;
}

.btn-no-redondeado {
	border-radius: 0px;
}

.btn-azul {
	color: var(--color-corporativo-3);
	background-color: var(--color-corporativo-1);
	border-color: var(--color-corporativo-1);
}

.btn-azul:hover {
	color: var(--color-corporativo-3);
	background-color: var(--color-corporativo-1);
}



.btn-azul:focus {
	box-shadow: none;
}

.btn-coral {
	color: #fff;
	background-color: #FA7268;
	border-color: #FA7268;
}

.btn-coral:hover {
	color: #fff;
	background-color: #f94639;
}

.btn-coral:focus {
	box-shadow: none;
}

.btn-outline-azul {
	color: 76b7ef;
	border-color: #76b7ef;
}

.btn-outline-azul:hover {
	color: white;
	background: #76b7ef;
}

.btn-outline-blanco {
	color: #fff;
	border-color: #fff;
}

.btn-outline-blanco:hover {
	color: fff;
	background: #fff;
}

.btn-outline-coral {
	color: #FA7268;
	border-color: #FA7268;
}

.btn-outline-coral:hover {
	color: white;
	background: #FA7268;
}

.btn-outline-amarillo {
	color: #cccc00;
	border-color: #cccc00;
}

.btn-outline-amarillo:hover {
	color: white;
	background: #cccc00;
}

/** BOTONES **/
.card-body {
	padding-top: 0.8rem !important;
}


/* BANNER COOKIES */
#cookies_banner {
	position: fixed;
	bottom: 0px;
	left: 0;
	right: 0;
	background-color: rgba(255, 255, 255, 1);
	box-shadow: 0 -3px 10px rgba(0, 0, 0, 0.1);
	z-index: 10000;
	display: none;
}

#cookies_banner_link {
/*	*/
	color: #0F4C81;
}

#cookies_banner_texto {
	text-align: left;
	max-width: 1050px;
	margin: 0 auto;
	color: #3b3b3b;
}

#cookies_banner_botones {
	text-align: right;
	max-width: 1050px;
	margin: 10px auto 0 auto;
}


/** RECEPCION **/
.rutina-presentacion-titulo {
/*	*/
	z-index: 500;
	margin-left: 0;
	margin-right: 0;
	padding: 8px 4px 8px 4px;
	text-align: center;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 40px;
	color: white;
	background-color: rgba(0, 0, 0, 0.5);
}

.rutina-presentacion-rutina-normal {
	opacity: 0.7;
}

.rutina-fase-repeticion-ejercicio-sin-ejercicio-compatible {
	animation: rutina-fase-repeticion-ejercicio-sin-ejercicio-compatible-efecto 1s linear 0s infinite;
}

@keyframes rutina-fase-repeticion-ejercicio-sin-ejercicio-compatible-efecto { 
	50% {
		opacity: 0.5;
	}
}

.rutina-fase-repeticion-ejercicio-sin-repeticiones-tiempo {
	animation: rutina-fase-repeticion-ejercicio-sin-repeticiones-tiempo-efecto 1s linear 0s infinite;
}

@keyframes rutina-fase-repeticion-ejercicio-sin-repeticiones-tiempo-efecto { 
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
    color: #dc3545;
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}


.ejercicioMarcadoParaCambiar {
	border: 8px solid #76b7ef !important;
}