@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Aleo:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');

:root {
  --naranja: #da5b3e;
  --gris-claro: #f2f1ef;
}

html { /* Adjust font size */ font-size: 100%; -webkit-text-size-adjust: 100%; /* Font varient */ font-variant-ligatures: none; -webkit-font-variant-ligatures: none; /* Smoothing */ text-rendering: optimizeLegibility; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; -webkit-font-smoothing: antialiased; text-shadow: rgba(0, 0, 0, .01) 0 0 1px; }

body, html { width:100%; height:100%; }
body { font-family: 'Lato', sans-serif; color:#464646; line-height:1.4; background:#FFF; }


header > .container { padding-top:1rem; padding-bottom:1rem;  }
.child-brand img { width:160px; }
.parent-brand img { width:240px; }

.instrucciones { font-size:14px; }

.page-title { background:var(--gris-claro); }
.page-title .container { padding-top:2rem; padding-bottom:2rem; }
.page-title h1 { font-weight:700; font-family: 'Aleo', sans-serif; color:#00bfd6;  }

main .container { padding-top:1rem; padding-bottom:4rem; }

.table-sm td, .table-sm th { padding:.5rem; }

.table:not(.table-bordered) { /*border:1px solid #464646;*/ }
.table th, .table td { font-size:15px; }
.table .thead-dark th { background:#464646; }
.table thead th { text-transform:uppercase; border-bottom-width:1px; }

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td { border:0px none; line-height:1.4; }

.card { margin-bottom:1rem; }
.card > .table { margin-bottom:0; }
.card > .table thead th:first-child, .card > .table thead td:first-child { border-top-left-radius:.25rem; }
.card > .table thead th:last-child, .card > .table thead td:last-child { border-top-right-radius:.25rem; }
.card > .table tbody tr:last-child th:first-child, .card > .table tbody tr:last-child td:first-child { border-bottom-left-radius:.25rem; }
.card > .table tbody tr:last-child th:last-child, .card > .table tbody tr:last-child td:last-child { border-bottom-right-radius:.25rem; }

.table-ol tbody tr th { font-weight:normal; padding-right:0; text-align:right; }

#login .card-header { font-weight:700; font-family: 'Aleo', sans-serif; color:#00bfd6; text-transform:uppercase; margin:0; background:#dddddd; }
#login form { margin-bottom:1.25rem; }

#tablaprincipal{
 width:100%;
 overflow:auto;
 }
#tablaprincipal thead {
    position: sticky; 
    top: 0;  
	z-index:1;
  }
#tablaprincipal thead th{
	font-size:10px;
	text-align:center;
  } 

#tablaprincipal tbody tr {
  border-collapse: collapse;
  }
  
   #completopre{ 	 
	width: 100%;
  }
    #num{ 
		width: 5%;
		float:left; 
		display: block;
  } 
   #item{ 
   text-align:justify; 
    width: 95%;
	float: left;
  } 
  #tablaprincipal:after {
  content: "";
  display: table;
  clear: both;
}
.alert-danger { color:#626262; background-color: #c4e7eb; border-color: #c4e7eb; }
.alert a:not(.close):not(.btn), .alert .alert-link { color:#00bfd6; }

.instrucciones .fa { font-size:16px; }  
.instrucciones .fa-question-circle { color:#2196F3; }
.instrucciones .table th, .instrucciones .table td { font-size:12px; line-height:1.2; text-align:center; vertical-align:middle; }
.instrucciones .table .thead-dark th { background:#00bfd6;background-color: #00bfd6;font-size:12px;}
.instrucciones .table tbody { background:#FFF; } 
.instrucciones a { color:#00bfd6; text-decoration:underline; }
.instrucciones a:hover{ text-decoration:none; }e 

.card > .table-mobile tbody tr:first-child th { border-top-left-radius:.25rem !important; }
.card > .table-mobile tbody tr:first-child td { border-top-right-radius:.25rem; }
.card > .table-mobile tbody th, .card > .table-mobile tbody td { text-align:left; border-bottom:1px solid rgba(0,0,0,.125); }
.card > .table-mobile tbody th { width:70%; text-transform:uppercase; }
.card > .table-mobile tbody td { text-align:center; }
.card > .table-mobile tbody tr:last-child th, .card > .table-mobile tbody tr:last-child td { border:0px none; }

label { font-size:15px; }
.form-check { padding-left:0; }
.form-check-label input[type="radio"] { margin-right:10px; }
/*
input[type="radio"]:before, .radio input[type="radio"]:before, .radio-inline input[type="radio"]:before { background-color:var(--naranja); }
input[type="radio"]:checked:after, .radio input[type="radio"]:checked:after, .radio-inline input[type="radio"]:checked:after { border-color:var(--naranja); }
.btn-primary { background:var(--naranja); }
.btn-primary:hover { background:#be4338; }
*/

.botones { text-align:center; padding-top:2rem; }
.botones .btn { margin:5px .5rem; }
.botones .btn:first-child { margin-left:0; }
.botones .btn:last-child { margin-right:0; }
.botones .btn .fa { font-size:18px; margin:0 5px 0 0; }
.botones .btn:last-child .fa { margin:0 0 0 5px; }

footer { font-size:13px; color:#FFF; background:var(--naranja); background-color: #00bfd6;}

#gracias { font-size:18px; }
#gracias .fa { font-size:128px; color:#464646; }


@media (min-width: 576px) and (max-width: 1199px) {
  .container { max-width:100%; }
  #tablaprincipal thead th{
	font-size:8px;
	text-align:center;
  } 

   #completopre{ 	 
	width: 100%;
  }
    #num{ 
		width: 10%;
		font-size:12px;
		float:left; 
  } 
   #item{ 
   text-align:justify; 
    width: 90%;
	float: left;
  } 
  #tablaprincipal:after {
  content: "";
  display: table;
  clear: both;
}
}

@media (max-width:767.98px){
  .child-brand img { width:107px; }
  .parent-brand img { width:160px; }
  main .container { padding-top:1rem; padding-bottom:3rem; }
  footer, footer .text-right { text-align:center !important; }
#tablaprincipal thead th{
	font-size:5px;
	text-align:center;
  } 

   #completopre{ 	 
	width: 100%;
  }
    #num{ 
		display:none;
  } 
   #item{ 
   text-align:justify; 
    width: 88%;
	float: left;
  } 
  #tablaprincipal:after {
  content: "";
  display: table;
  clear: both;
}
}
@media (max-width:575.98px){ 
  body, .table th, .table td, label { font-size:0.9rem; }
  .btn { font-size:11px; padding:5px 10px; }
  .botones .btn { margin:0 5px; }

  .page-title h1 { font-size:24px; line-height:1.3; }

  input[type="radio"]:before, .radio input[type="radio"]:before, .radio-inline input[type="radio"]:before, input[type="radio"]:after, .radio input[type="radio"]:after, .radio-inline input[type="radio"]:after { width:16px; height:16px; }

  main .container { padding-top:1rem; padding-bottom:2rem; }
#tablaprincipal thead th{
	font-size:5px;
	text-align:center;
  } 

   #completopre{ 	 
	width: 100%;
  }
    #num{ 
		
		display:none;
  } 
   #item{ 
   text-align:justify; 
    width: 89%;
	float: left;
  } 
  #tablaprincipal:after {
  content: "";
  display: table;
  clear: both;
}
}
}

