@import url(https://fonts.googleapis.com/css?family=Quicksand:400,300,700);

@import url('reset.css');

body {
  padding-top: 0px;
  background: url(../imagenes/bg.jpg) center repeat-y #7AAE3F;
  background-size:cover;
  font-family: 'Quicksand', Arial,  sans-serif;
}

h1 { font-weight:700;
font-size:40px;
color:#FFFFFF;
text-align:center;
padding:40px 0px;
min-height:100px;
}
	

h2 { font-weight: 300;
font-size:1.8em;
color:#FFFFFF;
text-align:center;
padding:20px 0px;
}

  h3 { font-weight:300;
font-size:16px;
padding:0px 10px 30px;
color:#FFFFFF;
text-align:center;
}


p{
	color:#FFFFFF;
}


a {
    color: #FFFFFF;
    text-decoration: none;
}

a:hover {
    color:#5AB130;
    text-decoration: none;
}


.no-padding {
	padding:0px;
}


@media (min-width: 768px) {

}



@media (min-width: 992px) {



}
@media (min-width: 1200px) {

h1 { font-weight:700;
font-size:60px;
color:#FFFFFF;
text-align:center;
padding:60px 0px;
min-height:100px;
}
	
  h3 { font-weight:300;
font-size:16px;
padding:0px 10px 30px;
color:#FFFFFF;
text-align:center;
height:100px;
}


}


/*
 * -------------------------------------------------------------------------------- HEADER
 */

.header {
  
  background:#222222;

}


.header img.icon {
	max-width:340px;
	margin:0px 0px; }

.header img {
	max-width:320px;
	margin:20px auto;

}

.header p.beeper {
	text-align:right;
	padding-top:0px;
	padding-right:30px;
	color:#5AAF2F;
	font-size:12px;

}

.header p.telfono {
	text-align:right;
	color:#FFFFFF;
	padding-right:15px;
	font-size:28px;
	line-height:-34px;
	margin:0;

}




@media (min-width: 768px) {
	
	.header img.icon {
	max-width:340px;
	margin:0px 0px; }
		
		
.header img {
	max-width:340px;
	margin:20px 0px;

}
	
	



.header p.beeper {
	text-align:right;
	padding-top:60px;
	padding-right:30px;
	color:#5AAF2F;
	font-size:16px;

}

.header p.telfono {
	text-align:right;
	color:#FFFFFF;
	padding-right:25px;
	font-size:24px;
	line-height:5px;
	margin:15px 0 0 0;

}

}

/*
 * -------------------------------------------------------------------------------- BARRA DE NAVEGACION
 */


.navbar-nav {
  width: 100%;
  text-align: center;
  font-size:12px;
  

}
.navbar-nav > li {
  float: none;

}

.navbar-default .navbar-nav > li > a {
    color: #5e2d61;
}

.navbar-default .navbar-nav > li > a:hover {
    color: #f67420;
}




@media (min-width: 768px) {
 

.navbar-nav {
  width: 100%;
  text-align: center;
  font-size:12px;

}
.navbar-nav > li {
  float: none;
  display: inline-block;
}

.navbar-default .navbar-nav > li > a {
    color: #5e2d61;
}

.navbar-default .navbar-nav > li > a:hover {
    color: #f67420;
}

}



/* -------------------------------------------------------------------------------- SLIDE HOME */
/* Carousel base class */
.carousel {
  height: 200px;
  margin-bottom: 0px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 200px;
  background-color: #777;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 170px;
}

@media screen and (max-width: 830px) {
	.ei-title{
		position: absolute;
		right: 0px;
		margin-right: 0px;
		width: 100%;
		text-align: center;
		top: auto;
		bottom: 10px;
		background: #fff;
		background: rgba(255,255,255,0.9);
		padding: 5px 0;
	}
	.ei-title h2, .ei-title h3{
		text-align: center;
	}
	.ei-title h2{
		font-size: 20px;
		line-height: 24px;
	}
	.ei-title h3{
		font-size: 30px;
		line-height: 40px;
	}
	.ei-slider{
	position: relative;
	width: 100%;
	max-width: 1920px;
	height: 200px;
	margin: 0 auto;
}
}


@media (min-width: 768px) {
.carousel {
  height: 500px;
  margin-bottom: 0px;

}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 500px;
  background-color: #777;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 500px;
}

}

/*
 * -------------------------------------------------------------------------------- CAMIONES HOME
 */

.CamionesHome {
	background:url(../imagenes/fotoblur.png) no-repeat center top;
	background-size: cover;
	padding-bottom:30px;
	

}

.CamionesHome h2{
	text-transform: uppercase;
	padding-top:30px;
	font-size:20px;
	font-weight:700;
}





/* ------------------------------------------------------------- SERVICIOS HOME */



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

.ServiciosHome {
	background:#222222;
	padding-bottom:30px;
}


.hi-icon-wrap {
	text-align: center;
	margin: 0 auto;
	padding: 2em 0 3em;
}

.hi-icon {
	display: inline-block;
	font-size: 0px;
	cursor: pointer;
	margin: 15px 30px;
	width: 90px;
	height: 90px;
	border-radius: 50%;
	text-align: center;
	position: relative;
	z-index: 1;
	color: #fff;
}

.hi-icon:after {
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	content: '';
	-webkit-box-sizing: content-box; 
	-moz-box-sizing: content-box; 
	box-sizing: content-box;
}

.hi-icon:before {
	font-family: 'ecoicon';
	speak: none;
	font-size: 48px;
	line-height: 90px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	display: block;
	-webkit-font-smoothing: antialiased;
}

.hi-icon-001:before {
	content: url("../imagenes/servicios/001.png");
	padding:10px 0px;
}

.hi-icon-002:before {
	content: url("../imagenes/servicios/002.png");
	padding:10px 0px;
}

.hi-icon-003:before {
	content: url("../imagenes/servicios/003.png");
	padding:10px 0px;
}

.hi-icon-004:before {
	content: url("../imagenes/servicios/004.png");
	padding:10px 0px;
}

.hi-icon-005:before {
	content: url("../imagenes/servicios/005.png");
	padding:10px 0px;
}

.hi-icon-006:before {
	content: url("../imagenes/servicios/006.png");
	padding:10px 0px;
}

.hi-icon-007:before {
	content: url("../imagenes/servicios/007.png");
	padding:10px 0px;
}

.hi-icon-008:before {
	content: url("../imagenes/servicios/008.png");
	padding:10px 0px;
}

.hi-icon-009:before {
	content: url("../imagenes/servicios/009.png");
	padding:10px 0px;
}

.hi-icon-010:before {
	content: url("../imagenes/servicios/010.png");
	padding:10px 0px;
}

.hi-icon-011:before {
	content: url("../imagenes/servicios/011.png");
	padding:10px 0px;
}

.hi-icon-012:before {
	content: url("../imagenes/servicios/012.png");
	padding:10px 0px;
}

.hi-icon-left001:before {
	content: url("../imagenes/icon/left001.png");
	padding:10px 0px;
}

.hi-icon-right001:before {
	content: url("../imagenes/icon/right001.png");
	padding:10px 0px;
}

.hi-icon-locked:before {
	content: "\e001";
}

.hi-icon-cog:before {
	content: "\e003";
}

.hi-icon-clock:before {
	content: "\e004";
}

.hi-icon-videos:before {
	content: "\e005";
}

.hi-icon-list:before {
	content: "\e006";
}

.hi-icon-refresh:before {
	content: "\e007";
}

.hi-icon-images:before {
	content: "\e008";
}

.hi-icon-pencil:before {
	content: "\e00b";
}

.hi-icon-link:before {
	content: "\e00c";
}

.hi-icon-mail:before {
	content: "\e00d";
}

.hi-icon-location:before {
	content: "\e00e";
}

.hi-icon-archive:before {
	content: "\e00f";
}

.hi-icon-chat:before {
	content: "\e010";
}

.hi-icon-bookmark:before {
	content: "\e011";
}

.hi-icon-user:before {
	content: "\e012";
}

.hi-icon-contract:before {
	content: "\e013";
}

.hi-icon-star:before {
	content: "\e014";
}

/* Effect 3 */
.hi-icon-effect-3 .hi-icon {
	box-shadow: 0 0 0 4px #fff;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.hi-icon-effect-3 .hi-icon:after {
	top: -2px;
	left: -2px;
	padding: 2px;
	z-index: -1;
	background: #000;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
	-moz-transition: -moz-transform 0.2s, opacity 0.3s;
	transition: transform 0.2s, opacity 0.3s;
}

/* Effect 3a */
.hi-icon-effect-3a .hi-icon {
	color: #7AAE3F;
	text-decoration:none;
}

.hi-icon-effect-3a .hi-icon:hover {
	color: #fff;
	background: #030;
}

.hi-icon-effect-3a .hi-icon:hover:after {
	-webkit-transform: scale(1.3);
	-moz-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
	opacity: 0;
}

/* Effect 3b */
.hi-icon-effect-3b .hi-icon {
	color: #fff;
}

.hi-icon-effect-3b .hi-icon:hover {
	color: #f06060;
}

.hi-icon-effect-3b .hi-icon:after {
	-webkit-transform: scale(1.3);
	-moz-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
	opacity: 0;
}

.hi-icon-effect-3b .hi-icon:hover:after {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}






/*
 * -------------------------------------------------------------------------------- FOOTER
 */



footer {
	background:#222222;

}


footer .logofooter {

border-right:1px solid #000;
border-left:1px solid #000;
padding:20px 15px;
margin:15px 0;
text-align:center;
background:/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#222222+0,333333+51,222222+100 */

background: #222222; /* Old browsers */

background: -moz-linear-gradient(top,  #222222 0%, #333333 51%, #222222 100%); /* FF3.6-15 */

background: -webkit-linear-gradient(top,  #222222 0%,#333333 51%,#222222 100%); /* Chrome10-25,Safari5.1-6 */

background: linear-gradient(to bottom,  #222222 0%,#333333 51%,#222222 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#222222',GradientType=0 ); /* IE6-9 */
}



footer .infofooter {
	margin:10px 0;
	padding:15px 0px;
	text-align:center;
	border-top: solid 1px #000000;

}


@media (min-width: 768px) {
	
	
	footer .logofooter {

border-right:1px solid #000;
border-left:1px solid #000;
padding:50px 15px;
margin:15px 0;
text-align:center;
background:/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#222222+0,333333+51,222222+100 */

background: #222222; /* Old browsers */

background: -moz-linear-gradient(top,  #222222 0%, #333333 51%, #222222 100%); /* FF3.6-15 */

background: -webkit-linear-gradient(top,  #222222 0%,#333333 51%,#222222 100%); /* Chrome10-25,Safari5.1-6 */

background: linear-gradient(to bottom,  #222222 0%,#333333 51%,#222222 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#222222',GradientType=0 ); /* IE6-9 */
}
	
	footer .infofooter {
	margin:35px 0;
	text-align:center;
	border-top: none;

}
	
	}