@charset "utf-8";

@font-face {
	font-family: 'ProximaNova-Black';
    src: url('fonts/ProximaNova-Black.eot');
    src: url('fonts/ProximaNova-Black.eot?#iefix') format('embedded-opentype'),
         url('fonts/ProximaNova-Black.woff') format('woff'),
         url('fonts/ProximaNova-Black.ttf') format('truetype'),
         url('fonts/ProximaNova-Black.svg#ProximaNova-Black') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: 'ProximaNova-Bold';
    src: url('fonts/ProximaNova-Bold.eot');
    src: url('fonts/ProximaNova-Bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/ProximaNova-Bold.woff') format('woff'),
         url('fonts/ProximaNova-Bold.ttf') format('truetype'),
         url('fonts/ProximaNova-Bold.svg#ProximaNova-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: 'ProximaNova-Extrabold';
    src: url('fonts/ProximaNova-Extrabold.eot');
    src: url('fonts/ProximaNova-Extrabold.eot?#iefix') format('embedded-opentype'),
         url('fonts/ProximaNova-Extrabold.woff') format('woff'),
         url('fonts/ProximaNova-Extrabold.ttf') format('truetype'),
         url('fonts/ProximaNova-Extrabold.svg#ProximaNova-Extrabold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: 'ProximaNova-Light';
    src: url('fonts/ProximaNova-Light.eot');
    src: url('fonts/ProximaNova-Light.eot?#iefix') format('embedded-opentype'),
         url('fonts/ProximaNova-Light.woff') format('woff'),
         url('fonts/ProximaNova-Light.ttf') format('truetype'),
         url('fonts/ProximaNova-Light.svg#ProximaNova-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: 'ProximaNova-Semibold';
    src: url('fonts/ProximaNova-Semibold.eot');
    src: url('fonts/ProximaNova-Semibold.eot?#iefix') format('embedded-opentype'),
         url('fonts/ProximaNova-Semibold.woff') format('woff'),
         url('fonts/ProximaNova-Semibold.ttf') format('truetype'),
         url('fonts/ProximaNova-Semibold.svg#ProximaNova-Semibold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
		font-family: 'ProximaNova-Black';
		src: url('fonts/ProximaNova-Black.svg') format('svg');
	}
	@font-face {
		font-family: 'ProximaNova-Bold';
		src: url('fonts/ProximaNova-Bold.svg') format('svg');
	}
	@font-face {
		font-family: 'ProximaNova-Light';
		src: url('fonts/ProximaNova-Light.svg') format('svg');
	}
	@font-face {
		font-family: 'ProximaNova-Extrabold';
		src: url('fonts/ProximaNova-Extrabold.svg') format('svg');
	}
	@font-face {
		font-family: 'ProximaNova-Semibold';
		src: url('fonts/ProximaNova-Semibold.svg') format('svg');
	}
}

/*===================================================================================*/
/*  RESET                                                                            */ 
/*===================================================================================*/

    * { outline: 0; -webkit-font-smoothing: antialiased; }
    body { line-height: 1; }
    ol, ul { list-style: none; }
    blockquote, q { quotes: none; } 
    input[type=submit] { -webkit-appearance: none; }
    table { border-collapse: separate; border-spacing: 0; }
    caption, th, td { text-align: left; font-weight: normal; }
    blockquote:before, blockquote:after, q:before, q:after { content: ""; }
    article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
    *, *:before, *:after {  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code, del, 
    dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; }
	
	::selection{ color:#FFF; background-color:rgba(0,0,0,0.3); }
    ::-moz-selection{ color:#FFF; background-color:rgba(0,0,0,0.3); }
	
	html, body{ height:100%; min-height:100%; width:100%; }
	body{
		color: #fff;
		background-color:#000;
		*background-image:url(../img/poster-video.jpg);
		background-size:cover;
		background-repeat:no-repeat;
	}

	#video_background 		{ position:fixed; bottom:0px; right:0px; min-width:100%; min-height:100%; max-height:4000%; max-width:1000%; width:auto; height:auto; z-index:-1000; overflow:hidden; *background-image:url(../img/poster-video.jpg);
		background-size:cover;
		background-repeat:no-repeat; }
	.overlay_filter			{ background-image:url(../img/pattern.png); width:100%; height:100%; position:fixed; top:0px; left:0px; z-index:-999;}
	
	.wrapper				{ height:100%; min-height:430px; width:100%; display:table; position:relative; }
	.wrapper .content 		{ text-align:center; display:table-cell; vertical-align:middle; height:100%; width:100%; }
	.wrapper .content .logo	{ *margin-top:-100px; }
	
	.wrapper,
	#video_background{ 
		-webkit-transition: all 0.4s ease 0s;
           -moz-transition: all 0.4s ease 0s;
             -o-transition: all 0.4s ease 0s;
                transition: all 0.4s ease 0s;
		 -webkit-transform: translate3d(0px, 0px, 0px);
			-moz-transform: translate3d(0px, 0px, 0px);
			  -o-transform: translate3d(0px, 0px, 0px);
				 transform: translate3d(0px, 0px, 0px);
	}
	
	.wrapper.open,
	#video_background.open{
		-webkit-transform: translate3d(-300px, 0px, 0px);
		   -moz-transform: translate3d(-300px, 0px, 0px);
             -o-transform: translate3d(-300px, 0px, 0px);
				transform: translate3d(-300px, 0px, 0px);
	}
	
	.logo					{ 
								margin-top:-100px; 
							}
	.logo.black	path		{ fill:#000 !important; }
	.logo.white	path		{ fill:#FFF !important; }
	
	
	.box-code									{ display:none; width:80%; text-align:center; margin:0px auto; height:auto; *border:1px solid red; padding:0px 0px; padding-top:20px; }
	.box-code input[type=text]					{ border:0px; background:transparent; width:100%; text-transform:uppercase; font-size:64px; margin:35px auto; font-family:'ProximaNova-ExtraBold',Arial, Helvetica, sans-serif; color:#FFF; text-align:center; }
	.box-code input[type=button].access			{ font-family:'ProximaNova-Bold',Arial, Helvetica, sans-serif; font-size:14px; color:#FFF; background:transparent; border:1px solid #FFF; padding:15px 30px; display:inline-block; margin-right:20px; cursor:pointer; }
	.box-code input[type=button].access:hover	{ border:1px solid #FFF; }
	.box-code input[type=button].cancel			{ font-family:'ProximaNova-Bold',Arial, Helvetica, sans-serif; font-size:14px; color:rgba(255,255,255,0.5); border:0px solid #FFF; padding:15px 30px; display:inline-block; background:transparent; cursor:pointer; }
	
	
	.box-frase				{ display:block; width:80%; text-align:center; margin:0px auto; height:auto; *border:1px solid red; padding:0px 0px; }
	.box-frase				{ border:0px; background:transparent; width:100%; text-transform:uppercase; font-size:80px; margin:35px auto; font-family:'ProximaNova-ExtraBold',Arial, Helvetica, sans-serif; color:#FFF; text-align:center; }
	
	
	.box-controller			{ width:50px; height:50px; position:absolute; left:50%; margin-left:-25px; bottom:80px; background-image:url(../img/bg-controller.svg); background-repeat:no-repeat; }
	.controller				{ width:17px; height:15px; cursor:pointer; background-image:url(../img/sound.png); background-repeat:no-repeat; background-position:center center; margin:17px auto; }
	.controller.on			{ background-position:0px 0px; }
	.controller.off			{ background-position:-17px 0px; }
	
	.box-buttons			{ display:block; text-align:center; width:100%; *border:1px solid red; cursor:pointer; margin:0px auto; font-family:'ProximaNova-Bold',Arial, Helvetica, sans-serif; font-size:13px; color:#FFF; position:absolute; bottom:170px; left:0px; }
	.box-buttons div		{ opacity:0.3; display:inline-block; margin-right:15px; border:2px solid #FFF; white-space:nowrap; height:50px; width:150px; line-height:50px; }
	.box-buttons div:last-child	{ margin-right:0px; }
	.box-buttons div:hover	{ opacity:1; }
	
	/*.footer::before			{ content:' '; height:1px; width:30px; display:block; background-color:#FFF; margin:0px auto; margin-bottom:20px; }*/
	.footer					{ width:100%; height:45px; margin:0px auto; position:absolute; bottom:2px; left:0px; }
	.footer .copyright		{ width:100%; }
	.footer .copyright		{ display:inline-block; vertical-align:top; line-height:20px; text-align:center; font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif; font-size:14px; color:rgba(255,255,255,0.47); }
	
	.footer	a				{ text-decoration:none; color:inherit !important; }
	.footer .grey			{ color:rgba(255,255,255,0.3); }
	
		
	
	.wrapper-contact						{ background-color:#000; width:300px; height:100%; display:block; position:fixed; right:0px; top:0px; }
	.wrapper-contact .inner					{ display:table; width:70%; height:100%; min-height:700px; margin:0px auto; }
	.wrapper-contact .inner .cell			{ display:table-cell; vertical-align:middle; text-align:center; width:100%; }
	.wrapper-contact .inner .cell .title	{ font-family:'ProximaNova-ExtraBold',Arial, Helvetica, sans-serif; color:#FFF; font-size:30px; padding-bottom:30px; }
	.wrapper-contact .inner .cell .label	{ font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif; color:#535353; font-size:13px; padding:8px 0px; }
	
	.wrapper-contact .inner .cell .data:before	{ content:' '; height:1px; width:30px; display:block; background-color:#FFF; margin:0px auto; margin-bottom:20px; }
	.wrapper-contact .inner .cell .data		{ text-align:center; font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif; font-size:14px; line-height:20px; }
	.wrapper-contact .inner .cell .data a	{ font-family:'ProximaNova-Bold',Arial, Helvetica, sans-serif; color:#FFF; text-decoration:none; }
	
	.closeContact	{ position:absolute; top:20px; right:20px; cursor:pointer; width:16px; opacity:0.6; }
	
	.wrapper-contact{ 
		-webkit-transition: all 0.4s ease 0s;
           -moz-transition: all 0.4s ease 0s;
             -o-transition: all 0.4s ease 0s;
                transition: all 0.4s ease 0s;
		 -webkit-transform: translate3d(300px, 0px, 0px);
			-moz-transform: translate3d(300px, 0px, 0px);
			  -o-transform: translate3d(300px, 0px, 0px);
				 transform: translate3d(300px, 0px, 0px);
	}
	
	.wrapper-contact.open{
		 -webkit-transform: translate3d(0px, 0px, 0px);
			-moz-transform: translate3d(0px, 0px, 0px);
			  -o-transform: translate3d(0px, 0px, 0px);
				 transform: translate3d(0px, 0px, 0px);
	}
	
	
	
	.wrapper-contact input[type=text]			{ background-color:transparent; text-align:center; padding:8px 0px; font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif; border:none; border-bottom:1px solid #333; color:#FFF; margin-bottom:25px; width:100%; font-size:13px; }
	.wrapper-contact input[type=submit]			{ background-color:transparent; cursor:pointer; text-align:center; padding:12px 20px; font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif; border:1px solid #333; color:rgba(255,255,255,0.6); margin:0px auto; margin-bottom:25px; width:auto; font-size:13px; }
	.wrapper-contact input[type=submit]:hover	{ color:rgba(255,255,255,1); border:1px solid #666; }
	.wrapper-contact textarea					{ background-color:transparent; text-align:center; padding:8px; font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif;  border:1px solid #333; color:#FFF; margin-bottom:25px; width:100%; height:80px; max-height:80px; min-height:80px; font-size:13px; }
	
	.wrapper-contact input::-webkit-input-placeholder,
    .wrapper-contact textarea::-webkit-input-placeholder {
        font-size: 13px;
        color: #999;
        text-transform: uppercase;
    }

    .wrapper-contact input::-moz-placeholder,
    .wrapper-contact textarea::-moz-placeholder {
        font-size: 13px;
        color: #999;
        text-transform: uppercase;
    }

    .wrapper-contact input:-moz-placeholder,
    .wrapper-contact textarea:-moz-placeholder {
        font-size: 13px;
        color: #999;
        text-transform: uppercase;
    }

    .wrapper-contact input:-ms-input-placeholder,
    .wrapper-contact textarea:-ms-input-placeholder { 
        font-size: 13px;
        color: #999;
        text-transform: uppercase;
    }
	
	
	/** INPUT CODE **/
	.box-code input::-webkit-input-placeholder,
    .box-code textarea::-webkit-input-placeholder {
        color:rgba(255,255,255,0.2);
        text-transform: uppercase;
    }

    .box-code input::-moz-placeholder,
    .box-code textarea::-moz-placeholder {
        color:rgba(255,255,255,0.2);
        text-transform: uppercase;
    }

    .box-code input:-moz-placeholder,
    .box-code textarea:-moz-placeholder {
        color:rgba(255,255,255,0.2);
        text-transform: uppercase;
    }

    .box-code input:-ms-input-placeholder,
    .box-code textarea:-ms-input-placeholder { 
        color:rgba(255,255,255,0.2);
        text-transform: uppercase;
    }	
	
	/* FX */	
	.transition	{
		-webkit-transition: all 0.4s ease 0s;
           -moz-transition: all 0.4s ease 0s;
             -o-transition: all 0.4s ease 0s;
                transition: all 0.4s ease 0s;
	}
	
	/*===================================================================================*/
	/*  CONTACTO: VALIDACION                                                             */ 
	/*===================================================================================*/
	
	label.error{
		width:100%;
		display:block;
		text-align:center;
		margin-bottom:30px;
		margin-top:0px;
		color:#F00;
		font-size:11px;
		font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif;
	}
	.msgOK{ display:none; width:100%; height:50px; color:#FFF; font-size:13px !important; margin:0px auto; font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif; }
	.msgError{ display:none; width:100%; height:50px; color:#F00; font-size:13px !important;  margin:0px auto; font-family:'ProximaNova-Light',Arial, Helvetica, sans-serif; }
	.loader{ margin:0px auto; margin-bottom:15px; display:none; }
	
	

	
	/* TABLET PORTRAIT */	
	@media only screen and (min-width : 690px) and (max-width : 1024px) { 
		
		#video_background 		{ position:absolute; }
		.logo					{ margin-top:-75px; }
		
		.wrapper				{ min-height:100%; width:100%; display:table; position:relative; }
		.wrapper .content 		{ text-align:center; display:table-cell; vertical-align:middle; height:100%; width:100%; }
	
		.btn-contact			{ bottom:100px; border:1px solid rgba(255,255,255,0.3); padding:16px 12px; width:160px; margin-left:-80px; }
		.btn-contact:after		{ display:none; }
		

		
	}
	
	/* MOBILE LANDSCAPE */
	@media only screen and (max-width : 690px) {
		
		#video_background 		{ display:none; }
		.logo					{ margin-top:-75px; }
		
		.wrapper				{ min-height:350px; height:100%; width:100%; display:table; position:relative; }
		.wrapper .content 		{ text-align:center; display:table-cell; vertical-align:middle; height:100%; width:100%; }
	
		.btn-contact			{ bottom:80px; border:1px solid rgba(255,255,255,0.3); padding:16px 12px; width:160px; margin-left:-80px; }
		.btn-contact:after		{ display:none; }
		
		.box-controller			{ display:none; }
		
		.box-buttons					{ bottom:50px; }
		.box-buttons div				{ display:block; margin:0px auto; margin-bottom:15px; }
		.box-buttons div:last-child		{ margin:0px auto; }
		
		.box-code										{ padding-top:0px; }
		.box-code input[type="text"]					{ font-size:34px; margin:25px auto; }
		.box-code input[type="button"].access			{ display:block; margin:0px auto; margin-bottom:15px; }
		.box-code input[type="button"].cancel			{ display:block; margin:0px auto; }
		
		.footer					{ display:none; }
		
	}