@import "../media_multiple.css";

@media (max-width: 995px) {
	footer {
		margin-bottom: 0px !important; 
		}
	}

  @media (max-width: 767px) {
		
		.calculadora .progress { width: 80%; height: 26px; margin-top: 9rem;}
		.calculadora label { width: 55%;}
    label.checkbox-terminos {width: 100%;}

		.franja-2 {
				width: 95%;
		}
		
		.calculadora .closeimg {
			padding-right: 13px;
			margin-top: 0px;
			padding-top: 7px;
		}    
		.calculadora .btn {
			width: 90%;
			margin-top: 8px;
		}
	
		.calculadoraSection h3.subTitle {
			font-size: 16px;
			margin-bottom: 2rem;
		}
		.calculadoraSection .calculadoraContainer{
			max-width: 100%;
			height: auto;
			padding: .8rem;
		}
		.calculadoraSection .checkSelectCalc{
			display: flex;
			justify-content: center;
			flex-direction: column;
			align-items: center;
		}
		.calculadoraSection .calculadoraContainer .formArea .progress {
			width: 100%;
		}
		.calculadoraSection .slidecontainer p {
			margin-bottom: 1rem;
		}
		.calculadoraSection .slidecontainer .myRange {
			width: 85%;
		}
		.calculadoraSection .calculadoraContainer .formArea .inputForm > div{
			margin: 0;
		}
		.calculadoraSection .calculadoraContainer .formArea .inputForm{
			flex-direction: column;
		}
		.calculadoraSection .calculadoraContainer .formArea .inputForm input{
			margin-bottom: 8px;
			width: 100%;
		}
		.calculadoraSection .calculadoraContainer .formArea .inputForm{
			text-align: left;
		}
		.calculadoraSection .calculadoraContainer .formArea .terminos{
			margin-top: 20px;
			width: 85%;
			text-align: left;
		}
		.calculadoraSection .calculadoraContainer .formArea .calcButton{
			margin-top: 1rem;
			width: 35%;
		}
		.calculadoraSection .checkSelectCalc label{
			padding: 10px 1rem;
			margin-right: 0;
			margin: 0.7rem;
			align-items: center;
			width: 250px;
		}
		.calculadoraSection .calculadoraContainer .formArea .terminos label{
			width: unset;
		}
		.calculadoraSection .fase5 lottie-player {
			bottom: 18%;
			left: 17%;
			}
		.panel-001 .containerXP .col-6 {
			-webkit-box-flex: 0;
			-ms-flex: 0 0 50%;
			flex: 0 0 50%;
			max-width: 50%;
		}
		.calculadoraSection .oferta .num {
			border-right: none;
		}
		.calculadoraSection .oferta.open {
			flex-direction: column;
			align-items: flex-start;
		}
		.calculadoraSection .oferta.open {
			gap: 10px;
			margin-top: 10px;
		}
		.calculadoraSection .opcion-mantenimiento .checkmark {
			position: relative;
		}
		.calculadora .opcion-mantenimiento label {
			width: 95%;
			display: flex;
			justify-content: center;
		}	
}


@media (max-width: 575px) {
	.calculadoraSection .calculadoraContainer .formArea .formButtons {
    gap: 50%;
	}
}


@media (max-width: 450px) {
	header .menuButton {
    right: 23px;
	}
	.calculadoraSection .oferta.open {
    width: 99%;
    margin: auto;
	}
	.calculadora label {
    width: 100%;
	}
	.calculadoraSection .calculadoraContainer .formArea .terminos {
    font-size: 14px;
	}
	.calculadoraSection .terminos .checkmark {
    top: 3px;
    height: 15px;
    width: 15px;
	}
	.calculadoraSection .oferta .text {
    font-size: 16px;
	}
	.calculadoraSection .terminos .checkmark:after {
    left: 5px;
    top: 1px;
    width: 5px;
    height: 10px;
	}
	.calculadoraSection .calculadoraContainer .formArea .formButtons {
    gap: 35%;
	}
	footer{
		position: absolute;
	}
  .checkSelectCalc label.compania .compania {
    width: 170px;
  }
}

@media (max-width: 375px) {
  .checkSelectCalc label.compania .compania {
    width: 140px;
  }
  .checkSelectCalc label.compania .compania {
    width: 130px;
  }
}

@media (max-width: 325px) {
  /* CALCULADORA 330 */
  .calculadoraSection {
    padding-top: 13% !important;
  }
  .calculadoraSection .calculadoraContainer .formArea .terminos {
    width: 80%;
  }
  .checkSelectCalc label.compania .compania {
    width: 123px;
  }
}