/* ESTILOS GENERALES */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900');
@import url('https://fonts.googleapis.com/css?family=Cormorant+Garamond:300,400');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600,900');
@import url('https://fonts.googleapis.com/css?family=Cormorant:400');

html, body{opacity:0}
html{position:relative; min-height:100%; }
body{padding-top:0px; outline: none; font-family: 'Roboto', sans-serif;}
.swiper-container.swiper-container-horizontal{width:100%;height:100%;}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance:none;}
select.error-valid,
input.error-valid {border-bottom:1px solid #f50000 !important;}
textarea.error-valid {background-image: -webkit-linear-gradient(top , #0000, #0000 33px, #f50000 0) !important}
.error-valid[type=checkbox] + label {border-bottom:1px solid #f50000 !important;}
.row{margin-left:0px; margin-right:0px}
:focus { outline: none; }
.contenedor {width: 95%; max-width: 1600px; margin: 0 auto;}
.small-contenedor {width: 100%; max-width: 1230px; margin: 0 auto;}
.big-contenedor {width: 100%; max-width: 1900px; margin: 0 auto;}
.bg {background-repeat:no-repeat; -ms-background-size: cover; background-size: cover; height: auto; background-position:center; overflow: hidden;}
.bg-loreto{width: 100%;background-repeat:no-repeat; -ms-background-size: cover; background-size: cover; height: auto; background-position:center; overflow: hidden;}
.bg-loreto img{width: 100%;visibility: hidden;max-height: 685px;}
.bg-greta1{width: 100%;background-repeat:no-repeat; -ms-background-size: cover; background-size: cover; height: auto; background-position:center; overflow: hidden;}
.bg-greta1 img{width: 100%;visibility: hidden;max-height: 685px;}
.bg.h-200{height: 200px;}
.rl {position: relative;}
.np {padding-left: 0; padding-right: 0}
.np-sm {padding-left: 0; padding-right: 0}
.npl{padding-left: 0}
.npr{padding-right: 0}
.text-center{text-align: center; margin: 0 auto}
.text-right{text-align: right; }
.centrar {display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.m15{margin-bottom: 15px}
.m20{margin-bottom: 20px}
.m30{margin-bottom: 30px}
.m40{margin-bottom: 40px}
.m60{margin-bottom: 60px}
.dis-table {display: table}
.bg-gris {background: #F8F8F8;}
.bg-grisOsc {background: #f3f3f3;}
.dis-table-cell {display: table-cell}
a:hover,
a:active,
a:focus,
a {text-decoration: none; color: inherit}

/* VARIABLES */
:root{
    --crema: #f2e4cd;
    --naranja: #f39360;
    --negro: #000000;
    --osc: #242424;
    --blanco: #ffffff;
    --gris: #adadad;

    --verde: #153e35;
    --verde2: #1e4d42;
    --verde3: #286758;
    --bggris: #F8F8F8;
    --bggrisOsc: #f3f3f3;

    --cor: 'Cormorant', serif;
    --rob: 'Roboto', sans-serif;
    --mon: 'Montserrat', sans-serif;
}

/* ANIMATIONS */
/* BUTTON SEND */
.claro button.send-animation {background: var(--verde2); border: none; color: var(--crema);}
.claro button.send-animation:hover { color: white; background: #00865c; }
.claro button.send-animation.onclic {border: 2px solid var(--verde2); border-left-color: #00865c; background: var(--verde)}
.claro button.send-animation.onclic:hover {color: #00865c; background: var(--verde);}
.claro button.send-animation.onclic:hover {color: #00865c; background: var(--verde);}
.oscuro button.send-animation {background: var(--blanco); border: 1px solid var(--negro); color: var(--negro);}
.oscuro button.send-animation:hover { color: white; background: var(--negro); }
.oscuro button.send-animation.onclic {border: 2px solid #d9d9d9; border-left-color: var(--negro); background: var(--blanco)}
.oscuro button.send-animation.validate {border: none}
.oscuro button.send-animation.error {border: none}

button.send-animation { outline: none; height: 40px; text-align: center; width: 130px;  font-family: var(--mon); font-size: 15px; font-weight: 400; letter-spacing: 0.7px; text-shadow: 0; cursor: pointer; -webkit-transition: all 0.25s ease; transition: all 0.25s ease; }
button.send-animation:active { letter-spacing: 2px; }
button.send-animation:after { content: "Enviar"; }
button.send-animation.onclic {border-radius: 40px; width: 40px;  font-size: 0;  -webkit-animation: rotating 2s 0.25s linear infinite; animation: rotating 2s 0.25s linear infinite; pointer-events: none;}
button.send-animation.onclic:after { content: ""; }
button.send-animation.validate { font-size: 18px; color: white; background: #00865c; /* border-radius: 40px; */  pointer-events: none}
button.send-animation.validate:after { font-family: 'FontAwesome'; content: "\f00c"; }
button.send-animation.error { font-size: 18px; color: white; background: #cd1e1e; /* border-radius: 40px; */  pointer-events: none}
button.send-animation.error:after { font-family: 'FontAwesome'; content: "\f06a"; }
@-webkit-keyframes rotating {
    from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes rotating {
    from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

/* BUTTON GENERAL */
button.btn-border-animation { display: block; position: relative; border: 1px solid var(--negro); color: var(--osc); font-family: var(--mon); font-size: 15px; text-transform: uppercase; font-weight: 400; cursor: pointer; margin: 0px; background: var(--blanco); -webkit-transition: 0.2s ease-in; transition: 0.2s ease-in; -webkit-transition-delay: 0.2s; transition-delay: 0.2s; }
button.btn-border-animation.w100 { width: 100%;}
button.btn-border-animation:hover { background: var(--negro); color: var(--blanco); }
button.btn-border-animation.verde {background: var(--verde3); color: var(--crema); border: 1px solid var(--verde3);}
button.btn-border-animation.verde:hover {background: var(--verde)}
button.btn-border-animation span{ display: block; padding: 3px 20px; }
button.btn-border-animation::before,
button.btn-border-animation::after{ content:""; width: 0; height: 1px; position: absolute; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; background: var(--negro); }
button.btn-border-animation span::before,
button.btn-border-animation span::after{ content:""; width: 1px; height:0; position: absolute; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; background: var(--negro); }
button.btn-border-animation.verde::before,
button.btn-border-animation.verde::after,
button.btn-border-animation.verde span::before,
button.btn-border-animation.verde span::after {background: var(--verde)}
button.btn-border-animation:hover::before,
button.btn-border-animation:hover::after{ width: 100%; }
button.btn-border-animation:hover span::before,
button.btn-border-animation:hover span::after{ height: 100%; }
  /*----- button 1 -----*/
button.btn-border-animation.btn-1::before,
button.btn-border-animation.btn-1::after{ -webkit-transition-delay: 0.2s; transition-delay: 0.2s; }
button.btn-border-animation.btn-1 span::before,
button.btn-border-animation.btn-1 span::after{ -webkit-transition-delay: 0s; transition-delay: 0s; }
button.btn-border-animation.btn-1::before{ right: 0; top: 0; }
button.btn-border-animation.btn-1::after{ left: 0; bottom: 0; }
button.btn-border-animation.btn-1 span::before{ left: 0; top: 0; }
button.btn-border-animation.btn-1 span::after{ right: 0; bottom: 0; }
button.btn-border-animation.btn-1:hover::before,
button.btn-border-animation.btn-1:hover::after{ -webkit-transition-delay: 0s; transition-delay: 0s; }
button.btn-border-animation.btn-1:hover span::before,
button.btn-border-animation.btn-1:hover span::after{ -webkit-transition-delay: 0.2s; transition-delay: 0.2s; }

/* ESTILOS */
/* MENU */
body::before { content: ""; height: 90px; width: 100%; background-color: transparent; background-image: url(../img/logo.svg); background-size: 70px; background-position: center; background-repeat: no-repeat; position: fixed; top: 0; left: 0; z-index: 110; transition: background 300ms; -webkit-transition: background 300ms ; -moz-transition: background 300ms ; -ms-transition: background 300ms ; -o-transition: background 300ms ; }
body.scroll::before {background-color: var(--verde);}
body.menu-open {overflow: hidden;}
body.menu-open::after {content: ""; width: 100%; height: 100vh; overflow: hidden; z-index: 140; background-color: #00000053; position: fixed; top: 0; left: 0;}
.menu-open header { transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); }
header { position: fixed; top: 0; left: 0; z-index: 150; width: 280px; height: 100%; background: var(--verde); padding: 15px 30px; -webkit-box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.13); box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.13); transition: transform 300ms; -webkit-transition: transform 300ms; -moz-transition: transform 300ms; -ms-transition: transform 300ms; -o-transition: transform 300ms; transform: translate(-100%, 0); -webkit-transform: translate(-100%, 0); -moz-transform: translate(-100%, 0); -ms-transform: translate(-100%, 0); -o-transform: translate(-100%, 0); }
header .logo-movil {margin-bottom: 50px}
header .menuonlyMovil ul {padding: 15px; padding-bottom: 1px; margin-top: 5px}
header .menuonlyMovil ul,
header .dropdown .dropdown-menu { border: none; border-radius: 0; background-color: #20202099; min-width: 180px; width: 100%; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; }
header .menuonlyMovil ul li,
header .dropdown .dropdown-menu li {display: block !important; width: auto !important; margin-bottom: 5px !important; }
header .menuonlyMovil ul li {margin-bottom: 15px !important}
header .menuonlyMovil ul a,
header .dropdown .dropdown-menu li a {display: inline-block !important; color: #518B7D !important; font-weight: 300 !important; transition: all .25s ease; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; font-size: 12px !important; letter-spacing: 2px !important;}
header .dropdown-menu>li>a:hover,
header .dropdown-menu>li>a:focus {background: transparent !important; color: var(--crema) !important;}
header ul.menu {padding: 0; margin: 0; list-style: none; }
header ul.menu li {width: 100%; margin-bottom: 30px}
header ul.menu li.logo {display: none}
header ul.menu li div,
header ul.menu li div:hover,
header ul.menu li a:hover,
header ul.menu li a:focus,
header ul.menu li a:active,
header ul.menu li a {text-decoration: none; font-size: 15px; font-weight: 300; letter-spacing: 3px; color: var(--crema); text-transform: uppercase; position: relative; cursor: pointer;}
@media screen and (max-width: 991px){
    header .dropdown .dropdown-menu {position: initial; float: none;}
    header ul.menu li div:before,
    header ul.menu li a::before { content: ""; display: inline-block; width: 0px; height: 2px; margin-right: 0px; margin-bottom: 4px; background-color: var(--crema); visibility: hidden; transform: scaleX(0); -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; }
    header ul.menu li div.active::before,
    header ul.menu li a.active::before {width: 10px; margin-right: 10px; visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); }
    header .dropdown .dropdown-menu li a::before {content: none}
    header .menuonlyDesk {display: none;}
}
@media screen and (min-width: 992px){
    header .menuonlyMovil {display: none !important;}
    body::before {content: none}
    header { position: absolute; top: 0; left: 0; z-index: 150; width: 100%; padding: 0; padding-top: 30px; height: auto; opacity: 1; -webkit-box-shadow: none; box-shadow: none; background: none; transform:none ; -webkit-transform:none ; -moz-transform:none ; -ms-transform:none ; -o-transform:none ; }
    header .logo-movil {display: none}
    /* header .dropdown {width: max-content; margin: auto;} */
    header .dropdown .dropdown-menu {left: 0px; top: 24px}
    header .dropdown .dropdown-menu li a {font-size: 10px !important;}
    header ul.menu {text-align: center;}
    header ul.menu li {display: inline-block; width: 13.7%; text-align: center;}
    header ul.menu li.logo {display: inline-block}
    header ul.menu li a:hover,
    header ul.menu li a:focus,
    header ul.menu li a:active,
    header ul.menu li a {text-decoration: none; font-size: 10px; font-weight: 500; letter-spacing: 3px; text-align: center; color: var(--crema); text-transform: uppercase;}
    header ul.menu li:not(.logo) a::before {content: ""; width: 20px; height: 2px; position: absolute; bottom: -5px; left: 0; right: 0; margin: 0 auto; background-color: var(--crema); visibility: hidden; transform: scaleX(0); -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; }
    header ul.menu li:not(.logo) a:hover::before,
    header ul.menu li:not(.logo) a.active::before {visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); }
}
@media screen and (min-width: 1200px){
    /* header .dropdown .dropdown-menu {left: -24px;} */
    header .dropdown .dropdown-menu li a {font-size: 12px !important;}
    header ul.menu li a:hover,
    header ul.menu li a:focus,
    header ul.menu li a:active,
    header ul.menu li a {font-size: 12px}
}
@media screen and (min-width: 1400px){
    header ul.menu li a:hover,
    header ul.menu li a:focus,
    header ul.menu li a:active,
    header ul.menu li a {font-size: 15px}
}


.bt-menu { position: absolute; top: 15px; right: -60px; margin: auto; border: none; padding: 0; background: none; cursor: pointer; border-radius: 4px; width: 50px; height: 50px; -webkit-transition: 0.2s; transition: 0.2s; z-index: 1;}
.menu-open .bt-menu {right: 15px;}
.bt-menu:active { -webkit-transform: scale(0.9); transform: scale(0.9); }
.bt-menu:active, .bt-menu:focus { outline: none; }
.bt-menu .hamburguer { width: 32px; height: 25px; -webkit-transition: 0.2s; transition: 0.2s; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; }
.bt-menu .hamburguer, .bt-menu .hamburguer .bar { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
.bt-menu .hamburguer .bar { width: 32px; height: 4px; background: var(--crema); border-radius: 2px; -webkit-transition: 0.2s; transition: 0.2s; outline: 1px solid transparent; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; }
.bt-menu .hamburguer .bar-1 { -webkit-transform: rotate(0) translate3d(0, -10px, 0); transform: rotate(0) translate3d(0, -10px, 0); }
.bt-menu .hamburguer .bar-3 { -webkit-transform: rotate(0) translate3d(0, 10px, 0); transform: rotate(0) translate3d(0, 10px, 0); }
.menu-open .bt-menu .hamburguer { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
.menu-open .bt-menu .hamburguer .bar-1 { -webkit-transform: rotate(45deg) translate3d(0, 0, 0); transform: rotate(45deg) translate3d(0, 0, 0); }
.menu-open .bt-menu .hamburguer .bar-2 { opacity: 0; }
.menu-open .bt-menu .hamburguer .bar-3 { -webkit-transform: rotate(-45deg) translate3d(0, 0, 0); transform: rotate(-45deg) translate3d(0, 0, 0); }
@media screen and (min-width: 992px){
    .bt-menu {display: none; pointer-events: none;}
}

/* FOOTER */
footer {background: var(--verde); padding: 30px 0px; color: var(--crema)}
footer .logo {text-align: center; margin-bottom: 50px}
footer .logo img {width: 120px; margin-top: 30px}
footer ul.menu-footer {padding: 0; margin: 0; margin-bottom: 40px; list-style: none; -webkit-columns: 2; columns: 2; width: 100%; max-width: 350px}
footer ul.menu-footer li a:hover,
footer ul.menu-footer li a:active,
footer ul.menu-footer li a:focus,
footer ul.menu-footer li a {color: var(--crema); text-decoration: none; text-transform: uppercase; font-size: 15px; font-weight: 300; font-style: normal; font-stretch: normal; line-height: 2; letter-spacing: 0.5px; }
footer ul.politicas {padding: 0; margin: 0; margin-bottom: 40px; list-style: none; text-align: right}
footer ul.politicas li {text-align: center }
footer ul.politicas li a:hover,
footer ul.politicas li a:active,
footer ul.politicas li a:focus,
footer ul.politicas li a {color: var(--crema); text-decoration: none; text-transform: uppercase; font-size: 15px; font-weight: 300; font-style: normal; font-stretch: normal; line-height: 2; letter-spacing: 0.5px;}
footer ul.redes {padding: 0; margin: 0; list-style: none; margin-left: auto; margin-right: auto; max-width: 210px; width: 100%}
footer ul.redes li {display: inline-block; margin-right: 20px}
footer ul.redes li img {width: 75px}
footer ul.redes li:last-child {margin-right: 0px}
footer ul.redes li a:hover,
footer ul.redes li a:active,
footer ul.redes li a:focus,
footer ul.redes li a {color: var(--crema); text-decoration: none;}
@media screen and (min-width: 768px){
    footer ul.politicas li {text-align: right }
    footer ul.redes {margin-right: 0px}
}
@media screen and (min-width: 992px){
    footer .logo {text-align: left}
}

/* INDEX */
.index {height: 100vh; width: 100%; background: url(../img/index.jpg) center no-repeat; background-size: cover; position: relative;}
.index::before {content: ""; position: absolute; height: 100%; width: 100%; top: 0; left: 0; z-index: 1; background: rgb(21,62,53); background: -webkit-gradient(linear, left top, left bottom, from(rgba(21,62,53,1)), to(rgba(21,62,53,0.8))); background: linear-gradient(180deg, rgba(21,62,53,1) 0%, rgba(21,62,53,0.8) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#153e35",endColorstr="#153e35",GradientType=1); }
.index .contenedor {position: relative; z-index: 1;}
.index .tlo-small {font-size: 15px; font-weight: 900; letter-spacing: 2px; text-align: center; color: var(--naranja); text-transform: uppercase;}
.index .tlo {font-family: var(--cor); font-size: 30px; font-weight: 300; line-height: 1.14; text-align: center; color: var(--crema); max-width: 700px; margin: 0 auto; position: relative}
.index .tlo::after {content: ""; height: 50px; width: 1px; background-color: var(--crema); position: absolute; left: 0; right: 0; margin: 0 auto; bottom: -90%;}
.index .subtlo {font-size: 15px; font-weight: 900; letter-spacing: 2px; color: var(--crema); text-transform: uppercase; position: absolute; left: 0; right: 0; margin: 0 auto; bottom: 50px; z-index: 2; text-align: center}
@media screen and (min-width: 768px){
    .index .tlo {font-size: 70px;}
}

/* CARD INFO GENERAL */
.info-general { padding: 60px 0px; background-color: var(--bggris); min-height: 400px}
.info-general .tlo { font-family: var(--mon); font-size: 20px; font-weight: 400; line-height: 1.68; letter-spacing: 3px; text-align: center; color: var(--osc); margin-bottom: 80px; text-transform: uppercase; position: relative;}
.info-general .tlo::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -40px; left: 0px; right: 0px; margin: 0 auto}
.info-general .p { font-size: 15px; font-weight: 300; line-height: 1.6; text-align: center; color: #000000; max-width: 700px; margin: 0 auto;}
@media screen and (min-width: 768px){
    .info-general .tlo {font-size: 25px}
}

/* DESARROLLO */
.desarrollo .bg {height: 400px; background-color: #00000080; background-blend-mode: multiply}
.desarrollo .bg-lotes {background-image: url(../img/bg-desarrollo/index01.jpg);}
.desarrollo .bg-andra {background-image: url(../img/bg-desarrollo/index02.jpg);}
.desarrollo .bg-greta {background-image: url(../img/bg-desarrollo/index03.jpg);}
.desarrollo .bg-villase1 {background-image: url(../img/bg-desarrollo/index03.jpg);}
.desarrollo .bg-vera {background-image: url(../img/bg-desarrollo/index04.jpg);}
.desarrollo .bg-thiago {background-image: url(../img/bg-desarrollo/index05.jpg);}
.desarrollo .bg-amalia {background-image: url(../img/bg-desarrollo/index06.jpg);}
.desarrollo .bg-aurora {background-image: url(../img/bg-desarrollo/index07.jpg);}
.desarrollo .bg-carola {background-image: url(../img/bg-desarrollo/index08.jpg);}
.desarrollo .bg-amara {background-image: url(../img/bg-desarrollo/index09.jpg);}
.desarrollo .bg-loreto1 {background-image: url(../img/bg-desarrollo/index10.jpg);}
.desarrollo .bg-villas-e1 {background-image: url(../img/bg-desarrollo/index11.jpg);}
.desarrollo .centrar {height: 100%; width: 100%;}
.desarrollo .card {text-align: center; position: relative;}
.desarrollo .card img {margin-bottom: 10px; width: 162px}
.desarrollo .card a:hover,
.desarrollo .card a:focus,
.desarrollo .card a:active,
.desarrollo .card a { text-decoration: none; font-family: var(--mon); font-size: 15px; font-weight: 400; letter-spacing: 0.8px; color: var(--blanco); text-transform: uppercase; position: relative; display: block; text-align: center; position: absolute; bottom: -50px; left: 50%; transform:translate(-50%, 0) ; -webkit-transform:translate(-50%, 0) ; -moz-transform:translate(-50%, 0) ; -ms-transform:translate(-50%, 0) ; -o-transform:translate(-50%, 0) ; }
.desarrollo .card a::after {content: ""; height: 2px; width: 15px; background: var(--blanco); position: absolute; bottom: -5px; left: 0; right: 0; margin: 0 auto;}

/* INFORMACION */
.informacion {padding-top: 60px; background-color: var(--verde)}
.informacion .tlo {font-family: var(--cor); font-size: 40px; font-weight: 300; line-height: 1.14; color: var(--crema); max-width: 400px;}
.informacion .tlo::after {content: ''; width: 70%; height: 1px; background: var(--crema); position: absolute; bottom: -20px; right: 0;}
.informacion .m120 {margin-bottom: 60px}
@media screen and (min-width: 768px){
    .informacion .tlo {font-size: 60px}
    .informacion .tlo::after {bottom: 9px; right: -90%;}
}
@media screen and (min-width: 992px){
    .informacion .tlo {font-size: 70px}
}

/* ESTILOS FORM CONTACTO */
.form-style-contacto {padding: 60px 0px }
.form-style-contacto.claro .ftlo {color: var(--naranja); font-family: var(--mon); font-size: 20px; font-weight: 600; letter-spacing: 0.7px;}
.form-style-contacto.claro label,
.form-style-contacto.claro select,
.form-style-contacto.claro input,
.form-style-contacto.claro textarea,
.form-style-contacto.claro .fsubtlo,
.form-style-contacto.claro a,
.form-style-contacto.claro a:hover,
.form-style-contacto.claro a:focus,
.form-style-contacto.claro a:active,
.form-style-contacto.claro .fp {color: var(--crema)}
.form-style-contacto.claro input,
.form-style-contacto.claro select {border: none; border-bottom: 1px solid var(--verde2); }
.form-style-contacto.oscuro .ftlo {color: var(--negro)}
.form-style-contacto.oscuro label,
.form-style-contacto.oscuro select,
.form-style-contacto.oscuro textarea,
.form-style-contacto.oscuro input,
.form-style-contacto.oscuro .fsubtlo,
.form-style-contacto.oscuro a,
.form-style-contacto.oscuro a:hover,
.form-style-contacto.oscuro a:focus,
.form-style-contacto.oscuro a:active,
.form-style-contacto.oscuro .fp {color: var(--osc)}
.form-style-contacto.oscuro input,
.form-style-contacto.oscuro select {border: none; border-bottom: 1px solid #d9d9d9; }
.form-style-contacto input
.form-style-contacto select
.form-style-contacto .decora::before {contain: ''; width: 60px; height: 1px; background: var(--crema); position: absolute; bottom: 0; left: 0;}
.form-style-contacto .cont {position: relative;}
.form-style-contacto .ftlo {text-transform: uppercase; font-family: var(--mon); font-size: 15px; font-weight: 600; line-height: 1.53; letter-spacing: 0.5px; margin-bottom: 30px; text-align: center}
.form-style-contacto .ftlo.p15 {padding-left: 15px}
.form-style-contacto ul.horario {list-style: none; padding: 0px; margin: 0px; -webkit-columns: 2; columns: 2; max-width: 310px; margin: 0 auto; }
.form-style-contacto ul.horario li:first-child {height: 120px;}
.form-style-contacto ul.horario li {margin-bottom: 15px}
.form-style-contacto ul.extra {list-style: none; padding: 0px; margin: 0px; margin-bottom: 30px}
.form-style-contacto ul.extra li {margin-bottom: 15px}
.form-style-contacto ul.extra li:nth-child(1),
.form-style-contacto ul.extra li:nth-child(2) {display: inline-block; width: 49%}
.form-style-contacto .fsubtlo {font-family: var(--mon); font-size: 15px; font-weight: 400; line-height: 1.53; letter-spacing: 0.5px; font-size: 18px; text-align: center}
.form-style-contacto button.maps { width: 100%; max-width: 350px; border: none; padding: 6px 15px; font-family: var(--mon); text-transform: uppercase; transition: all 0.25s ease; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -ms-transition: all 0.25s ease; -o-transition: all 0.25s ease; }
.form-style-contacto.claro button.maps {background-color: var(--verde2); color: var(--crema);}
.form-style-contacto.claro button.maps:hover {background-color: #00865c;}
.form-style-contacto.oscuro button.maps {background-color: transparent; color: var(--osc); border: 1px solid var(--negro)}
.form-style-contacto.oscuro button.maps:hover {background-color: var(--negro); color: var(--blanco); border: 1px solid var(--negro)}
.form-style-contacto a,
.form-style-contacto a:hover,
.form-style-contacto a:focus,
.form-style-contacto a:active,
.form-style-contacto .fp {font-family: var(--mon); font-size: 13px; font-weight: 300; line-height: 1.53; letter-spacing: 0.5px; text-align: center}
.form-style-contacto label {width: 100%; display: block; text-transform: uppercase; font-family: var(--mon); font-size: 15px; font-weight: 300; line-height: 1.53; letter-spacing: 0.5px;}
.form-style-contacto input {width: 100%; height: 35px; background: none; font-family: var(--mon); font-size: 15px; font-weight: 300; line-height: 1.53; letter-spacing: 0.5px;}
.form-style-contacto select {font-family: var(--mon); font-size: 15px; font-weight: 300; line-height: 1.53; letter-spacing: 0.5px; width: 100%; height: 35px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: none; border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px;  padding-right: 15px}
.form-style-contacto.claro select {background: url(../img/caret.png) no-repeat 100%;}
.form-style-contacto.oscuro select {background: url(../img/caret-gris.png) no-repeat 100%;}
.form-style-contacto textarea {font-family: var(--mon); font-size: 15px; font-weight: 300; line-height: 1.53; letter-spacing: 0.5px; width: 100%; height: 205px; resize: none; background: none; border: none;}
.form-style-contacto.claro textarea {line-height: 35px; background-image: -webkit-linear-gradient(top , transparent, transparent 33px, var(--verde2) 0); background-size: 100% 34px;}
.form-style-contacto.oscuro textarea {line-height: 35px; background-image: -webkit-linear-gradient(top , transparent, transparent 33px, #d9d9d9 0); background-size: 100% 34px;}
.form-style-contacto textarea,
.form-style-contacto input,
.form-style-contacto select {margin-bottom: 23px; color: var(--crema)}
.form-style-contacto ul.btns {padding: 0; margin: 0; list-style: none; margin-bottom: 10px}
.form-style-contacto ul.btns li {text-align: center; overflow: hidden;}
.form-style-contacto ul.btns li:first-child .g-recaptcha { transform: scale(.6) ; -webkit-transform: scale(.6) ; -moz-transform: scale(.6) ; -ms-transform: scale(.6) ; -o-transform: scale(.6) ; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%}
@media screen and (min-width: 768px) and (max-width: 991px){
    .form-style-contacto ul.horario {-webkit-columns: initial;columns: initial;}
    .form-style-contacto ul.horario li:first-child {height: auto;}
    .form-style-contacto ul.extra li {display: inline-block; width: 49%; }
}
@media screen and (min-width: 768px){
    .form-style-contacto .fsubtlo {text-align: left}
    .form-style-contacto .fp {text-align: left;}
    .form-style-contacto .formulario {padding: 0px}
    .form-style-contacto form div.np:not(.np-sm) {padding-left: 15px; padding-right: 15px; }
    .form-style-contacto ul.btns li {display: inline-block; height: 80px; width: 200px;}
    .form-style-contacto ul.btns li:first-child .g-recaptcha {-webkit-transform-origin: 0 50%;transform-origin: 0 50%}
    .form-style-contacto ul.btns li:last-child {padding: 18px 0px}
}
@media screen and (min-width: 992px){
    .form-style-contacto .ftlo {text-align: left}
}
@media screen and (min-width: 1200px){
    .form-style-contacto ul.horario {-webkit-columns: initial;columns: initial;}
    .form-style-contacto ul.horario li:first-child {height: auto;}
    .form-style-contacto ul.extra li:nth-child(1),
    .form-style-contacto ul.extra li:nth-child(2),
    .form-style-contacto ul.extra li {display: block; width: 100%; margin-bottom: 30px}
    .form-style-contacto a,
    .form-style-contacto a:hover,
    .form-style-contacto a:focus,
    .form-style-contacto a:active,
    .form-style-contacto .fp {font-size: 15px}
}

/* PORTADA */
.portada.cittadela {background: var(--verde); color: var(--crema);}
.portada.villas-e {background: #5a877a; color: var(--crema);}

.portada.andra {background: #86AC9B; color: var(--crema);}
.portada.greta {background: #538D7A; color: var(--crema);}
.portada.vera {background: #BF8F6F; color: var(--crema);}
.portada.aurora {background: #A87957; color: var(--crema);}
.portada.thiago {background: #BA6172; color: var(--crema);}
.portada.amalia {background: #3c6e98; color: var(--crema);}
.portada.carola {background: #A94F5C; color: var(--crema);}
.portada.amara {background: #A5C0C6; color: var(--crema);}
.portada.loreto {background: #7B6397; color: var(--crema);}
.portada.casa-club {background: #828d42; color: var(--crema);}
.portada {height: 100vh; width: 100%; position: relative;}
.portada .tlo {font-family: var(--cor); font-size: 35px; font-weight: 300; line-height: 1.14; text-align: center; padding: 0 15px}
.portada .tlo span {font-size: 18px; font-family: var(--rob); font-weight: 700; text-transform: uppercase; letter-spacing: 2.4px;}
.portada .tlo span.bold-lg {font-size: 35px; font-family: var(--cor); font-weight: 300; text-transform: uppercase; letter-spacing: 2.4px;}
.portada .subtlo {font-size: 18px; text-align: center; position: absolute; bottom: 30px; left: 0; right: 0; margin: 0 auto; text-transform: uppercase}
.portada .subtlo img {display: block; margin: 0 auto; margin-bottom: 40px; width: 40px}
.portada.villas-e .portada .subtlo img {display: block; margin: 0 auto; margin-bottom: 40px; width: 40px}
@media screen and (min-width: 768px){
    .portada .tlo span.bold-lg,
    .portada .tlo {font-size: 60px}
    .portada .subtlo img {display: block; margin: 0 auto; margin-bottom: 80px; width: auto;max-width: 65px;}
}
@media screen and (min-width: 1200px){
    .portada .tlo span.bold-lg,
    .portada .tlo {font-size: 70px}
}

/* SLIDER */
.slider {background: var(--bggris); padding-bottom: 60px}

.slider .card {position: absolute; bottom: 20px; right: 20px; z-index: 2}
.slider .ms-slide::before {content: ""; background-image: linear-gradient(0deg, #000000c9 0%, #00000021 20%, #0000 100%); height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 1}
.slider .card .tlo {font-family: var(--mon); color: var(--blanco); font-size: 16px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase;}

.cotizador .swiper-slide .card {position: absolute; bottom: 20px; right: 20px; z-index: 2}
.cotizador .swiper-slide::before {content: ""; background-image: linear-gradient(0deg, #000000c9 0%, #00000021 20%, #0000 100%); height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 1}
.cotizador .swiper-slide .card .tlo {font-family: var(--mon); color: var(--blanco); font-size: 16px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase;}

.ms-bullets.ms-dir-h {bottom: -40px !important}
.ms-skin-default .ms-bullet { background: #dedede !important; border-radius: 50%; }
.ms-skin-default .ms-bullet-selected { background: var(--verde) !important; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.ms-skin-default .ms-nav-next, .ms-skin-default .ms-nav-prev{ background-image: url(../img/arrow-prev.svg) !important; background-position: center !important; background-size: contain !important; background-repeat: no-repeat !important;}
.ms-skin-default .ms-nav-next {background-image: url(../img/arrow-next.svg) !important;}
@media screen and (min-width: 1200px){
    .slider {padding: 60px 0px; padding-bottom: 80px}
}

.col-container { width: 100%; background: var(--blanco)}
.col { padding:  30px 15px;}
@media screen and (max-width: 767px){ .col.bg {height: 350px;} }
@media screen and (max-width: 991px){ .col.bg {height: 400px;} }
@media screen and (min-width: 992px){
    .col-container {display: -webkit-box;display: -ms-flexbox;display: flex; min-height: 520px}
    .col { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 60px}
}





/* AMENIDADES */
.amenidades {background: var(--bggris); padding: 60px 0px; color: var(--negro)}
.amenidades .tlo {font-family: var(--mon); color: var(--osc); font-size: 25px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 80px; position: relative}
.amenidades .tlo::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -40px; left: 0px;}
.amenidades .bg-amenidad {padding: 0px;}
.amenidades .bg-amenidad .swiper-container,
.amenidades .bg-amenidad .swiper-container { width: 100%; height: 100%;}
.amenidades .bg-amenidad.cittadela {background-image: url(../img/desarrollo/render/cittadela/slide04.jpg)}
.amenidades .bg-amenidad.villas-e {background-image: url(../img/desarrollo/render/villas-e/slide04.jpg)}
.amenidades .bg-amenidad.andra {background-image: url(../img/desarrollo/render/andra/andra-2.jpg)}
.amenidades .bg-amenidad.greta {background-image: url(../img/desarrollo/render/greta/greta-1.jpg)}
.amenidades .bg-amenidad.vera {background-image: url(../img/desarrollo/render/vera/slide01.jpg)}
.amenidades .bg-amenidad.thiago {background-image: url(../img/desarrollo/render/thiago/thiago-1.jpg)}
.amenidades .bg-amenidad.amalia {background-image: url(../img/desarrollo/render/amalia/slide01.jpg)}
.amenidades .bg-amenidad.casa-club {padding: 0}
.amenidades .bg-amenidad.casa-club .ms-bullets.ms-dir-h {bottom: 20px !important}
.amenidades ul.list-amenidades {padding-left: 0px; list-style: none;}
.amenidades ul.list-amenidades li { font-size: 15px; font-weight: 300; line-height: 1.6; letter-spacing: normal; position: relative; padding-left: 20px;}
.amenidades ul.list-amenidades li::before { content: ""; width: 6px; height: 6px; background-color: #cccccc; position: absolute; top: 8px; left: 0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.swiper-button-next, .swiper-button-prev {background-size: contain; background-repeat: no-repeat; background-position: center}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {background-image: url(../img/arrow-prev.svg)}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {background-image: url(../img/arrow-next.svg)}
@media screen and (min-width: 768px){
    .amenidades ul.list-amenidades.vera,
    .amenidades ul.list-amenidades.casa-club,
    .amenidades ul.list-amenidades.villas-e,
    .amenidades ul.list-amenidades.cittadela {-webkit-columns: 2;columns: 2;}

    .amenidades ul.list-amenidades.aurora{-webkit-columns: 3; columns: 3;}
    .amenidades ul.list-amenidades.carola{-webkit-columns: 3; columns: 3;}
    .amenidades ul.list-amenidades.amara{-webkit-columns: 3; columns: 3;}
    /* .amenidades ul.list-amenidades.loreto{-webkit-columns: 3; columns: 3;} */
}

/* COTIZADOR */
.cotizador {background: var(--bggris); padding: 60px 0px; color: var(--negro)}
.cotizador .contenedor {background: var(--blanco); position: relative;}
.cotizador .contenedor.allVendido::before { content: "100% Vendido"; height: 46px; width: 146px; background-image: url(../img/bg-vendido.svg); position: absolute; top: 20px; right: -13px; z-index: 1; background-size: contain; background-repeat: no-repeat; font-size: 15px; font-family: var(--mon); color: var(--blanco); padding: 8px 20px; font-weight: 300; transform: scale(0.95); -webkit-transform: scale(0.95); -moz-transform: scale(0.95); -ms-transform: scale(0.95); -o-transform: scale(0.95); }
.cotizador .lotePrincipal img,
.cotizador .lotePrincipal svg {width: 100%; max-width: 900px}
.cotizador .lotePrincipal svg path,
.cotizador .lotePrincipal svg polygon,
.cotizador .lotePrincipal svg rect {cursor: pointer;}
.cotizador .lotePrincipal svg .seleccion {fill: #209bffa1 ! important; stroke: #209bff !important}
.cotizador .lotePrincipal svg#cittadela {background: url(../img/lotificacion/svg/bg-cittadela.png) no-repeat center; background-size: contain; }
.cotizador .lotePrincipal svg#andra {background-image: url(../img/lotificacion/svg/bg-andra.png); background-size: contain; background-position: center; background-repeat: no-repeat; background-color: #efefef; background-blend-mode: multiply;}
.cotizador .lotePrincipal svg#greta {background-image: url(../img/lotificacion/svg/bg-greta1.png); background-size: contain; background-position: center; background-repeat: no-repeat; background-color: #efefef; background-blend-mode: multiply;}
.cotizador .lotePrincipal svg#villas-e {background-image: url(../img/lotificacion/svg/bg-villas-e1.png); background-size: contain; background-position: center; background-repeat: no-repeat; background-color: #efefef; background-blend-mode: multiply;}
.cotizador .lotePrincipal svg#vera {background-image: url(../img/lotificacion/svg/bg-vera.png); background-repeat: no-repeat; background-position: left -0.5px; background-size: contain; }
.cotizador .lotePrincipal svg#aurora {background-image: url(../img/lotificacion/svg/bg-aurora.jpg); background-repeat: no-repeat; background-position: left -0.5px; background-size: contain; }
.cotizador .lotePrincipal svg#amaraTorreP {background-image: url(../img/lotificacion/svg/bg-amara.png); background-repeat: no-repeat; background-position: left -0.5px; background-size: contain; }
.cotizador .lotePrincipal svg#amaraTorreA {background-image: url(../img/lotificacion/svg/bg-amara2.jpg); background-repeat: no-repeat; background-position: left -0.5px; background-size: contain; }
.cotizador .lotePrincipal svg#amaraTorreB {background-image: url(../img/lotificacion/svg/bg-amara3.jpg); background-repeat: no-repeat; background-position: left -0.5px; background-size: contain; }
.cotizador .lotePrincipal svg#carolaTorreA{background-image: url(../img/lotificacion/svg/bg-carola.jpg); background-repeat: no-repeat; background-position: left -0.5px; background-size: contain; }
.cotizador .lotePrincipal svg#carolaTorreB {background-image: url(../img/lotificacion/svg/bg-carola2.jpg); background-repeat: no-repeat; background-position: left -0.5px; background-size: contain; }
.cotizador .lotePrincipal svg#carolaTorreC {background-image: url(../img/lotificacion/svg/bg-carola3.jpg); background-repeat: no-repeat; background-position: left -0.5px; background-size: contain; }
.cotizador .lotePrincipal svg#amalia {background-image: url(../img/lotificacion/svg/bg-amalia.png); background-size: contain; background-position: center; background-repeat: no-repeat; background-color: #efefef; background-blend-mode: multiply; max-width: 740px}
.cotizador .lotePrincipal svg#loreto {background-image: url(../img/lotificacion/svg/bg-loreto.png); background-size: contain; background-position: center; background-repeat: no-repeat; background-color: #efefef; background-blend-mode: multiply; max-width: 100%}
.cotizador .loteIndividual img {width: 100%; max-width: 500px; max-height: 500px}
.cotizador .loteIndividual-amara img {width: 100%;height: 100%;}
.cotizador .loteIndividual-loreto img {width: 90%;height: auto;}
.cotizador .loteIndividual-greta img {height: auto;}
.cotizador .cont-info-price {min-height: 80px}
.cotizador .bg-cotizador {background-color: #efefef; text-align: center; height: 100%; width:100%; }
/* .cotizador .bg-cotizador {background: url(../img/bg-cotizador.png) center; text-align: center; height: 100%; width:100%; } */
.cotizador .bg-cotizador .centrar {height: 100%;}
/* .cotizador .bg-cotizador img {width: 100%; max-width: 900px;} */
.cotizador .info {padding: 50px 15px}
.cotizador .info .line {position: relative; margin-bottom: 80px}
.cotizador .info .line::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -40px; left: 0;}
.cotizador .info .tlo {font-family: var(--mon); color: var(--osc); font-size: 25px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase; }
.cotizador .info .subtlo {font-family: var(--mon); font-size: 20px; font-weight: 900; letter-spacing: 0.7px; color: var(--negro); text-transform: uppercase; margin-bottom: 10px}
.cotizador .info .p {font-size: 15px; font-weight: 300; line-height: 1.6;}
.cotizador .info .pmon {font-size: 15px; font-weight: 300; line-height: 1.6; font-family: var(--mon)}
.cotizador .info .p span:not(.ns) {font-weight: 500}
.cotizador ul.leyenda {padding: 0px; margin: 0px; list-style: none; margin-bottom: 80px}
.cotizador ul.leyenda li {font-size: 15px; font-weight: 300; line-height: 1.6; padding-left: 30px; position: relative;}
.cotizador ul.leyenda li::before {content: ""; width: 14px; height: 14px; position: absolute; top: 5px; left: 0;}
.cotizador ul.leyenda li:nth-child(1)::before {background: var(--blanco); border: 1px solid var(--negro)}
.cotizador ul.leyenda li:nth-child(2)::before {background: #f5a623}
.cotizador ul.leyenda li:nth-child(3)::before {background: #e13153}
.cotizador .info label {font-family: var(--mon); font-weight: 400; color: var(--osc); line-height: 1.68; width: 60px}
.cotizador .info label.xl {width: 100%;}
.cotizador .info select,
.cotizador .info input {width: calc(100% - 80px); border: none; border-bottom: 1px solid #D8D8D8; color: #8C8C8C; font-size: 17px; font-family: var(--mon); font-weight: 600; max-width: 205px}
.cotizador .info input[disabled],
.cotizador .info input:disabled {color: var(--osc);}
.cotizador .info select {-webkit-appearance: none;-moz-appearance: none;appearance: none; border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; background: transparent url(../img/caret-gris.png) no-repeat 100%; }
.cotizador .info textarea {font-family: var(--mon); font-size: 15px; font-weight: 300; line-height: 1.53; letter-spacing: 0.5px; width: 100%; height: 205px; resize: none; background: none; border: none; color: #8C8C8C}
.cotizador .info textarea {line-height: 35px; background-image: -webkit-linear-gradient(top , transparent, transparent 33px, #D8D8D8 0); background-size: 100% 34px;}
.cotizador .btns-navegacion div button {padding: 2px 0px;}
.cotizador .info label.xl + input { display: block; margin: 0 auto}
@media screen and (min-width: 768px) and (max-width: 991px){ .cotizador .info label.xl + input { display: inline-block} }
@media screen and (min-width: 768px) { .cotizador .loteIndividual img {width: auto; } .cotizador .lotePrincipal svg#vera {background-position: left -1.5px;} }
@media screen and (min-width: 992px){
    .cotizador .contenedor.allVendido::before { transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; }
    .cotizador .bg-cotizador { position: absolute; width: calc(100% - 25%); margin-left: 0; margin-right: auto; }
    .cotizador .btns-navegacion div button {margin: 0 auto; margin-bottom: 15px}
}
@media screen and (min-width: 1200px){ .cotizador .btns-navegacion div button {display: inline-block; margin-bottom: 0px} }
@media screen and (min-width: 1400px){ .cotizador .info {padding: 80px 45px} }

.cotizador ul.list-cotizador {padding: 0; margin: 0; list-style: none}
.cotizador ul.list-cotizador li {font-size: 14px; font-weight: 300; line-height: 1.64; color: var(--negro); cursor: pointer;}
.cotizador ul.list-cotizador li.active {font-weight: 700}
.cotizador .panel {-webkit-box-shadow: none;box-shadow: none; margin-bottom: 50px; position: relative;}
.cotizador .panel::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -25px; left: 0px;}
.cotizador .panel:last-child::after {content: none;}
.cotizador .panel-heading {padding: 10px 0px}
.cotizador .panel-title a:hover,
.cotizador .panel-title a:focus,
.cotizador .panel-title a:active,
.cotizador .panel-title a {display: block; text-decoration: none; color: var(--negro); font-family: var(--mon); font-size: 16px; font-weight: 600; letter-spacing: 0.6px; text-transform: uppercase; background: url(../img/caret-negro1.png) no-repeat 100%;}
.cotizador .panel-title a[aria-expanded="true"]{background: url(../img/caret-negro.png) no-repeat 100%;}

.popover {border-radius: 0px; border: none;}
.popover-content {padding-right: 25px;}
.popover-content .content-title {font-family: var(--mon); font-weight: 400; color: var(--osc); margin: 0}
.popover-content .psmall {font-family: var(--mon); font-size: 13px; font-weight: 600; margin-bottom: 10px }
.popover-content .p {font-family: var(--mon); font-size: 15px; font-weight: 300}
.franja-success,
.franja-warning,
.franja-danger {position: absolute; top: 0; right: 0; width: 15px; height: 100%;}
.franja-success {background-color: #00865c }
.franja-warning {background-color: #f5a623 }
.franja-danger {background-color: #e13153 }

.label-success-cotizador {fill: var(--blanco) !important; stroke: var(--negro) !important;}
.label-success-cotizador.transparent {fill: transparent !important; stroke: transparent !important;}
.label-warning-cotizador {fill: #bb89006f !important; stroke: #f5a623 !important;}
#loreto .label-warning-cotizador {fill: #f5a62391 !important;stroke: #bb89006f !important;}
.label-danger-cotizador {fill: #e131547d !important; stroke: #e13153 !important;}

/* NAVEGACION */
.amenidades .navegacion {padding-bottom: 40px; background: var(--bggris)}
.navegacion .card {background: var(--blanco); padding: 10px 50px; font-family: var(--mon); color: var(--osc); -webkit-box-shadow: 0 2px 50px 0 rgba(221, 221, 221, 0.5); box-shadow: 0 2px 50px 0 rgba(221, 221, 221, 0.5); width: 260px; position: relative; margin-bottom: 30px}
.navegacion a:hover,
.navegacion a:focus,
.navegacion a:active {text-decoration: none; color: var(--osc)}
.navegacion .card .tlo { font-size: 12px; font-weight: 400; letter-spacing: 1.4px; text-transform: uppercase;}
.navegacion .card .tlo2 { font-size: 20px; font-weight: 600; letter-spacing: 2.4px; text-transform: uppercase}
.navegacion .card.prev {margin-left: auto; margin-right: auto; text-align: left}
.navegacion .card.next {margin-left: auto; margin-right: auto; text-align: right}
.navegacion .card.prev::after,
.navegacion .card.next::after {content: ""; height: 1px; width: 25px; position: absolute; top: 0; bottom: 0; margin: auto 0; background: var(--osc)}
.navegacion .card.prev::after {left: 0}
.navegacion .card.next::after {right: 0}
@media screen and (min-width: 768px){
    .navegacion .card {margin-bottom: 0px;}
    .navegacion .card.prev {margin-left: 0;}
.navegacion .card.next {margin-right: 0; }
}
@media screen and (min-width: 1200px){
    .navegacion {padding-bottom: 60px; }
}

/* DESARROLLO */
/* PORTADA */
.portada-desarrollo {height: 100vh; width: 100%; position: relative; background: var(--verde); color: var(--crema)}
.portada-desarrollo .tlo {font-family: var(--cor); font-size: 35px; font-weight: 300; line-height: 1.14; text-align: center; position: relative;}
.portada-desarrollo .tlo::before {content: ""; height: 50px; width: 1px; background: var(--crema); position: absolute; bottom: -120px; left: 0; right: 0; margin: 0 auto}
.portada-desarrollo .subtlo {font-size: 18px; text-align: center; position: absolute; bottom: 30px; left: 0; right: 0; margin: 0 auto; text-transform: uppercase}
@media screen and (min-width: 768px){
    .portada-desarrollo .tlo {font-size: 50px;}
}
@media screen and (min-width: 992px){
    .portada-desarrollo .tlo {font-size: 70px;}
}

/* LOGOS */
.body-desarrollo {padding: 60px 0px;}
.body-desarrollo .tlo {font-family: var(--mon); font-size: 20px; font-weight: 400; line-height: 1.68; letter-spacing: 3px; text-align: center; color: var(--osc); text-transform: uppercase; margin-bottom: 60px;}
.body-desarrollo ul.list-logos-desarrollo {padding: 0px; margin: 0px; list-style: none; text-align: center}
.body-desarrollo ul.list-logos-desarrollo li {margin-bottom: 30px}
.body-desarrollo ul.list-logos-desarrollo li img {margin-bottom: 30px;}
.body-desarrollo ul.list-logos-desarrollo li .p {cursor: default}
.body-desarrollo ul.list-logos-desarrollo li .p,
.body-desarrollo ul.list-logos-desarrollo li a:hover,
.body-desarrollo ul.list-logos-desarrollo li a:active,
.body-desarrollo ul.list-logos-desarrollo li a:focus,
.body-desarrollo ul.list-logos-desarrollo li a {font-family: var(--mon); font-size: 15px; font-weight: 600; letter-spacing: 0.8px; text-align: center; color: var(--negro); text-transform: uppercase; text-decoration: none; position: relative}
.body-desarrollo ul.list-logos-desarrollo li .p::after,
.body-desarrollo ul.list-logos-desarrollo li a::after {content: ""; width: 13px; height: 2px; background-color: var(--negro); position: absolute; bottom: -5px; left: 0; right: 0; margin: 0 auto;}
@media screen and (min-width: 768px){
    .body-desarrollo ul.list-logos-desarrollo li {display: inline-block; margin-right: 30px}
}
@media screen and (min-width: 992px){
    .body-desarrollo .tlo {font-size: 25px; }
    .body-desarrollo ul.list-logos-desarrollo li {margin-right: 100px}
    .body-desarrollo ul.list-logos-desarrollo li:last-child {margin-right: 0px;}
}

/* MENU LOGOS */
ul.nav-tabs-logos {border: none; text-align: center; padding-top: 60px}
ul.nav-tabs-logos li { float: none; display: inline-block; min-width: 160px; background: var(--bggris); border: 1px solid var(--negro); margin-right: 15px; transition: all 500ms ease; -webkit-transition: all 500ms ease; -moz-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; }
ul.nav-tabs-logos li:last-child {margin-right: 0px;}
ul.nav-tabs-logos li a {padding: 4px; font-family: var(--mon); font-size: 13px; font-weight: 600; letter-spacing: 0.7px; text-align: center; color: var(--negro); background: none; text-transform: uppercase}
ul.nav-tabs-logos li.active:hover,
ul.nav-tabs-logos li.active:active,
ul.nav-tabs-logos li.active:focus,
ul.nav-tabs-logos li.active {background: var(--negro)}
ul.nav-tabs-logos li.active a:hover,
ul.nav-tabs-logos li.active a:active,
ul.nav-tabs-logos li.active a:focus,
ul.nav-tabs-logos li.active a { color: var(--blanco); background: none; border: none; cursor: pointer; border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; font-weight: 400}

.nav-tabs-logos-movil {width: 100%; max-width: 360px; margin: 0 auto; margin-bottom: 30px;}
.nav-tabs-logos-movil button {height: 30px; border: 1px solid var(--negro); background: transparent; width: 100%; text-transform: uppercase; font-family: var(--mon); font-size: 15px; font-weight: 600; letter-spacing: 0.7px;}
.nav-tabs-logos-movil .dropdown-menu {width: 100%; margin: 0; border-radius: 0px; border: none;}
.nav-tabs-logos-movil .dropdown-menu li { text-transform: uppercase; font-family: var(--mon); font-size: 15px; font-weight: 600; letter-spacing: 0.7px;}
.nav-tabs-logos-movil .dropdown-menu>.active>a,
.nav-tabs-logos-movil .dropdown-menu>.active>a:hover,
.nav-tabs-logos-movil .dropdown-menu>.active>a:focus {background: var(--negro); font-weight: 400}
@media screen and (max-width: 767px){
    ul.nav-tabs-logos {display: none}
}
@media screen and (min-width: 768px){
    .nav-tabs-logos-movil {display: none}
}
@media screen and (min-width: 992px){
    ul.nav-tabs-logos li { min-width: 205px; margin-right: 30px;}
    ul.nav-tabs-logos li a {font-size: 15px;}
}

.amenidades-desarrollo {padding: 60px 0px}
.amenidades-desarrollo .cont {position: relative;}
.amenidades-desarrollo .tlo {font-family: var(--mon); color: var(--osc); font-size: 25px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 50px; position: relative}
.amenidades-desarrollo .tlo::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -25px; left: 0px;}
.amenidades-desarrollo .subtlo {font-size: 17px; font-weight: 300; line-height: 1.41; color: #868686;}
.amenidades-desarrollo .info {background: var(--blanco); padding: 45px 15px; min-height: 820px}
.amenidades-desarrollo .info ul.list-amenidades {padding: 0; margin: 0; list-style: none}
.amenidades-desarrollo .info ul.list-amenidades li {font-size: 14px; font-weight: 300; line-height: 1.64; color: var(--negro); cursor: pointer;}
.amenidades-desarrollo .info ul.list-amenidades li.active {font-weight: 700}
.amenidades-desarrollo .info .panel {-webkit-box-shadow: none;box-shadow: none; margin-bottom: 50px; position: relative;}
.amenidades-desarrollo .info .panel::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -25px; left: 0px;}
.amenidades-desarrollo .info .panel:last-child::after {content: none;}
.amenidades-desarrollo .info .panel-heading {padding: 10px 0px}
.amenidades-desarrollo .info .panel-title a:hover,
.amenidades-desarrollo .info .panel-title a:focus,
.amenidades-desarrollo .info .panel-title a:active,
.amenidades-desarrollo .info .panel-title a {display: block; text-decoration: none; color: var(--negro); font-family: var(--mon); font-size: 16px; font-weight: 600; letter-spacing: 0.6px; text-transform: uppercase; background: url(../img/caret-negro.png) no-repeat 100%;}
.panel-group .panel-heading+.panel-collapse>.panel-body,
.panel-group .panel-heading+.panel-collapse>.list-group {border: none}
.panel-group .panel-heading+.panel-collapse>.panel-body {padding: 0px}
.amenidades-desarrollo .mapa {width: 100%; height: auto; background: var(--bggrisOsc)}
.amenidades-desarrollo .mapa img {max-width: 804px; width: 100%}
@media screen and (min-width: 992px){
    .amenidades-desarrollo .info {padding: 60px 45px;}
    .amenidades-desarrollo .mapa {position: absolute; top: 0px; right: 0px; width: calc(100% - 33.33%); height: 100%; margin-right: 0; margin-left: auto;}
}


.urbanismo .row {background: var(--blanco); padding: 45px 15px}
.urbanismo .tlo {font-family: var(--mon); color: var(--osc); font-size: 25px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 50px; position: relative}
.urbanismo .tlo::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -25px; left: 0px;}
.urbanismo .p {font-size: 14px; font-weight: 300; line-height: 1.64; color: var(--negro);}
.urbanismo .p span { font-weight: 700;}
.urbanismo #circle_progress {width: 250px; height: 250px; position: relative; margin: 0 auto}
.urbanismo #circle_progress .progressbar-text {font-size: 13px; width: 230px}
@media screen and (min-width: 768px){
    .urbanismo #circle_progress {width: 350px; height: 350px; position: relative; margin: 0 auto}
    .urbanismo #circle_progress .progressbar-text {font-size: 16px; width: 300px}
}
@media screen and (min-width: 992px){
    .urbanismo {padding: 60px 0px}
}
@media screen and (min-width: 1200px){
    .urbanismo .row {padding: 60px 45px}
}

ul.list-principio {padding: 0; margin: 0;}
ul.list-principio li { height: 35px; width: 35px; display: inline-block; margin-right: 10px; font-family: var(--mon); font-size: 20px; font-weight: 400; text-align: center; color: var(--osc); border: 1px solid var(--osc); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; cursor: pointer; transition: 300ms all ease; -webkit-transition: 300ms all ease; -moz-transition: 300ms all ease; -ms-transition: 300ms all ease; -o-transition: 300ms all ease; padding: 3px; margin-bottom: 20px}
ul.list-principio li:last-child {margin-right: 0px;}
ul.list-principio li.active {background: var(--osc); color: var(--blanco);}
@media screen and (min-width: 992px) and (max-width: 1199px){
    ul.list-principio li { height: 30px; width: 30px; font-size: 16px}
}

.portada.piscina {height: 450px; width: 100%; position: relative; background-image: url(../img/bg-amenidades-casa-club02.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; color: var(--blanco)}
.portada.piscina .tlo {font-family: var(--mon); font-size: 25px; font-weight: 400; line-height: 1.68; letter-spacing: 3px; text-align: center; text-transform: uppercase; position: relative;}
.portada.piscina .tlo::after {content: ""; width: 1px; height: 50px; background: var(--blanco); position: absolute; bottom: -120px; left: 0px; right: 0; margin: 0 auto}
.portada.piscina .subtlo {font-size: 18px; text-align: center; position: absolute; top: 30px; left: 0; right: 0; margin: 0 auto; text-transform: uppercase}
.portada.piscina .subtlo img {display: block; margin: 0 auto; margin-top: 40px; }
@media screen and (min-width: 768px){
    .portada.piscina {height: 700px; background-position: center;}
    .portada.piscina .subtlo img { margin-top: 80px; }
}

.galeria-cb {padding: 60px 0px}
.galeria-cb .tlo {font-family: var(--mon); color: var(--osc); font-size: 25px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 50px; position: relative; text-align: center}
.galeria-cb .tlo::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -25px; left: 0px; right: 0; margin: 0 auto}
.galeria-cb .grid-sizer,
.galeria-cb .grid-item { width: 45%; }
.galeria-cb .grid-item { margin-bottom: 30px; }
.galeria-cb .degradado {cursor: pointer}
.galeria-cb .grid-item .degradado::before {content: ""; height: 100%; width: 100%; background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0))); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); position: absolute; top: 0; left: 0;}
.galeria-cb .grid-item img {width: 100%}
.galeria-cb .grid-item .info {position: absolute; bottom: 10px; width: 95%; left: 0; right: 0; margin: 0 auto}
.galeria-cb .grid-item .info .subtlo,
.galeria-cb .grid-item .info .expand {display: inline-block}
.galeria-cb .grid-item .info .subtlo {width: calc(100% - 26px); font-family: var(--mon); font-size: 12px; font-weight: 400; line-height: 3.5; letter-spacing: 1.8px; color: var(--blanco); text-transform: uppercase}
.galeria-cb .grid-item .info .expand {width: 20px; text-align: center}
.galeria-cb .grid-item .info .expand img {width: 15px; cursor: pointer;}
@media screen and (min-width: 768px){
    .galeria-cb .grid-sizer,
    .galeria-cb .grid-item { width: 48%; }
}
@media screen and (min-width: 992px){
    .galeria-cb .grid-sizer,
    .galeria-cb .grid-item { width: 31%; }
}


.cotizador_casa_club {padding: 60px 0px}
.cotizador_casa_club .row {background: var(--blanco)}
.cotizador_casa_club .info { padding: 45px 15px}
.cotizador_casa_club .mapa img {width: 100%; max-height: 500px;}
.cotizador_casa_club .mapa {background: #efefef; text-align: center}
.cotizador_casa_club .tlo {font-family: var(--mon); color: var(--osc); font-size: 25px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 50px; position: relative;}
.cotizador_casa_club .tlo::after {content: ""; width: 50px; height: 1px; background: var(--gris); position: absolute; bottom: -25px; left: 0px;}
.cotizador_casa_club .p {font-size: 14px; font-weight: 300; line-height: 1.64; color: var(--negro);}
@media screen and (min-width: 768px){
    .cotizador_casa_club .mapa {height: 600px;}
    .cotizador_casa_club .mapa img {width: auto; }
}
@media screen and (min-width: 992px){
    .cotizador_casa_club .info { padding: 50px}
    .cotizador_casa_club .info {height: 600px;}
}


ul.list-plantas-casa {padding: 0px; margin: 0; list-style: none; display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 360px;}
ul.list-plantas-casa li {margin-right: 5px; font-family: var(--mon); font-size: 15px; font-weight: 400; letter-spacing: 0.7px; text-align: center; color: var(--negro); text-transform: uppercase; padding: 5px 10px; width: 155px; height: 32px; border: 1px solid var(--negro); transition: 500ms all ease; -webkit-transition: 500ms all ease; -moz-transition: 500ms all ease; -ms-transition: 500ms all ease; -o-transition: 500ms all ease; cursor: pointer; margin-bottom:20px}
/* ul.list-plantas-casa li:last-child {margin-right: 0px;} */
ul.list-plantas-casa li.active {font-weight: 300; color: var(--blanco); background: var(--negro)}



.portada.proceso {height: 520px; width: 100%; position: relative; background: #35635f; color: var(--crema)}
.portada.proceso.verde {background: #0C2923;}


.controles-proceso {padding-top: 60px; padding-bottom: 20px;}
.controles-proceso .contenedor {padding: 20px 0px;}
.controles-proceso .contenedor:not(:last-child) {border-bottom: 1px solid #d9d9d9;}
.controles-proceso ul.controls-years,
.controles-proceso ul.controls-type {padding: 0; margin: 0; text-align: center}
.controles-proceso ul.controls-type {position: relative; margin-bottom: 30px;}
.controles-proceso ul.controls-type::after {content: ""; width: 50px; height: 1px; position: absolute; bottom: -15px; right: 0; left: 0; margin: 0 auto; background: #d9d9d9}
.controles-proceso ul.controls-type li a,
.controles-proceso ul.controls-years li a{color: inherit; text-decoration: none}
.controles-proceso ul.controls-years li,
.controles-proceso ul.controls-type li { display: inline-block; margin-right: 25px; font-family: var(--mon); font-size: 15px; font-weight: 400; letter-spacing: 0.7px; text-align: center; color: var(--negro); text-transform: uppercase; padding: 5px 10px; width: 100px; height: 30px; border: 1px solid var(--negro); transition: 500ms all ease; -webkit-transition: 500ms all ease; -moz-transition: 500ms all ease; -ms-transition: 500ms all ease; -o-transition: 500ms all ease; cursor: pointer;}
.controles-proceso ul.controls-years li:last-child,
.controles-proceso ul.controls-type li:last-child {margin-right: 0px;}
.controles-proceso ul.controls-years li.active,
.controles-proceso ul.controls-type li.active {font-weight: 300; color: var(--blanco); background: var(--negro)}
.controles-proceso ul.controls-month {padding: 0px; margin: 0px; text-align: center}
.controles-proceso ul.controls-month li { display: inline-block; font-family: var(--mon); font-size: 12px; font-weight: 600; letter-spacing: 0.5px; text-align: center; color: #adadad; text-transform: uppercase; transition: 500ms color ease; -webkit-transition: 500ms color ease; -moz-transition: 500ms color ease; -ms-transition: 500ms color ease; -o-transition: 500ms color ease;  margin-right: 19px; cursor: pointer; }
.controles-proceso ul.controls-month li:last-child {margin: 0px}
.controles-proceso ul.controls-month li.active {color: #35635f;}
.controles-proceso ul.dropdown-menu.menu-tabs li { display: block; margin-right: 0px; width: 100%; height: 30px; border:none; transition: none; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; cursor: pointer;}
.controles-proceso ul.dropdown-menu.menu-tabs li.active { color: var(--blanco); background-color: #35635f}
@media screen and (max-width: 991px){
    .controles-proceso .destk {display: none;}
}
@media screen and (min-width: 992px){
    .nav-tabs-years-movil {display: none}
    .controles-proceso ul.controls-years,
    .controles-proceso ul.controls-type {padding: 0; margin: 0; display: inline-block; text-align: initial}
    .controles-proceso ul.controls-type {margin-bottom: 0px; margin-right: 85px}
    .controles-proceso ul.controls-type::after {content: ""; width: 1px; height: 100%; bottom: initial; top: 0px; right: -42.5px; left: initial; }
}
@media screen and (min-width: 1200px){
    .controles-proceso ul.controls-month li {font-size: 13px; margin-right: 30px}
}
@media screen and (min-width: 1400px){
    .controles-proceso ul.controls-month li {margin-right: 49px}
}


.nav-tabs-years-movil {width: 100%; max-width: 250px; margin: 0 auto; margin-bottom: 30px;}
.nav-tabs-years-movil button {height: 30px; border: 1px solid var(--negro); background: transparent; width: 100%; text-transform: uppercase; font-family: var(--mon); font-size: 15px; font-weight: 600; letter-spacing: 0.7px;}
.nav-tabs-years-movil .dropdown-menu {width: 100%; margin: 0; border-radius: 0px; border: none;}
.nav-tabs-years-movil .dropdown-menu li a:hover,
.nav-tabs-years-movil .dropdown-menu li a:active,
.nav-tabs-years-movil .dropdown-menu li a:focus,
.nav-tabs-years-movil .dropdown-menu li a {color: inherit; text-decoration: none; background-color: transparent;}
.nav-tabs-years-movil .dropdown-menu li { text-transform: uppercase; font-family: var(--mon); font-size: 15px; font-weight: 600; letter-spacing: 0.7px; padding: 5px 15px}
.nav-tabs-years-movil .dropdown-menu li.active,
.nav-tabs-years-movil .dropdown-menu li:hover,
.nav-tabs-years-movil .dropdown-menu li:focus {background: var(--negro); font-weight: 400; color: var(--blanco)}

.galeria-cb.obra .tlo { font-family: var(--mon); font-size: 20px; font-weight: 600; letter-spacing: 0.7px; color: var(--negro); text-align: left; }
.galeria-cb.obra .tlo::after {left: 0; right: initial; margin: 0;}
.galeria-cb.obra .cont-month {padding: 40px 0px}


.container-flex {display: flex; flex-wrap: wrap; flex-direction: column;}
.container-flex .item { margin-bottom: 10px; background-color: var(--verde); height: 320px; background-size: cover; background-position: center; box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15); position: relative; transition: all 300ms; -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; -o-transition: all 300ms; }
.container-flex .item.degradado::before {content: ""; height: 100%; width: 100%; background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0))); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); position: absolute; top: 0; left: 0; background-position: center; background-repeat: no-repeat}
.container-flex .item.degradado.video::before {background-image:url(../img/icon-play.svg), -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0))); background-image: url(../img/icon-play.svg), linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));}
.container-flex .item .info {position: absolute; bottom: 10px; width: 95%; left: 0; right: 0; margin: 0 auto}
.container-flex .item .info .subtlo,
.container-flex .item .info .expand {display: inline-block}
.container-flex .item .info .subtlo {width: calc(100% - 26px); font-family: var(--mon); font-size: 12px; font-weight: 400; line-height: 3.5; letter-spacing: 1.8px; color: var(--blanco); text-transform: uppercase}
.container-flex .item .info .expand {width: 20px; text-align: center}
.container-flex .item .info .expand img {width: 15px; cursor: pointer;}
@media screen and (max-width: 767px){
    .container-flex .item { width: 100%;}
}
@media screen and (min-width: 768px){
    .container-flex .item {margin: 10px}
    .container-flex.full-item,
    .container-flex.doble-item {flex-direction: row}
    .container-flex.full-item .item {width: 100%; height: 660px;}
    .container-flex.doble-item .item {width: 47%; height: 660px;}
}
@media screen and (min-width: 768px) and (max-width: 1199px){
    .container-flex {max-height: 1400px; flex-direction: row}
    .container-flex .item {width: 47%;}
    .container-flex .item:nth-child(3) {background-color: var(--naranja); height: 660px;}
    .container-flex .item:nth-child(4) {background-color: var(--naranja); height: 660px;}
}
@media screen and (min-width: 1200px){
    .container-flex {max-height: 900px}
    .container-flex .item:nth-child(3n) {background-color: var(--naranja); height: 660px;}
    .container-flex.doble-item .item {width: 48%;}
}
@media screen and (min-width: 1650px){
    .container-flex.doble-item .item {width: 48.7%;}
}

.proceso-definitivo {padding: 40px 0px; text-align: center}
.proceso-definitivo .contenedor {overflow: scroll}
.proceso-definitivo .card {background: var(--blanco); min-width: 1250px}
.proceso-definitivo .card .tlo { font-family: var(--mon); color: var(--osc); font-size: 25px; line-height: 1.68; letter-spacing: 3px; text-transform: uppercase;}
.proceso-definitivo .card .listado {padding: 45px; padding-right: 20px;}
.proceso-definitivo .card ul {list-style: none; padding: 0px; text-align: left; }
.proceso-definitivo .card ul li {font-size: 12px; font-weight: 300; line-height: 1.83; color: var(--negro); height: 24px; border-bottom: 1px solid #f2f2f2; padding-top: 2px}
.proceso-definitivo .card ul li:first-child { border-top: 1px solid #f2f2f2;}
.proceso-definitivo .card ul li:last-child {position: relative; padding-right: 28px}
.proceso-definitivo .card ul li:last-child::after {content: ""; width: 26px; height: 24px; background-color: #d09600; position: absolute; top: 0; right: 0;}
.proceso-definitivo table {width: 100%; margin-top: 65px}
.proceso-definitivo table th { border-bottom: 1px solid #f2f2f2; padding: 15px 10px; text-align: center; border-right: 1px solid #f2f2f2; font-size: 15px; font-weight: 300; color: var(--negro);}
.proceso-definitivo table th:last-child {border-right: none}
.proceso-definitivo table td {height: 24px; border-bottom: 1px solid #f2f2f2; border-right: 1px solid #f2f2f2;}
.proceso-definitivo table td:last-child {border-right: none}
.proceso-definitivo table td.active-verde {background: #35635f; border-right: none}
.proceso-definitivo table td.active-amarillo {background: #d09600; border-right: none}
.proceso-definitivo .cont-years {display: table; height: 889px;}
.proceso-definitivo .cont-years .years {display: table-cell; vertical-align: middle; border-right: 1px solid #f2f2f2; cursor: pointer;}
.proceso-definitivo .cont-years .years div { transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); font-family: var(--mon); font-size: 18px; line-height: 2.33; letter-spacing: 2.2px; text-align: center; color: var(--osc);}
.proceso-definitivo .cont-years .years.active {background: var(--negro)}
.proceso-definitivo .cont-years .years.active div {color: var(--blanco); font-weight: 300}

.bar-wrapper {pointer-events: none;}

.ubicacion {padding-top: 135px; height: calc(100vh - 193px); min-height: 600px; position: relative;}
.ubicacion::before {content: ""; width: 100%; height: 135px; background: var(--verde); position: absolute; top: 0px; left: 0;}
.ubicacion #mapa {height: 100%; width: 100%;}
.ubicacion .btn-maps {position: absolute; bottom: 20px; left: 0; right: 0; margin: 0 auto; z-index: 50; width: 100%; text-align: center}
.ubicacion .btn-maps a {text-decoration: none;}
.ubicacion .btn-maps a button {display: inline-block}



.contacto {padding-top:120px; background-image: -webkit-gradient(linear, left bottom, left top, from(#153e35), color-stop(45%, rgba(21, 62, 53, 0)), to(#153e35)); background-image: linear-gradient(to top, #153e35, rgba(21, 62, 53, 0) 45%, #153e35); position: relative;}
.contacto::before {content: ""; height: 100%; width: 100%; background: var(--verde) url(../img/bg-contacto.png) no-repeat center; background-size: cover; background-blend-mode: multiply; position: absolute; top: 0; left: 0; z-index: -1;}
.contacto .informacion { background: none}

/* BLOG */
.portada.blog {height: 360px; width: 100%; position: relative; background: var(--verde); color: var(--crema)}
@media screen and (min-width: 768px){
    .portada.blog {height: 520px}
}

/* BUSCADOR */
.busc .conten {width: 100%; max-width: 360px; position: relative; margin: 0 auto;}
.busc input {width: 100%; max-width: 360px; height: 30px; padding: 5px 10px; padding-right: 15px; font-family: var(--mon); font-size: 15px; letter-spacing: 0.5px; color: var(--gris); border: none; border-bottom: solid 1px var(--gris);}
.busc input::-webkit-input-placeholder {color: var(--verdeOsc)}
.busc input:-ms-input-placeholder {color: var(--verdeOsc)}
.busc input::-ms-input-placeholder {color: var(--verdeOsc)}
.busc input::placeholder {color: var(--verdeOsc)}
.busc i {position: absolute; top: 8px; right: 10px; cursor: pointer; color: var(--verdeOsc)}
@media screen and (min-width: 768px){
    .busc .conten {margin-left:auto; margin-right: 0}
}

/* CATEGORIAS */
ul.categorias {padding: 0; margin: 0; list-style: none; margin-bottom: 40px}
ul.categorias.inline {padding-left: 15px }
ul.categorias.inline li {display: inline-block; margin-right: 20px}
ul.categorias.inline li:last-child {margin-right: 0px}
ul.categorias li,
ul.categorias li a:hover,
ul.categorias li a:active,
ul.categorias li a:focus,
ul.categorias li a {font-family: var(--mon); font-size: 15px; font-weight: 400; letter-spacing: 0.54px; color: #8e8e8e; text-decoration: none}
ul.categorias li.active a,
ul.categorias li.active a:hover,
ul.categorias li.active a:active,
ul.categorias li.active a:focus {text-decoration: underline; font-weight: 600; color: var(--negro)}
@media screen and (max-width: 767px){
    ul.categorias.inline {display: none;}
}

.categoria-OnlyMovil .dropdown {width: 100%; max-width: 360px; height: 40px; margin: 30px auto;}
.categoria-OnlyMovil button[data-toggle="dropdown"] {width: 100%; height: 100%; border: 1px solid var(--osc); background: var(--blanco) url(../img/caret-negro.png) 95% no-repeat; padding-right: 25px; font-family: var(--mon); font-size: 14px}
.categoria-OnlyMovil button span {opacity: 0;}
.categoria-OnlyMovil .dropdown-menu {width: 100%; border: none; border-radius: 0px; margin: 0px; border-left: 1px solid var(--osc); border-right: 1px solid var(--osc); border-bottom: 1px solid var(--osc); font-size: 16px; font-family: var(--mon); padding: 0px;}
.categoria-OnlyMovil .dropdown-menu > li > a:hover {background-color: var(--osc); color: var(--blanco)}
.categoria-OnlyMovil .dropdown-menu > li > a {padding: 8px 20px}
@media screen and (min-width: 768px){
    .categoria-OnlyMovil {display: none}
}

.list-blog {padding: 60px 0px}
.list-blog .bg {height: 300px; width: 100%}
.list-blog .tloM {font-family: var(--mon); font-size: 25px; font-weight: 400; line-height: 1.68; letter-spacing: 3px; text-align: center; color: var(--osc); text-transform: uppercase; margin-bottom: 60px;}
.list-blog .tlo {font-family: var(--mon); font-size: 15px; text-transform: uppercase; font-weight: 600; letter-spacing: 0.54px; color: var(--osc)}
.list-blog .subtlo {font-family: var(--mon); font-size: 12px; text-transform: uppercase; font-weight: 600; letter-spacing: 0.54px; color: #ADADAD}
.list-blog .p {font-family: var(--mon); font-size: 12px; font-weight: 400; letter-spacing: 0.54px; color: var(--negro)}
.list-blog a:hover,
.list-blog a:active,
.list-blog a:focus,
.list-blog a {text-decoration: none;}
.list-blog .card-blog {margin-bottom: 30px}
@media screen and (min-width: 768px){
    .list-blog .card-blog {min-height: 550px; margin-bottom: 0px}
}
@media screen and (min-width: 1200px){
    .list-blog .bg {height: 350px;}
    .list-blog .card-blog {margin-bottom: 30px}
}


/* PAGINADOR */
ul.paginador{ padding-left:0px; text-align:center; -webkit-column-count:1; column-count:1; padding-top:0px; margin-bottom: 22px}
ul.paginador li{list-style-type:none; display: inline-block; margin-left:10px}
ul.paginador li:not(.nr) { height: 30px; width: 30px; border: 1px solid var(--negro); padding: 3px 0px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
ul.paginador li.active { background: var(--negro);}
ul.paginador li.active a { color: var(--blanco)}
ul.paginador li a { font-family: var(--mon); font-size: 15px; font-weight: 400; color: var(--negro); text-decoration:none; }
ul.paginador li:not(.nr) a { padding: 5px 10px}
ul.paginador li a:hover {text-decoration:none;}

/* DETALLE BLOG */
.detalle-blog {padding: 0px; padding-bottom: 60px}
.detalle-blog .contenedor {width: 100%;}
.detalle-blog .bg {background-size: cover; height: 400px;}
.detalle-blog .det {padding: 40px 15px}
.detalle-blog .det .tlo {font-family: var(--mon); font-size: 25px; text-transform: uppercase; font-weight: 600; letter-spacing: 0.54px; color: var(--osc); text-align: center}
.detalle-blog .det .subtlo {font-family: var(--mon); font-size: 15px; text-transform: uppercase; font-weight: 400; letter-spacing: 0.54px; color: #adadad; text-align: center}
.detalle-blog .det .line {margin-bottom: 80px; position: relative;}
.detalle-blog .det .line::after {content: ""; width: 50px; height: 1px; position: absolute; bottom: -40px; left: 0; right: 0; margin: 0 auto; background: #adadad}
.detalle-blog .det .descripcion img {width: 100% !important; margin-top: 30px;}
.detalle-blog .det .descripcion p {margin-bottom: 30px !important}
.detalle-blog .det .descripcion *,
.detalle-blog .det .descripcion {font-family: var(--mon) !important; font-size: 13px !important; font-weight: 400;  color: var(--osc) !important; text-align: center}
.detalle-blog .det .descripcion p b {font-weight: 600}
.detalle-blog .det .descripcion {width: 100%; max-width: 950px; margin: 0 auto}
.detalle-blog .grid-sizer,
.detalle-blog .grid-item { width: 33%; }
.detalle-blog .grid-item .degradado::before {content: ""; height: 100%; width: 100%; background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0))); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); position: absolute; top: 0; left: 0;}
.detalle-blog .mosaic img {cursor: pointer;}
.detalle-blog .grid-item img {width: 100%; cursor: pointer;}
@media screen and (min-width: 768px){
    .detalle-blog .bg {height: 450px;}
    .detalle-blog .det .tlo {font-size: 30px}
    .detalle-blog .det .descripcion *,
    .detalle-blog .det .descripcion {font-size: 15px !important;}
}
@media screen and (min-width: 992px){
    .detalle-blog {padding: 60px 0px;}
    .detalle-blog .det {padding: 80px 0px}
    .detalle-blog .bg {height: 700px;}
}

hr {width: 95%; max-width: 1600px}
