@charset "utf-8";
/* CSS Document */
			html {
				background: url('../imgs/fondo.jpg') no-repeat center center fixed;
				-webkit-background-size: cover;
				-moz-background-size: cover;
				-o-background-size: cover;
				background-size: cover;
				width: 100%;
				height:100%;
				background-color:#000;
				
				font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
			}
			
			/*
			.container{
				position: absolute;
				left: 50%;
				top: 60%;
				transform: translate(-50%, -50%);
				-webkit-transform: translate(-50%, -50%);
			}
			*/
			
			.container{
				width:auto;
				margin: 0 auto;
				position:relative;
				left: 40%;
			}
			
			#box{
				margin-top: -40px;
				width: 310px;
			}
			
			h1{			
				font-size:53px;
				color:#FFFFFF;
				padding-top:5px;
				font-weight:bold;
				letter-spacing:-5px;
				margin-bottom: -23px;
			}
			
			h2{
				font-size:25px;
				color:#FFFFFF;
				padding-top:5px;
				font-weight:bold;
				letter-spacing:-1px;
				text-align: right
			}
			
			p{
				font-size: 18px;
				color:white;
				font-weight: bold;
			}
			
			p a, .modal a {
				font-size:14px;
				color:#FFFFFF;
				padding-top:5px;
				letter-spacing:-1px;
				font-weight:bolder;
				text-decoration: none;
			}
			
			p a.btn,.modal a.btn {
			  color: #fff;
			  background: #FF0066;
			  padding: .5rem 1rem;
			  display: inline-block;
			  border-radius: 4px;
			  transition-duration: .25s;
			  border: none;
			  font-size: 14px;
			  text-decoration: none;
			  margin: 5px;
			}
			
			p a.btn:hover,.modal a.btn:hover {
			  background: #22272a;
			  text-decoration: none;
			}
	
			 .modal p {
				font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
				font-size:14px;
				color:#2F2E2E;
				padding-top:5px;
				font-weight:bolder;
			 }

			 .modal p strong{
				 color: red;
			 }
			
			p #counter{
				font-size:22px;
				color:#DBDBDB;
				font-weight:bold;
				letter-spacing:-5px;	
			}
	
			.subtitulo #counter {
				font-size:22px;
				color:#FFFFFF;
				padding-top:5px;
				font-weight:bold;
				letter-spacing:-1px;
				text-align:center;
				margin:0px;
			}
			
			footer{
				font-size:16px; 
				height: 100px;
    			margin: auto;
			}
			
			 /* Smartphones (portrait and landscape) ----------- */
			@media only screen
			and (min-device-width : 320px)
			and (max-device-width : 480px) {
			/* Styles */
				.container{
					left: 28%;
				}
				h1{
					font-size:40px; 
				}
				h2{
					font-size:20px;
				}
				#box{
					width: 210px;
					text-align: center;
				}
				p{
					font-size: 13px;
				}
				p #counter,.subtitulo #counter{
					font-size:17px;
				}
				footer{
					font-size:11px; 
				}
			}
			/* Smartphones (landscape) ----------- */
			@media only screen
			and (min-width : 321px) {
			/* Styles */
				.container{
					left: 28%;
				}
				h1{
					font-size:40px; 
				}
				h2{
					font-size:20px;
				}
				#box{
					width: 210px;
					text-align: center;
				}
				p{
					font-size: 13px;
				}
				p #counter,.subtitulo #counter{
					font-size:17px;
				}
				footer{
					font-size:11px; 
				}
			}
			/* Smartphones (portrait) ----------- */
			@media only screen
			and (max-width : 320px) {
			/* Styles */
				.container{
					left: 28%;
				}
				h1{
					font-size:40px; 
				}
				h2{
					font-size:20px;
				}
				#box{
					width: 210px;
					text-align: center;
				}
				p{
					font-size: 13px;
				}
				p #counter,.subtitulo #counter{
					font-size:17px;
				}
				footer{
					font-size:11px; 
				}
			}
			/* iPads (portrait and landscape) ----------- */
			@media only screen
			and (min-device-width : 768px)
			and (max-device-width : 1024px) {
			/* Styles */
				.container{
					left: 28%;
				}
				h1{
					font-size:45px; 
				}
				h2{
					font-size:25px;
				}
				#box{
					width: 240px;
					text-align: center;
				}
				p{
					font-size: 12px;
				}
				p #counter,.subtitulo #counter{
					font-size:15px;
				}
				footer{
					font-size:10px; 
				}
			}
			/* iPads (landscape) ----------- */
			@media only screen
			and (min-device-width : 768px)
			and (max-device-width : 1024px)
			and (orientation : landscape) {
			/* Styles */
			}
			/* iPads (portrait) ----------- */
			@media only screen
			and (min-device-width : 768px)
			and (max-device-width : 1024px)
			and (orientation : portrait) {
			/* Styles */
			}
			/* Desktops and laptops ----------- */
			@media only screen
			and (min-width : 1224px) {
			/* Styles */
				.container{
					left: 43%;
				}
				h1{
					font-size:53px;
				}
				#box{
					width: 310px;
				}
			}
			/* Large screens ----------- */
			@media only screen
			and (min-width : 1824px) {
			/* Styles */
				.container{
					left: 43%;
				}
				h1{
					font-size:53px;
				}
				#box{
					width: 310px;
				}
			}
			/* iPhone 4 ----------- */
			@media
			only screen and (-webkit-min-device-pixel-ratio : 1.5),
			only screen and (min-device-pixel-ratio : 1.5) {
			/* Styles */
			}