html, body{overflow-x: hidden;}
body{margin:0 auto; font-family: 'Roboto', sans-serif;}
.clear{clear: both}
*{-webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box;}

header{z-index: 99999;background: rgba(51,51,51,0.75); width: 100%; position: fixed}
.container{width: 90%; margin: 0 auto}
.logo{float:left; margin-top: 5px; height:70px }
nav{float:right}
nav li{display: inline-block}
ul, li{list-style: none; margin: 0; padding: 0}
nav a{display: block; text-decoration: none; text-transform: uppercase; color: #fff; font-size: 16px; letter-spacing: 1px; padding: 20px; transition: all 0.5s ease 0.1s; 
height: 50px; line-height: 50px}



/* Forward */
.hvr-forward {
  display: inline-block; 
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-forward:hover, .hvr-forward:focus, .hvr-forward:active {
  -webkit-transform: translateX(8px); color:#ff5015;
  transform: translateX(8px);
}


/*menu hamburguesa */
#nav-mobile{
    display: none;
    background: url(../images/nav.png) no-repeat center center;
    float: right;
    width: 60px;
    height: 60px;
    position: absolute;
    right: 80px;
    top:0px;
    opacity: .6;
}
#nav-mobile.nav-active{
        opacity: 1;
    }
/*menu hamburguesa*/


.idioma{float:right; margin-top: 32px; margin-left: 20px }
.idioma li{display:inline-block}
.idioma a{display:block; background: url(../images/idioma.png); width:24px; height:24px}

.español:hover{background-position: 0 24px}

.idioma .english{background-position: 24px 0}
.english:hover{background-position: 24px 24px}

.idioma span{display: none}

section{height: 100%;overflow-x: hidden;}
.parallax-window{width: 100%; height: 100%}  
#home , #hacemos, #eventos , #marketing {z-index: 0;display: table; display: inline-block;width: 100%;    float: left;}
.texto{display: inline-block;vertical-align: middle;width: 100%;padding: 14% 0;z-index: 1;}
#hacemos .texto{padding: 9% 0;}
#home .texto {padding: 20% 0;}

#home p {font-size:70px }
#video{position: absolute; z-index:-1000; overflow: hidden; top:35%; left:50%; transform: translateX(-50%) translateY(-50%); webkit-transform: translateX(-50%) translateY(-50%)}


p{font-family: 'Work Sans', sans-serif; margin: 0 auto; text-align: center; font-size: 58px; color: white}
.p0{font-size:28px; padding-top:30px; font-weight:200 }
.p1{font-size:18px; padding-top:30px; line-height:30px}


#hacemos{background: white}
#hacemos .tit{font-size:60px; padding-bottom:100px; text-transform:uppercase; color:#ff5015}
h2 {font-family: 'Work Sans', sans-serif; margin: 0 auto; text-align: center; font-size: 38px; font-weight:200; padding-bottom:70px; color: #ff5015}
#hacemos p{font-size:24px; color: #333333; line-height:38px}


#contacto{background-color: #333333;  padding-top: 60px; padding-bottom:50px; margin:0 auto; text-align:center;    display: inline-block;width: 100%;}
.container2{width:60%; margin: 0 auto; text-align:center}
#contacto img{height:25px}
#contacto li{display: inline-block; width: 22%; vertical-align:top}
#contacto a{text-decoration:none}
#contacto p{ font-family: 'Roboto', sans-serif; font-size:13px; font-weight:300; color:#fff; letter-spacing:2px ; padding-top:10px}


footer{background-color:#f2f2f2; padding-top:50px; padding-bottom:50px; text-align:center}
footer img{width:240px}
footer p{font-family: 'Roboto', sans-serif; color:#333; text-align:center; font-size:12px; padding-top:20px}

.boton-top{background: rgba(255,80,21,0.85); color: #f2f2f2; font-size: 20px; padding:10px; cursor: pointer; position:fixed; bottom: 0;right:0;}


/*MEDIA QUERIS*/
@media only screen and (max-width: 1200px) { /*TAMAÑO INTERMEDIO*/
    .container{width: 100%; margin: 0 auto}
    .logo{height: 60px; float:left; margin-top: 15px}
    nav{float:right}
    nav li{display: inline-block}
    ul, li{list-style: none; margin: 0; padding: 0}
    nav a{display: block; text-decoration: none; text-transform: uppercase; color: #fff; font-size: 14px; letter-spacing: 1px; padding: 20	2 5px; transition: all 0.5s ease 0.1s;}

    .container2 {width: 100%;}

}



@media only screen and (max-width: 900px) { /*TAMAÑO TABLET*/
	.logo{height: 50px; margin: 0 0}
    #nav-mobile{display: block;}
    #menu{
        width: 100%;
        float:none;
        padding-top: 60px;
    }
    #menu ul{
            box-shadow: 0 1px 2px rgba(0,0,0,.5);
            max-height: 0;
            overflow: hidden;
                width: 100%;
        }
    #menu li{
            border-bottom: 1px solid #fff;
            display:block;
            }
    #menu li:last-child{ border-bottom: 0;}
    #menu li a{
    		padding: 15px 0;
            height: auto;
            line-height: normal;
            margin-left: 30px
                }
    #menu ul.open-menu{
            max-height: 400px;
            transition: max-height .4s;
        }
		
   .idioma{margin-top:17px}   
	
	p{font-family: 'Work Sans', sans-serif; margin: 0 auto; text-align: center; font-size: 50px; color: white}
	#hacemos .tit{font-size:40px; padding-bottom:60px; text-transform:uppercase}
	
	#contacto{padding-top: 30px}  
	#contacto li{display: inline; width: 60%}
	#contacto img{height:20px; margin-top: 30px}
	#contacto p{ font-family: 'Roboto', sans-serif; font-size:12px; font-weight:300; color:#fff !important; letter-spacing:2px ; padding-top:5px}
	#contacto a{color: white !important;}
	
	footer img{width:200px}
	footer p{font-family: 'Roboto', sans-serif; color:#333; text-align:center; font-size:10px; padding-top:20px}
    
    #home{float: none;    position: relative;overflow: hidden;display: block;}
    #home p {font-size: 40px;}
    
    section,.parallax-window {height: auto;padding: 50% 0;float: left;}
    
    #hacemos{padding: 15% 0;}
    .idioma {position: absolute;right: 10px;}

    /*#home{background-image: url(../images/movil-video.jpg) !important;}
    
    #video{display: none !important;}*/
}


@media only screen and (max-width: 400px) { /*TAMAÑO SMARTPHONE*/

	
	p{font-family: 'Work Sans', sans-serif; margin: 0 auto; text-align: center; font-size:40px; color: white}
	    
	
	.logo{height:50px}
	.idioma{margin-top:17px}
	
	h2{font-size:24px}
	#hacemos p{font-size:16px; line-height:20px}
	
	.p0{font-size:26px}
	.p1{font-size:16px; padding-top:10px; line-height:normal}
	
	#contacto li{display: inline; width: 60%}
	#contacto img{height:20px; margin-top: 30px}
	
    #contacto p{ font-family: 'Roboto', sans-serif; font-size:10px; font-weight:300; color:#fff !important; letter-spacing:2px ; padding-top:5px}
	
	footer img{width:180px}
	footer p{font-family: 'Roboto', sans-serif; color:#333; text-align:center; font-size:10px; padding-top:20px}
}