:root{
    /*Colores*/
    --color_Black: #000000;
    --color_White: #FFFFFF;
    --color_VistaBlue: #23106A;
    --color_SoftVistta: #d3cde9;
    --bg-main: #0f0f0f;
    --bg-cont: #253b49;
    --bg-active: #131212;    
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 62.5%;
    font-family: 'DM Sans', sans-serif;
	max-width: 2000px;
	margin: 0 auto;
	background: black;
}

body {	
    background: white;
}	

/*Encabezado*/

header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    min-width: 320px;
    height: 200px;
    text-align: center;
    background: linear-gradient(207.8deg, #5794bd 16.69%, #555497 100%);
}

header img {
    width: 150px;
    height: auto;  
    align-self: center;
    margin-bottom: 30px;
}

.header--tittle-container {
    width: 90%;
    min-width: 288px;
    max-width: 900px;
    height: 218px;
    margin-top: 2px;
    text-align: center;
    align-self: center;
}

.header--tittle-container h1 {
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 2.6rem;
    color: var(--color_White);
    margin-bottom: 30px;
}

/* Styles tabs */

main {
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
    background: var(--bg-main);
    padding: 20px;
}

.tab-container {
   width: 100%;
   height: auto;
   box-shadow: 3px 5px 10px rgba(0, 0, 0, .8);
   border-radius: 15px;
   overflow: hidden;
   text-align: center;
}

.galleries-tittle {
    display: flex;
    width: 100%;
    height: 15%;
    list-style: none;    
}

.gallery {
    height: 4rem;
    padding: 3px;
    background: var(--color_Black);
    flex-grow: 1;
    font-size: 1rem;
    font-weight: bold;
    text-align: center;    
    color: #fff;
    cursor: pointer;
    border: none;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;    
}

.gallery-active {
    background: var(--bg-active);
}

.gallery ul {
    display: flex;
    list-style: none;
    justify-content: center; 
}

.gallery .init {
    display: inline-block;
    margin-right: 0.5rem;
    color: #abd0fa;
}

.gallery-active .init-disabled {
    display: none;
}

.gallery .init-text {
    display: none;
}

.gallery-active .init-text-active {
    display: inline-block;
}

.galleries-images {
    width: 100%;
    height: 85%;
}

.content {
    width: 100%;
    height: 100%;
    color: #fff;
    display: none;
    padding: 20px;
}

.content-active {
    background: var(--bg-active);
    display: block;
}

.content h3 {
	font-size: 1.6rem;
    text-align: center;
    padding-bottom:  10px;
    border-bottom: solid 1px rgba(255, 255, 255, .3);
    letter-spacing: 2px;
    margin: 10px;
}

.content p {
    margin: 15px;
    letter-spacing: 1px;
}

.equipment-container {
    margin-bottom: 20px;
}

/* styles imgs */

.img-container  {
    width: 200px;
    height: 300px; 
    margin: 20px;
}

.img-tittle {
	font-size: 1.4rem;
    height: 20%;
	color: #d3cde9;
}

.img-link {
    display: inline-block;
    width: 100%;
    height: 80%;        
    border-radius: 10px;
    border: solid 2px white;   
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/* Others text sections */

.txt-container {
	min-width: 200px;
	min-height: 300px;	
	display: inline block;
	padding: 20px;
	text-align: left;
	border-radius: 20px;
	box-shadow: 3px 5px 10px rgba(0, 0, 0, .8);	
}

.img-tittle {
	font-size: 1.4rem;
    height: 20%;
	color: #d3cde9;
}

.img-link {
    display: inline-block;
    width: 100%;
    height: 80%;        
    border-radius: 10px;
    border: solid 2px white;   
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/* ------------------- */

.txt-container h3 {
	font-size: 1.6rem;	
	margin-bottom: 30px;
}

.txt-container p {
	font-size: 1.2rem;
    font-weight: bold;
    line-height: 2.6rem;
	color: #d3cde9;
}

.txt-container a {	
	color: #d3cde9;
	text-decoration: none;
	text-decoration: underline;
}

/* indv img 1*/

.img-container .img1-1-1{
    background-image: url("/assets/images/Multimedia/01-Optica-mostrador/1-Calentadores/1-Calentador\ de\ Monturas\ GENESIS\ FH\ 2.0.webp");    
}

.img-container .img1-1-2{
    background-image: url("/assets/images/Multimedia/01-Optica-mostrador/1-Calentadores/2-Calentador\ de\ Monturas\ GENESIS\ FH\ 4.0.webp");    
}

.img-container .img1-2-1{
    background-image: url("/assets/images/Multimedia/01-Optica-mostrador/2-Test-UV/1-Tester\ de\ UV\ GENESIS\ 1.0.webp");    
}

.img-container .img1-3-1{
    background-image: url("/assets/images/Multimedia/01-Optica-mostrador/3-Activador-Fotocromatico/1-Activador\ Fotocromático\ para\ Lentes\ oftálmicas\ GENESIS.webp");    
}

.img-container .img1-4-1{
    background-image: url("/assets/images/Multimedia/01-Optica-mostrador/4-Set-herramientas/1-Set\ de\ Pinzas\ y\ Destornilladores\ GENESIS\ Kit14.webp");    
}

.img-container .img1-4-2{
    background-image: url("/assets/images/Multimedia/01-Optica-mostrador/4-Set-herramientas/2-Set\ de\ Pinzas\ y\ Destornilladores\ GENESIS\ KIT18.webp");    
}

/* indv img 2*/

.img-container .img2-1-1{
	background-image: url("/assets/images/Multimedia/02-Desinfeccion-limpieza/1-Limpiadores-ultrasonicos/1-Limpiador\ Ultrasónico\ GENESIS\ UC\ 1.0.webp");	
}

/* indv img 3*/

.img-container .img3-1-1{
	background-image: url("/assets/images/Multimedia/03-Montaje/1-Fresadoras/1-EasyBuddy\ -\ MEI\ System.webp");	
}

.img-container .img3-1-2{
	background-image: url("/assets/images/Multimedia/03-Montaje/1-Fresadoras/2-EasyFit\ Trend\ NO\ BLOCK\ -\ MEI\ System.webp");
}

.img-container .img3-2-1{
	background-image: url("/assets/images/Multimedia/03-Montaje/2-Biseladoras-Automaticas/1-Biseladora\ Automática\ GENESIS\ LE3.0\ KIT.webp");
}

.img-container .img3-2-2{
	background-image: url("/assets/images/Multimedia/03-Montaje/2-Biseladoras-Automaticas/2-Biseladora\ Automática\ Huvitz\ Excelon\ HPE410\ +\ SMT\ C\ DRILLER.webp");	
}

.img-container .img3-2-3{
	background-image: url("/assets/images/Multimedia/03-Montaje/2-Biseladoras-Automaticas/3-Biseladora\ Automática\ WECO\ E12.webp");	
}

.img-container .img3-2-4{
	background-image: url("/assets/images/Multimedia/03-Montaje/2-Biseladoras-Automaticas/4-Biseladora\ Automática\ WECO\ E32.webp");		
}

.img-container .img3-2-5{
	background-image: url("/assets/images/Multimedia/03-Montaje/2-Biseladoras-Automaticas/5-Biseladora\ Automática\ WECO\ E52\ +\ Bloqueador\ Manual\ C4.webp");		
}

.img-container .img3-2-6{
	background-image: url("/assets/images/Multimedia/03-Montaje/2-Biseladoras-Automaticas/6-Biseladora\ Automática\ WECO\ E62\ +\ Centrador\ CT7.webp");		
}

.img-container .img3-3-1{
	background-image: url("/assets/images/Multimedia/03-Montaje/3-Biseladoras-Semiautomaticas/1-Biseladora\ Semiautomática\ GENESIS\ LE1.0\ KIT.webp");		
}

.img-container .img3-4-1{
	background-image: url("/assets/images/Multimedia/03-Montaje/4-Biseladora-Manual/1-Biseladora\ Manual\ 1\ Piedra\ GENESIS\ HE\ 1.0.webp");	
}

.img-container .img3-5-1{
	background-image: url("/assets/images/Multimedia/03-Montaje/5-Perifericos/1-Pantógrafo\ GENESIS\ PM\ 1.0.webp");	
}

.img-container .img3-5-2{
	background-image: url("/assets/images/Multimedia/03-Montaje/5-Perifericos/2-Perforadora\ Manual\ GENESIS\ DM\ 1.0.webp");	
}

.img-container .img3-5-3{
	background-image: url("/assets/images/Multimedia/03-Montaje/5-Perifericos/3-Pulidora\ Automática\ GENESIS\ AP\ 1.0.webp");		
}

.img-container .img3-5-4{
	background-image: url("/assets/images/Multimedia/03-Montaje/5-Perifericos/4-Ranuradora\ Automática\ GENESIS\ AG\ 1.0.webp");		
}

/* indv img 4*/

.img-container .img4-1-1{
	background-image: url("/assets/images/Multimedia/04-tratamiento/1-Tenidoras/1-Brazo\ Gradador\ Stroke\ Gradient\ IV\ BPI.webp");	
}

.img-container .img4-1-2{
	background-image: url("/assets/images/Multimedia/04-tratamiento/1-Tenidoras/2-Teñidora\ 6\ Bateas\ GENESIS\ T6.webp");	
}

/* indv img 5*/

.img-container .img5-1-1{
	background-image: url("/assets/images/Multimedia/05-Medicion/1-Lensometros/1-Lensómetro\ Digital\ VISIONIX\ VX36.webp");		
}

.img-container .img5-1-2{
	background-image: url("/assets/images/Multimedia/05-Medicion/1-Lensometros/2-Analizador\ de\ lentes\ Visionix\ VX40.webp");		
}

.img-container .img5-1-3{
	background-image: url("/assets/images/Multimedia/05-Medicion/1-Lensometros/3-Lensómetro\ Digital\ GENESIS\ DL1.webp");		
}

.img-container .img5-1-4{
	background-image: url("/assets/images/Multimedia/05-Medicion/1-Lensometros/4-Lensómetro\ Digital\ GENESIS\ DL2.webp");		
}

.img-container .img5-1-5{
	background-image: url("/assets/images/Multimedia/05-Medicion/1-Lensometros/5-Lensómetro\ Manual\ de\ Lectura\ Externa\ GENESIS\ LM-1.webp");		
}

.img-container .img5-2-1{
	background-image: url("/assets/images/Multimedia/05-Medicion/2-Pupilometro/1-Pupilómetro\ digital\ GENESIS\ DP-1.webp");		
}

/* indv img 6*/

.img-container .img6-1-1{
	background-image: url("/assets/images/Multimedia/06-Refraccion/1-Monturas/1-Montura\ de\ prueba\ Titanio\ GENESIS.webp");		
}

.img-container .img6-1-2{
	background-image: url("/assets/images/Multimedia/06-Refraccion/1-Monturas/2-Montura\ de\ prueba\ Premium\ GENESIS.webp");		
}

.img-container .img6-2-1{
	background-image: url("/assets/images/Multimedia/06-Refraccion/2-Cajas-prueba/1-Caja\ de\ prueba\ 158\ -\ Aro\ plástico\ --\ Maleta\ aluminio\ -\ GENESIS.webp");		
}

.img-container .img6-2-2{
	background-image: url("/assets/images/Multimedia/06-Refraccion/2-Cajas-prueba/2-Caja\ de\ prueba\ 158\ -\ Aro\ metálico\ --\ Maleta\ aluminio\ -\ GENESIS.webp");		
}

.img-container .img6-2-3{
	background-image: url("/assets/images/Multimedia/06-Refraccion/2-Cajas-prueba/3-Caja\ de\ prueba\ 266\ -\ Aro\ plástico\ --\ Maleta\ aluminio\ -\ GENESIS.webp");			
}

.img-container .img6-2-4{
	background-image: url("/assets/images/Multimedia/06-Refraccion/2-Cajas-prueba/4-Caja\ de\ prueba\ 266\ -\ Aro\ metálico\ --\ Maleta\ aluminio\ -\ GENESIS.webp");		
}

.img-container .img6-3-1{
	background-image: url("/assets/images/Multimedia/06-Refraccion/3-Foropteros/1-Brazo\ de\ Foróptero\ GENESIS\ PA-1.webp");		
}

.img-container .img6-3-2{
	background-image: url("/assets/images/Multimedia/06-Refraccion/3-Foropteros/2-Foróptero\ Manual\ GENESIS\ MR1.webp");		
}

.img-container .img6-3-3{
	background-image: url("/assets/images/Multimedia/06-Refraccion/3-Foropteros/3-Foróptero\ Digital\ GENESIS\ DR2.webp");		
}

.img-container .img6-3-4{
	background-image: url("/assets/images/Multimedia/06-Refraccion/3-Foropteros/4-Foróptero\ Digital\ VX65\ Visionix\ 1.webp");		
}

/* indv img 7*/

.img-container .img7-1-1{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/1-Retinoscopio/1-Retinoscopio\ directo\ GENESIS\ RT-1.webp");		
}

.img-container .img7-2-1{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/2-Oftalmoscopios/1-Oftalmoscopio\ directo\ GENESIS\ OT-1.webp");		
}

.img-container .img7-2-2{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/2-Oftalmoscopios/2-Oftalmoscopio\ Binocular\ Indirecto\ GENESIS\ OBI-2.webp");		
}

.img-container .img7-3-1{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/1-Lámpara\ de\ Hendidura\ MAGWIDE\ 50D\ Visionix.webp");		
}

.img-container .img7-3-2{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/2-Lámpara\ de\ Hendidura\ KANGHUA\ Dry\ Eye.webp");		
}

.img-container .img7-3-3{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/3-Lámpara\ de\ Hendidura\ KANGHUA\ SLM-2ER-L\ 3x\ Tambor.webp");		
}

.img-container .img7-3-4{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/4-Lámpara\ de\ Hendidura\ KANGHUA\ SLM-2ER-E\ 5X\ Tambor\ Premium.webp");		
}

.img-container .img7-3-5{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/5-Lámpara\ de\ Hendidura\ KANGHUA\ SLM-2R\ 5X\ Tambor.webp");		
}

.img-container .img7-3-6{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/6-Lámpara\ de\ Hendidura\ KANGHUA\ SLM-3ER\ 5X\ Tambor\ c-Image\ System.webp");		
}

.img-container .img7-3-7{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/7-Lámpara\ de\ Hendidura\ KANGHUA\ SLM-3ER-E\ 5X\ Tambor\ c-Image\ System\ Premiun.webp");		
}

.img-container .img7-3-8{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/8-Lámpara\ de\ Hendidura\ KANGHUA\ SLM-JER\ 2X\ Selector.webp");		
}

.img-container .img7-3-9{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/3-Lamparas-hendidura/9-Lámpara\ de\ Hendidura\ KANGHUA\ SLM-6H\ 3x\ Portátil.webp");		
}

.img-container .img7-4-1{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/4-Campimetros/1-Perímetro\ de\ Proyección\ KANGHUA\ APS-T00.webp");		
}

.img-container .img7-4-2{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/4-Campimetros/2-Perímetro\ de\ Proyección\ KANGHUA\ APS-T90.webp");		
}

.img-container .img7-4-3{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/4-Campimetros/3-Perímetro\ Automático\ KANGHUA\ APS-6000BER.webp");		
}

.img-container .img7-4-4{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/4-Campimetros/4-Perímetro\ Automático\ KANGHUA\ APS-6000CER.webp");		
}

.img-container .img7-5-1{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/5-Tonometros/1-Tonómetro\ de\ Aplanación\ GENESIS\ TN-1.webp");			
}

.img-container .img7-5-2{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/5-Tonometros/2-Tonómetro\ Automático\ CANON\ TX-20.webp");			
}

.img-container .img7-6-1{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/6-Topografo/1-Topógrafo\ Corneal\ Medmont\ Meridia.webp");		
}

.img-container .img7-7-1{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/7-Camaras-retinales/1-Cámara\ Retinal\ Portátil\ Eyer\ -\ Phelcom.webp");		
}

.img-container .img7-7-2{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/7-Camaras-retinales/2-Cámara\ Retinal\ Digital\ No\ Midriática\ CANON\ CR-2AF.webp");		
}

.img-container .img7-8-1{
	background-image: url("/assets/images/Multimedia/07-Diagnostico/8-Plataforma-multidiagnostico/1-Plataforma\ multimodal\ de\ diagnóstico\ oftalmológico\ VX110\ Visionix.webp");		
}

/* indv img 8*/

.img-container .img8-1-1{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/1-Mesas/1-Mesa\ Eléctrica\ GENESIS\ ET-4.webp");		
}

.img-container .img8-1-2{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/1-Mesas/2-Mesa\ de\ Elevación\ Eléctrica\ GENESIS\ ET-10.webp");		
}

.img-container .img8-2-1{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/2-Unidades-refraccion/1-Unidad\ de\ Refracción\ GENESIS\ RU1.webp");		
}

.img-container .img8-2-2{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/2-Unidades-refraccion/2-Unidad\ de\ Refracción\ VX1200\ Visionix.webp");		
}

.img-container .img8-2-3{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/2-Unidades-refraccion/3-Unidad\ de\ Refracción\ Evidence\ Plus\ ELT3\ APRAMED.webp");		
}

.img-container .img8-3-1{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/3-Camillas/1-Camilla\ Quirurgica\ APM3\ GII\ APRAMED.webp");	
}

.img-container .img8-3-2{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/3-Camillas/2-Camilla\ Quirúrgica\ 6080C\ Apramed.webp");	
}

.img-container .img8-3-3{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/3-Camillas/3-Camilla\ Quirúrgica\ 6080M\ Apramed.webp");	
}

.img-container .img8-4-1{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/4-Taburetes/1-Taburete\ Quirúrgico\ Neumático\ APRAMED.webp");	
}

.img-container .img8-4-2{
	background-image: url("/assets/images/Multimedia/08-Mobiliario/4-Taburetes/2-Taburete\ Quirúrgico\ Eléctrico\ APRAMED.webp");	
}

/* indv img 9*/

.img-container .img9-1-1{
	background-image: url("/assets/images/Multimedia/09-Laboratorios-superficie/1-Generadores/1-Generador\ Cobalt\ NX\ FreeForm\ -\ Coburn\ Technologies.webp");	
}

.img-container .img9-1-2{
	background-image: url("/assets/images/Multimedia/09-Laboratorios-superficie/1-Generadores/2-Generador\ Convencional\ CTL65\ -\ Coburn\ Technologies.webp");	
}

.img-container .img9-2-1{
	background-image: url("/assets/images/Multimedia/09-Laboratorios-superficie/2-Laqueadoras/1-Sistema\ de\ recubrimiento\ Velocity\ LTE\ Spin\ -\ Coburn\ Technologies.webp");	
}

.img-container .img9-2-2{
	background-image: url("/assets/images/Multimedia/09-Laboratorios-superficie/2-Laqueadoras/2-Sistema\ de\ recubrimiento\ Velocity\ TT\ -\ Coburn\ Technologies.webp");	
}

/* --------- */

.content-active .final-gallery-return{
    margin-bottom: 0;
}

.gallery-return{
    cursor: pointer;
    display: inline-block;
    position: relative;
    font-size: 1.4rem;
    line-height: 1.6rem;
    color: var(--color_White);
    font-weight: bold;
    text-decoration: none;
    width: 200px;
    height: 50px;
    margin: 15px;
    padding: 15px;
    background-color: var(--bg-active);
    box-shadow: 0px 4px 8px rgba(89, 73, 30, 0.16);    
	border: 2px solid #abd0fa;
    border-radius: 15px;    
    text-align: center;
    padding-right: 30px;
    margin-bottom: 80px;
}

.gallery-return-icon{
    cursor: pointer;
    display: inline-block;
    position: absolute;
    width: 20px;
    height: 20px;
    margin-left: 10px;
    background-image: url('../assets/icons/up-p.png');
    background-size: cover;
}

.return-section {
    width: 100%;
    padding-top: 30px;
    text-align: center;
	background-color: var(--bg-active);    
}

.return-section a {
    cursor: pointer;
    display: inline-block;
    font-size: 1.4rem;
    line-height: 1.6rem;
    color: var(--color_White);
    font-weight: bold;
    text-decoration: none;
    width: 250px;
    height: 50px;
    margin: 15px;
    padding: 15px;
    background-color: var(--bg-active);
    box-shadow: 0px 4px 8px rgba(89, 73, 30, 0.16);    
	border: 2px solid #abd0fa;
    border-radius: 15px;    
    text-align: center;
    margin-bottom: 60px;
}

.gallery-return:hover{
    background-color: #0c2563;
}

.return-section a:hover {
    background-color: #0c2563;
}

/* Foother */

footer {
    display: flex;
    width: 100%;
    height: 150px;
    background: linear-gradient(207.8deg, #5794bd 16.69%, #555497 100%);
}

footer section {
    display: flex;
    width: 50%;
    justify-content: center;
    align-items: center;
}

footer .left ul {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.8rem;
    list-style: none;
}

.left li {
    margin: 10px 0;
}

.left a {
    text-decoration: none;
    color: var(--color_White);
}

.right img {
    width: 100px;
    height: auto;
}