@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.1.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}


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


html {
  min-height: 100%;
}

body {
font-family: 'IBM Plex Mono', monospace;
    font-size: 1rem;
    color: #ccc;
    background-color: #000;
    margin-top: 0px;
   line-height: 160%;
}

h1 {
/*    font-family: 'Share Tech Mono', monospace;*/
    font-family: 'Days One', sans-serif;
    font-size: 2rem;
    font-weight: 300;
    line-height: 90%;
        margin: 0px;
/*    border: 2px dotted #00ff00;*/
}
h1 p{

    padding-bottom:-10px;
    line-height: 80%;
    margin: 0px;
}


h2 {
/*    font-family: 'Share Tech Mono', monospace;*/
    font-family: 'Days One', sans-serif;
    font-size: 1.5rem;
    font-weight: 300;
}

button {
    cursor:pointer;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 1rem;
    font-weight: bold;
    color: #ccc;
    background-color: #2D2E2B;
}

button:hover {
    cursor:pointer;
    font-family: 'IBM Plex Mono', monospace;
    font-weight: bold;
    font-size: 1rem;
    background-color: #000000;
    color: red;
}
button:focus {
    cursor:pointer;
    font-family: 'IBM Plex Mono', monospace;
    font-weight: bold;
/*    font-size: 0.3rem;*/
    background-color: #000000;
/*    color: #838679;*/
        color: #000;
    outline:0;
/*     display: none;*/
    border: 1px solid #000;
}

a:link, a:active, a:visited{
    color: chartreuse;
    text-decoration: none;
}
a:hover{
    color: black;
    background-color: chartreuse;
    text-decoration: none;
}

.contendedorMenu{
    margin: 0px auto;
    width: 80vw;
    max-width: 1100px;
    padding: 0px;
    background-color: #85ac4c;
    padding-top: 1.5rem;
     	/* Flexbox */
	/*display: flex;
    justify-content:space-between;
    flex-wrap: nowrap;
    align-items: stretch;
	flex-direction:row; */
/*    border: 3px dotted #ffff00;*/
    text-align: center;
border-radius: 0px 0px 25px 25px;
}

header {
    margin: 0px auto;
    width: 80vw;
    max-width: 1100px;
    padding: 0px;
    padding-top: 0.5rem;
    padding-bottom: 3rem;
/*    border: 3px dotted #ffff00;*/
}

header nav {
	/* Flexbox */
/*	display:flex;
	flex-wrap:wrap;*/
	align-items:center;
    width: 80%;
}

header nav a {
	text-align: center;
	text-decoration: none;
	padding:3px;
    color: #15DE00;
	background-color: #000;
	
	border: 1px solid #000;
	font-size: 1rem;
/*	 font-family: 'Days One', sans-serif;*/
/*	font-weight: bold;*/
    border-radius: 5px 5px 5px 5px;
	/* Flexbox */
	flex-grow:1;
}
header nav a:hover {
	color: #FFFFFF;
	background-color: #000;
	border: 1px solid #15DE00;
	TEXT-DECORATION: none;
	/* Flexbox */
	flex-grow:1;
}

header .navOFF {
	text-align: center;
	text-decoration: none;
	padding:4px;
	color: #3C3A3A;
	background-color: #76B564;
	border: 1px solid #000;
	font-size: 0.8rem;
	 font-family: 'Days One', sans-serif;
	font-weight: bold;
	/* Flexbox */
	flex-grow:1;
}

.navOFF {
	text-align: center;
	text-decoration: none;
	padding:4px;
	color: #3C3A3A;
	background-color: #76B564;
	border: 1px solid #000;
	font-size: 0.8rem;
	 font-family: 'Days One', sans-serif;
	font-weight: bold;
	/* Flexbox */
	flex-grow:1;
}

.logoHeader{
    width: 100%;
    height: auto;
    max-width: 1000px;
    
}

.tituloObra {
	font-size: 1.5rem;
	font-family: 'Bungee Shade', sans-serif;
	/*	font-family: 'Armata', sans-serif;*/
	font-weight: bold;
	color: #FFFFFF;
	line-height: 2rem;
}


.destacado {
/*    font-family: 'Share Tech Mono', monospace;*/
    font-family: 'Days One', sans-serif;
    font-size: 3rem;
    font-weight: 300;
    line-height: 100%;
    margin: 0px;
}
.contendedor{
    width: 90%;
    padding: 20px;
     	/* Flexbox */
	display: flex;
    justify-content:space-between;
	align-self: center;
	flex-direction:row; 
}

.contendedorFPage{
    width: 95%;
    padding: 10px;
     	/* Flexbox */
	display: flex;
    justify-content:space-between;
    flex-wrap: wrap;
	align-self: center;
	flex-direction:row; 
}
.paginaHome{
    background-color: #1A1A1A; 
    width: 80vw;
    max-width: 1100px;
    margin-bottom: 2rem;
    border-radius: 2rem;
    padding: 1rem;
    
}
.contendedorHome{
/*    width: 72vw;*/
    margin-top: 20px auto;
    padding: 20px;
     	/* Flexbox */
	display: flex;
    justify-content:space-between;
    flex-wrap: wrap;
	align-self: center;
	flex-direction:row; 
/* border: 2px dotted #00ff00;*/
}

.contendedorX4{
    width: 98%;
    padding: 0px;
     	/* Flexbox */
	display: flex;
    justify-content:space-between;
    flex-wrap: nowrap;
	align-self: center;
	flex-direction:row; 
/*  border: 2px dotted #00ff00;*/
}


.currentData{
    min-width: 50%; 
    max-width: 60%;
    margin: 10px auto;
    background-color: #000;
/*    border: 2px dotted #00ff00;*/
    padding: 20px;
    text-align: center;
}



.currentDataX4{
    min-width: 50%; 
    max-width: 60%;
    margin: 2px auto;
    background-color: #000;
/*    border: 2px dotted #00ff00;*/
    padding: 0px;
    text-align: center;
}

.currentDataX1{
    min-width: 100%; 
    max-width: 100%;
    margin: 2px auto;
    background-color: #000;
/*border: 2px dotted #00ff00;*/
    padding: 0px;
    text-align: center;
}

.epochCurrent{
/*    font-family: "Courier New", "monospace";*/
    font-family: 'Days One', sans-serif;
    font-size: 6rem;
    color: #eee;
    padding: 10px;
/*        border: 2px dotted #ffff00;*/
}

.epochFeed{

    /*font-family: 'Share Tech Mono', monospace;*/
    font-family: 'Days One', sans-serif;
/*font-family: 'Roboto Mono', monospace;*/
    font-weight: bolder;
    font-size: 12vw;
    color: #fff;
    padding: 10px;
    line-height: 100%;
/*    border: 2px dotted #00ff00;*/
}

/* HOME  */
/* HOME  */
/* HOME  */
/* HOME  */
/* HOME  *//* HOME  *//* HOME  *//* HOME  */
.cajaVimeo{
    position: relative;
    padding-bottom: 56.25%; 
    height: 0;
    overflow: hidden;
    
/*    width: 100%;
    height: 80vw;*/
/*    border: 2px dotted #00ff00;*/
}

.cajaVimeo iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}

.currentDataHome{
     width: 70vw;
    height: auto;
/*    min-height: 47vh;*/
    margin: 0px auto;
    background-color: #000;
/*border: 2px dotted #00ff00;*/
    padding: 20px;
    text-align: center;
}

.feedHome{
    position: relative;
    display: inline-block;
    width: 70vw;
/*height: 40vh;*/
/*    min-height: 47vh;*/
    margin: 0px auto;
/*    background-color: #000;*/
/*border: 2px dotted #00ff00;*/
    padding: 0px;
    text-align: center;
    margin-bottom: 3rem;
}

.epochFeedX1{
/* estilo de los numeros
    /*font-family: 'Share Tech Mono', monospace;*/
    font-family: 'Days One', sans-serif;
/*font-family: 'Roboto Mono', monospace;*/
    font-weight: bolder;
    font-size: 5vw;
    color: #fff;
    padding: 0px;
/*    border: 2px dotted #00ffff;*/
}

.clockFeedX1{
    /* caja de los numeros*/
     width: 40vw;
    margin:0px auto;
/*    min-height: 50vh;*/
/*     border: 2px dotted #0000ff;*/
    padding:0px;
    
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 1;
}

.frameHome{
    /* caja del frame de home */
    margin:0px auto;
    width: 40vw;
height: 50vh;
/*    min-height: 47vh;
    min-width:  40vw;*/
    border-radius: 5%;
    
    padding: 0px;
/*border: 2px dotted #ff00ff;*/
/*position: relative; */
    left: 0vw; 
/*    top: 12vh;*/
    flex-grow: 1;
    z-index: 0;
}

.texto {
    text-align: justify;
}
   

.contendedorTextoDoble{
    margin: 0;
    padding: 0px;
     	/* Flexbox */
	display: flex;
    justify-content:space-between;
    flex-wrap: nowrap;
    align-items: stretch;
	flex-direction:row; 
/*border: 1px dotted #ffff00;*/
}
.textoBilingue {
    text-align: left;
    width: 45%;
/*     border: 2px dotted #ff0000;*/
/*    border: 1px dotted #ff0000;*/
}
.textoBilingue p{
    margin-bottom: 1rem;
/*    padding-bottom:10px;*/
}

.contendedorTitulo{
    width: 70vw;
    padding: 10px;
    background-color: #000;
     	/* Flexbox */
	display: flex;
    justify-content:space-between;
    flex-wrap: nowrap;
    align-items: stretch;
	flex-direction:row; 
/*border: 1px dotted #ffff00;*/
}
.dobleColumna {
    text-align: center;
    width: 100%;
/*     border: 2px dotted #ff0000;*/

    margin-bottom: 2rem;
}

/*  fondo ambar*/
.bgAmbar {
   color: #b87c1f;
}

.cajaAmbar{
    color: #906433;
    background-color: #875727;
}
.textoAmbar{
    color: #906433;
    font-family: 'IBM Plex Mono', monospace;
}
/*  fin fondo ambar*/


.bandera{
    width: 100px;
    height: auto;
    margin: 10px;
}
.bandera img{
    width: 100%;
    height: auto;
    margin: 10px;
}

#map1 {
	height: 500px;
	width: 500px;
}

.contenedorMapas{
    width: 90%;
    padding: 10px;
     	/* Flexbox */
	display: flex;
    justify-content:space-around;
	align-self: center;
	flex-direction:row;
    flex-wrap:nowrap;
    align-content:stretch;
/*border: 2px dotted #00ffff;*/
}
.mapas{
    width: 100%;
padding: 10px;
/*border: 2px dotted #00ff00;*/ 
}

.contenedorObjeto{
/*    width: 70%;*/
    padding: 0px;
     	/* Flexbox */
	display: flex;
    justify-content:space-around;
	align-self: center;
	flex-direction:row;
    flex-wrap:nowrap;
    align-content:stretch;
/*border: 2px dotted #00ffff;*/
}
.objeto{
    width: 50%;
    padding: 10px;
/*border: 2px dotted #00ff00;*/
}

.objeto img{
    width: 100%;
    padding: 4px;
}
.objetoPlus{
    width: 100%;
    padding: 10px;
}

.objetoPlus img{
    width: 100%;
    padding: 4px;
}


.contenedorFeed{
    width: 100%;
    padding: 20px;
     	/* Flexbox */
	display: flex;
    flex-direction: column;
    min-height: 100vh;
/*    border: 2px dotted #ff00ff;*/
}

.feed{
/*    width: 100%;
    height: 800px;*/
    min-height: 100vh;
    padding: 1px;
/*    border: 2px dotted #0000ff;*/
    position: relative; left: 0; top: 0;
    flex-grow: 1;
}
.feedX4{
/*    width: 100%;
    height: 800px;*/
    margin-top: 0px;
    min-height: 94vh;
    padding: 0px;
/*     border: 2px dotted #0000ff;*/
    position: relative; left: 0; top: 0;
    flex-grow: 1;
}

.clockFeed{
      position:absolute;
/*    height:95%;*/
      width: 98%;
    margin: auto;
/*    min-height: 50vh;*/
/*    border: 2px dotted #0000ff;*/
    top: 38vh;
    text-align: center;
     z-index: 1;
}

.navegador{
    width: 98%;
    margin: auto;
    height: 3vh;
    display: flex;
    flex-direction: row;
    justify-content:flex-start;
/*	align-self: center;*/
    flex-wrap:nowrap;
/*    align-content:stretch;*/
/*      border: 1px dotted #00ff00;*/
    
}

.boton{
    width: 98%;
    margin: auto;
    height: 5vh;
    position: absolute;
    z-index: 3;
/* border: 10px dotted #00fff;*/
/*    background-color: aqua;
    color: crimson;*/
}
.boton2{
    width: 50%;
    margin: 5px auto;
/*    height: 2vh;*/
/*    position: absolute;*/
    cursor: pointer;
text-align: center;
z-index: 4;
/*border: 1px dotted #00ffff;*/
/* background-color: #000000;
    color: #C1C4B8;*/
}
.boton2:hover {
  background-color: #000000;
  color: white;
}

.back{
      width: 50%;
   position: absolute; 
/*   z-index: 4;*/
  top: 0px;
  left : 0px;
}

/*filter: url("filters.svg#filter-id");
filter: blur(5px);
filter: brightness(0.4);
filter: contrast(200%);
filter: drop-shadow(16px 16px 20px blue);
filter: grayscale(50%);
filter: hue-rotate(90deg);
filter: invert(75%);
filter: opacity(25%);
filter: saturate(30%);
filter: sepia(60%);*/

.imgA{
  position:absolute;
  height:100%;
  width:100%;
  top: 0px;
  left : 0px;
  z-index: -1;
/*  filter: contrast(200%) opacity(40%) saturate(500%) hue-rotate(40deg);*/
/*    filter: opacity(80%) hue-rotate(180deg);
    -webkit-filter: opacity(80%) hue-rotate(180deg);*/
    animation: imgAFilters 12s linear infinite alternate both;
}



@keyframes imgAFilters {
	0% {
	  filter: contrast(190%) opacity(80%) saturate(150%) hue-rotate(0deg);
	}
    10% {
	  filter: contrast(100%) opacity(100%) saturate(100%) hue-rotate(-20deg);
	}
	20% {
	  filter: contrast(200%) opacity(70%) saturate(150%) hue-rotate(-30deg);
	}
    25% {
	  filter: contrast(80%) opacity(90%) saturate(200%) hue-rotate(-10deg) invert(100%);
	}
    35% {
	  filter: contrast(80%) opacity(40%) saturate(200%) hue-rotate(60deg)invert(100%);
	}
	50% {
	  filter: contrast(400%) opacity(0%) saturate(300%) hue-rotate(0deg)invert(100%);
	}
    60% {
	  filter: contrast(1080%) opacity(30%) saturate(200%) hue-rotate(180deg)invert(100%);
	}
    70% {
	  filter: contrast(200%) opacity(30%) saturate(400%) hue-rotate(90deg)rotate(180deg)invert(100%);
	}
    80% {
	  filter: contrast(1200%) opacity(50%) saturate(300%) hue-rotate(60deg)rotate(180deg)invert(100%) ;
	}
    90% {
	  filter: contrast(1200%) opacity(80%) saturate(300%) hue-rotate(20deg);
	}
	100% {
	  filter: contrast(400%) opacity(10%) saturate(500%) hue-rotate(180deg) ;
	}
  }

/*@keyframes imgAFilters {
	0% {
	  filter: contrast(150%) opacity(80%) saturate(100%) hue-rotate(0deg);
	}
    10% {
	  filter: contrast(190%) opacity(70%) saturate(200%) hue-rotate(30deg);
	}
	20% {
	  filter: contrast(180%) opacity(90%) saturate(200%) hue-rotate(60deg);
	}
    30% {
	  filter: contrast(80%) opacity(50%) saturate(200%) hue-rotate(10deg) invert(100%);
	}
    40% {
	  filter: contrast(80%) opacity(70%) saturate(200%) hue-rotate(10deg);
	}
	50% {
	  filter: contrast(1200%) opacity(60%) saturate(300%) hue-rotate(60deg) invert(100%);
	}
    60% {
	  filter: contrast(80%) opacity(70%) saturate(200%) hue-rotate(10deg);
	}
    70% {
	  filter: contrast(200%) opacity(50%) saturate(400%) hue-rotate(90deg);
	}
    80% {
	  filter: contrast(1200%) opacity(60%) saturate(300%) hue-rotate(60deg) ;
	}
    90% {
	  filter: contrast(1200%) opacity(60%) saturate(300%) hue-rotate(20deg) invert(20%);
	}
	100% {
	  filter: contrast(400%) opacity(40%) saturate(500%) hue-rotate(180deg) invert(100%);
	}
  }*/


.imgB{
  position:absolute;
  height:100%;
  width:100%;
    top: 0px;
  left : 0px;
  z-index: -2;
/*  filter: opacity(60%) contrast(200%) saturate(500%) hue-rotate(40deg) brightness(1);*/
  animation: imgBFilters 12s linear infinite alternate both;
}

@keyframes imgBFilters {
	0% {
	  filter: contrast(50%) opacity(100%) saturate(500%) hue-rotate(10deg)invert(100%);
	}
    10% {
	  filter: contrast(800%) opacity(100%) saturate(200%) hue-rotate(20deg)invert(100%);
	}
	30% {
	  filter: contrast(800%) opacity(100%) saturate(200%) hue-rotate(10deg)invert(100%);
	}
    35% {
	  filter: contrast(800%) opacity(100%) saturate(200%) hue-rotate(0deg);
	}
    40% {
	  filter: contrast(200%) opacity(100%) saturate(200%) hue-rotate(10deg);
	}
	58% {
	  filter: contrast(120%) opacity(100%) saturate(150%) hue-rotate(-20deg);
	}
    63% {
	  filter: contrast(800%) opacity(100%) saturate(200%) hue-rotate(30deg)invert(100%);
	}
    70% {
	  filter: contrast(200%) opacity(100%) saturate(400%) hue-rotate(40deg)invert(100%);
	}
    80% {
	  filter: contrast(800%) opacity(100%) saturate(200%) hue-rotate(50deg) invert(100%);
	}
    90% {
	  filter: contrast(800%) opacity(100%) saturate(100%) hue-rotate(120deg)invert(100%);
	}
	100% {
	  filter: contrast(400%) opacity(100%) saturate(500%) hue-rotate(180deg)invert(100%);
	}
  }

/* FILTRO APROBADO -A MEJORAR VISIBILIDAD IMGB)
/*@keyframes imgBFilters {
	0% {
	  filter: contrast(50%) opacity(50%) saturate(500%) hue-rotate(10deg);
	}
    10% {
	  filter: contrast(800%) opacity(80%) saturate(200%) hue-rotate(80deg);
	}
	20% {
	  filter: contrast(800%) opacity(70%) saturate(200%) hue-rotate(10deg);
	}
    30% {
	  filter: contrast(800%) opacity(95%) saturate(200%) hue-rotate(50deg);
	}
    40% {
	  filter: contrast(800%) opacity(80%) saturate(200%) hue-rotate(10deg);
	}
	50% {
	  filter: contrast(1200%) opacity(100%) saturate(300%) hue-rotate(0deg) invert(100%);
	}
    60% {
	  filter: contrast(800%) opacity(70%) saturate(200%) hue-rotate(10deg);
	}
    70% {
	  filter: contrast(200%) opacity(100%) saturate(400%) hue-rotate(40deg);
	}
    80% {
	  filter: contrast(800%) opacity(30%) saturate(200%) hue-rotate(10deg) invert(100%);
	}
    90% {
	  filter: contrast(800%) opacity(70%) saturate(100%) hue-rotate(120deg);
	}
	100% {
	  filter: contrast(400%) opacity(90%) saturate(500%) hue-rotate(180deg);
	}
  }*/

.img2{
  position:absolute;
  height:100%;
  width:100%;
    top: 0px;
  left : 0px;
  z-index: 1;
  filter: contrast(300%) saturate(300%) opacity(18%) brightness(15) hue-rotate(90deg) ;
}

.frames{
    min-height: 47vh;
    min-width:  48vw;
    padding: 1px;
/* border: 2px dotted #0000ff;*/
    position: relative; left: 0; top: 0;
    flex-grow: 1;
    z-index: 0;
    border-radius: 5%;
}



.enter{
    /* estilo del boton
    /*font-family: 'Share Tech Mono', monospace;*/
    font-family: 'Days One', sans-serif;
    /*font-family: 'Roboto Mono', monospace;*/
/*    font-weight: bolder;*/
    font-size: 1.2rem;
    color: #000;
    padding: 0px;
/*    background-color: #15DE00; */
     background-color: #85ac4c; 
    
    border-radius: 15px 15px 15px 15px;
    text-decoration: none;
}

.enter:link, .enter:visited, .enter:active{
    font-family: 'Days One', sans-serif;
/*    font-weight: bolder;*/
    font-size: 1.2rem;
    color: #000;
    padding: 0px;
    background-color: #85ac4c;  
/*    border-radius: 15px 15px 15px 15px;*/
    text-decoration: none;
}

.enter:hover{
    font-family: 'Days One', sans-serif;

    font-size: 1.2rem;
    color: #85ac4c;
    padding: 0px;
    background-color: #000;  
/*    border-radius: 15px 15px 15px 15px;*/
    border-width: 2px;
    border-color: #85ac4c;
    border-style: solid;
    text-decoration: none;
}

.notas{
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.8rem;
    line-height: 150%;
}
    .logoHeaderMovil{
        display: none;
    }

/* media query */

@media (max-width:768px){
    
    header {
    width: 90vw;
    padding-bottom: 1rem;    
        
}
    
    header nav a {
/*	padding:8px;*/
   	font-size: 1.2rem;
        line-height: 200%;
        
}
    
    header nav {
    width: 100%;
    margin-top: 1rem;
        height: auto;
}
    
    .contendedorMenu{
    width: 90vw;
    padding: 0px;
    background-color: #85ac4c;
padding-top: 0.5rem;
    text-align: center;
    border-radius: 0px 0px 25px 25px;
}
    
    .logoHeader{
        display: none;
    }
    
    .logoHeaderMovil{
        display:block;
        width: 100%;
        height: auto;
        max-width: 434px;
        margin: auto;
         }  
    
        .paginaHome{
            width: 98%;
        }    
        
    .contendedorHome{
        padding: 4px;
    }
    
    .frameHome{
            /* caja del frame de home */
    margin:0px auto;
    width: 90vw;
    height: 60vh;
    border-radius: 5%;
    padding: 0px;
    left: 0vw; 
    flex-grow: 1;
    z-index: 0;
    }
    
    .feedHome{
        width: 98%;
    }
    
    .enter{
    border-radius: 15px 0px 15px 0px;
}
    .epochFeedX1{
        font-size: 11vw;
    }
    .clockFeedX1 {
        width: 98vw;
    }
    
    .contendedorTextoDoble{
           flex-wrap: wrap; 
        
    }
    
    .textoBilingue{
        width: 98%;
      }  
    
    .contenedorObjeto{
         flex-wrap: wrap;   
          width: 98%;  
        }
    
    .objeto{
        width: 100%;
    }
        
    
}