.img-1{
	height: 500px;
	overflow: hidden;
	display: flex;
	position: relative;
}
.img-1>div{
	position: absolute;
    bottom: 0;
    width: 100%;
    bottom: 3%;
    left: 3%;
}
.img-1>img{
	margin-top: -5%;
}
.img-1>div>p{
    color: var(--white);
    font-weight: bold;
    font-size: 2rem;
}
.boton-1{
	height: 70px;
}
.boton-1>button{
	background: rgb(9,83,129);
	background: linear-gradient(90deg, rgba(9,83,129,1) 18%, rgba(24,153,213,1) 100%);
	border: none;
}
.texto-1{
	margin-bottom: 80px;
}
.texto-1>p{
	color: var(--bluest);
	font-size: 2.5rem;
}
.icono{
	margin: 15px;
}
.icono>img{
	height: 80px;
}
.transporte>img{
	height: 50px;
}
.texto-i{
	margin: 15px;
}
.texto-i>p{
	margin-top: 10px;
	font-weight: bold;
	font-size: 1.3rem;
	text-align: center;
}
.img-2{
	overflow: hidden;
	display: flex;
}
.img-2>img{
	width: 100%;
}
.img-2>div{
	position: absolute;
    /*margin: 14% 15% 10% 53%;*/
    translate: 50% 50%;
    right: 30%;
}
.img-2>div>div>p{
    color: var(--white);
    font-weight: bold;
    font-size: 1rem;
    text-align: right;
    margin: 30px ;
}
.img-2>div>div>p>span{
	font-size: 1.4rem;
}
.boton-2>button{
	background-color: #EB2429;
	border: none;
}
.log{
	overflow: hidden;
}
.log>.fondo-1{
	position: absolute;
	z-index: -1;
	margin-top: -10%;
}
.control{
	/*padding: 50px;*/
}
.div-1{
	width: 100px;
	height: 10px;
	background: var(--red);
	position: absolute;
	right: 0;
	top: 0;
}
.div-2{
	width: 10px;
	height: 100%;
	background: var(--red);
	position: absolute;
	right: 0;
	top: 0;
}
.div-3{
	width: 100px;
	height: 10px;
	background: var(--red);
	position: absolute;
	right: 0;
	bottom: 0;
}
.lista-f>ul{
	margin-top: auto;
}


@media (max-width: 350px){
/*.img-1>img {
    margin-left: -140% !important;
	}*/
}
@media (max-width: 400px) {

.img-1>div>p {
    font-size: 1.1rem;
}
.img-1>img {
    margin-left: -50% !important;
}	
}
/* `sm` applies to x-small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {

	.img-1>img {
    margin-left: -25%;
	}
	.redes>span>i {
    font-size: 15px !important;
	}
	.header>div>span>a {
    font-size: 0.6rem !important;
	}
	.img-1>div>p {
    bottom: 100px;
    font-size: 1.1rem;
	}
}

@media (min-width: 576px) and (max-width: 767.98px) {
	/*.img-1>img {
    margin-top: 0%;
    margin-left: -10%;
	}*/
	.img-1>p {
    font-size: 1.5rem;
	}

}

/* `md` applies to small devices (landscape phones, less than 768px)*/
@media (max-width: 767.98px) {
	
	/*.img-1 {
    height: 400px;
	}*/
	
	.texto-1>p {
    font-size: 1.2rem;
    text-align: center;
	}
	.texto-i>p {
    font-size: 1rem !important;
	}
	.icono>img {
    height: 70px;
	}
	.transporte>img{
	height: 45px;
	}
	.control {
    padding: 0px;
	}
	.img-2>div>div>p {
    font-size: 0.7rem;
    text-align: right;
    margin: 0px;
	}
	.img-2>div {
    padding: 16px;
    width: 350px;
    translate: 50% 30%;
    right: 50%;
	}
	.img-2 {
    height: 300px;
	}
	.img-2>img {
    width: auto; 
	}
	.div-1 {
    height: 5px;
	}
	.div-2 {
    width: 5px;
	}
	.div-3 {
    height: 5px;
	}
	.boton-2>button {
    margin-top: 10px;
	}
} 

@media (max-width: 991.98px){
	.header {
    height: 100px;
	}
	.img-2{
		height: 330px;
	}
	.navbar-collapse {
    background: white;
    margin-top: -8px;
	}
	.nav-item{
		padding-left: 5px;
	}
	.boton-1>button{
		width: 200px;
	}
	.lista>ul{
		display: flex;
		font-size: 0.8rem;
		padding-left: 1rem;
		width: 100%;
	}
	.lista>ul>li {
    margin: 10px;
	}
	.texto-1 {
    margin-bottom: 15px;
	}
	.header>div>span>a {
    font-size: 0.8rem;
	}
	.redes>span>i {
    font-size: 20px;
	}
}

/* `lg` applies to medium devices (tablets, less than 992px)*/
@media (min-width: 768px) and (max-width: 991.98px) {
	
	.icono>img {
    height: 150px;
	}
	.texto-i>p {
    font-size: 2rem;
    text-align: center;
	}
	.texto-1>p {
    text-align: center;
	}
	.img-2>div {
    translate: 50% 10%;
    width: 450px;
	}
	
}

/* `xl` applies to large devices (desktops, less than 1200px)*/
@media (min-width: 992px) and (max-width: 1199.98px) {
	.img-2>div {
    translate: 50% 30%;
	}
}
@media (min-width: 1200px) {

}

/* `xxl` applies to x-large devices (large desktops, less than 1400px)*/
@media (min-width: 1400px) {

}
