@font-face{
    font-family: 'Poppins';
    src: url('font/poppins/poppins.ttf') format('truetype');
}

.custom-body{
	margin: 0px;
	padding: 0px;
	width: 100%;
    height: 100%;
    background-color: black;
	font-family: 'Poppins', sans-serif;
}

nav,
main,
footer{
	max-width: 86.25vw;
	margin: auto;
}

.content{
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

nav{
	margin-bottom: 5vw;
}

.nav-item{
	margin: 0;
	align-self: center;
    position: relative;
    z-index: 50;
}

.nav-item a{
	margin: 0 1.5vw;
	color: white;
	font-size: 1vw;
	font-weight: normal;
	transition: transform 1s,color 1s;
}

.nav-item a:active,
.nav-item a:visited{
	color: white;
}

.nav-item a:hover{
	transform: scale(1.20);	
  	color: lightgrey;
}

.sub-menu{
    display: none;
    position: absolute; 
    top: 100%; 
    left: 0;
    background-color: rgba(0, 0, 0, 0.6); 
    padding: 10px; 
    z-index: 1; 
    list-style: none;
    width: auto; 
}

.sub-menu li{
    display: block; 
    margin-right: 10px; 
    white-space: nowrap; 
}

.sub-menu li a{
    display: block;
    text-decoration: none;
    color: white;
    transition: transform 0.5s, color 0.5s; 
}

.sub-menu li a:hover{
    color: #777; 
    transform: scale(1.03);
}

.nav-item:hover .sub-menu{
    display: block;
}

main .main-title{
	width: 100%;
}

.mainVideoContainer{
	padding: 0em;
	margin: 0 0 4vw 0;
	width: 100%;
	height: 48vw;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	background-image: url("../img/intiIII-img/JUNCAL-EXT-01.jpg");
	background-position: 50% 10%;
	background-size: 100%;
}

.mainVideoContainer::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
}

.mainVideoContainer h3{
	padding: 3vw 6vw 3vw 6vw;
	color: #fefefe;
	font-size: 3.75vw;
	border: 1px solid #fefefe;
	position: relative;
	z-index: 1;
	background-color: rgba(0, 0, 0, 0.3);
    transition: padding 3s;
}

.mainVideoContainer h3:hover{
	cursor: pointer;
}

.hidden{
    display: none;
}

.mainVideo{
    display: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.infoMapRow{
	padding: 0em;
	margin: 0em;
	display: flex;
	width: 100%;
}

.infoMapCol{
	margin: 0px;
	padding: 0px;
	width: 50%;
	height: 37.75vw;
	text-align: center;
	align-items: center;
	justify-content: center;
	display: flex;
}

.infoMapRow,
.infoMapRow .infoMapCol{
    opacity: 0;
    transition: opacity 3s ease;
}

.infoMapRow.show,
.infoMapRow.show .infoMapCol{
    opacity: 1;
}

.infoMapCol p{
	padding: 0px;
	margin: 0px;
	width: 100%;
	height: 30vw;
	color: #fefefe;
	font-size: 1.1vw;
}

.infoMapCol .mapa{
    padding: 0em;
    margin: 0em;
    width: 100%;
    height: 30vw;
    background-image: url("../img/intiIII-img/FormatoMapa1INTI3.jpg");
    background-position: 50% 0%;
    background-size: 130%;
    border-radius: 5px;
}

.infoMapCol .mapa a{
    display: block; 
    width: 100%;
    height: 100%;
    cursor: pointer;
}

main .container-fluid{
	margin: 4vw 0 4vw 0;
	padding: 0;
	width: 100%;
    display: flex;
}

#info-column-Tip2 h4,
#info-column-Tip3 h4,
#info-column-Tip4 h4{
	margin: 0;
	padding: 0;
	height: 4.25vw;
	font-size: 3.5vw;
	text-align: right;
	font-weight: normal; 		
}

.info-item p{
	margin: 0;
	padding: 0;
	font-size: 1.5vw;
	text-align: right;
	font-weight: lighter;
}

#soldadoDiv{
	margin: 4vw 0 2.75vw 0;
	height: 60vw;
}

#soldadoDiv2{
	margin: 4vw 0 3.5vw 0;
}

#info-column-Tip1{
	padding: 0;
	margin: 0 auto;
	width: 5vw;
	height: 100%;
	justify-content: center;
	align-items: center;
	height: 60vw;
	display: flex;
	overflow: hidden;
}

#info-column-Tip1 h4{
	padding: 0em;
	margin:36vw 0 0 0;
	width: auto;
	height: 5vw;
	font-size: 3.5vw;
	justify-content: center;
	align-items: center;
	text-align: center;
	white-space: nowrap;
	-webkit-transform: rotate(270deg);
}

main .image-column{
	padding: 0em;
	margin: 0;
	width: 100%;
	height: 60vw;
}

.image-column{
	margin: 0;
    padding: 0;
    width: 55%;
    height: all;
    display: flex;
    overflow: hidden;
    position: relative;
}

#changingImage{
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
}

#changingImage:hover,
#changingImage2{
	cursor: pointer;
}

.object-fit-cover{
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.image-column .carousel-item img{
	height: 60vw;
}

.image-column2 .carousel-item{
	width: 50.35vw;
	height: 35vw;
}

.info-item{
	color: #fefefe;
}

.mov2,
.mov3,
.mov4,
.mov5{
	width: 100%;
}

.mov1,
.mov2,
.mov3,
.mov4,
.mov5{
    opacity: 0;
    transform: translateX(-4vw);
    transition: opacity 2s ease, transform 1.5s ease;
}

.mov1.show,
.mov2.show,
.mov3.show,
.mov4.show,
.mov5.show{
    opacity: 1;
    transform: translateX(0);
}

.info-item h1{
	padding: 0em;
	margin: -3vw 0em;
	margin-bottom: 32vw;
	width: 100%;
	font-size: 14vw;
	font-weight: bolder;
}

/*.info-column .info-column-title h3{
	margin-bottom: 15vw;
	font-size: 4.5vw;
	text-align: left;
}*/

#info-column-Tip2 h4,
#info-column-Tip3 h4,
#info-column-Tip4 h4{
	line-height: 6vw;
}

/*.info-column #info-column-Tip h4{
	font-size: 2.5vw;
	text-align: left;
	line-height: 3vw;
	font-weight: lighter;
}*/

/*.info2Text{
	height: 35vw;
	margin-bottom: 20em;
}
.infoText{
	display: flex;
	height: 100%;
	align-items: center;
}*/

.info-column h2{
	margin: 0em;
	padding: 0em;
	width: 85%;
	height: 100%;
	display: flex;
	text-align: right;
	justify-content: flex-end;
	font-size: 3.25vw;
	line-height: 3vw;
}

.info-column h3{
	font-size: 3vw;
	padding: 2vw;
}

.info-column #info-column-Tip5 p{
	text-align: center;
}

#info-column-Tip2,
#info-column-Tip3,
#info-column-Tip4{
	margin: 0 2.5vw 0 0;
}

.image-column img:hover,
.image-column2 img{
	cursor: pointer;
}

.image-column2{
	width: 100%;
	height: 100%;
	display: flex;
}

.mov6{
	height: 10vw;
	transform: translateX(-40px);
	opacity: 0;
    transition: opacity 2s ease, transform 1.5s ease;
}

.mov7,
.mov8{
    opacity: 0;
    transition: opacity 2s ease, transform 1.5s ease;
    transform: translateY(40px);
}

.mov6.show{
    opacity: 1;
    transform: translateX(0);
}

#changingImage2{
	width: 100%;
	height: 100%;
    object-fit: cover;
}

.boxes{
	margin: 4vw auto 0 ;
	padding: 0 5.8vw 0 5.8vw;
    width: 100%;
    height: auto;
}

.column-layout .row{
    flex-direction: column;
}

.containerbox{
	margin: 0.5em auto;
	width: 100%;
    height: auto;
    overflow: hidden;
    display: flex;
    align-items: center;
    background-color: #202222;
    justify-content: center;
    -webkit-transition: max-height 0.3s ease-in-out;
    position: relative;
}

.containerbox p{
	color: #fefefe;
}

.containerbox.expanded{
    width: 150%;
    justify-content: center;
    flex-direction: column;
}

.titleBox{
	position: absolute;
	margin: 0;
	margin-left: 1vw;
	width: auto;
    padding: 1vw;
    color: #202222;
    background-color: #fefefe;
    text-align: center;
    font-size: 1.25vw;
    font-weight: bolder;
    border-radius: 0.5em;
}

.titlesInerBox{
	margin: 1vw 0 1vw 1vw;
	padding: 1em 0 1em 0;
	border: 0.3em solid #fefefe;
	border-style: none none none solid; 
}

.title,
.subtitle{
	margin: 0 0 0 1vw;
	font-size: 1.3vw;
}

.title p{
	font-weight: bolder;
	font-size: 1.5em;
}

.subtitle p{
	font-size: 1em;
	font-size: bolder;
}

.infoBox{
	margin: 0 0 0 -0.25em;
	padding: 0;
	width: 50vw;
	height: auto;
	border: 0.3em solid #fefefe;
	border-style: none; 
    display: none;
    text-align: center;
	position: relative;
	margin-top: 20px;
}

.col-title{
	width: 25%;
	height: 10em;
}

.col-title h3{
	margin: 0 0 0 1.25vw;
	color: #fefefe;
	text-align: left;
	font-size: 3.5vh;
	font-weight: bolder;
}

.col-title h4,
.col-title h5{
	margin: 0 2vw 0 0;
	padding: 0 0 0 1.5vw;
	width: 10vw;
	height: auto;
	border: 4px solid #fefefe;
	border-style: none none none solid; 
	color:#fefefe;
	text-align: left;
}

.col-title h4{
	font-size: 2.25vh;
	font-weight: bold;
}

.col-title h5{
	font-size: 2vh;
	font-weight: lighter;
}

.col-title .art2{
	margin: 0;
	padding: 0;
	width: auto;
	height: auto;
	font-size: 1em;
}

.col-title img{
	margin: 0 0 7vw 0;
	width: 22vw;
	height: auto;
}

.toggleButton{
    position: absolute;
    top: 3.5vw;
    right: 1.5vw;
    border: none;
    background-color: #313333;
    color: #535555;
    border-radius: 50%;
    width: 1.5em;
    height: 1.5em;
    cursor: pointer;
    font-size: 2em;
}

/*.show {
    display: block;
}*/


section{
	padding: 0em;
	margin: 0em;
	width: all;
	height: auto;
	margin-top: 8vw;
	text-align: center;
}

section h2{
	padding: 3vw 0 3vw 0;
	margin: 0em;
	margin-bottom: 4vw;
	width: 100%;
	background-color: #202222;
	color: #fefefe;
	font-size: 4vw;
	font-weight: lighter;
}

.sectObraIcon{
	width: 90%;
	margin: auto;
}

.sectIcon img{
	padding: 1vw 1vw 1vw 1vw;
	width: 100%;
	height: 100%;
	display: flex;
}

.sectObraIcon h6{
	color: #fefefe;
	padding: 0.25vw;
	font-size: 1.25vw;
}

.sectObraIcon .sectValue h6{
	font-weight: lighter;
}

.progressBar{
	padding: 0;
	margin: 6vw auto 9vw auto;
	width: 90%;
	height: 4.5vw;
	align-items: center;
	justify-content: center;
	display: flex;
	position: relative;
}

.progressBar progress{
	width: 96%;
	height: 100%;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 5vw;
	border-color: transparent;
	background-color: #404040;
}

.progressBar progress::-webkit-progress-bar{
	background-color: #404040;
	border-radius: 5vw;
}

.progressBar progress::-webkit-progress-value{
	background-color: #202020;
	border-radius: 5vw;
}

.progressBar progress[value]::-moz-progress-bar{
	background-color: #202020;
	border-radius: 5vw;
}

.progressText{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fefefe;
	font-weight: lighter;
	font-size: 2vw;
	z-index: 1;
}

footer{
	margin: auto;
	padding: 0;
	width: 100%;
	max-width: 100%;
	height: auto;
}

.footer-content{
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	display: flex;
	background-color: #202222;
}

.footer-container-fluid{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	display: flex;
}

.footerBox{
	margin: 0 5em 0 5em;
	padding: 0;
	width: auto;
	height: auto;
	display: flex;
	flex-direction: row;
}

footer ul{
	padding: 0;
	margin: 0 3vw 0 3vw;
	width: auto;
	list-style: none;
}

footer ul h4{
	margin: 1.5em 0 0 0;
	padding: 0;
	color: white;
	font-size: 3vw;
	text-align: left;
	font-weight: lighter;
}

footer ul #h4Bold{
	margin: 0;
	color: white;
	font-size: 3vw;
	font-weight: bolder;
}

footer ul p{
	margin: 1em 0 0 0;
	font-size: 1.5vw;
	color: white;
}

footer .dark-logo{
	margin: 0 0 0 3vw;
}

footer .dark-logo a{
	padding: 0;
	margin: 0;
	width: auto;
	height: auto;
	justify-content: center;
	align-self: center;
	align-items: center;
	text-align: center;
}

footer .dark-logo a i{
	margin: 0 0.5em 0 0;
	padding: 0;
	width: auto;
	height: 3vw;
	font-size: 3vw;
}

.footerBox img{
	margin-top: -3vw;
	margin-right: 0;
	padding: 0;
	width: 25vw;
}

.circle:hover{
	cursor: pointer;
}

.whatsapp-btn{
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #25d366;
    color: #fff;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    text-align: center;
    line-height: 60px;
    font-size: 40px;
    text-decoration: none;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    z-index: 9999;
}

.whatsapp-btn:hover{
	color: grey;
    background-color: #009000;
}

#modalImageContainerBanner{
	padding: 0;   
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

#modalImageContainerBanner .carousel-inner .carousel-item{
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 25em;
}

#modalImageContainer{
	padding: 0;   
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7); 
    display: hide;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

#modalImage{
    max-width: 80%; 
    max-height: 80vh; 
}

#modalImage1{
    width: auto; 
    height: 45vw; 
}

#modalImage2{
    width: auto; 
    height: 45vw; 
}
/*#modalImage2 {
    width: 60vw; /* Establece el ancho máximo de la imagen */
/*    height: auto; /* Establece la altura máxima de la imagen para que se ajuste a la pantalla */
/*}*/

.modal{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center;
    z-index: 1;
}

.modal-content{
    display: flex;
    background: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center;
    height: 100%;
    margin: 0 auto;
    padding: 5vw;
}

.clickable-img{
    cursor: pointer;
}

.image-container{
    display: flex;
    overflow-x: scroll;
    width: 100%;
}

.image{
    width: 100vw;
    height: auto;
}

section .brochureContainer{
	padding: 0vw;
	margin: 0vw 0vw 9vw 0vw;
	width: auto;
	height: 30vw;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	background-image: url("../img/intiIII-img/imgManos1.jpg");
	background-size: cover;
	background-position: center 70%;
	filter: grayscale(100%);
	position: relative;
}

section .brochureContainer::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	transition: background-color 3s ease;
}

section .brochureContainer:hover::before{
	background-color: rgba(0, 0, 0, 0.8);
}

section .brochureContain a{
    margin: 0px;
    padding: 0vw 10vw 0vw 10vw;
    width: 100%;
    height: 30vw;
    display: flex;
    text-decoration: none;
}

section .brochureContain a h2{
    padding: 22vw 0vw 2.5vw 0vw;
    width: 100%;
    display: flex;
    margin: 0;
    font-size: 5vw;
    color: #fefefe;
    background-color: transparent;
    text-align: center;
    font-weight: bolder;
    z-index: 5;
}

footer .formulario{
	margin: 2vw 0 2vw 0;
	width: 80%;
	height: auto;
}

footer .formulario #nombre,
footer .formulario #telefono,
footer .formulario #email{
	height: 2vw;
	background-color: transparent;
}

footer .formulario #mensaje{
	height: 8vw;
	background-color: transparent;
}

.form-control{
	font-size: 1.25vw;
}

.form-control{
	color: #ced4da;
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0;
    border-bottom: 1px solid #555;
}

.form-control::placeholder{
	color: #555;
}

.form-control:focus{
    box-shadow: none;
    color: #ced4da;
    border-color: #ced4da;
}

.btn-custom{
	font-size: 1vw;
    background-color: #222222; 
    border-color: #222222;
    color: #555; 
    border-radius: 12px;
}

.btn-custom:hover{
    background-color: #444744; 
    border-color: #444744; 
    color: #fff; 
}



@media (max-width: 454px) and (min-width: 280px){ /*MEDIDA PARA FORMATO DE PANTALLA PEQUEÑO*/

img{
	margin: auto;
	padding: 0;
	width: 50%;
}

main .container-fluid{
	margin: 2em 0 2em 0;
}

.nav-item{
	width: 25%;
}

.nav-item a{
	font-size: 2vw;
}

.mainVideoContainer{
	margin: 0em;
}

.infoMapRow{
	padding: 0px;
	margin: 0px;
	flex-direction: column;
	width: 100%;
	height: 100%;
	align-items: center;
}

.infoMapCol{
	width: 100%;
	height: auto;
}

.infoMapCol .mapa{
	margin: 2vw 0 10vw 0;
	height: 60vw;
}

.infoMapCol .container-fluid p{
	margin: 0em;
	height: auto;
	font-size: 4vw;
}

#soldadoDiv{
	height: 90vw;
}

#soldadoDiv2{
	padding: 0em;
	justify-content: center;
	text-align: center;
	align-items: center;
	width: 100%;
	height: 100%;
	flex-direction: column;
}

#soldadoDiv .info-column,
#soldadoDiv .image-column .carouselExampleControls{
	height: 21.28em;
}

#soldadoDiv2 .info-column{
	margin: 0 0 6.7em 0;
}

.image-column{
	width: 100%;
	height: 500%;
}

.info-column h1{
	margin: -3vw 0 59vw 0;
}

/*.info-column h2{
	font-size: 6vw;
	line-height: 6vw;
}*/

.info-column .info-item p{
	font-size: 3vw;
}

#info-column-Tip1{
	width: 100%;
	height: 90vw;
}

#info-column-Tip1 h4{
	margin: 56vw 0 0 0;
	font-size: 5vw;
}

.mov1{
    opacity: 0;
    transform: translateX(0vw);
    transition: opacity 2s ease, transform 1.5s ease;
}

.mov1.show{
    opacity: 1;
    transform: translateX(0px);
}

main .image-column{
	padding: 0em;
	margin: 0em;
	width: 100%;
	height: 90vw;
}

.image-column .carousel-item img{
	height: 90vw;
}

.image-column2 .carousel-inner{
	width: 86.5vw;
	height: 45vw;background-color: red;
}

.image-column2 .carousel-item{
	margin: -20vw 0 0 0;
	width: 100%;
	height: auto;
}


.info-column h2{
	margin: 0em;
	padding: 0em;
	width: 86.5vw;
	height: auto;
	justify-content: flex-end;
	font-size: 5vw;
	line-height: 1em;
}

.boxes{
	margin: 1.5em 0 1.5em 0;
	padding: 0;
}

.containerbox{
	width: 100%;
	justify-content: flex-start;
}

.containerbox .titleBox{
	margin: 1vw 2vw 1vw 3vw;
	padding: 3vw;
	font-size: 3vw;
}

.containerbox .titlesInerBox .title p{
	margin-top: 5vw;
	font-size: 6vw;
}

.containerbox .titlesInerBox .subtitle p{
	font-size: 5vw;
}

.containerbox .toggleButton{
	margin: 10vh 0 0 0;
	font-size: 5vw;
}

.containerbox .titlesInerBox{
	margin: 2em 0 2em 0.5em; 
	padding: 1em;
	height: auto;
	border: 0.2em solid #fefefe;
	border-style: none none none solid; 
}

.containerbox{
	padding: 0;
}

.infoBox .additionalInfoBox{
	flex-direction: column;
	height: auto;
}

.infoBox .col-title{
	margin: 0;
	width: 100%;
	text-align: center;
	margin-bottom: 0px;
}

#col-titleArt1,
#col-titleArt3,
#col-titleArt5,
#col-titleArt7,
#col-titleArt9,
#col-titleArt11{
	margin-bottom: -15vw;
}

#col-titleArt2,
#col-titleArt4,
#col-titleArt6,
#col-titleArt8,
#col-titleArt10,
#col-titleArt12{
	margin-bottom: -5vw;
}

.col-title .art2 h4,
.col-title .art2 h5{
	margin: 0 0 0 1.5vw;
	padding: 0;
	width: 100%;
	border-style: none;
}

.col-title img{
	width: 65%;
	height: auto;
	margin-top: -3em;
	margin-left: auto;
}

#carouselExampleControls .carousel-control-prev,
#carouselExampleControls .carousel-control-next{
	display: none;
}

#modalImageContainerBanner,
#modalImageContainer{
	padding: 0;
}

.sectObraIcon{
	flex-direction: inherit;
	align-items: center;
	justify-content: center;
	text-align: center; 
}

.sectObraIcon .sectIcon img{
	padding: 0px;
	margin: auto;
	width: 10vw;
}

.sectObraIcon .sectTitle{
	margin: auto;
	width: auto;
	text-align: center;
	align-items: center;
	justify-content: center;
}

.sectObraIcon .sectTitle h6{
	font-size: 0.35em;
}

.sectObraIcon .sectValue h6{
	font-size: 1em;
}

.progressBar{
	height: 2em;
}

.progressBar progress::after{
	font-size: 3vw;
}

.additionalInfoBox{
	margin: 0 0 9vw 0;
}

.additionalInfoBox img{
	margin: 2vw 0 0 2vw;
}

#modalImage{
    width: 100%;
    height: auto;
    transform: rotate(90deg);
}

#modalImage1{
    width: 80%; 
    height: auto; 
}

#modalImage2{
    width: 100%; 
    height: auto; 
}

section .brochureContainer{
	height: 12.5em;
	display: flex;
	text-align: center;
}

section .brochureContain a{
	margin-bottom: 1em;
	width: 95vw;
	height: auto;
}

section .brochureContain a h2{
    padding: 18vh 0em 0em;
    margin: 0;
    font-size: 7vw;
}

footer{
	margin: 0;
}

.footerBox ul{
	width: 100%;
}

footer ul h4,
footer ul #h4Bold{
	width: 100%;
	font-size: 1.5em;
}

footer ul p{
	margin: 1em 0 0 0;	
	font-size: 4vw;
}

.footerBox .formulario{
	margin: 0;
}

.footerBox .formulario form{
	margin: 0;
	width: 100%;
}

.footerBox .dark-logo{
	margin: 3vw 0 3vw 0;
	height: auto;
}

.footerBox .dark-logo a{
	margin: 5vw 1vw 5vw 1vw;
	font-size: 6vw;
	height: auto;
}

.footerBox .dark-logo a i{
	width: auto;
	height: 1em;
	font-size: 2em;
	margin: 1em 0.25em 0 0.25em;
	padding: 0;
}

.footerBox img{
	width: 80vw;
}
}



@media (min-width: 455px) and (max-width: 767px){ /*MEDIDA PARA FORMATO DE PANTALLA TABLET*/

img{
	margin: auto;
	padding: 0;
	width: 50%;
}

.nav-item{
	width: 25%;
}

.nav-item a{
	font-size: 2vw;
}

.boxes{
	margin: 3em 0 5em 0;
	padding: 0 2em 0 2em;
}

.containerbox{
	width: 100%;
	justify-content: flex-start;
}

.infoBox{
	margin: 0 0 0 -0.25em;
	padding: 0;
	width: all;
	height: auto;
	border: 0.3em solid #fefefe;
	border-style: none none none solid; 
    display: none;
    text-align: center;
	position: relative;
	margin-top: 20px;
}

.containerbox .titleBox{
	margin: 1vw;
	padding: 1vw;
	font-size: 3vw;
}

.containerbox .titlesInerBox .title p{
	font-size: 5vw;
}

.containerbox .titlesInerBox .subtitle p{
	font-size: 3vw;
}

.containerbox .titlesInerBox{
	margin: 1.5em 0 1.5em 0.5em;
	padding: 0;
	padding-right: 3em;
}

.containerbox .toggleButton{
	margin: 3.5vh 0 0 0;
	font-size: 5vw;
}

#soldadoDiv2{
	width: 100%;
}

.info-column h2{
	width: 26.5vw;
	font-size: 2.75vw;
	margin: 0;
	padding-right: 1vw;
}

.image-column2 .carousel-item{
	width: 100%;
}

.image-column2 .carousel-inner{
	width: 60vw;
	height: 35vw;
}

.col-title h3{
	width: 15vw;
}

.col-title h4,
.col-title h5{
	margin: 0 5vw 0 5vw;
	width: 20vw;
	height: auto;
}

.col-title h5{
	font-size: 2.75vw;
}

.col-title img{
	width: 18vw;
	height: auto;
	margin-left: 18vw;
}

.footerBox .dark-logo{
   	margin: 3em 0 0 0;
}

.footerBox img{
	margin: 1em 0 0 0;
	width: 20em;
}

.footer-container-fluid{
	margin: auto;
	text-align: center;
	align-self: center;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

footer ul h4{
    font-size: 1.3em;
	margin: 1.5em 1.5em 0 0;
	justify-content: center;
}

footer ul #h4Bold{
 	font-size: 1.3em;
}

footer ul li{
	margin: 0 1em 0 0;
	padding: 0 0 0 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

footer ul p{
	margin: 1em 1em 0 0;
	padding: 0;
	width: auto;
	height: auto;
	display: flex;	
	justify-content: center;
	text-align: center;
	font-size: 1em;
}
}

@media (min-width: 420px) and (max-width: 870px){

.sectIcon,
.sectTitle,
.sectValue{
	margin: auto;
	width: 6vw;
}

}

@media (min-width: 768px) and (max-width: 852px) { /*MEDIDA PARA FORMATO DE PANTALLA GRANDES*/

nav img{
	width: 275px;
}

}

@media (max-width: 767px) { /*MEDIDA PARA FORMATO DE PANTALLA GRANDES*/


.titleBox{
	position: relative;
}

.footerBox{
	width: 80vw;
	margin: 0 1em;
    text-align: center;
    align-self: center;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.footer-container-fluid{
	margin: auto;
	text-align: center;
	align-self: center;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

footer ul{
	margin-left: 0em;
	width: 100%;
}

footer ul h4{
	margin: 1.5em 0 0 0;
	text-align: center;
}

footer ul li{
	margin: 0em;
	padding: 0em;
	display: flex;
	align-items: center;
	justify-content: center;
}

footer ul p{
	margin: 1em 0 0 0;
	padding: 0;
	width: 100%;
	height: auto;
	display: flex;	
	justify-content: center;
	text-align: center;
	font-size: 2.5vw;
}

footer .formulario{
	margin-bottom: 3vw;
}

footer .formulario form{
	margin: 0 3em;
	height: auto;
}

footer .formulario input,
footer .formulario textarea,
footer .formulario button{
	font-size: 1em;
}

.footerBox .dark-logo a i{
	margin: 0 1vw;
	font-size: 6vw;
	height: auto;
}

.footerBox a img{
	margin: 2vw; 
	width: 50%;
}

}