html,body {
	width  : 100%;
	height : 100%;
}

body {
	margin      : 0px;
	padding     : 0px;
	overflow-x  : hidden;
	color:white;
	font-family: 'Cabin', sans-serif;
	font-size:1em;
	letter-spacing:1px;
}

#content {
	position : fixed;
	top      : 0px;
	left     : 0px;
	width    : 100%;
	height   : 100%;
}

a { 
	color           : white;
	text-decoration : none;
}

a:hover {
	text-decoration : none;
}

p {
	margin      : 0 0 20px 0;
}

p, ul {
	list-style       : none;
}


#header ul li {
	width      : 325px;
	height     : 50px;
	float      : left;
	text-align : center;
}

#header ul {
	padding: 0;
}

img {
	border: 0;
}

h1 {
	
}

h2 {
	color:transparent;
}

h3 {
}

h3.caseStudy {
	cursor : pointer;
}

.video {
	overflow : hidden;
}


section {
	min-height : 500px;
	min-height : 100%;
	width      : 100%;
	position   : absolute;
	overflow   : hidden;
	visibility : hidden;
	z-index:2;
}

section .story {
	position      : relative;
	z-index       : 4;
	width         : 80%;
	margin        : 2% auto 0 auto;
}

div.caption {
	padding-bottom : 30px;
}

/* default section show / hide animations */
section.start {
	top : 100%;
}

section.focus, section.to {
	bottom : 0%;
}

section.end {
	bottom : 100%;
}

/* default background image animation */

section .bg {
	position : absolute;
	left     : 0px;
	top      : 0%;
}

section .bg.start {
	top : -50%;
}

section .bg, section .bg.focus, section .bg.to {
	top : 0%;
}

section .bg.end {
	top : 50%;
}

/* Side Nav */
ul#nav {
	position : fixed;
	height:100%;
	left     : 0;
	top      : 87px;
	z-index  : 999;
	background-image:url('../images/sombra.png');
	padding:26px;
}

ul#nav li {
	height   : 50px;
	position : relative;
	margin-top:20px;
}

ul#nav a {
	display     : block;
	width       : 37px;
	height      : 50px;
	text-indent : -9000px;
	overflow    : hidden;
	outline     : none;
}
.inicio{background  : url('../images/iconos.png');}
.inicio:hover{background-position:35px 0;}
.contacto{background  : url('../images/iconos.png');background-position:0 55px;}
.contacto:hover{background-position:35px 55px;}
.mapa{background  : url('../images/iconos.png');background-position:0 130px;}
.mapa:hover{background-position:35px 130px;}
.servicios{background  : url('../images/iconos.png');background-position:0 200px;}
.servicios:hover{background-position:35px 200px;}
/*.servicios{background  : url('../images/iconos.png');background-position:0 270px;}
.servicios:hover{background-position:35px 270px;}*/
.somos{background  : url('../images/iconos.png');background-position:0 345px;}
.somos:hover{background-position:35px 345px;}
ul#nav h1 {
	display     : none;
	opacity     : 0;
	position    : absolute;
	left        : 0;
	top         : 0px;
	white-space : nowrap;
	padding     : 0 0 0 9px;
	background  : url('../images/menu-arrow.png') 0 50% no-repeat;
	overflow    : hidden;
	margin      : 0;
}

ul#nav span {
	display            : block;
	background:#f05423;
	color              : #FFF;
	padding            : 4px 8px;
	white-space        : nowrap;
}

#fancybox-left #fancybox-left-ico {
	left : -40px;
}

#fancybox-right #fancybox-right-ico {
	left  : auto;
	right : -40px;
}

.video-js-box.vjs-fullscreen {
	height : auto !important;
}
.px{width:100%;height:100%;position:fixed;top:0;left:0;background-image:url('../images/pixel.png');z-index:2;}
#logo_tpb{max-width:250px;position:absolute;right:10%;top:10%;float:right;z-index:2;}
#imgLogoTPB{width:100%;}
#logo{position:fixed;top:0;left:0;width:90px;height:87px;background-image:url('../images/logo.png');z-index:9999;}
#rojo1{width:100%;height:18%;position:absolute;bottom:0;}
#imgRojo1{width:100%;height:100%;}
#rojo2{width:100%;position:absolute;top:0;z-index:2;}
#imgRojo2{width:100%;}
#gris1{width:100%;height:10%;position:absolute;bottom:0;z-index:2;}
#imgGris1{width:100%;height:100%;}
#gris2{width:100%;height:50%;position:absolute;top:0;z-index:2;}
#imgGris2{width:100%;height:100%;}
.orange{color:#f05423;}
.tit1{font-size:2em;}
.tit2{color:#0c233f;}
.font2{font-size:1.5em;font-style:italic;}
/*Nuestra empresa*/
.rectangle{width:150px;height:220px;float:left;cursor:pointer;cursor:hand;margin:30px;}
.icoRec{padding:20px 20px 30px 30px;}
.icoSomos{width:100px;height:100px;background-image:url('../images/iconos2.png');}
.txtRec{width:130px;padding:10px;text-align:center;}
#ico2{background-position:330px 0;}
#ico3{background-position:220px 0;}
#ico4{background-position:120px 0;}
.contRec{margin:15% auto;overflow:auto;max-width:850px;}
#cabecera{width:500px;float:left;padding-left:150px;padding-top:5%;}
.mask{width:100%;height:100%;position:fixed;top:0;left:0;z-index:4;display:none;background:rgba(0,0,0,0.8)}
.titMvv{font-size:24px;color:#f05423;margin-bottom:15px;margin-top:15px;}
.infoMvv{width:500px;margin: 10% auto; background-image:url('../images/sombra.png');padding:50px;}
.btnCerrar{width:50px;height:50px;background-image:url('../images/cerrar.png');position:absolute;margin-left:520px;margin-top:-70px;}
.btnCerrar:hover{background-position:50px 0;}
/*Unidades*/
#contUnidades{min-width:950px;margin-top:6%;text-align:center;}
.contCamion{width:200px;float:left;margin-left:30px;}
.icoCamion{width:140px;height:150px;background-image:url(../images/camiones.png);margin-left:30px;}
.tipoCamion{text-align:center;padding-top:20px;}
.btnVer{text-transform:uppercase;padding:10px;text-align:center;border:solid 3px white;width:330px;display:inline-block;text-decoration:none;margin-top:20px;cursor:pointer;cursor:hand;}
.btnVer:hover{background-color:#c52033;border:solid 3px #c52033;}
#camioneta{background-position:300px 0;}
#rabon{background-position:430px 0;}
#tracto{background-position:160px 0;}
#torton{background-position:-5px 0;}
.galerias{
	width:100%;
	height:100%;
	position:fixed;
	z-index:999;
	background:rgba(0,0,0,0.8);
	display:none;
	top:0;
	left:0;
}
.cerrar{width:50px;height:50px;position:fixed;top:50px;right:50px;background:#c52033;z-index:99999;text-align:center;font-size:32px;line-height:50px;}

/*Contacto*/
#story-contacto{background-image:url('../images/tpb_contacto.jpg');}
#contForm{width:90%;margin:10% auto;}
#direccion{width:250px;float:left;}
#formulario{width:350px;float:left;}
input,textarea{background-color:#595b71;border:none;padding:5px;float:left;width:100%}
#logo2{width:267px; height:192px;background-image:url('../images/logo.jpg');float:right;}
#pie{width:80%;position:fixed;bottom:0; padding:30px;margin-left:10%;font-size:12px;z-index:3;color:#595b71;}
#cc{float:right; margin-right:10%;}
#acc{color:#595b71;}
#acc:hover{color:#f05423;}
#btnEnviar{margin:20px 0 0 0;float:right;}
/*Mapa*/
#contMapa{width:100%;float:left;}
#story-mapa{background-color:#080d1d;}

@media screen and (max-width: 1400px) {

}
/* Mobile */
@media screen and (max-width: 700px) {
	.px{display:none;}
	#logo{position:fixed;top:0;left:0;width:51px;height:50px;background-image:url('../images/logo2.png');z-index:9999;}
	ul#nav {
		position : fixed;
		height:43px;
		width:100%;
		left     : 50px;
		top      : 0;
		z-index  : 999;
		background-image:url('../images/sombra.png');
		padding:5px 5px 3px 0;
	}
	ul#nav li {
		height   : 50px;
		width:36px;
		position : relative;
		margin-top:0;
		margin-left:20px;
		float:left;
	}
	ul#nav a {
		display     : block;
		width       : 37px;
		height      : 50px;
		text-indent : -9000px;
		overflow    : hidden;
		outline     : none;
	}
	#imgLogoTPB{display:none;}
	
	#cabecera {
				float: left;
				padding-left: 2%;
				padding-top: 70px;
				width: 96%;
				text-align:center;
		}
	#imgRojo2{width:100%;float:left;height:250px;}	
	#cuadroR{text-align:center;width:100%;float:left;}
	.contRec{margin:40px 0 0 0;float:left;overflow:auto;width:100%;}
	.icoRec {padding: 10px 10px 20px 10px;}
	.rectangle{width:120px;height:220px;float:left;cursor:pointer;cursor:hand;margin:0;}
	.txtRec{width:100px;padding:10px;text-align:center;}
	.infoMvv{width:90%;height:100%;position:fixed;margin:50px 0 0 0; background-image:url('../images/sombra.png');padding:5%;}
	#contUnidades{min-width:150px;width:100%;margin-top:6%;}
	#contMapa{width:100%;float:left;margin-top:70px;}
	#story-contacto{padding-top:60px;}
	#contForm{width:92%;margin:10% auto;padding:4%;float:left;}
	#formulario{width:100%;float:left;}
	input,textarea{background-color:#595b71;border:none;padding:1%;float:left;width:98%}
	#logo2{display:none;}
	#pie{width:92%;position:relative;bottom:0; padding:4%;margin-left:0;font-size:12px;z-index:3;color:#595b71;float:left;text-align:justify;}
	.btnVer {width:90%;float:left;}
	ul#nav span  {display:none;}

}