@import url('https://fonts.googleapis.com/css2?family=Urbanist: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');
@import url('https://fonts.googleapis.com/css2?family=Alegreya+Sans+SC:ital,wght@0,100;0,300;0,400;0,500;0,700;0,800;0,900;1,100;1,300;1,400;1,500;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans: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');

* {
   margin: 0;
   padding: 0;
}

a {
   text-decoration: none;
}

.flex {
   display: flex;
}

.w40 {
   width: 40%;
}

.w60 {
   width: 60%;
}

.fancybox__caption {
   font-family: 'Fira Sans', sans-serif;
}

span.txt {
   display: block;
   text-align: justify;
}

header {
   text-transform: uppercase;
   font-family: 'Fira Sans', sans-serif;
}

header a {
   color: #606060;
}

header .title {
   position: absolute;
   left: 0;
   font-size: 30px;
   font-weight: 300;
   padding: 12px 30px;
   font-family: 'Alegreya Sans SC', sans-serif;
   opacity: 0.85;
}

header .title span {
   display: block;
   font-weight: 900;
   font-size: 19px;
   line-height: 10px;
   color: #343434;
}

header .title:hover {
   opacity: 1;
}

header nav {
   position: fixed;
   width: 100%;
   height: 75px;
   background-color: #FFF;
}

header nav .menu-ico {
   display: none;
}

header nav .menu {
   position: absolute;
   right: 25px;
}

header nav .menu1 {
   display: inline-block;
   padding: 28px 30px;
   font-size: 16px;
}

header nav .menu1:hover {
   background-color: #009688;
}

header nav .menu1:hover a {
   color: #FFF;
}

header nav .menu2 {
   display: none;
   position: absolute;
   background-color: #FFF;
   margin: 28px 0px 0px -30px;
}

header nav .menu1:hover .menu2 {
   display: block;
}

header nav .menu2 a {
   display: block;
   padding: 20px 25px;
   color: #606060 !important;
   text-align: center;
}

header nav .menu2 a:hover {
   background-color: #009688;
   color: #FFF !important;
}

header .banner {
   width: 100%;
   height: 75vh;
   margin-bottom: -70px;
}

header .banner img {
   object-fit: cover;
   width: 100%;
   height: 100%;
}

.content {
   padding: 80px 14vw;
   background-color: #f3f3f3;
   min-height: calc(100vh - 262px);
}

h1, h2, h3 {
   font-family: 'Alegreya Sans SC', sans-serif;
}

h1 {
   font-size: 35px;
   color: #e14b4b;
   font-weight: 900;
   padding-top: 50px;
}

h2 {
   font-size: 25px;
   margin-top: 30px;
   border-bottom: 1px solid #cdcdcd;
   padding-bottom: 10px;
}

h3 {
   font-size: 25px;
}

section {
   width: 100%;
   font-size: 18px;
   line-height: 30px;
   font-family: 'Fira Sans', sans-serif;
}

section hr {
   margin-top: 10px;
   margin-bottom: 30px;
}

section .w50 {
   width: 50%;
}

section .w50:first-child {
   padding-right: 40px;
}

section .w50:nth-child(2) {
   padding-left: 40px;
}

section .empty {
   text-align: center;
   color: #606060;
   padding: 70px 35px;
   margin-bottom: 50px;
}

section ul {
   list-style: inside;
}

section ul li {
   line-height: 30px;
}

.info-socios {
   text-align: center;
}

.info-socios a {
   color: #606060;
}

.ficha-socio {
   display: inline-block;
   width: 280px;
   vertical-align: top;
   padding: 15px;
}

.ficha-socio .img-ficha {
   height: 280px;
   border: 5px solid #FFF;
}

.ficha-socio .img-ficha img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center center;
}

.ficha-socio .desc {
   padding: 15px 10px;
   background-color: #FFF;
   height: 150px;
}

.ficha-socio .desc h3 {
   padding-bottom: 10px;
   border-bottom: 1px solid;
}

.ficha-socio .desc div {
   color: #009688;
   margin-top: 20px;
}

.pub .fa {
   color: #009688;
}

.head-usr {
   width: 100%;
   display: block;
   margin-top: 50px;
}

.head-usr .img-usr {
   width: 250px;
   height: 250px;
   display: inline-block;
   border: 5px solid #FFF;
}

.head-usr .img-usr img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
}

.head-usr .det-usr {
   display: inline-block;
   vertical-align: text-bottom;
   padding-left: 40px;
}

.head-usr .det-usr .place {
   display: block;
}

.desc-usr h3, .pub h3 {
   margin-top: 50px;
}

.event {
   display: flex;
   width: 100%;
   height: 120px;
   background-color: #e1e1e1;
   border: 2px solid #FFF;
   border-radius: 10px;
   margin-bottom: 20px;
}

.event img {
   width: 120px;
   height: 100%;
   object-fit: cover;
   object-position: center;
}

.event ul {
   list-style: none;
   width: calc(100% - 120px);
   font-size: 14px;
   padding: 10px 20px;
}

.event ul li {
   line-height: 20px;
   width: calc(100% - 40px);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.event ul li a {
   color: #009688;
   font-weight: 500;
}

.eventos .event {
   width: calc(50% - 30px);
   display: inline-flex;
   margin-right: 20px;
}

.ficha-evento h3 {
   font-size: 20px;
}

.ficha-evento .img {
   margin-right: 50px;
   height: 25vw;
}

.ficha-evento img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
   border-radius: 5px;
   border: 2px solid #FFF;
   cursor: pointer;
}

.ficha-evento ul {
   list-style: none;
   margin-top: 20px;
   font-size: 16px;
}

.ficha-evento ul a {
   color: #009688;
}

.ficha-evento ul a:hover {
   text-decoration: underline;
}

.videoteca {
   width: 100%;
   margin: 75px 0px;
   display: flex;
}

.videoteca hr {
   color:  #cdcdcd;
}

.videoteca h2 {
   font-size: 25px;
   margin-top: 0px;
   border: 0;
   color: #000;
}

.videoteca h2:hover span {
   text-decoration: underline;
}

.videoteca h2 img {
   vertical-align: text-bottom;
   height: 20px;
   margin-right: 5px;
}

.videoteca .mini-title,
.ficha-evento .mini-title {
   font-weight: 900;
   text-transform: uppercase;
   font-size: 14px;
   margin-bottom: 10px;
}

.videoteca .video-col {
   width: 35%;
   display: inline-block;
   margin-top: 10px;
}

.videoteca .video-col ul {
   color: #000;
}

.videoteca .video-col li {
   display: block;
   list-style: none;
   padding: 15px 10px;
   cursor: pointer;
   border-top: 1px solid #a9a7a7;
   font-size: 16px;
   letter-spacing: -1px;
}

.videoteca .video-col .video-list {
   display: none;
}

.videoteca .video-col .video-list li {
   display: flex;
   padding: 0;
}

.videoteca .video-col .video-list .title {
   width: 100%;
   font-size: 15px;
   line-height: 18px;
   padding: 10px 20px 10px 25px;
}

.videoteca .info {
   width: 65%;
   display: inline-block;
   padding-left: 50px;
   font-size: 16px;
}

.videoteca .info p {
   text-align: justify;
   line-height: 25px;
   margin-bottom: 30px;
}

.videoteca .info .btn {
   display: inline-block;
   padding: 5px 15px;
   border: 3px solid #FFF;
   border-radius: 8px;
   font-weight: 700;
   text-transform: uppercase;
   margin: 25px 10px 0 0;
   color: #FFF;
   cursor: pointer;
   font-size: 13px;
}

.videoteca .info .btn.red {
   background-color: #e14b4b;
}

.videoteca .info .btn.blue {
   background-color: #009688;
}

.videoteca .info .btn img {
   vertical-align: text-top;
}

.videoteca .info .btn span {
   vertical-align: top;
   padding: 10px;
   display: inline-block;
}

.videoteca .info .cita {
   background-color: #e1e1e1;
   padding: 20px 30px;
   border-radius: 5px;
   line-height: 22px;
}

.documentos {
   list-style: none;
   float: left;
   margin-top: -10px;
   margin-bottom: 50px;
}

.documentos li {
   display: inline-block;
   width: 130px;
   text-align: center;
   line-height: 17px;
   margin-right: 15px;
}

.documentos img {
   display: block;
   width: 50px;
   vertical-align: sub;
   margin: 0 auto;
   padding-bottom: 10px;
}

.documentos a {
   color: #000;
   font-size: 14px;
   font-weight: 500;
   letter-spacing: -1px;
}

.documentos a:hover {
   text-decoration: underline;
   color: #009688;
}

footer {
   text-align: center;
   background-color: #009688;
   padding: 40px 0;
   color: #FFF;
   font-family: 'Fira Sans', sans-serif;
   font-size: 18px;
}

footer a {
   color: #FFF;
   font-weight: 500;
}

footer a:hover {
   text-decoration: underline;
}

@media screen and (max-width: 1100px) {
   .menu {
      display: none;
   }

   .menu-ico {
      display: block !important;
      cursor: pointer;
      width: 46px;
      opacity: .7;
      position: absolute;
      right: 0;
      padding: 14px 25px;
   }

   header nav .menu {
      position: absolute;
      left: 0;
      margin-top: 75px;
      background-color: #FFF;
      min-width: 50%;
      border-top: 1px solid #b1b1b1;
   }

   header nav .menu1 {
      display: block;
      border-bottom: 1px solid #b1b1b1;
      padding: 15px 0px 15px 0px;
   }

   header nav .menu1 a {
      padding: 0 30px;
   }

   header nav .menu2 {
      display: block;
      position: inherit;
      margin: 15px 0 0 0;
      border-top: 1px solid #b1b1b1;
   }

   header nav .menu2 a {
      border-bottom: 1px solid #b1b1b1;
      text-align: left;
      padding: 15px 10px 15px 10px;
      margin: 0px 30px;
   }

   header .banner {
      height: 50vh;
   }

   .content {
      padding: 30px 5vw;
   }

   section {
      display: block;
   }

   section .w50 {
      width: 100%;
      padding: 0 !important;
   }

   section .link-more {
      display: none;
   }
}

@media screen and (orientation:portrait) {
   h1 {
      font-size: 4em;
   }

   h3 {
      font-size: 3em;
   }

   nav {
      height: 120px !important;
   }

   nav .title {
      font-size: 3.3em;
      padding: 20px 30px;
   }

   nav .title span {
      font-size: .63em;
   }

   nav .menu-ico {
      width: 85px;
      padding: 20px 25px;
   }

   nav .menu {
      margin-top: 118px !important;
   }

   nav .menu1 a {
      font-size: 2em;
   }

   section ul li {
      line-height: 3em;
   }
}