@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fjalla+One&display=swap');
html {
    scroll-behavior: smooth;
}
.g-5, .gx-5 {
    --bs-gutter-x: 6rem;
}
.fjalla-one-400 {
    font-family: "Fjalla One", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}
.roboto-light {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: normal;
}
.roboto-regular {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: normal;
}
.roboto-medium {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
}
.roboto-bold {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
}
.roboto-light-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: italic;
}
.roboto-regular-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: italic;
}
.roboto-medium-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: italic;
}
/*  -----------------------   GLOBAL  -----------------------  */
body {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
}
/*  -----------------------   CUSTOMIZE THE CAROUSEL -----------------------  */
.carousel .carousel-item img {
    max-height: 550px;
    min-width: auto;
	object-fit: cover;
    object-position: top center;
}
.carousel-caption {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 10;
    text-align: left;
    flex-direction: column;
    justify-content: center;
    width: 82.5%;
}
.carousel-caption h1, .carousel-caption h6, .carousel-caption p {
    width: 65%;
}
.carousel-caption .lead {
    font-size: 21px !important;
}
.carousel-item {
    transition: transform 0.700s ease-out;
}
.shadow-img {
    background: rgba(0, 0, 0, 0.30);
}
.carousel-indicators {
    display: none !important;
}
.carousel-indicators [data-bs-target] {
    text-indent: inherit;
    color: #ffffff;
    height: auto;
    background-color: transparent;
}
.carousel-control-prev-icon {
    margin-left: -12.5px;
}
.carousel-control-next-icon {
    margin-right: -12.5px;
}
.controls {
    display: none !important;
}
.carousel-item::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.25) 40%), linear-gradient(278deg, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.25) 0%);
}
section {
    margin-top: 4rem;
    margin-bottom: 4rem;
}
section.bg-warning {
    padding-top: 3rem;
    padding-bottom: 4rem;
	
}

section.campo-traslado {
	background-image: url("../img/lines.svg");
	background-repeat: no-repeat;
	background-position: top  right 100px;
	background-size: 15%;
}

section.tecnicos-especializados .card-body {
	
	display: flex;
	flex-direction: column;
}
/*section.bg-warning::after {
    content: '';
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    background: linear-gradient(100deg, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.2) 0%);
}*/
section.clientes {
	
	background: #d9d9d9;
    background-image: linear-gradient(100deg, rgba(0, 0, 0, 0) 83%, rgba(0, 0, 0, 0.075) 0%);
}

.img-wrapper .background {
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    background: linear-gradient(100deg, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.25) 0%);
}
section.reparacion-retroexcavadoras {
    background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.25) 40%), linear-gradient(265deg, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.25) 0%), left bottom / cover no-repeat url("../img/reparacion-de-palas-y-retros.webp");
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 575px;
    padding-top: 3rem;
    padding-bottom: 3rem;
    display: flex;
    align-items: flex-end;
}
section.instalacion-fuerza-tec {
    background: transparent;
    background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.15) 40%), linear-gradient(265deg, rgba(0, 0, 0, 0) 85%, rgba(0, 0, 0, 0.25) 0%), center bottom / cover no-repeat url("../img/galpon-fuerza-tec-exterior.webp");
    background-size: cover;
    background-repeat: no-repeat;
    padding-top: 3rem;
    padding-bottom: 3rem;
}
section.clientes {
    padding-top: 5rem;
    padding-bottom: 7rem;
}
section.clientes img.logo {
    transition: filter.3s ease-in-out;
    max-width: 115px;
    filter: grayscale(100%);
}
section.clientes img.logo:hover {
    transition: filter.3s ease-in-out;
    filter: grayscale(0%);
}
footer.location-address {
    background: linear-gradient(81deg, rgba(0, 0, 0, 0) 75%, rgba(255, 255, 255, 0.2) 0%);
}
/*h2.chevron-yellow {
    padding-left: 25px;
    background-size: contain;
    background-repeat: no-repeat !important;
    line-height: 1.1;
    background-position: left top -2px;
    background: url("../img/chevron-right-yellow.svg");
}
h2.chevron-white {
    padding-left: 25px;
    background-size: contain;
    background-repeat: no-repeat !important;
    line-height: 1.1;
    background-position: left top -2px;
    background: url("../img/chevron-right-white.svg");
} */
h2.chevron-yellow {
    padding-left: 25px;
    line-height: 1.175;
    background: url("../img/chevron-right-yellow.svg");
    background-repeat: no-repeat !important;
    background-position: left top 5.5px;
    background-size: auto 72%;
}
h2.chevron-white {
    padding-left: 25px;
    line-height: 1.175;
    background: url("../img/chevron-right-white.svg");
    background-repeat: no-repeat !important;
    background-position: left top 5.5px;
    background-size: auto 72%;
}
section.reparacion-retroexcavadoras h2 {
    padding-left: 90px !important;
    background-size: auto 90% !important;
    line-height: 1.175;
}
.scaling-clip-container {
    position: relative;
    height: 0;
    width: 100%;
    padding: 0;
    padding-bottom: 15%;
}
.scaling-clip {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
}
address {
    opacity: 0.85;
}
.bg-gris {
    background: #d9d9d9;
}
small, .small {
    font-size: 0.75em;
}
/*                                                               */
/***********************    MIN-WIDTH    *************************/
/*                                                               */
/* `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {}
/*`md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    .container {
        --bs-gutter-x: 2.5rem;
    }
    .g-5, .gx-5 {
        --bs-gutter-x: 1.5rem;
        --bs-gutter-y: 1.5rem;
    }
    /*a.navbar-brand {
        width: 100%;
        text-align: center;
    } */
    .img-isologo {
        max-width: 170px;
    }
    section {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }
    .nav-link {
        font-size: 13px;
    }
    .carousel-item::after {
        background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.25) 40%);
    }
    h2.chevron-yellow {
        padding-left: 32.5px;
		background-size: auto 82.5%;
    }
    h2.chevron-white {
        padding-left: 32.5px;
		background-size: auto 82.5%;
    }
	
	section.campo-traslado {

	background-position: top  right 40px;
	background-size: 35%;
}
	
	
}
/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {}
/*`xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {}
/*`xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {}
/*                                                               */
/***********************    MAX-WIDTH    *************************/
/*                                                               */
/* X-Large devices (large desktops, 1200px and up) */
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {}
@media (min-width: 1200px) {}
@media (min-width:1400px) {
    main .container, main .container-lg, main .container-md, main .container-sm, main .container-xl, main .container-xxl {
        max-width: 1220px;
    }
}