@charset "UTF-8";
@font-face{
  font-family:Archivo-Regular;
  src:url(../fuentes/Archivo-Regular.ttf);

}

@font-face{
  font-family:Archivo-ExtraBold;
  src:url(../fuentes/Archivo-ExtraBold.ttf);

}

@font-face{
  font-family:Archivo-ExtraLigh;
  src:url(../fuentes/Archivo-ExtraLight.ttf);
}

@font-face{
  font-family:Archivo-Thin;
  src:url(../fuentes/Archivo-Thin.ttf);
}




.rena{font-family:Archivo-ExtraBold;}
.rena2{font-family:Archivo-Regular;}
.rena3{font-family:Archivo-ExtraLigh;}
.rena4{font-family:Archivo-Thin;}

html, body {
  margin: 0;
  padding: 0;
  overflow: hidden;
  height: 100%;
  overflow-y: scroll;
}

.containerSecciones {
  height: 100%;
  overflow-y: scroll;
  overflow-x: hidden;
  scrollbar-width: none; /* Firefox */
}


.containerSecciones::-webkit-scrollbar {
  display: none; /* Safari and Chrome */
}

.seccionPanel {
  scroll-snap-align: start;
  height: fit-content !important;

}

#introduccion{
  background-image: url(../imagenes/fondo.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top right;
  background-origin: revert-layer;
  background-attachment: fixed;
}

.cajaTiempo{
 background-image: url(../imagenes/fondo.jpg);
 background-size: cover;
 background-repeat: no-repeat;
 background-position: left;
 background-origin: revert-layer;
 background-attachment: fixed;
}

.cajaFooter{
  background-image: url(../imagenes/fondo.jpg);
  background-size: cover;
  background-position: 0px 200px;
  background-attachment: fixed;
}

.fondoTargeta{
  background-image: url(../imagenes/fondo.jpg);
  border:none !important;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  transition: 0.7s;
}


.fondoTargeta2{
  background-image: url(../imagenes/fondo.jpg);
  border:none !important;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: left;
  transition: 0.7s;
}


.fondoTargeta:hover{
  background-image: url(../imagenes/fondo.jpg);

  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  box-shadow: 0 2rem 1.5rem -1.5rem rgba(0, 0, 0, .20), 0 0 1.5rem .5rem rgba(33, 37, 41, .05);

}

.espejo1{
  background-color: rgba(255,255,255,0.5);
  backdrop-filter: blur(1px);
}

.espejo2{
  background-color: rgba(0,0,0,0.5);
  backdrop-filter: blur(1.2px);
}



a{color:inherit; }
a:hover,
a:active,
a:focus{
	text-decoration: none;
	/*color: initial;*/
}

.nav-tabs {
  border-bottom: none;
}

body{font-family:RenaultLife-Bold;}

.cajaAlta{text-transform: uppercase;}
.digi{font-family:DS-digital;}
.breakW{word-break: break-word;}
.cursorP{cursor: pointer;}
.noWrap{white-space: nowrap;}

.fixed{position: fixed;}
.flexibleAll{display: flex;}
.table{display: table;}
.tabla{display: table; width: 100%;}
.dTable{display: table;}
.celda {width: 100%; display: table-cell;}
.inline-table{display: inline-table;}
.block{display: block;}
.none{display: none;}
.inline{display: inline-block;}
.inlineGrid{display: inline-grid;}
.grid{display: grid;}
.content{display: contents;}
.relativo{position: relative;}
.cajaOverflow{overflow: hidden; position: relative;z-index: 0;}
.cajaOverflow .absolut{z-index: 1;}
.cajaOverflow *:not(.absolut){z-index: 2;}
.absolut{position: absolute;}
.absolutB{position: absolute; bottom:0px;}
.absolutBR{position: absolute; right: 5%; bottom: 13%;}
.absolutL{ position: absolute; bottom: 13%;}
.card{border-radius: 10px }

.scroll{overflow: scroll;}

.scroll-y{
  overflow-y: scroll;
  overflow-x: hidden;
}

.scroll-x{
  overflow-x: scroll;
  overflow-y: hidden;
}

.scrollNone::-webkit-scrollbar {
  display: none;
}

.z-index9{z-index: 9;}

.right{right:0px;}
.left{left:0px;}
.top{top:0px;}
.bottom{bottom:0px;}

.rotate0{transform: rotate(0deg);}
.rotate90{transform: rotate(90deg);}
.rotate180{transform: rotate(180deg);}

.centerAbsolut{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  margin: 0px;
  padding: 0px;
}

.centerAbsolutV {
  position: absolute;
  top: 50%;
  transform: translate(0%, -50%);
  -webkit-transform: translate(0%, -50%);
  margin: 0px;
  padding: 0px;
}

.centerAbsolutT {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, 0%);
  -webkit-transform: translate(-50%, 0%);
}

.centerAbsolutB {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 0%);
  -webkit-transform: translate(-50%, 0%);
}


.col{position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}
.cajaInfo{position: relative; height: 100%;}

.alingDiv{
  display: flex;
  justify-content: center;
  align-items: center;
}

.alignDiv{
  display: flex;
  justify-content: center;
  align-items: center;
}

.centerColum{
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.flex-endColum{
  display: flex;
  justify-content: flex-end;
  flex-direction: column;
}

.flex-startColum{
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
}

.betweenColum{
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}

.between{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.centrarTextoV {
  flex-direction: row-reverse;
  justify-content: center;
  display: flex;
}

.grid-column50{
  display: grid;
  grid-template-columns: 50% 50%;
}

.esquina{background-image: url("https://working2.net/lineaGrafica/imagenes/esquina.svg");
  background-repeat: no-repeat;
  width: 2rem;
  position: absolute;
  height: 2rem;
  right: 0px;
  background-color: #e4e4e4;
  top:0px;
  cursor: pointer;
}

.esquina:before {
  content: '';
  width: 0;
  height: 0;
  border-right: 9px solid transparent;
  border-top: 9px solid transparent;
  border-left: 9px solid transparent;
  border-bottom: 9px solid transparent;
  box-shadow: -1px 2px 2.7px 0px #adadad7a;
  position: absolute;
  right: 2px;
  top: 2px;
}

.cuadrado{width:10px; height:10px; display: inline-block;}

.circulo {
 width: 10px;
 height: 10px;
 -moz-border-radius: 50%;
 -webkit-border-radius: 50%;
 border-radius: 50%;
}

.puntoCirculo{
  width: 5px;
  height: 5px;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}

div.esferaOk {
  width: 20px;
  height: 20px;
  background-color: green;
  background: radial-gradient(at top left, #0F0 20%, #040);
  -ms-border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
  margin: 0px auto;
}

div.esferaKo {
  width: 20px;
  height: 20px;
  background-color: red;
  background: radial-gradient(at top left, #F00 20%, #400);
  -ms-border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
  margin: 0px auto;
}

.clearBoth{clear: both;}

.flot{ width: 100%; float: left; clear: both;}
.flotL{float: left;}
.flotR{float: right;}
.flotR-relative{float: right; position: relative;}
.flotA{ width: auto; float: left; clear: none;}

.borde{ border:1px solid; margin: 2%;}
.bordeA {border: 1px solid rgba(153, 153, 153, 0.24);}
.border { border:1px solid;}
.borde1 { border:1px solid;}

.bordeB0 { border-bottom:0px;}

.bordeIncidencia1{border:2px solid #f5cd3a;}
.bordeIncidencia2{border:2px solid #ef7748;}
.bordeIncidencia3{border:2px solid #ef4848;}
.bordeAmarillo{border: 6px solid #f5ce3a;}
.bordeOK{border: 6px solid #33df32;}
.bordeNok{border: 6px solid #f61b1b;}
.bordeNaraja{border: 6px solid #ff8000;}


.bordeB {border-bottom: 1px solid;}
.lineaR {border-bottom: 1px solid #ccc;}



.bordeR {border-right:1px solid;}
.borde-R {border-right:1px solid;}
.bordeR2 {border-right:2px solid;}
.bordeR0 {border-bottom: 0px;}
.bordeT{border-top:1px solid;}
.bordeL {border-left:1px solid;}
.lineaIzquierda{ border-left: 2px solid; padding-left: 5%; margin: 2% 0px;}

.lineaBD {  border-bottom: 1px dotted; }
.lineaTD {  border-top: 1px dotted; }
.lineaRD {  border-right: 1px dotted; }
.lineaLD {  border-left: 1px dotted; }

.b0{border: none;}
.b3{border-width: 3px;}
.b5{border-width: 5px;}
.b7{border-width: 7px;}




.divMedio{width:fit-content; margin:0 auto;}
.m0{margin: 0px;}
.mAuto{margin:0 auto;}
.m0Icon:before {
  margin: 0px;
}

.m1{margin-top:1%;}
.m2{margin-top:2%;}
.m3{margin-top:3%;}
.m4{margin-top:4%;}
.m5{margin-top:5%;}
.m7{margin-top:7%;}
.m9{margin-top:9%;}
.m10{margin-top:10%;}
.m11{margin-top:11%;}
.m22{margin-top:30%;}
.mr7x{margin-right: 7px;}
.mr1{margin-right: 1%;}
.mr2{margin-right: 2%;}
.mr3{margin-right: 3%;}
.mr4{margin-right: 4%;}
.ml2{margin-left:2%;}
.ml4{margin-left:4%;}
.mb1{margin-bottom:1%;}
.mb2{margin-bottom: 2%;}
.mb3{margin-bottom: 3%;}
.mb5{margin-bottom: 5%;}
.mb120{margin-bottom: 120px}
.m5B1 {margin-top: 25%;}

.m5x{margin-top: 5px;}
.m7x{margin-top: 7px;}
.m15x{margin-top: 15px;}
.m40x{margin-top: 40px;}
.mb40x{margin-bottom: 40px;}

.mb5x{margin-bottom: 5px;}
.mb7x{margin-bottom: 7px;}
.mb15x{margin-bottom: 15px;}

.ml5x{margin-left: 5px;}
.ml7x{margin-left: 7px;}
.ml15x{margin-left: 15px;}

.ajusteTop{margin-top: 8%;}
.rowLeft{margin-left:-15px;}

.p0{padding: 0px;}.p02{padding: 0.2%;}.p05{padding: 0.5%;}
.p1{padding:1%;}
.p2{padding: 2%;}
.p3{padding: 3%;}
.p5{padding: 5%;}
.p6{padding: 6%;}
.pt50{padding-top: 50px;}
.pt14{padding-top: 14px;}
.pt1{padding-top: 1%;}
.pt2{padding-top: 2%;}
.pt3{padding-top: 3%;}
.pt4{padding-top: 4%;}
.pt5{padding-top: 5%;}
.pt6{padding-top: 6%;}
.pt10{padding-top:10%;}

.p5x{padding: 5px;}
.pt5x{padding-top: 5px;}
.pb5x{padding-bottom: 5px;}
.pl5x{padding-left: 5px;}
.pr5x{padding-right: 5px;}

.pt7x{padding-top: 7px;}
.pb7x{padding-bottom: 7px;}
.pt15x{padding-top: 15px;}
.pb15x{padding-bottom: 15px;}
.pl2x{padding-left: 2px;}

.pr15x{padding-right: 15px;}

.pb1{padding-bottom:1%;}
.pb2{padding-bottom:2%;}
.pb3{padding-bottom:3%;}
.pb4{padding-bottom:4%;}
.pb5{padding-bottom:5%;}
.pr0{padding-right: 0px;}

.pr20{padding-right: 20px;}
.pr2{padding-right: 2%;}
.pr3{padding-right: 3%;}
.pr4{padding-right: 4%;}
.pr5{padding-right: 5%;}
.pl0{padding-left: 0%;}
.pl2{padding-left: 2%;}
.pl1{padding-left: 1%;}
.pl3{padding-left: 3%;}
.pl5{padding-left: 5%;}
.p1lr{padding: 0% 1%;}
.p2lr{padding: 0% 2%;}

.pl15x{padding-left: 15px;}

.redu50{font-size:50%;}
.redu60{font-size:60%;}
.redu80{font-size:80%;}
.redu90{font-size:90%;}
.redu{font-size:70%;}
.redu2{font-size:80%;}


.gran{font-size:200%;}
.gran2{font-size: 210%;}
.aum110{font-size: 110%;}
.aum120{font-size: 120%;}
.aum130{font-size: 130%;}
.aum140{font-size: 140%;}
.aum150{font-size: 150%;}
.aum180{font-size: 180%;}
.aum200{font-size: 200%;}
.aum250{font-size: 250%;}
.icon200{font-size: 200%;}

.line-height100{line-height: 100%;}
.line-height50{line-height: 50px;}
.line-height60{line-height: 60px;}
.line-height40{line-height: 40px;}
.line-height30{line-height: 30px;}
.line-height20{line-height: 20px;}
.line-height10{line-height: 10px;}
.line-height1em{line-height: 1em;}
.line-heightA{line-height: 1.5em;}


.font13{font-size:1300%;}
.font9{font-size:900%;}
.font8{font-size:800%;}
.font7{font-size:700%;}
.font6{font-size:600%;}
.font5{font-size:500%;}
.font4{font-size:400%;}
.font3{font-size:300%;}
.font2{font-size:200%;}
.font1{font-size:100%;}

.font1vw{font-size:calc(1em + 1vw);}
.font2vw{font-size:calc(1em + 2vw);}
.font3vw{font-size:calc(1em + 3vw);}
.font4vw{font-size:calc(1em + 4vw);}
.font5vw{font-size:calc(1em + 5vw);}

.textoGris{color: rgba(128,128,128,0.19);}
.textoGris1{color: rgba(255,255,255,0.19);}

.valing-medio{vertical-align: middle;}
.valing-top{vertical-align: top;}
.valing-super{vertical-align: super;}
.valing-sub{vertical-align: sub;}
.aling-center{align-items: center;}


.textoV{
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  writing-mode: vertical-rl; /* new syntax */
  transform: rotate(180deg);

}

.colEser-5{width: 5%;}
.colEser-10{width: 10%;}
.colEser-20{width: 20%;}
.colEser-30{width: 30%;}
.colEser-40{width: 40%;}
.colEser-50{width: 50%;}
.colEser-60{width: 60%;}
.colEser-70{width: 70%;}
.colEser-80{width: 80%;}
.colEser-90{width: 90%;}
.colEser-95{width: 95%;}
.colEser-100{width: 100%;}

.colEser-5, .colEser-10, .colEser-20, .colEser-30, .colEser-40, .colEser-50, .colEser-60, .colEser-70, .colEser-80, .colEser-90, .colEser-95, .colEser-100 {
  position: relative;
  min-height: 1px;
  padding-right: 0px;
  padding-left: 0px;
  float: left;
}

.col-xs-14col{width: 7.142867%; position: relative; float:left;}
.col-xs-7col{width: 14.285714%; position: relative; float:left;}
.col-xs-7Acol{width: 28.571428%; position: relative; float:left;}
.col-xs-7Bcol{width: 42.857412%; position: relative; float:left;}


.shadow-lg {box-shadow: 0 2rem 1.5rem -1.5rem rgba(33,37,41,.15),0 0 1.5rem .5rem rgba(33,37,41,.05);}
.shadow {box-shadow: 0 .15rem 1.75rem 0 rgba(58,59,69,.15);}
.shadow1 {box-shadow: 0.1rem 0.2rem 0.2rem 0px rgba(74, 74, 74, 0.81);}

.blackShadow{
  box-shadow: 0rem 0.15rem 0.4rem 0px rgba(0, 0, 0, 0.6);
}

.troquel{
  color: transparent;
  text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
}

.text-bordeAmarillo{
 text-shadow:  -0.12rem 0.12rem 0px #fff, -0.35rem 0.35rem 0px rgb(255 206 0)
}


.minContent{min-width: min-content;}
.minW2{min-width: 200px;}
.minW25{min-width: 250px;}
.minW3{min-width: 300px;}

.minW70{min-width: 70px;}

.h10{height: 10%;}
.h20{height: 20%;}
.h30{height: 30%;}
.h40{height: 40%;}
.h50{height: 50%;}
.h60{height: 60%;}
.h70{height: 70%;}
.h80{height: 80%;}
.h90{height: 90%;}
.h100{height: 100%;}

.minH7{min-height: 7px;}

.h15x{height: 15px;}
.h20x{height: 20px;}
.h30x{height: 30px;}
.h40x{height: 40px;}
.h50x{height: 50px;}
.h60x{height: 60px;}
.h70x{height: 70px;}
.h100x{height: 100px;}
.h200x{height: 200px;}

.minH1{min-height: 100px;}
.minH12{min-height: 120px;}
.minH13{min-height: 130px;}
.minH14{min-height: 140px;}
.minH19{min-height: 190px;}

.minH30{min-height: 30px;}
.minH40{min-height: 40px;}
.minH50{min-height: 50px;}
.minH60{min-height: 60px;}
.minH70{min-height: 70px;}
.minH80{min-height: 80px;}
.minH90{min-height: 90px;}
.minH100{min-height: 100px;}
.minH120{min-height: 120px;}
.minH130{min-height: 130px;}
.minH140{min-height: 140px;}
.minH190{min-height: 190px;}
.minH200{min-height: 200px;}
.minH300{min-height: 300px;}
.minH400{min-height: 400px;}
.minH700{min-height: 700px;}
.minH800{min-height: 800px;}

.maxH30{max-height: 30px;}
.maxH40{max-height: 40px;}
.maxH50{max-height: 50px;}
.maxH60{max-height: 60px;}
.maxH70{max-height: 70px;}
.maxH100{max-height: 100px;}
.maxH120{max-height: 120px;}
.maxH130{max-height: 130px;}
.maxH140{max-height: 140px;}
.maxH190{max-height: 190px;}
.maxH200{max-height: 200px;}
.maxH300{max-height: 300px;}



.maxW40{max-width: 40px;}
.maxW50{max-width: 50px;}
.maxW70{max-width: 70px;}
.maxW100{max-width: 100px;}
.maxW120{max-width: 120px;}
.maxW300{max-width: 300px;}

.maxW200x{max-width: 200px;}
.maxW300{max-width: 350px;}


.maxW900{max-width: 900px;}
.maxW1200{max-width: 1200px;}

.wAuto{width: auto;}


.w10x{width: 10px;}
.w20x{width: 20px;}
.w30x{width: 20px;}
.w40x{width: 20px;}
.w50x{width: 50px;}
.w60x{width: 60px;}
.w70x{width: 70px;}
.w80x{width: 80px;}
.w90x{width: 90px;}
.w100x{width: 100px;}


.cabeceraListado{
	background-color: #293038;
	margin-bottom: 1%;
	padding: 0.8% 0;
	color:#fff;
}

.lineaTiempo .pintaLinea:before{
	content: '__';
	position: absolute;
	top: 25%;
	left: -28px;
	color: rgb(165, 165, 165);
	font-size: 200%;}

  /*-----------ESPECÍFICOS----------*/

  .lineaUET{
   background-color: #197bc3;
   padding-bottom: 10px;
   color: #fff;
 }
 .lineaGUIA{
   line-height: 50px;
   margin-top: 0px;
   border-left: 1px dashed #72b5d1;
   border-bottom: 1px dashed #72b5d1;
   width: 70px;
   height: 80%;
 }

 .lineaSeparaGUIA{
   line-height: 10px;
   margin-top: 7px;
   margin-bottom: 7px;
   border-bottom: 1px dashed #72b5d1;
 }

 .barraGuia { background-color: #0A2C2C;     text-align:right; color: #fff;   min-height: 27px;}
 .barraVerde { background-color: #b3c62d;    box-shadow: 0 2px 4px 0 rgba(0,0,0,.1); text-align: center; color: #fff; }
 .barraNaranja { background-color: #f97f02;  box-shadow: 0 2px 4px 0 rgba(0,0,0,.1); text-align: center; color: #fff; }
 .barraRoja { background-color: #c11941;     box-shadow: 0 2px 4px 0 rgba(0,0,0,.1); text-align: center; color: #fff; }

 .centraVertical {
   line-height: 130px;
   padding-left: 0px;
   padding-right: 0px;
 }

 .centradoVertical {
   display: inline-block;
   vertical-align: middle;
   line-height:inherit;
 }

 .centroV{
   display: table-cell;
   vertical-align: middle;
 }

 .fitContent{min-width: fit-content;}
 .maxContent{min-width: max-content;}

 .marcoFirma{
  border: 1px solid;}

  .cajaPuesto{
    color:#fff;
    background-color:#000;
    padding: 3px 3px 3px 9px;
    margin-right: 2%;
    margin-bottom: 1%;
  }

  .cajaPuesto span:before{
    padding-left: 15px solid rgb(2,5,99);
  }


  .cajaAcreditacion{

    color:#fff;
    background-color:#000;
    padding: 3px 9px 9px 9px;
    margin-right: 2%;
    margin-bottom: 1%;
    min-width: max-content;
  }

  .cajaAplicacion{

    padding: 9px;
    margin-right: 2%;
    margin-bottom: 1%;
    min-width: max-content;
  }

  .cajaSecciones{
    min-width: max-content;
  }


  .cajaBrocha {
    width: 180px;
    height: 180px;
    font-family: RenaultLife;
    font-size: 16px;
    margin: 0 auto;
    color: #FFF;
    cursor: pointer;
    background-color: #4c82ab;

  }

  .cajaBrocha a {
    text-decoration: none;
  }

  .cajaBrocha span {
    text-align: center;
    cursor: pointer;
    font-weight: normal;
    text-transform: none;
    text-decoration: inherit;
    speak: none;
    width: max-content;
    margin: auto;
  }

  .cajaBrocha label {
    display: block;
    text-align: center;
    margin-bottom: 0px;
    margin-top: 2%;
    padding: 12px;
    cursor: pointer;
    font-weight: normal;
    color: #fff;
  }



  .btnAccionS2 {
   width: 150px;
   height: 150px;
   font-family: RenaultLife;
   font-size: 16px;
   display:inline-table;
   color: #FFF;
   cursor: pointer;
 }

 .btnAccionS2 a {
  text-decoration: none;
}

.btnAccionS2 span {
  display: block;
  text-align: center;
  cursor: pointer;
  font-weight: normal;
  text-transform: none;
  text-decoration: inherit;
  speak: none;
  border-bottom: 1px solid;
  width: max-content;
  margin: auto;
  padding: 7px 14px;
  color: #fff;
}

.btnAccionS2 label {
  display: block;
  text-align: center;
  margin-bottom: 0px;
  margin-top: 2%;
  padding: 12px;
  cursor: pointer;
  font-weight: normal;
  color: #fff;
  max-width: 150px;
}

.btnAccionS3 {
 width: 180px;
 height: 180px;
 font-family: RenaultLife;
 font-size: 16px;
 display:inline-table;
 color: #FFF;
 cursor: pointer;
 background-color: #8a8a8a73;

}

.btnAccionS3 a {
  text-decoration: none;
}

.btnAccionS3 span {
  display: block;
  text-align: center;
  cursor: pointer;
  font-weight: normal;
  text-transform: none;
  text-decoration: inherit;
  speak: none;
  border-bottom: 1px solid;
  width: max-content;
  margin: auto;
  padding: 7px 14px;
}

.btnAccionS3 label {
  display: block;
  text-align: center;
  margin-bottom: 0px;
  margin-top: 2%;
  padding: 12px;
  cursor: pointer;
  font-weight: normal;
  color: #fff;
}

.textShadowHover:hover{

  text-shadow: 1px 1px 7px #94949485;
  transition: all 0.2s ease;
}

.inputActivo{

  box-shadow: inset 0px 1px 3px #00000057;
  border: none;
  padding: 3%;

}

.cajaTexto{

  color:#fff;
  padding: 3px 3px 3px 9px;
  margin-right: 2%;
  margin-bottom: 1%;
  min-width: max-content;}

  .cajaTexto span:before{padding-left: 15px solid rgb(2,5,99);}

  .cajaTextoOverflow{
    color:#000;
    background-color:#fff;
    padding: 3px 3px 3px 9px;
    margin-right: 2%;
    margin-bottom: 1%;
    overflow: auto;
    white-space: nowrap;
    min-width: auto;
  }

  .cajaTexto1{
   background-color: #fff;
   color:#000;
   padding: 3px 3px 3px 9px;
   margin-right: 2%;
   margin-bottom: 1%;
   min-width: max-content;}

   .cajaTexto1 span:before{padding-left: 15px solid rgb(2,5,99);}

   .buscadorTop {
    position: fixed;
    z-index: 1;
    background-color: #e8e8e8f0;
    left: 0px;
    top: 0px;
    overflow: hidden;
    box-shadow: -1px 2px 20px 0px #0000004a;
  }

  .imgBidi {
   background-blend-mode: darken;
   background-color: #37aaff;
   background-size: 100px;
   background-repeat: no-repeat;
   background-position: 50%;
   min-height: 90px;}


   /*-------------COLORES--------------*/

   .invertir {
     -webkit-filter: invert;
     -o-filter: invert;
     filter: invert(1);
   }

   .opa0{opacity: 0;}
   .opa10{opacity: 0.1;}
   .opa20{opacity: 0.2;}
   .opa30{opacity: 0.3;}
   .opa40{opacity: 0.4;}
   .opa50{opacity: 0.5;}
   .opa60{opacity: 0.6;}
   .opa70{opacity: 0.7;}
   .opa80{opacity: 0.8;}
   .opa90{opacity: 0.9;}
   .opa100{opacity: 1;}

   .blanco{color:#fff;}
   .negro{color:#000;}
   .gris{color: rgba(105,105,105,1.00);}
   .gris3{color:#333;}
   .colorApagado {color: rgba(0,0,0,0.32);}
   .colorGris{color: rgba(50,50,50,1);}
   .colorGris1{color: rgba(232, 232, 232,1);}
   .colorAmarillo {color: #ffce00;}
   .colorVerde{color: rgba(92, 184, 92, 1);}
   .coral{color: coral;}
   .morado{color: #7761d2;}
   .rojo{color: #ef4848;}



   .bgAzulHorse1{
    background-color:#0470c0;
  }


  .cristal1{
    background: rgba(255, 255, 255, .25);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }






  .bordeLAzul { border-left: .5rem solid #197bc3; }
  .bordeLVerdeEquipo { border-left: .5rem solid #c8e132; }

  .bgNegro{background-color: #000;}
  .bgBlanco{background-color: #fff;}
  .bgTrans{background-color: transparent;}

  .bgGrisR{background: #f2f2f1;}
  .bgGris{background-color: #e8e8e8;}
  .bgGrisA{background-color: #dcdcdc;}
  .bgGrisB{background-color: #c5c5c5;}
  .bgGrisC{background-color: #b1b1b1;}
  .bgGrisD{background-color: #888888;}
  .bgGrisE{background-color: #808080;}
  .bgGrisF{background-color: #444444;}
  .bgConsola{background-color:rgba(46,46,46,1.00)}
  .bgGrisDegradado{
    background: rgb(219,213,213);
    background: linear-gradient(352deg, rgba(219,213,213,1) 0%, rgba(194,193,193,1) 50%, rgba(219,213,213,1) 100%);
  }

  .bgGris1{background-color: #111111;}
  .bgGris2{background-color: #222222;}
  .bgGris3{background-color: #333333;}
  .bgGris4{background-color: #444444;}
  .bgGris5{background-color: #555555;}
  .bgGris6{background-color: #666666;}
  .bgGris7{background-color: #777777;}
  .bgGris8{background-color: #888888;}
  .bgGris9{background-color: #999999;}

  .bgAzul{background-color: #197bc3;}
  .bgAzulT{background-color: #197bc3a8;}
  .bgAzulA{background-color: #36a0af;}

  .bgFusia{background-color: rgba(200,26,170,1.00);}

  .bgVerdeEquipo{background-color: #c8e132;}
  .bgVerdeSWI{background-color: rgba(45, 111, 128, 0.88);}
  .alertaVerde{background:rgba(7, 117, 0,1.00);}

  .bgSeguridad{background-color: #6ec2e4;}
  .bgCalidad{background-color: #ffb700;}
  .bgPerformance{background-color: #9886d3;}

  .bgAzulMetalico1{ background-color:#011A33;  }

  .claseSeguridad{background-color: #6ec2e4;}
  .claseCalidad{background-color: #ffb700;}
  .clasePerformance{background-color: #9886d3;}
  .claseEquipo{background-color: #c8e132;}

  .colorSeguridad{color: #6ec2e4;}
  .colorCalidad{color: #ffb700;}
  .colorPerformance{color: #9886d3;}
  .colorEquipo{color: #c8e132;}

  .azul{color: #197bc3;}
  .naranja{color: #ef7748;}
  .verde{color: #5cb85c;}



  .bgEquipoT{background-color: rgba(200, 225, 50, 0.24);}




/*-------------COLORES APLICACIONES--------------*/

.bgFork{background-color:rgba(249,200,70,1);}
.bgCleaning{background-color:rgba(193,255,168,1);}
.bgHXH{background-color:rgba(238,125,249,1);}
.bgSWI{background-color: rgba(0,101,246,1);}
.bgRDS{background-color:rgba(47,177,240,1);}
.bg3A{background-color:rgba(210,91,20,1);}
.bgEquipo{background-color: rgba(200, 225, 50,1);}
.bgElectrobrochas{background-color:rgba(114,139,167,1);}

/*-------------COLORES ELECTROBROCHAS--------------*/

.bgAmarilloR{background: #FFF39F;}
.bgAmarillo{background-color: #f5ce3a;}
.bgAmarillo1{background-color: #f5bd3a;}

.bgAzulElectrobrochas{background-color:#293038;}
.bgAzul1{background-color: #0c51e8;}
.bgAzul2{background-color: #2532ce;}
.bgAzul3{background-color: #37aaff;}
.bgAzul4{background-color: #4c82ab;}
.bgAzul5 {background-color: #3a3354;}

.colorMorado{color: #3c0ce8;}
.colorMorado1{color: #5b4a9a;}

.bgMorado{background-color: #3c0ce8;}
.bgMorado1{background-color: #5b4a9a;}
.bgRojo{background-color: #ef4848;}
.bgNaranja{background-color: #ef7748;}

.colorVerdeIndicador{color:#5cb85c;}
.colorNaranjaIndicador{color:#ef7748;}
.colorRojoIndicador{color:#ef4848;}

.verdeChillon{color:rgba(51, 223, 50, 1.00);}
.rojoChillon{color:rgba(246, 27, 27, 1.00);}
.moradoChillon{color:rgba(217, 1, 246, 1.00);}
.naranjaChillon{color:rgba(255, 103, 0, 1.00);}

.colorAlertaVerde{color:rgba(7, 117, 0,1.00);}

.colorAzul5 {color: #3a3354;}
.colorAmarillo1{color: #f5bd3a;}

.bgVerde{background-color: #5cb85c;}
.bgVerdeFabrica{background-color: #aed88b;}
.bgVerdeFabrica1{background-color: #80bf80;}

.bgIncidencia1{background-color: #f5bd3a;}
.bgIncidencia2{background-color: #ef7748;}
.bgIncidencia3{background-color: #ef4848;}

.pasilloAmarillo{border-left: 12px dashed #f5ce3a; border-right: 12px dashed #f5ce3a; text-align: center;}
.pasilloBlanco{border-left: 12px dashed #fff; border-right: 12px dashed #fff;     text-align: center;}

.verdeTur {color: #48ffbc;}

.VerdeT {background-color: rgba(92, 184, 92, 0.75);}
.AmarilloT {background-color: rgba(245, 189, 58, 0.75);}

.bgVerdeT {background-color: rgba(92, 184, 92, 0.75);}
.bgAmarilloT {background-color: rgba(245, 189, 58, 0.75);}
.bgNaranjaT {background-color: rgba(239, 119, 72, 0.75);}
.bgRojoT {background-color: rgba(239, 72, 72, 0.75);}
.bgAzul4T{background-color: rgba(76, 130, 171, 0.82);}
.bgMoradoT{background-color: rgba(60, 12, 232, 0.75);}

.bgVerdeChillon{background-color:rgba(51, 223, 50, 1.00);}
.bgRojoChillon{background-color:rgba(246, 27, 27, 1.00);}


.bgOscurecer{ background-color: rgba(35,35,35,0.3);}
.bgOscurecer1{ background-color: rgba(35,35,35,0.5);}
.bgOscurecer2{ background-color: rgba(75,75,75,0.5);}
.bgOscurecer3{ background-color: rgba(150,150,150,0.5);}

.bgTransA{ background-color: rgba(255,255,255,0.3);}
.bgTrans1{ background-color: rgba(255,255,255,0.5);}
.bgTrans2{ background-color: rgba(255,255,255,0.7);}



.bgAzulA1{background-color: #79A9AA;}
.bgAzulB1{background-color: #699293;}
.bgAzulC1{background-color: #567777;}

/*-------------COLORES RDS--------------*/

.colorLupOP {color:rgba(39, 63, 90, 1.00);}
.colorLupSegu {color:rgba(41,48,56, 1.00);}

.bgLupOP {background-color:rgba(39, 63, 90, 1.00);}
.bgLupSegu {background-color:rgba(41,48,56, 1.00);}

/*-------------ICONOS---------------*/

.iconoAbsolut {
  font-size: 6em;
  position: absolute;
  top: 0;
  right: -1%;
  bottom: -1%
}

.iconoAbsolutG {
  font-size: 10em;
  position: absolute;
  top: 0;
  right: -1%;

}

.iconoAbsolutGL {
  font-size: 10em;
  position: absolute;
  top: 0;

}

.iconoAbsolutGR {
  font-size: 10em;
  position: absolute;
  right: 1%;

}

.iconoAbsolutE {
  font-size: 6em;
  position: absolute;
  top: -10px;
  left: -10px;
}



.megaIcon {
  font-size: 800%;
  height: 90px;
  overflow: hidden;
}


/** Clases de estilo para los checkbox */



.checkOk{
 color: #70ea41;
 display: contents;}
 .checkOk label{margin-bottom: 0px;}
 .checkcaja{display: grid;}
 .checkcaja label{margin-bottom: 0px;}
 .check {
  width: 24px;
  min-width: 24px;
  height: 24px;
  content: '';
  position: relative;
  transform-origin: center center;
  transition: all 1.1s cubic-bezier(0.19, 1, 0.22, 1);
  border: 2px solid #dedede;
  /*background-color: #dedede;*/
  overflow: hidden;
  cursor: pointer;
}

/*check input:checked + .box { background-color: #b3ffb7;}
input[type="checkbox"]:checked + label { background-color: #b3ffb7; }
input[type="checkbox"] { display:none; }*/

.box {
  width: 110%;
  height: 100%;
  transition: all 1.1s cubic-bezier(0.19, 1, 0.22, 1);
  border: 2px solid transparent;
  background-color: white;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0 5px rgba(0, 0, 0, 0.2);
}

.box:after {
  width: 107%;
  height: 50%;
  content: '';
  position: absolute;
  border-left: 4px solid;
  border-bottom: 4px solid;
  border-color: #40c540;
  transform: rotate(-45deg) translate3d(0, 0, 0);
  transform-origin: center center;
  transition: all 1.1s cubic-bezier(0.19, 1, 0.22, 1);
  top: 200%;
  bottom: 5%;
  margin: auto;
  z-index: 9999;
}

.myBox {
  width: 110%;
  height: 100%;
  transition: all 1.1s cubic-bezier(0.19, 1, 0.22, 1);
  border: 2px solid transparent;
  background-color: transparent;
  position: relative;
  overflow: hidden;
  cursor: pointer;

}

.myBox:after {
  width: 107%;
  height: 50%;
  content: '';
  position: absolute;
  border-left: 4px solid;
  border-bottom: 4px solid;
  border-color: initial;
  transform: rotate(-45deg) translate3d(0, 0, 0);
  transform-origin: center center;
  transition: all 1.1s cubic-bezier(0.19, 1, 0.22, 1);
  top: 200%;
  bottom: 5%;
  margin: auto;
  z-index: 9999;
}


/** Cuando esta Checked se sube el div box */
.check input:checked + .box:after {
  top: -4px;
}

/** Cuando esta Checked se sube el div box */
.check input:checked + .myBox:after {
  top: -4px;
}

.checkOpcion{
  display: inline-flex;
  min-height: 40px;
  padding: 4px 1px;
}
.checkOpcion span {
  font-family:RenaultLife;
  padding-left: 7px;
  display: flex;
  align-items: center;
  margin-bottom: 0px;
  font-weight: normal;
}


/** Fin de las clases de para los checkbox*/


/** Clases de estilo para los formularios */



.adjuntarFoto {
  overflow: hidden;
  position: relative;
  cursor: pointer;
  border: 1px solid #ccc;
  color: #ccc;
  text-align: center;
  padding-top: 3%;
  width: 200px;
  min-height: 200px;
}

.adjuntarFoto .input-file {
  margin: 0;
  padding: 0;
  outline: 0;
  opacity: 0;
  position: absolute;
  cursor: pointer;
  width: 100%;
}

.cambiarFoto .input-file {
  margin: 0;
  padding: 0;
  outline: 0;
  opacity: 0;
  position: absolute;
  cursor: pointer;
  width: 100%;
}

.archivo {
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}

.img-hacer-foto{
 background-image: url(../../imagenes/tomarFotoOperario.png);
 opacity: 0.1;
 background-repeat: no-repeat;
 background-position: 50% 60%;
 background-size: contain;
 position: absolute;
 width: 200px;
 height: 200px;
}

.formIcon{

/*  position: absolute;
  right: 0px;
  top: 0px;
  background-color: #dedede;
  padding: 5px;
  height: 40px;
  width: auto;
  line-height: 30px;
  font-size: 18px;
  pointer-events: none;
  z-index: 99;*/
}

.formIcon1 {
  position: absolute;
  right: 1px;
  top: 1px;
  background-color: #dedede;
  padding: 5px;
  height: 38px;
  max-width: 38px;
  line-height: 30px;
  font-size: 18px;
  pointer-events: none;
  margin-right: 15px;
  z-index: 99;
}

.time{
 min-width: 100%;
 -webkit-appearance: none !important;
}

/*-------------Linea de Tiempo---------------*/

.timeline {
  position: relative;

  margin: 0 auto;
  margin-top: 20px;
  padding: 1em 0;
  list-style-type: none;
}

.timeline:before {
  position: absolute;
  left: 200px;
  top: 0;
  content: ' ';
  display: block;
  width: 3px;
  height: 100%;
  margin-left: -3px;
  background: rgb(177, 177, 177);

  background: linear-gradient(to bottom, rgba(177, 177, 177,0) 0%, rgb(177, 177, 177) 8%, rgb(177, 177, 177) 92%, rgba(177, 177, 177,0) 100%);

  z-index: 5;
}

.timeline li {
  padding: 25px 0px 15px 50px;
}

.timeline li:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}


.direction-r {
  position: relative;
  width: 286px;
  float: right;
}


.iconLineaTiempo{
  width: 120px;
  height: 120px;
  position: absolute;
  left: 140px;
  z-index: 99;
  background-color: #f8f8f8;
  text-align: center;
  font-size: 400%;}

  .iconLineaTiempo span{
    border-radius: 50px;
    padding: 6%;

    display: inline-block;
    margin-top: 12px;
  }

  .tiempoTimeLine{
   width: 200px;
   float: left;
   margin-top: 40px;
 }

 .flag {
  position: relative;
  background: rgb(193, 193, 193);
  padding: 6px 10px;
  border-radius: 5px;
  font-weight: 600;
  text-align: left;
}

.direction-r .flag:after {
  content: "";
  position: absolute;
  right: 100%;
  top: 50%;
  height: 0;
  width: 0;
  margin-top: -8px;
  border: solid transparent;
  border-right-color: rgb(193, 193, 193);
  border-width: 8px;
  pointer-events: none;
}

/*-------------ESTILOS RENAULT---------------*/




.form-control {
  /*height: 40px !important;*/
  border-radius: 0px;
  background: transparent;
  color: inherit;
}


.caja {
  border: 1px solid #d9d9d9;
  height: 40px;
  overflow: hidden;
  width: 100%;
  position: relative;
  /*background-color: #f6f6f6;*/
}


input{border-radius:0px; width: 100%;}

input[type=date], input[type=number], select, textarea {
  border-radius: 0px !important;
  width: 100%;

}


input[type=date], select {
  background: transparent;
  border: none;
  /*font-size: 14px;*/
  height: 40px;
  padding: 5px;
  width: 100%;
}

/*input[type=text] {
  border-radius: 0px 0px 0px 0px;
  border: 1px solid #ccc;
  min-height: 40px;
  width: 100%;
  display: block;
  padding: 6px 12px;
}
*/

/*input[type=number] {
  border-radius: 0px 0px 0px 0px;
  border: 1px solid #ccc;
  min-height: 40px;
  width: 100%;
  display: block;
  padding: 6px 12px;
}*/


/*select,
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button,
input[type=text]::-webkit-inner-spin-button,
input[type=text]::-webkit-outer-spin-button,
input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-outer-spin-button,
input[type=password]::-webkit-inner-spin-button,
input[type=password]::-webkit-outer-spin-button,
input[type=month]::-webkit-inner-spin-button,
input[type=month]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}*/

.ancho {
  font-size: 200%;
  text-align: center;
  padding: 7%;
}

/*.caja::after {
  content: "\025be";
  display: table-cell;
  padding-top: 7px;
  text-align: center;
  width: 30px;
  height: 40px;
  background-color: #d9d9d9;
  position: absolute;
  top: 0;
  right: 0px;
  pointer-events: none;
}*/

.cajaFecha{
 border: 1px solid #d9d9d9;
 height: 40px;
 overflow: hidden;
 position: relative;
}

.caja60{
  height: 60px;
}

.caja60 input, .caja60 select{
  height: 60px;
  padding: 6px 60px 6px 12px;

}

.caja60 span{
  font-size: 30px;
  line-height: 50px;
  height:60px;
}

.caja60 input[type=date], .caja60 input[type=month] {
  padding-right: 0px;
}
.caja60 ::-webkit-calendar-picker-indicator { opacity: 0; padding-right: 44px;}



option {
  background-color: #ccc;
  color: black;
}

.panel {
  border-radius: 0px !important;
}

.panel-heading {
  margin-bottom: 0;
  border-radius: 0px !important;
}


/*-------------estilos SWI---------------*/


.btnAmarilloDegra{background: linear-gradient(to bottom,#F9C900 0,#F7B100 100%);}

.btnGrisDegra{ background: linear-gradient(to bottom,#8D8F91 0,#6C6E6F 100%);}

.btnRenault {
  width: 100%;
  float: left;
  clear: both;
  min-width: max-content;
}

.btnRenault {

  padding: 2% 0;
  cursor: pointer;
  font-weight: normal;
  border-bottom: 1px solid rgba(204,204,204,1.00);
  white-space: nowrap;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  text-transform: uppercase;
  color: #fff;
  font-family: helv-77,Arial,sans-serif;
  min-height: 36px;
  text-decoration: none;
  position: relative;
  font-size: 20px;
  height: 36px;
  box-sizing: border-box;
  border-radius: 0;

}

.btnRenault a {
  text-decoration: none;
}

.btnRenault label {

  color: #fff;
  align-items: center;
  margin-bottom: 0px;
  cursor: pointer;
  font-weight: normal;

}

.btnRenault span {
  color: #fff;
  cursor: pointer;
  font-weight: normal;
  text-transform: none;
  text-decoration: inherit;
  speak: none;
  height: 30px;
  width: 34px;
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  border-right: 1px solid;
  padding-right: 5px;
}


.btn2R{
 width: 115px;
 height:115px;
 font-family: RenaultLife;
 font-size: 15px;
 color: #FFF;
 cursor: pointer;
 display: block;
 padding-top: 5%;
 box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15);


}

.btn2R a {
  text-decoration: none;
}

.btn2R span {
  display: block;
  text-align: center;
  cursor: pointer;
  font-weight: normal;
  text-transform: none;
  text-decoration: inherit;
  speak: none;
  border-bottom: 1px solid;
  width: max-content;
  margin: auto;
  padding: 7px 14px;
  color: #fff;
}

.btn2R label {
  display: block;
  text-align: center;
  margin-bottom: 0px;
  margin-top: 2%;
  padding: 12px;
  cursor: pointer;
  font-weight: normal;
  color: #fff;
  max-width: 150px;
}


.stand{
 width: 93%;
 height: 10px;
 background: #949494;

 display: block;
 position: absolute;
 z-index: 1;
 top: 190px;
}

.stand:before{
 content: ' ';
 position: absolute;
 width: 100%;
 height: 17px;
 background: #cecece;
 top: -17px;
 left: 10px;
 -webkit-transform: skew(-50deg);
 -moz-transform: skew(-50deg);
 -ms-transform: skew(-50deg);
 -o-transform: skew(-50deg);
 transform: skew(-50deg);
 z-index: -9;
 box-shadow: 0 .15rem 1.75rem 0 rgba(58,59,69,.15);
}

.stand:after{
 content: ' ';
 position: absolute;
 width: 10px;
 height: 25px;
 top: -16px;
 right: -15px;
 background: #525252;

 -webkit-transform: rotate(74deg) skew(23deg, 16deg);
 -moz-transform: rotate(74deg) skew(23deg, 16deg);
 -ms-transform: rotate(74deg) skew(23deg, 16deg);
 -o-transform: rotate(74deg) skew(23deg, 16deg);
 transform: rotate(74deg) skew(23deg, 16deg);
 display: inline-block;

}


.filaLibros{
 position: absolute;
 top: 70px;
 z-index: 9;
 display: flex;
}


.reliebe:before{
 content: ' ';
 position: absolute;
 width: 115px;
 height: 6px;
 background-color: rgb(96, 161, 255);
 top: -6px;
 left: 19px;
 -webkit-transform: skew(-50deg);
 -moz-transform: skew(-50deg);
 -ms-transform: skew(-50deg);
 -o-transform: skew(-50deg);
 transform: skew(-50deg);
 z-index: -9;
 box-shadow: 136px 110px 1px 0px #00000087;
}

.reliebe:after{
 content: ' ';
 position: absolute;
 width: 111px;
 height: 9px;
 background-color: rgb(20, 72, 148);
 top: 50px;
 left: 78px;
 -webkit-transform: rotate(74deg) skew(23deg, 16deg);
 -moz-transform: rotate(74deg) skew(23deg, 16deg);
 -ms-transform: rotate(74deg) skew(23deg, 16deg);
 -o-transform: rotate(74deg) skew(23deg, 16deg);
 transform: rotate(74deg) skew(23deg, 16deg);
 display: inline-block;

}

.cajaRenault {
  border: 1px solid #d9d9d9;
  height: 40px;
  overflow: hidden;
  width: 100%;
  position: relative;
}

.formIconR {
  position: absolute;
  right: 0px;
  top: 0px;
  color: #8c8c8c;
  padding: 0px 7px;
  width: auto;
  line-height: 30px;
  font-size: 18px;
  pointer-events: none;
  z-index: 99;
  border-left: 1px solid #8c8c8c;
  margin: 4px 0px;
  background-color: white;
}

.flechaDown{
  width: 15px;
  height: 3px;
  background: #8c8c8c;
  position: relative;
  transform: rotate(225deg);}


  .flechaDown:before{
   content: "";
   position: absolute;
   left: 0;
   width: 3px;
   height: 15px;
   background-color: #8c8c8c;
 }

 .cajaFlecha{

  position: absolute;
  top: 4px;
  right: 0px;
  border-left: 1px solid #8c8c8c;
  width: 40px;
  height: 30px;
  background-color: white;
  pointer-events: none;

}

/*	.formIconR:before{
	width: 1px;
    border-left: 1px solid #8c8c8c;
    padding-left: 10px;
    }*/

    /*-------------RDS---------------*/


    /*-------------KITs---------------*/

    .fondoReja {
      background-image: url(https://grouperenault.es/DG/KITsPMA/imagenes/fondoReja.svg);
      background-size: 1em;
      border: 0.5em solid;
      background-color: rgba(128, 128, 128, 0.3);
      filter: invert(1);
      /*height: 630px;*/
      overflow-y: scroll;
    }

    .iconoKit {
     position: absolute;
     right: -12%;
     top: -2%;
     color: rgba(255, 255, 255, 0.59);
   }

   .imgCheck:hover img {
     transform: scale(1.01);
     opacity: 1;
     cursor: pointer;
     transition: all 0.1s;
   }
   .imgCheck {width: 49%;}

   .imgChek img {
     filter: opacity(0.5);
   }
   .puntoKit {
   }

   .m56x{margin-top:56px;}


   /*-------------MOVIL---------------*/

   @media screen and (max-width:768px){


    .movilNone{display:none;}
    .mM0{margin:0px;}
    .pM0{padding: 0px;}
    .b0-xs{border: none;}

    .movilBox{display:-webkit-box;}
    .AjusteTopListado{margin-top: 12%;}

    .coliPadV-10{width: 10%;}
    .coliPadV-20{width: 20%;}
    .coliPadV-30{width: 30%;}
    .coliPadV-40{width: 40%;}
    .coliPadV-50{width: 50%;}
    .coliPadV-60{width: 60%;}
    .coliPadV-70{width: 70%;}
    .coliPadV-80{width: 80%;}
    .coliPadV-90{width: 90%;}
    .coliPadV-100{width: 100%;}

    .coliPadV-10, .coliPadV-20, .coliPadV-30, .coliPadV-40, .coliPadV-50, .coliPadV-60, .coliPadV-70, .coliPadV-80, .coliPadV-90, .coliPadV-100 {
      position: relative;
      min-height: 1px;
      padding-right: 15px; padding-left: 15px;
      float: left;
    }


    .col-xs-1V{width: 8.333333333%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-1*/
    .col-xs-2V{width: 16.666666667% !important; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-2*/
    .col-xs-3V{width: 25%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-3*/
    .col-xs-4V{width: 33.33333333%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-4*/
    .col-xs-5V{width: 41.66666667%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-5*/
    .col-xs-6V{width: 50%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-6*/
    .col-xs-7V{width: 58.33333333%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-7*/
    .col-xs-8V{width: 66.66666667%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-8*/
    .col-xs-9V{width: 75%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-9*/
    .col-xs-10V{width: 83.33333333%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-10*/
    .col-xs-11V{width: 91.66666667%; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-11*/
    .col-xs-12V{width: 100% !important; position: relative; min-height: 1px; float:left; padding-right: 15px; padding-left: 15px;}/*col-xs-12*/



    .reduiPadV{font-size: 100%;}
    .reduiPadV97{font-size: 97%;}
    .reduiPadV80{font-size: 80%;}
    .reduiPadV5{font-size: 50%;}
    .reduiPadV6{font-size: 60%;}

    .fontiPadV2{font-size:200%;}
    .fontiPadV25{font-size:250%;}

    .fondoTargeta2{
      background-image: url(../imagenes/fondo.jpg);
      border:none !important;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: left;
      transition: 0.7s;
    }

  }

  ol, ul {
    padding-left: 0.75rem !important;
  }

  @media screen and (max-width: 596px) {


    .reduMovil50{font-size:50%!important;}
    .reduMovil{font-size:70%!important;}
    .reduMovil82{font-size:82%!important;}
    .reduMovil97{font-size:97%!important;}

    .AjusteTopListado{margin-top: 20%;}


    .px-xs-0{ padding-right:0!important; padding-left:0!important;  }
    .px-xs-4{ padding-right:4%!important; padding-left:4%!important;  }




    #introduccion{
      background-image: url(../imagenes/fondo.png);
      background-size: cover;
      background-repeat: no-repeat;
      background-position: top ;
      background-origin: revert-layer;
      background-attachment: fixed;
    }

    .cajaFooter{
     background-image: url(../imagenes/fondo.jpg);
     background-size: cover;
     background-position: 1200px 200px;
     background-attachment: fixed;;
   }
 }



 /*-------------DESKTOP---------------*/


 @media screen and (min-width:768px){

  .flexible{display: flex;}

  .absolutBDesk{position: absolute; bottom:0px;}

  .AjusteTopListado{margin-top: 10%;}


}



/*-------------XS---------------*/
@media(max-width:767px){
  .grid-column-xs-none{
    grid-template-columns: none;
  }
}
/*-------------SM---------------*/
@media(min-width:768px){

  .pr0-sm{padding-right: 0px;}

  .col-sm-1A{width: 8,333333333%; position: relative; min-height: 1px; float:left;}/*col-sm-1*/
  .col-sm-2A{width: 16,666666667%; position: relative; min-height: 1px; float:left;}/*col-sm-2*/
  .col-sm-20{width: 20%; position: relative; min-height: 1px; float:left;}
  .col-sm-3A{width: 25%; position: relative; min-height: 1px; float:left;}/*col-sm-3*/
  .col-sm-4A{width: 33.33333333%; position: relative; min-height: 1px; float:left;}/*col-sm-4*/
  .col-sm-40{width: 40%; position: relative; min-height: 1px; float:left;}
  .col-sm-5A{width: 41.66666667%; position: relative; min-height: 1px; float:left;}/*col-sm-5*/
  .col-sm-6A{width: 50%; position: relative; min-height: 1px; float:left;}/*col-sm-6*/
  .col-sm-60{width: 60%; position: relative; min-height: 1px; float:left;}
  .col-sm-7A{width: 58,33333333%; position: relative; min-height: 1px; float:left;}/*col-sm-7*/
  .col-sm-8A{width: 66,66666667%; position: relative; min-height: 1px; float:left;}/*col-sm-8*/
  .col-sm-9A{width: 75%; position: relative; min-height: 1px; float:left;}/*col-sm-9*/
  .col-sm-80{width: 80%; position: relative; min-height: 1px; float:left;}
  .col-sm-10A{width: 83,33333333%; position: relative; min-height: 1px; float:left;}/*col-sm-10*/
  .col-sm-11A{width: 91,66666667%; position: relative; min-height: 1px; float:left;}/*col-sm-11*/
  .col-sm-12A{width: 100%; position: relative; min-height: 1px; float:left;}/*col-sm-12*/

  .col-sm-14col{width: 7.142867%; position: relative; float:left;}
  .col-sm-7col{width: 14.285714%; position: relative; float:left;}
  .col-sm-8col{width: 12.5%; position: relative; float:left;}
  .col-sm-7Acol{width: 28.571428%; position: relative; float:left;}
  .col-sm-7Bcol{width: 42,857412%; position: relative; float:left;}

  .row-sm{
    margin-right: -15px;
    margin-left: -15px;
  }
}
/*-------------MD---------------*/
@media(min-width:992px){

  .pl-md {padding-left: 15px;}

  .col-md-7col{width: 14.285714%; position: relative; float:left;}
  .col-md-8col{width: 12.5%; position: relative; float:left;}
}
/*-------------LG---------------*/
@media(min-width:1200px){
 .col-lg-8col{width: 12.5%; position: relative; float:left;}
}







.animacionTexto {
  animation-name: parpadeoTexto;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

.animacion {
  animation-name: parpadeo;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}


.animacion:placeholder-shown:invalid[placeholder],
.animacion:placeholder-shown:invalid::-webkit-input-placeholder
{
  color: inherit;
  animation: anim 1s infinite;

}
.animacion:placeholder-shown:invalid[placeholder],
.animacion:placeholder-shown:invalid::-moz-placeholder
{
  color: inherit;
  animation: anim 1s infinite;

}


@keyframes anim {
 0% { background: #fff;color: rgba(0, 0, 0, .3) }
 50% { background: #4F21FF;;color:#fff; }
 100% { background: #fff;color: rgba(0, 0, 0, .3) }
}

@keyframes parpadeo {
  0% { background: #fff;color:#000; }
  50% { background: #4F21FF;;color:#fff; }
  100% { background: #fff;color:#000; }

}

@keyframes parpadeoTexto {
  0% { text-shadow: 1px 1px 2px #4f21ff;color:#000; }
  50% { text-shadow: none;color:#696969;  }
  100% { text-shadow: 1px 1px 2px #4f21ff;color:#000; }

}

.animacionBoton {
  /*position: absolute;*/

  animation-name: parpadeoBoton;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;

}

.timeline {
  position: relative;
  padding: 0;
  list-style: none;
}
.timeline::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 34px;
  width: 2px;
  background: #007bff;
}
.timeline-item {
  position: relative;
  padding: 20px 0;
  padding-left: 50px;
}
.timeline-item::before {
  content: '';
  position: absolute;
  left: 11px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #007bff;
  border: 2px solid white;
}
.timeline-item h5 {
  margin-bottom: 5px;
  font-size: 1rem;
}
.timeline-item p {
  margin-bottom: 0;
}


.calendar {
  border: 1px solid #000;
  width: 200px;
  text-align: center;
}
.calendar h3 {
  background-color: #f2f2f2;
  margin: 0;
  padding: 10px 0;
}
.days, .weeks {
  display: flex;
  flex-wrap: wrap;
}
.days div, .weeks div {
  width: 14.28%;
  border: 1px solid #ccc;
  box-sizing: border-box;
  padding: 10px 0;
}
.highlight {
  background-color: yellow;
}


/*.animacion1 {
  animation: change auto linear forwards;
  animation-timeline: view();
}*/

.animacion1 {
  min-width: 1px;
  min-height: 60px;
  padding: 1px; /* Añadir padding para dar dimensiones */
  opacity: 0; /* Start hidden */
  transform:translateY(-100px);
  transition: transform 1s, opacity 1s;
}

.form-control:focus {background: none !important;}


.animacion1.visible {
  opacity: 1;
  transform:translateY(0);
}

.animacion2 {
  animation: change2 auto linear forwards;
  animation-timeline: view();
}

.animacion3 {
  animation: change3 auto linear forwards;
  animation-timeline: view();
}

@keyframes change {
  0% {  translate: 0 0px; }
  80% {  translate: 0px -400px; }
}


@keyframes change2 {
  0% {  translate: 0 0px; }
  100% {  translate: 0px -300px; }
}

@keyframes change3 {
  0% {  translate: 0 100px; }
  100% {  translate: 0px -1000px; }
}

@media(max-width:767px){
  @keyframes change {
    0% {  translate: 0 600px; }
    100% {  translate: 0px -600px; }
  }

  @keyframes change2 {
    0% {  translate: 0 200px; }
    100% {  translate: 0px -400px; }
  }
}


@keyframes parpadeoBoton {
  0% {  box-shadow: none; }
  50% { box-shadow: 0px 0px 15px #4F21FF; }
  100% { box-shadow: none; }



  .gridScroll{
    display:grid;
    grid-template-rows: repeat(auto-fill,minmax(10rem,1fr));
    grid-auto-flow: column;
    overflow-x: auto;
    grid-gap:2rem;
    grid-auto-columns: 80px;
/*  justify-content: center;*/
}