/**
# Sección Utegra.com utegralogin
**/
*, *:before, *:after { box-sizing: inherit;}

/** Utilidades **/
body{ width: 100%;}

.seccion { margin-top: 2rem;  margin-bottom: 2rem;}

.fw-300 { font-weight: 300;}

.centrar-texto {  text-align: center;}

.d-block {  display: block !important;}

.contenido-centrado {  max-width: 800px;}

.DivBlanco4Rem {
  width: 100%;
  height: 4rem;
  background: #fff;
}

.iconos-nosotros {
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
}

.iconos-nosotros div {padding: 10px; margin-top: 20px; margin-bottom: 25px; border-radius: 10px}
.icono {text-align: center; width: 30%;}
.SeccBlnc{background: #fff;}
.SeccAzul{background: rgba(223, 237, 246, 0.2);}
.SombraDrop{
  -webkit-box-shadow: 4px 7px 5px -1px rgba(0,0,0,0.65);
  -moz-box-shadow: 4px 7px 5px -1px rgba(0,0,0,0.65);
  box-shadow: 4px 7px 5px -1px rgba(0,0,0,0.65);
}

.DivCntr{
  text-align: center !important;
  align-items: center !important;
}
/*section, div {margin: none; border: 1px red solid;}*/
section {
  margin: 0;
}
.Opurtinidad{
  height: auto;
}
.JustificaTo{ text-align: justify !important;}
.JustificaDe{ text-align: right !important;}
.JustificaIz{ text-align: left !important;}
.JustificaCe{ text-align: center !important;}
.JustiVerCen{vertical-align: middle !important;}
.JustiVerTop{vertical-align: top;}
.JustiVerBot{vertical-align: bottom;}
.TextColorBl{ color: #ffffff; }
.TextColorNg{ color: #000000; }
.TextColorRd{ color: #FF0000; }
.TextColorCi{ color: #00cccc; }
.TextColorVr{ color: rgba(0, 183, 22, 0.6); }
.TextColorAz{color: #0070b8;}
.TextColorDr{color: rgba(184, 107, 0, 0.25);}
.TextColorAzLiga{color: #0070b8;}
.TextColorAzLiga:hover{color: #0070b8;text-decoration: underline; font-style: oblique; cursor: pointer;}
.TextColorBlLiga{color: #ffe65d;}
.TextColorBlLiga:hover{color: #dddddd;text-decoration: underline; font-style: oblique; cursor: pointer;}
.TextTam08px{font-size: 8px;}
.TextTam10px{font-size: 10px;}
.TextTam12px{font-size: 12px;}
.TextTam14px{font-size: 14px;}
.TextTam16px{font-size: 16px;}
.TextTam18px{font-size: 18px;}
.TextTam20px{font-size: 20px;}
.TextTam25px{font-size: 25px;}
.TextTam30px{font-size: 30px;}
.TextTam35px{font-size: 35px;}
.TextTam40px{font-size: 40px;}
.TextLigaN{color: black;}
.TextLigaN:hover{color: #0070b8;}

.MyLabelPri{ display: inline-block;}

.TblaLstGral{border: 2px solid rgba(184, 107, 0, 0.25);}
.TblaLst{border: 2px solid rgba(184, 107, 0, 0.25); }
.AnchLst80{width: 80px;}
.AnchLst100{width: 100px;}
.AnchLst120{width: 120px;}
.AnchLst160{width: 160px;}
.AnchLst180{width: 180px;}
.AnchLst200{width: 200px;}
.AnchLst240{width: 240px;}
.AnchLst280{width: 280px;}

.RellenoCbz { height: 7.5rem; min-height: 7.5rem;}

.RellenoCbz90Med { height: 90px;  border: 1px transparent solid; width: 80%; margin: 0 auto;}
.RellenoCbz80Med { height: 80px;  border: 1px transparent solid; width: 80%; margin: 0 auto;}
.RellenoCbz60Med { height: 60px;  border: 1px transparent solid; width: 80%; margin: 0 auto;}
.RellenoCbz50Med { height: 50px;  border: 1px transparent solid; width: 80%; margin: 0 auto;}
.RellenoCbz20Med { height: 20px;  border: 1px transparent solid; width: 80%; margin: 0 auto;}

.RellenoCbz90 { height: 90px; border: 1px transparent solid;}
.RellenoCbz80 { height: 80px; border: 1px transparent solid;}
.RellenoCbz60 { height: 60px; border: 1px transparent solid;}
.RellenoCbz50 { height: 50px; border: 1px transparent solid;}
.RellenoCbz40 { height: 40px; border: 1px transparent solid;}
.RellenoCbz20 { height: 20px; border: 1px transparent solid;}
.RellenoCbz10 { height: 10px; border: 1px transparent solid;}
.RellenoCbz05 { height: 5px; border: 1px transparent solid;}
.TituloInicio { height: 4rem; border: 1px transparent solid;}
.TituloEstilo{ color: #273375; font-style: italic; font-weight: bolder; font-size: 32px;}
.TituloEstiloGrs{ color: #666666; font-style: italic; font-weight: bolder; font-size: 32px;}
.TituloEstiloPqn{ color: #0070b8; font-style: italic; font-weight: bolder; font-size: 22px;}
.TituloEstiloBlc{ color: #ffffff; font-style: italic; font-weight: bolder; font-size: 32px;}
.TituloEstiloPqnBlc{ color: #ffffff; font-style: italic; font-weight: bolder; font-size: 22px;}
.FondoSeccionBlanco {background: #fff;}
.FondoGris {background: #ddd;}
.FondoAzul {background: rgba(0, 112, 184, 0.03);}
.FondoAzul9 {background: rgba(0, 112, 184, 0.09);}
.FondoBlaco{background: white;}
.FondoBlack{background: black;}
.FondoGrisPrv{background: #cfcfcf; margin-bottom: 30px;}

.BordeDorado1b{
	border-top: 2px solid rgba(184, 107, 0, 0.25);
	border-right: 1px solid rgba(184, 107, 0, 0.25);
	border-left: 1px solid rgba(184, 107, 0, 0.25);
}
.BordeDorado1{border: 1px solid rgba(184, 107, 0, 0.25);}
.BordeDorado2{border: 2px solid rgba(184, 107, 0, 0.25);}
.BordeDorado3{border: 3px solid rgba(184, 107, 0, 0.25);}
.BordeAzul1{border: 1px solid rgba(0, 112, 187, 0.25);}
.BordeAzul2{border: 2px solid rgba(0, 112, 187, 0.25);}
.BordeAzul3{border: 3px solid rgba(0, 112, 187, 0.25);}
.BordeRo501{-webkit-text-stroke: 1px; -webkit-text-stroke-color: rgba(255, 0, 0, 0.5);}
.BordeRo502{-webkit-text-stroke: 2px; -webkit-text-stroke-color: rgba(255, 0, 0, 0.5);}
.BordeRo503{-webkit-text-stroke: 3px; -webkit-text-stroke-color: rgba(255, 0, 0, 0.5);}
.TextBordeDr{-webkit-text-stroke: 1px rgba(184, 107, 0, 0.5);} /*rgba(184, 107, 0, 0.25)*/
.TextBordeAz{-webkit-text-stroke: 1px #0070b8;} /*rgba(184, 107, 0, 0.25)*/


.TamTxt8px{ font-size: 8px;}
.TamTxt9px{ font-size: 9px;}
.TamTxt10px{ font-size: 10px;}
.TamTxt11px{ font-size: 11px;}
.TamTxt12px{ font-size: 12px;}
.TamTxt13px{ font-size: 13px;}
.TamTxt14px{ font-size: 14px;}
.TamTxt15px{ font-size: 15px;}
.TamTxt16px{ font-size: 16px;}
.TamTxt18px{ font-size: 18px;}
.TamTxt20px{ font-size: 20px;}
.TamTxt14vw{ font-size: 1.18vw;}
.TamTxt15vw{ font-size: 1.2vw;}
.TamTxt17vw{ font-size: 1.3vw;}
.TamTxt20vw{ font-size: 1.41vw;}
.TamTxt25vw{ font-size: 1.62vw;}
.TamTxt30vw{ font-size: 2.4vw;}
.TamTxt40vw{ font-size: 3.0vw;}

.SubTituloG20{ font-size: 2.0vw; }
.SubTituloG28{ font-size: 2.2vw; }
.SubTituloG34{ font-size: 2.6vw; }
.SubTituloG40{ font-size: 3.0vw; }
.SubTituloG46{ font-size: 3.4vw; }

.EnLinea, .enlinea {display: inline-block;}
.Relleno-Azul{ background: rgba(0, 112, 184, 0.05); /*#0070b8;*/ }
.Negritas{font-weight: bolder;}

.Ligeras{font-weight: lighter;}
.TexWe400{font-weight: 400;}
.TexWe450{font-weight: 450;}
.TexWe500{font-weight: 500;}
.TexWe550{font-weight: 550;}
.TexWe600{font-weight: 600;}
.TexWe650{font-weight: 650;}

.Pad2px{padding: 2px;}
.Pad4px{padding: 4px;}
.Pad6px{padding: 6px;}
.Pad8px{padding: 8px;}
.Pad10px{padding: 10px;}
.Pad10pxToBo20{padding: 10px; padding-bottom: 20px; padding-top: 20px;}
.PadIzq2px{padding-left: 2px;}
.PadIzq4px{padding-left: 4px;}
.PadIzq6px{padding-left: 6px;}
.PadIzq8px{padding-left: 8px;}
.PadIzq10px{padding-left: 10px;}
.PadIzq20px{padding-left: 20px;}
.PadIzq05pc{padding-left: 5%;}
.PadIzq10pc{padding-left: 10%;}
.PadIzq20pc{padding-left: 20%;}
.PadIzq40pc{padding-left: 40%;}
.PadIzq60pc{padding-left: 60%;}
.MargIzq05px{margin-left: 5px;}
.MargIzq10px{margin-left: 10px;}
.MargIzq20px{margin-left: 20px;}
.MargDrc10px{margin-right: 10px;}
.MargDrc05px{margin-right: 5px;}
.MargDrc20px{margin-right: 20px;}
.MargeInt05{ margin-top: 5px }
.MargeInt10{ margin-top: 10px }
.MargeInt15{ margin-top: 15px }
.MargeInt20{ margin-top: 20px }

.Negrita {font-weight:bold;}
.Cursiva {font-style:italic;}
.Normal {font-style:normal;}
.Tachado {text-decoration:line-through;}
.TamaDiv40pc{width: 40%;}
.TamaDiv50pc{width: 50%;}
.TamaDiv60pc{width: 60%;}
.TamaDiv70pc{width: 70%;}
.TamaDiv80pc{width: 80%;}
.TamaDiv90pc{width: 90%;}
.Margin0Auto{margin: 0 auto;}
.img100x10{width: 100%; height: 30px;}

.imgAgris{filter: grayscale(0);}


.MargTop10px{margin-top: 10px !important;}

/*################################ Cabecera ####################################*/
.gUt-CabFija{  position:absolute;  z-index: 1000;}
/* __________ Menu Usuario  ____________*/
/* ================== Cabecera ======================== */
.gUtCabeceraHome {
  margin-bottom: 0;
  background: #0070b8;
  font-weight: bold;
  width: 100%;
  height: 80px;
  border: 1px red solid;
}
.gUtCabecera {
  margin-bottom: 0;
  background: #0070b8;
  font-weight: bold;
  width: 100%;
  background: #0070b8;
  height: 80px;
}

/* ================== contenedores ======================== */
.gUtContenedor {
  display: inline-block;
  width: 100%;
  background: #273375; /* #0070b8;*/
}
.gUtContenedor div{width: 32%; vertical-align:top;}

.DivDerecha {
  float: right;
  height: 70px;
}

.contenedorUser {
  display: flex;
  height: 70px;
  width: 100%;
}

.DivDerecha {
  float: right;
  height: 70px;
}

.ContUsuario {
  width: 70%;
  height: 70px;
  background: #0070b8;
}
.BuscarCss{
  text-align: right;
}

.ContenedorSecc {
  background: #fff;
}

.TrianguloAbajo {
  background: transparent;
}

.MyimgTr {
  width: 100%;
  height: 200px;
  button: 0;
}


/* ================== logos ======================== */
.mylogoModal {
  width: 220px;
  height: 110px;
  margin: 5px;
}

.mylogo {
  width: 140px;
  height: 78px;
  margin: 5px;
  background: #0070b8;
}

.mylogo2User {
  width: 100px;
  /*-moz-height: 67px;*/
  -webkit-height: 57px;
  padding-left: 5px;
  margin-right: 5px;
}

.mylogo2User img {
  width: 100px;
  /*-moz-height: 67px;*/
  -webkit-height: 57px;
  filter: drop-shadow(0 2px 5px rgba(255, 255, 255, 0.8));
}
/* ================== menu ======================== */
.mylogo-avatar {
  width: 35px;
  height: 35px;
}
.mylogo-menu {
  width: 45px;
  height: 35px;
}

.dropMenu {
  position: fixed;
  width: 100%;
  filter: drop-shadow(0 5px 5px rgba(0, 0, 0, 0.5));
}

.BarraMenu {
  display: flex;
  background: #0070b8;
  padding: 15px;
}

.BarraMenu a {
  color: #fff;
  text-decoration: none;
  background: #0070b8;
  font-size: 12px;
}

.BarraMenu a:hover {
  color: #000;
}

.ImgMenuUsr {
  display: inline-flex;
  height: 35px;
}

.ImgMenuUsr img {
  width: 35px;
  height: 25px;
  margin: 0;
  -webkit-filter: invert(1);
  filter: invert(1);
}

.ImgMenuUsr img:hover {
  filter: drop-shadow( 0 21px 5px rgba(255, 255, 255, 0.75));
  -webkit-filter: drop-shadow( 0px 0px 21px 5px rgba(255, 255, 255, 0.75));
  filter: invert(0);
  -webkit-filter: invert(0);
}
/* ================== menu lateral ======================== */
.cntOjo{position: relative;}
.cntOjo .verOjo{
  position: absolute; color: rgba(184, 107, 0, 0.5);
  top: -10px; right: 5px;
}
.cntOjo .sdwOjo{text-shadow: -2px 2px 3px rgba(0, 0, 0, 0.3);}

/*.menuLateral{ width: 90%;}*/
.menuasidelateral{
    /*position: fixed;
    z-index: 990;
    top: 6rem;
    left: 0px;
    padding-left: 5px;
    padding-top: 8rem;*/
    background: #fff; /*rgba(0, 112, 184, 1); /*#00426B;*/
    color: black; /* white;*/
    width: 5rem;
    height: 58.6vh;
    /*overflow: scroll;*/
}
.menuasidelateral::-moz-scrollbars-none{
  width: 13px;
  overflow: hidden;
}

.menuasidelateral::-webkit-scrollbar{
  width: 13px;
  display: none;
}
.anchor{
  height: 18px;
}
.menucontenedorlateral{
    background: #fff;
    /*margin-left: 6.3rem;*/
    width: 90%;
    height: auto;
}
.menucontenedorlateral .contenedorresultado{height: 90vh; width: 100%;}
.OrdenMenLat{padding-top: 15px;}
.Principal{display: flex; margin-left: 10px;}
.OrdenMenLat .LetrasOrden{font-size: 11px; margin-left: 10px;}
.OrdenMenLat .ImgUpDown{
    width: 15px;
    height: 28px;
    border: 2px #E2C499 solid;
    background: #fff;
  }
  .ImgUpDown img{width: 15px; height: 28px;}
  .ImgUpDown img:hover{cursor: pointer;}

.VisFichas{}
.VisFichas .ImgVisFich{
  width: 15px;
  height: 24px;
  border: 3px #E2C499 solid;
  background: #fff;
}
.ImgVisFich img{width: 15px; height: 18px;}
.ImgVisFich img:hover{cursor: pointer;}

  .OculInput, .VisResVis {
    display: none;
  }
/* --------------------------------- */
/*.ColorVerd{ background:  rgba(5, 107, 91, 0.95) !important; }*/
.ColorVerd{ background:  rgba(5, 142, 91, 0.95) !important; }
/*------------- Botones check --------------*/
.FilTituInicial{/* Titulo de Buscar por */
    width: 100%;
    font-size: 13px;
    font-weight: bold;
    margin: 0px 0px .5rem 0px;
    padding-left: 0.2rem;
    background: #ddd;
    color: #000;
}

/*======================================*/
.OpcMenuOrden{
  font-size: 11px;
  font-weight: bold;
}
.OpcMenuLateral{
  width: 4rem;
  height: 1.5rem;
  padding: 2px;
  margin-left: 2px;
  margin-bottom: 1rem;
}

.OpcMenuLateral .FilTitu{
    width: 4.6rem;
    height: 1.4rem;
    font-size: 11px;
    font-weight: bold;
}
.OpcMenuLateral .switch-button {
    display: inline-block;
    position: relative;
    height: 1rem;
    width: 2.2rem;
}
.switch-button .switch-button__checkbox {
    display: none;
}
/* es la barra de desplazamiento del boton */
.switch-button .switch-button__label {
    background: red;
    width: 2.1rem;
    height: .8rem;
    border-radius: 3rem;
    display: inline-block;
    position: relative;
    border: 1px #fff solid;
}
.switch-button .switch-button__label:before {
    transition: .2s;
    display: block;
    position: absolute;
    width: .6rem;
    height: .6rem;
    background: #fdffff;
    content: '';
    border-radius: 50%;
    box-shadow: inset 0px 0px 0px 1px black;
}
.switch-button .switch-button__checkbox:checked + .switch-button__label {
    background: #0AC4A8;
}
.switch-button .switch-button__checkbox:checked + .switch-button__label:before {
    transform: translateX(1.3rem);
}
/*----------------- Botones check generales -----------------*/
:root {
    --color-green: #00a878;
    --color-red: red;
    --color-button: #dcdcdc;
    --color-black: #000;
    --color-white: #fff;
    --color-blue: #0070b8;
}
.BotonSwitch {
    display: inline-block;
}
.BotonSwitch .BotonSwitch__checkbox {
    display: none;
}
.BotonSwitch .BotonSwitch__label {
    width: 40px;
    height: 17px;
    border-radius: 18px;
    border: 2px var(--color-red) solid;
    display: inline-block;
    position: relative;
}
.BotonSwitch .BotonSwitch__label:before {
    transition: .2s;
    display: block;
    position: absolute;
    top: 1px;
    left: 2px;
    width: 11px;
    height: 11px;
    background-color: var(--color-red);
    content: '';
    border-radius: 50%;
}
.BotonSwitch .BotonSwitch__checkbox:checked + .BotonSwitch__label {
    background-color: var(--color-white);
    border: 2px var(--color-green) solid;
}
.BotonSwitch .BotonSwitch__checkbox:checked + .BotonSwitch__label:before {
    transform: translateX(21px);
    background-color: var(--color-green);
}
.AnchoTdTabla{width: 55px;}

.BotonSwitch .BotonSwitch__checkbox__disable {
    display: none;
}
.BotonSwitch .BotonSwitch__label__disable {
    width: 40px;
    height: 17px;
    border-radius: 18px;
    border: 2px var(--color-button) solid;
    display: inline-block;
    position: relative;
}
.BotonSwitch .BotonSwitch__label__disable:before {
    transition: .2s;
    display: block;
    position: absolute;
    top: 1px;
    left: 2px;
    width: 11px;
    height: 11px;
    background-color: var(--color-button);
    content: '';
    border-radius: 50%;
}
.BotonSwitch .BotonSwitch__checkbox__disable:checked + .BotonSwitch__label__disable {
    background-color: var(--color-white);
    border: 2px var(--color-button) solid;
}
.BotonSwitch .BotonSwitch__checkbox__disable:checked + .BotonSwitch__label__disable:before {
    transform: translateX(21px);
    background-color: var(--color-button);
}


/* ----- Usuarios -----*/
  .BordeDorado2{
    border: 2px solid rgba(184, 107, 0, 0.5);
  }
  .BordeBlanco2{
    border: 2px solid rgba(255, 255, 255, 1);
  }
  .BuscarCss{
    text-align: center;
    margin: 1rem 0 0 0;
  }
  .LargoInput{
    width: 15rem;
    height: 2rem;
    border-radius: 9px;
  }
  .BttnEstilo{
    height: 2rem;
    width: 5rem;
    border-radius: 9px;
    color: rgba(255, 255, 255, 1);
    background: transparent;
  }
  .BttnEstilo:hover{
    background: rgba(255, 255, 255, 0.3);
  }

/* ###################################################################################### */
/*################################ Inicio pancartas ####################################*/

/* __________ Caratula de Videos inicio ____________*/
.TituloPnlInf {
  height: 45px;
  min-height: 45px;
  padding-top: 2px;
}

.TituloPnlInf h3, h4, h5, h6 {
  text-align: center;
}

img {
  max-width: 100%;
}

.EspacioBlc {
  width: 100%;
  height: 1px;
}

.ContenedorFondo1 {
  display: flex;
  position: fixed;
  left: 21px;
  top: 140px;
  z-index: -99;
  width: 96.5%;
  height: 69%;
  margin: 0px;
}

.ContenedorFondo1 img {
  width: 100%;
  height: 110%;
}

.ContenedorFondo2 {
  position: fixed;
  z-index: -90;
  width: 100%;
  height: 50%;
}
/*................ vista del contenedor ..........*/
.Contenedor {
  padding-top: 35px;
  height: 480px; /*height: 28.2rem;*/
  width: 100%;
  background: rgba(0,0,0,0.3);
}

.Contenedor .ContCajaTotal {
  position: relative;
  width: 100%;
  /*
  height: 480px;
  left: 0;
  bottom: 0;
  */
}

.ContCajaTotal .ContModal {
  /*display: flex;*/
  width: 100%;
  height: 500px;
  color: #fff;
  background: rgba(0,0,0,0.3);
  /*padding: 20px 10px 0 21px;*/
}

.ContModal .modales {
  /*display: absolute;*/
  width: 100%;
  height: 485px;
  padding: 8px;
  color: #fff;
  background: rgba(0,0,0,0.3);
  z-index: -50;
}


.ContMarcoModal {
  height: 100%;
}

/*
.ContCajaTotal  .Marco {height: 100%;}
.Marco .Marcos {  position: absolute;  height: 100%; width: 100%; top: 0;}
*/
.ContCajaTotal  .Marco {height: 50%;}
.ContCajaTotal  .Marcos {  position: absolute;  height: 50%; width: 100%; top: 0;}

.Marcos  img {
  position: absolute;
  width: 100%;
  bottom: 0;
}

.ContenidoQuienes {
  /*display: absolute;*/
  height: 100%;
/*  filter: drop-shadow( 0px 0px 21px 5px rgba(255, 255, 255, 0.75));
  -webkit-filter: drop-shadow( 0px 0px 21px 5px rgba(255, 255, 255, 0.75));
  -moz-filter: drop-shadow( 0px 0px 21px 5px rgba(255, 255, 255, 0.75));*/
  border: 1px transparent solid;
}

.ContenidoQuienes h3 {
  padding-left: 20px;
  color: white;
  /*text-shadow: 1px 1px white, -1px -1px #333;
  text-shadow: black 0.1em 0.1em 0.2em;*/
}

.ContenidoQuienes p {
  padding: 40px;
  color: white;
  font-size: 20px;
  line-height: 35px;
  text-align: justify;
  /*text-shadow: black 0.1em 0.1em 0.2em;*/
}

.sinnadasection{
   margin: 0px; padding: 0px;
}
.BlcTrspMsg {
  background: rgba(0,0,0,0.5);
  margin: 0 .4rem 1px 1.2rem;
}

.ContenidoQuienes img {
  width: 100%;
}
/*========================== Marcos, Busqueda y Modales de Busqueda ====================*/
/* ................................................ */
.CntndrBase {
  width: 100%;
  background: #fff;
  border: 1px #fff solid;
}
.CntndrBaseTrnsp{
  width: 100%;
  border: 1px #fff solid;
}

.CntrAnuncio {
  width: 95%;
  max-width: 120rem;
 /** = 1200px; **/
  margin: 5rem auto;
  padding: 2rem 0;
  border: 2px solid rgba(184, 107, 0, 0.25);
  background: #fff;
}

.CntraTxt {
  text-align: center;
  padding-left: 20px;
}

.CntdManejaDspl {
  width: 100%;
}

.CarrucelCajaVid{
    width: 100%;
}
.CntdrVidIO {
  /*border: 2px solid rgba(184, 107, 0, 0.25);*/
  width: 90%;
  margin: 10px auto;
  align-items: center;
  text-align: center;
  /*
  -webkit-box-shadow: 4px 7px 5px -1px rgba(0,0,0,0.75);
  -moz-box-shadow: 4px 7px 5px -1px rgba(0,0,0,0.75);
  box-shadow: 4px 7px 5px -1px rgba(0,0,0,0.65);
  */
}

.ContenedorDivVideo div {
  display: inline-table;
  width: 100%;
  text-align: left;
}

.PanelInf {
  flex-basis: calc(33.3% - 1rem);
  width: 15rem;
  min-width: 15rem;
  max-width: 15rem;
  height: 24rem;
  max-height: 24rem;
  border: 2px solid rgba(184, 107, 0, 0.25); /* Cafe suabe Color de borde */
  /*border: 2px #b5b5b5 solid;*/
  margin: 15px;
  padding: 0 5px;
  border-radius: 9px;
  background: rgba(223, 237, 246, 0.1);
}

.PanelInf2 {
  flex-basis: calc(33.3% - 1rem);
  width: 14rem;
  min-width: 14rem;
  max-width: 14rem;
  height: 17.7rem;
  max-height: 17.7rem;
  border: 2px solid rgba(184, 107, 0, 0.25); /* Cafe suabe Color de borde */
  /*border: 2px #b5b5b5 solid;*/
  margin: 22px;
  padding: 0 5px;
  border-radius: 9px;
  background: rgba(223, 237, 246, 0.1);
}
.PanelInf2:hover {box-shadow: 4px 7px 5px -1px rgba(0,0,0,0.65);
  z-index: 1; /* Hace que la ficha se posicione por encima de los demás elementos */
  transform: scale(1.12); /* Amplía la ficha al 112% de su tamaño original */
}
.PanelInf2_Sd{}
.PanelInf2_Sd:hover {box-shadow: 4px 7px 5px -1px rgba(0,0,0,0.65);}

.PanelInf2 .ImgVid {
  width: 13rem;
  height: 43%;
}

.PanelInf .ImgVid {
  width: 15rem;
  height: 35%;
}

.ContenidoInfVideo {
}

.ContenidoInfVideo .InfVide {
  width: 98%;
  font-size: 12px;
  text-align: justify;
  margin: 0.5rem 0;
  padding: 0 2px;
  height: 4.5rem;
  min-height: 4.5rem;
  max-height: 4.5rem;
  line-height: 1.1;
}

.ContenidoInfVideo .DataVid {
  font-size: 11px;
  font-weight: bold;
}

.ContenidoInfVideo .DataVid p {
  line-height: .3;
}

.ImgNorm {
  width: 225px;
  height: 110px;
}

.DataVid {
  line-height: 1.2;
}

.DataVid .Expo, .DataVid .Fecha, .DataVid .Catalo {
  display: flex;
  margin-top: 3px;
}

.Etiqueta {
  text-align: left;
  width: 3.7rem;
  max-width: 3.7rem;
}

.DataVid .Datos {
  text-align: left;
}

.LineaCstCrr {
  display: inline-block;
  width: 100%;
  height: 19px;
}

.LineaCstCrr div{
  height: 19px;
}
.LineaCstCrr .FondVerde {
  background: #01C776; /*#08A490; #47B809;*/
  border-radius: 5px;
  border: 2px #08a490 solid;
}
.LineaCstCrr .Carrito {
  margin: 0 0 0 20px;
  width: 20%;
  height: 1.2rem;
}

.SombraFilterOjo {
    border: 1px #ccc solid;
    border-radius: 5px;
    padding-left: 5px;
    background-color: #f1f1f1;
}
.SombraFilterOjo:hover {
  filter: drop-shadow(1px 3px 1px rgba(0,112,184,0.65));
}

.SombraFilter{}
.SombraFilter:hover {filter: drop-shadow(1px 3px 1px rgba(0,112,184,0.65));}
.SombraLetrasAzul {filter: drop-shadow(1px 3px 1px rgba(0,112,184,0.45));}
.SombraLetrasGris {filter: drop-shadow(1px 3px 1px rgba(0,0,0,0.45));}
.SombraLetrasAzulHo:hover {filter: drop-shadow(1px 3px 1px rgba(0,112,184,0.45));}
.SombraLetrasGrisHo:hover {filter: drop-shadow(1px 3px 1px rgba(0,0,0,0.45));}
.fondoAzul {}
.fondoGris {}
.fondoVerd {}
.fondoAzul:hover {background: rgba(0,112,184,0.45);}
.fondoGris:hover {background: rgba(0,0,0,0.45);}
.fondoVerd:hover {background: rgba(0,205,0,0.45);}

.LineaCstCrr .Centro {
  text-align: center;
}
.LineaCstCrr .Derecha {
  text-align: right;
}


.LineaCstCrr .Carrito img {
  padding: 0px;
  width: 18px;
  height: 1.2rem;
}

.LineaCstCrr  .BttnPrecio {
  border-radius: 5px;
  padding: 0px 8px;
  width: 25%;
  height: 19px;
}

.SoloCarrito {
  padding: 0px;
  margin-left: 10px;
  width: 18px;
  height: 19px;
}
.BotonCarritoMay {
  position: absolute;
  top: 92%;
  left: 43%;
  border: 2px #fff solid;
  width: 100px;
  border-radius: 15px;
  background: rgba(0, 178, 203, 0.9);
  color: green;
  padding: 8px;
}
.BotonCarritoMay:hover {
  background: #01C776;
}

.SoloCarritoMay {
  padding: 0px;
  width: 28px;
  height: 29px;
}

.borrar-producto, .borrar-guardada,
.crsrPointer{cursor: pointer;}

/*"""""""""""""""""" New Pancartas """"""""""""""""""""*/

/*..................................*/
.TituloPnlInfGrd {
  height: 3.5rem;
  max-height: 3.5rem;
  min-height: 3.5rem;
}

.TituloPnlInfGrd h3, h4, h5, h6 {
  text-align: center;
  margin: 0px;
  padding: 0px;
}

.EstiloPanelInfGrd{
  padding: 0 5px;
  border-radius: 9px;
  background: rgba(223, 237, 246, 0.1);
  border: 2px solid rgba(184, 107, 0, 0.25);
  margin: 20px;
}
.PanelInf2Grd {
  flex-basis: calc(33.3% - 1rem);
  width: 20rem;
  min-width: 20rem;
  max-width: 20rem;
  height: 20rem;
  max-height: 20rem;
}

.PanelInfGrd {
  flex-basis: calc(33.3% - 1rem);
  width: 20rem;
  min-width: 20rem;
  max-width: 20rem;
  height: 28.2rem;
  max-height: 28.2rem;
}

.ImgVidGrd {
  margin-top: 4px;
  width: 100%;
  height: 45%;
}

.PanelInfGrdLst {
  flex-basis: calc(33.3% - 1rem);
  width: 90%;
  height: auto;
}

.ImgVidGrdLst {
  margin-top: 4px;
  width: 6rem;
  height: 3rem;
}
.ImgNormLst {
  width: 6rem;
  height: 3rem;
}
.InfVideGrdLst {
  font-size: 13px;
  text-align: justify;
  margin-top: 0.1rem;
  margin-bottom: 0.5rem;
  padding: 0 2px;
  line-height: 1.1;
}
.DataVidLst {
 font-size: 12px;
 font-weight: bold;
}
.DataVidLst .Expo, .DataVidLst .Fecha, .DataVidLst .Catalo {display: flex;}
.DataVidLst .Costos, .DataVidLst .Valora, .DataVidLst .Carri{display: inline;}
.LineaCstCrrLst .Forma{ font-size: 12px; font-weight: bolder; height: 20px; border:.1rem transparent solid; cursor: pointer;}

.LineaCstCrrLst .CarritoGrd,
.LineaCstCrrLst .CarritoGrdVal  { margin: 0 0 0 3px; width: 2.6rem; height: 1.5rem;}
.LineaCstCrrLst .CarritoGrd:hover {-webkit-filter: invert(100%); filter: invert(100%);}
/*.LineaCstCrrLst .CarritoGrdVal { margin: 0 0 0 3px; width: 2.6rem; height: 1.5rem;}*/

.LineaCstCrrLst .FondVerde {
  background: #01C776; /*#08A490; #47B809;*/
  border-radius: 5px;
  border: 2px #08a490 solid;
  text-align: center;
}

.LineaCstCrrLst .CarritoGrd img {
  padding: 0px;
  width: 18px;
  height: 1.2rem;
}
.LineaCstCrrLst .CarritoGrdVal img {
  padding: 0px;
  width: 18px;
  height: 1.2rem;
}
.LineaCstCrrLst .PrecioGrdLst{
  border: 1px rgba(184, 107, 0, 0.60) solid;
  background: rgba(184, 107, 0, 0.60);
  width: 4rem;
  height: 1rem;
  border-radius: 5px;
  color: white;
}

        /*.................................*/
.ContenidoInfVideo .InfVideGrd {
  width: 98%;
  font-size: 12px;
  text-align: justify;
  margin-top: 0.1rem;
  margin-bottom: 0.5rem;
  padding: 0 2px;
  height: 3.5rem;
  min-height: 3.5rem;
  max-height: 3.5rem;
  line-height: 1.1;
}

    /*..................................*/
.LineaCstCrr .CarritoGrd {
  margin: 0 0 0 45px;
  width: 20%;
  height: 1.2rem;
}
.LineaCstCrr .CarritoGrd img {
  padding: 0px;
  width: 18px;
  height: 1.2rem;
}
.LineaCstCrr .PrecioGrdDrd{
  border: 1px rgba(184, 107, 0, 0.60) solid;
  background: rgba(184, 107, 0, 0.60);
  margin-left: 8px;
  margin-top: 0px;
  width: 4rem;
  height: 1rem;
  border-radius: 5px;
  padding: 0 2px 4px 8px;
  color: white;
}
.LineaCstCrr .PrecioGrdVrd{
  border: 1px rgba(184, 107, 0, 0.60) solid;
  background: rgba(1, 199, 118, 0.90);
  margin-left: 8px;
  margin-top: 0px;
  width: 4rem;
  height: 1rem;
  border-radius: 5px;
  padding: 0 2px 4px 8px;
  color: black;
}
.LineaCstCrr .PrecioGrdLibre{
  /*border: 1px rgba(184, 107, 0, 0.60) solid;
  background: rgba(1, 199, 118, 0.90);
  margin-left: 8px;*/
  margin-top: 0;
  width: 4rem;
  height: 1rem;
  border-radius: 5px;
  padding: 4px 2px 3px 8px;
  font-weight: bolder;
  color: black;
}
.LineaCstCrr .prcTmnTxt{font-size: 14px;}

.EstiloPanelInfGrd .DivEspacioBttn{
  width: 99%;
  height: 1.7rem;
  margin-top: .5rem;
  border-radius: 5px;
  background: rgba(0, 179, 203, 0.38);
}
.DivEspacioBttn .BttnLeerMasGrd{
  padding-top: 2px;
  text-align: center;
  color: #000;
  /*font-weight: bold;*/
}

    /*..................................*/

/*################################ Botoens ####################################*/

.BttnPrecGral{
  text-align: center !important;
  /*border: 2px solid rgba(0, 179, 203, 0.38);*/
  border-radius: 5px;
  padding: 0 8px;
/*  background: rgba(10, 183, 207, 0.68);  */
  background: rgba(0, 179, 203, 0.38);
  color: white;
  font-weight: bolder;
}
.BttnPrLrM {
  width: 13.2rem;
  max-width: 13.2rem;
  margin: 5px;
}
.BttnPrLrM2 {
  width: 205px; /*12.8rem;*/
  max-width: 205px;
  margin-top: 5px;
  text-align: center !important;
  font-weight: bolder;
}

.BttnPrLrM2:hover{
  background:  rgba(0, 179, 203, 0.2);
  border-radius: 15px;
  color: black;
}

.DataVid .PrecioDrd {
  background: rgba(184, 107, 0, 0.60); /*#B86B00;*/
  border: #B86B00;
  border-radius: 5px;
  height: 1.2rem;
  padding: 0 9px 0 5px;
  padding-top: 4px;
  padding-bottom: 1px;
}

.BttPrecio {
  display: inline-flex;
  margin-bottom: 0.4rem;
}

.SbrBttn {
  -webkit-box-shadow: 10px 10px 13px -5px rgba(0,0,0,0.75);
  -moz-box-shadow: 10px 10px 13px -5px rgba(0,0,0,0.75);
  box-shadow: 10px 10px 13px -5px rgba(0,0,0,0.75);
}

.CntdrMnsgPrq {
  margin-top: 25px;
}

.BotonActiva {
  /*position: absolute;
  top: 10px;*/
  left: 19px;
  width: 100%;
  height: 120px;
  z-index: 20;
}

.bottones {
  /*Cambiar Solo en Servidor*/
  /*
  height: 32px;
  width: 144px;
  */
  height: 64px;
  width: 11rem;
  padding: 15px 10px 20px 25px;
  margin: 10px 44%;
  cursor: pointer;
  display: inline-block;
  color: #FFF;
  font-size: 1em;
  font-weight: bold;
  border: 1px solid #aaa;
  background: #eee;
  border-radius: 6px;
  line-height: 2em;
  text-decoration: none;
  /*
  -webkit-transition: all 0.3s linear;
  -khtml-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear;
  */
}

.bottones:hover {
  -webkit-box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
  -khtml-box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
  -moz-box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
  -o-box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
  box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
  text-decoration: none;
  color: #fff;
  font-weight: bold;
}

.bottones:active {
  -webkit-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
  -khtml-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
  -moz-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
  -o-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
  box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
  text-shadow: 1px 1px 1px #eee;
}

.light {
  display: block;
  position: relative;


  background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0) 100%);
 /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 100%);
 /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 100%);
 /* Opera 11.10+ */
  /*background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 100%);*/
 /* IE10+ */
  background: linear-gradient(to left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 100%);
 /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 );
 /* IE6-9 */


  padding: 1px 9px;
  top: -16px;
  left: -53px;
  height: 0px;
}

.bottones:hover .light {
  padding: 1px 5px;
  -webkit-animation-name: shine;
  -webkit-animation-duration: 0.6s;
  -webkit-animation-timing-function: linear;
  -khtml-animation-name: shine;
  -khtml-animation-duration: 0.6s;
  -khtml-animation-timing-function: linear;
  -moz-animation-name: shine;
  -moz-animation-duration: 0.6s;
  -moz-animation-timing-function: linear;
  -o-animation-name: shine;
  -o-animation-duration: 0.6s;
  -o-animation-timing-function: linear;
  -webkit-animation-name: shine;
  -webkit-animation-duration: 0.6s;
  -webkit-animation-timing-function: linear;
  left: 45px;
}


/***********************************************************************
 *  Green Background
 **********************************************************************/
.green {
  background: rgb(126,156,61);
  background: -moz-linear-gradient(0deg, rgba(126,156,61,1) 0%, rgba(205,235,142,1) 100%, rgba(255,255,255,0.29735644257703087) 100%);
  background: -webkit-linear-gradient(0deg, rgba(126,156,61,1) 0%, rgba(205,235,142,1) 100%, rgba(255,255,255,0.29735644257703087) 100%);
  background: linear-gradient(0deg, rgba(126,156,61,1) 0%, rgba(205,235,142,1) 100%, rgba(255,255,255,0.29735644257703087) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7e9c3d",endColorstr="#ffffff",GradientType=1);
}

/***********************************************************************
 *  Red Background
 **********************************************************************/
.red {
  background: rgb(207,0,0);
  background: -moz-linear-gradient(0deg, rgba(207,0,0,1) 0%, rgba(255,103,103,0.8267682072829132) 100%, rgba(255,122,122,0.5) 100%);
  background: -webkit-linear-gradient(0deg, rgba(207,0,0,1) 0%, rgba(255,103,103,0.8267682072829132) 100%, rgba(255,122,122,0.5) 100%);
  background: linear-gradient(0deg, rgba(207,0,0,1) 0%, rgba(255,103,103,0.8267682072829132) 100%, rgba(255,122,122,0.5) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cf0000",endColorstr="#c40000",GradientType=1);

}



/***********************************************************************
 *  Black Background
 **********************************************************************/
.black {
background: rgb(14,14,14);
background: -moz-linear-gradient(0deg, rgba(14,14,14,1) 0%, rgba(125,126,125,1) 100%, rgba(255,255,255,0.29735644257703087) 100%);
background: -webkit-linear-gradient(0deg, rgba(14,14,14,1) 0%, rgba(125,126,125,1) 100%, rgba(255,255,255,0.29735644257703087) 100%);
background: linear-gradient(0deg, rgba(14,14,14,1) 0%, rgba(125,126,125,1) 100%, rgba(255,255,255,0.29735644257703087) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0e0e0e",endColorstr="#ffffff",GradientType=1);
}


/***********************************************************************
 *  Blue Background
 **********************************************************************/
.blue {
  background: rgb(0,112,184);
  background: -moz-linear-gradient(0deg, rgba(0,112,184,1) 0%, rgba(0,127,209,1) 50%, rgba(122,188,255,1) 100%);
  background: -webkit-linear-gradient(0deg, rgba(0,112,184,1) 0%, rgba(0,127,209,1) 50%, rgba(122,188,255,1) 100%);
  background: linear-gradient(0deg, rgba(0,112,184,1) 0%, rgba(0,127,209,1) 50%, rgba(122,188,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0070b8",endColorstr="#7abcff",GradientType=1);
}

/***********************************************************************
 *  Dark Red Background
 **********************************************************************/
.darkred {
  background: rgb(133,0,0);
  background: -moz-linear-gradient(0deg, rgba(133,0,0,1) 0%, rgba(184,0,0,1) 50%, rgba(255,122,122,1) 100%);
  background: -webkit-linear-gradient(0deg, rgba(133,0,0,1) 0%, rgba(184,0,0,1) 50%, rgba(255,122,122,1) 100%);
  background: linear-gradient(0deg, rgba(133,0,0,1) 0%, rgba(184,0,0,1) 50%, rgba(255,122,122,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#850000",endColorstr="#ff7a7a",GradientType=1);
}


@-webkit-keyframes shine {
  0%  { top: -15px; left: -48px;}
  10% { top: -5px;}
  20% { top: 5px;}
  30% { top: 15px;}
  40% { top: 25px;}
  50% { top: 35px;}
  60% { top: 25px;}
  70% { top: 15px;}
  80% { top: 5px;}
  90% { top: -5px;}
  100% {top: -15px; left: 45px; -webkit-transform: rotate(-360deg);}
}


@-moz-keyframes shine {
  0%  { top: -15px; left: -48px;}
  10% { top: -5px;}
  20% { top: 5px;}
  30% { top: 15px;}
  40% { top: 25px;}
  50% { top: 35px;}
  60% { top: 25px;}
  70% { top: 15px;}
  80% { top: 5px;}
  90% { top: -5px;}
  100% {top: -15px; left: 45px; -moz-transform: rotate(-360deg);}
}

@-o-keyframes shine {
  0%  { top: -15px; left: -48px;}
  10% { top: -5px;}
  20% { top: 5px;}
  30% { top: 15px;}
  40% { top: 25px;}
  50% { top: 35px;}
  60% { top: 25px;}
  70% { top: 15px;}
  80% { top: 5px;}
  90% { top: -5px;}
  100% {top: -15px; left: 45px; -o-transform: rotate(-360deg);}
}

@keyframes shine {
  0%  { top: -15px; left: -48px;}
  10% { top: -5px;}
  20% { top: 5px;}
  30% { top: 15px;}
  40% { top: 25px;}
  50% { top: 35px;}
  60% { top: 25px;}
  70% { top: 15px;}
  80% { top: 5px;}
  90% { top: -5px;}
  100% {top: -15px; left: 45px; transform: rotate(-360deg);}
}

/*################################ subtitulos carrucel ####################################*/
/* __________ Etiquetas de SubTitulos ____________*/
@font-face {
  -webkit-font-family: Garamond;
  -moz-font-family: Garamond;
  -o-font-family: Garamond;
  src: url(../fonts/GARAM.ttf);
  font-display: swap;
}

.RellenoCbz { height: 7.5rem; min-height: 7.5rem;}
.TituloInicio { height: 3rem;}
/*#00708b*/
.Cntndr3D { width: 100%; height: 35px;}
.FndBlnc { background: #fff; height: 4rem; text-align: center;}
.FndBlnc6Rem { background: #fff; height: 6rem; text-align: center; padding: 1.5rem;}
.FndBlncAjs { background: #fff; min-height: 8.5rem; height: auto; text-align: center;}
.Estilos { color: #0070b8; font-family: Garamond;}
.CentText { text-align: center;}

.texto_3d {
  font-weight: bolder;
  padding-left: 24px;
  color: #273375; /*#0070b8; // #C3D6FF */
  text-shadow: 0 1px 0 #ccc,
                0 2px 0 #c9c9c9,
                0 3px 0 #bbb,
                0 4px 0 #b9b9b9,
                0 5px 0 #aaa,
                0 6px 1px rgba(0, 0, 0, .1),
                0 0 5px rgba(0, 0, 0, .1),
                0 1px 3px rgba(0, 0, 0, .3),
                0 3px 5px rgba(0, 0, 0, .2),
                0 5px 10px rgba(0, 0, 0, .25),
                0 10px 10px rgba(0, 0, 0, .2),
                0 20px 20px rgba(0, 0, 0, .15);
}

.wraping-input100 {
  width: 70%;
  border-bottom: 2px black solid;
  -webkit-box-shadow: 2px 11px 6px -9px rgba(0,0,0,0.75);
  -moz-box-shadow: 2px 11px 6px -9px rgba(0,0,0,0.75);
  box-shadow: 2px 11px 6px -9px rgba(0,0,0,0.75);
}

.Myinput100 {
  width: 100%;
  height: 40px;
  border: none;
}

.Myinput100:hover {
  border: none;
  background: rgba(10, 183, 207, 0.1);
}

.Mycontact100-form-btn {
  width: 10rem;
  height: 3rem;
  border: 1px solid #0070b8;
  background: #0070b8;
  color: #FFF;
  font-weight: bold;
  border-radius: 10px;
  -webkit-box-shadow: 2px 11px 6px -9px rgba(0,0,0,0.75);
  -moz-box-shadow: 2px 11px 6px -9px rgba(0,0,0,0.75);
  box-shadow: 2px 11px 6px -9px rgba(0,0,0,0.75);
}

.Border-top-1 { border-top: 1px solid #0070b8;}
.Border-top-2 { border-top: 2px solid #0070b8;}
.Border-bottom-1 { border-bottom: 1px solid #0070b8;}
.Border-bottom-2 { border-bottom: 2px solid #0070b8;}
.Border-bottom-3 { border-bottom: 3px solid #0070b8;}
.Border-bottom-4 { border-bottom: 4px solid #0070b8;}
.Border-bottom-5 { border-bottom: 5px solid #0070b8;}
.Border-bottom-6 { border-bottom: 6px solid #0070b8;}
.Border-TodoNe-1{border: 1px solid Black; }
.Border-TodoNe-2{border: 2px solid Black; }
.Border-TodoAz-1{border: 1px solid #0070B8; }
.Border-TodoAz-2{border: 2px solid #0070B8; }

/* ############################################################################################# */

/* ############################## formulario  ################################################## */
/* ################# Contenedores ############### */
/*Contenedor General*/
.gUt-rc-Perfil {
  width: 100%;
 /*1140px*/
  max-width: 100%;
  color: rgb(55, 58, 60);
  font-family: OpenSans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-variant-ligatures: normal;
  font-variant-caps: normal;
  font-weight: 400;
  letter-spacing: normal;
  orphans: 2;
  text-align: start;
  text-indent: 0px;
  text-transform: none;
  white-space: normal;
  word-spacing: 0px;
  -webkit-text-stroke-width: 0px;
  text-decoration-style: initial;
  text-decoration-color: initial;
  align-items: center;
  display: flex;
  justify-content: center;
}

.gUt-rc-Perfil .gUt-camvas {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  margin-top: 15px;
  padding: 30px 30px 48px;
  width: 50rem;
 /*74rem, 1180.84px; */
  height: auto;
 /*3214.94px; */
  border: 2px solid rgba(184, 107, 0, 0.5);
  background: rgb(255, 255, 255);
  transition: all 0.25s ease-in-out 0s;
}

.gUt-CajaTot {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  align-items: center;
  display: flex;
  justify-content: center;
}

.gUt-CajaTot .gUt-CajaPanel {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  border: 1px solid rgba(0, 112, 184, 0.1);
  background: rgba(223, 237, 246, 0.3);
    /* rgba(200, 200, 200, 0.1);*/
  width: 85%;
  padding: 6px;
}

/* --------------- Controles de seccion --------- */

.gUt-CajaLabelInput {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  align-items: center;
  display: flex;
  flex-flow: row wrap;
  margin-bottom: 28px;
  padding: 5px;
/*  background: rgba(0, 112, 184, 0.1);
border: 1px #000 solid;*/;
}

.gUt-CajaLabelInput .CajaLabel {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  font-size: 13px;
  line-height: 21px;
  font-family: OpenSans, Arial, sans-serif;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.87);
  text-align: left;
  width: 140px;
  margin-right: 20px;
  margin-bottom: 0px;
}

.control-form {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  width: 25rem;
 /*559.422px;*/;
}

.gUt-CajaIntro {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  padding: 8px;
}
/* es la caja contenedora de la foto y los avatars*/
.BttnCargaFoto {
  border-radius: 7px;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  line-height: 1rem;
  user-select: none;
  position: relative;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  background-image: none;
  cursor: pointer;
  filter: none;
  text-decoration: none;
  font-weight: 600;
  color: rgb(255, 255, 255);
  background: rgb(42, 115, 204);
  border: 1px solid rgb(42, 115, 204);
  padding: 0.5rem 0.1rem;
  font-size: 0.8rem;
  min-height: 3.25rem;
}

.gUt-ConteCajaFoto {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-direction: row;
  width: 38rem;
  height: 7.7rem;
  border: 1px rgba(0, 112, 184, 0.1) solid;
}

.gUtInputHidd {
  opacity: 0;
  left: -9.3rem;
}

.BttnSpamFoto {
  border-radius: 7px;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  line-height: 1rem;
  user-select: none;
  position: relative;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  background-image: none;
  cursor: pointer;
  filter: none;
  text-decoration: none;
  font-weight: 600;
  color: rgb(255, 255, 255);
  background: rgb(42, 115, 204);
  padding: 0.5rem .2rem;
  font-size: 0.8rem;
  height: 3.21rem;
  min-height: 3.21rem;
  width: 9.21rem;
  min-width: 9.21rem;
}

.FotoSpam {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  overflow: hidden;
  cursor: pointer;
  position: relative;
  width: 9rem;
}

.gUt-ConteCajaFoto .gUt-CajaFoto {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  justify-content: center;
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 120px;
  min-width: 120px;
  height: 120px;
  margin-right: 12px;
  background: rgba(10, 183, 207, 0.81);
}

.gUt-CajaAvat {
  display: inline-block;
  width: 98%;
 /* 15rem; */
  min-width: 98%;
 /* 15rem; */
  height: 100px;
  max-height: 100px;
  margin-right: 12px;
  background: rgba(0, 112, 184, 0.1);
  border: 1px #000 solid;
  padding: 5px;
}

.AvarFoto {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
}

.AvarFoto-dis {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-flow: row wrap;
  margin-bottom: 28px;
}

.img-contenedor {
/*Ancho y altura son modificables al requerimiento de cada uno*/
  display: inline-block;
  width: 3rem;
 /* 18%; */
  height: 3rem;
 /* 23%; */
  overflow: hidden;
}

.img-contenedor img {
  -webkit-transition: all .9s ease;
 /* Safari y Chrome */
  -moz-transition: all .9s ease;
 /* Firefox */
  -o-transition: all .9s ease;
 /* Opera */
  width: 70%;
}

.img-contenedor:hover img {
  -webkit-transform: scale(1.25);
  -moz-transform: scale(1.25);
  -o-transform: scale(1.25);
  transform: scale(1.25);
}

/* ----------------------------------------- */
/* -------------- Generales ----------------- */

.gUtInput {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  color: rgb(85, 85, 85);
  line-height: 21px;
  font-family: inherit;
  font-size: 14px;
  width: 25rem;
  font-style: inherit;
  font-variant: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  margin: 0px;
  overflow: visible;
  touch-action: manipulation;
  display: inline-block;
  height: 44px;
  padding: 0.5em 1.5em 0.5em 0.5em;
  border-radius: 0px;
  vertical-align: middle;
  background: rgb(255, 255, 255);
  border: 1px solid rgb(204, 204, 204);
  box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
}
/* ----------------------------------------- */
.CajaLabel {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  font-size: 14px;
  line-height: 21px;
  font-family: OpenSans, Arial, sans-serif;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.87);
  text-align: left;
  width: 100px;
  margin-right: 20px;
  margin-bottom: 0px;
}

.gUt-Negritas {
  font-weight: bold;
}

.gUt-Cbz {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  width: 90rem;
 /*70rem, *1118.84px; */
  display: flex;
  flex-direction: row;
  place-content: space-between;
}

.gUt-text2 {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  font-family: OpenSans-Light, Arial, sans-serif;
  font-weight: 500;
  line-height: 30px;
  color: inherit;
  margin: 0px 0px 0.5rem;
  font-size: 24px;
  padding: 0px;
  max-width: 100%;
}

.gUt-text4 {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  font-family: OpenSans, Arial, sans-serif;
  font-weight: 400;
  line-height: 36px;
  color: inherit;
  margin: 10px 0px;
  font-size: 32px;
  padding: 0px;
  max-width: 100%;
}

.btto_subfto {
}

.gUt-lineSpc {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  border-bottom: 1px solid rgba(184, 107, 0, 0.25);
 /*#0070b8;*/
  margin: 15px 0px;
}

.gUt-lineSprdr {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  border-bottom: 1px solid rgba(0, 112, 184, 0.0);
 /*#0070b8;*/
  margin: 36px 0px;
}

.gUt-linePrn {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  border-bottom: 5px solid rgba(184, 107, 0, 0.1);
 /*#0070b8;*/
  margin: 20px 0px;
  width: 100%;
}

.gUt-line {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  border-bottom: 1px solid rgba(0, 112, 184, 0.1);
  margin: 20px 0px;
}

.gUtExpProf {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
}

.gUt-CajaDesc {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  margin-bottom: 40px;
}

.gUt-CajaTrab {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  margin-bottom: 40px;
  padding: 8px;
}

.CajaTextLrg {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  color: rgb(85, 85, 85);
  font-family: inherit;
  font-size: 14px;
  display: inline-block;
  height: 80px;
  width: 50%;
  padding: 0.5em 1.5em 0.5em 0.5em;
  margin: 0px;
  line-height: inherit;
  border-radius: 0px;
  vertical-align: middle;
  width: 559.422px;
  background: rgb(255, 255, 255);
  border: 1px solid rgb(204, 204, 204);
  box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
  font-style: inherit;
  font-variant: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  overflow: auto;
  touch-action: manipulation;
  resize: vertical;
  appearance: none;
}

.gUt-textDesc {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  margin: 8px 0px 1rem;
  font-size: 15px;
  line-height: 21px;
  font-family: OpenSans,  Arial,  sans-serif;
  max-width: 100%;
  text-align: justify;
  font-style: italic;
}

.gUt-NotaTextDesc {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  margin: 0px auto;
  font-size: 12px;
  line-height: 18px;
  font-family: OpenSans, Arial, sans-serif;
  max-width: 100%;
  color: rgb(82, 82, 82);
  text-align: justify;
}

.gUt-HiperText {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  background: transparent;
  color: rgb(0, 98, 228);
  text-decoration: none;
  touch-action: manipulation;
}

.gUt-ConteCajaFoto .gUt-CajaTexBtt {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  width: auto;
  position: relative;
}

.gUt-ConteCajaFoto .gUt-CajaTxtFoto {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  margin: 12px 0px 1rem;
  font-size: 12px;
  line-height: 18px;
  font-family: OpenSans, Arial, sans-serif;
  max-width: 100%;
  color: rgb(82, 82, 82);
}

.gUt-ConteCajaFoto .gUt-ImgSlcInput {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  height: auto;
  width: auto;
  display: flex;
  flex-direction: row;
}

.gUt-ConteCajaFoto .gUt-ConFtoUpBttn {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
}

.BttnGuarda {
      color: rgb(255, 255, 255);
      overflow: visible;
      cursor: pointer;
      font-size: 1rem;
      font-weight: 600;
      line-height: 1rem;
      text-transform: none;
      border-radius: 6px;
      transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
      text-align: center;
      display: inline-block;
      vertical-align: middle;
      background: rgb(42, 115, 204);
      border: 1px solid rgb(42, 115, 204);
      padding: 0.9rem 2rem;
      min-height: 15px;
      box-sizing: inherit;
      -webkit-font-smoothing: antialiased;
      -webkit-box-align: center;
      -webkit-box-pack: center;
      justify-content: center;
      align-items: center;
      display: flex;
}

.BttnCentro {
  text-align: center;
}

.form-controlText {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  width: 35rem;
 /*559.422px;*/
  height: 5rem;
}

.gUtAreaInput {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  color: rgb(85, 85, 85);
  font-family: inherit;
  font-size: 14px;
  display: inline-block;
  height: 44px;
  padding: 0.5em 2.2em 0.5em 0.5em;
  margin: 0px;
  line-height: inherit;
  border-radius: 0px;
  vertical-align: middle;
  width: 25rem;
  border: 1px solid rgb(204, 204, 204);
  background: rgb(255, 255, 255);
  font-style: inherit;
  font-variant: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  text-transform: none;
  touch-action: manipulation;
  appearance: none;
  background-position: calc(100% - 10px) 50%;
  background-repeat: no-repeat;
  background-image: url('https://www.videoteca.utegra.com/bootstrap/img/tools/downchevron.svg');
}

.gUtOpciones {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
}

.gUtInputEntra {
  box-sizing: content-box;
  -webkit-font-smoothing: antialiased;
  color: inherit;
  line-height: 14px;
  font-family: inherit;
  font-size: inherit;
  width: 5px;
  font-style: inherit;
  font-variant: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  margin: 0px;
  overflow: visible;
  touch-action: manipulation;
  background: none transparent;
  border: 0px;
  box-shadow: none;
  cursor: default;
  display: inline-block;
  outline: none;
  padding: 8px 0px 12px;
  appearance: none;
  border-radius: 0px;
}

.gUtRdBttnLineal, .gUtRdBttn {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  font-weight: 400;
  display: inline-block;
  margin-bottom: 0px;
  touch-action: manipulation;
  min-height: 21px;
  padding-left: 20px;
  padding-top: 0px;
  vertical-align: initial;
  margin-right: 8px;
  font-size: 14px;
  margin-left: 10px;
}

.EstilosLetras {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  font-size: 12px;
  line-height: 18px;
  font-family: OpenSans, Arial, sans-serif;
  color: rgb(82, 82, 82);
  margin-top: 0px;
  padding: 0px 8px;
}

.BttSelector {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  color: rgb(85, 85, 85);
  font-family: inherit;
  font-size: 14px;
  display: inline-block;
  height: 44px;
  padding: 0.5em 2.2em 0.5em 0.5em;
  margin: 0px;
  line-height: inherit;
  border-radius: 0px;
  vertical-align: middle;
  width: 80px;
  border: 1px solid rgb(204, 204, 204);
  background: rgb(255, 255, 255);
  font-style: inherit;
  font-variant: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  text-transform: none;
  touch-action: manipulation;
  appearance: none;
  background-position: calc(100% - 10px) 50%;
  background-repeat: no-repeat;
  background-image: url('https://www.videoteca.utegra.com/public/img/tools/downchevron.svg');
}

.Separador {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin: 36px 0px;
}

.Horizontal {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-flow: row wrap;
  text-align: center;
  padding: 5px;
}

.Espacio_Blc {
  box-sizing: inherit;
  -webkit-font-smoothing: antialiased;
  border-bottom: 1px solid rgba(0, 0, 0, 0);
  margin: 26px 0px;
  height: 10px;
}


/* ================== ejecutores de panatalla ======================== */
@media screen and (max-width:800px ) {
  .gUt-rc-Perfil {
    width: 100%;
 /* 24.60rem, 458.844px; */   /*width: 35.625rem; 1140px*/;
  }

  .gUt-rc-Perfil .gUt-camvas {
    margin-left: 0.8rem;
 /*-13.6719px;*/
    width: 14.5rem;
 /*456.203px;*/
    padding: 15px 15px 24px;
    width: 30rem;
 /*74rem, 1180.84px; */;
  }

  .gUt-camvas {
    margin-left: 0.8rem;
 /*-13.6719px;*/
    width: 14.5rem;
 /*456.203px;*/
    height: auto;
 /*4367.94px;*/;
  }

  .gUt-Cbz {
    width: 20.7rem;
 /*394.203px;*/;
  }

  .gUtInput, .gUtAreaInput, .form-controlText, .CajaTextLrg {
    width: 19rem;
  }

  .gUtInputHidd {
    position: absolute;
    left: 0rem;
  }
}

/* ############################################################################################# */

/*--------------------- Categorias ------------------------*/
    .SombraFichasNl{
        -moz-box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,0,0,0);
        -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,0,0,0);
        box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,0,0,0);

    }
    .SombraFichas{
        -moz-box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,0,0,0);
        -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,0,0,0);
        box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,0,0,0);

    }
    .SombraFichas:hover{
        -moz-box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,112,184,0);
        -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,112,184,0);
        box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,112,184,0);

    }
    .ContCatego{
        width: 100%;
        display: inline-block;
        align-items: center;
        text-align: center;
    }
    .ContCategodiv{
        display: inline-block;
        height: 16rem;
        width: 13rem;
        text-align: center;
        font-size: 18px;
        margin: 10px;
        padding:10px;
/*        background: rgba(223, 237, 246, 0.15);
        border: 2px solid rgba(184, 107, 0, 0.25);
*/

    }
    .ContCategodiv h5{
      margin-top: 1rem;
    }
    .ContCatego img{
        width: 100%;
        height: 80%;
/*        -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,0,0,0);
        box-shadow: 0px 10px 13px -7px #000000, 5px 3px 15px 1px rgba(0,0,0,0);
*/
    }
/*---------------------- tool tip ------------------------*/
    .tooltipss {
        display:inline-block;
        position:relative;
        border-bottom:1px dotted #666;
        text-align:left;
    }

    .tooltipss .top {
        min-width:300px;
        top:-1px;
        left:50%;
        transform:translate(-50%, -100%);
        padding:10px 20px;
        color: black; /* #444444;*/
        font-weight:normal;
        font-size:13px;
        border-radius:8px;
        position:absolute;
        z-index:200;
        box-sizing:border-box;
        box-shadow:2px 2px 4px rgba(0,0,0,0.3);
        display:none;
        background: rgba(223, 237, 246, 1); /*rgba(249, 253, 255, 1); /* fondo azul suabe Color de fondo */
        /*border: 2px solid rgba(184, 107, 0, 0.25); /* Cafe suabe Color de borde */
    }
    .tooltipss .topCat {
        min-width:400px;
        top:-20px;
        left:50%;
        transform:translate(-50%, -100%);
        padding:10px 20px;
        color:#444444;
        background:#EEEEEE;
        font-weight:normal;
        font-size:12px;
        border-radius:8px;
        position:absolute;
        z-index:995;
        box-sizing:border-box;
        /*box-shadow:0 1px 8px rgba(0,0,0,0.5);*/
        display:none;
        /*background: rgba(223, 237, 246, 1); /* fondo azul suabe Color de fondo */
        border: 2px solid rgba(184, 107, 0, 0.25); /* Cafe suabe Color de borde */
    }

    .tooltipss:hover .top {
        display:block;
    }
    .tooltipss:hover .topCat {
        display:block;
    }

    .tooltipss .top i {
        position:absolute;
        top:100%;
        left:50%;
        margin-left:-12px;
        width:24px;
        height:12px;
        overflow:hidden;
    }

    .tooltipss .top i::after {
        content:'';
        position:absolute;
        width:12px;
        height:12px;
        left:50%;
        transform:translate(-50%,-50%) rotate(45deg);
        background:#EEEEEE;
        box-shadow:0 1px 8px rgba(0,0,0,0.5);
    }
/*---------------------- Expositor Datos tip ------------------------*/
    .DatosExpositor {
        display:inline-block;
        position:relative;
        border-bottom:1px dotted #666;
        text-align:left;
    }

    .ContExposiDiv{
        display: inline-block;
        height: 14rem;
        width: 14rem;
        text-align: center;
        margin: 10px;
        /*background: rgba(223, 237, 246, 0.1);*/
        /*border: 2px solid rgba(184, 107, 0, 0.25);*/
    }

    .ContExposiDiv .ImgExpositor, .ContCategodiv .ImgExpositor,
    .My_tab_contentExp .ImgExpositor{
      width: 160px;
      height: 160px;
      border-radius: 50%;
      border: 2px solid rgba(184, 107, 0, 0.25);
      cursor: pointer;
    }
    .ContExposiDiv .NomExpositor{
        height: 3rem;
        width: 14rem;
        margin-top: 0.8rem;
    }

    .ContExposiDivVista{
        display: inline-block;
        height: 6rem;
        width: 8rem;
        text-align: center;
        margin: 5px;
        background: rgba(223, 237, 246, 0.1);
        /*border: 2px solid rgba(184, 107, 0, 0.25);*/
    }
    .ContExposiDivVista .ImgExpositor{
      width: 60px;
      height: 60px;
      border-radius: 50%;
      border: 2px solid rgba(184, 107, 0, 0.25);
    }

    .ContExposiDivVista .NomExpositor{
        height: 1.7rem;
        width: 7.5rem;
        margin-top: 0.8rem;
        font-size: 12px;
        font-weight: bolder;
    }

    .DatosExpositor .top {
        min-width: 350px;
        top:-1px;
        left:50%;
        transform:translate(-50%, -100%);
        padding:5px 15px;
        color: black; /*#444444;*/
        font-weight:normal;
        font-size:13px;
        border-radius:8px;
        position:absolute;
        z-index:200;
        box-sizing:border-box;
        box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
        display:none;
        background: rgba(223, 237, 246, 1); /*rgba(223, 237, 246, 100); /* fondo azul suabe Color de borde */
        /*border: 1px solid rgba(184, 107, 0, 0.25); /* Cafe suabe Color de borde */
    }

    .DatosExpositor:hover .top {
        display:block;
    }

    .DatosExpositor .top i {
        position:absolute;
        top:100%;
        left:50%;
        margin-left:-12px;
        width:24px;
        height:12px;
        overflow:hidden;
    }

    .DatosExpositor .top i::after {
        content:'';
        position:absolute;
        width:12px;
        height:12px;
        left:50%;
        transform:translate(-50%,-50%) rotate(45deg);
        background:#EEEEEE;
        box-shadow:0 1px 8px rgba(0,0,0,0.5);
    }


/* ############################################################################################# */

@media screen and (max-width:1365px ) {
  /*.ContModal .modales {width: 97.8%;}*/
  /*.Marco {height: 40rem; width: 100%;padding-top: 18.6rem;}*/
}

@media screen and (max-width:1265px ) {
  .ContenedorFondo1 {width: 96%;}
  /*.ContModal .modales {width: 97.7%;}*/
  /*.Marco {padding-top: 18.9rem;}*/
}

@media screen and (max-width:1165px) {
  .ContenedorFondo1 {width: 95.3%;}
  /*.ContModal .modales {width: 97.3%;}*/
  /*.Marco {padding-top: 19.9rem;}*/
  /*.BotonActiva {top: 30px; width: 80%;}*/
}

@media screen and (max-width:1065px) {
  .ContenedorFondo1{width: 95.4%; height: 71%;}
  /*.ContModal .modales {width: 96.8%;}*/
  /*.Marco {padding-top: 20.6rem;}*/
}

@media screen and (max-width:965px ) {
  .ContenedorFondo1 {width: 94.5%;}
  /*.ContModal .modales {width: 96.1%;}*/
  /*.Marco {padding-top: 21.5rem;}*/
}

@media screen and (max-width:865px ) {
  .ContenedorFondo1 {width: 94.2%;}
  /*.ContModal .modales {width: 95.3%;}*/
  /*.Marco {padding-top: 22.5rem;}*/
}
@media screen and (max-width:800px ) {
  .gUt-CajaAvat { height: 13rem; max-height: 13rem; width: 18rem; min-width: 18rem;}
}
@media screen and (max-width:795px ) {
    /*.gUtContenedor div{width: 32%;}*/
}

@media screen and (max-width:770px ) {
  .gUtCabecera {height: 9.36rem;}
  .gUt-rc-Perfil {display: inline-flex; padding-top: 1.4rem;}
  .gUt-rc-Perfil .gUt-camvas {display: block;}
  /*.gUtContenedor {display: block; height: auto;}*/
  .DivDerecha {float: none;}
  .contenedorUser {display: block;}
  .contenedorUser .ContUsuario, .contenedorUser .MenuUsuario {width: 100%; height: 100%;}
  .ContenedorFondo1 {width: 92%;}
  /*.ContModal .modales {width: 92%; height: 25.3rem; padding-top: 55px;}*/
  /*.Marco {padding-top: 24rem;}*/
  /*.BotonActiva {top: 40px; width: 70%;}*/
  .iconos-nosotros {display: block;}
  .PadIzq10px .TamTxt17px{font-size: 1.8vw;}
}

@media screen and (max-width:644px ) {
  .gUt-CajaAvat { height: 140px; max-height: 140px; width: 20rem; min-width: 20rem;}
  .gUt-rc-Perfil .gUt-camvas { margin-left: 0.8rem; width: 8.5rem; padding: 8px 8px 12px; width: 30rem;}
  .ContenedorFondo1 { width: 92%;}
  /*.ContModal .modales { width: 92%; height: 25.3rem; padding-top: 55px;}*/
  /*.Marco {padding-top: 24.2rem;}*/
}

@media screen and (max-width:544px ) {
  .ContenedorFondo1 { width: 90.6%;}

  /*.ContModal .modales {width: 90.6%; height: 25.3rem; padding-top: 55px;}*/
  /*.Marco {padding-top: 24.7rem;}*/
  /*.BotonActiva {top: 50px; width: 50%;}*/
  .gUt-CajaAvat { height: 14rem; max-height: 14rem; width: 18rem; min-width: 18rem;}
}

@media screen and (max-width:480px ) {
  .ContenedorFondo1 {width: 89%;}
  /*.ContModal .modales {width: 89%; height: 25.3rem; padding-top: 55px;}*/
  /*.Marco {padding-top: 25rem;}*/
}
@media screen and (max-width:440px ) {
  .contenedorUser .ContUsuario {width: 100%; height: 5rem;}
}

@media screen and (max-width:375px ) {
  body{ width: 115%;}
}

@media screen and (max-width:334px ) {
  .contenedorUser {display: block;}
  .contenedorUser .ContUsuario, .contenedorUser .MenuUsuario {width: 100%;}
  .contenedorUser .ContUsuario {width: 100%; height: 8rem;}
}

@media screen and (max-width:320px ) {
  body{ width: 125%;}
}

@media screen and (max-width:300px ) {
  body{ width: 135%;}
}
@media screen and (max-width:270px ) {
  body{ width: 145%;}
}
@media screen and (max-width:250px ) {
  body{ width: 155%;}
}
/*---------- tamaño del video ---------------*/
.gUtContenedor .headervideowork{ width: 100%; max-width: 100%;}
.headervideowork .TamVideo { height: 80px;}

.MiFooter{
  height: 100px;
  border-bottom: 10px black solid;
  background: black;
  color: white;
}
/*********************/
/*     Copyright     */
/*********************/
.copyright {
	padding-top: 1.75rem;
	padding-bottom: 0;
	border-top: 1px solid #d2d3cc;
	text-align: center;
	height: 100px;
}

.copyright p,
.copyright a {
	color: #a7a89f;
	text-decoration: none;
}


/******************************/
/*     Back To Top Button     */
/******************************/
a.back-to-top {
	position: fixed;
	z-index: 1011;
	right: 12px;
	bottom: 12px;
	display: none;
	width: 42px;
	height: 42px;
	border-radius: 30px;
	background: #0070b8 url("public/img/images/uparrow.png") no-repeat center 47%;
	background-size: 18px 18px;
	text-indent: -9999px;
}

a:hover.back-to-top {
	background: #393a34;
}
.ir-arriba {
	display:none;
	padding:20px;
	background:#024959;
	font-size:20px;
	color:#fff;
	cursor:pointer;
	position: fixed;
	bottom:20px;
	right:20px;
  border-radius: 50%;
  z-index: 100;
}
/**==========================================================================================**/
/* VENTANA MODAL */
/* es el modal de toda la pantalla*/
.Mymodal{
	display: none;
	position: fixed;
	z-index:1001;
	overflow: hidden;
	left: 0;
	top:0;
	width: 100%;
	height:100%;
	background: rgba(0, 0, 0, 0.2);
}

.contenido-modal_Auto{
	position: relative;
	background: #fff;
	margin: auto;
	width: 75%;
	box-shadow: 0 0 6px 0 rgba(0, 0, 0, .4);
	animation-name: modal;
	animation-duration: 1s;
	margin-top: 20px;
  height: auto;
}
.cntdrMdlBanners{
  max-height: 80vh;
  overflow-y: auto;
}

.imgMenu { }
.imgMenu:hover { filter: drop-shadow(2px 4px 2px #0070b8); }

.contenido-modal{
	position: relative;
	background: #fff;
	margin: auto;
	width: 75%;
	box-shadow: 0 0 6px 0 rgba(0, 0, 0, .4);
	animation-name: modal;
	animation-duration: 1s;
	margin-top: 20px;
  height: 65rem;
}

.contenido-modal .flex{
	display: flex;
	top: 0;
}
.flex{
	display: flex;
}
.Izd{
  align-items: flex-end;
  justify-content: flex-end;
}
.modal-header{
  border: 0px;
  height: 30px;
  min-height: 30px;
}
.contenido-modal .ImgfondoTotal{
	position: absolute;
	display: flex;
  background: #fff;
  height: 100%;
}
.ImgfondoTotal .SoloImg{
  opacity:0.2;
}
.contenido-modal .fondoAzul{
	position: absolute;
	display: flex;
	margin-top: 0;
	height: 100%;
	width: 100%;
	justify-content: flex-start;
	background: rgba(0, 112, 186, 0.3);
}
.contenido-modal .Contenedor-fondoAzul{
	position: absolute;
	display: flex;
	top: 0;
  height: 100%;
	min-height: 100%;
	width: 50%;
	justify-content: flex-start;
}
.Contenedor-fondoAzul .PonArriba{
  position: relative;
}

.contenido-modal .contenidoBase{
      position: absolute;
      right: 0;
      width: 100%;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 2px;
}
.contenido-modal .contenido{
      position: absolute;
      right: 0;
      width: 95%;
      height: 100%;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 2px;
}

.fondoAzul .ContFicha{
	position: relative;
	display: flex;
	top: 300px;
	height: 68%;
	min-height: 68%;
	width: auto;
	justify-content: flex-start;
	background: transparent;
  padding-right: 8px;
  /*border: 1px red solid;*/
}
.PonArriba{
  position: relative;
}

.TextBlanca, .TextBlanca p {
  color: #fff;
  font-weight: 400;
}
.TextNegra , .TextNegra p {
  color: #000;
  font-weight: 400;
}
.TextDorado, .TextDorado p {
  color: rgba(184, 107, 0, 1);
  font-weight: 400;
}

.contenido .ImgExpoFicha{
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid rgba(184, 107, 0, 0.25);
}

.contenido .TamTxt17px{
  font-size: 1.2vw;
  height: 60px;
}

@keyframes modal{
	from{top:-330px; opacity:0;}
	to{top:0; opacity:1;}
}

.close, .miclose{
	color: #c2c2c2;
	font-size:30px;
	font-weight: bold;
}
.close:hover, .miclose:hover{
	color:#7f8e8e;
	text-decoration: none;
	cursor: pointer;
}

.modal-header, .footer{
	padding: 8px 16px;
	/*background: rgba(0, 112, 186, 0.6);*/
	color:#f2f2f2;
}

p{
	text-align: justify;
}

.modal-body{
	padding: 20px 16px;
}
.modal-body-temas{
	height: 600px;
  /*border: 1px red solid;*/
}
.modal-body-prof{
	height: 150px;
  /*border: 1px red solid;*/
}
@media screen and (max-width:1100px){
  .contenido-modal{
    height: 57rem;
  }
}
@media screen and (max-width:1000px){
  .contenido-modal{
    height: 52rem;
  }
}

@media screen and (max-width:900px){
	.textos{
		padding: 150px;
	}
}
@media screen and (max-width:850px){
  .contenido .ImgExpoFicha{
    width: 40px;
    height: 40px;
  }
}
@media screen and (max-width:800px){
  .icono {width: 90%;}
}
@media screen and (max-width:750px){
  .contenido .ImgExpoFicha{ width: 30px; height: 30px; }
  .col-lg-14 .RellenoCbz80 { height: auto; padding: 0 10px}
  .RellenoCbz90Med,
  .RellenoCbz80Med,
  .RellenoCbz60Med,
  .RellenoCbz50Med,
  .RellenoCbz20Med { width: 100%;}
  .TituloEstiloBlc { font-size: 25px; }
  .TextTam25px { font-size: 12px; }
  .BlcTrspMsg { margin: 0; height: 800px; }
  .p-5 { padding: 2rem !important; }
  .tbMenu p { font-size: 1.2rem !important; }
  .tbActiveMdl::before{ font-size: 10px !important; }
  .tbActiveMdl::after{ font-size: 10px !important; }
  .OcultaTxt {display: none !important;}

}
@media screen and (max-width:700px){
  .BotonCarritoMay {
    left: 33%;
  }
  .contenido-modal{
    height: 48rem;
  }
}
@media screen and (max-width:600px){
}

@media screen and (max-width:650px){
}
@media screen and (max-width:500px){
	.textos{
		padding:50px;
	}
}

@media screen and (max-width: 480px) {
  .contenido{
    grid-template-columns: 1fr;
    color: red;
  }
}
/* ==================================================================== */
/*========================== Hexagonos ==================================*/
.hexagon {
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  border: 2px solid rgba(184, 107, 0, 0.25);
}
.pentagon {
  clip-path: polygon(50% 0, 100% 45%, 80% 100%, 20% 100%, 0 45%);
}
.octagon {
  clip-path: polygon(33.33% 0%, 66.66% 0%, 100% 33.33%, 100% 66.66%, 66.66% 100%, 33.33% 100%, 0 66.66%, 0 33.33%);
}

/* ==================================================================== */
/*========================== login ==================================*/
.opacidad{  transition: all 1s ease-out;}
.Titulo10Top{ height: 60px;}
.contenedor__LoginRegistro{ display: flex;}
.contenedor__LoginRegistro .contenedorDerecha{ width: 70%;}
.contenedor__LoginRegistro .contenedorIzquierda{ width: 28%;}
.contenedorIzquierda .ImgBanner{ width: 100%; height: 262.8px;}
.contenedorIzquierda .ImgBanner1{ width: 100%; height: 262.8px;}

.contenedor__LoginRegistro .contenedor__todo{
    width: 100%;
    max-width: 850px;
    margin: 10px;
    position: relative;
}

.caja__trasera{
    width: 100%;
    padding: 1px 1px 10px 1px;
    display: flex;
    justify-content: center;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    /*background: rgba(0, 128, 255, 0.2);*/
    background: #fff;
    border-radius: 7px;
    text-align: center;
    border: 1px #0070b8 solid;
}
.caja__trasera .caja__trasera-login{ width: 50%;}
.caja__trasera div{ margin: 100px 40px; color: #000; font-weight:bolder; transition: all 500ms;}
.caja__trasera div p, .caja__trasera button{ margin-top: 20px;}
.caja__trasera div h3{ font-weight: 400; font-size: 26px;}
.caja__trasera div p{ font-size: 16px; font-weight: 300;}

.caja__trasera button{
    padding: 0 40px;
    border: 2px solid rgba(184, 107, 0, 0.5);
    border-radius: 5px;
    font-size: 14px;
    background: transparent;
    font-weight: 600;
    cursor: pointer;
    color: #0070b8; /*white;*/
    outline: none;
    transition: all 400ms;
}

.caja__trasera button:hover{
    background: #0070b8;
    color: #fff; /*#46A2FD;*/
    border: 2px solid #0070b8;
}

/*Formularios*/
.contenedor__login-register_Venta{
  align-items: center;
  width: 100%;
  max-width: 380px;
  text-align: center;
  margin: 0 auto;
  border-radius: 15px;
  filter: drop-shadow(0.35rem 0.35rem 0.4rem rgba(0, 0, 0, 0.5));
  /*La transicion va despues del codigo JS*/
  transition: left 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
}

.contenedor__login-register{
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 380px;
    position: relative;
    top: -193px;
    left: 10px;
    text-align: center;
    filter: drop-shadow(0.35rem 0.35rem 0.4rem rgba(0, 0, 0, 0.5));
    /*La transicion va despues del codigo JS*/
    transition: left 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
}

.contenedor__login-register form, .contenedor__login-register_Venta form{
    width: 100%;
    padding: 20px 20px; /* checar el tamaño de la parte login*/
    background: white;
    position: absolute;
    border-radius: 15px;
    border: 2px solid rgba(184, 107, 0, 0.5);
}

.contenedor__login-register form h2, .contenedor__login-register_Venta form h2{
    font-size: 30px;
    text-align: center;
    color:  #0070b8; /*#46A2FD;*/
    border-bottom: 2px solid rgba(184, 107, 0, 0.3);
}

.contenedor__login-register form textarea, .contenedor__login-register_Venta form textarea{
  width: 100%;
  margin-top: 20px;
  padding: 10px 5px;
  border: none;
  border-radius: 7px;
  background: #F2F2F2;
  font-size: 16px;
  outline: none;
  max-width: auto;
  min-width: auto;
}
.contenedor__login-register form input, .contenedor__login-register_Venta form input{
    width: 100%;
    margin-top: 20px;
    padding: 10px 5px;
    border: none;
    border-radius: 7px;
    background: #F2F2F2;
    font-size: 16px;
    outline: none;
}
.contenedor__login-register form input:focus, .contenedor__login-register_Venta form input:focus,
.contenedor__login-register form textarea:focus, .contenedor__login-register_Venta form textarea:focus{
    border: 1px  #0070b8 solid; /*none;*/
}

.contenedor__login-register form button,
.contenedor__login-register_Venta  form button{
    padding: 0 40px;
    margin-top: 10px;
    border: 1px #0070b8 solid;
    border-radius: 7px;
    font-size: 14px;
    background:  #fff; /*#46A2FD;*/
    font-weight: 600;
    cursor: pointer;
    color: #0070b8; /*white;*/
    outline: none;
    transition: all 400ms;
}
.contenedor__login-register form button:hover,
.contenedor__login-register_Venta  form button:hover{
    background:  #0070b8;
    color:white;
}

.formulario__login{ opacity: 1; display: block;}
.formulario__register{ display: none;}
.formulario__register .MnsgRgst, .formulario__login .MnsgLgn{ height: 24px; padding: 0; margin: 0;}
.formulario__register .inpChck{width: 15px; height: 12px;}
.formulario__register .Liga, .formulario__login .Liga{ font-size: 12px; height: 24px; padding: 0; margin: 0;}
.cambia{
  -webkit-animation-name: cambia;
  -webkit-animation-duration: 5s;
  animation-name: cambia;
  animation-duration: 5s;
}
@keyframes cambia {
  from{ opacity: .4;}
  to{ opacity: 1;}
}
@-webkit-keyframes cambia {
  from{ opacity: .4;}
  to{ opacity: 1;}
}
@media screen and (max-width: 1150px){
    .contenedor__LoginRegistro .contenedorDerecha{ width: 100%;}
    .contenedor__LoginRegistro .contenedorIzquierda{ margin: auto; width: 50%;}
    .Titulo10Top{ margin-top: 20px;}
    .contenedor__LoginRegistro{ flex-direction: column;}
}
@media screen and (max-width: 850px){
    .caja__trasera{ max-width: 350px; height: 300px; flex-direction: column; margin: auto;}
    .caja__trasera div{ margin: 0px; position: absolute;}
    /*Formularios*/
    .contenedor__login-register{ top: -10px; left: -5px; margin: auto;}
    .contenedor__login-register form{ position: relative;}
}
/* *************************************************** */
.carrusel{
height:370px;
overflow:hidden;
width: 100%;
}

.bloque-imagenes{
margin:0 0 0 12px;
padding:0;
}

.bloque-imagenes li{
list-style:none;
margin:0;
padding:0;
margin-bottom:12px;
}

.bloque-imagenes li img{
height:273px;
width:98%;
}

.bloque-imagenes a:hover img{
border:1px #fff solid;
}

/* ================================ Slider ===========================*/
/*¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨ Mio ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨*/
.SliderMenu{
  text-align: center;
  margin: 10px;
}

.SliderMenu li{
  display: inline-block;
  text-align: center;
}

.SliderMenu li a{
  display: inline-block;
  color: black;
  text-decoration: none;
  /*
  background: #EEF1F5;
  padding: 3px 5px 6px 4px;
  */
  width: 15px;
  height: 15px;
  font-size: 10px;
  font-weight: bolder;
  border-radius: 100%;
}
.SliderMenu li a:hover{
  background: #0070b8;
  color: white;
}
.SliderMenu li i{
  display: inline-block;
  color: black;
  text-decoration: none;
  /*
  background: #EEF1F5;
  padding: 3px 5px 6px 4px;
  */
  width: 15px;
  height: 15px;
  font-size: 10px;
  font-weight: bolder;
  border-radius: 100%;
}
.SliderMenu li i:hover{
  background: #0070b8;
  color: white;
}
.SliderMenu .ActiveSlider{
  background: #0070b8;
  color: white;
  filter: drop-shadow(1px 3px 1px rgba(0,0,0,0.6));
}
.contenedorIzquierda .Recorta{
  overflow: hidden;
}
.Myfade{
  animation-name: Myfade;
  animation-duration: 2s;
}

@keyframes Myfade{
  from {opacity: .3;
           -moz-transform: translateX(-100%);
           -webkit-transform: translateX(-100%);
           transform: translateX(-100%);

  }
  to { opacity: 1;
  }
}

/*¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨*/
.center_y{
  position: relative;
  top:50%;
  transform: translateX(-50%);
}

.center_x{
  position: relative;
  transform: translateX(-50%);
}

#slider-container{
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.Myslide{
  height: 100%;
  width: 100%;
}

.slider img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slider-arrow{
  color: #fff;
  filter: drop-shadow(1px 3px 1px rgba(0,112,184,0.45));
  font-size: 50px;
  cursor: pointer;
  position: absolute;
}


#arrow-prev{
  left: 20px;
}

#arrow-next{
  right: 20px;
}

#dots-wrapper{
  display: flex;
  position: absolute;
  bottom: 30px;
}

.dot-nav{
  width: 15px;
  height: 15px;
  border-radius: 100%;
  cursor: pointer;
  margin: 0 8px;
  border: 2px solid #d6d6d6;
  filter: drop-shadow(1px 3px 1px rgba(0,112,184,0.45));
}

.dot-nav:hover{
  background: #d6d6d6;
}

.active-dot{
  background: #d6d6d6;
}
/* ============================== bordes para Entrada y Nuevos ====================*/
.BordoRojo {
    color: rgba(255, 0, 0, 0.6);
    margin-left: 2px;
    box-shadow: 0 0 5px rgba(255, 0, 0, 0.6);
}
.BordoVerde {
    color: rgba(0, 183, 22, 0.6);
    margin-left: 2px;
    box-shadow: 0 0 5px rgba(0, 183, 22, 0.6);
}
.BordoWarning {
    color: rgba(255, 195, 0, 0.6);
    margin-left: 2px;
    box-shadow: 0 0 5px rgba(255, 195, 0, 0.6);
}
.FondoVerdeTextBlanco {
    background: rgba(0, 183, 22, 0.4);
    color: #fff;
}
.FondoRojoTextBlanco {
    background: rgba(231, 76, 60, 0.4);
    color: #fff;
}
.FondoWarningTextBlanco {
    background: rgba(255, 195, 0, 0.4);
    color: #fff;
}
.FondoVerdeTextNegro {
    background: rgba(0, 183, 22, 0.2);
    color: #000;
}
.FondoRojoTextNegro {
    background: rgba(231, 76, 60, 0.2);
    color: #000;
}
.FondoWarningTextNegro {
    background: rgba(255, 195, 0, 0.4);
    color: #000;
}
/*===================================================================*/
/* ======================== preload ==============================*/
/*Loading page*/
.jm-loadingpage {
 position: fixed;
 left: 0px;
 top: 0px;
 width: 100%;
 height: 100%;
 background: #fff;
 z-index: 999999999;
 /*background: url(images/loadingpage.gif) center no-repeat #fff;*/
}
.multi-spinner-container {
  width: 150px;
  height: 150px;
  position: relative;
  position: absolute;
    top: 50%;
    left: 50%;
  margin: 30px auto;
  /*overflow: hidden;*/
}

.multi-spinner {
  position: absolute;
  width: calc(100% - 9.9px);
  height: calc(100% - 9.9px);
  border: 5px solid transparent;
  border-top-color: #0070b8;
  border-radius: 50%;
  -webkit-animation: spin 5s cubic-bezier(0.17, 0.49, 0.96, 0.76) infinite;
  animation: spin 5s cubic-bezier(0.17, 0.49, 0.96, 0.76) infinite;
}


@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
         transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}


@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/*======================== Botones Laterales Categorias ============================*/
.My_BtnLtrlCtgrs{
    height: 38px;
    width: 168px;
    border-top: 5px transparent solid;
}
.My_ContenedorLtrCat{
    background: #273375; /*#0070b8;*/
    height: 36px; /*3.2rem;*/
    width: 161px; /*10.5rem;*/
    border-radius: 0 33px 31px 0;
    padding: 0;
    position: relative;
    left: -7.5rem;
    z-index: 100;
    box-shadow: 0px 10px 13px -10px #000000, 5px 3px 15px 1px rgba(220,220,220,0.5);
}
.My_ContenedorLtrCat:hover{
    left: 0px;
    transition:all 1s;
}
.My_ContenedorLtrCat .My_TextBar{
    height: 28px;
    width: 120px;
    margin: 0;
    color: white;
    font-weight: bolder;
    position: absolute;
}
.My_TextBar .My_PLinea{
    font-size: 12px;
    padding-left: 7px;
    position: absolute;
    top: 35%;
    right: 0px;

}
.My_ContenedorLtrCat .My_ImgBar{
    border-radius: 50%;
    margin: 0;
    height: 2rem;
    width: 2rem;
    position: absolute;
    left: 127px; /*7.7rem;*/
}
.My_ImgBar .My_imgTam, .My_imgTamTips{
    margin-top: 2px;
    height: 2rem;
    width: 2rem;
    border-radius: 50%;
}

.My_tab_container {
    /*border: 1px solid #999;*/
    border-top: none;
    overflow: hidden;
    clear: both;
    width: 100%;
    /*background: #fff;*/
}
.My_tab_content {
    padding: 20px;
    font-size: 1.2em;
}
.My_tab_Ocl{ display: none; }
.My_tab_Ver{ display: block; }
.My_Desactiva{color: #dddddd;}

/*---------------------- Acgtivacio --------------------------------*/
.EntraCode{
    height: 30px;
    width: 30px;
    font-size: 18px;
    text-align: center;
}
.BordeNegro{
    border: 1px #0070b8 solid;
    border-radius: 7px;
}
.CentraCodigo{
    text-align: center;
    /*background: #fafafa;*/
}
.BotonSum{
    background: #0070b8;
    border: 1px #0070b8 solid;
    border-radius: 5px;
    color: white;
    width: auto;
    height: 30px;
}
/*------------------- Expositores ------------------------*/
.Mitabla{border: 0px;}
.linea-oculta{display: none;}
.MiInputSN{border: 0px; background: transparent;}
.BordeRedo05{border-radius: 5px;}
.AnchoBoton16px{width: 16px; text-align: center;}
.AnchoBoton24px{width: 24px; text-align: center;}
.AnchoBoton32px{width: 32px; text-align: center;}
.AnchoBoton48px{width: 48px; text-align: center;}
.Izquierda{float: left;}

/*------------------- Cookie banner ----------------------*/
.cookie-consent-banner { position: fixed; bottom: 0; left: 0; z-index: 1002; box-sizing: border-box; width: 100%; display: none; background: rgba(80, 80, 80, 0.9);}
.cookie-consent-banner__inner { max-width: 960px; margin: 0 auto; padding: 32px 0; }
.cookie-consent-banner__copy { margin-bottom: 16px; }
.cookie-consent-banner__actions { }
.cookie-consent-banner__header { margin-bottom: 8px; font-family: sans-serif, arial; font-weight: normal; font-size: 16px; line-height: 24px; color: #fff; }
.cookie-consent-banner__description { font-family: sans-serif, arial; font-weight: normal; color: #838F93; font-size: 16px; line-height: 24px; color: #ddd;}

/*----------------------- Candado, dinero Relog -------------------------*/
.image-size{width: 100%; height: 40%;}
.image-sizeCaBlRl{width: 60px; height: 60px; margin: 5px;}
.image-sizeFondo{width: 100vw !important; height: 100vh;}

/* -------------------- Carrito -------------------------------*/

/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.containerCarrito {
  position: relative;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
  border: 1px red solid;
}

.columncarrito,
.columncarritos {
  width: 100%;
  float: left;
  box-sizing: border-box;
  z-index: 100;
  text-align: right;
}

/* For devices larger than 400px */
@media (min-width: 400px) {
  .containerCarrito {
    width: 85%;
    padding: 0; }
}

/* For devices larger than 550px */
@media (min-width: 550px) {
  .containerCarrito {
    width: 80%; }
  .columncarrito,
  .columncarritos {
    margin-left: 4%; }
  .columncarrito:first-child,
  .columncarritos:first-child {
    margin-left: 0; }

  .onecarrito.columncarrito,
  .onecarrito.columncarritos                    { width: 4.66666666667%; }
  .twocarrito.columncarritos                    { width: 13.3333333333%; }
  .threecarrito.columncarritos                  { width: 22%;            }
  .fourcarrito.columncarritos                   { width: 30.6666666667%; }
  .fivecarrito.columncarritos                   { width: 39.3333333333%; }
  .sixcarrito.columncarritos                    { width: 48%;            }
  .sevencarrito.columncarritos                  { width: 56.6666666667%; }
  .eightcarrito.columncarritos                  { width: 65.3333333333%; }
  .ninecarrito.columncarritos                   { width: 74.0%;          }
  .tencarrito.columncarritos                    { width: 82.6666666667%; }
  .elevencarrito.columncarritos                 { width: 91.3333333333%; }
  .twelvecarrito.columncarritos                 { width: 100%; margin-left: 0; }

  .onecarrito-third.columncarrito               { width: 30.6666666667%; }
  .twocarrito-thirds.columncarrito              { width: 65.3333333333%; }

  .onecarrito-half.columncarrito                { width: 48%; }

  /* Offsets */
  .offset-by-onecarrito.columncarrito,
  .offset-by-onecarrito.columncarritos          { margin-left: 8.66666666667%; }
  .offset-by-twocarrito.columncarrito,
  .offset-by-twocarrito.columncarritos          { margin-left: 17.3333333333%; }
  .offset-by-threecarrito.columncarrito,
  .offset-by-threecarrito.columncarritos        { margin-left: 26%;            }
  .offset-by-fourcarrito.columncarrito,
  .offset-by-fourcarrito.columncarritos         { margin-left: 34.6666666667%; }
  .offset-by-fivecarrito.columncarrito,
  .offset-by-fivecarrito.columncarritos         { margin-left: 43.3333333333%; }
  .offset-by-sixcarrito.columncarrito,
  .offset-by-sixcarrito.columncarritos          { margin-left: 52%;            }
  .offset-by-sevencarrito.columncarrito,
  .offset-by-sevencarrito.columncarritos        { margin-left: 60.6666666667%; }
  .offset-by-eightcarrito.columncarrito,
  .offset-by-eightcarrito.columncarritos        { margin-left: 69.3333333333%; }
  .offset-by-ninecarrito.columncarrito,
  .offset-by-ninecarrito.columncarritos         { margin-left: 78.0%;          }
  .offset-by-tencarrito.columncarrito,
  .offset-by-tencarrito.columncarritos          { margin-left: 86.6666666667%; }
  .offset-by-elevencarrito.columncarrito,
  .offset-by-elevencarrito.columncarritos       { margin-left: 95.3333333333%; }

  .offset-by-onecarrito-third.columncarrito,
  .offset-by-onecarrito-third.columncarritos    { margin-left: 34.6666666667%; }
  .offset-by-twocarrito-thirds.columncarrito,
  .offset-by-twocarrito-thirds.columncarritos   { margin-left: 69.3333333333%; }

  .offset-by-onecarrito-half.columncarrito,
  .offset-by-onecarrito-half.columncarritos     { margin-left: 52%; }

}

/* -----------------------------------------------
    submenucarrito
*/
.submenucarrito {
    position: relative;
}

.submenucarrito #carrito{
    display: none;
}
.submenucarrito:hover #carrito{
    display: block;
    position: absolute;
    right:0;

    top:100%;
    z-index: 1;
    background-color: white;
    padding: 20px;
    min-height: auto;
    max-height: 400px;
    min-width: 300px;
}

.submenucarrito .ensimaCarrito{
  width: 17px;
  height: 17px;
  border: 1px rgba(184, 107, 0, 0.9) solid;
  border-radius: 50%;
  background-color: rgba(184, 107, 0, 0.9);
  color: #fff;
  font-weight: bolder;
  position: absolute;
  text-align: center;
  top: -10px;
  left: 20px;
  font-size: 12px;
  vertical-align: middle;
}

/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.submenucarrito th,
.submenucarrito td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
.submenucarrito th:first-child,
.submenucarrito td:first-child {
  padding-left: 0; }
.submenucarrito th:last-child,
.submenucarrito td:last-child {
  padding-right: 0; }


/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {margin-bottom: 1rem; }
table {margin-bottom: 0.5rem; }


/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
  width: 100%;
  box-sizing: border-box; }
.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; }


/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }


/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Self Clearing Goodness */
.containerCarrito:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/


/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}

/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button, button, input[type="submit"],
input[type="reset"], input[type="button"] {
  display: inline-block;
  height: 38px;
  padding: 0 30px;
  color: #555;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  /*background-color: transparent;*/
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid #bbb;
  cursor: pointer;
  box-sizing: border-box;
}
.button:hover, button:hover, input[type="submit"]:hover,
input[type="reset"]:hover, input[type="button"]:hover,
.button:focus, button:focus, input[type="submit"]:focus,
input[type="reset"]:focus, input[type="button"]:focus {
  color: #333;
  border-color: #888;
  outline: 0;
  background-color: rgba(229, 249, 255, .9);
  box-shadow: 3px 3px 3px -1px rgba(0,0,0,0.35);
}
.button.button-primary, button.button-primary,
input[type="submit"].button-primary, input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #FFF;
  background-color: #33C3F0;
  border-color: #33C3F0;
}
.button.button-primary:hover, button.button-primary:hover,
input[type="submit"].button-primary:hover, input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover, .button.button-primary:focus,
button.button-primary:focus, input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
  color: #FFF;
  background-color: #1EAEDB;
  border-color: #1EAEDB;
}

/* --------------------------- Fin Carrito ---------------------------- */
/*-------- Nuevo Modal solo css carrito ---------*/
.modalCr-contenido{
  background-color:rgb(255, 255, 255);
  width:450px;
  padding: 10px 20px;
  margin: 20% auto;
  position: relative;
  border-radius: 9px;
}
.modalCr-contenido .CloseMdlCar{
  font-style: normal;
  cursor: pointer;
  padding: 3px;
}
.modalCr{
  background-color: rgba(0,0,0,.3);
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  opacity:0;
  pointer-events:none;
  /*transition: all 1s;*/
  overflow: auto;
  z-index: 1000;
}

#miModalCr:target{
  opacity:1;
  pointer-events:auto;
}
.show {
  pointer-events: auto;
  opacity: 1;
}
/*---------------------------------------*/
/* -------------- tabs top 10  -------------- */

.cntTbs{
  margin-left: 20px;
  margin-right: 20px;
	padding: 0;
	/*font-family: sans-serif;*/
}
.brdMenu{
	padding-bottom: 2px;
	border-bottom: 2px #f1ecec solid;
	height: 39px;
}

.tbMenu { display: flex; justify-content: center; }

.tbMenu p {/* selector de pestañas sub-menu */
	margin-right: 0.4rem;
	cursor: pointer;
	/*border-bottom: 2px white solid;*/
	height: 39px;
	font-size: 23px;
	font-weight: bold;
}
.tbMenu p:hover {
	border-bottom: 2px #04a0e9 solid;
	box-shadow: 0 0 0 0 #8785f1;
}

.tbContent { margin-top: 2rem; }
.tbActiveMdl{
  cursor: pointer;
  padding: 0px 0.5rem;
  border-top: 2px solid #0017b8;
  border-left: 2px solid #f1ecec;
  border-right: 2px solid #f1ecec;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  background-color: rgba(0,112,184,0.03);
  border-bottom: 2px solid white;
  /*box-shadow: 2px 2px 2px rgba(0,0,0,0.5);*/
  text-shadow: 2px 2px 2px rgba(0,112,184,0.1);
}
.tbActiveMdl::before{  content: '▶'; font-size: 14px;}
.tbActiveMdl::after{  content: '◀'; font-size: 14px; }

[data-content] {
	display: none;
}

.tbActive[data-content] {
	display: block;
}
/* ------------------------------------------ */
/* ------------------- Menu login ----------------*/
:root{
    /*--fndoMenu: #0070B8;*/
    --lnsSubMe: #76C8FD;
    --fndoMenu: #ffffff;
    --clrSelec: #39A1E5;
    --clrTexto: #000000;
    --altCntIm: 128px;
    --clrAvatar: #AEDFFF;
}

.navMen1{//contenedor del avatar
    padding: 0;
    margin: 0;
}

.navMen1 ul, .navMen1 ol,
.navMen1 li{
    list-style:none;
    cursor: default;
    text-align: left;
}
.navMen1 .principal{
    background: #000;
}
.navMen1 .border{
    height: 150px;
    width: 200px;
    padding-left: 10px;
    padding-top: 20px;
    margin-left: 5px;
    /*padding-right: 5px;*/
    border: 1px var(--lnsSubMe) solid;
    border-radius: 8px;
    background: #fff;
    /*top: var(--altCntIm);*/

}
.navMen1 li i { /*color menu*/
    font-weight: bold;
    text-decoration:none;
    display:block;
}
.navMen1 li input { /*color inputs*/
    margin: 5px;
    padding:10px 5px;
    border-radius: 5px;
    border: 1px var(--clrSelec) solid;
    display:block;
    height: 30px;
}
.navMen1 li button { /*color button*/
    margin: 5px;
    padding:10px auto;
    height: 30px;
    width: 140px;
    border-radius: 5px;
    background: var(--lnsSubMe);
    border: 1px var(--clrSelec) solid;
    cursor: pointer;
}
.navMen1 .separa{
    margin-top: 5px;
    margin-bottom: 10px;
}
.navMen1 .divCentra{text-align: center}
.navMen1 .sltItms{
    font-style: none;
    font-weight: 200;
    padding: 0 15px;
}
.navMen1 .sltItms:hover {
    font-style: none;
    font-weight: bold;
    color: var(--clrSelec);
}
.navMen1 li ul {
    display:none;
    position:absolute;
    min-width: auto;
}

.navMen1 li:hover > ul {display:block;}
.separador{border-bottom: 1px var(--lnsSubMe) solid;}

/* -----------------------------------------------*/
/*Loading page*/
.ponrojo{border: 1px red solid;}
.pongris{border: 1px solid #dcdcdc;}
.ponrojo{border: 1px red solid;}
.ponverde{border: 1px green solid;}
.ponazul{border: 1px blue solid;}
.txtColor{color: red}
.sdwTextNgr{text-shadow: -2px 2px 3px rgba(0, 0, 0, 0.3);}
.sdwTextBlc{text-shadow: -2px 2px 3px rgba(255, 255, 255, 0.3);}
.sdwTextDrd{text-shadow: -2px 2px 3px rgba(184, 107, 0, 0.5);}
.brd1Dorado{border: 1px solid rgba(184, 107, 0, 0.25); /* Cafe suabe Color de borde */}
.brd1Azul{border: 1px solid rgba(0, 112, 184, 0.25); /* Cafe suabe Color de borde */}
.brd1Negro{border: 1px solid rgba(0, 0, 0, 0.25); /* Cafe suabe Color de borde */}
.brd1Gris{border: 1px solid rgba(0, 0, 0, 0.10); /* Cafe suabe Color de borde */}
.brd2Dorado{border: 2px solid rgba(184, 107, 0, 0.25); /* Cafe suabe Color de borde */}
.brd2Azul{border: 2px solid rgba(0, 112, 184, 0.25); /* Cafe suabe Color de borde */}
.brd2Negro{border: 2px solid rgba(0, 0, 0, 0.25); /* Cafe suabe Color de borde */}
.brd2Gris{border: 2px solid rgba(0, 0, 0, 0.10); /* Cafe suabe Color de borde */}
.brd3Dorado{border: 3px solid rgba(184, 107, 0, 0.25); /* Cafe suabe Color de borde */}
.brd3Azul{border: 3px solid rgba(0, 112, 184, 0.25); /* Cafe suabe Color de borde */}
.brd3Negro{border: 3px solid rgba(0, 0, 0, 0.25); /* Cafe suabe Color de borde */}
.brd3Gris{border: 3px solid rgba(0, 0, 0, 0.10); /* Cafe suabe Color de borde */}
.bdrRadio05{border-radius: 0.5rem}

.truncate-1 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.truncate-3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.cardSedeCrso{
  width=100%;
  height: 22px;
}
.cardSedeCrso::after{/*<*/
  content: "\2B98";
  color: #0070b8;
  padding-left: 5px;
  font-size: 18px;
  }
.cardSedeCrso::before{/*>*/
  content: "\2B9A";
  color: #0070b8;
  padding-right: 5px;
  font-size: 18px;
}

.negritas{font-weight: bolder;}
.mnsjCent50{width: 50%; margin: 1px auto;}
