
/* general style for the form */
.nl-form {width: 100%;margin-left: 7px;position: relative;}

.nl-form ul {list-style: none;margin: 0;padding: 10px 0;border-radius: 4px;min-width: 290px;}

/* normalize the input elements, make them look like everything else */
.nl-form input,
.nl-form select,
.nl-form button {
	border: none;
	background: transparent;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	font-weight: inherit;
	line-height: inherit;
	display: inline-block;
	padding: 0;
	margin: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.nl-form input:focus {outline: none; }

/* custom field (drop-down, text element) styling  */
.nl-field {display: inline-block; position: relative; }

.nl-field.nl-field-open {z-index: 1000; }

/* the toggle is the visible part in the form */
.nl-field-toggle,
.nl-form input,
.nl-form select  {
	line-height: inherit;
	display: inline-block;
	color: #0057ff!important;
	cursor: pointer;
	font-weight: inherit;
}


.nl-form::after{
    content: '\f107';
    transition: .3s;
    font-family: "Font Awesome 5 Pro";
    position: absolute;
    right: -10px;
    top: 9%;
    font-size: 16px;
    color: #0057ff;
    }


/* drop-down list / text element */
.nl-field ul {
	position: absolute;
	visibility: hidden;
	background: #fff;
	left: 0px;
	top: 50%;
	
	opacity: 0;
	-webkit-transform: translateY(-40%) scale(0.9);
	-moz-transform: translateY(-40%) scale(0.9);
	transform: translateY(-40%) scale(0.9);
	-webkit-transition: visibility 0s 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: visibility 0s 0.3s, opacity 0.3s, -moz-transform 0.3s;
	transition: visibility 0s 0.3s, opacity 0.3s, transform 0.3s;
box-shadow: 0 2px 6px rgb(95 108 114 / 3%), 0 0px 6px rgb(95 108 114 / 15%);}

.nl-field.nl-field-open ul {
	visibility: visible;
	opacity: 1;
	-webkit-transform: translateY(-50%) scale(1);
	-moz-transform: translateY(-50%) scale(1);
	transform: translateY(-50%) scale(1);
	-webkit-transition: visibility 0s 0s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: visibility 0s 0s, opacity 0.3s, -moz-transform 0.3s;
	transition: visibility 0s 0s, opacity 0.3s, transform 0.3s;
}

.nl-field ul li {color: #444; position: relative; }

.nl-dd ul li {padding: 10px 22px;cursor: pointer;white-space: nowrap;font-size: 20px;font-weight: 500;}
.nl-dd ul li:hover {background: #d9e8ff;}

.insights .with-soon .nl-dd ul li:nth-child(n+2) { pointer-events:none; opacity: 0.6;position: relative;font-weight: 400;}
.insights .with-soon .nl-dd ul li:nth-child(n+2)::after{content: 'Proximamente';position: absolute;right: 12px;font-size: 11px;font-weight: 400;top: 12px;border-radius: 12px;font-style: italic;}

 



.nl-dd ul li.nl-dd-checked {color: #0057ff; }


/* icons for some elements */
.nl-dd ul li.nl-dd-checked:before,
.nl-submit:before,
.nl-field-go:before {
	font-family: "Font Awesome 5 Pro";
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
}

.nl-dd ul li.nl-dd-checked:before {
	content: "\f00c";
	position: absolute;
	right: 20px;
	font-size: 17px;
	top: 12px;
}


@media screen and (max-width: 45em) {
	.nl-form {font-size: 3em; }
}

@media screen and (max-width: 25em) {
	.nl-form {font-size: 2em; }
}