@font-face {
  font-family: 'HelveticaNeue';
  src: url('../fuentes/HelveticaNeue.otf'); /* IE9 Compat Modes */
  src: url('../fuentes/HelveticaNeue.otf?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fuentes/HelveticaNeue.otf') format('woff'), /* Modern Browsers */
       url('../fuentes/HelveticaNeue.otf')  format('truetype'), /* Safari, Android, iOS */
       url('../fuentes/HelveticaNeue.otf#svgFontName') format('svg'); /* Legacy iOS */
}

html {
  height: 100%;
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body
{
  font-family: 'Raleway', sans-serif;
  font-size: 14px !important;
  color: #000000 !important;
  min-height: 100%;
  margin: 0;
  position: relative;
}

a:hover
{
  text-decoration: none !important;
}

a
{
  color: #000000;
}

.clear
{
  clear: both;
}

.img_full
{
  width: 100%;
  max-width: 100%;
}

.padding_l_0
{
  padding-left: 0px;
}

.padding_r_0
{
  padding-right: 0px;
}

.border_b_0
{
  border-bottom: 0px !important;
}

.margin_t_10
{
  margin-top: 10px;
}

header
{
  position: fixed;
  width: 100%;
  background: #ffffff;
  z-index: 9999;
}

#margen_secciones
{
  padding-top: 110px;
}

#logo
{
  text-align: center;
  border-bottom: 1px solid #e6e7e8;
  padding: 20px 0px;
}

#logo a
{
  font-family: 'HelveticaNeue', Helvetica, sans-serif;
  font-size: 17px;
  color: #221f1f;
  letter-spacing: 10px;
}

#logo a img
{
  width: 100%;
  max-width: 480px;
}

.textos
{
  color: #4c4c4c;
  font-size: 12px;
  line-height: 20px;
}

footer
{
  /*
  position: fixed;
  padding: 10px 0px;
  width: 100%;
  bottom: 0px;
  background: #ffffff;
  text-align: center;
  color: #bbbdbf;
  font-weight: 500;
  font-size: 12px;
  */

  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;

  padding: 10px 0px;
  background: #ffffff;
  text-align: center;
  color: #bbbdbf;
  font-weight: 500;
  font-size: 12px;
}

footer a
{
  color: #bbbdbf;
}

/* PORTFOLIO */
.ficha_proyecto
{
  color: #231f20;
  font-size: 12px;
  line-height: 20px;
  margin-bottom: 30px;
  font-weight: 600;
  margin-top: 5px;
}
.ficha_proyecto h1
{
  color: #231f20;
  font-size: 13px;
  margin: 0px;
  padding: 0px;
  font-weight: 700;
}

.textos_proyectos
{
  color: #4c4c4c;
  font-size: 12px;
  line-height: 20px;
}

.text_item {
    z-index: 1;
    position: absolute;
    color: #58595b;
    font-size: 14px;
    text-align: center;
    width: 95%;
    top: 50%;
    height: 60px;
    margin-top: -20px;
    font-weight: 600;
}

.hide_item {
    display: none;
}

.filtr-item img {
    -webkit-transition: opacity 500ms;
    transition: opacity 500ms;
    opacity: 1;
}

.filtr-item:hover img {
    opacity: 0.2;
    -webkit-transition: opacity 200ms;
    transition: opacity 200ms;
}

.filtr-item:hover .hide_item {
    display: block;
}
/* FIN PORTFOLIO */

/* CONTACTO */
#map
{
  width: 100%;
  height: 300px;
}

#datos_contacto
{
  font-size: 12px;
  color: #58595b;
}

#datos_contacto a
{
  color: #58595b;
}
#datos_contacto a:hover
{
  color: #000000;
}

#datos_contacto span
{
  color: #bbbdbf;
}
/* FIN CONTACTO */







.mouse_none:hover
{
  opacity: 1 !important;
}

#facebook_contacto
{
  border: 2px solid #babcbe;
  color: #babcbe !important;
  font-size: 20px;
  padding: 2px 7px 0px 7px;
}
a:hover
{
  color: #babcbe;
}




/* MENU */
/* hide "no more entries" button */
      .media-boxes-no-more-entries{
        display: none;
      }
      
      /* thumbnail-overlay style */
      .thumbnail-overlay{
              background: rgba(255,255,255,0.8);
              padding: 10px 20px;
          }
      
      /* Center the filters */
      .media-boxes-filter {
        text-align: center;
      }

      /* change style of filter menu */
      .media-boxes-filter>li {
        margin: 0;
      }
      .media-boxes-filter>li a:hover{
          color: #000000;
      }

      /* MENU */
       
    /* Estilos #nav-mobile y lo ocultamos */
    #nav-mobile{
        display: none;
        float: right;
        position: absolute;
        right: 10px;
        top: 15px;
        font-size: 18px;
        color: #bbbdbf;
        box-shadow: none !important;
    }   
  #nav-mobile::after {
    content: '';
    position: absolute;
    top: 20px;
    right: 0px;
    display: block;
    width: 15px;
    height: 2px;
    background: #bbbdbf;
  }
  #nav-mobile::before {
    content: '';
    position: absolute;
    top: 25px;
    right: 0px;
    display: block;
    width: 15px;
    height: 3px;
    border-top: 2px solid #bbbdbf;
    border-bottom: 2px solid #bbbdbf;
    padding-top: 3px;
  }
    
    /* Agregaremos esta clase a #nav-mobile, cuando el menu mobile haya sido desplegado */
    #nav-mobile.nav-active
    {
      opacity: 1;
    }

    .menu_active
  {
    color: #58595b !important;
  }

/*
    MEDIA QUERY
*/

@media only screen and (max-width: 768px) {
    /* mostramos #nav-mobile */
    #nav-mobile{ display: block; }

    /* Fijamos nuestro nav en 100% ancho y dejamos de flotarlo  */
        /* Convertimos nuestra lista de enlaces en un menú horizontal */
        #menu ul{
            max-height: 0;
            overflow: hidden;
        }
            /* estilos para los LI del menu */
            #menu li{
                border-bottom: 1px solid #ececec;
                width: 100%;
            }

            /* Quitamos el borde del ultimo item del menú */
            #menu li:last-child{ border-bottom: 0;}
                #menu li a{
                    padding: 5px 0px 8px 0px;
                    height: auto;
                    line-height: normal;
                }

        /* Agregamos una animación al despligue del menú */
        #menu ul.open-menu{
            padding-left: 0px;
            width: 100%;
            max-height: 400px;
            -webkit-transition: max-height .4s;
            -moz-transition: max-height .4s;
            -ms-transition: max-height .4s;
            -o-transition: max-height .4s;
            transition: max-height .4s;
        }
}
/* FIN MENU */