/*Estilos especificos para formularios de cognito, salesforce, ...*/

/* Para form contacto SLF */
.contacto-slf .g-recaptcha{
	margin-top:20px;
}
.contacto-slf select * {	
 background-color: #f2f2f5;
	color:#666!important;
}

.contacto-slf select option {
	padding:8px 0;
}
.contacto-slf select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    padding: 0 1em 0 0;
    margin: 0;
    width: 100%;
    font-family: inherit;
    font-size: 16px;
    color: #666;
    cursor: inherit;
    line-height: inherit;
    z-index: 1;
    outline: none;
}
.contacto-slf select::-ms-expand {
  display: none;
}
.contacto-slf	.select {
	display: grid;
    grid-template-areas: "select";
    align-items: center;
    position: relative;
    height: auto;
    cursor: pointer;
    border-radius: 4px;
}

.contacto-slf .select select, .select::after {
  grid-area: select;
}
.contacto-slf .select::after {
    content: '\e801';
    font-family: ifema;
    font-weight: 800;
    color: #E32424!important;
    padding: 0;
    position: absolute;
    right: 8px;
    top: 6px;
    font-size: 24px;
    z-index: 1;
    text-align: center;
    height: 100%;
    pointer-events: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.contacto-slf select:focus + .focus {
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border: 2px solid var(--select-focus);
  border-radius: inherit;
}
.contacto-slf select[multiple] option {
  white-space: normal;
  outline-color: var(--select-focus);
}

.contacto-slf .select--disabled {
  cursor: not-allowed;
  background-color: #eee;
  background-image: linear-gradient(to top, #ddd, #eee 33%);
}
.contacto-slf .select + label {
  margin-top: 2rem;
}
.contacto-slf ::placeholder {
	font-family: 'Barlow';
	font-weight: 400;
	font-size: 16px;
}
.contacto-slf input {
  accent-color: #E32424;
}
 .contacto-slf label {
	display:block;
	font-family: 'Barlow';
	font-weight: 500;
	letter-spacing: 0;
	font-size: 16px;
	line-height: 19px;
	margin-bottom: 10px;
}
.contacto-slf input[type="text"],.contacto-slf input[type="tel"], .contacto-slf textarea, .contacto-slf select {
	width:100%;
    padding: 10px 16px;
	background: #F2F2F5;
	border: 1px solid #F2F2F5;
	border-radius: 4px;
	color:#666!important;
}
.contacto-slf input[type="text"]:focus,.contacto-slf input[type="tel"]:focus,.contacto-slf textarea:focus,.contacto-slf input[type="text"]:focus-visible,.contacto-slf textarea:focus-visible,.contacto-slf select:focus, .contacto-slf select:focus-visible {
	background: #F2F2F5;
	border: 1px solid #8322FA;
	border-radius: 4px;
	box-shadow: none;
	outline: none;
	    padding: 10px 16px;
}
.contacto-slf input[type="tel"]{
	padding: 10px 16px 10px 52px!important;
}
.contacto-slf input[type="radio"] {
	height: 18px;
	width: 18px;
	margin-right: 4px;
}
.contacto-slf .aceptacion input[type="checkbox"] {
	min-height: 18px;
	min-width: 18px;
	margin-right: 8px;
}
.contacto-slf textarea {
	height: auto!important;
}
.contacto-slf .form-fields {
	display: grid;
    grid-template-columns: 1fr 1fr;
	column-gap: 20px;
}
.contacto-slf .form-fields .input-content {
	margin-bottom: 20px;
}
.contacto-slf .input-submit {
	text-align: center;
}
.contacto-slf input[type="submit"] {
    font-weight: 600;
    color: #fff;
	background-color: #000;
	cursor: pointer;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #000;
	border-radius: 4px;
    padding: 0.75rem 2.1872rem;
    font-size: 1rem;
    line-height: 1.5;
    -webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    -o-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}
.contacto-slf input[type="submit"]:hover {
	color: #000;
	background-color: #fff;
}
.contacto-slf input[type="submit"]:disabled, .contacto-slf input[type="submit"]:disabled:hover {
	background-color: #e0e0e0;
	border: 1px solid #f2f2f5;
	color: #777777;
	cursor: default;
}
.contacto-slf .input-full {
	grid-column: span 2;
}
.contacto-slf .aceptacion label {
	display: block;
}
.contacto-slf .aceptacion input[type="checkbox"] {
	height: 18px;
	width: 18px;
    margin-right: 8px;
}
.contacto-slf .txt-aceptacion {
	font-size: 14px;
    line-height: 17px;
	font-weight: 400;
}
.iti {
	display: block;
}
.iti__country-list {
	overflow-y: scroll !important;
	-webkit-overflow-scrolling: touch !important;
}
.text-danger {
	color: #dc3545 !important;
	font-size: 14px;
	letter-spacing: .25px;
	margin-bottom: .5rem;
	font-weight: 500;
	line-height: 1.2;
	margin-top: 3px !important;
	display: block;
}
input.is-error,select.is-error{
	border: 1px solid #D81E1E !important;
    background: url(https://www.ifema.es/img/error/circle-error-v3.svg) center right no-repeat #F2F2F5 !important;
    background-size: 48px !important;
}
.iti__selected-flag {
    display: block;
    padding: 19px 11px 0 8px;
}
.iti__arrow {
    position: absolute;
    right: 0;
    top: 25px;
}
.iti__divider, .iti__preferred, .hide {
	display: none;
}
@media(max-width:768px) {
	.contacto-slf .form-fields {
		display: block;
	}
}
/* Fin form contacto SLF */

/* Inicio form cognito */
/*html .cog-form__container, :root:root:root:root:root .cog-form__container {
    margin-top: -50px;
}*/
html .cog-cognito--styled ::placeholder {
	color: #666!important;
	font-weight: 400!important;
}
html .cog-cognito--styled input {
    accent-color: #E32424 !important;
}
html .cog-cognito--styled label {
    letter-spacing: 0 !important;
    font-size: 17px !important;
    line-height: 21px !important;
    margin-bottom: 10px !important;
}
:root:root:root .cog-cognito--styled.cog-cognito--protect-css p,:root:root:root .cog-cognito--styled.cog-cognito--protect-css ul{
    font-size: 17px !important;
    line-height: 25.5px !important;
	margin:0 0 1rem!important;
}
:root:root:root .cog-cognito--styled.cog-cognito--protect-css li p{
	margin:0!important;
}
:root:root:root .cog-cognito--styled.cog-cognito--protect-css .cog-helptext p{
    font-size: 13px !important;
    line-height: 21px !important;
}

html .cog-cognito .el-select-dropdown__list li, :root:root:root:root:root .cog-cognito .el-select-dropdown__list li{
	background: #F2F2F5 !important;
}
html .cog-cognito .el-select-dropdown__list li:hover, :root:root:root:root:root .cog-cognito .el-select-dropdown__list li:hover{
	background: #e3e3e3 !important;
}
html .cog-cognito .el-select-dropdown__list li.selected, :root:root:root:root:root .cog-cognito .el-select-dropdown__list li.selected{
	background: #e3e3e3 !important;
	color:var(--highlight)!important;
}
html .cog-form legend, :root:root:root:root:root .cog-form legend {
    margin-bottom: 10px;
}
html .cog-input, :root:root:root:root:root .cog-input{
    padding-top: 0;
}
html .cog-cognito--styled input[type="text"], .cog-cognito--styled textarea, .cog-cognito--styled select, html .cog-signature canvas, :root:root:root:root:root .cog-signature canvas {
    padding: 10px 16px !important;
    background: #F2F2F5 !important;
    border: 1px solid #F2F2F5 !important;
    line-height: 25px !important;
	color: #000 !important;
    font-weight: 500 !important;
}
html .cog-cognito--styled .el-checkbox__inner, html .cog-cognito--styled .el-radio__inner, :root:root:root:root:root .cog-cognito--styled .el-checkbox__inner, :root:root:root:root:root .cog-cognito--styled .el-radio__inner {
    border: 3px solid #C4C6D0;
    box-shadow: none;
}
html .cog-cognito--styled .el-checkbox:hover .el-checkbox__inner, html .cog-cognito--styled .el-radio:hover .el-radio__inner, :root:root:root:root:root .cog-cognito--styled .el-checkbox:hover .el-checkbox__inner, :root:root:root:root:root .cog-cognito--styled .el-radio:hover .el-radio__inner {
    border: 3px solid var(--highlight);
}
html .cog-error-message, :root:root:root:root:root .cog-error-message {
    background: var(--negative-reverse);
    padding: 0;
    color: #D81E1E;
    margin: 0;
    line-height: 18px;
    font-size: 14px;
}
html .cog-toggle .el-switch__core, :root:root:root:root:root .cog-toggle .el-switch__core {
    border-radius: 17px;
}
html .cog-toggle .el-switch__core::after, :root:root:root:root:root .cog-toggle .el-switch__core::after {
    width: 1.7em;
    height: 1.7em;
    border-radius: 17px;
    margin: .2em;
}
html .cog-cognito--styled .is-error .el-input__inner, html .cog-cognito--styled .is-error .el-textarea__inner, :root:root:root:root:root .cog-cognito--styled .is-error .el-input__inner, :root:root:root:root:root .cog-cognito--styled .is-error .el-textarea__inner, html .cog-upload:not(.is-read-only), :root:root:root:root:root .is-error .cog-upload:not(.is-read-only), html .is-error .cog-signature canvas, :root:root:root:root:root .is-error .cog-signature canvas {
    border: 1px solid #D81E1E !important;
    background: url(https://www.ifema.es/img/error/circle-error-v3.svg) center right no-repeat #F2F2F5 !important;
    background-size: 48px !important;
}
html .is-error .cog-toggle .el-switch__core, :root:root:root:root:root .is-error .cog-toggle .el-switch__core{
	background-color:#D81E1E !important;
}
html .cog-cognito--styled .is-error .el-select .el-input__inner, :root:root:root:root:root .cog-cognito--styled .is-error .el-select .el-input__inner, html .cog-cognito--styled .is-error .el-date-editor .el-input__inner, :root:root:root:root:root .cog-cognito--styled .is-error .el-date-editor .el-input__inner {
    background-position: 98% 50% !important;
}
html .cog-col.is-error:not(.cog-hidden-validation)::before, html .cog-col.is-error:not(.cog-hidden-validation)::after, :root:root:root:root:root .cog-col.is-error:not(.cog-hidden-validation)::before, :root:root:root:root:root .cog-col.is-error:not(.cog-hidden-validation)::after {
    content: none;
}
html .cog-cognito--styled input[type="text"]:focus, textarea:focus, input[type="text"]:focus-visible, textarea:focus-visible, select:focus, select:focus-visible, html .cog-upload:not(.is-read-only), :root:root:root:root:root .cog-upload:not(.is-read-only) {
padding: 0;
border: 1px solid #F2F2F5 !important;
}
html .cog-cognito--styled .cog-button--secondary, :root:root:root:root:root .cog-cognito--styled .cog-button--secondary, html .cog-cognito--styled .cog-button--secondary:hover, :root:root:root:root:root .cog-cognito--styled .cog-button--secondary:hover {
    border: none !important;
}
html .cog-cognito--styled .cog-button--secondary > span, :root:root:root:root:root .cog-cognito--styled .cog-button--secondary > span, html .cog-cognito--styled .cog-button--secondary:hover > span, :root:root:root:root:root .cog-cognito--styled .cog-button--secondary:hover > span {
    color: var(--highlight);
    font-weight: 600;
    text-decoration: underline;
}
.cog-button__text {
    padding: 0!important;
}
html .cog-cognito--styled .cog-button--secondary:hover, :root:root:root:root:root .cog-cognito--styled .cog-button--secondary:hover {
    box-shadow: none !important;
}
html .cog-cognito--styled .cog-button--secondary, :root:root:root:root:root .cog-cognito--styled .cog-button--secondary {
    background: transparent !important;
    min-width: auto !important;
	padding-right:0;
}
html .cog-cognito--styled .el-input__inner:focus, html .cog-cognito--styled .el-input__inner.is-focus, html .cog-cognito--styled .el-input__inner.StripeElement--focus, html .cog-cognito--styled .el-input__inner.c-square-input--focus, html .cog-cognito--styled .el-textarea__inner:focus, html .cog-cognito--styled .el-textarea__inner.is-focus, html .cog-cognito--styled .el-textarea__inner.StripeElement--focus, html .cog-cognito--styled .el-textarea__inner.c-square-input--focus, :root:root:root:root:root .cog-cognito--styled .el-input__inner:focus, :root:root:root:root:root .cog-cognito--styled .el-input__inner.is-focus, :root:root:root:root:root .cog-cognito--styled .el-input__inner.StripeElement--focus, :root:root:root:root:root .cog-cognito--styled .el-input__inner.c-square-input--focus, :root:root:root:root:root .cog-cognito--styled .el-textarea__inner:focus, :root:root:root:root:root .cog-cognito--styled .el-textarea__inner.is-focus, :root:root:root:root:root .cog-cognito--styled .el-textarea__inner.StripeElement--focus, :root:root:root:root:root .cog-cognito--styled .el-textarea__inner.c-square-input--focus, html .cog-signature canvas:hover, :root:root:root:root:root .cog-signature canvas:hover {
    border-color: var(--highlight) !important;
    box-shadow: var(--input-focus__box-shadow) !important;
}
html .cog-cognito--styled:focus, html .cog-cognito--styled *:focus, :root:root:root:root:root .cog-cognito--styled:focus, :root:root:root:root:root .cog-cognito--styled .cog-upload:focus {
    border: 1px solid var(--highlight);
    border-radius: 4px;
}
html .cog-signature__pad, :root:root:root:root:root .cog-signature__pad, html .cog-signature--draw:not(.is-read-only) .cog-signature__pad, :root:root:root:root:root .cog-signature--draw:not(.is-read-only) .cog-signature__pad {
    border: none;
}
html .cog-signature__symbol, :root:root:root:root:root .cog-signature__symbol {
    bottom: 5%;
}
html .cog-upload:not(.is-read-only), :root:root:root:root:root .cog-upload:not(.is-read-only) {
    border: 1px dashed var(--highlight) !important;
    background-color: transparent !important;
    background-image: url(/img/upload/ico-upload-v4.svg) !important;
    background-position: 98% 50% !important;
    background-size: 45px !important;
}
html .cog-upload:not(.is-read-only), :root:root:root:root:root .is-error .cog-upload:not(.is-read-only) {
    /* Añadir variable de color error */
    border: 1px dashed #D81E1E !important;
}
html .cog-upload:not(.is-read-only):hover, :root:root:root:root:root .cog-upload:not(.is-read-only):hover {
    background-color: #f3e9ff!important;
}
html .cog-upload .el-upload-dragger>div, :root:root:root:root:root .cog-upload .el-upload-dragger>div {
    background: transparent;
}
html .cog-upload:not(.is-read-only), html .is-error .cog-upload:not(.is-read-only) {
    background-position: 27rem 50% !important;
}
html .cog-toggle .el-switch__core, html .cog-toggle .el-switch__core, html .cog-toggle .el-switch__core::after, html .cog-toggle .el-switch__core::after {
    border-radius: 17px;
}
html .cog-toggle .el-switch__core::after, html .cog-toggle .el-switch__core::after {
    width: 1.8em;
    height: 1.8em;
    margin: .15em;
}
html .cog-cognito--styled.cog-cognito--protect-css .el-checkbox-group {
    display: flex;
    flex-wrap: wrap;
}
html .cog-section__inner--background, :root:root:root:root:root .cog-section__inner--background {
    background: none;
	border: calc(var(--border-width)*2) solid hsla(var(--background-hsl), 0.2);
}
html .cog-cognito .el-select-dropdown__list li, :root:root:root:root:root .cog-cognito .el-select-dropdown__list li span{
	font-family: 'Barlow';
	font-size: 16px;
}
html .cog-cognito {
	--highlight: #8322FA!important;
}
html .cog-cognito--styled .cog-button--primary, html .cog-cognito--styled .cog-page__navigation .cog-button, :root:root:root:root:root .cog-cognito--styled .cog-button--primary, :root:root:root:root:root .cog-cognito--styled .cog-page__navigation .cog-button {
font-family: 'Barlow'!important;
    font-size: 17px!important;
    border: 1px solid black!important;
    color: white;
    background: black!important;
    border: none;
    padding: 14px 28px;
    font-weight: 600;
    margin: 0px auto 20px;
    transition: all .2s;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    cursor: pointer;
    grid-column-start: 1;
    grid-column-end: 3;
    display: block;
}
label[for="Flag_Consentimiento"], input[type=submit], .required-fields {
    grid-column: span 2!important;
}
html .cog-form:not([data-old-safari]) .cog-field .cog-row, :root:root:root:root:root .cog-form:not([data-old-safari]) .cog-field .cog-row {
    column-gap: calc(var(--gutter)/1);
}
html .cog-cognito--styled .cog-button--primary, html .cog-cognito--styled .cog-page__navigation .cog-button, :root:root:root:root:root .cog-cognito--styled .cog-button--primary, :root:root:root:root:root .cog-cognito--styled .cog-page__navigation .cog-button:hover {
	    background: #292152!important;
}
html .cog-cognito--styled.cog-form, :root:root:root:root:root .cog-form:focus {
	border: none!important;
}
@media (max-width: 1024px) {
	html .cog-cognito--styled.cog-cognito--protect-css .el-checkbox-group label {
		width: 50%;
	}
}
@media(max-width:768px) {
	html .cog-cognito--styled.cog-cognito--protect-css .el-checkbox-group label {
		width: 100%;
	}
	html .cog-cognito .el-select-dropdown__list, :root:root:root:root:root .cog-cognito .el-select-dropdown__list {
		padding: 0 0 20px;
	}
}
html .cog-cognito--styled h3, :root:root:root:root:root .cog-cognito--styled h3,html .cog-cognito--styled h4, :root:root:root:root:root .cog-cognito--styled h5 {
    font-weight: 600 !important;
}
html .cog-cognito--styled h2, :root:root:root:root:root .cog-cognito--styled h2 {
    font-size: 26px !important;
    font-weight: 600 !important;
    line-height: 38px !important;
	margin-bottom: 20px!important;
}
/* Preloader */

.loading {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 60px 0 80px;
}

.preloader .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-radius: 50%;
  background-color: #333;
  animation: bounce 0.7s infinite alternate;
}

.preloader .dot:nth-child(1) {
  background-color: #8322FA;
}

.preloader .dot:nth-child(2) {
  animation-delay: 0.2s;
  background-color: #171736;
}

.preloader .dot:nth-child(3) {
  animation-delay: 0.4s;
  background-color: #E32424;
}
/* Set the preloader to be invisible by default */
.preloader,.cog-loader {
  display: none;
  
}

/* Override the default invisibility if the preloader doesn't have a form after it. */
.preloader:last-child {
  display: block;
}

/* Create a spinning animation and name it "spin" */
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  
  to {
    transform: rotate(360deg);
  }
}

/* 
  Apply "spin" animation to the image inside the preloader.
   -  animation-duration is set to "3s" and so each 
      rotation will last 3 seconds.
   -  animation-timing-function is set to "linear" 
      and so the speed of rotation is constant.
   -  animation-iteration-count is set to "infinite"
      which means what it says.
*/
.preloader img {
  display: block;
  animation-name: spin;
  animation-duration: 3s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
@keyframes bounce {
  to {
    transform: translate(0, -24px);
  }
}
@media (max-width: 1024px) {
	html .cog-cognito--styled.cog-cognito--protect-css .el-checkbox-group label {
		width: 50%;
	}
}
@media(max-width:768px) {
	html .cog-cognito--styled.cog-cognito--protect-css .el-checkbox-group label {
		width: 100%;
	}
	html .cog-cognito .el-select-dropdown__list, :root:root:root:root:root .cog-cognito .el-select-dropdown__list {
		padding: 0 0 20px;
	}
}
/* Fin form cognito */