body{
    background-color:white;
}

@font-face {
    font-family: 'Avenir Light';
    src: url('/wp-content/themes/cimera/fonts/Avenir\ Light.ttf');
}

@font-face {
    font-family: 'Avenir Heavy';
    src: url('/wp-content/themes/cimera/fonts/Avenir\ Heavy.ttf');
}

@font-face {
    font-family: 'Avenir Medium';
    src: url('/wp-content/themes/cimera/fonts/Avenir\ Medium.ttf');
}
p {
    font-family: 'Avenir Light';
    font-size: 17px;
    color:rgb(94,106,113);
}
strong {
    font-family: 'Avenir Heavy';
}
.ah {
    font-family: 'Avenir Heavy';
}
.fs12 {
    font-size: 14px;
}
.fs15{
    font-size:17px;
}
h5.accordion-title{
    font-family: 'Avenir Medium';
    font-size: 17px;
    color:rgb(94,106,113);
}



#calculadora{
    color: #575650;
}
.calculadora-buttons-container{
    font-weight: 600;
    font-size: 15pt;
    width: 100%;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
    border-radius: 20px;
    padding: 4px 20px;
    height: 45px;
}
.calculadora-button{
    font-size:20pt;
    color: rgb(59,162,50);
    cursor: pointer;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}
.maxmin-text{
    font-size:8pt;
}
.calculadora-resultado{
    background-color: rgb(236,236,236);
    border-radius: 50px;
    width:'100%';
    padding: 12px;
}
.resultado-calculadora{
    color: rgb(59,162,50);
    font-size:20pt;
    font-weight: 600;
}
.interes-input{
    border:none;
    text-align: center;
    max-width: 120px;
    font-size:15pt;
    font-weight: 600;
    color: #575650;
}




/** MOBILE **/


@media only screen and (max-width: 9999px) {
    #site-navigation{
        position: fixed;
        bottom:20px;
        width:90%;
        max-width:432px;
        height: 60px;
        background-color: white;
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
        z-index: 9999;
        left:5%;
        border-radius:30px;
        padding:0px 10%;
    }
    #site-navigation a {
        height: 50%;
    }
    #site-navigation img {
        height:100%;
    }
    header{
        background-color: rgb(94,106,113);
        height:75px;
        position: fixed;
        top:0;
        z-index: 99999;
        width: 100%;
    }

    .logo-container h1 {
        font-size: 30px;
        color:white;
        font-family: 'Avenir Medium';
    }
    .logo-container p{
        font-size: 14px;
        color:white;
        line-height: 28px;
        font-family: 'Avenir Light';
    }
    .logo-container .separator-green{
        height:38px;
        width:2px;
        background-color: rgb(67,172,56);
        margin-bottom:-4px;
    }

    .video-section{
        padding-top:90px !important;
        background-color: rgb(94,106,113);
    }

    .video-container{
        width:100%;
        height:220px;
        max-width:800px;
        border-radius:40px;
        position: relative;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    .play-container{
        cursor: pointer;
        position: absolute;
        left:calc(50% - 60px);
        top:calc(50% - 60px);
        width:120px;
        height:120px;
        border-radius: 60px;
        background-color:rgba(165,172,175, 0.88);
    }
    .play-container i{
        color:white;
        font-size:60px;
        opacity: 0.5;
        margin-left:14px;
    }

    .section-title{
        border-bottom: 2px solid rgb(67,172,56);
    }
    .section-title h2{
        color: rgb(94,106,113);
        font-size:23px;
        font-family: 'Avenir Light';
    }
    .section-title img {
        max-height: 33px;
        width:auto;
    }

    .quality-container{
        background-color:rgb(223,222,216);
    }

    .quality-description-container{
        margin-bottom:60px;
    }

    .quality-icon img{
       height:80%;
       width: auto;
       min-width: 70px;
    }

    .quality-spacer{
        width:2px;
        height:100px;
        background-color:rgb(67,172,56);
        margin:auto 20px;
    }

    .quality-title{
        font-weight: bold;
        line-height: 21px;
        font-size: 18pt;
        text-transform: uppercase;
        color: #575650;
        margin-bottom: 6px;
        font-family: 'Avenir Heavy';
    }

    .quality-image{
        width:100%;
        height:auto;
        object-fit:cover;
    }
    

    .quality-subtitle{
        max-width:300px;
        font-weight: bold;
        font-size: 14pt;
        line-height: 19px;
        margin-bottom: 0px;
        color:rgb(67,172,56);
        text-transform: uppercase;
        font-family: 'Avenir Heavy';
    }

    .map-filter-chip{
        height: 30px;
        width: auto;
        padding: 0px 10px;
        border-radius: 12px;
        background-color:white;
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
        font-family: 'Avenir Medium';
        color:rgb(94,106,113);
        font-size:17px;
        cursor:pointer;
        margin:10px 0px;
    }

    .map-filter-chip.active{
        background-color: rgb(67,172,56);
        color:white;
        cursor:pointer;
    }
    .map-filter-chip.active p{
        color:white;
    }
    .map-filter-chip img{
        height:20px;
        margin-right:6px;
    }
    .map-container, .vue-map-container, .vue-map{
        width:100%;
        min-height: 400px;
        border-top-right-radius: 50px;
        border-bottom-left-radius: 50px;
    }
    .vue-map{
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
    }
    
    #myCarousel{
        position: relative;
    }
    #myCarousel .list-inline {
        white-space:nowrap;
        overflow-x:auto;
    }
    
    #myCarousel .carousel-indicators {
        position: static;
        left: initial;
        width: initial;
        margin-left: initial;
        background-color: rgb(94,106,113);
        height:88px;
        border-radius: 12px;
        justify-content: start;
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
    }
    
    #myCarousel .carousel-indicators > li {
        width: initial;
        height: initial;
        text-indent: initial;
        height: auto;
        min-width:84px;
        max-width:84px;
        background-color: transparent;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #myCarousel .carousel-indicators > li > a{
        display: flex;
        height:100%;
        width:100%;
        height:59px;
    }

    #myCarousel .carousel-indicators > li > a > img{
        border-top-right-radius: 20px;
        border-bottom-left-radius:20px;
    }
    
    #myCarousel .carousel-indicators > li.active img {
        opacity: 0.7;
        width:100%;
        height:100%;
        object-fit: cover;
        border-top-right-radius: 20px;
        border-bottom-left-radius:20px;
    }

    #myCarousel .carousel-indicators > li img{
        width:100%;
        height:100%;
        object-fit: cover;
    }

    #myCarousel .carousel-inner{
        border-top-right-radius:60px;
        border-bottom-left-radius:60px;
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
        height:317px;
    }
    #myCarousel .carousel-item{
        height:100%;
    }
    #myCarousel .carousel-item > img{
        height: 100%;
        object-fit: cover;
        width: 100%;
    }
    .carousel-controls-container{
        position: absolute;
        width:80px;
        height:39px;
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
        border-radius:15px;
        background-color:white;
        left: calc(50% - 80px / 2);
        top: calc(317px - 19px);
    }

    .carousel-control-prev, .carousel-control-next{
        color: black;
    }
    .carousel-control-prev{
        left:10px;
    }
    .carousel-control-next{
        right:10px;
    }
    .accordion-container{
        margin-top:30px;
        cursor: pointer;
    }
    .accordion-container i {
        color: rgb(94,106,113);
    }
    .border-bottom-green{
        border-bottom:1px solid rgb(67,172,56);
    }

    .tipology-filter-container{
        width:100%;
        min-height: 200px;
        border-radius:12px;
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
    }

    .tipology-chip{
        min-width:25px;
        width:42%;
        height:25px;
        padding: 0px 4px;
        border: 1px solid rgb(94,106,113);
        border-radius: 13px;
        color:rgb(94,106,113);
        font-family: 'Avenir Light';
        font-size: 17px;
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
    }
    .tipology-chip-room{
        width:50px;
        min-width:50px;
        height:25px;
        padding: 0px 4px;
        border: 1px solid rgb(94,106,113);
        border-radius: 13px;
        color:rgb(94,106,113);
        font-family: 'Avenir Light';
        font-size: 17px;
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
    }

    .tipology-chip.active,.tipology-chip-room.active{
        border: 1px solid transparent;
        background-color: rgb(67,172,56);
        color:white;
    }

    .tipology-viewer{
        width:100%;
        min-height: 320px;
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
        border-top-right-radius: 50px;
        border-bottom-left-radius: 50px;
        position:relative;
    }

    .tipology-viewer img{
        width:100%;
        height:100%;
        object-fit: cover;
    }

    .open-link-button{
        width:60px;
        height:60px;
        border:1px solid rgb(94,106,113);
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
        border-radius:30px;
        display: flex;
        justify-content:center;
        align-items:center;
        position: absolute;
        bottom:-10px;
        left:-10px;
        background-color:white;
    }
    .open-image-button{
        width:60px;
        height:60px;
        border:1px solid rgb(94,106,113);
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
        border-radius:30px;
        display: flex;
        justify-content:center;
        align-items:center;
        position: absolute;
        bottom:-15px;
        left:0px;
        background-color:white;
        cursor:pointer;
    }

    .extra-circle{
        width:20px;
        height:20px;
        border-radius:10px;
        border:1px solid rgb(94,106,113);
        background-color: white;
    }

    .extra-circle.active{
        background-color:rgb(67,172,56);
    }
    .map-filter-container-tablet{
        height: 100%;
        width: 100%;
        box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.5);
        border-radius: 12px;
    }
    .map-filter-chip-tablet {
        width: 95%;
        border-bottom: 1px solid rgb(67,172,56);
        cursor: pointer;
    }

    .map-filter-chip-tablet img{
        height:20px;
    }

    .btn-selector{
        background-color: rgb(67,172,56);
        border-radius: 15px;
        color: white;
        padding: 6px 20px;
    }
    .carousel-indicators{
        bottom:-50px;
    }
}


@media only screen and (max-width:420px){
    .quality-title{
        font-size: 13pt;
        line-height: 17px;
    }
    .quality-subtitle{
        font-size: 10pt;
        line-height: 14px;
    }
    .quality-icon img {
        min-width: 50px;
    }
    .titles-container{
        padding:15px 0px;
    }
    .quality-spacer{
        height:80px;
    }
}


@media (min-width:600px) and (max-width:9999px){
    #site-navigation{
        left: calc(50% - 432px / 2);
        padding: 0 5%;
    }
    #myCarousel .carousel-indicators{
        max-height:317px;
    }
    header{
        background-color: rgb(94,106,113);
        height:80px;
    }
    .video-container{
        width:100%;
        height:350px;
        border-radius:40px;
        position: relative;
        background-repeat: no-repeat;
    }
    .map-container, .vue-map-container, .vue-map{
        height: 200px;
    }
    
    .tipology-chip{
        width:100%;
    }

    .tipology-viewer{
        width:100%;
        height: 360px;
    }

    .tipology-viewer img{
        width:100%;
        height:100%;
        object-fit: contain;
    }

    #myCarousel .carousel-indicators{
        display:flex;
        flex-direction: column;
        width:118px;
        height:100%;
        align-items: center;
        
        margin-top:0 !important;
    }
    .open-image-button{
        bottom:0px;
        left:0px;
    }
    .carousel-inner{
        max-width: 800px;
    }
}