@import 'var';
@import url("estilos.css"); 
@import url("../slider/style.css");  
//reset
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
html {
  margin: 0;
  padding: 0;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
  &.tabla-gestion-resultados {
    margin: 5rem 0;
    tr {
      th {
        background-color: $gris-azul;
        color: $blanco;
        padding: 1rem;
      }
    }
    tr {
      td {
        padding: 1rem;
      }
    }
  }
}
.clear {
  clear: both;
}
/*-----GENERALES-----*/
*, *:before, *:after {
  box-sizing: inherit;
}
* {
  margin: 0;
  padding: 0;
} 
html {
  font-size: 62.5%;
  box-sizing: border-box;
}
body {
  font-size: 1.6rem!important;
  font-family: 'Roboto', sans-serif;
  line-height: normal;
}
h2, h3, h4, h5 {
  font-family: "rockwellbold";
  color: $gris-azul;
  font-weight: 700;
}
a {
  text-decoration: none;
  color: $rosa-fuerte;
}
p {
  margin-bottom: 1.6rem;
}
strong {
    font-weight: 900;
}
.icon {
    display: flex;
    font-family: 'icomoon';
}
.checkbox_interno {
  display: none;
}
.btn {
  display: flex;
  padding:1.5rem;
  border-radius: .5rem;
  background-color: $rosa-fuerte;
  color: $blanco;
  &.w300-aling-rigth {
    margin-left: auto;
    width: 30rem;
    justify-content: center;
  }
  &.no-active-btn {
    opacity: .3;
    cursor: default;
  }
}
/*-------HEADER-----*/
.header-template {
    display: flex;
    align-items: center;
    background-color: #912180;
    width: 100%;
    height: 8rem;
    margin-bottom:2rem ;
    background-image: url(../imagenes/layout/back-header-rop.webp);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: auto 100%;
    h1 {
        color: $blanco;
        font-weight: 400;
        font-size: 2rem;
        .titulo-ieem {
          display: block;
        }
    }
    .icon {
        align-items: center;
        justify-content: center;
        width: 20rem;
        height: 100%;
        background-color:$gris-azul;
        position: relative;
        margin-right: 2rem;
        &.icon-ieem-logo {
            font-size: 5rem;
            text-align: center;
            color: $blanco;
        }
        &::after {
            display: block;
            content: '';
            width: .2rem;
            height: 90%;
            position: absolute;
            background-color: $blanco;
            top: 0;
            bottom: 0;
            right: 0;
            margin: auto;
        }
    }
    a.skip-main {
        left: -999px;
        position: absolute;
        top: auto;
        width: auto;
        height: 1px;
        font-size: 1.4rem;
        overflow: hidden;
        z-index: -999;
    }
    a.skip-main:focus {
        left: auto;
        top: auto;
        width: 30%;
        height: auto;
        overflow: auto;
        margin: 0 35%;
        padding: 5px;
        font-size: 20px;
        outline: 3px solid $blanco;
        text-align: center;
        z-index: 999;
        color: $blanco;
      }
}
/*------NAV------*/
#btn-main-menu {
  display: none;
}
label.icon-nav {
  display: none;
}
.nav-template {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 3rem 2rem 3rem;
  position:relative;
  border-bottom: solid 1px $rosa-fuerte;
  ul {
    display: flex;
    justify-content: space-between;
    li {
      list-style:none;
      position: relative;
      margin-right: 1rem;
      a, button {
        display: block;
        color: $gris-azul;
        font-weight: 700;
        padding: 1rem;
        text-align: left;
        font-size: 1.6rem;
      }
      ul {
      display: flex;
      flex-direction: column;
      width: 22rem;
        li {
          margin-right: 0;
          button {
            &[aria-expanded="false"]:after, &[aria-expanded="true"]:after {
              color: $blanco;
            }
          }
          a, button {
            color: $blanco;
            font-weight: 300;
            font-size: 1.5rem;
            &:hover {
              background-color: rgba($negro, .7);
            }
          }
          ul {
            background-color: rgba($negro, .5);
            li {
              a {
                display: block;
                width: 100%;
                color: $blanco;
                font-weight: 300;
                color: $blanco;
                padding-left: 2rem;
                font-size: 1.3rem;
                &:hover {
                  background-color: rgba($negro, .7);
                }
              }
            }
          }
        }
      }
      button {
        border: 0;
        background: transparent;
        cursor: pointer;
        width: 100%;
        display: flex;
        margin-right: .5rem;
        &[aria-expanded="false"]:after, &[aria-expanded="true"]:after {
          font-family: 'icomoon';
          display: flex;
          margin-left: auto;
          content: "\e900";
          color: $rosa-fuerte;
          font-size: 1.5rem;
        }
        &[aria-expanded="true"]:after {
          transform: rotate(180deg);
        }
      }
    }
  }
  > ul > li > ul {
    position: absolute;
    z-index: 10;
  }
  [id^="sub"]{
    background-color:rgba($negro, .7);
  }
}
/*------MAIN------*/
main {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 3rem;
  justify-content: space-around;
  position: relative;
  p {
    text-align: justify;
  }
  .contenido-template {
    width: 68%;
    height: auto;
    padding: 0 0 3rem 2rem;
    /*-------- PAGINA DE INICIO-----*/
    .botonera-inicio {
      ul {
        display: grid;
        gap: 2rem;
        grid-template-columns: repeat(auto-fill, minmax(min(30rem, 100%), 1fr));
        margin-bottom: 5rem;
        li {
          a {
            display: flex;
            align-items: center;
            width: 100%;
            height: 10rem;
            border-radius: .3rem;
            padding: 1rem 2rem 1rem 11rem;
            background-color: #f4f3f2;
            color: $gris-azul;
            font-weight: 600;
            box-shadow: 2px 2px 5px rgba($negro, .3);
            position: relative;
            overflow: hidden;
            &::before {
              position: absolute;
              display: block;
              content: '';
              width: 10rem;
              height: 100%;
              left: 0;
              background-color: #c78cba;
              background-position: center;
              background-repeat: no-repeat;
              background-size: 5rem auto;
            }
            &.participacion::before  {
              background-image: url(../imagenes/layout/participacion-ciudadana.svg);
            }
            &.igualdad-genero::before  {
              background-image: url(../imagenes/layout/igualdad-y-no-discriminacion.svg);
            }
            &.cultura-politica::before  {
              background-image: url(../imagenes/layout/cultura-politica.svg);
            }
            &.proceso::before  {
              background-image: url(../imagenes/layout/proceso.svg);
            }
            &.academicas::before  {
              background-image: url(../imagenes/layout/actividades-academicas.svg);
            }
            &.concursos::before  {
              background-image: url(../imagenes/layout/concursos.svg);
            }
          }
          &.banner-Full {
            width: 100%;
          }
        }
      }
      &.sub-paginas {
        ul {
          li {
            a {
              align-items: flex-end;
              position: relative;
              overflow: hidden;
              padding: 2rem 2.5rem 1.5rem 2.5rem;
              height: 20rem;
              &::after {
                content: '';
                display: block;
                width: 100%;
                height: 100%;
                position: absolute;
                left: 0;
                top: 0;
                background-color: rgba($negro, .4);
                z-index: 2;
              }
              img {
                display: block;
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                margin: auto;
                width: 100%;
                height: auto;
                transition: all .3s;
                z-index: 1;
              }
              &:hover {
                img {
                  transition: all .3s;
                  transform: scale(1.1);
                }
              }
              span {
                display: flex;
                width: 90%;
                position: absolute;
                z-index: 3;
                color: $blanco;
                font-weight: 500;
                padding: .5rem 0;
                &::before {
                  display: inline-block;
                  content: '';
                  border-left: solid 2px $rosa-fuerte;
                  margin-right: .5rem;
                  background-color:$rosa-fuerte;
                }
              }
            }
          }
        }
      }
    }
    .banner-full {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 100%;
      min-height: 10rem;
      border-radius: .3rem;
      padding: 1rem 2rem;
      background-color: #c78cba;
      color: $gris-azul;
      font-weight: 600;
      box-shadow: 2px 2px 5px rgba($negro, .3);
      margin-bottom: 5rem;
      color: $blanco;
      font-size: 3rem;
      position: relative;
      overflow: hidden;
      text-align: center;
      &.proceso::before  {
        display: block;
        width: 30rem;
        height:30rem;
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        background-image: url(../imagenes/layout/proceso.svg);
        background-repeat: no-repeat;
        background-position: center;
        opacity: .2;
      }
      span {
        display: block;
        font-size: 1.8rem;
        font-weight: 300;
      }
    }

    .contenedor-links-boxs {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      margin: 5rem auto;
      .contenido-links-box {
        display: block;
        width: 49%;
        margin-bottom: 5rem;
        button {
          border: 0;
          background: transparent;
          cursor: pointer;
          width: 100%;
          display: flex;
          margin-right: .5rem;
          font-family: 'rockwellbold';
          color: $gris-azul;
          font-size: 2.3rem;
          border-bottom: solid 1px $rosa-fuerte;
          background-color: $gris-medio;
          padding: 2rem;
          &[aria-expanded="false"]:after, &[aria-expanded="true"]:after {
            font-family: 'icomoon';
            display: flex;
            margin-left: auto;
            content: "\e900";
            color: $rosa-fuerte;
            font-size: 1.5rem;
            margin-bottom: 0;
          }
          &[aria-expanded="true"]:after {
            transform: rotate(180deg);
          }
        }
        ul {
          background-color: $gris-medio;
          padding: 0;
          margin-bottom: 2rem;
          &.listas-box {
            display: flex;
            flex-direction: column;
            li {
              display: block;
              width: 100%;
              border-bottom: solid 1px $gris-azul;
              margin: 0;
              a {
                display: block;
                padding: 1rem;
                color: $gris-azul;
                margin: 0;
                padding: 2rem;
                i {
                  display: block;
                  font-size: 1.3rem;
                }
                &:hover {
                  background-color: #d7d6d6;
                }
              }
            }
          }
          &.partidos {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr));
            gap: 1rem;
            padding: 2rem;
            li { 
              
              a {
                img {
                  width: 70%;
                  height: auto;
                }
              }
            }
          }
        }
      }
    }
    .sitios_interes {
      h2 {
        border-bottom: solid 1px $rosa-fuerte;
        &::after {
          display: none;
        }
      }
    }
    @media screen and (max-width: 768px) {
      .contenedor-links-boxs {
        .contenido-links-box {
          display: block;
          width: 100%;
        }
      }
    }
  /*-----------FINAL PAGINA DE INICIO--------*/
}
  .aside-template {
    width: 25%;
    height: auto;
    .botonera-lateral {
      ul {
        display: flex;
        flex-direction: column;
        li {
          display: block;
          margin-bottom: 1rem;
          a {
            display: block;
            width: 100%;
            padding: 2rem 0 2rem 1rem;
            color: $blanco;
            font-family: 'rockwellregular';
            letter-spacing: .05rem;
            font-weight: 200;
            background-color: #a72b7b;
            font-size: 1.4rem;
          }
          h4 {
            color: $blanco;
            padding: 1rem 1rem 0 1rem;
            font-size: 1.4rem;
            font-weight: 200;
            font-family: "Roboto", sans-serif;
          }
          .sub-sub-nav {
            padding-left: 2rem;
            li {
              a {
                padding-right: 0;
              }
            }
          }
          button {
            display: flex;
            width: 100%;
            padding: 2rem 4rem 2rem 1rem;
            color: $blanco;
            font-family: 'rockwellregular';
            font-weight: 200;
            background-color: #a72b7b;
            font-size: 1.4rem;
            border: none;
            text-align: left;
            letter-spacing: .05rem;
            cursor: pointer;
            position: relative;
            &[aria-expanded="false"]:after, &[aria-expanded="true"]:after {
              font-family: 'icomoon';
              display: flex;
              justify-content: center;
              align-items: center;
              margin-left: auto;
              background-color: #b74d8a;
              content: "\e900";
              color: $blanco;
              font-size: 1.5rem;
              width: 4rem;
              height: 100%;
              position: absolute;
              right: 0;
              top: 0;
            }
            &[aria-expanded="true"]:after {
              transform: rotate(180deg);
            }
          }
          > ul {
            display: block;
            background-color: #8b1f66;
            li {
              margin-bottom: 0;
              a {
                font-family: 'Roboto', sans-serif;
                background-color: transparent;
                padding: 1rem;
              }
            }
          }
        }
      }
    }
    .lateral {
      display: block;
      width: 100%;
      overflow: hidden;
      margin: 2rem 0;
      background-color: $gris-medio;
      padding:2rem 1rem;
      h2 {
        font-size: 1.6rem;
        padding-bottom: 1rem;
        border-bottom: solid 1px $rosa-fuerte;
        &:after {
          display: none;
        }
      }
      .contenedor-transmisiones {
        display: block;
        margin-bottom: 4rem;
        .transmisiones-header {
          display: block;
          background-color: $negro;
          width: 100%;
          height: 15rem;
          position: relative;
          z-index: 2;
          overflow: hidden;
          margin-bottom: 2rem;
          &::after {
            display: block;
            width: 100%;
            height: 15rem;
            content: '';
            top: 0;
            left: 0;
            position: absolute;
            background-image: url(../imagenes/layout/cg.jpg);
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
            opacity: .5;
            z-index: 1;
          }
          &.sin-transmision {
            &::before {
              display: block;
              width: 100%;
              height: 15rem;
              content: '';
              top: 0;
              bottom: 0;
              left: 0;
              right: 0;
              background-image: url(../imagenes/layout/no-transmisiones-01.svg);
              background-repeat: no-repeat;
              background-position: center;
              background-size: 10rem;
            }
          }
        }
        .poscast-header {
          img {
            display: block;
            width: 100%;
          }
        }
      }
    }
  }
  .menu-toogle, .checkbox {
    display: none;
  }
  p, ul, ol {
    color: $gris-azul;
  }
main {
  #principal_template, .contenido-template-inter {
    width: 72%;
    height: auto;
    padding: 0 0 3rem 3%;
    p {
      margin-bottom: 1.6rem;
    }
    h3 {
      display: block;
      position: relative;
      font-size: 2.3rem;
      margin-bottom: 1rem;
      padding-bottom: .8rem;
      font-weight: 800;
      &:before {
        content: "";
        display: block;
        position: absolute;
        width: 5rem;
        height: 0.5rem;
        bottom: 0;
        left: 0;
        background-color: $rosa-fuerte;
      }
    }
    h4 {
      font-weight: 700;
      font-size: 2rem;
    }
  }
  /*--CONTENEDOR TABLAS CONSEJO--*/
  .contenedor_tablas_grid {
    display: grid;
    grid-template-columns: [columna1] 80% [columna2] 20% [columna3];
    width: 100%;
    .contenido_consejo {
      grid-column: columna1 / columna2;
    }
    .menu_contenido_consejo {
      grid-column: columna2 / columna3;
      margin: 0 auto;
      .busqueda_año_txt {
        display: block;
        margin: 1.5rem auto;
        font-size: 1.1rem;
        font-style: italic;
        width: 90%;
        line-height: normal;
        text-align: center;
      }
      table {
        margin: 0 auto;
        text-align: center;
      }
    }
    }
  }
  #navy_template {
    width: 25%;
    height: auto;
    padding: 2rem 0 2rem 0;
    background-color: $blanco;
    h3 {
      font-size: 1.8rem;
    }
    button {
      border: none;
      background-color: transparent;
      appearance: none;
      text-align: left;
      padding: 1rem;
      cursor: pointer;
      border-bottom: solid 1px #ccc;
      color: $gris-azul;
      display: flex;
      width: 100%;
      font-size: 1.6rem;
      font-weight: 300;
      font-size: 1.6rem !important;
      font-family: "Roboto", sans-serif;
      &[aria-expanded="false"]:after, &[aria-expanded="true"]:after {
        font-family: 'icomoon';
        display: flex;
        margin-left: auto;
        content: "\e900";
        color: $gris-azul;
        font-size: 1.5rem;
        padding-left: 2rem;
        padding-right: 0;
      }
      &[aria-expanded="true"]:after {
        transform: rotate(180deg);
        padding-left: 0;
        padding-right: 2rem;
      }
    }
    ul {
      margin:0 0 3rem 0;
      li {
        display: block;
        border-bottom: solid 1px #ccc;
        a {
          display: block;
          padding: 1rem;
          color: $gris-azul;
          letter-spacing: .01rem;
        }
      }
    }
  }
  .nav-normatividad {
    ul {
      margin-bottom: 0!important;
    }
    .sub-nav {
      padding: 0 0 0 2rem;
      background-color: $gris-box;
      border-bottom: solid 1px #e1e1e1;
      li:last-child {
        border-bottom: none!important;
      }
    }
  }
  h2 {
    display: block;
    width: 100%;
    padding-bottom: 1rem;
    margin-bottom: 2rem;
    font-size: 2.5rem;
    position: relative;
    &.titulo-subpag {
      display: flex;
      align-items: center;
      &::before {
        display: inline-block;
        content: '';
        width: 5rem;
        height: 5rem;
        margin-right: 1rem;
        margin-bottom: 1rem;
        background-position: center;
        background-repeat: no-repeat;
        background-size:  auto 100%;
      }
      &.no-icon {
        &::before {
          display: none;
        }
      }
      &.participacion {
        &::before {
        background-image: url(../imagenes/layout/participacion-ciudadana-2.svg);
        }
      }
      &.igualdad {
        &::before {
        background-image: url(../imagenes/layout/igualdad-y-no-discriminacion-2.svg);
        }
      }
      &.editoriales {
        &::before {
          background-image: url(../imagenes/layout/actividades-academicas-2.svg);
        }
      }
      &.eventos {
        &::before {
          background-image: url(../imagenes/layout/concursos-2.svg);
        }
      }
    }
  }
  .cont_tabs {
    h2 {
      font-size: 1.6rem;
    }
    h3 {
      font-size: 1.6rem;
    }
  }
}

/*---- TEMPLATE PAGINA INTERIORES SUBMENU ESCONDICO---*/
main.template-main {
  display: block;
  overflow: hidden;
  p {
    margin-bottom: 1.8rem;
  }
  .contenedor-foto {
    display: block;
    width: 100%;
    height: 25rem;
    overflow: hidden;
    margin: 0 auto 3rem auto;
    position: relative;
    margin-bottom: 3rem;
    z-index: 1;
    .img-general {
      width: 100%;
      margin: 0 auto;
      position: absolute;
      z-index: 1;
      top: 0;
      bottom: 0;
      margin: auto;
    }
    h2 {
      display: block;
      position: absolute;
      z-index: 3;
      bottom:1rem ;
      left: 3rem;
      color: $blanco;
      font-size: 3rem;
      padding-bottom: 1rem;
      margin-bottom: 2rem;
      &::after {
        content: "";
        display: block;
        position: absolute;
        width: 5rem;
        height: 0.5rem;
        bottom: 0;
        left: 0;
        background-color: $rosa-fuerte;
      }
    }
    &:before {
      content: "";
      display: block;
      position: absolute;
      width: 100%;
      height: 25rem;
      top:0 ;
      left:0;
      background-color: rgba($negro, .5) ;
      z-index: 2;
    }
  }
  h3 {
    font-weight: 600!important;
    line-height: normal;
  }
  .contenedor-contenido-bloque {
    display: grid;
    grid-template-columns: [hz1] 30rem [hz2] 1fr [hz3];
    /*----------CONTENIDOS INTERIOR------*/
    #principal_template  {
      grid-column:hz1 / hz3;
      width: 100%;
      padding: 2rem;
      margin-top: 2.5rem;
      .bloque-full {
        display: block;
        background-color: $gris-box;
        border-radius: 1rem;
        padding: 4rem;
        box-shadow: .5rem .5rem .5rem rgba($negro, .2);
        &.funciones {
          padding-left: 38rem;
          background-image: url(../imagenes/layout/funciones-consejo.png);
          background-repeat: no-repeat;
          background-position: left center;
          background-size: auto 20rem;
        }
        @media (max-width: 768px) { 
            &.funciones {
              padding-left: 4rem;
              text-align: center;
              background-position: left center;
              background-size: contain;
          }
        }
      }
      /*---------CONSEJO GENERAL---------*/
      .bloque-lista {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        li {
          flex-basis: calc(31% - 1rem);
          padding: 2rem;
          
        align-content: left;
          line-height: normal;
          &:before {
            display: block;
            content: '';
            width: 7rem;
            height: 7rem;
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
            margin: 0 auto 1.5rem auto;
          }
          &.pregunta::before {
            background-image: url(../imagenes/layout/pregunta-icono.svg);
          }
          &.engrane::before {
            background-image: url(../imagenes/layout/engrane-icono.svg);
          }
          &.puzzle::before {
            background-image: url(../imagenes/layout/puzzle-icono.svg);
          }
        }
        @media (max-width: 768px) { 
          li {
           flex-basis:calc(50% - 1rem) ;
         }
       }
       @media (max-width: 500px) { 
         li {
          flex-basis:calc(100% - 1rem) ;
         }
       }
      }
    }
    .diagrama-cg {
      margin: 5rem auto;
      width: 100%;
      overflow-x:auto ;
      ul {
        display: flex;
        flex-wrap: wrap;
        background-image: url(../imagenes/layout/back-integracion-cg.svg);
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: auto 15rem;
          li {
            display: flex;
            width: 50%;
            justify-content: end;
            padding-right: 2rem;
              a {
                display: flex;
                flex-direction: row;
                align-items: center;
                font-size: 1.3rem;
                color: rgba($gris-azul, .4)!important;
                line-height: normal;
                text-align: right;
                margin-bottom: 1.5rem;
                color: transparent;
                span {
                  display: flex;
                  width: 2rem;
                  min-width: 2rem;
                  height: 2rem;
                  min-height: 2rem;
                  background-color: $gris-azul;
                  border-radius: 1rem;
                  margin-left: 1rem;
                  margin-right: 0;
                }
                &:hover {
                  color: $rosa-fuerte!important;
                  span {
                    background-color: $rosa-fuerte;
                  }
                }
              }
            &.ce1 { 
              a {
                margin-right: 6rem;
              }
            }
            &.ce2 { 
              a {
                margin-left: 6rem;
              }
            }
            &.ce3 { 
              a {
                margin-right: 10rem;
              }
            }
            &.ce4 { 
              a {
                margin-left: 10rem;
              }
            }
            &.ce5 { 
              a {
                margin-right: 13rem;
              }
            }
            &.ce6 { 
              a {
                margin-left: 13rem;
              }
            }
            &.rp1 { 
              a {
                margin-right: 16rem;
              }
            }
            &.rp2 { 
              a {
                margin-left: 16rem;
              }
            }
            &.rp3 { 
              a {
                margin-right: 19rem;
              }
            }
            &.rp4 { 
              a {
                margin-left: 19rem;
              }
            }
            &.rp5 { 
              a {
                margin-right: 22rem;
              }
            }
            &.rp6 { 
              a {
                margin-left: 22rem;
              }
            }
            &.rp7 { 
              a {
                margin-right: 24rem;
              }
            }
            &.rp8 { 
              a {
                margin-left: 24rem;
              }
            }
            &:nth-child(2n) {
              justify-content: start;
              padding-left: 2rem;
              a {
                flex-direction: row-reverse;
                text-align: left;
                span {
                  margin-right: 1rem;
                  margin-left: 0;
                }
              }
            }
        }
      }
    }
    .integracion {
      ul {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(30rem, 100%), 1fr));
        gap: 7rem 3rem;
        padding: 3rem;
        margin-bottom:8rem;
         li {
          .contenedor-foto-integracion {
            position: relative;
            height: 15.5rem;
            padding: 0;
            margin-bottom: 1rem;
            img {
              position: relative;
              width: auto;
              height: 15rem;
            }
            &::before {
              position: absolute;
              z-index: 2;
              display: block;
              content: '';
              bottom: 0;
              left: 0;
              width: 4rem;
              height: .5rem;
              font-size: 3rem;
              background-color: $rosa-fuerte;
          }
        }
          h5  {
            font-size: 1.8rem;
            line-height: normal;
            span {
              display: block;
              font-weight: 300;
              font-size: 1.6rem;
            }
          }
        }
        &.rep-partidos {
          grid-template-columns: repeat(auto-fit, minmax(min(50rem, 100%), 1fr));
          li {
            a {
              display:flex;
              .contenedor-foto-integracion {
                margin-right: 1rem;
              }
              .contenedor-datos-rep-partidos {
                img {
                  display: block;
                  width: auto;
                  height: 8rem;
                  margin-bottom: 1rem;
                }
                h5 {
                  font-weight: 900;
                  font-size: 2rem;
                  margin-bottom: 1rem;
                }
                p {
                  margin-bottom: 0;
                  line-height: normal;
                  &.suplente {
                    font-weight: 400;
                    font-size: 1.5rem;
                  }
                }
              }
            }
          }
        }
      }
    }
    .integrante {
      .generales {
        display: flex;
        .contenedor-foto-integracion {
          position: relative;
          height: 35rem;
          padding: 0;
          margin-bottom: 1rem;
          padding-bottom: 1rem;
          margin-right: 2rem;
          img {
            position: relative;
            width: auto;
            height: 100%;
          }
            &::before {
              position: absolute;
              z-index: 2;
              display: block;
              content: '';
              bottom: 0;
              left: 0;
              width: 10rem;
              height: 1rem;
              font-size: 3rem;
              background-color: $rosa-fuerte;
          }
        }
        h3  {
          line-height: normal;
          span {
            display: block;
            font-weight: 300;
          }
        }
        h4 {
          display: block;
          margin: 4rem 0 0 0;
          color: #4B575E;
          font-weight: 700;
        }
        p {
          line-height: normal;
          margin-bottom: 0;
        }
        .datos-integrante {
          display: flex;
          flex-direction: column;
          margin-top: 20rem;
          .datos {
            background-color: $gris-box;
            padding: 3rem;
            margin: 5rem auto;
            p {
              display: block;
              margin-bottom: 1.8rem;
              line-height: 2.2rem;
            }
            .nota {
              font-weight: 800;
              font-style: italic;
              font-size: 1.3rem;
              margin-top: 2rem;
            }
          }
        }
      }
    }
    /*-----PARTIDO POLITICO---*/
    .partido {
      .generales {
        display: flex;
        .contenedor-emblema {
          position: relative;
          height: 25rem;
          padding: 0;
          margin-bottom: 1rem;
          padding-bottom: 1rem;
          margin-right: 2rem;
          img {
            position: relative;
            width: auto;
            height: 100%;
          }
        }
        .datos-partido {
          display: flex;
          flex-direction: column;
            p {
              display: block;
              margin-bottom: 1.8rem;
              line-height: 2.2rem;
            }
            .rp-partido {
              display: flex;
              flex-wrap: wrap;
              margin-bottom: 1.8rem;
              .contenedor-foto-integracion {
                position: relative;
                height: 10rem;
                padding: 0;
                margin-bottom: 1rem;
                margin-right: 2rem;
                img {
                  position: relative;
                  width: auto;
                  height: 10rem;
                }
                .titulo {
                  display: block;
                  width: 100%;
                }
              }
            }
          }
      }
    }
    @media screen and (max-width: 768px) {
      .partido {
        .generales {
          flex-wrap: wrap;
        }
      }
    }
    /*----------ACUERDOS---------*/
    .contenedor-acuerdos {
      display: flex;
      flex-wrap: wrap;
      flex-direction: row;
      justify-content: center;
      margin: 5rem 0;
      select {
        width: 100%;
        max-width: 30rem;
        margin-bottom: 15px;
        background: $gris-medio;
        border: none;
        padding: 1.5rem;
        font-weight:400;
        background-image: url(../imagenes/layout/flecha.png);
        background-repeat: no-repeat;
        background-position: right center;
        -webkit-appearance: none;
        -moz-appearance: none;
        -o-appearance: none;
        appearance: none;
        text-align: center;
        &:first-child {
          border-right:solid 1px $gris-azul ;
        }
        &:focus {
          border: solid 1px r$rosa-fuerte;
        }
      }
    }
    #contenedor_contenido {
      font-size: 1.6rem;
      font-family: 'Roboto', sans-serif;
      p, a, strong {
        font-weight: 400;
      }
    }
    /*----------SUB MENU INTERIOR------*/
    #navy_template {
      position: absolute;
      width: 30rem;
      grid-column:hz1 / hz2;
      height: auto;
      font-weight:300;
      left: -30rem;
      z-index: 22;
      padding: 5rem 2rem 2rem 2rem;
      display: none;
      h2 {
        padding: 0;
      }
      h4 {
        font-size:1.6rem;
      }
    }
    .checkbox_interno:checked ~ #navy_template {
      display: block;
      grid-column:hz1 / hz2;
      left: 0;
      position: relative;
    }
    .checkbox_interno:checked ~ #principal_template {
      grid-column:hz2 / hz3;
    }
    .checkbox:checked ~ #principal_template {
      margin-top:100%;
    }
    input.checkbox_interno[type=checkbox] {
      display: block;
      appearance: none;
      cursor: pointer;
      position: absolute;
      z-index: 23;
      left: 1rem;
      top: 29rem;
      margin: 10px 20px;
      &::before {
        display: block;
        content: "\e9bd";
        font-size: 2rem;
        font-family: 'icomoon';
        color:#929292;
        background-color: #dedede;
        border: solid 1px #929292;
        padding:.33rem .4rem;
        border-radius: .5rem;
        width: 3rem;
        height: 3rem;
      }
      &::after {
        display: block;
        position: absolute;
        left: 4rem;
        top: .8rem;
        content: 'MENU';
      }
      &.gestion-resultados {
        top: 8rem;
      }
    }
    h3 {
      font-size: 3rem;
      margin-bottom: 1.8rem;
    }
    h4 {
      font-size: 2rem;
      font-family: 'Roboto', sans-serif;
      margin-bottom: 1.8rem;
    }
    .accordion {
      h4 {
        margin-bottom: 0;
      }
  }
  }
}


/*-------FOOTER-----*/
.footer-template {
  display: block;
  width: 100%;
  background-color: $gris-medio;
  color: $gris-azul;
  section {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(30rem, 100%), 1fr));
    gap: 3rem;
    padding: 3rem;
    max-width: 1280px;
    margin: 0 auto;
    article {
      &.logo-ieem {
        display: flex;
        .icon {
          color: $gris-azul;
          margin-right: 2rem;
          height: 10rem;
          &.icon-ieem-logo {
            font-size: 8rem;
            text-align: center;
          }
        }
        .contactos-ieem {
          padding-top: 3rem;
          h4 {
            font-family: 'Roboto', sans-serif;
            font-weight: 900;
          }
          .icon {
            font-size: 2.5rem;
            margin-right: 1rem;
            text-decoration: none;
            height: auto;
          }
          p {
            display: inline-block;
            font-size: 1.3rem;
            margin-bottom: 1rem;
            &.coe {
              display: flex;
              align-items: center;
              width: 100%;
              font-weight: 900;
              color: $gris-azul;
              span {
                display: block;
                font-family: 'icomoon';
              }
            }
          }
          span {
            display: inline;
          }
          a {
            display: flex;
            align-items: center;
            font-size: 1.3rem;
            color: $gris-azul;
            font-weight: 900;
          }
        }
      }
      &.redes {
        ul {
          display: flex;
          flex-direction: row;
          margin: 2rem 0 4rem 0;
          li {
            display: block;
            margin-right: 1rem;
            a {
              font-size: 3rem;
            }
          }
        }
        .icon {
          color: $gris-azul;
        }
        .contactos-ieem {
          padding-top: 3rem;
          p {
            font-size: 1.3rem;
          }
        }
        img {
          display: block;
          width: 15rem;
          margin-bottom: 1rem;
        }
        p, a {
          font-size: 1.3rem;
        }
      }
    }
  }
}
@media screen and (max-width: 768px) {
  .skip-main {
    display: none;
  }
  .header-template {
    position: relative;
    z-index: 25;
    h1 {
        font-size: 1.7rem;
    }
    .icon {
        width: 11rem;
        &.icon-ieem-logo {
            font-size: 4rem;
        }
    } 
  }
  #btn-main-menu {
    display: block;
  }
  input.icon-nav[type=checkbox] {
    display: block;
    appearance: none;
    cursor: pointer;
    position: absolute;
    z-index: 51;
    right: -10px;
    top: 0.5rem;
    margin: 10px 20px;
    &::before {
      display: block;
      content: "\e9bd";
      font-size: 2.8rem;
      font-family: 'icomoon';
      color: $gris-azul;
      background-color: $blanco;
      border: solid 1px #ccc;
      padding:.51rem;
      border-radius: .5rem;
      width: 4rem;
      height: 4rem;
    }
  }
  #btn-main-menu:checked ~ .nav-template {
    transform: translateX(0%);
  }
  .nav-template {
    position: absolute;
    z-index: 50;
    top: 0;
    left: 0px;
    width: 100%;
    transform: translateX(-100%);
    transition: all 0.3s;
    height: 100%;
    padding: 6rem 0 0 0;
    background-color: #f09;
    ul {
      display: flex;
      flex-direction: column;
      background-color: #f09;
      li {
        position: relative;
        margin-right: 0;
        a, button {
          color: $blanco;
        }
        ul {
        width: 100%;
          li {
            margin-right: 0;
            button {
              &[aria-expanded="false"]:after, &[aria-expanded="true"]:after {
                color: $blanco;
              }
            }
          }
        }
        button {
          &[aria-expanded="false"]:after, &[aria-expanded="true"]:after {
            color: $blanco;
          }
        }
      }
    }
    > ul > li > ul {
      position: relative;
    }
  }
  
  .footer-template section article.logo-ieem {
    flex-direction: column;
  }
main {
  padding: 0;
  overflow-x: hidden;
  margin-top: 6rem;
  .contenido-template {
    width: 96%;
    height: auto;
    padding: 0 0 3rem 0;
    margin: 0 2%;
  }
  h2 {
    &::after {
      left: 0;
    }
  }
  
  .aside-template {
    width: 96%;
    padding: 0 2%;
  }
}

/*---- TEMPLATE PAGINA INTERIORES SUBMENU ESCONDICO---*/
  main.template-main {
    .contenedor-foto {
      .img-general {
        width: 100%;
        height: auto;
      }
        
      h2 {
        padding-left: 0;
      }
    }
    .contenedor-contenido-bloque {
      /*----------CONTENIDOS INTERIOR------*/
      #principal_template  {
        .bloque-full {
          &.funciones {
            background-image: none;
          }
        }
      }
      .diagrama-cg {
        ul {
          padding-top: 12rem;
          background-position: center top;
          background-size: auto 10rem;
            li {
              &.ce1, &.ce3, &.ce5, &.rp1, &.rp3, &.rp5, &.rp7 { 
                a {
                  margin-right: 0;
                }
              }
              &.ce2, &.ce4, &.ce6, &.rp2, &.rp4, &.rp6, &.rp8 { 
                a {
                  margin-left: 0;
                }
              }
          }
        }
      }
      .integrante {
        .generales {
          flex-direction: column;
          .datos-integrante {
            margin-top: 5rem;
            .datos {
              background-color: $gris-box;
              padding: 3rem;
              margin: 5rem auto;
              p {
                display: block;
                margin-bottom: 1.8rem;
                line-height: 2.2rem;
              }
              .nota {
                font-weight: 800;
                font-style: italic;
                font-size: 1.3rem;
              }
            }
          }
        }
      }
      /*----------SUB MENU INTERIOR------*/
      input.checkbox_interno[type=checkbox] {
        left: 0;
        top: 26rem;
      }
    }
  }
}

.informes{
  padding: 1rem;
  font-weight: 700;
}