/* STYLE CLIENTES */

:root{
  --azul: #0000bb;
  --orange: #ffa600;
  --orange1: #eb9800;
  --gris1: #f0f0f0;
  --lightgrey: rgb(201, 201, 201);
}

body{background-color: lightgrey;}

.bg1{background-color: var(--azul) !important; color:#fff}
.bg0{background-color: #052e1c !important;}
.bg2{background-color:#5bc0de !important;}
.bg_gris1{background-color:var(--gris1) !important;}
.bg_lightgrey{background-color:var(--lightgrey) !important;}

.border-red{border: 1px solid red;}

.btn_orange{
  background-color: var(--orange) !important;
  color: #000;
  border: 1px solid black;
}
.btn_orange:hover{
  background-color: var(--orange1) !important;
  color: #fff;
}

.svg1{vertical-align: -8px;}

.mw600{max-width: 600px; margin: auto;}
.mw900{max-width: 900px; margin: auto;}
.mw1200{max-width: 1200px; margin: auto;}

.mt1{margin-top: 100px};

.w_full{width: 100% !important;}

.h100vh{min-height:100vh;}

._small{font-size: 0.75em;}

.va1{vertical-align:-5px}

.cp{cursor: pointer;}

._small1{font-size: 0.8em !important;}
/* ***************************************** */
/* NAVBAR */
.navbar-brand{color: #fff !important;}

.nav-link{color: #fff !important;}

#navbarDropdown{color: #fff !important;}

.dropdown-item{cursor: pointer;}

.nav-item:hover{background-color: orange;}

/* ***************************************** */
/* SECCIÓN main */
#main{
  margin:auto;
  /* margin-top:58px; */
  padding-top:64px;
}

.va1{vertical-align: -3px;}


/* ***************************************** */
/* ***************************************** */
/* LICENCIAS */

.t_wrapper{
  border: 1px solid grey;
  border-radius: 5px;
  padding:1.25em;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.img_lic{
  /* max-height:160px; */
  margin: 18px auto 20px;
  /* margin-top: 20px; */
  max-width:150px;
}

.img_licpromo{
  /* max-height:182px; */
  /* margin: 30px 0px 10px; */
  max-width:165px;
}

@media screen and (max-width: 768px){
  .img_lic{
    max-height:300px;
    /* margin: 30px; */
  }

  .img_licpromo{
    max-height:320px;
    /* margin: 30px; */
  }
}

.img_hover{
  transition: transform .15s;
}

.img_hover:hover{
  transform: scale(1.05);
  -webkit-filter: drop-shadow(5px 5px 5px #222);
  filter: drop-shadow(5px 5px 5px #222);
}

/* ********** */
.container_p{
  padding: 20px;
}

.panel {
  width: 350px;
margin: 0 auto;
background-color: #fff;
border: 1px solid transparent;
border-radius: 4px;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
  border-color: #ddd;
}
.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel > .panel-heading {
  color: #333;
  background-color: #f5f5f5;
  border-color: #ddd;
}
.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 20px;
  color: #333;
  font-weight: 600;
}
.panel-body {
  padding: 15px;
}

.panel{
position: relative;
}
.overlay{
position: absolute;
left: 0; 
top: 0; 
right: 0; 
bottom: 0;
z-index: 9999;
background-color: rgba(255,255,255,0.8);
}
.overlay-content {
position: absolute;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
top: 50%;
left: 0;
right: 0;
text-align: center;
color: #555;
}

.hidden {
  display: none;
}

#paymentResponse{
  font-size: 17px;
border: 1px dashed;
padding: 10px;
  color: #EA4335;
  margin-top: 0;
  margin-bottom: 10px;
}

.status{
  padding: 15px;
  color: #000;
background-color: #f1f1f1;
  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
  margin-bottom: 20px;
}
.status h1{
  font-size: 1.8em;
}
.status h4{
  font-size: 1.3em;
  margin-bottom: 0;
}
.status p{
  font-size: 1em;
  margin-bottom: 0;
  margin-top: 8px;
}
.btn-link{
  display: inline-block;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: .375rem .75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: .25rem;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  text-decoration: none;
}
.btn-link {
  color: #007bff;
  background-color: transparent;
  border-color: #007bff;
}
.btn-link:hover, .btn-link:active, .btn-link:focus {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
  text-decoration: none;
}
.success{
  color: #34A853;
}
.error{
  color: #EA4335;
}
/* ***************************************** */
/* ***************************************** */
/* CARGAR DATOS DIARIOS */

.card{
  border-radius: 0px !important;
}

.rounded{
  border-radius: 5px !important;
}

@media screen and (min-width: 770px){
  #menu_datos{
    position: fixed;
    overflow:auto;
    min-width:25%;
    height:100vh;
  }

  #datos{
    margin-left: 25%;
    padding:0px;
  }
}

#datos_2{
  padding: 0px;

}

.col-card{
  min-width: 350px;
  /* max-width: 350px; */
  /* border: 2px solid green; */
}

.etiqueta{
  min-width: 130px;
  /* border: 1px solid blue */
}

.campo{
  min-width: 70px;
  border: #fff !important;
  /* border: 1px solid rgb(255, 0, 149) */
}


/* ***************************************** */
/* AGENDA */
.days{
  /* border: hotpink 1px solid; */
  margin: 5px 5px 0;
  /* padding: 5px; */
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  align-items: center;
  /* background-color: rgb(236, 236, 236); */
  text-align: center;
}

.day{
  overflow: hidden;
  display: grid;
  height: 25px;
  align-items: center;
  background-color: rgb(241, 241, 241);
  text-align: center;
}

.tiles{
    /* margin: 0 5px 5px; */
    padding: 5px;
    display: grid;
    /* grid-template-columns: repeat(auto-fit, minmax(50px, 0.3fr)); */
    grid-template-columns: repeat(7, 1fr);
    /* grid-template-columns: repeat(7, minmax(10px,30px)); */
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}

.tile{
    overflow: hidden;
    cursor: pointer;
    display: grid;
    grid-template-columns: 2fr 7fr;
    background-color: lightgray;
    /* background-color: rgba(131, 255, 82, 0.171); */
    /* margin: 0px 2px; */
    border-radius: 5px;
}


.local{
  background-color: lightgray;
  color: #000;
}



.tile_hover:hover{background-color: grey;}

.tile:active{background-color: #5bc0de;}

.tile_active{background-color: var(--azul);}

.tilein1{
  /* background-color: orange; */
  /* border: 1px solid orange; */
  height: 40px;
  align-items: center;
  text-align: center;
}

.tilein2{
    height: 40px;
    display: grid;
    align-items: center;
    padding-left: 30%;
}

.color_white{color: #fff;}
.local:active{background-color: #5bc0de;}
/* ***************************************** */
a:link {color: white;}
a:link {color: inherit;}
a:visited {color: inherit;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;}
a:active {text-decoration: none;}

a:hover{color: aquamarine;}

.cp{cursor:pointer}
.ca{cursor:default}

/* ***************************************** */
.downArrow{
	position: absolute;
	bottom: 1%;
	right: 45vw;
}

@media screen and (min-width: 600px){
  .downArrow{
    right: 48vw;
  }
}

.bounce {
	-moz-animation: bounce 3s infinite;
	-webkit-animation: bounce 3s infinite;
	animation: bounce 3s infinite;
}
@-moz-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

/** NO SPINNER EN INPUT NUMBER ********************************** */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {-moz-appearance: textfield;}

/* ************************************************************** */
/* SPINNER BOOTSTRAP */
.sp1-container{
  width: 100%;
  height: 200px;
  text-align: center;
  position: relative;
}

.sp1{
  width: 200px;
  height: 100%;
  color: #cfe2ff !important;
}

.spinner_logo{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: arial, sans-serif;
  font-weight: 600;
  font-size: 60px;
  color: #cfe2ff;
}


/* ***************************************** */
/* TOOLTIP w3schools */

.tooltip1 {
  position: relative;
  display: inline-block;
  /* border-bottom: 1px dotted black; */
}

.tooltip1 .tooltiptext1 {
  visibility: hidden;
  width: 200px;
  background-color: #555;
  background-color: #2b2b2b;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  left: 50%;
  margin-left: -100px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip1 .tooltiptext1.campo {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.tooltip1:hover .tooltiptext1 {
  visibility: visible;
  opacity: 1;
}
/* ***************************************** */
