/*!
 * Bootstrap v3.1.0 (http://getbootstrap.com)
 * Copyright 2011-2014 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

/*! normalize.css v3.0.0 | MIT License | git.io/normalize */

@import url("https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,400italic");
@import url("//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.css");

  .event-list {
    list-style: none;
    font-family: 'Lato', sans-serif;
    margin: 0px;
    padding: 0px;
  }
  .event-list > li {
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 0px 5px rgb(51, 51, 51);
    box-shadow: 0px 0px 5px rgba(51, 51, 51, 0.7);
    padding: 0px;
    margin: 0px 0px 20px;
    list-style: none;
  }
  .event-list > li > time {
    display: inline-block;
    width: 100%;
    padding: 5px;
    text-align: center;
    text-transform: uppercase;
  }
  .event-list > li:nth-child(even) > time {

  }
  .event-list > li > time > span {
    display: none;
  }
  .event-list > li > time > .day {
    display: block;
    font-size: 56pt;
    font-weight: 100;
    line-height: 1;
  }
  .event-list > li time > .month {
    display: block;
    font-size: 24pt;
    font-weight: 900;
    line-height: 1;
  }
  .event-list > li > img {
    width: 100%;
  }
  .event-list > li > .info {
    padding-top: 5px;
    text-align: center;
  }
  .event-list > li > .info > .title {
    font-size: 17pt;
    font-weight: 700;
    margin: 0px;
  }
  .event-list > li > .info > .desc {
    font-size: 13pt;
    font-weight: 300;
    margin: 0px;
  }
  .event-list > li > .info > ul,
  .event-list > li > .social > ul {
    display: table;
    list-style: none;
    margin: 10px 0px 0px;
    padding: 0px;
    width: 100%;
    text-align: center;
  }
  .event-list > li > .social > ul {
    margin: 0px;
  }
  .event-list > li > .info > ul > li,
  .event-list > li > .social > ul > li {
    display: table-cell;
    cursor: pointer;
    color: rgb(30, 30, 30);
    font-size: 11pt;
    font-weight: 300;
    padding: 3px 0px;
  }
    .event-list > li > .info > ul > li > a {
    display: block;
    width: 100%;
    color: rgb(30, 30, 30);
    text-decoration: none;
  }
  .event-list > li > .social > ul > li {
    padding: 0px;
  }
  .event-list > li > .social > ul > li > a {
    padding: 10px 0px;
  }
  .event-list > li > .info > ul > li:hover,
  .event-list > li > .social > ul > li:hover {
    color: rgb(30, 30, 30);
  }
  .facebook a,
  .twitter a,
  .google-plus a {
    display: block;
    width: 100%;
    color: rgb(75, 110, 168) !important;
  }
  .twitter a {
    color: rgb(79, 213, 248) !important;
    background-image: url(../img/iconosemblanza.png);
    background-repeat: no-repeat;
    width: 25%;
    margin: auto;
  }
  .google-plus a {
    color: rgb(221, 75, 57) !important;
  }
  .facebook:hover a {
    color: rgb(255, 255, 255) !important;
    background-color: rgb(75, 110, 168) !important;
  }
  .twitter:hover a {

  }
  .google-plus:hover a {
    color: rgb(255, 255, 255) !important;
    background-color: rgb(221, 75, 57) !important;
  }

  .separador
  {
    display: none;
    width: 24px;
    height: 115px;
  }

  .cerrar {
    float:right;
    cursor:pointer;
  }

  .ui-widget-content {
    display:none;
    position:relative;
  }

  .txtblanco {
    color: white;
  }

  .popup {
    display:block;
    background-color:#414042;
    color: white;
    z-index: 3;
    top: -260px;
    left: 0px;
    padding: 20px;
    text-align:justify;

  }

  /* Ajuste del Diseño cuando resolución es mayor o igual a 768px */
  @media (min-width: 768px) {
    .event-list > li {
      position: relative;
      display: block;
      width: 100%;
      height: 115px;
      padding: 0px;
      box-shadow: 0px 0px 0px rgb(51, 51, 51);
      box-shadow: 0px 0px 0px rgba(51, 51, 51, 0.7);
    }

    .event-list > li > time,
    .event-list > li > img  {
      display: inline-block;
    }
    .event-list > li > time,
    .event-list > li > img {
      width: 115px;
      float: left;
    }
    .event-list > li > .info {
      background-color: #e4e2d9;
      overflow: hidden;
    }
    .event-list > li > time,
    .event-list > li > img {
      width: 115px;
      height: 115px;
      padding: 0px;
      margin: 0px;
    }
    .event-list > li > .separador {
      width: 24px;
      height: 115px;
      display: block;
    }
    .event-list > li > .info {
      position: relative;
      height: 115px;
      text-align: left;
      padding-right: 40px;
    }
    .event-list > li > .info > .title {
      padding: 25px 10px;
    }
    .event-list > li > .info > .desc {
      margin-top:-25px;
      padding: 0px 10px;
    }
    .event-list > li > .info > ul {
      position: absolute;
      left: 0px;
      bottom: 0px;
    }
    .event-list > li > .social {
      position: absolute;
      top: 0px;
      right: 0px;
      display: block;
      width: 40px;
    }
    .event-list > li > .social > ul {

    }
    .event-list > li > .social > ul > li {
      display: block;
      padding: 0px;
      padding-left: 5px;
    }
    .event-list > li > .social > ul > li > a {
      display: block;
      width: 40px;
      padding: 10px 0px 9px;
    }

    .cerrar {
      float:right;
      cursor:pointer;
    }

    .ui-widget-content {
      display:none;
      position:absolute;
    }

    .txtblanco
    {
      color: white;
    }

    .popup {
      display:block;

      transition-timing-function: linear;

      background-color:#414042;
      color: white;
      z-index: 3;
      top: 0px;
      left:24px;
      height:auto;
      padding:20px;
      text-align:justify;
    }

    /* --- Tabs para separar dependencias --- */
    #tabs {
      overflow: hidden;
      width: 100%;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    #tabs li {
      float: left;
      margin: 0 -15px 0 0;
    }

    #tabs a {
      float: left;
      position: relative;
      padding: 0 40px;
      height: 0;
      line-height: 30px;
      text-transform: uppercase;
      text-decoration: none;
      color: #ffffff;
      border-right: 30px solid transparent;
      border-bottom: 30px solid #3D3D3D;
      border-bottom-color: #777\9;
      opacity: .3;
      filter: alpha(opacity=30);
    }

    #tabs a:hover,
    #tabs a:focus {
      border-bottom-color: #724f2b;
      opacity: 1;
      filter: alpha(opacity=100);
      color:#ffffff;
    }

    #tabs a:focus {
      outline: 0;
    }

    #tabs #current {
      z-index: 3;
      border-bottom-color: #3d3d3d;
      opacity: 1;
      filter: alpha(opacity=100);
    }

    /* ----------- */
    #borde-tab {
        background: #fff;
        border-top: 2px solid #3d3d3d;
        padding: 1em 0em 0em 0em;
        /*height: 220px;*/
    }
  }


/* portrait viewport 320 x 480
@media screen and (max-width: 320px), (min-device-width: 320px) and (max-device-width: 480px) and (orientation : portrait) {

}*/

/* landscape viewport 480 x 320
@media screen and (min-width: 320px) and (max-width: 480px), (min-device-width: 320px) and  (max-device-width: 480px) and (orientation : landscape) {

}*/

/* portrait viewport 320 x 568
@media screen and (max-width: 320px), (min-device-width: 320px) and (max-device-width: 568px) and (orientation : portrait) {

}*/

/* landscape viewport 568 x 320
@media screen and (min-width: 320px) and (max-width: 568px), (min-device-width: 320px) and (max-device-width: 568px) and (orientation : landscape) {

}*/

/* portrait viewport 360 x 640
@media screen and (max-width: 360px), (min-device-width: 360px) and (max-device-width: 640px) and (orientation : portrait) {

}*/

/* landscape viewport 640 x 360
@media screen and (min-width: 360px) and (max-width: 640px), (min-device-width: 360px) and (max-device-width: 640px) and (orientation : landscape) {

} */

/* portrait viewport 600 x 960
@media screen and (max-width: 600px), (min-device-width: 600px) and (max-device-width: 960px) and (orientation : portrait) {

} */

/* landscape viewport 960 x 600
@media screen and (min-width: 600px) and (max-width: 960px), (min-device-width: 600px) and (max-device-width: 960px) and (orientation : landscape) {

}*/

/* portrait viewport 768 x 1024
@media screen and (max-width: 768px), (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait) {

}*/

/* landscape viewport 1024 x 768
@media screen and (min-width: 768px) and (max-width: 1024px), (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : landscape) {

}*/