.apaleo-element{
display: grid;
gap: 20px;
grid-template-columns: calc(40% - 10px) calc(60% - 10px);
margin-bottom: 20px;
}
.apaleo-element h4{
color: #242222;
font-family: Inter;
font-size: 22px;
font-style: normal;
font-weight: 700;
line-height: normal;
margin-bottom: 14.88px;
display: inline-block;
}
.apaleo-element p{
color: #242222;
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px; 
margin-bottom: 7px;
}
.openModal{
color: #A87746;
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px;
cursor: pointer;
}
.openModal svg{
vertical-align: middle;
}
.apaleo-element > div{
overflow: hidden;
}
.apaleo-element > div:first-child img{
border-radius: 10px;
}
.property-amenities{
margin-top: -10px;
}
.properties-pricing{
display: flex;
gap: 20px;
margin-top: 20px;
justify-content: space-between;
align-items: center;
}
.properties-pricing > div:first-child{
width: 30%;
}
.properties-pricing > div:last-child{
width: 75%;
display: flex;
}
.properties-pricing > div:last-child p{
font-size: 14px;
}
.properties-pricing-total > div:last-child {
margin-left: auto;
}
.properties-pricing p:nth-child(2){
text-align: right;
}
.carousel-imgs-hotel figure img{
height: 200px !important;
width: 100% !important;
}
.apaleo-container{
display: grid;
grid-template-columns: 1fr 1fr; gap: 40px;
margin-bottom: 50px;
}
@media (max-width: 980px) {
.apaleo-container{
grid-template-columns: 1fr; }
}
.apaleo-link-active{
fill: #FF7423;
}
.apaleo-link-active circle{
stroke: none;
}
.apaleo-link-active path{
fill: white;
stroke: none;
} .modal {
display: none; position: fixed; z-index: 999999; padding-top: 100px; left: 0;
top: 0;
width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); } .modal-content {
background-color: #fefefe;
margin: auto;
padding: 30px;
border: 1px solid #888;
width: 80%;
border-radius: 20px;
}
#theContent h4{
margin-top: 0;
margin-bottom: 12px;
font-size: 18px;
font-weight: 600;
color: #333;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#theContent ul{
list-style: none;
margin-bottom: 20px;
padding: 0px !important;
}
#theContent li{
color: #000;
font-family: 'Inter';
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 28px;
word-break: break-word;
hyphens: auto;
} .close {
color: #aaaaaa;
float: right;
font-size: 28px;
font-weight: bold;
line-height: 10px;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}
#theContent{
column-count: 2;
column-gap: 10px;
}
#theContent > div{
margin-bottom: 20px;
}
@media (max-width: 767px) {
#theContent{
column-count: 1;
}
.apaleo-element{
grid-template-columns: 1fr; margin-bottom: 30px;
}
.apaleo-container, .serviced-apartments-title{
padding: 20px !important;
}
.carousel-imgs-hotel figure img {
width: 100% !important;
}
}
.info-icon {
width: 16px;
height: 16px;
background-color: #ffffff;
border-radius: 50%;
display: inline-flex;
justify-content: center;
align-items: center;
font-size: 12px;
color: #000000;
position: relative;
border: 1px solid black;
}
.info-icon::after {
content: attr(data-tooltip);
position: absolute;
background: #333;
color: #fff;
padding: 6px 10px;
border-radius: 6px;
font-size: 13px;
opacity: 0;
pointer-events: none;
transition: opacity 0.2s ease-in-out;
width: 200px;
z-index: 99999;
}
.info-icon:hover::after {
opacity: 1;
}