@charset "UTF-8";
/* CSS Document */
nav,div,footer,header,section,article{
	display:block;
}

@font-face {
  font-family: 'Kirvy-Light';
  src: url('../fonts/Kirvy-Light.otf') ; /* IE9 Compat Modes */
  src: url('../fonts/Kirvy-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   /*   url('webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/Kirvy-Light.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/Kirvy-Light.ttf')  format('truetype'); /* Safari, Android, iOS */
       /*url('../fonts/Kirvy-Light.svg#svgFontName') format('svg'); /* Legacy iOS */
	    font-weight:normal;
	   font-style:normal;
	  
}



body{
	overflow: hidden;
	background-color:#fff;	
	padding:0;	
	font-family: 'Kirvy-Light';
	
}



/******* PRELOAD ***/
/*
#preloader {
    position: fixed;
    top:0; left:0;
    right:0; bottom:0;
    background:#fff;
    z-index: 100;
}
#loader {
    width: 150px;
    height: 55px;
    position: absolute;
    left:50%; top:50%;
    background: url(../images/loadinglogo.png) no-repeat center 0;
    margin:-50px 0 0 -50px;
}*/
/*******************/

/******* PRELOAD2 ***/

#preloader2 {
    position: fixed;
    top:0; left:0;
    right:0; bottom:0;
    background:#282828;
    z-index: 100;
}
#loader2 {
    width: 150px;
    height: 55px;
    position: absolute;
    left:50%; top:50%;
    /*background: url(../images/loadinglogo.png) no-repeat center 0;*/
    margin:-50px 0 0 -50px;
}
/*******************/
header{
	margin:0;
	
	/*background:#5FFF52;*/	
}
img{
	border:0;

}

#contenido{
	background:#97BF1B;
	padding:0;
}

#contenedor-index{	
	background:#FF0004;
	width: 100%;
	height: 690px;	  
	background: url(../images/fondoindex.jpg) no-repeat;
	background-size: cover;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	padding-right:0;
	padding-left:0;
}

#contenedor-principal{
	font-size:0.99em;	
	
	width: 100%;
	height: 690px;
	padding-top:70px;
	padding-bottom:100px;
	
	background:url(../images/fondogeneral.jpg)  no-repeat ; 
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
	  
	  padding-right:0;
	padding-left:0;
}



/*
#contenedor-principal div.row{
      display: table;
}
#contenedor-principal div.col-md-3 {
      display: table-cell;   
}
#contenedor-principal div.col-md-2 {
      display: table-cell;   
}
#contenedor-principal div.col-md-7 {
      display: table-cell;   
}
*//*
#contenedor-principal.row {
    display: table;
}

#contenidos contenidoAnimado {
  display: table-row;
}
 
#contenedor-principal div.col-md-3 {
      display: table-cell;   
}
#contenedor-principal div.col-md-2 {
      display: table-cell;   
}
#contenedor-principal div.col-md-7 {
      display: table-cell;   
}*/


/*
[class*="col-"] {
    float: none;
    display: table-cell;
    vertical-align: top;
}*/

#fondoindex{
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;

}

#contenedor-principal .img-responsive {
    margin: 0 auto;
}


footer{	
	color:#FFFFFF;
	font-size:1.20em;
	font-weight:normal;	
	background:#f29400;
	padding-top:15px;
	padding-bottom:27px;

}

#contenedor-footer{

	
}

#logo{
	position:absolute;
	top:0;
	left:0;
	z-index:1;

   /* -webkit-transition: margin 0.5s ease-out;
    -moz-transition: margin 0.5s ease-out;
    -o-transition: margin 0.5s ease-out;*/
}

#logo:hover {
    margin-top: -5px;
	margin-left:-5px
}

.main{
	background-color:#F3BFF8;
}

#bloque1{
	background-color:#fff;
	padding-top:20px;
	padding-bottom:20px;
	position:relative;

}

.contenedormenu{
	background-color:#f29400;
	padding-top:21px;
	padding-bottom:21px;
	

}

/*navbar*/
.navbar-default{

	background-color:transparent;	

	color:#000;
	margin-bottom:0;
	border:none;
	font-size:1.20em;
	
}
.navbar-default .navbar-nav{
	padding-left:0;

	
	
}
.navbar-default .navbar-nav > ul{

	
}
#menuprincipal{
	width:70%;


}

.navbar-default .navbar-nav > li > a{
	
	color:#fff;
	
	text-align:center;
	padding-left:20px;
	padding-right:21px;
	
	
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus{
	color:#fff;
	background-color:#FF0004;
	text-decoration:underline;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus{
	color:#fff;
	text-decoration:underline;
	background-color:transparent;	
}

.activado{
	text-decoration:underline;

}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus{
	background-color:#FF0004;
	color:#fff;
}
.btn-primary{
	color:#fff;
	background-color:#1e2a36;
	border-color:
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.open .dropdown-toggle.btn-primary{
	color:#fff;
	background-color:#1e2a36;
	border-color:
	
}



.bloque2{
	background-color:#9bb73a;
	color:#FFFFFF;
	padding-top:49px;
	padding-bottom:30px;
	padding-left:15px;
	padding-right:15px; 
	
		
}
.bloque-trayectoria{
	/*height:344px; */
	background-color:#9bb73a;
	color:#FFFFFF;
	padding-top:50px;
	padding-bottom:40px;
	
	padding-left:15px;
	padding-right:15px;	

}
.bloque-proyecto{
	/*height:344px; */
	background-color:#12948b;
	color:#FFFFFF;
	padding-top:50px;
	padding-bottom:40px;
	
	padding-left:15px;
	padding-right:15px;	

}

.bloque-medio-ambiente{
	/*height:344px; */
	background-color:#9bb73a;
	color:#FFFFFF;
	
	padding-bottom:40px;
	padding-top:50px;
	padding-left:15px;
	padding-right:15px;
	
		
}

.bloque-explosivos{
	/*height:344px; */
	background-color:#2ea199;
	color:#FFFFFF;
	padding-top:50px;
	padding-bottom:58px;
	padding-left:15px;
	padding-right:15px; 

}




.bloque-mineria{
	/*height:344px; */
	background-color:#828384;
	color:#FFFFFF;
	padding-top:50px;
	padding-bottom:40px;
	
	padding-left:15px;
	padding-right:15px; 
	

/*	 float: none;
    display: table-cell;
    vertical-align: top;*/
}
.bloque-contacto{
	font-family: 'Kirvy-Light';
	/*max-height:344px;*/
	
	background-color:#9bb73a;
	color:#FFFFFF;
	padding-top:30px;
	padding-bottom:20px;
	
	
	position:relative;
}




label{

font-family: 'Kirvy-Light';
}
.bloque-contacto input,button,label{

/*para Firefox*/
-moz-border-radius: 10px 10px 10px 10px;
/*para Safari y Chrome*/
-webkit-border-radius: 10px 10px 10px 10px;
/* para Opera */
border-radius: 10px 10px 10px 10px;
font-family: 'Kirvy-Light';


}

#txtMensaje{
-moz-border-radius: 10px 10px 10px 10px;
/*para Safari y Chrome*/
-webkit-border-radius: 10px 10px 10px 10px;
/* para Opera */
border-radius: 10px 10px 10px 10px;
}

#btnEnviar{
	color:#999;
-moz-border-radius: 10px 10px 10px 10px;
/*para Safari y Chrome*/
-webkit-border-radius: 10px 10px 10px 10px;
/* para Opera */
border-radius: 10px 10px 10px 10px;
}


.itemcontacto{	
	position:absolute;
	top:30px;
	left:25px;

}

.itemmineria{	
	position:absolute;
	top:30px;
	left:40px;
}

.itemexplosivo{	
	position:absolute;
	top:30px;
	left:40px;
}

.itemambiente{	
	position:absolute;
	top:30px;
	left:40px;
}
.itemtrayectoria{	
	position:absolute;
	top:30px;
	left:40px;
}



/*************ANIMAR CONTENIDO ***********/

#contenedorAnimado{
	 -webkit-animation-duration: 2s;
	   -webkit-animation-name: slidein;
      -moz-animation-duration: 2s;
     
      -moz-animation-name: slidein;
    
	  animation-direction: normal;
    }
    
    @-moz-keyframes slidein {
      from {
        margin-left:100%;
        /*width:100%;*/
		
      }
      
      to {
        margin-left:0%;
/*        width:100%;*/
		
      }
    }
    
    @-webkit-keyframes slidein {
      from {
        margin-left:100%;
        /*width:100%;*/
		
      }
      
      to {
        margin-left:0%;
/*        width:100%;*/
		
      }
    }
	
	
	
	
	
	
	/*****************/
	/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #282828;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */


#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}
#loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #2ea199;

    -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */

    z-index: 1001;
}

    #loader:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #f29400;

        -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    #loader:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #9bb73a;

        -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
          animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    @-webkit-keyframes spin {
        0%   { 
            -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);  /* IE 9 */
            transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);  /* IE 9 */
            transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
        }
		
    }
    @keyframes spin {
        0%   { 
            -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);  /* IE 9 */
            transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);  /* IE 9 */
            transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
        }
		
		
    }
	
    #loader-wrapper .loader-section {
        position: fixed;
        top: 0;
        width: 51%;
        height: 100%;
        background: #fff;
        z-index: 1000;
        -webkit-transform: translateX(0);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(0);  /* IE 9 */
        transform: translateX(0);  /* Firefox 16+, IE 10+, Opera */
    }

    #loader-wrapper .loader-section.section-left {
        left: 0;
    }

    #loader-wrapper .loader-section.section-right {
        right: 0;
    }

    /* Loaded */
    .loaded #loader-wrapper .loader-section.section-left {
        -webkit-transform: translateX(-100%);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: translateX(-100%);  /* IE 9 */
                transform: translateX(-100%);  /* Firefox 16+, IE 10+, Opera */

        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  
                transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader-wrapper .loader-section.section-right {
        -webkit-transform: translateX(100%);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: translateX(100%);  /* IE 9 */
                transform: translateX(100%);  /* Firefox 16+, IE 10+, Opera */

-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }
    
    .loaded #loader {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;  
                transition: all 0.3s ease-out;
				
	
				
    }
    .loaded #loader-wrapper {
        visibility: hidden;

        -webkit-transform: translateY(-100%);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: translateY(-100%);  /* IE 9 */
                transform: translateY(-100%);  /* Firefox 16+, IE 10+, Opera */

        -webkit-transition: all 0.3s 1s ease-out;  
                transition: all 0.3s 1s ease-out;
    }
    
    /* JavaScript Turned Off */
    .no-js #loader-wrapper {
        display: none;
    }
    .no-js h1 {
        color: #222222;
    }

    #content {
        margin: 0 auto;
        padding-bottom: 50px;
        width: 80%;
        max-width: 978px;
    }  
	
	
	





/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
	
	
}

/* 
	Ok so you have made it this far, that means you are very keen to on my code. 
	Anyway I don't really mind it. This is a great way to learn so you actually doing the right thing:)
	Follow me @ihatetomatoes
*/










/*****************MEDIAQUERYSS***************/
/* Custom, iPhone Retina */ 
	
	
	/* Extra Small */
@media(max-width:767px){
		#contenedor-principal{ 
			height:1150px; padding-top:20px;
		}
		/*	#contenedor-index{
			height:555px;	 
		}*/
		body{
			overflow:visible;
			
		}
		
	.navbar-default .navbar-nav > li > a{
		
		
		
		text-align:left;

		
	}
		
}

/* Small */
@media(min-width:768px) and (max-width:991px){
		#contenedor-principal{ 
			height:1000px;padding-top:20px;
		}
		/*#contenedor-index{
			height:605px;	 
		}*/
		body{
			overflow:visible;
			
		}
		#menuprincipal{
		width:100%;
		}
		
		.navbar-default .navbar-nav > li > a{		
			text-align:left;			
		}
}

/* Medium */
@media(min-width:992px) and (max-width:1199px){
		#contenedor-principal{ 
			height: 690px;		  
		}
	body{
			overflow:visible;
			
		}
		#menuprincipal{
	width:100%;


	}
}

/* Large */
@media(min-width:1200px){
		#contenedor-principal{  
			height: 690px;	  
		}
		body{
			overflow:hidden;
			
		}
		
		
		
}