/*
Theme Name: Andres
Author: Andres
Description: A powerful Bootstrap 5 WordPress Starter Theme with WooCommerce Support. <a href="https://bootscore.me/category/documentation/" target="_blank">Documentation</a>. This theme gives you full control whatever you do and the full freedom to design whatever you want. It comes with a wide selection of category, page, post, author and archive templates as well as sidebar, header, footer and 404 widgets. There are no customizer settings in the backend. All settings can only be made by touching the code. Some CSS, HTML, PHP and JS Skills are required to customize it.
Version: 5.3.4
Requires at least: 5.0
Tested up to: 6.4.1
Requires PHP: 7.4
License: MIT License
License URI: https://github.com/bootscore/bootscore/blob/main/LICENSE
Text Domain: bootscore
Tags: featured-images, threaded-comments, translation-ready

Use this theme to make something cool, have fun, and share what you've learned with others.

Andres is based on Underscores https://underscores.me/, (C) 2012-2022 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

/* 
All style editing is done via scss/_bscore_custom.scss
*/



:root{
    --black: #111111;
    --red: #e7302b;
    --gray: #F2F1ED;
    --scale-factor: 1;
    
    --px14: calc(0.875rem * var(--scale-factor));
    --px16: calc(1rem * var(--scale-factor));
    --px18: calc(1.125rem * var(--scale-factor));
    --px20: calc(1.25rem * var(--scale-factor));
    --px22: calc(1.375rem * var(--scale-factor));
    --px24: calc(1.5rem * var(--scale-factor));
    --px26: calc(1.625rem * var(--scale-factor));
    --px28: calc(1.75rem * var(--scale-factor));
    --px30: calc(1.875rem * var(--scale-factor));
    --px32: calc(2rem * var(--scale-factor));
    --px34: calc(2.125rem * var(--scale-factor));
    --px36: calc(2.25rem * var(--scale-factor));
    --px38: calc(2.375rem * var(--scale-factor));
    --px40: calc(2.5rem * var(--scale-factor));
    --px45: calc(2.8125rem * var(--scale-factor));
    --px50: calc(3.125rem * var(--scale-factor));

}

@font-face {
    font-family: 'fm';
    src: url(fonts/FM-Bolyar-Sans-Pro-300.otf);
    font-weight: 300;
}
@font-face {
    font-family: 'fm';
    src: url(fonts/FM-Bolyar-Sans-Pro-500.otf);
    font-weight: 500;
}
@font-face {
    font-family: 'ra';
    src: url(fonts/Raleway-Light.ttf);
    font-weight: 300;
}
@font-face {
    font-family: 'ra';
    src: url(fonts/Raleway-Regular.ttf);
    font-weight: 500;
}
@font-face {
    font-family: 'ra';
    src: url(fonts/Raleway-Medium.ttf);
    font-weight: 600;
}
@font-face {
    font-family: 'ti';
    src: url(fonts/Times.ttf);
}


body.admin-bar{
    --wp-admin--admin-bar--height: 32px
}


html, body {
    height: auto;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body{
    color: var(--black);
    font-family: 'ra', sans-serif;
}

b, strong{
    font-weight: bold
}

.ra{
    font-family: 'ra', sans-serif;
}

.fm{
    font-family: 'fm', sans-serif;
}
.ti{
    font-family: 'ti', sans-serif;
}

.bg-black{
    background-color: var(--black)
}

.bg-gray{
    background-color: var(--gray)
}
.bg-red{
    background-color: var(--red)
}


.text-black{
    color: var(--black)!important
}

.text-red{
    color: var(--orange)
}



a{
    text-decoration: none;
    color: var(--black)
}

.fs-12 {
    font-size: 12px;
}

.fs-14 {
    font-size: var(--px14);
}
.fs-16 {
    font-size: var(--px16);
}
.fs-18 {
    font-size: var(--px18);
}
.fs-20 {
    font-size: var(--px20);
}
.fs-22 {
    font-size: var(--px22);
}
.fs-24 {
    font-size: var(--px24);
}
.fs-26 {
    font-size: var(--px26);
}
.fs-28 {
    font-size: var(--px28);
}
.fs-30 {
    font-size: var(--px30);
}
.fs-32 {
    font-size: var(--px32);
}
.fs-34 {
    font-size: var(--px34);
}
.fs-36 {
    font-size: var(--px36);
}
.fs-38 {
    font-size: var(--px38);
}
.fs-40 {
    font-size: var(--px40);
}
.fs-45 {
    font-size: var(--px45);
}
.fs-50 {
    font-size: var(--px50);
}


.bl{
    border-left: 1px solid #000
}
.br{
    border-right: 1px solid #000
}
.bt{
    border-top: 1px solid #000
}
.bb{
    border-bottom: 1px solid #000
}


.img-full{
    height: 100%;
    width: 100%;
}


.img-full img{
    width: 100%;
    height: 100%!important;
    object-fit: cover
}


#bootscore-navbar{
    margin-bottom: 0.25rem;
    transition: all .15s linear;
}

#bootscore-navbar li a{
    color: var(--black);
    font-family: 'fm', sans-serif;
    font-weight: 300;
    font-size: 15px;
    text-transform: lowercase;
    transition: all .15s linear;
    --bs-navbar-nav-link-padding-x: 1.25rem;
    --bs-dropdown-link-active-bg: var(--bs-tertiary-bg)
}

#bootscore-navbar > li:last-child a{
    padding-right: 0
}


ul li.current-menu-item a,
ul li a:hover{
    color: var(--red)!important;
}



.the-custom-logo img{
    width: 300px
}



.wpml-ls-legacy-list-horizontal a{
    font-size: 10px;
    font-family: 'fm', sans-serif;
    font-weight: 500
}


.wp-block-social-links.has-small-icon-size{
    margin-bottom: 0
}

.wpml-ls-legacy-list-horizontal a{
    position: relative;
}


.footer-info{
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

.footer-info li{
    position: relative;
    padding: 0 1rem;
}

.footer-info li:after,
.wpml-ls-legacy-list-horizontal a:after{
    position: absolute;
    content: "";
    right: 0;
    height: 15px;
    width: 1px;
    background-color: #111;
    top: 50%;
    transform: translateY(-50%)
}

#menu-footer-menu{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

#menu-footer-menu li{
    flex-grow: 1;
    text-align: center;
}

#menu-footer-menu li{
    padding: 0.325rem 1rem;
}

.footer-border:before,
.footer-border:after{
    position: absolute;
    content: "";
    height: 1px;
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
    top: 1rem;
    background-color: #111;
    z-index: -1
}

.footer-border:before{
    top: auto;
    bottom: 1rem;
}

#content{
    margin-top: 117px
}


#nav-main{
    --bs-navbar-padding-y: 0.767rem;
    transition: all .15s linear;
}



.top-nav{
    transition: all .15s linear;
}


.to-fixed #bootscore-navbar,
.to-fixed .top-nav{
    margin-bottom: 0!important
}


.bullet{
    font-size: 55px;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    font-family: arial, sans-serif
}


.btn{
    border-radius: 0;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    font-family: 'fm', sans-serif;
    line-height: 1
}

.estudio-gallery figure{
    height: 100%;
}
.estudio-gallery img{
    width: 100%!important;
    height: 100%!important;
    object-fit: cover;
}

.gx-6{
    --bs-gutter-x: 5rem
}

.title-diff{
    font-family: 'ra', sans-serif;
}

.title-diff sub{
    bottom: 0;
    font-weight: 300
}

.black-line{
    width: calc(50% + 1.5rem);
    left: -3rem;
    height: 3rem;
    background-color: #000;
}

.black-line.der{
    left: auto;
    margin-left: auto;
    right: -3rem
}


.der.title-diff{
    width: calc(50% - 1.5rem);
    margin-left: auto;
}


.box-img img{
    aspect-ratio: 1/1;
    object-fit: cover;
    width: 100%;
}

.box{
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.cont-boxes .box{
}


.box-text > p:last-child{
    margin-bottom: 0
}


.cont-box{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgba(0,0,0,.4);
    color: #fff;
    opacity: 0;
    visibility: hidden;
    transition: all .15s linear;
}



.cont-boxes:hover .cont-box{
    opacity: 1;
    visibility: visible
}

.img-box-estudio img{
    object-fit: cover;
    width: 100%;
    aspect-ratio: 16/9
}

.box-estudio{
    background-color: #000;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    flex-direction: column
}

.box-estudio:after{
    position: absolute;
    content: "";
    width: 50vw;
    height: 100%;
    background-color: #000;
    left: calc(-50vw - 1.5rem );
    top: 0
}

.box-estudio.box-r:after{
    left: calc(100% + 1.5rem);
}


.row-estudio{
    transform: translateY(-50%)
}

.img-border{
    border: 1px solid #000
}


.cont-title-bullet{
    display: flex;
    gap: 3rem;
    align-items: center
}


.project-bottom p{
    margin-bottom: 0.6rem
}


#nav-main{
    border-bottom: 1px solid #000;
}

.home #nav-main{
    border-bottom: 0;
}

.to-fixed #nav-main{
    box-shadow: 0px 0px 7px 0px rgba(0,0,0,.3)
}


.wpml-ls-current-language a{
    color: var(--red)
}

.dropdown-menu{
    --bs-dropdown-border-width: 0;
    --bs-dropdown-border-radius: 0;
    --bs-dropdown-font-size: 0.75rem;
    font-weight: 500
}


.contact-header > h6{
    font-weight: 300
}



input[type=checkbox], input[type=radio] {
    position: relative;
    border: 2px solid #000;
    border-radius: 2px;
    background: none;
    cursor: pointer;
    line-height: 0;
    margin: 0 .4em 0 0;
    outline: 0;
    padding: 0 !important;
    vertical-align: text-top;
    height: 20px;
    width: 20px;
    -webkit-appearance: none;
    opacity: .5;
    border-radius: 10px
}

input[type=radio]{
    border-radius: 0;
    border: 1px solid #000;
    height: 16px;
    width: 16px;
}

input[type=checkbox]:hover, input[type=radio] {
    opacity: 1;
}

input[type=checkbox]:checked, input[type=radio]:checked {
    background-color: #fff;
    opacity: 1;
}


input[type=checkbox]:checked:before, input[type=radio]:checked:before {
    content: '';
}

input[type=checkbox]:before, input[type=radio]:before  {
    position: absolute;
    right: 50%;
    top: 50%;
    width: 5px;
    height: 10px;
    border: solid #000;
    border-width: 0 2px 2px 0;
    margin: -1px -1px 0 -1px;
    transform: rotate(45deg) translate(-50%, -50%);
    z-index: 2;
}

.wpcf7-not-valid-tip{
    font-size: 12px
}


.wpcf7 label{
    display: block
}

.wpcf7 select,
.wpcf7 input[type="text"],
.wpcf7 input[type="email"]{
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--black);
    border-radius: 0;
    background-color: transparent
}

.wpcf7 textarea{
    width: 100%;
    border: 0;
    border: 1px solid var(--black);
    border-radius: 0;
    max-height: 120px;
    background-color: transparent
}

.wpcf7-list-item-label{
    font-size: 11px
}

.text-privacy{
    font-size: 10px;
    text-align: justify
}

.wpcf7-list-item{
    display: block;
    margin: 0;
    line-height: 1
}

.wpcf7-form .row{
    align-items: center
}

.wpcf7-form .row p{
    margin-bottom: 0
}

.wpcf7 select{
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0
}

.wpcf7 select,
.wpcf7 textarea::placeholder,
.wpcf7 input::placeholder{
    color: var(--black);
    font-size: 12px;
    font-family: 'fm', sans-serif;
    text-transform: uppercase;
    font-weight: 300
}


.wpcf7-spinner{
    position: absolute;
    left: 1.5rem;
    top: 5px
}

.cont-btn{
    text-align: right
}

.cont-btn p{
    position: relative
}

.wpcf7-submit {
    border-radius: 0;
    border: 0;
    border-bottom: 2px solid #000;
    background-color: transparent;
    color: var(--black);
    position: relative;
    padding-left: 1.5rem;
    padding-right: 0;
    max-width: 100%;
    min-width: auto;
    font-family: 'fm',sans-serif;
    font-weight: 300;
    font-size: 13px;
    text-transform: uppercase;
}

.fs-13 {
    font-size: 13px
}

.box-contacto:after {
    position: absolute;
    content: "";
    width: 100vw;
    height: calc(100% + 3rem);
    left: calc(var(--bs-gutter-x) * 3 * (-1));
    top: 0;
    background-color: #f8f7f5;
    z-index: -1;
}


.img-contact:after{
    position: absolute;
    content: "";
    left: -2rem;
    top: -2rem;
    width: calc(100% - 3rem);
    height: calc(100% + 4rem);
    background-color: #f2f1ed;
    z-index: -1
}

.img-contact{
    border: 1px solid #f2f1ed
}

.page-header h2{
    color: #7b7979
}

.archive-description > p:last-child{
    margin-bottom: 0
}



.project-pagintation > div{
    padding-right: 5px;
}

.project-pagintation > div:last-child{
    padding-right: 0;
    padding-left: 5px
}


.pagination {

    --bs-pagination-color: var(--black);
    --bs-pagination-bg: #fff;
    --bs-pagination-border-color: #000;
    --bs-pagination-border-radius: 0;
    --bs-pagination-hover-color: var(--red);
    --bs-pagination-hover-bg: #fff;
    --bs-pagination-hover-border-color: #000;
    --bs-pagination-focus-color: var(--red);
    --bs-pagination-focus-bg: #fff;
    --bs-pagination-focus-box-shadow: none;
    --bs-pagination-active-color: var(--black);
    --bs-pagination-active-bg: #fff;
    --bs-pagination-active-border-color: #000;
    --bs-pagination-disabled-color: var(--bs-secondary-color);
    --bs-pagination-disabled-bg: #fff;
    --bs-pagination-disabled-border-color: #000;
}

.cont-pagination{
    display: flex;
    justify-content: end;
    position: relative;
}

.cont-pagination:after{
    position: absolute;
    content: "";
    top: 50%;
    right: 0;
    width: 100vw;
    height: 1px;
    background-color: #000;
    z-index: -1
}

.pagination{
    justify-content: start !important;
    padding-left: 1rem;
    background-color: #fff
}

.pagination .page-link{
    border-color: transparent;
    font-weight: 600;
    font-size: var(--px20)
}

.pagination .page-link:after{
    position: absolute;
    content: "";
    right: 0;
    height: 16px;
    width: 1px;
    background-color: #000;
    top: 50%;
    transform: translateY(-50%);
}

.pagination > li:last-child .page-link:after{
    display: none
}


.proyecto-info {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding-left: 0;
    row-gap: 1rem
}

.proyecto-info li{
    padding: 0 1.5rem;
    border-left: 1px solid #000;
    line-height: 1
}

.proyecto-info li:first-child{
    border-left: 0;
}


.cont-info{
    display: table;
    margin: 0 auto;
    text-align: center
}


.single-proyectos .cont-swiper{
    overflow: hidden
}

.single-proyectos .swiper-pagination{
    position: relative;
}


.single-proyectos .swiper-button-next, .single-proyectos .swiper-button-prev{
    position: relative;
    --swiper-navigation-size: var(--px18);
    --swiper-navigation-sides-offset: 0;
    --swiper-theme-color: #222;
    margin-top: 0;
}

.cont-swiper-paginattion{
    display: flex;
    gap: 1rem;
    justify-content: center;
    align-items: center
}


.single-proyectos .swiper-pagination-fraction{
    width: auto;
    font-weight: 600;
    --swiper-pagination-bottom: 0;
}


.single-proyectos .swiper-pagination-fraction span{
    font-size: var(--px20);
    font-family: arial, sans-serif
}

.single-proyectos .swiper-pagination-current{
    color: #8a9504
}

.cont-swiper-paginattion .page-link{
    font-family: 'fm', sans-serif;
    font-weight: 300;
    text-transform: lowercase;

}


.cont-swiper-paginattion [rel="prev"]{
    padding-left: 1rem;
}
.cont-swiper-paginattion [rel="next"]{
    padding-right: 1rem;
}

.cont-swiper-paginattion [rel="prev"]:before {
    font-family: swiper-icons;
    content: "prev";
    left: -1rem;
    position: relative
}

.cont-swiper-paginattion [rel="next"]:after {
    font-family: swiper-icons;
    content: "next";
    right: -1rem;
    position: relative
}


.fashion-slider-scale{
    width: 100%
}


.single-proyectos .swiper-slide{
    height: auto
}


.single-proyectos .fashion-slider-scale{
    height: 100%;
    text-align: center;
    background-color: #000;
}


.single-proyectos .fashion-slider-scale img {
    height: calc(100vh - var(--wp-admin--admin-bar--height) - 119px - 50px);
    object-fit: contain;
    max-height: 750px;
    min-height: 400px
}
    


.archive-proyectos .box {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 100%;
    padding: 3rem 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}


.header-actions .btn{
    font-size: 22px;
    line-height: 1
}

.top-button,
.header-actions .btn{
    padding-left: 1rem;
    padding-right: 1rem;
}


.box-equipo{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center
}


.cont-estudio-left{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: end
}


.top-button{
    background-color: #fff;
    padding: 8px;
    line-height: 1;
    border-radius: 50px;
    border-color: #fff;
}


@media (max-width: 1400px) and (min-width: 1200px){

    .boxes .box-text{
        margin-bottom: 1.5rem!important;
    }
}


@media (max-width: 767px) and (min-width: 576px){

    .boxes .box-text{
        margin-bottom: 1.5rem!important;
    }
}



@media (min-width: 992px){
    .to-fixed #nav-main{
        --bs-navbar-padding-y: 0.5rem
    }
    .to-fixed #bootscore-navbar li a{
    font-size: 14px;
    padding-top: 0;
    padding-bottom: 0
}
}


@media (min-width: 1200px){
    .row-project .col-4{
        width: 27%
    }

    .row-project .col-8{
        width: 73%
    }
}


@media screen and (max-width: 1400px) {
    :root {
        --scale-factor: 0.9; /* Ajuste de escala para pantallas menores a 1400px */
    }
}


@media (max-width: 1199px){
    #bootscore-navbar li a{
        --bs-navbar-nav-link-padding-x: 0.5rem
    }

    .the-custom-logo img{
        width: 250px
    }

    .row-equipo .col-4{
        width: 40%;
    }
    .row-equipo .col-8{
        width: 60%;
    }

    .footer-info li:after{
        display: none
    }

}


@media (max-width: 991px){
    #content{
        margin-top: 64px
    }

    .row-estudio{
        transform: none;
        margin-top: -4rem;
        margin-bottom: 2rem
    }

    .offcanvas-body{
        display: flex
    }

    .offcanvas-header{
        color: #fff;
        background-color: #000;
    }

    .offcanvas-header .btn-close{
        opacity: 1;
        filter: invert(1)
    }

    .top-nav{
        order: 6;
        margin-top:  auto;
        margin-right: auto
    }

    .row-equipo .col-4{
        width: 45%;
    }
    .row-equipo .col-8{
        width: 55%;
    }

    .row-estudio1{
        --bs-gutter-x: 1.5rem
    }

    .row-project > .col-4{
        width: 50%;
    }
    .row-project > .col-8{
        width: 50%;
    }

}


@media (max-width: 782px){
    body.admin-bar{
    --wp-admin--admin-bar--height: 46px
}
}
@media (max-width: 767px){
    .row-equipo > div,
    .row-md > div{
        flex: 0 0 auto;
        width: 100%!important;
    }

    .order-md{
        order: -1
    }

    .row-estudio-small > div{
        width: 50%;
        flex: 0 0 auto;
    }

    .row-estudio {
        margin-top: 1.5rem;
    }

    .footer-border{
        padding: 1rem 0;
        margin-bottom: 1.5rem
    }

    .footer-info{
        gap: 0.5rem
    }

    .footer-border:after{
        top: 0
    }
    .footer-border:before{
        bottom: 0
    }

    .border-menu-footer{
        border: 0
    }

    .full-banner .swiper-slide img{
        min-height: 400px
    }

    .box-contacto:after{
        left: -1.5rem
    }


    .proyecto-info{
        justify-content: center;
    }
    
    .proyecto-info li:first-child{
         border-left: 1px solid #000;
    }
    
    .proyecto-info li {
        border-right: 1px solid #000;
        margin-left: -1px;
    }
    
    .cont-swiper-paginattion.justify-content-between{
        flex-wrap: wrap;
        gap: 0
    }
    
    .cont-swiper-paginattion.justify-content-between > div{
        width: 50%;
    }
    
    .cont-swiper-paginattion .cont-swiper-paginattion{
        width: 100%!important;
        order: -1;
        margin-bottom: 1rem
    }

}

@media (max-width: 411px){
    .the-custom-logo img {
        width: 230px;
    }
}