* {margin: 0; padding: 0; box-sizing: border-box; outline: none;}

body {font-family: 'Open Sans', serif; font-size: 12pt; line-height: 11pt; background: #FDFDFD; color: #555;}
img {display: block; width: 100%;}
img {opacity: 1;}
p {margin-bottom: 1em; line-height: 1.4em; text-align: justify;}
a {text-decoration: none; color: #FFF;}
h1 {margin: 0 0 1em 0; font-size: 2.4em; line-height: 1.4em;}
h2 {margin: 0 0 1em 0; font-size: 1.6em; line-height: 1.2em;}
h3 {margin: 0 0 1em 0; font-size: 1.4em; line-height: 1.2em;}
h1,h2,h3 {color: #3295BC;}
h1,h2,h3 {color: #C34200;}

button {border: none;}
ul {list-style-type: none;}

#header-container {height: 85px;}

#navigation {width: 100%; padding: 0 2%; background: #3295BC; z-index: 10; position: fixed} 

#navigation > div {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; max-width: 1400px; width: 100%; margin: 0 auto; padding: 16px 0;}
#logo {display: inline-block;}
#logo img {max-width: 120px; max-height: 150px; width: 100%; height: auto;}
#logo img {max-width: 131px;}

#menu {display: flex; flex-wrap: wrap; justify-content: space-around; max-width: 1000px; width: calc(100% - 160px);}
#menu li {max-height: 20px; padding: 20px 0;}
#menu a {display: inline-block; text-transform: uppercase;}
#menu a:hover {color: #e98411;}

#menu a.current {padding-bottom: 5px; border-bottom: solid 2px #C34200; }

section a {color: #C34200;}






/* footer */


footer {padding: 0 3%; background: #315B8F; color: #FFF;}
#footer-containersss {display: flex; flex-direction: row; justify-content: space-between; gap: 0; max-width: 1200px; margin: 0 auto; padding: 80px 0;}
#footer-containersss > div {width: 25%;}
#footer-container {display: grid; grid-template-columns: repeat(12,1fr); justify-content: space-between; max-width: 1400px; margin: 0 auto; padding: 80px 0;}
#footer-container .item-footer {padding: 0 10px;}
span.f-t {display: block; max-width: 360px; min-width: 60%; padding: 5px 10px 8px 10px; text-align: center; border-bottom: solid 2px #C34200; font-size: 1.6em;}
#footer-container ul {margin: 0 0 80px 0; padding: 20px 0 30px 0; list-style-type: disc; list-style-position: inside;}
#footer-container ul li {padding: 0 0 10px 0;}
#footer-container ul li a {display: inline-block; width: 88%; line-height: 1.3em; vertical-align: top;}


/* CLASES */
.full-width {max-width: none;}
.limited-width {max-width: 1400px; margin: 0 auto; padding: 80px 0;}

ul.nav-pagination {padding-top: 0; text-align: right;}
ul.nav-pagination li {display: inline-block; margin: 0 3px; padding: 5px;}
ul.nav-pagination li.active {background: #C34200;}
ul.nav-pagination li.active a {color: #FFF;}
ul.nav-pagination a {color: #C34200;}

@media all and (max-width: 1440px) {
    .limited-width {padding: 80px 2%;}
} 
@media all and (max-width: 992px) {
    ul.nav-pagination {margin: 0 0 50px 0;}
}
@media all and (max-width: 768px) {
    #menu {display: block;}

    #menu {clear: both; width: 100%; padding-top: 50px; line-height: 16px;}
    #navigation #menu.up {display: none;}
    
    #navigation #menu.down {display: block; position: static; } 
	#navigation #menu.down li {display: block; margin: 0 0 20px 0; text-align: center;}
    #navigation #menu.down li a {display: inline-block; padding: 10px 0; }
    
    #navigation span.toggle-nav {float: right; display: block; margin-right: 20px;}
    #navigation span.toggle-nav-btn {display: block; width: 2.2em; height: auto; border: solid 1px #FFF; border-radius: 3px; cursor: pointer;}
    span .s-line {display: block;width: 1.5em;height: 1px; margin: 6px auto;background: #FFF;}
}
@media all and (max-width: 600px) {
   
    #footer-container {display: block;}
    #footer-container .item-footer {max-width: 480px; margin: 0 auto;}
    span.f-t {max-width: none;}

}
@media all and (max-width: 576px) {
   

    ul.down {height: 100vh;}

    .limited-width {padding: 50px 2%;}
    #lista-eventos h2 {max-height: 46px;}
}



 /* Extra small devices (phones, 600px and down) */
 @media only screen and (max-width: 600px) {
    /* xs */
    .xs-12 {grid-column: span 12;}
    .xs-6 {grid-column: span 6;}
 }

 /* Small devices (portrait tablets and large phones, 600px and up) */
 @media only screen and (min-width: 600px) {

    .sm-12 {grid-column: span 12;}
    .sm-6 {grid-column: span 6;}
   
 }
 
 /* Medium devices (landscape tablets, 768px and up) */
 @media only screen and (min-width: 768px) {

    .md-12 {grid-column: span 12;}
    .md-6 {grid-column: span 6;}
    .md-3 {grid-column: span 3;}
    
 }
 
 /* Large devices (laptops/desktops, 992px and up) */
 @media only screen and (min-width: 992px) {

    .lg-12 {grid-column: span 12;}
    .lg-6 {grid-column: span 6;}
    .lg-3 {grid-column: span 3;}
    
 }
 
 /* Extra large devices (large laptops and desktops, 1200px and up) */
 @media only screen and (min-width: 1200px) {

    .xl-9 {grid-column: span 9;}
    .xl-8 {grid-column: span 8;}
    .xl-6 {grid-column: span 6;}
    .xl-4 {grid-column: span 4;}
    .xl-3 {grid-column: span 3;}
 } h2 {font-size: 1.8em; height: 120px;}
h2 {font-size: 1.8em; height: auto;}

#publi-top a {display: block; height: 160px; background: url(/images/eventos/banner-top.jpg); background-position: center; background-size: cover;}
#participantes h2 {height: auto;}
#evento .section-wrapper, #agenda .section-wrapper, #blog .section-wrapper, #cava .section-wrapper,  #alacena .section-wrapper, #articulo .section-wrapper {display: grid; grid-template-columns: repeat(12, 1fr);  grid-gap: 0 20px ; 
    grid-template-areas:    "m-c m-c m-c m-c m-c m-c m-c m-c s-c s-c s-c s-c" 
                            "m-c m-c m-c m-c m-c m-c m-c m-c s-c2 s-c2 s-c2 s-c2" 
                            "p p p p p p p p s-c2 s-c2 s-c2 s-c2";}




#main-content {grid-area: m-c;}
#participantes {grid-area: p; padding: 50px 0;}
#side-content-1 {grid-area: s-c; margin: 0 0 30px 0; }
#side-content-1 #publi-lateral {min-width: 280px; height: 100%; padding: 20px 0 0 0; background: #F2F2F2;}
#side-content-1 h2 {text-align: center; background: #f2f2f2;}
#side-content-2 {grid-area: s-c2;}
#side-content-2 #destacado {min-width: 280px; height: 100%;}
#side-content-2 h2 {text-align: center; background: #f2f2f2;}



.lista-items {display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between; gap: 80px 4%; margin: 50px 0;}
.lista-items .item {display: block; max-width: 48%;}
.lista-items .item .resumen-container {height: 210px; padding: 20px; background: #F2F2F2;}
.lista-items .item span {display: block;}
.lista-items .item span.fecha {margin-bottom: 10px;}
.lista-items h2 {overflow: hidden;}
.lista-items h2 a {color: #C34200;}
.lista-items a {color:#555;}

#main-content .img-container {margin: 0 0 50px 0;}


#main-content .lista-items .img-container {margin: 0;}

/* Social share */
#social-share {margin-top: -37px; padding: 0 0 10px 0;}
#social-share ul {display: flex; justify-content: end; ;}
#social-share li {margin-right: 5px;}
#social-share a {display: block; width: 30px; height: 30px;}

#social-share img {height: auto;}
#social-share img:hover {opacity: 0.7; transition: 0.5s;}


@media all and (max-width: 1200px) {
    .lista-items h2 {font-size: 1.6em;}
}
@media all and (max-width: 992px) {

    #agenda .section-wrapper, #blog .section-wrapper, #cava .section-wrapper, #alacena .section-wrapper, #blog .section-wrapper, #articulo .section-wrapper {display: block;}
    #side-content {margin: 0 0 30px;}
    #side-content #publi-lateral {height: 300px;}
    #side-content-2 {margin: 0;}
}
@media all and (max-width: 768px) {
    #main-content h1 {font-size: 2em;}
    .lista-items {display: block;}
    .lista-items .item {display: flex; max-width: none; margin: 0 0 20px 0;}
    .lista-items h2 {height: auto; max-height: 54px;}
    .lista-items h2 {font-size: 1.4em;}
    .lista-items .item .resumen-container {width: 100%; height: auto;}
    .lista-items .item .img-container img {width: 160px; height: 160px; overflow: hidden;}
}
@media all and (max-width: 576px) {
    #main-content h1 {font-size: 1.8em;}
    .lista-items .item .resumen-container {padding: 9px 10px;}
    .lista-items .item .img-container a {display: block; height: 120px; width: 160px; overflow: hidden;}
    .lista-items .item .img-container img { height: 120px;}
    .lista-items h2 {max-height: 96px; height: 100%; margin-bottom: 0; font-size: 1em;}
    .lista-items .item span {font-size: 0.8em;}
    #lista-eventos.lista-items h2 {max-height: none; height: 58px; margin-bottom: 8px;}
    #lista-eventos.lista-items .fecha {margin-bottom: 6px;}
    #lista-eventos.lista-items .municipio {margin-bottom: 0px;}
}.side-container h2 {margin: 0 auto; padding: 0; font-size: 1.4em; width: 100%; height: auto;}
.side-container h3 {text-align: center; font-size: 1.2em;}
.side-container .publi-img-container {position: relative;}

#publi-c2-1 .publi-img-container {background: #000; padding: 20px;}
#publi-c2-1 h2 {height: auto; padding: 30px; background: none;}

#publi-c2-2 h2 {position: absolute; top: 40%; bottom: 60%; background: none; color: #FFF;}
#publi-c2-3 h2 {position: absolute; top: 40%; bottom: 60%; background: none; color: #FFF;}
#publi-c2-3 h3 {padding: 30px 0;}

#publi-c1-1 {padding: 20px 0;}
#publi-c1-1 h2 {height: auto;}
#publi-c1-1 p {text-align: center; margin-bottom: 10px;}

.side-container {max-width: 360px; margin: 0 auto 50px auto; background: #f2f2f2;}

.shadow:hover {opacity: 0.7; transition: 0.8s;}
.shadow:hover h2 {font-size: 1.6em;  transition: 0.4s;}