@import url('http://fonts.cdnfonts.com/css/roboto');
/*@import url('http://fonts.cdnfonts.com/css/neue-haas-grotesk-text-pro');*/

/* CSS ADD BY JHON */

html,
body {
  height: 100%;
}

body.loguin {
  display: flex;
  align-items: center;
  background-color: rgb(58, 58, 58) !important;
}

body.admin {
  background-color: rgb(58, 58, 58) !important;
}

input,
button,
select,
optgroup,
textarea,
table,
label,
span,
option,
div {
	/*font-family: 'Neue Haas Grotesk Display Pro', sans-serif !important;*/
  font-family: 'Roboto', sans-serif;
}

.sombra {
	-webkit-box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
	box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
}

.sombra2 {
	-webkit-box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
	-moz-box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
	box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
}

.form-acepto-politicas {
  max-width: 400px; /* 330px */
  padding: 5px 15px;
}

.obligatoriedad {
    color: red;
}

.card { 
  --bs-card-border-radius: 0.575rem;
  border: none;
  background-color: rgb(33, 33, 33);
}

.btn {	
	--bs-btn-color: #212529;
	--bs-btn-bg: transparent;
	--bs-btn-border-width: 1px;
	--bs-btn-border-color: transparent;
	--bs-btn-border-radius: 2rem;
	--bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
	--bs-btn-disabled-opacity: 0.65;
	--bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);

	color: var(--bs-btn-color);
	border: none;
	border-radius: var(--bs-btn-border-radius);
	background-color: var(--bs-btn-bg);
}


.btn-primary {
	--bs-btn-color: rgb(22, 22, 22);
	--bs-btn-bg: rgb(255, 255, 255);
	--bs-btn-border-color: #0d6dfd00;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #0b5ed7;
	--bs-btn-hover-border-color: #0a57ca00;
	--bs-btn-focus-shadow-rgb: 49, 132, 253;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #0a57ca00;
	--bs-btn-active-border-color: #0a53be;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: #0d6efd;
	--bs-btn-disabled-border-color: #0d6efd;
}

.btn-group-lg>.btn, .btn-lg {
  padding: .2rem 1rem;
}

.btn:hover {
  --bs-btn-color: #ffffff;
  --bs-btn-bg: rgb(0, 45, 114);
  --bs-btn-border-color: var(--bs-border-color-translucent);
  color: var(--bs-btn-color);
  background-color: var(--bs-btn-bg);
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
}

.navbar-brand {
  font-size: 1.6rem;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  color: white !important;
}


#politicas-privacidad, 
#terminos-google {
  color: rgb(28, 95, 212);
}

.form-check-label {
  color: rgb(193, 193, 193)!important;
}

.form-sz {
font-size: 12px !important;
}

table>label {
  display: inline-block;
  color: rgb(193, 193, 193) !important;
  padding: 1.5rem;
}

.form-label {
  margin-bottom: .2rem;
  color: rgb(193, 193, 193) !important;
}

.form-select {
	padding: 0.4rem 0.35rem !important;
	color: rgb(193, 193, 193);
	background-color: rgb(35, 35, 35);
	border: 1.5px solid rgb(193, 193, 193);
	padding: 0.24rem 0.35rem !important;
}

select.form-select>option {
	background-color: rgb(30, 30, 30);
	color: rgb(193, 193, 193);
	border: 1px solid rgb(193, 193, 193) !important;
	border-radius: 10px !important;
	display: table-cell !important;
}

a {
  text-decoration: none;
}

input:focus, select:focus {
  color: rgb(193, 193, 193) !important;
  background-color: rgb(30, 30, 30) !important;
	border: 1px solid rgba(0, 45, 114);
	-webkit-box-shadow: 0px 0px 1px 1px rgba(0, 45, 114) !important;
	-moz-box-shadow: 0px 0px 1px 2px rgba(0, 45, 114) !important;
	box-shadow: 0px 0px 1px 1px rgba(0, 45, 114) !important;
}


.overlay-spinner {
	cursor: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(74, 74, 74, .5);
	z-index: 99999;
}

.spinner-border {
  position: absolute;
  top: 50% !important;
  left: 50% !important;
}

.spinner-color {
  color: rgba(62, 59, 244, 1) !important;
}

.form-text {
  margin-top: .25rem;
  font-size: .775em;
  color: #db0000;
}

.form-control {
	color: rgb(193, 193, 193);
	background-color: rgb(30, 30, 30);
	background-clip: padding-box;
	border: 1px solid rgb(193, 193, 193);
}

.form-check-input[type=checkbox] {
	width: 1.2em;
	height: 1.2em;
	margin-top: 0.25em;
	background-color: rgba(0, 0, 0, 0);
	background-size: contain;
	border-radius: 0.15em;
	border: 1px solid rgb(193, 193, 193);
}

.form-check-input:checked[type=checkbox] {
	background-color: rgba(28, 28, 28, 0);
	border-color: rgb(193, 193, 193);
}


.swal-modal {
  pointer-events: none;
  background-color: #262525;
  border-radius: 10px;

  -webkit-box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
	box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
}

.swal-title {
  color: rgb(211, 211, 211);
  text-transform: none;
  margin-top: 20px;
  margin-bottom: 5px;
  padding: 0px 16px;
  font-size: 27px;
  font-weight: 500;
}

.swal-button {
  background-color: #ffffff;
  color: rgb(39, 39, 39);
  margin-bottom: 10px;
  padding: 8px 40px;
  border-radius: 20px;

  -webkit-box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
	-moz-box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
	box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
}

.swal-footer {
  text-align: center;
  padding-top: 5px;
  margin-top: 5px;
  padding: 5px 16px;
  border-radius: inherit;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.swal-text {
	color: rgb(211, 211, 211);
    font-size: 16px;
}

@media (max-width: 500px) {
  .swal-modal {
    width: calc(100% - 40px);
  }
}

table#tblData {
  font-size: small !important;
}

.bg-color-table {
	background-color: rgb(28, 28, 28) !important;
	padding: 0 !important;
}

.column-color {
	background-color: rgb(33, 33, 33) !important;
}

.column-color1 {
  background-color: rgb(28, 28, 28) !important;
}

table>thead {
	font-size: 0.81rem !important;
	color: rgb(255, 255, 255) !important;
}

tr>th {
  border-bottom: none !important;
}

tbody {
	font-size: small !important;
	color: rgb(193, 193, 193) !important;
}

tbody>tr>td {
	border-bottom: 1px solid rgb(214, 214, 214) !important;
}

tbody>tr:last-child>td {
	border-bottom: none !important;
}

tbody>tr>td:first-child,
thead>tr>th {
	padding-left: 15px !important;
}

.card {
	border: none !important;
  border-radius: 1.5rem !important;
}

.card-header {
	color: rgb(252, 252, 252);
	background-color: rgb(22, 22, 22);
	font-weight: 700;
  font-size: 1.2rem;
}

.card-body {
	color: rgb(252, 252, 252);
	background-color: rgb(33, 33, 33);
  border-radius: 1.8rem !important;
}

.dataTables_wrapper .dataTables_paginate {
  padding-bottom: 1.3rem;
  padding-top: 1.3rem;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  background-color: white;
  border-radius: 2rem;
  margin: 0.2rem;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
  cursor: default;
  color: rgb(242, 238, 238) !important;
  border: 1px solid transparent;
  background: transparent;
  box-shadow: none;
  background: rgb(147, 147, 147) !important;
}

#tblData_info.dataTables_info {
  color: rgb(193, 193, 193) !important;
  padding-top: 1.9em;
  padding-left: 1rem;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  color: white !important;
  border: 1px solid #111;
  background: rgb(0, 45, 114) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
  cursor: default;
  color: rgb(74, 74, 74) !important;
  border: 1px solid transparent;
  background: transparent;
  box-shadow: none;
  background-color: darkgrey;
}


.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  color: rgb(248, 248, 248) !important;
  border: 1px solid #979797 !important;
  background: rgb(96, 124, 142) !important;
}


.dataTables_length>label {
  color: #fff;
  padding: 1.5rem;
}

.dataTables_wrapper .dataTables_length select {
  color: #fff;
  border: 1px solid #aaa; 
  border-radius: 3px; 
  padding: 5px; 
  background-color: transparent; 
  padding: 4px;
}

#tblData_filter>label {
  color: #fff;
  padding-top: 1.5rem;
}

td>button {
  padding: 0.2rem  0.5rem !important;
  font-size: small !important;
}

.modal-header {
  background-color: rgb(22, 22, 22);
  border-bottom: none !important;
}

.modal-body {
  background-color: rgb(33, 33, 33);
}

.modal-footer {
  background-color: rgb(33, 33, 33);
  border-top: none !important;
}


.modal-content {
  border: none;
  -webkit-box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
	box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
}

.form-floating>label {
  color: rgb(193, 193, 162);
}


.form-select {
  padding: 1.5rem 0.8rem 0rem !important;
}




.swal-modal {
  pointer-events: none;
  background-color: #262525;
  border-radius: 10px;

  -webkit-box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
	box-shadow: 0px 7px 7px 5px rgba(0, 0, 0, 0.75);
}

.swal-title {
  color: rgb(211, 211, 211);
  text-transform: none;
  margin-top: 20px;
  margin-bottom: 5px;
  padding: 0px 16px;
  font-size: 27px;
  font-weight: 500;
}

.swal-button {
  background-color: #ffffff;
  color: rgb(39, 39, 39);
  margin-bottom: 10px;
  padding: 8px 40px;
  border-radius: 20px;

  -webkit-box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83) !important;
	-moz-box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83) !important;
	box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83) !important;
}

.swal-button:hover {
	background-color: rgba(0, 45, 114) !important;
  	color: rgb(255, 255, 255) !important;
	border: none !important;

	-webkit-box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
	-moz-box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
	box-shadow: 6px 6px 6px -1px rgba(0, 0, 0, 0.83);
}

.swal-footer {
  text-align: center;
  padding-top: 5px;
  margin-top: 5px;
  padding: 5px 16px;
  border-radius: inherit;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.swal-text {
	color: rgb(211, 211, 211);
    font-size: 16px;
}

@media (max-width: 500px) {
  .swal-modal {
    width: calc(100% - 40px);
  }
}


@media (min-width: 1700px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1500px !important;
  }
}

@media (min-width: 1900px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1720px !important;
  }
}


.bg-pendinte {
  background-color: rgb(253, 253, 150) !important;
  color: black;
}

.bg-paso {
  background-color: rgb(119, 221, 119) !important;
  color: black;
}

.bg-no-paso {
  background-color: rgb(255, 105, 97) !important;
  color: black;
}


.disabled-class {
	opacity: 0.5 !important;
	pointer-events: none !important;
}

