@charset "UTF-8";

.color2 {
color: #ac7b31;
}
@font-face {
font-family: "algha";
src: url(//theorigin-villasibiza.com/wp-content/themes/the-origin/assets/fonts/Algha.ttf) format("truetype");
font-weight: normal;
font-style: normal;
}
body {
font-family: "Roboto", sans-serif !important;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
font-variation-settings: "wdth" 100;
overflow-x: hidden;
}
.post, .page {
margin: 0 !important;
}
main {
position: relative;
height: 100vh;
}
a {
font-weight: 500;
transition: all 0.5s ease;
}
a i.bi-box-arrow-down {
color: #066689;
}
h1 {
font-family: "algha", sans-serif;
font-weight: normal;
font-style: normal;
}
h2 {
font-family: "algha", sans-serif;
font-weight: normal;
font-style: normal;
font-size: 2.7rem;
}
h2.featured {
font-size: 2.6rem;
font-style: italic;
}
h2 span {
color: #066689;
font-style: normal;
}
h2 p {
margin-bottom: 0 !important;
}
h3 {
font-family: "algha", sans-serif;
font-weight: normal;
font-style: normal;
font-size: 1.6rem;
color: #25282a;
}
h4 {
font-family: "algha", sans-serif;
font-weight: normal;
font-style: normal;
font-size: 2.2rem;
color: #25282a;
}
.toptitulo {
padding: 5px 15px;
border: 1px solid white;
background-color: #066689;
color: white;
font-weight: 500;
text-transform: uppercase;
display: inline-block;
margin-bottom: 10px;
}
.object-fit-cover {
-o-object-fit: cover;
object-fit: cover;
width: 100%;
} .bg-white {
background-color: #fff;
color: #25282a;
}
.bg-grey {
background-color: #efefef;
color: #25282a;
}
.bg-blue {
background-color: #e4eff5;
color: #25282a;
} .btn {
border-radius: 0;
background-color: #fff;
color: #000;
transition: all 0.5s ease;
vertical-align: inherit;
}
.btn:hover {
background-color: #000;
color: #fff;
}
.btn-primary {
border: 1px solid #066689;
}
.btn-secondary {
background-color: #066689 !important;
border: 1px solid #066689 !important;
border-left: 10px solid #3585a1 !important;
color: white !important;
border-top-left-radius: 15px !important;
border-bottom-right-radius: 15px !important;
width: auto !important;
}
.btn-secondary:visited {
color: white !important;
}
.btn-secondary:hover {
background-color: #fff !important;
color: #066689 !important;
border-color: #066689 !important;
border-left: 10px solid #9ac2d0 !important;
} .full-image-parallax {
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
width: 100%;
height: 100vh;
}
html.is-ios .full-image-parallax {
background-attachment: scroll;
background-position: center center;
background-position-x: 35%;
}
.parallax {
height: 100vh;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
z-index: -1;
} form input[type=text],
form input[type=email] {
border-radius: 0;
border: 1px solid #000;
background-color: white;
margin-bottom: 10px;
width: 300px;
height: 40px;
text-indent: 10px;
}
form input[type=submit] {
text-transform: uppercase;
width: 300px;
height: 40px;
border: 1px solid #000;
margin-bottom: 10px;
}
form a {
color: #ac7b31;
text-decoration: none;
transition: all 0.5s ease;
}
form a:hover {
color: #066689;
text-decoration: underline;
}
.slick-slider {
height: 400px;
}
.slick-slider .slick-slide {
margin-right: 30px;
height: 400px;
}
.slick-slider .slick-slide img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.slick-dots {
bottom: -40px;
}
.slick-dots li.slick-active button:before {
color: #066689;
} .content-info-icons,
.content-info-icons2,
.content-info-icons3 {
height: 40px;
width: 100%;
background-color: #bcdcf1;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
position: relative;
transition: all 0.5s ease;
}
.content-info-icons div.icons,
.content-info-icons2 div.icons,
.content-info-icons3 div.icons {
opacity: 1;
transition: all 0.3s ease;
}
.content-info-icons a,
.content-info-icons2 a,
.content-info-icons3 a {
text-decoration: none;
position: absolute;
right: 10px;
}
.content-info-icons a i,
.content-info-icons2 a i,
.content-info-icons3 a i {
color: #066689;
font-size: 0.9rem;
}
.content-info-icons.open,
.content-info-icons2.open,
.content-info-icons3.open {
height: 200px;
width: 40px;
flex-direction: column;
}
.content-info-icons.open div.icons,
.content-info-icons2.open div.icons,
.content-info-icons3.open div.icons {
margin-right: 0;
height: 20px;
}
.content-info-icons.open a,
.content-info-icons2.open a,
.content-info-icons3.open a {
display: none;
}
.content-info-icons.hidden-icons div.icons,
.content-info-icons2.hidden-icons div.icons,
.content-info-icons3.hidden-icons div.icons {
opacity: 0;
}
.content-info-contenido,
.content-info-contenido2,
.content-info-contenido3 {
display: inline-block;
border-radius: 10px;
background-color: #bcdcf1;
width: 100%;
height: 200px;
margin-left: 5px;
padding: 0px 0 0 20px;
display: flex;
align-items: center;
justify-content: start;
position: relative;
transition: all 0.5s ease;
}
.content-info-contenido ul,
.content-info-contenido2 ul,
.content-info-contenido3 ul {
padding-top: 8px !important;
}
.content-info-contenido ul li,
.content-info-contenido2 ul li,
.content-info-contenido3 ul li {
color: #066689;
display: flex;
font-weight: 500;
}
.content-info-contenido.hide,
.content-info-contenido2.hide,
.content-info-contenido3.hide {
display: none;
}
.content-info-contenido a.close,
.content-info-contenido2 a.close,
.content-info-contenido3 a.close {
position: absolute;
bottom: 0;
right: 0;
margin: 10px;
text-decoration: none;
}
.content-info-contenido a.close i,
.content-info-contenido2 a.close i,
.content-info-contenido3 a.close i {
color: #066689;
font-size: 0.9rem;
}
#filtro_disponibilidad {
position: absolute;
top: 10px;
right: 10px;
z-index: 10;
display: flex;
flex-direction: column;
align-items: end;
}
#filtro_disponibilidad a {
margin-bottom: 5px;
padding: 5px 10px;
display: inline-block;
width: auto;
height: auto;
background-color: rgba(255, 255, 255, 0.8);
margin-left: 5px;
text-align: center;
line-height: 30px;
border-radius: 5px;
transition: all 0.3s ease;
text-decoration: none;
display: flex;
align-items: center;
border: 0px solid #066689;
}
#filtro_disponibilidad a:focus {
outline: none;
border: 0px;
}
#filtro_disponibilidad a i {
color: #066689;
font-size: 1.2rem;
}
#filtro_disponibilidad a#no_disponibles i {
color: red;
}
#filtro_disponibilidad a:hover {
background-color: #066689;
}
#filtro_disponibilidad a:hover i {
color: white;
}
#filtro_disponibilidad a:hover span {
color: white;
}
#filtro_disponibilidad a span {
color: #066689;
padding-right: 10px;
}
#filtro_disponibilidad a.activated {
background-color: #066689;
}
#filtro_disponibilidad a.activated span {
color: white;
}
.accordion .accordion-button:focus {
box-shadow: none;
border-color: rgba(0, 0, 0, 0.125);
}
.accordion .accordion-button:not(.collapsed) {
box-shadow: none;
background-color: rgba(214, 180, 142, 0.4) !important;
}
.accordion .accordion-body {
text-align: left;
font-size: 0.9rem;
}
form input.form-control, form textarea {
border-radius: 0 !important;
border: 1px solid #000 !important;
background-color: #e4eff5 !important;
-webkit-box-shadow: none !important;
transition: border-color 0.3s ease;
}
form input.form-control.error, form textarea.error {
border: 1px solid #ff0000 !important;
}
form input.form-control:focus, form textarea:focus {
outline: none;
box-shadow: none !important;
border-color: #000 !important;
}
form input.form-control:-webkit-autofill, form input.form-control:-webkit-autofill:hover, form input.form-control:-webkit-autofill:focus, form textarea:-webkit-autofill, form textarea:-webkit-autofill:hover, form textarea:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0px 1000px #fff inset !important;
-webkit-transition: background-color 5000s ease-in-out 0s;
transition: background-color 5000s ease-in-out 0s;
background-color: #e4eff5 !important;
}
form input[type=checkbox] {
border-radius: 0 !important;
border: 1px solid #000;
background-color: #e4eff5 !important;
}
form input[type=checkbox]:checked {
background-color: #066689 !important;
border-color: #066689 !important;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") !important;
}
form .wpcf7-list-item {
margin: 0 0 10px 0 !important;
}
.contenido_header {
overflow: hidden;
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 3;
transition: all 0.8s ease;
}
.contenido_header .bg-color {
position: absolute;
top: 0px;
left: 0;
width: 100%;
height: 0px;
background-color: #fff;
z-index: 1;
transition: all 0.8s ease;
}
.contenido_header header {
display: block;
overflow: hidden;
position: relative;
z-index: 99;
}
.contenido_header header a {
color: white;
text-transform: uppercase;
}
.contenido_header header a.active span {
color: #25282a;
padding-bottom: 10px;
border-bottom: 4px solid #25282a;
}
.contenido_header header .nav-link a {
font-weight: normal;
font-family: "algha", sans-serif;
font-size: 1.3rem;
color: #25282a;
letter-spacing: 1px;
text-decoration: none;
}
.contenido_header header li.current-menu-item a {
color: #25282a !important;
padding-bottom: 10px;
border-bottom: 4px solid #25282a;
}
.contenido_header #logo-complete {
display: block;
transition: all 0.5s ease;
}
.contenido_header #logo-texto {
display: none;
transition: all 0.5s ease;
}
.contenido_header .line {
stroke: #066689;
}
.contenido_header.fixed {
position: fixed;
background-color: white;
color: #25282a;
}
.contenido_header.fixed .bg-color {
height: 100px;
}
.contenido_header.fixed header a {
color: #333;
}
.contenido_header.fixed header a.active span {
border-bottom-color: #333;
}
.contenido_header.fixed #logo-complete {
display: none;
}
.contenido_header.fixed #logo-texto {
display: block;
}
body.home .contenido_header header li a {
color: white !important;
}
body.home .contenido_header header li a:hover {
color: #d6b48e !important;
}
body.home .contenido_header header li.active a, body.home .contenido_header header li.current-menu-item a {
color: #d6b48e !important;
border-color: #d6b48e !important;
}
body.home .contenido_header.fixed header li a {
color: #066689 !important;
}
body.home .contenido_header.fixed header li a:hover {
color: #25282a !important;
}
body.home .contenido_header.fixed header li.active a, body.home .contenido_header.fixed header li.current-menu-item a {
color: #d6b48e !important;
border-color: #d6b48e !important;
}
.hamburger-menu {
margin-right: -15px;
}
#contenido-mobile-menu {
width: 100%;
height: 90%;
background-color: white;
border-right: 0;
border-radius: 0;
position: fixed;
top: 90px;
right: -100%;
z-index: 9999999;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
transition: all 0.5s ease;
}
#contenido-mobile-menu:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(//theorigin-villasibiza.com/wp-content/themes/the-origin/assets/img/logo-fondo.svg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
opacity: 0.05;
z-index: -1;
}
#contenido-mobile-menu.open {
right: 0;
}
#contenido-mobile-menu ul li {
padding-bottom: 10px;
}
#contenido-mobile-menu ul li a {
color: #066689;
font-size: 1.4rem;
text-decoration: none;
}
#contenido-mobile-menu ul li.active a {
color: #ac7b31 !important;
}
.contenido_header.fixed #contenido-mobile-menu {
top: 76px;
}
body.home .contenido_header header a span {
color: white;
}
body.home .contenido_header header a.active span {
color: #d6b48e;
padding-bottom: 10px;
border-bottom: 4px solid #d6b48e;
}
body.home .contenido_header header a:hover span {
color: #25282a;
}
body.home .contenido_header.fixed header a span {
color: #066689;
}
body.home .contenido_header.fixed header a.active span {
color: #25282a;
border-bottom: 4px solid #25282a;
} .navbar-toggler {
padding: 0;
border: 0px !important;
}
.navbar-toggler:focus {
box-shadow: none;
}
.ham {
cursor: pointer;
-webkit-tap-highlight-color: transparent;
transition: transform 400ms;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
.hamRotate.active {
transform: rotate(45deg);
}
.hamRotate180.active {
transform: rotate(180deg);
}
.line {
fill: none;
transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
stroke: #fff;
stroke-width: 3.5;
stroke-linecap: round;
}
.ham1 .top {
stroke-dasharray: 40 139;
}
.ham1 .bottom {
stroke-dasharray: 40 180;
}
.ham1.active .top {
stroke-dashoffset: -98px;
}
.ham1.active .bottom {
stroke-dashoffset: -138px;
}
.navbar-brand img.hide {
display: none;
}
.header-interanal {
height: 133px;
background-color: white;
}
.header-interanal a {
color: #066689 !important;
} footer a {
color: #066689;
text-decoration: none;
}
footer a:visited {
color: #066689;
}
footer a:hover {
color: #ac7b31;
}
footer ul li {
margin-bottom: 10px;
}
.footer-bottom {
border-top: 1px solid #999;
padding-top: 20px;
font-size: 0.9rem;
}
.footer-bottom .links li {
margin-right: 20px;
}
.footer-bottom .elements {
display: flex;
align-items: center;
}
.footer-bottom .elements p {
margin-bottom: 0;
padding-bottom: 0;
}
.idiomas {
margin-top: 15px;
}
.idiomas a img {
margin-left: 0px;
transition: all 0.3s ease;
}
.idiomas a.active img {
margin-bottom: -19px;
padding-bottom: 13px;
border-bottom: 4px solid #d6b48e;
}
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.contenido_principal {
width: 100%;
height: calc(100vh - 133px);
}
.contenido_principal img {
height: calc(100vh - 133px);
}
.text-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
}
#cta ul li a,
#contacto ul li a {
text-transform: uppercase;
color: #066689;
font-weight: 500;
text-decoration: none;
transition: all 0.5s ease;
}
#cta ul li a:hover,
#contacto ul li a:hover {
color: #ac7b31;
}
#cta ul li.inverto a,
#contacto ul li.inverto a {
color: #ac7b31;
}
#cta ul li.inverto a:hover,
#contacto ul li.inverto a:hover {
color: #066689;
}
#quote .lead {
font-size: 1.5rem !important;
}
#quote .lead span {
color: #066689;
font-weight: 600;
}
#quote .lead p {
margin-bottom: 0;
}
#galeria a:hover {
cursor: pointer;
}
#plan-situacion ul li {
font-size: 0.8rem;
}
#maqueta {
position: sticky;
top: 120px;
height: calc(100vh - 0px);
padding-top: 15px;
padding-bottom: 15px;
overflow-y: hidden;
}
#maqueta svg {
padding: 15px 0;
}
#maqueta_info {
min-height: 100vh;
padding-top: 60px;
}
table thead {
font-size: 0.8rem;
}
table tbody tr td {
padding: 15px 0 !important;
font-size: 0.9rem;
}
table tbody tr:hover {
background-color: rgba(53, 161, 111, 0.4) !important;
cursor: pointer;
}
table tbody tr:hover.vivienda_reservada {
background-color: rgba(243, 109, 109, 0.2) !important;
}
table tbody tr.selected {
background-color: rgba(53, 161, 111, 0.4) !important;
}
table tbody tr.selected.vivienda_reservada {
background-color: rgba(243, 109, 109, 0.1) !important;
}
table tbody tr.vivienda_reservada .reservada {
color: #ac7b31;
font-weight: 600;
}
.table > :not(caption) > * > * {
background-color: transparent;
}
#video-background {
position: relative;
width: 100%;
height: 100vh;
overflow: hidden;
background-color: #243871;
-o-object-fit: cover;
object-fit: cover;
}
#video-background iframe {
position: absolute;
top: 50%;
left: 50%;
width: 100vw;
height: 56.25vw; min-height: 100vh;
min-width: 177.77vh; transform: translate(-50%, -50%);
-o-object-fit: cover;
object-fit: cover;
border: 0;
}
ul.info li {
padding-bottom: 5px;
}
ul.info li a {
color: #066689;
text-decoration: none;
}
ul.info li a i {
margin-right: 10px;
}
ul.info li a:hover {
color: #ac7b31;
}
.form-check a {
color: #066689;
}
.form-check a:hover {
color: #ac7b31;
}
.content_telefono .iti.iti--allow-dropdown {
width: 100%;
}
.wpcf7 .wpcf7-submit {
width: 100% !important;
}
.contesto {
font-size: 0.7rem;
width: 20px;
height: 20px;
position: fixed;
bottom: 0px;
right: 0px;
background-color: red;
text-align: center;
z-index: 999;
}
.contesto:after {
content: "sm";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
body, html {
overflow-x: hidden;
}
h1 {
font-size: 2.6rem;
}
.header-interanal {
height: 90px;
}
#logo-complete,
#logo-texto {
width: 80px;
}
.contenido_principal {
height: auto;
}
.contenido_principal img {
height: auto;
}
ul.lead li {
font-size: 1rem;
}
.posicionar-imagen-fondo {
background-position-x: 35%;
}
.content-info-contenido ul li,
.content-info-contenido2 ul li,
.content-info-contenido3 ul li {
font-size: 0.6rem;
height: 20.5px;
overflow: auto;
align-items: center;
line-height: 20.5px;
}
#plan_situacion .content-info-icons .icons {
margin-right: 20px;
}
@media (min-width: 768px) {
.contesto {
background-color: orange;
}
.contesto:after {
content: "md";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
@media (min-width: 992px) {
.contesto {
background-color: yellow;
}
.contesto:after {
content: "lg";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
body, html {
overflow-x: visible;
}
h1 {
font-size: 3.2rem;
}
.home h1 {
font-size: 4.2rem;
}
.header-interanal {
height: 133px;
}
#logo-complete,
#logo-texto {
width: 140px;
}
.contenido_principal {
height: calc(100vh - 133px);
}
.contenido_principal img {
height: calc(100vh - 133px);
}
ul.lead li {
font-size: 1.25rem;
}
.posicionar-imagen-fondo {
background-position-x: 0;
}
.content-info-contenido,
.content-info-contenido2,
.content-info-contenido3 {
padding-left: 10px;
}
.content-info-contenido ul li,
.content-info-contenido2 ul li,
.content-info-contenido3 ul li {
font-size: 0.7rem !important;
height: 20px;
overflow: hidden;
align-items: baseline;
line-height: 20px;
}
#plan_situacion .content-info-icons .icons {
margin-right: 0px;
}
}
@media (min-width: 1200px) {
.contesto {
background-color: purple;
}
.contesto:after {
content: "xl";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: white;
}
}
@media (min-width: 1366px) {
.contesto {
background-color: aqua;
}
.contesto:after {
content: "xl";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: black;
}
}
@media (min-width: 1440px) {
.contesto {
background-color: blue;
}
.contesto:after {
content: "xl";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: white;
} .pe-custom-0 {
padding-right: 0 !important;
}
.content-info-contenido,
.content-info-contenido2,
.content-info-contenido3 {
padding-left: 5px;
}
.content-info-contenido ul li,
.content-info-contenido2 ul li,
.content-info-contenido3 ul li {
font-size: 0.65rem !important;
}
}
@media (min-width: 1536px) {
.contesto {
background-color: rgb(241, 8, 238);
}
.contesto:after {
content: "xl";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: white;
}
.content-info-contenido,
.content-info-contenido2,
.content-info-contenido3 {
padding-left: 10px;
}
.content-info-contenido ul li,
.content-info-contenido2 ul li,
.content-info-contenido3 ul li {
font-size: 0.7rem !important;
}
}
@media (min-width: 1920px) {
.contesto {
background-color: black;
}
.contesto:after {
content: "xxl (1920)";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: white;
}
.content-info-contenido,
.content-info-contenido2,
.content-info-contenido3 {
padding-left: 10px;
}
.content-info-contenido ul li,
.content-info-contenido2 ul li,
.content-info-contenido3 ul li {
font-size: 0.8rem !important;
height: auto;
overflow: hidden;
align-items: baseline;
line-height: auto;
}
#plan_situacion .content-info-icons .icons {
margin-right: 20px;
}
}
@media (min-width: 2050px) {
.contesto {
background-color: rgb(95, 95, 95);
}
.contesto:after {
content: "xxl (2050)";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: white;
}
}  .hystmodal__window {
width: 60% !important;
}
.hystmodal__window {
background-color: #000 !important;
}
.hystmodal__shadow--show {
opacity: .9 !important;
}
.btn-tours {
display: inline-block;
color: #fff;
text-decoration: none;
border-radius: 5px;
position: absolute;
bottom: 60px;
left: 50%;
transform: translate(-50%, -50%);
}
.btn-tours a {
display: inline-block;
margin: 0px 10px;
padding: 15px 25px;
border-radius: 20px 0;
border: 0px;
font-size: 1.2rem;
opacity: .8;
background: linear-gradient(45deg, #066689, #3585a1, #8dc2d5, #066689);
background-size: 400% 400%;
animation: abstract-bg 5s ease infinite;
}
.btn-tours a:hover {
opacity: 1;
color: #fff !important;
}
.btn-tours a:nth-child(2) {
animation-delay: 2.5s;
}
@keyframes abstract-bg {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}