:root {
	--color-primario: #E31770;
	--color-secundario: #F0CC12;

	--color-complement1: #EE7F0C;
	--color-complement2: #197BBE;

	--color-gray1: #EDEDED;
	--color-gray2: #D4D4D4;
	--color-gray3: #A6A6A6;
	--color-gray4: #5E5E5E;

	--color-aprobado: #40BA5B;
	--color-aprobado-light: #BCEEBB;

	--color-error: #FC0000;
	--color-error-light: #F6CACA;

	--shado1: ;
	--shado2: ;
	--shado3: ;
}


* {font-family: "Roboto Condensed", sans-serif; box-sizing: border-box; line-height: 1.3;}
body {font-size: 19px; font-weight: 400;}
.separador {display: flex; flex-wrap: wrap; gap: 20px; width: 90%; max-width: 500px; padding: 60px 0px; margin: auto; border-bottom: 1px solid black;}




/* TITULOS */
h1 {width: 100%; display: flex; align-items: flex-start; font-size: 45px; gap: 4px; text-wrap: balance; font-weight: 700; }
.ico-h1 {font-size: 36px; margin: 6px 0px 0px 0px; }
h2 {width: 100%; display: flex; align-items: flex-start; font-size: 30px; gap: 2px; text-wrap: balance; font-weight: 700; }
.ico-h2 {font-size: 23px; margin: 5px 0px 0px 0px; }
h3 {width: 100%; display: flex; align-items: flex-start; font-size: 20px; gap: 2px; text-wrap: balance; font-weight: 700; }
.ico-h3 {font-size: 16px; margin: 3px 0px 0px 0px; }



/* BOTONES */
.bt1 {display: flex; background: var(--color-primario); color: white; align-items: flex-start; width: 100%; padding: 12px 17px; border-radius: 16px; cursor: pointer; transition: .2s; }
.bt1:hover {background: gray; transform: scale(1.02); box-shadow: 0px 15px 20px -9px rgba(0, 0, 0, .6); }
.bt1:active {transform: scale(.99); box-shadow: 0px 0px 0px -9px rgba(0, 0, 0, .6); }
.ico-de92 {margin: 0px 0px 0px 0px; }



/* VIÑETAS Y CHEKS*/
.p1 {display: flex; align-items: flex-start; text-wrap: balance; width: 100%; }
.ico-p1 {font-size: 16px; margin: 2px 0px 0px 0px; }
.check {margin: 10px 0px 0px 0px;}
input[type="checkbox"] {display: none;}
input[type="checkbox"] + label {cursor: pointer;}
.check-label {font-weight: 400; font-size: 19px; display: flex; align-items: flex-start;}
input[type="checkbox"]:checked + .check-label:before {content: ""; background-color: red;}
input[type="checkbox"]:checked + .check-label {color: red;}
input[type="checkbox"]:checked + label:before {content: ""; border: 1px solid red; background-color: var(--color-primario);}
.check-label:before {content: ""; background: transparent; border: 1px solid var(--color-gray1); background-color: white;  border-radius: 4px; display: inline-block; vertical-align: middle; margin: 2px 4px 0px 0px; height: 14px; text-align: center; width: 14px;}
.check-txt {width: 95%;}



/* ACORDEON */
.check-acordeon {position: absolute;	opacity: 0;}
.tab {width: 100%;	color: white;	overflow: hidden;}
.tab-label {display: flex;	justify-content: space-between;	padding: 10px 12px;	background: var(--color-primario);	font-weight: 500;	cursor: pointer;	border-radius: 7px;	transition: var(--transition250);   /* Icon */}
.tab-label:hover {background: var(--color-secundario);}
.tab-label::after {content: "\276F";	width: 20px;	height: 20px;	text-align: center;	transition: all 0.35s;}
.tab-content {max-height: 0;	padding: 0px 10px;	color: black;	transition: all 0.35s;}
.tab-close:hover {background: #14b8a6;}
input:checked + .tab-label {background: var(--color-secundario);}
input:checked + .tab-label::after {transform: rotate(90deg);}
input:checked ~ .tab-content {max-height: 100vh;	padding: 10px 10px 20px 10px;}
.acordeon .tab-label {border-radius: 12px; transition: .2s;}
.acordeon h2 {font-weight: 500; font-size: 18px;}
.acordeon input[type="checkbox"]:checked + label:before {border: 0;}
.acordeon input:checked + .tab-label {background: gray;}
.acordeon .tab-label:hover {background: gray;}



/* FORMULARIO */
.hs-form-field {position: relative; width: 100%;}
.hs-form-field label {display: block; position: absolute; top: 8px; left: 5px; transform: translate(0, 0) scale(1); transform-origin: bottom left; transition: all 250ms ease; padding: 4px 13px; color: black; }
.hs-form-field.active label {transform: translate(0, -1.5rem) scale(0.88); background: white; z-index: 2; padding: 4px 9px; top: 7px; left: 9px; color: #c49308; }
.hs-input {width: 100%; text-transform: lowercase; border: 1px solid black; color: black; padding: 10px 25px; -webkit-appearance: none; font-size: 20px; background: transparent; position: relative; border-radius: 13px; }
.hs-input.active {border-color: #c49308; }
.hs-input:focus {outline: 0 none; border-color: #c49308; color: #c49308;}
.hs-form-field.active .hs-input {border: 1px solid #c49308;}
.lista-desp {width: 100%; border: 1px solid black; background: white; font-size: 18px; height: 46px; border-radius: 13px; padding: 0px 10px; padding: 0px 10px 1px 17px; font-weight: 400; display: flex; align-items: center; -moz-appearance: none; -webkit-appearance: none; appearance: none; background-image: url('../images/down.svg'); background-repeat: no-repeat, repeat; background-position: right 0.8em top 50%, 0 0; background-size: .65em auto, 100%; }
.campoForm {width: 100%; display: flex; align-items: center; }
.campoForm1 {border: 1px solid black; width: 100%; font-size: 18px; font-weight: 400; padding: 10px 45px 10px 10px; border-radius: 10px; color: black; transition: .2s; }
.campoForm1:focus {transform: scale(1.01); box-shadow: 0px 10px 20px -10px rgba(0, 0, 0, .6); border: 1px solid var(--color-primario-dark); background: white; color: var(--color-primario-dark); }
.campoForm1:focus::placeholder {color: var(--color-primario-dark); }
.ico-dd362 {font-size: 24px; margin: 0px 0px 0px -35px; }


/* POP CON JS */
.pop1 {width: 100%; height: 100dvh; position: fixed; top: 0; background: rgba(0,0,0,0.8); display: flex; justify-content: center; align-items: center; }
.pop-close {color: white; position: fixed; top: 20px; right: 20px; font-size: 50px; cursor: pointer; }
.pop1-wrap {width: 88%; height: auto; max-height: 90dvh; max-width: 500px; background: white; padding: 30px; border-radius: 40px; }

.pop1-wrap {transform: translateY(-100px); opacity: 0; transition: .3s 0s;}
.pop1Entra-wrap {transform: translateY(0px); opacity: 1; transition: .5s .1s;}

.pop1 {opacity: 0; visibility: hidden; transition: .4s .2s;}
.pop1Entra {opacity: 1; visibility: visible; transition: .3s 0s;}


/* SCROLL  */
body::-webkit-scrollbar {width: 15px; transition: .2s; overflow: auto; }
body::-webkit-scrollbar-track {background: gray; transition: .2s; }
body::-webkit-scrollbar-thumb {transition: .2s; background: black; border-radius: 20px; }











@media screen and (max-width: 1400px) {
.cl-normal {width: 900px;margin: auto;}
h1 {font-size: 38px;}
}

@media screen and (max-width: 960px) {
.cl-normal {width: 600px;margin: auto;}
h1 {font-size: 33px;}
.ico-h1 {font-size: 26px;}
}

@media screen and (max-width: 650px) {
.cl-normal {width: 300px;margin: auto;}
}












