@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: 'AndaleMono';
    src: url('../fonts/andale-mono/AndaleMono.eot');
    src: url('../fonts/andale-mono/AndaleMono.eot?#iefix') format('embedded-opentype'),
        url('../fonts/andale-mono/AndaleMono.woff2') format('woff2'),
        url('../fonts/andale-mono/AndaleMono.woff') format('woff'),
        url('../fonts/andale-mono/AndaleMono.ttf') format('truetype'),
        url('../fonts/andale-mono/AndaleMono.svg#AndaleMono') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
/*
@font-face {
    font-family: 'Monument Extended';
    src: url('/fonts/monument/MonumentExtended-Ultrabold.eot');
    src: url('/fonts/monument/MonumentExtended-Ultrabold.eot?#iefix') format('embedded-opentype'),
        url('/fonts/monument/MonumentExtended-Ultrabold.woff2') format('woff2'),
        url('/fonts/monument/MonumentExtended-Ultrabold.woff') format('woff'),
        url('/fonts/monument/MonumentExtended-Ultrabold.ttf') format('truetype'),
        url('/fonts/monument/MonumentExtended-Ultrabold.svg#MonumentExtended-Ultrabold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
*/

@font-face {
    font-family: 'Monument Extended';
    src: url('../fonts/monument/MonumentExtended-Regular.eot');
    src: url('../fonts/monument/MonumentExtended-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/monument/MonumentExtended-Regular.woff2') format('woff2'),
        url('../fonts/monument/MonumentExtended-Regular.woff') format('woff'),
        url('../fonts/monument/MonumentExtended-Regular.ttf') format('truetype'),
        url('../fonts/monument/MonumentExtended-Regular.svg#MonumentExtended-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



html, body {
    background-image: url(../images/back.png);
    background-size: auto;
    background-repeat: repeat;
    background-color: #e8e8e8!important;
    overflow-x: hidden;
}

#contenedor-dos {
    margin-top: 30px;
}

.marquesina-uno {
    font-family: 'AndaleMono';
    background-color: #000000;
    color: #ffffff;
    font-size: 11px;
}

.uno {
	width:auto;
	height: 60px
}

.dos {
	width:auto;
	height: 60px;
	float:right;
}

.tres {
    width: 100%;
    height: auto;
    max-width: 550px;
}

.cuatro {
    width: 400px;
    height: auto;
    float: right;
}

.cinco {
    width: 100%;
    height: auto;
    margin: 50px auto 0;
}
.cinco-b {
    width: 100%;
    height: auto;
    margin: 10px auto 120px;
}

.seis {
    width: 100%;
    height: auto;
    max-width: 550px;
}

.siete {
    width: 70px;
    height: auto;
}

.ocho {
    max-width: 2000px;
    height: auto;
    margin: 0px auto 140px;
    display: block;
    width: 90%;
}

.nueve {
    width: 90%;
    height: auto;
    margin-bottom: 200px;
}

.diez {
	max-width: 400px;
    width:100%;
    height: auto;
    float: right;
    margin-top: 150px;
}
.once {
    width: 115px;
    height: auto;
    left: 0;
    position: absolute;
    bottom: 100px;
}

.doce {
    width: 70px;
    height: auto;
    position: absolute;
    right: 0;
    bottom: 0;
}

.trece {
    width: 100%;
    height: auto;
}

.catorce {
    float: left;
    width: 50px;
    height: auto;
}

.quince {
    max-width: 1200px;
    width: 100%;
    height: auto;
    margin-top: 100px;
    display: block;
}
.dieciseis {
    max-width: 400px;
    width: 100%;
    height: auto;
    margin-top: 60px;
    display: block;
}

.diecisiete {
    max-width: 400px;
    width: 100%;
    height: auto;
    margin-top: 60px;
    display: block;
}

.dieciocho {
    max-width: 700px;
    width: 100%;
    height: auto;
    display: block;
    margin: 30px 0;
    float: left;
}

.diecinueve {
    max-width: 50px;
    width: 100%;
    height: auto;
    margin: 35px 0 0;
    float: right;
}
.veinte {
	max-width: 1200px;
    width: 100%;
    height: auto;
    margin: 26px 0 20px;
}

.veintiuno {
	max-width: 1000px;
    width: 100%;
    height: auto;
    margin: 26px 0 20px;
}

.veintidos {
    max-width: 900px;
    width: 100%;
    height: auto;
    padding-left: 150px;
}
.veintitres {
	max-width: 1500px;
    width: 100%;
    height: auto;
    margin:50px 0;
}

.veinticuatro {
	max-width: 700px;
    width: 100%;
    height: auto;
    margin:0 150px 250px 0;
	float: right
}

#bloque-dos {
	    float: right;
    display: grid;
    width: fit-content;
}

.bloque-linea {
	border-bottom: solid 2px #000000;
}

#bloque-negro {
    background-color: #000000;
    margin-top: 100px;
}

.txt-01 {
    font-family: 'Monument Extended';
    font-size: 60px;
    color: #000000;
    margin-bottom: 0;
    margin-top: 20px;
	tex-align:left;
}

.txt-02 {
    font-family: 'Monument Extended';
    font-size: 180px;
    color: #000000;
    margin-top: 0;
    margin-bottom: 0px;
    line-height: 141px;
}

.txt-03 {
    font-family: 'Monument Extended';
    font-size: 180px;
    color: #000000;
    margin-top: -55px;
    margin-bottom: 0;
    text-align: right;
}

.txt-04 {
    font-family: 'Monument Extended';
    font-size: 60px;
    color: #000000;
    margin-bottom: 120px;
    text-align: right;
    margin-top: -75px;
}

.ocho-mobile {
		display:none;
	}

.nueve-m {
	display:none;
}

.trece-m {
		display:none;
	}

.marquesina-dos {
    background-color: #000000;
}

.txt-marquesina{
    font-family: 'AndaleMono';
    color: #ffffff;
    font-size: 11px;
	width: max-content;

  /* animation properties */
  -moz-transform: translateX(100%);
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  
  -moz-animation: my-animation-tres 100s linear infinite;
  -webkit-animation: my-animation-tres 100s linear infinite;
  animation: my-animation-tres 100s linear infinite;
}

/* for Firefox */
@-moz-keyframes my-animation-tres {
  from { -moz-transform: translateX(0%); }
  to { -moz-transform: translateX(100%); }
}

/* for Chrome */
@-webkit-keyframes my-animation-tres {
  from { -webkit-transform: translateX(0%); }
  to { -webkit-transform: translateX(-100%); }
}

@keyframes my-animation-tres {
  from {
    -moz-transform: translateX(0%);
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }
  to {
    -moz-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }

}



@keyframes flecha
	{
	0%   {bottom:30px;}
	50% {bottom:50px;}
	100% {bottom:30px;}
	}
@-webkit-keyframes flecha
	{
	0%   {bottom:30px;}
  	50% {bottom:50px;}
	100% {bottom:30px;}
  }

.flecha {
  width: 30px;
  height: auto;
  position: absolute;
  left: 50%;
  margin-left: -18px;
  animation-name:flecha;
  animation-duration:1.7s;
  animation-timing-function:ease-in-out;
  animation-delay:0s;
  animation-iteration-count:infinite;
  animation-direction:normal;
  animation-play-state:running;
  -webkit-animation-name:flecha;
  -webkit-animation-duration:1.7s;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-delay:0s;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-direction:normal;
  -webkit-animation-play-state:running;
}


@keyframes flecha-dos
	{
	0%   {bottom:30px;}
	50% {bottom:50px;}
	100% {bottom:30px;}
	}
@-webkit-keyframes flecha-dos
	{
	0%   {bottom:30px;}
  	50% {bottom:50px;}
	100% {bottom:30px;}
  }

.flecha-dos {
  width: 30px;
  height: auto;
  position: absolute;
  left: 50%;
  margin-left: -18px;
  animation-name:flecha-dos;
  animation-duration:1.7s;
  animation-timing-function:ease-in-out;
  animation-delay:0s;
  animation-iteration-count:infinite;
  animation-direction:normal;
  animation-play-state:running;
  -webkit-animation-name:flecha-dos;
  -webkit-animation-duration:1.7s;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-delay:0s;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-direction:normal;
  -webkit-animation-play-state:running;
}


.centro {
    width: 25%;
    height: auto;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    bottom: 0;
    margin-right: auto;
}










@media screen and (max-width: 992px) {
	.uno {
    width: auto;
    height: 60px;
    margin-bottom: -24px;
    margin-left: -15px;
}
	#contenedor-dos {
    margin-top: 0;
}
	.cuatro {
		display: none;
	}
	
	.txt-01 {
    font-size: 32px;
    margin-top: 0;
}
	.txt-02 {
    font-size: 90px;
    margin-top: -39px;
    margin-bottom: -39px;
}
	.txt-03 {
    font-size: 90px;
    margin-top: -28px;
    margin-bottom: 0;
}
	.txt-04 {
    font-size: 32px;
    margin-bottom: 0;
    margin-top: -44px;
}
	.siete {
    width: 40px;
    float: left;
}
	.doce {
    width: 40px;
    position: relative;
    float: right;
}
	.ocho {
		display:none;
	}
	
	.ocho-mobile {
    display: block;
    margin: 70px auto 40px;
}
	
		.once {
		display:none;
	}
	
	.diez {
    margin-top: 30px;
    max-width: 200px;
}
	
	.nueve {
		display:none;
	}
	.nueve-m {
    display: block;
    width: 100%;
    height: auto;
    margin-bottom: 60px;
}
	
	.trece {
		display:none;
	}
	
	.trece-m {
		display:block;
		
	}
	
	.catorce {
    margin-top: -70px;
}
	
	.cinco-b {
    margin: 10px auto 60px;
}
	
.flecha {
    width: 25px;
    position: relative;
    left: auto;
    margin: 15px auto 0;
    display: block;
}
	
.cinco {
    margin: 0 auto;
}
	
	
.flecha-dos {
    width: 25px;
}
	.veintidos {
    padding-left: 50px;
    padding-right: 20px;
}

	.veintitres {
    margin: 20px 0;
}
	.veinticuatro {
    margin: 0 0 50px 0;
}
	.quince {
    margin-top: 40px;
}
	.dieciseis {
    margin-top: 15px;
    margin-bottom: 15px;
}
	
	.columnas-uno {
    width: 50%!important;
    display: contents;
}
	
	.diecisiete {
    width: 50%;
    margin-top: 0;
    padding: 0 10px;
}
	.noview {
		display:none;
	}
	
	#bloque-negro {
    margin-top: 50px;
}
	
	.diecinueve {
    display: none;
}
	
	.veinte {
    margin: 16px 0 0;
}
	.veintiuno {
    margin: 10px 0 15px;
}
	
	
	
	
	
	
	
	
	
	
	
}














