@charset "UTF-8";
/*
    ========== FICHERO DE IMPORTACIÓN ==========

    En este fichero se hará la importación de cada archivo
    SCSS. 

*/
/* UTILS */
/*
   ========== Sass Variables ==========

   Fichero dedicado a todas las variables del tema.

   Estas variables atienden a un diseño previamente definido.

*/
/*
	========== SASS MIXINS ==========

	Fichero dedicado a los mixins creados para el proyecto.

*/
/*
    ========== FICHERO DE FUENTES ==========

    Fichero dedicado a los maps de las fuentes en SASS.

*/
@import url("https://fonts.googleapis.com/css?family=Open+Sans");
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600");
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
/* GENERAL */
/*
    ========== TÍTULOS ==========

    Estilos dedicados a los títulos de la web. 

    Se ha hecho uso de los siguientes MIXINS:

        @mixin h1_style ($color, $size)

        @mixin h2_style ($color, $size)

        @mixin h3_style ($color, $size)

        @mixin h4_style ($color, $size)

        @mixin h5_style ($color, $size)

        @mixin h6_style ($color, $size)

        @mixin underline_view_title

    ------------------------- MIXINS --------------------------
    h1 / h2 / h3 / h4 / h5 / h6_style = Estilos para los
    diferentes títulos

    underline_view_title = Estilo para crear una línea debajo
    del título
    ----------------------- VARIABLES -------------------------
    $main_color_1 = Color principal de tipo 1

    $color = Color de la fuente

    $size = Tamaño de la fuente

*/
h1 {
  color: #181818;
  font-size: 22px;
  font-family: "Roboto";
  font-weight: 500;
}
h1::after {
  content: "";
  display: block;
  width: 35px;
  height: 2px;
  margin: 5px 0;
  background-color: #B31C46;
}

h2 {
  color: #181818;
  font-size: 20px;
  font-family: "Roboto";
  font-weight: 500;
}
h2::after {
  content: "";
  display: block;
  width: 35px;
  height: 2px;
  margin: 5px 0;
  background-color: #B31C46;
}

h3 {
  color: #181818;
  font-size: 18px;
  font-family: "Roboto";
  font-weight: 700;
}

h4 {
  color: #181818;
  font-size: 16px;
  font-family: "Roboto";
  font-weight: 700;
}

h5 {
  color: #181818;
  font-size: 16px;
  font-family: "Roboto";
  font-weight: 500;
}

h6 {
  color: #181818;
  font-size: 14px;
  font-family: "Roboto";
  font-weight: 700;
}

.node--view-mode-minificha > h1, .node--view-mode-minificha > h2, .node--view-mode-minificha > h3,
.node--view-mode-teaser > h1,
.node--view-mode-teaser > h2,
.node--view-mode-teaser > h3 {
  display: none;
}

.node--type-pagina-avanzada.node--view-mode-full > h2 {
  display: none;
}

.node--type-pagina-personalizada.node--view-mode-full > h2 {
  display: none;
}

.ps-style-lb-title .field--name-title {
  color: #181818;
  font-size: 22px;
  font-family: "Roboto";
  font-weight: 500;
}
.ps-style-lb-title .field--name-title::after {
  content: "";
  display: block;
  width: 35px;
  height: 2px;
  margin: 5px 0;
  background-color: #B31C46;
}

/*
    ========== FORMULARIOS ==========

    Estilos dedicados a los formularios de la web.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin display_flex($direction, $justify_content, $align_items)

        @mixin form_label

    ------------------------- MIXINS --------------------------
    display_flex = Mixin para las vistas display

    form_label = Estilo de la etiqueta label
    ----------------------- VARIABLES -------------------------
    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

    $color_placeholder = Color del texto placeholder del campo
*/
input[type=email],
input[type=text],
input[type=number],
input[type=password],
textarea,
select {
  border: none;
  border-bottom: 1px solid #181818;
  padding: 5px;
  background-color: #F9F9F9;
}

label {
  font-family: "Roboto";
  font-weight: 400;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
}

::placeholder {
  color: #B31C46;
  opacity: 1;
  /* Firefox */
}

:-ms-input-placeholder,
::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #B31C46;
}

.form-type-textfield,
.form-type-email,
.form-type-textarea,
.form-type-select,
.form-type-search-api-autocomplete,
.form-type-password {
  display: flex;
  flex-direction: column;
  justify-content: initial;
  align-items: initial;
}

input[type=submit] {
  color: #181818;
  font-size: 16px;
  background-color: #FFFFFF;
  padding: 8px 24px;
  border: 1px solid #181818;
  font-family: "Roboto";
  font-weight: 500;
}
input[type=submit]:hover {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #B31C46;
  border-color: #B31C46;
}

.form-actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: initial;
}

/*
    ========== ENLACES ==========

    Estilos dedicados a los enlaces de la web.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin link_style($color) 

    ------------------------- MIXINS --------------------------
    link_style = Estilo del enlace

    ----------------------- VARIABLES -------------------------
    $a_color = Representa el color del enlace

*/
a {
  color: #B31C46;
  font-family: "Roboto";
  font-weight: 500;
  text-decoration: none;
}

/*
    ========== TABLAS ==========

    Estilos dedicados a las tablas.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin table_style

        @mixin table_thead_th

        @mixin table_thead_filter

        @mxin table_thead_filter_icon

    ------------------------- MIXINS --------------------------
    table_style = Estilo general de la tabla

    table_thead_th = Estilo de los títulos de cabecera de la
    tabla

    table_thead_filter = Estilo de las columnas con filtro

    table_thead_filter_icon = Estilo del icono del filtro
    ----------------------- VARIABLES -------------------------
    $border_tbody_tr = Borde para las filas de la tabla

    $main_color_3 / 1 = Tipo 3 / 1 de colores principales

    $tbody_td_padding = Padding de cada celda perteneciente
    a una columna

    $tbody_td_height = Altura de cada celda perteneciente
    a una columna
*/
table {
  width: 100%;
  margin: 0 0 10px;
}
table thead th {
  padding: 0.5rem 1rem;
  height: 2rem;
  background-color: #F9F9F9;
}
table thead th a {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
table thead th a::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='m1.75,0.25v1.5h10.5v-1.5z m0,3v1.5h7.5v-1.5z m0,3v1.5h4.5v-1.5z' fill='%23222330'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  display: block;
  height: 8px;
  width: 15px;
  margin-left: 15px;
}
table tbody tr {
  border-bottom: 2px solid #EEEEEE;
}
table tbody tr:hover {
  background-color: #EEEEEE;
}
table tbody tr:first-child {
  border-top: 1px solid #B31C46;
}
table tbody tr td {
  padding: 0.5rem 1rem;
  height: 4rem;
}

.table-responsive .view-content {
  overflow-x: auto;
}
.table-responsive .view-content thead th {
  min-width: 150px;
}

/*
    ========= LISTAS ==========
    Estilos dedicados a las listas de la web.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin tipografia($font,$index,$weight)

    ------------------------ MIXINS ---------------------------
    tipografía = Mixin que identifica el tipo de letra a usar

    ----------------------- VARIABLES -------------------------
    $font = Representa el mapa de tipo de fuente

    $index = El índice del mapa $family

    $weight = El índice del mapa $font

    ------------------------- MAPAS ---------------------------
    $family:('Open Sans', 'Source Sans Pro', 'Roboto');

    $Roboto:(thin:100,light:300,regular:400,medium:500,
    bold:700, black:900)
*/
ul, ol {
  font-family: "Roboto";
  font-weight: 400;
  padding-left: 20px;
  color: #444444;
}

.ck-tabla {
  border: none !important;
  padding: 0 !important;
  overflow: scroll;
  width: 90vw;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: #B31C46;
}
@media (min-width: 992px) {
  .ck-tabla {
    overflow: unset;
    width: 100%;
  }
}
.ck-tabla table {
  width: 1100px !important;
  border: none !important;
}
.ck-tabla table caption {
  padding: 1em 0;
  color: #005172;
  font-weight: 600;
  font-size: 16px;
}
.ck-tabla table thead {
  border: none !important;
}
.ck-tabla table thead tr,
.ck-tabla table thead th {
  border: none !important;
}
.ck-tabla table thead th {
  font-family: "Roboto";
  font-weight: 600 !important;
  line-height: 22px;
  font-size: 16px !important;
  color: #B31C46 !important;
  background: #F5F5F5;
  padding: 1em !important;
  text-align: left;
}
.ck-tabla table tbody {
  border: none !important;
}
.ck-tabla table tbody tr {
  border-bottom: 1px solid #B31C46 !important;
}
.ck-tabla table tbody td {
  border: none !important;
  font-family: "Roboto";
  font-weight: 400 !important;
  line-height: 19px;
  font-size: 16px !important;
}
.ck-tabla table tbody th {
  font-family: "Roboto";
  font-weight: 600 !important;
  line-height: 22px;
  font-size: 18px !important;
  color: #B31C46 !important;
  background: #F5F5F5;
  padding: 1em !important;
  text-align: left;
}

.ck-tabla-autoajustable {
  border: none !important;
  padding: 0 !important;
  overflow: scroll;
  width: 90vw;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: #B31C46;
}
@media (min-width: 992px) {
  .ck-tabla-autoajustable {
    overflow: unset;
    width: 100%;
  }
}
.ck-tabla-autoajustable table {
  width: auto !important;
  border: none !important;
}
.ck-tabla-autoajustable table caption {
  padding: 1em 0;
  color: #005172;
  font-weight: 600;
  font-size: 16px;
}
.ck-tabla-autoajustable table thead {
  border: none !important;
}
.ck-tabla-autoajustable table thead tr,
.ck-tabla-autoajustable table thead th {
  border: none !important;
}
.ck-tabla-autoajustable table thead th {
  font-family: "Roboto";
  font-weight: 600 !important;
  line-height: 22px;
  font-size: 16px !important;
  color: #B31C46 !important;
  background: #F5F5F5;
  padding: 1em !important;
  text-align: left;
}
.ck-tabla-autoajustable table tbody {
  border: none !important;
}
.ck-tabla-autoajustable table tbody tr {
  border-bottom: 1px solid #B31C46 !important;
}
.ck-tabla-autoajustable table tbody td {
  border: none !important;
  font-family: "Roboto";
  font-weight: 400 !important;
  line-height: 19px;
  font-size: 16px !important;
  min-width: 180px;
}
.ck-tabla-autoajustable table tbody th {
  font-family: "Roboto";
  font-weight: 600 !important;
  line-height: 22px;
  font-size: 18px !important;
  color: #B31C46 !important;
  background: #F5F5F5;
  padding: 1em !important;
  text-align: left;
}

/*
    ========== PÁRRAFOS ==========

    Estilos dedicados a los párrafos de la web.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin p_style($p_color)

    ------------------------- MIXINS --------------------------
    p_style = Estilo del párrafo
    ----------------------- VARIABLES -------------------------
    p_$color = Representa el color del párrafo
*/
p {
  color: #444444;
  font-size: 16px;
  font-family: "Roboto";
  font-weight: 400;
}

/* LAYOUT */
/*
    ========= BASE ==========
    Estilos básicos y generales de la web.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin tipografia($font,$index,$weight)

        @mixin ps-content-margins

    ------------------------ MIXINS ---------------------------
    tipografía = Mixin que identifica el tipo de letra a usar

    ps-content-margins = Mixin que limita el ancho del
    contenido atendiendo a un breakpoint y margen específico

    ----------------------- VARIABLES -------------------------
    $font = Representa el mapa de tipo de fuente

    $index = El índice del mapa $family

    $weight = El índice del mapa $font

    ------------------------- MAPAS ---------------------------
    $family:('Open Sans', 'Source Sans Pro', 'Roboto');

    $SourceSans:(light:300,regular:400,semi-bold:600);
*/
#x-insuit-tab {
  top: 75% !important;
}

body {
  color: black;
  position: relative;
  font-family: "Source Sans Pro";
  font-weight: 400;
}
body #x-insuit-tab {
  top: 75% !important;
}

.layout-container div {
  color: #444444;
  font-size: 16px;
  font-family: "Roboto";
  font-weight: 400;
}

.ps-content-margins {
  max-width: 1186px;
  margin: 0 auto;
}
@media (min-width: 1366px) {
  .ps-content-margins {
    max-width: 1366px;
  }
}

div#slick-views-widget-multimedia-enlaces-block-20-1 {
  max-width: 1100px;
}

/*
    ========= FOOTER ==========
    Estilos dedicados al footer de la web.

    ----------------------- VARIABLES -------------------------
    $footer_background_color = Color de fondo del footer

    $footer_font_color = El color de fuente del footer
*/
footer {
  background-color: #181818;
  color: #FFFFFF;
  margin-top: 40px;
}
footer p, footer a {
  color: #FFFFFF;
}
footer .logo svg, footer .logo img {
  height: 45px;
}

.ps_header_3_col-main-right .ps_header_3_col_content {
  display: grid;
  grid-template-columns: 1fr auto;
  justify-items: center;
  align-items: center;
}

.ps_header_3_col {
  padding: 10px 0;
  position: absolute;
  z-index: 98;
  background-color: rgba(255, 255, 255, 0.8);
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}
.ps_header_3_col img {
  height: 120px;
  max-height: 120px;
  width: 100%;
}

/*
    ========= SIDEBAR-FIRST ==========
    Estilos dedicados al Sidebar First de la web.

	----------------------- VARIABLES -------------------------
	$blanco = Color blanco
*/
.region.region-sidebar-first {
  background: #FFFFFF;
}
.region.region-sidebar-first a {
  font-weight: 400;
  font-size: 1.1em;
  letter-spacing: 1px;
}
.region.region-sidebar-first .menu-level-0 > li:not(:first-child) {
  margin-top: 15px;
}
.region.region-sidebar-first .menu-level-0 > li > span, .region.region-sidebar-first .menu-level-0 > li > a {
  font-size: 18px;
  color: #B31C46;
  display: block;
}
.region.region-sidebar-first .menu-level-0 > li > span::after, .region.region-sidebar-first .menu-level-0 > li > a::after {
  content: "";
  display: block;
  height: 2px;
  background-color: #B31C46;
}
.region.region-sidebar-first .menu-level-1 > li {
  margin-top: 15px;
}
.region.region-sidebar-first .menu-level-1 > li a {
  font-size: 16px;
  color: #000000;
  font-weight: 500;
}
.region.region-sidebar-first .menu-level-2 > li {
  margin-top: 15px;
  transform: translateX(20px);
}
.region.region-sidebar-first .menu-level-2 > li a {
  font-weight: 400;
  color: #181818;
}
.region.region-sidebar-first .menu li::marker {
  content: "";
}

/* DISPLAY MODES */
/*
    ============= TEASER ==============

    Estilos dedicados al modo de visualización de resumen.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin display_flex($direction, $justify_content, $align_items)

        @mixin responsive-img

        @mixin button_icon($height, $width, $m-left, $img, $filter)

    ------------------------- MIXINS --------------------------
    display_flex = Mixin para las vistas display flex

    responsive-img = Convierte una imagen en responsive

    button_icon = Poner un icono a un botón

    ----------------------- VARIABLES -------------------------

    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

    $height = Altura del icono

    $width = Anchura del icono

    $m-left = Margen izquierdo del icono

    $img = Imagen del icono

    $filter = Filtro aplicado al icono

    $main_color_1 / 3 = Color principal de tipo 1 / 3

    $h2_font_size = Tamaño de fuente de H2

    $icon_btn_mn_2_size = Ancho y alto del icono del boton 2

    $icon_btn_2_m-left = Margen izquierdo del icono
    para el botón 2

    $button_mn_2_icon = Icono del botón 2

    $filter_main_color_1_mod_1 = Filtro de color 1 con modificación

*/
.node--view-mode-teaser {
  border-bottom: 1px solid #EEEEEE;
  margin-bottom: 50px;
  padding-bottom: 50px;
}
.node--view-mode-teaser p {
  margin: 0;
}
.node--view-mode-teaser .node__content .layout {
  flex-wrap: nowrap;
  flex-direction: column;
}
@media (min-width: 801px) {
  .node--view-mode-teaser .node__content .layout {
    flex-direction: row;
    gap: 25px;
    align-items: center;
  }
}
.node--view-mode-teaser .node__content .layout__region--first .field--type-image .field__item {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.node--view-mode-teaser .node__content .layout__region--second .block:not(:last-child) {
  margin-bottom: 10px;
}
.node--view-mode-teaser .node__content .layout__region--second .field--name-title a {
  color: #B31C46;
  font-size: 20px;
  font-family: "Roboto";
  font-weight: 500;
}
.node--view-mode-teaser .node__content .layout__region--third {
  align-self: flex-end;
}
.node--view-mode-teaser .node__content .layout__region--third .node__links .node-readmore a {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: center;
  flex-wrap: wrap;
}
.node--view-mode-teaser .node__content .layout__region--third .node__links .node-readmore a::after {
  content: "";
  display: block;
  width: 21px;
  height: 21px;
  margin-left: 8px;
  background-image: url("/sites/default/files/iconos-svg/flecha-derecha.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: invert(16%) sepia(72%) saturate(3923%) hue-rotate(330deg) brightness(83%) contrast(90%);
}

/* BLOCKS */
/*
    ========== BUSCADOR A CONTENIDO COMPLETO ==========

    Estilos dedicados al buscador de contenido a texto completo.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin display_flex($direction, $justify_content, $align_items)

    ------------------------- MIXINS --------------------------
    display_flex = Mixin para las vistas display flex

    ----------------------- VARIABLES -------------------------
    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

    $main_color_1 / 5 = Color principal de tipo 1 / 5

    $filter_main_color_1_mod_1 = Color de filtro con modificación

*/
.ps-fulltext-search-list {
  /* ocultamos el filtro por dominio, porque si lo configuramos como no expuesto, no filtra como esperamos */
}
.ps-fulltext-search-list .form-inline .form-item-search-api-fulltext::before {
  background-color: #B31C46;
}
.ps-fulltext-search-list .form-inline .form-item-search-api-fulltext::after {
  content: "";
  display: block;
  background-image: url("/sites/default/files/iconos-svg/icono-lupa.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: initial;
  position: absolute;
  right: 8px;
  width: 18px;
  height: 18px;
  filter: invert(16%) sepia(72%) saturate(3923%) hue-rotate(330deg) brightness(83%) contrast(90%);
}
.ps-fulltext-search-list .form-inline .bef--secondary {
  padding: 20px;
  grid-area: filtros;
}
.ps-fulltext-search-list .form-inline .bef--secondary summary {
  color: #B31C46;
  font-weight: 600;
}
.ps-fulltext-search-list .form-inline .bef--secondary.close {
  display: none;
}
.ps-fulltext-search-list .form-inline .bef--secondary-trigger {
  grid-area: filtro-trg;
  text-align: end;
  cursor: pointer;
  color: #B31C46;
  font-weight: 600;
}
.ps-fulltext-search-list .form-inline .bef--secondary label {
  font-weight: bold;
  margin-right: 5px;
}

.layout-sidebar-first .filtros-bar,
.view-filters .filtros-bar {
  width: 100%;
  margin: 0 auto;
  height: 48px;
  border: 1px solid #B31C46;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.layout-sidebar-first .filtros-bar .titulo,
.view-filters .filtros-bar .titulo {
  color: #617F95;
  font-size: 16px;
  line-height: 22px;
  padding-left: 15px;
}
.layout-sidebar-first .filtros-bar .icono,
.view-filters .filtros-bar .icono {
  margin-right: 15px;
  transition: all 0.5s ease;
}
.layout-sidebar-first .filtros-bar .rotate-icon,
.view-filters .filtros-bar .rotate-icon {
  transform: rotate(90deg);
  transition: all 0.5s ease;
}
@media (min-width: 801px) {
  .layout-sidebar-first .filtros-bar,
.view-filters .filtros-bar {
    display: none;
  }
}
@media (min-width: 300px) and (max-width: 801px) {
  .layout-sidebar-first .filtros-bar + .region-sidebar-first,
.view-filters .filtros-bar + .region-sidebar-first {
    display: none;
    border-left: 1px solid #B31C46;
    border-right: 1px solid #B31C46;
    border-bottom: 1px solid #B31C46;
    width: 100%;
    margin: 0 auto;
  }
  .layout-sidebar-first .filtros-bar + .region-sidebar-first .block-facets,
.view-filters .filtros-bar + .region-sidebar-first .block-facets {
    width: 100%;
    max-width: 670px;
    margin: 0 auto;
    padding-top: 15px;
  }
  .layout-sidebar-first .filtros-bar + .region-sidebar-first .block-facets h1,
.view-filters .filtros-bar + .region-sidebar-first .block-facets h1 {
    font-size: 16px;
    color: #617F95;
    font-family: "Open Sans", "Source Sans Pro", "Roboto", "Montserrat";
    font-weight: 500;
    line-height: 22px;
    text-align: left;
    margin-bottom: 10px !important;
  }
  .layout-sidebar-first .filtros-bar + .region-sidebar-first .block-facets h4,
.view-filters .filtros-bar + .region-sidebar-first .block-facets h4 {
    margin-left: 15px;
    margin-bottom: 0 !important;
  }
  .layout-sidebar-first .filtros-bar + .region-sidebar-first .block-facets .facets-widget-checkbox,
.view-filters .filtros-bar + .region-sidebar-first .block-facets .facets-widget-checkbox {
    padding: 15px;
  }
  .layout-sidebar-first .filtros-bar + .region-sidebar-first .views-exposed-form form,
.view-filters .filtros-bar + .region-sidebar-first .views-exposed-form form {
    padding: 0 15px;
  }
}
@media (min-width: 801px) {
  .layout-sidebar-first .filtros-bar + .region-sidebar-first,
.view-filters .filtros-bar + .region-sidebar-first {
    display: block !important;
  }
}
@media (min-width: 300px) and (max-width: 801px) {
  .layout-sidebar-first .filtros-bar + .views-exposed-form,
.view-filters .filtros-bar + .views-exposed-form {
    display: none;
    border-left: 1px solid #B31C46;
    border-right: 1px solid #B31C46;
    border-bottom: 1px solid #B31C46;
    width: 100%;
    max-width: 670px;
    margin: 0 auto;
  }
}

/*
    ========== TÍTULO DEL DOMINIO ==========

    Estilos dedicados al título del dominio.


    ----------------------- VARIABLES -------------------------
    $title_header = Tamaño de fuente del título del header

    $main_color_1 = Color principal de tipo 1

*/
.ps-titulo-dominio .views-field-field-subtitulo .field-content {
  text-align: center;
  font-size: 24px;
  color: #B31C46;
  font-weight: bold;
  display: none;
}
@media (min-width: 768px) {
  .ps-titulo-dominio .views-field-field-subtitulo .field-content {
    display: block;
  }
}

/*
    ========== SUPERFISH MENU ==========

    Estilos dedicados al menú superfish cuando no tiene
    estilos aplicados de forma predeterminada.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin right_arrow

        @mixin down_arrow

        @mixin sf_sub_indicator($size, $top)

    ------------------------- MIXINS --------------------------
    right_arrow = Permite poner la flecha del menú hacia la
    derecha

    down_arrow = Permite poner la flecha del menú hacia abajo

    sf_sub_indicator = Con este mixin elegimos el tamaño
    y la posición de la flecha del menú desplegable

    ----------------------- VARIABLES -------------------------
    $size = Indica el tamaño de la flecha

    $top = Indica la posición con respecto a la parte superior
    de la página

    $main_color_4 = Color principal de tipo 4

    $main_color_1 /4 / 5 = Color principal de tipo 1 / 4 / 5

    $blanco = Color blanco
*/
.block-superfish.contextual-region {
  position: initial;
}
.block-superfish .sf-accordion-toggle a::before {
  content: "";
  display: block;
  background-image: url("/sites/default/files/iconos-svg/layer1.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  width: 20px;
  height: 20px;
}
.block-superfish .sf-accordion-toggle a span {
  display: none;
}
.block-superfish ul.sf-menu.sf-accordion.sf-expanded {
  position: absolute;
  left: 0 !important;
}
.block-superfish ul.sf-menu.sf-style-none::after {
  content: "";
  display: block;
  float: none;
  clear: both;
}
.block-superfish ul.sf-menu.sf-style-none .sf-sub-indicator {
  width: 15px;
  height: 15px;
  top: 45%;
}
.block-superfish ul.sf-menu.sf-style-none .sf-sub-indicator::after {
  content: "⌵";
  font-weight: bold;
}
.block-superfish ul.sf-menu.sf-style-none.sf-vertical li .sf-sub-indicator {
  width: 15px;
  height: 15px;
  top: 45%;
}
.block-superfish ul.sf-menu.sf-style-none.sf-vertical li .sf-sub-indicator::after {
  content: "⌵";
  font-weight: bold;
  transform: rotateZ(270deg);
}
.block-superfish ul.sf-menu.sf-style-none .nolink {
  padding-right: 3em;
  color: #B31C46;
  font-weight: 500;
}
.block-superfish ul.sf-menu.sf-style-none li a {
  color: #B31C46;
  text-decoration: none;
}
.block-superfish ul.sf-menu.sf-style-none li > span {
  display: block;
  padding: 1em 1.5em;
  position: relative;
  font-weight: 500;
  color: #B31C46;
}
.block-superfish ul.sf-menu.sf-style-none li ul .sf-sub-indicator {
  width: 15px;
  height: 15px;
  top: 50%;
}
.block-superfish ul.sf-menu.sf-style-none li ul .sf-sub-indicator::after {
  content: "⌵";
  font-weight: bold;
  transform: rotateZ(270deg);
}
.block-superfish ul.sf-menu.sf-style-none li ul li {
  background-color: #F9F9F9;
  border-bottom: 1px solid #B31C46;
}
.block-superfish ul.sf-menu.sf-style-none li ul li:hover {
  background-color: #617F95;
}
.block-superfish ul.sf-menu.sf-style-none li ul li:hover > a, .block-superfish ul.sf-menu.sf-style-none li ul li:hover > span {
  color: #FFFFFF;
}
.block-superfish ul.sf-menu.sf-style-none li ul li:last-child {
  border-bottom: none;
}
.block-superfish ul.sf-menu.sf-style-none li ul li a,
.block-superfish ul.sf-menu.sf-style-none li ul li span {
  color: #B31C46;
  text-decoration: none;
  font-weight: 500;
}
.block-superfish ul.sf-menu.sf-style-none > li:first-child a {
  padding-left: 1.5em;
}

/*
    ============= MÁS RECIENTE ==============

    Estilos dedicados a la vista de más recientes.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin responsive-img

    ------------------------- MIXINS --------------------------
    responsive-img = Convierte una imagen en responsive

    ----------------------- VARIABLES -------------------------
    $main_color_1 / 2 = Color principal de tipo 2 /6

    $blanco = Color blanco

*/
.ps-mas-reciente .grid__content {
  position: relative;
}
.ps-mas-reciente .grid__content:hover .views-field-title {
  border-bottom-color: #181818;
}
.ps-mas-reciente .grid__content .views-field-title {
  position: absolute;
  bottom: 0;
  width: 100%;
  background-color: rgba(179, 28, 70, 0.8);
  padding: 20px 15px 14px;
  border-bottom: 6px solid transparent;
}
.ps-mas-reciente .grid__content .views-field-title a {
  color: #FFFFFF;
}
.ps-mas-reciente .grid__content img {
  max-width: 100%;
  height: auto;
}

/*
    ========== PANEL GESTIÓN ==========

    Estilos dedicados a la vista para el panel de gestión.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin display_flex($direction, $justify_content, $align_items)

    ------------------------- MIXINS --------------------------
    display_flex = Mixin para las vistas display flex

    ----------------------- VARIABLES -------------------------
    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

*/
.ps-panel-gestion .menu.menu-level-0 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.ps-panel-gestion .menu.menu-level-0 .menu-item {
  display: flex;
  flex-direction: column-reverse;
  justify-content: initial;
  align-items: center;
  min-width: 120px;
  margin: 10px;
}
.ps-panel-gestion .menu.menu-level-0 .menu-item a {
  margin-top: 5px;
}
.ps-panel-gestion .menu.menu-level-0 .menu-item svg {
  height: 50px;
  width: 50px;
  fill: #B31C46;
  stroke: #B31C46;
}
.ps-panel-gestion .menu.menu-level-0 .menu-item svg path {
  fill: #B31C46;
  stroke: #B31C46;
}

/*
    ========== COLECTIVOS ==========

    Estilos dedicados a la vista para los colectivos.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin display_flex($direction, $justify_content, $align_items)

    ------------------------- MIXINS --------------------------
    display_flex = Mixin para las vistas display flex

    ----------------------- VARIABLES -------------------------
    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

    $main_color_1 / 2 = Color principal de tipo 1 / 2

*/
.ps-colectivos-iconos .grid__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.ps-colectivos-iconos .grid__content .views-field-field-icono-svg- {
  width: 100px;
  height: 100px;
  border-radius: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background-color: #B31C46;
  margin-bottom: 20px;
}
.ps-colectivos-iconos .grid__content .views-field-name {
  text-align: center;
}
.ps-colectivos-iconos .grid__content .views-field-name::after {
  content: "";
  display: block;
  width: 30px;
  height: 2px;
  background-color: #181818;
  margin: 5px auto 0;
}

.ps-rrss-share > .view-content svg {
  fill: #B31C46;
}
.ps-rrss-share > .view-content .ps-rrss-share-mailto svg path {
  stroke: #B31C46;
  fill: #B31C46;
}
.ps-rrss-share-button svg,
.ps-rrss-share-button path,
.ps-rrss-share-button ellipse,
.ps-rrss-share-button circle {
  fill: #B31C46;
}

/*
    ========== CONTENIDOS DE LA MISMA TAXONOMÍA ==========

    Estilos dedicados a los contenidos de la misma taxonomía.

    Se ha hecho uso de los siguientes MIXINS:

    @mixin display_flex($direction, $justify_content, $align_items)

    ------------------------- MIXINS --------------------------
    display_flex = Mixin para las vistas display flex

    ----------------------- VARIABLES -------------------------
    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

*/
.block-contenidos-de-la-misma-taxonomia h1 {
  font-size: 18px;
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: flex-end;
}
.block-contenidos-de-la-misma-taxonomia h1::after {
  flex-grow: 1;
  height: 2px;
  margin-left: 5px;
  background-color: #B31C46;
}

.ps-eventos-carrusel .slick-dotted.slick-slider .slide__caption {
  background-color: #B31C46;
}

/*
    ========== MODALIDAD ==========

    Estilos dedicados a la taxonomía Modalidad.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin display_flex($direction, $justify_content, $align_items)

    ------------------------- MIXINS --------------------------
    display_flex = Mixin para las vistas display flex

    ----------------------- VARIABLES -------------------------
    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

    $main_color_1 = Color principal de tipo 3

*/
.field--name-field-modalidad .vocabulary-modalidad {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: initial;
}
.field--name-field-modalidad .vocabulary-modalidad h2 {
  display: none;
}
.field--name-field-modalidad .vocabulary-modalidad .content {
  max-width: 300px;
  padding: 20px;
  box-shadow: 0px 2px 3px 1px #e2e0e0;
}
.field--name-field-modalidad .vocabulary-modalidad .content .layout__region--content {
  display: grid;
  grid-template-areas: "icono titulo" "empty desc";
  grid-template-columns: auto 3fr;
  column-gap: 20px;
}
.field--name-field-modalidad .vocabulary-modalidad .content .layout__region--content p {
  margin: 0;
}
.field--name-field-modalidad .vocabulary-modalidad .content .layout__region--content .block-field-blocktaxonomy-termmodalidadfield-icono-svg- {
  grid-area: icono;
  justify-self: center;
  margin: 0;
}
.field--name-field-modalidad .vocabulary-modalidad .content .layout__region--content .block-field-blocktaxonomy-termmodalidadfield-icono-svg- svg {
  fill: #B31C46;
}
.field--name-field-modalidad .vocabulary-modalidad .content .layout__region--content .block-field-blocktaxonomy-termmodalidadname {
  grid-area: titulo;
  margin: 0;
  align-self: center;
  text-transform: uppercase;
}
.field--name-field-modalidad .vocabulary-modalidad .content .layout__region--content .block-field-blocktaxonomy-termmodalidadname .field--name-name {
  color: #B31C46;
  font-weight: bold;
}
.field--name-field-modalidad .vocabulary-modalidad .content .layout__region--content .block-field-blocktaxonomy-termmodalidaddescription {
  grid-area: desc;
  margin: 0;
}

/*
    ========== ALERTAS ==========

    Estilos dedicados al bloque de buscador de la web.

    ----------------------- VARIABLES -------------------------
    $blanco = Color blanco

*/
.ps-block-buscador {
  position: relative;
}
.ps-block-buscador a img {
  filter: invert(16%) sepia(72%) saturate(3923%) hue-rotate(330deg) brightness(83%) contrast(90%);
  width: 20px;
}

.buscador-form-block {
  z-index: 99;
}

/*
    ========== BLOQUE ENLACES DE INTERÉS ==========

    Estilos dedicados a la vista del bloque enlaces de interés.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin display_flex($direction, $justify_content, $align_items)

        @mixin grid-layout-view($columns, $rows)

        @mixin mf-responsive-grid-layout-view ($min-width, $columns, $rows)

        @mixin before-icon($size, $left, $icon)

        before-icon = Icono previo al texto del enlace

        @mixin ps-content-margins

    ------------------------- MIXINS --------------------------
    display_flex = Mixin para las vistas display flex

    grid-layout-view = Convierte la estructura de la vista
    en grid

    mf-responsive-grid-layout-view = Te permite hacer 
    responsive la estructura

    ps-content-margins = Mixin que limita el ancho del
    contenido atendiendo a un breakpoint y margen específico

    ----------------------- VARIABLES -------------------------
    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

    $main_color_3 = Color principal de tipo 3

    $blanco = Color blanco

    $columns = Número de columnas del grid (grid-layout-view / mf-responsive-grid-layout-view)

    $rows = Número de filas (grid-layout-view / mf-responsive-grid-layout-view)

    $size = Tamaño del icono

    $left = Posición a la izquierda del icono

    $icon = SVG del icono

*/
.ps-enlaces-interes-block .ps-enlaces-interes .view-header h2 {
  color: #181818;
  font-size: 22px;
  font-family: "Roboto";
  font-weight: 500;
}
.ps-enlaces-interes-block .ps-enlaces-interes .view-header h2::after {
  content: "";
  display: block;
  width: 35px;
  height: 2px;
  margin: 5px 0;
  background-color: #B31C46;
}

.ps-subenc-site .field--type-image img {
  width: 100%;
  height: 60vh;
  object-fit: cover;
}

.ps-subtitulo-dominio .views-field-body .field-content p {
  color: #B31C46;
}
.ps-subtitulo-dominio .views-field-body .field-content p:first-child {
  font-size: 32px;
}
.ps-subtitulo-dominio .views-field-body .field-content p:last-child {
  font-size: 42px;
}

.downloadable-file::before {
  filter: invert(20%) sepia(46%) saturate(4468%) hue-rotate(326deg) brightness(83%) contrast(96%);
}

.ps-slider-control-web-destacadas-block .ps-webs-destacadas .view-content .views-row .field-content > div a {
  color: #B31C46;
}

.ps-slider-control-web-destacadas .controls .control-left, .ps-slider-control-web-destacadas .controls .control-right {
  filter: invert(20%) sepia(46%) saturate(4468%) hue-rotate(326deg) brightness(83%) contrast(96%);
}

.ps-menu--webs-destacadas .menu.menu-level-0 .menu-item .menu-link-contentwebs-destacadas {
  z-index: 100;
}

/* PAGES */
/*
    ========== BUSCADOR SOLR ==========

    Estilos dedicados a la página de buscadores solr.

    Se ha hecho uso de los siguientes MIXINS:


        @mixin after-icon($size, $right, $icon)

        @mixin display_flex($direction, $justify_content, $align_items)        

    ------------------------- MIXINS --------------------------

    after-icon = Icono posterior al texto del enlace

    display_flex = Mixin para las vistas display flex

    ----------------------- VARIABLES -------------------------

    $size = Tamaño del icono

    $right = Posición a la izquierda del icono

    $icon = SVG del icono

    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

    $main_color_1 = Color principal de tipo 1

    $search_icon = Icono de búsqueda

    $filter_main_color_1_mod_1 = Modificación del filtro de color
    principal

*/
.ps-buscador-solr .views-exposed-form .form-item-field-domain-access {
  display: none;
}
.ps-buscador-solr .views-exposed-form .form-item-search-api-fulltext {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  position: relative;
}
.ps-buscador-solr .views-exposed-form .form-item-search-api-fulltext::before {
  content: "";
  display: block;
  width: 30px;
  height: 2px;
  background-color: #B31C46;
  position: absolute;
  right: 0;
  bottom: 0;
}
.ps-buscador-solr .views-exposed-form .form-item-search-api-fulltext::after {
  content: "";
  display: block;
  background-image: url("/sites/default/files/iconos-svg/icono-lupa.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: initial;
  position: absolute;
  right: 8px;
  width: 18px;
  height: 18px;
  filter: invert(16%) sepia(72%) saturate(3923%) hue-rotate(330deg) brightness(83%) contrast(90%);
}
.ps-buscador-solr .views-exposed-form .form-item-search-api-fulltext label {
  display: none;
}
.ps-buscador-solr .views-exposed-form .form-item-search-api-fulltext input {
  width: 66%;
  border-bottom: none;
  padding: 10px 60px 10px 5px;
  background-position: 90% center;
}
@media (max-width: 920px) {
  .ps-buscador-solr .views-exposed-form .form-item-search-api-fulltext input {
    background-position: 84% center;
  }
}
.ps-buscador-solr .view-content {
  padding-bottom: 30px;
}
.ps-buscador-solr .view-content .views-row .media--type-imagen.media--view-mode-mitad-ancho {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: initial;
}
.ps-buscador-solr .view-content .views-row .media--type-imagen.media--view-mode-mitad-ancho .field--name-name {
  font-size: 18px;
  margin-bottom: 15px;
  font-weight: bold;
  order: 2;
}
.ps-buscador-solr .view-content .views-row .media--type-imagen.media--view-mode-mitad-ancho img {
  max-width: 180px;
  height: auto;
  order: 1;
  margin-right: 15px;
}
.ps-buscador-solr .view-content .views-row .media--type-video-remoto.media--view-mode-mitad-ancho {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: initial;
}
.ps-buscador-solr .view-content .views-row .media--type-video-remoto.media--view-mode-mitad-ancho .field--name-name {
  font-size: 18px;
  margin-bottom: 15px;
  font-weight: bold;
  order: 2;
}
.ps-buscador-solr .view-content .views-row .media--type-video-remoto.media--view-mode-mitad-ancho .media-oembed-content {
  width: 100%;
  height: 30vw;
  order: 1;
  margin-right: 15px;
}
@media (min-width: 800px) {
  .ps-buscador-solr .view-content .views-row .media--type-video-remoto.media--view-mode-mitad-ancho .media-oembed-content {
    width: 18vw;
    height: 18vw;
  }
}

/*
    ========== NOTICIA   ==========

    Estilos dedicados a la página de la noticia.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin h3_style ($color, $size)

    ------------------------- MIXINS --------------------------
    h3_style = Estilos para el H3

    ----------------------- VARIABLES -------------------------    
    $main_color_2 = Color principal de tipo 2

    $color = Color de la fuente

    $size = Tamaño de la fuente

    $h3_font_size = Tamaño de fuente de H3

*/
.node--type-noticia.node--view-mode-full .layout .field--name-field-imagen-cabecera {
  margin: 20px 0;
}
.node--type-noticia.node--view-mode-full .layout .field--name-created {
  color: #8F8F8F;
  display: block;
  margin-top: 15px;
}
.node--type-noticia.node--view-mode-full .layout .field--name-field-subtitulo {
  color: #181818;
  font-size: 18px;
  font-family: "Roboto";
  font-weight: 700;
  margin-top: 20px;
}

/* CONTROLES UI*/
/*
    ========== BOTONES ==========

    Estilos dedicados a los botones.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin button_style_scnd($color, $bg_color, $boder_color)

        @mixin button_style_scnd_hover($color, $bg_color, $boder_color)

        @mixin display_flex($direction, $justify_content, $align_items)

        @mixin button_icon($size, $m-left, $img, $filter)

        @mixin tipografia($font,$index,$weight)


    ------------------------- MIXINS --------------------------
    button_style_sncd = El estilo del botón secundario

    button_style_scnd_hover = El estilo del botón secundario cuando el cursor se
    posa sobre él

    display_flex = Mixin para las vistas display

    button_icon = Los estilos del icono del botón

    ----------------------- VARIABLES -------------------------
    $color = Color de la letra del botón

    $bg_color = Color de fondo del botón

    $boder_color = Color del borde del botón

    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

    $size = Tamaño del icono

    $m-left = Margen izquierdo del icono con respecto al texto

    $filter = Filtro aplicado al pasar el ratón por encima del
    enlace

    $font = Representa el mapa de tipo de fuente

    $index = El índice del mapa $family

    $weight = El índice del mapa $font

    $button_font_size_mn_1 / 2 = Tamaño de fuente del botón
    principal con estilo 1 / 2

    $icon_btn_mn_1_height = Altura del icono del boton 1

    $icon_btn_mn_1_width = Anchura del icono del boton 1

    $icon_btn_mn_2_size = Ancho y alto del icono del boton 2

    $icon_btn_mn_1 / 2_m-left = Margen izquierdo del icono
    para el botón 1 / 2

    $button_mn_1 / 2_icon = Icono del botón 1 / 2

    ------------------------- MAPAS ---------------------------
    $family:('Open Sans', 'Source Sans Pro', 'Roboto');

    $Roboto:(thin:100,light:300,regular:400,medium:500,
    bold:700, black:900)
*/
.ps-mn-btn-style-1 {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: center;
  color: #444444;
  font-family: "Roboto";
  font-weight: 500;
  font-size: 14px;
}
.ps-mn-btn-style-1::after {
  content: "";
  display: block;
  width: 21px;
  height: 9px;
  margin-left: 8px;
  background-image: url("");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: none;
}
.ps-mn-btn-style-1:hover {
  color: #617F95;
}
.ps-mn-btn-style-1:hover::after {
  content: "";
  display: block;
  width: 21px;
  height: 9px;
  margin-left: 8px;
  background-image: url("");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: invert(51%) sepia(10%) saturate(1126%) hue-rotate(163deg) brightness(92%) contrast(87%);
}

.ps-mn-btn-style-1-upopular {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: center;
  color: #444444;
  font-family: "Roboto";
  font-weight: 500;
  font-size: 14px;
}
.ps-mn-btn-style-1-upopular::after {
  content: "";
  display: block;
  width: 21px;
  height: 9px;
  margin-left: 8px;
  background-image: url("");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: none;
}
.ps-mn-btn-style-1-upopular:hover {
  color: #970076;
}
.ps-mn-btn-style-1-upopular:hover::after {
  content: "";
  display: block;
  width: 21px;
  height: 9px;
  margin-left: 8px;
  background-image: url("");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: invert(10%) sepia(84%) saturate(7034%) hue-rotate(307deg) brightness(70%) contrast(102%);
}

.ps-mn-btn-style-1-albacete {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: center;
  color: #444444;
  font-family: "Roboto";
  font-weight: 500;
  font-size: 14px;
}
.ps-mn-btn-style-1-albacete::after {
  content: "";
  display: block;
  width: 21px;
  height: 9px;
  margin-left: 8px;
  background-image: url("");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: none;
}
.ps-mn-btn-style-1-albacete:hover {
  color: #B31C46;
}
.ps-mn-btn-style-1-albacete:hover::after {
  content: "";
  display: block;
  width: 21px;
  height: 9px;
  margin-left: 8px;
  background-image: url("");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: invert(8%) sepia(48%) saturate(4546%) hue-rotate(333deg) brightness(90%) contrast(95%);
}

.ps-mn-btn-style-2 {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: center;
  color: #444444;
  font-family: "Roboto";
  font-weight: 700;
  font-size: 16px;
}
.ps-mn-btn-style-2::after {
  content: "";
  display: block;
  width: 21px;
  height: 21px;
  margin-left: 8px;
  background-image: url("/sites/default/files/iconos-svg/flecha-derecha.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: none;
}
.ps-mn-btn-style-2:hover {
  color: #617F95;
}
.ps-mn-btn-style-2:hover::after {
  content: "";
  display: block;
  width: 21px;
  height: 21px;
  margin-left: 8px;
  background-image: url("/sites/default/files/iconos-svg/flecha-derecha.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: invert(51%) sepia(10%) saturate(1126%) hue-rotate(163deg) brightness(92%) contrast(87%);
}

.ps-mn-btn-style-2-upopular {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: center;
  color: #444444;
  font-family: "Roboto";
  font-weight: 700;
  font-size: 16px;
}
.ps-mn-btn-style-2-upopular::after {
  content: "";
  display: block;
  width: 21px;
  height: 21px;
  margin-left: 8px;
  background-image: url("/sites/default/files/iconos-svg/flecha-derecha.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: none;
}
.ps-mn-btn-style-2-upopular:hover {
  color: #970076;
}
.ps-mn-btn-style-2-upopular:hover::after {
  content: "";
  display: block;
  width: 21px;
  height: 21px;
  margin-left: 8px;
  background-image: url("/sites/default/files/iconos-svg/flecha-derecha.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: invert(10%) sepia(84%) saturate(7034%) hue-rotate(307deg) brightness(70%) contrast(102%);
}

.ps-mn-btn-style-2-albacete {
  display: flex;
  flex-direction: row;
  justify-content: initial;
  align-items: center;
  color: #444444;
  font-family: "Roboto";
  font-weight: 700;
  font-size: 16px;
}
.ps-mn-btn-style-2-albacete::after {
  content: "";
  display: block;
  width: 21px;
  height: 21px;
  margin-left: 8px;
  background-image: url("/sites/default/files/iconos-svg/flecha-derecha.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: none;
}
.ps-mn-btn-style-2-albacete:hover {
  color: #B31C46;
}
.ps-mn-btn-style-2-albacete:hover::after {
  content: "";
  display: block;
  width: 21px;
  height: 21px;
  margin-left: 8px;
  background-image: url("/sites/default/files/iconos-svg/flecha-derecha.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  filter: invert(8%) sepia(48%) saturate(4546%) hue-rotate(333deg) brightness(90%) contrast(95%);
}

.ps-scnd-btn-style-1 {
  color: #181818;
  font-size: 16px;
  background-color: #FFFFFF;
  padding: 8px 24px;
  border: 1px solid #181818;
  font-family: "Roboto";
  font-weight: 500;
}
.ps-scnd-btn-style-1:hover {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #B31C46;
  border-color: #B31C46;
}

.ps-scnd-btn-style-1-upopular {
  color: #181818;
  font-size: 16px;
  background-color: #FFFFFF;
  padding: 8px 24px;
  border: 1px solid #181818;
  font-family: "Roboto";
  font-weight: 500;
}
.ps-scnd-btn-style-1-upopular:hover {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #970076;
  border-color: #970076;
}

.ps-scnd-btn-style-1-albacete {
  color: #181818;
  font-size: 16px;
  background-color: #FFFFFF;
  padding: 8px 24px;
  border: 1px solid #181818;
  font-family: "Roboto";
  font-weight: 500;
}
.ps-scnd-btn-style-1-albacete:hover {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #B31C46;
  border-color: #B31C46;
}

.ps-scnd-btn-style-2 {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #B31C46;
  padding: 8px 24px;
  border: 1px solid #B31C46;
  font-family: "Roboto";
  font-weight: 500;
}
.ps-scnd-btn-style-2:hover {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #617F95;
  border-color: #617F95;
}

.ps-scnd-btn-style-2-upopular {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #181818;
  padding: 8px 24px;
  border: 1px solid #181818;
  font-family: "Roboto";
  font-weight: 500;
}
.ps-scnd-btn-style-2-upopular:hover {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #970076;
  border-color: #970076;
}

.ps-scnd-btn-style-2-albacete {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #181818;
  padding: 8px 24px;
  border: 1px solid #181818;
  font-family: "Roboto";
  font-weight: 500;
}
.ps-scnd-btn-style-2-albacete:hover {
  color: #FFFFFF;
  font-size: 16px;
  background-color: #B31C46;
  border-color: #B31C46;
}

/*
    Estilos de controles de formulario

    Estilos dedicados a los controles de formulario.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin input_style($padding)

        @mixin radio_style

        @mixin radio_check_style

    ----------------------- MIXINS -----------------------------
    input_style = Estilo del campo del formulario

    radio_style = Estilo del botón radio del formulario

    radio_check_style = Estilo del botón radio cuando está
    marcado
    --------------------- VARIABLES ----------------------------
    $padding = Tamaño del padding del elemento

    $boder_form_input_error = Estilo de los input cuando hay
    un error en el formulario

    $main_color_1 / 2 / 5 / 6 = Color principal de tipo 1 / 2 / 5 / 6

    $border_form_radio_error = Tipo de borde del botón radio
    cuando hay errores

    $form_error = Color del error en el formulario

    $checkbox_shadow = Tipo de sombra del checkbox

    $outline_form_check_error = Borde rojo para cuando hay error
    en el checkbox
*/
.form-item input[type=text].error,
.form-item input[type=email].error,
.form-item input[type=password].error,
.form-item input[type=number].error,
.form-item textarea.error,
.form-item select.error {
  border: none;
  border-bottom: 2px solid #DC0000;
}

input[type=radio] {
  appearance: none;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  border: 0.5px solid #617F95;
}

input[type=radio]:hover {
  appearance: none;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  border: 1px solid #617F95;
}

input[type=radio]::before {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 100%;
  margin: 3px auto;
}

input[type=radio]:checked::before {
  background-color: #B31C46;
}

input[type=radio].error {
  border: 1px solid #DC0000;
}

input[type=radio].error:checked:before {
  background-color: #DC0000;
}

input[type=checkbox] {
  box-shadow: 0 2px 3px #00000029;
}

input[type=checkbox].error {
  outline: 1px solid #DC0000;
}

/* CHOSEN */
.chosen-container {
  font-size: 15px;
  background-color: #F9F9F9;
}
.chosen-container .chosen-single {
  border: none;
  background: none;
  box-shadow: none;
  border-bottom: 1px solid #181818;
  border-radius: 0;
}
.chosen-container .chosen-single b {
  filter: invert(21%) sepia(73%) saturate(489%) hue-rotate(163deg) brightness(57%) contrast(90%);
  transform: rotateZ(270deg) translateX(4px);
}
.chosen-container .chosen-results {
  display: none;
}
.chosen-container .chosen-results .active-result {
  background-color: #617F95;
  color: #FFFFFF;
  border-bottom: 1px solid #FFFFFF;
}
.chosen-container-active.chosen-with-drop .chosen-single {
  border: none;
  background: none;
  box-shadow: none;
}
.chosen-container-active.chosen-with-drop .chosen-single b {
  transform: rotateZ(-180deg) translateX(8px);
}
.chosen-container-active.chosen-with-drop .chosen-results {
  display: block;
}
.chosen-container.select-dark .active-result {
  background-color: #444444;
}
.chosen-container.error .chosen-single {
  border: none;
  border-bottom: 2px solid #DC0000;
}

/*
    ============= ACORDEÓN ==============

    Estilos dedicados a los acordeones.

    Se ha hecho uso de los siguientes MIXINS:

        @mixin before-icon($size, $left, $icon)

        @mixin after-icon($size, $right, $icon)

        @mixin display_flex($direction, $justify_content, $align_items)

    ------------------------- MIXINS --------------------------
    before-icon = Mixin para insertar icono antes del contenido

    after-icon = Inserta un icono después del contenido

    display_flex = Mixin para las vistas display flex

    ----------------------- VARIABLES -------------------------
    $size = Tamaño del icono

    $right = Posición a la izquierda del icono

    $left = Posición a la izquierda del icono

    $icon = SVG del icono

    $main_color_1 / 3 / 4 = Color principal de tipo 1 / 3 / 4

    $help_icon = Icono de ayuda

    $filter_main_color_1 = Filtro del color principal

    $show_more_icon = Icono de "ver más"

    $file_icon = Icono de fichero

    $direction = Propiedad flex-direction (Flex)

    $justify_content = Propiedad justify-content (Flex)

    $align_items = Propiedad align-items (Flex)

*/
/* Módulo de acordeón */
.ui-accordion .ui-accordion-header {
  color: #B31C46;
  padding: 0.5em 60px;
}
.ui-accordion .ui-accordion-header a {
  color: #B31C46;
}
.ui-accordion .ui-accordion-header.ui-state-active {
  background: #ededed;
  border-color: #c5c5c5;
  color: #B31C46;
}
.ui-accordion .ui-accordion-header.ui-state-active::after {
  transform: rotate(45deg);
}
.ui-accordion .ui-accordion-header.ui-state-active a {
  color: #B31C46;
}
.ui-accordion .ui-accordion-header::before {
  content: "";
  display: block;
  background-image: url("/sites/default/files/iconos-svg/ayudar.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  position: absolute;
  left: 15px;
  width: 20px;
  height: 20px;
  filter: invert(20%) sepia(46%) saturate(4468%) hue-rotate(326deg) brightness(83%) contrast(96%);
}
.ui-accordion .ui-accordion-header::after {
  content: "";
  display: block;
  background-image: url("/sites/default/files/iconos-svg/Grupo-266.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: initial;
  position: absolute;
  right: 15px;
  width: 20px;
  height: 20px;
  filter: invert(20%) sepia(46%) saturate(4468%) hue-rotate(326deg) brightness(83%) contrast(96%);
  transition: all 300ms;
  top: 8px;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  display: none;
}

/* Acordeón desde estilos (Bloque de vista) */
.block-view-accordion {
  margin: 10px auto;
}
.block-view-accordion.close-accordion h1::after {
  transform: initial;
}
.block-view-accordion h1 {
  background-color: #EEEEEE;
  padding: 10px 10px 10px 30px;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  cursor: pointer;
}
.block-view-accordion h1::after {
  content: "";
  display: block;
  background-image: url("/sites/default/files/iconos-svg/Grupo-266.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: initial;
  width: 20px;
  height: 20px;
  background-color: transparent;
  transition: all 300ms;
  transform: rotateZ(45deg);
}
.block-view-accordion .ps-custom-file,
.block-view-accordion .field__item {
  border: 1px solid #EEEEEE;
  padding: 20px;
}
.block-view-accordion.accordion-file-icon h1::before {
  content: "";
  display: block;
  background-image: url("/sites/default/files/iconos-svg/archivo.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  position: absolute;
  left: 10px;
  width: 20px;
  height: 20px;
  filter: invert(20%) sepia(46%) saturate(4468%) hue-rotate(326deg) brightness(83%) contrast(96%);
}
.block-view-accordion.accordion-link-icon h1::before {
  content: "";
  display: block;
  background-image: url("/sites/default/files/iconos-svg/archivo.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: initial;
  position: absolute;
  left: 10px;
  width: 20px;
  height: 20px;
  filter: invert(20%) sepia(46%) saturate(4468%) hue-rotate(326deg) brightness(83%) contrast(96%);
}

/*# sourceMappingURL=turismo.css.map */