/*
Theme Name: alumena Child
Template: alumena
Version: 1.1
*/

/* Parent stylesheet should be loaded from functions.php not using @import */


/***paddings***/

.sec-60 { padding-top: 60px; padding-bottom: 60px }
.sec-90 { padding-top: 90px; padding-bottom: 90px }
.sec-120-bottom { padding-bottom: 120px }

/***end paddings***/


/***tipografias***/

h2 { font-size: 24px!important; font-weight: 200!important; }

/***end tipografias***/


/***menu***/

#site-header { mix-blend-mode: difference; }
#site-header-sticky-wrapper.is-sticky #site-header { background-color: transparent; box-shadow: none; }
.menu-item a span:hover { text-decoration: underline; }
#site-logo img { height: 45px; }
.full-screen-overlay-nav button.full-screen-overlay-nav-close { opacity: 1; top: 13px; right: -15px; }
.full-screen-overlay-nav.black a { opacity: 1; }

.contacto-movil { color: #aca1fc; background-image: url("http://www.alumenadesign.com/wp-content/uploads/2022/05/boton-contacto-2.svg"); background-size: contain; }
.contacto-movil { margin: 0 auto; margin-top: 37px; width: 130px; height: 130px; }
.contacto-movil { animation: giro 7s linear infinite; transform-origin: center; }
.contacto-movil a { width: 130px; height: 130px; }

@keyframes giro {
    0% {
      transform: rotate();
    }
    100% {
      transform: rotate(360deg);
    }
  }

/***end menu***/


/* footer */

.email-me-banner { display:none; }

.email-me-banner {
    background-color: #FF0070;
    bottom: 0;
    font-size: 24px;
    letter-spacing: 5px;
    height: 55px;
    left: 0;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 100%;
}

.email-me-banner-content:hover>span {
    background-color: #00FF00;
    color: #000;
    border: 1px solid #00FF00;
}

.email-me-banner-container {
    height: 100%;
    width: 100%;
}

.email-me-banner-content, .email-me-banner-content:hover, .email-me-banner-content:link, .email-me-banner-content:visited {
    text-decoration: none;
    color: #000;
    font-weight: 200;
}

.email-me-banner-content {
    align-items: center;
    -webkit-animation: banner 5s linear infinite;
    animation: banner 5s linear infinite;
    display: flex;
    height: 100%;
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    will-change: transform;
}

.email-me-banner-content>span {
    border-radius: 3vw;
    border: 1px solid #1a1a1a;
    display: inline-block;
    margin: 0 2vw;
    padding: 0 1vw 0 1.3vw;
}

.email-me-banner-content>img {
    display: block;
    height: 36px;
    margin: 0 0 0 1.5vw;
    width: 36px;
}


@-webkit-keyframes banner{to{transform:translate3d(-33.33%,0,0)}}@keyframes banner{to{transform:translate3d(-33.33%,0,0);}}

/*.links a:link:after, .links a:visited:after {
    content: url('http://www.alumenadesign.com/wp-content/uploads/2022/05/flecha.svg');
    display:block;
    width: 0;
    height: 0;
    position: absolute;
    left: -20px;
    top: 0px;
}*/

#footer-custom .titulo { font-size: 115px; line-height: 120px; color: #000; font-family: "Inter"; color:#fff; }

#footer-custom .texto { font-size: 24px; color: #000; font-weight: 200; color:#fff; }

a.email-footer { color: #000; position: relative; }

a.email-footer::after {
    content: url(http://www.alumenadesign.com/wp-content/uploads/2022/05/flecha.svg);
    display: block;
    width: 16px;
    height: 29px;
    position: absolute;
    right: -25px;
    top: -1px;
}

/***end footer***/


/***sticker***/

.sticker-contacto {
    position: fixed;
    right: 30px;
    bottom: 20px;
    z-index: 99;
    width: 187px;
    height: 187px;
    transition: transform .2s; /* Animation */
}

.sticker-contacto:hover { transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */ }

.sticker-contacto-inner {
    animation: giro 7s linear infinite;
    transform-origin: center;
}
.sticker-contacto img {
    display: block;
}

@keyframes giro {
    0% {
      transform: rotate();
    }
    100% {
      transform: rotate(360deg);
    }
  }



/***end sticker***/



/***inicio***/

.titular { float: left; }

.gatete { 
    width: 180px;
    position: absolute;
    bottom: 0;
    margin-bottom: 75px!important;
    margin-left: 30px;
}

#portfolio .vcex-image-banner { height: 100vh; }

#portfolio .vcex-image-banner .vcex-ib-content-wrap { height: 100vh; display: flex; align-items: center; }

.portfolio-entry-inner { transition: transform .4s cubic-bezier(.5,.25,0,1); }

.portfolio-entry-inner:hover { transform: rotate(1.5deg)!important; }

.sobre-mi-titulo { font-family: "Inter"; font-weight: 300; font-size: 115px; line-height: 120px; height:370px; }

.sobre-mi-descripcion { font-size: 30px; line-height: 38px; padding-right: 38%; position: relative; z-index: 1; }

.sobre-mi-descripcion a { color: #000; }

.sobre-mi-imagen { right: 20px; width: 43%; margin-bottom: -50px; position: absolute; z-index: 0; bottom: -30px; }

.footer-has-reveal #main { background-color:#000!important; }

/***end inicio***/

/*proyecto ficha*/

#portfolio-galeria { padding-top: 110px; }
#portfolio-galeria img { margin-bottom: 90px;}
#portfolio-galeria video { margin-bottom: 90px;}
.titulo-proyecto { padding-bottom: 60px; font-size: 40px; }

#portada { color: #fff; }
#portada .titulo { font-size: 100px; font-family: "Inter"; color:#fff!important; padding-top: 90px; padding-bottom: 30px; }
.proyecto { font-size: 18px; }
.descripcion_proyecto { font-size: 24px; }
.columna-proyecto { padding-left: 12%; padding-right: 12%;  }

.post-pagination-wrap { background: #fff; border-top: 1px solid #fff; padding-bottom: 120px; }

.post-pagination-wrap .ticon-angle-double-left:before { content: "\f104"!important; }
.post-pagination-wrap .ticon-angle-double-right:before { content: "\f105"!important; }

.columna-proyecto a { color: #000; position: relative; }

.columna-proyecto a: hover; { text-decoration: underline; }

.columna-proyecto a::after {
    content: url(http://www.alumenadesign.com/wp-content/uploads/2022/05/flecha-negra.svg);
    display: block;
    width: 16px;
    height: 29px;
    position: absolute;
    right: -25px;
    top: 0px;
}

/***end proyecto ficha***/



/*responsive*/

@media only screen and (max-width: 1380px) {
    .vacia { width: 10%; }
}

@media only screen and (max-width: 1125px) {
  h1 { font-size: 190px!important; line-height: 190px!important; }
  .sobre-mi-imagen { width: 50%; }
}

@media only screen and (max-width: 959px) {
    h1 { font-size: 145px!important; line-height: 145px!important; }
    #footer-custom .vacia { display: none; }
    .columna-proyecto { padding-left: 5%; padding-right: 5%; }
    #portada .titulo { font-size: 90px; line-height: 95px; }
}

@media only screen and (max-width: 925px) {
    .sobre-mi-titulo { font-size: 90px; line-height: 95px; height: 300px; }
    .sobre-mi-titulo.sec-90 { padding-top: 40px; padding-bottom: 0px; }
    #sobre-mi .sec-120-bottom { padding-bottom: 60px; }
}

@media only screen and (max-width: 767px) {
  h1 { font-size: 125px!important; line-height: 125px!important; }
  .sobre-mi-titulo { font-size: 80px; line-height: 85px; }
  .sobre-mi-descripcion { padding-right: 25%; }
  .sticker-contacto { bottom: 10px; right:  10px; z-index: 99; width: 150px; height: 150px; }
  .sobre-mi-imagen { width: 70%; right: 0; position: relative; margin-top: 50px; }
  .sec-120-bottom { padding-bottom: 80px; }
  .sec-60 { padding-top: 30px; }
  .sobre-mi-titulo.sec-90 { padding-top: 60px; padding-bottom: 0px; }
  .sobre-mi-titulo { height: 320px!important; }
  #portada .titulo { font-size: 70px; line-height: 75px; padding-top: 70px; padding-bottom: 10px; }
  #portfolio-single-content .sec-90 { padding-top: 60px; padding-bottom: 60px; }
  .columna-proyecto { padding-left: 0%; padding-right: 0%; }
  .post-pagination-wrap { padding-bottom: 60px; }
  #portfolio-galeria { padding-top: 60px; }
  #footer-custom .titulo { font-size: 100px; line-height: 100px; }
  #footer-custom .sec-90 { padding-bottom: 60px; }
  #portfolio-galeria img { margin-bottom: 30px; }
  .wpex-bars { width: 35px; }
  .wpex-bars>span::before { top: -8px; }
  .wpex-bars>span::after { bottom: -8px;}
  .wpex-bars>span, .wpex-bars>span::before, .wpex-bars>span::after { height: 2px; }
}

@media only screen and (max-width: 690px) {
    .sobre-mi-descripcion { padding-right: 20%; }
    .sobre-mi-imagen { width: 78%; margin-top: 20px; }
    .sec-60 { padding-bottom: 0px; }
    .sec-120-bottom { padding-bottom: 60px; }
    #portada .titulo { padding-top: 40px; }
    .post-pagination-wrap { padding-top: 60px; color: #fff; }
}

@media only screen and (max-width: 645px) {
    h1 { font-size: 110px!important; line-height: 110px!important; }
    .titular { float: none; }
    .gatete { width: 200px; position: relative; margin-bottom: 5px!important; margin-top: 30px; margin-left: 0; }
    .sticker-contacto { bottom: 10px; right: 10px; width: 120px; height: 120px; }
    .portfolio-entry-media.wpex-mb-20 { margin-bottom: 10px; }
}

@media only screen and (max-width: 475px) {
    .sobre-mi-titulo { font-size: 70px!important; line-height: 75px!important; letter-spacing: 0!important; }
    .sobre-mi-titulo { height: 285px!important; }
    .sobre-mi-titulo.sec-90 { padding-top: 30px; padding-bottom: 0px; }
    .sobre-mi-descripcion { padding-right: 10%; }
    .sobre-mi-imagen { width: 85%; margin-top: -50px; float: right; }
    #portada .titulo { font-size: 55px; line-height: 60px; }
    #footer-custom .titulo { font-size: 90px; line-height: 95px; }
    .email-me-banner-content>span { border-radius: 5vw; margin: 0 2.8vw 0 3vw; padding: 0 4vw; }
}

@media only screen and (max-width: 405px) {
    h1 { font-size: 100px!important; line-height: 105px!important; }
    .sobre-mi-titulo { font-size: 65px!important; line-height: 70px!important; }
}

@media only screen and (max-width: 380px) {
    .sobre-mi-titulo { font-size: 58px!important; line-height: 62px!important; height: 235px!important; }
    #portada .titulo { padding-bottom: 0;} 
    #portada .titulo { padding-top: 20px; }
}




