/* ==|== primary styles =====================================================

   ========================================================================== */

   
body{
	background-color:#CCCCCC;
	font-family: 'Roboto', sans-serif;
	color:#404140;
	font-size:20px;
	line-height:27px;
	font-weight:400;
	position:relative;
}

.container{
	max-width:1600px;
    padding: 0;
}

.wrapper{
	max-width:1600px;
	margin:0 auto;
	background-color:#ffffff;
}

.centerd_wrapper{
	max-width:960px;
	margin:0 auto;
	text-align: center;	
}

.container-fluid{
	padding-left: 0px;
    padding-right: 0px;
}

.clearfix{clear:both;}

h1, h2, h3{
    color: #ee4e46;
    font-family: 'Montserrat', sans-serif;
    font-size: 62px;
    font-weight: 500;
}

h1{color: #ffffff; margin: 0 0 60px 0;}
h2{margin: 0 0 60px 0;}
h3{font-size: 20px; font-weight: 600;}

.puntero{position: absolute; transform: translate(25%, 25%); z-index: 999999; -webkit-filter: drop-shadow(15px 15px 15px #222); filter: drop-shadow(15px 15px 15px #222);}


/*Modal*/

.modal-dialog{max-width: 950px;}
.modal-dialog .modal-content{border-radius: 20px; padding: 0 0 2% 0;}
.modal .modal-body{width: 100%; max-width: 950px; text-align: center; padding: 20px 4%;}

.modal .modal-header{border-bottom: 0; padding: 15px 20px 0 0;}
.modal .modal-header button{font-family: 'Montserrat', sans-serif; font-size: 30px; font-weight: 600;}

.modal .modal-body h3{font-size: 25px; font-weight: 700; margin: 10px 0 45px 0;}
.modal .modal-body .naranja{color: #ec5048;}

#modal3 .modal-dialog .modal-content .modal-body{padding: 20px 12%;}
#modal6 .modal-dialog .modal-content .modal-body{padding: 20px 12%;}
#modal7 .modal-dialog .modal-content .modal-body{padding: 20px 12%;}

/*Modal*/



/*Menu*/

.menu-main .botonera .navbar{
    border: none;
    font-size: 18px;
    color: #404140;
    margin: 0;
    padding: 8px 0 15px 0;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
}

.navbar-expand-lg .navbar-nav .nav-link{color: #404140; transition: all 0.2s ease-in;}
.navbar-expand-lg .navbar-nav .nav-link:hover{color: #ef4e46; text-decoration: underline; transition: all 0.2s ease-in;}
.navbar-expand-lg .navbar-nav .nav-item{margin: 0 3% 0 0;}
.navbar-expand-lg .navbar-nav .nav-item .linkedin{display: block; width: 56px; height: 54px; background-image: url("../images/red_linkedin.png"); background-repeat: no-repeat; transition: all 0.2s ease-in;}
.navbar-expand-lg .navbar-nav .nav-item .linkedin:hover{background-image: url("../images/red_linkedin2.png"); background-repeat: no-repeat; transition: all 0.2s ease-in;}

.navbar-light .navbar-toggler{border-color: #404140; border-radius: 0; margin: 0 20px 0 0; outline: none;}

/*Menu*/



/*Info*/

.information{background-image: url("../images/back1.jpg"); background-repeat: no-repeat; padding: 30px 10px; margin: 0 0 30px 0;}
.information h1{margin: 130px 0 60px 0;}

.information .caja{background-color: #ffffff; border-radius: 20px; padding: 6% 8%; min-height: 476px; margin: 0 0 2% 0; display: none;}
.information .caja h3{margin: 15px 0 25px 0;}

/*Info*/


/*Nosotros*/

.nosotros{background-color: #ffffff; padding: 80px 15px 60px 15px;}

/*Nosotros*/



/*Estudios y Certificaciones*/

.est-certif{background-image: url("../images/back2.jpg"); background-repeat: no-repeat;  padding: 100px 10px 26px 10px; margin: 0 0 30px 0;}
.est-certif p, .est-certif h2, .est-certif h3{color: #FFFFFF;}
.est-certif h2{margin: 100px 0 22px 0;}
.est-certif h3{font-size: 30px; margin: 30px 0 30px 0;}

#carousel #certifgal{background-color: #fff; padding: 2% 2%; border-radius: 20px;}
#carousel #certifgal .carousel-caja{width: 240px; height: 260px; background-color: #ffffff; color: #ee4e46; text-align: center; vertical-align: middle; padding: 10px; margin: 0; font-size: 18px; font-weight: 700; line-height: 24px;}
#carousel #certifgal .naranja {background-color: #ee4e46; color: #ffffff;}
#carousel #certifgal .blanco p{background-color: #ffffff; color: #ee4e46;}


.legal{margin: 40px 0 0 0;}
.legal p{color: #404140;}

/*Estudios y Certificaciones*/



/*Soluciones*/

.soluciones{background-image: url("../images/back3.jpg"); background-repeat: no-repeat;  padding: 70px 10px 10px 10px; margin: 0 0 30px 0;}
.soluciones h2{margin: 100px 0 20px 0;}
.soluciones p, .soluciones h2, .soluciones h3{color: #FFFFFF;}
.soluciones p{display: block;}
.soluciones h3{font-size: 30px; display: block; margin: 30px 0 15px 0;}

.soluciones .caja{display: flex; align-items:center; justify-content:center; background-color: #ffffff; border-radius: 20px; padding: 2% 2%; margin: 2%; height: 220px;}
.soluciones .caja .caja-inner h3{margin: 15px 0 25px 0; color: #ee4e46; font-size: 18px; font-weight: 700;}

.soluciones .cajas-main a{text-decoration: none;}
.soluciones .cajas-main a:hover .caja{background-color: #ee4e46; transition: all 0.2s ease-in;}
.soluciones .cajas-main a:hover .caja img{filter: brightness(100); transition: all 0.2s ease-in;}
.soluciones .cajas-main a:hover .caja h3{color: #ffffff; transition: all 0.2s ease-in;}

/*Soluciones*/



/*Contacto*/

.contacto{background-color: #ffffff; padding: 80px 15px 150px 15px;}
.contacto h2{margin: 0 0 38px 0;}
.contacto img{display: block; margin: 30px auto 15px auto;}
.contacto a{font-family: 'Montserrat', sans-serif; font-size: 25px; font-weight: 500; text-decoration: none; color: #404140;}
.contacto a:hover{color: #ee4e46; transition: all 0.2s ease-in;}


/*Contacto*/




   
   

/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

/* 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; }

/* Contain floats: h5bp.com/q */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }



/* ==|== media queries ======================================================
   PLACEHOLDER Media Queries for Responsive Design.
   These override the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */


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

}


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


}


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


}


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


}


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

    .menu-main .botonera .navbar{padding: 8px 15px 15px 15px;}
    
    .information .caja, .soluciones .caja{-webkit-filter: drop-shadow(5px 5px 5px #222); filter: drop-shadow(5px 5px 5px #222);}
    
    #carousel #certifgal .carousel-caja{width: 100%; height: 260px;}
    
    

}


@media only screen and (max-width: 860px) {
    
    #modal3 .modal-dialog .modal-content .modal-body{padding: 20px 4%;}
    #modal6 .modal-dialog .modal-content .modal-body{padding: 20px 4%;}
    #modal7 .modal-dialog .modal-content .modal-body{padding: 20px 4%;}

}


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

    body, p{font-size:16px; line-height:24px;}
    h1, h2{font-size: 36px;}
    h3, .est-certif h3, .soluciones h3, .modal .modal-body h3{font-size: 18px;}
    .soluciones .caja .caja-inner h3{font-size:16px;}
    
    .puntero{display: none;}
    
    .soluciones, .est-certif{background-position: top !important;} 
    
    .information .caja{min-height: 0;}
    
    .nosotros{padding: 10px 15px 80px 15px;}
    
    .est-certif h2{margin: 60px 0 22px 0;}
    
    .est-certif{margin: 0 0 40px 0;}
    
    .soluciones h2{margin: 0 0 20px 0;}
    
    .modal.show .modal-dialog{margin: 3%;}
    
    .contacto{padding: 17px 15px 50px 15px;}
    
    .contacto a{font-size: 15px;}

	
}


@media only screen and (max-width: 600px) {	
    
    
}


@media only screen and (max-width: 480px) {
      
      #carousel #certifgal .carousel-caja p{font-size: 13px; line-height: 16px;}

}


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

        
}