﻿
@import url('/Components/Estates/Photos/wucPhotosTwoLayer.css?date=16-09-2026');

.headertextpage h1 { color:var(--color10); }
#EstateDetail { padding:0; }

#EstateDetail .descagent { padding-bottom:2rem; }
#EstateDetail .descagent .descagentcontent{ flex-wrap:nowrap; padding-top:2rem; }
#EstateDetail .descagent .desccontent{ width:68%; padding-right:2%; }
#EstateDetail .descagent .desccontent .title{ font-size:1.8em; font-weight:500;  }
#EstateDetail .descagent .desccontent .price{ font-weight:bold; font-size:1.4em; margin:1em 0; }
#EstateDetail .descagent .desccontent .description{ }
#EstateDetail .descagent .contact{ width:calc(30% - 10px); padding-right:10px; }
#EstateDetail .descagent .contact .iaminterested{ display:block; width:100%; text-align:center; color:var(--color10); background-color:var(--color3); cursor:pointer; }
#EstateDetail .descagent .contact .iaminterested a{ display:block; width:calc(50%); padding:30px 15px; text-align:center; color:var(--color10);
                                                    text-decoration:none; margin:auto; font-size:1.4em;
}
#EstateDetail .descagent .contact .agent{ margin-top:2em; background-color:var(--color9); padding:0 30px 30px 30px; width:calc(100% - 60px);
                                          
}
#EstateDetail .descagent .contact .agent h3 { color:var(--color11); font-size:1.2em; }
#EstateDetail .descagent .contact .agent .imgcontact { flex-wrap:nowrap; color:var(--color11); }
#EstateDetail .descagent .contact .agent .imgcontact{ }
#EstateDetail .descagent .contact .agent .imgcontact .desc{ flex-wrap:wrap; color:var(--color11); }
#EstateDetail .descagent .contact .agent .imgcontact .photo{  
}
#EstateDetail .descagent .contact .agent .imgcontact .photo .photocontent{  
    overflow:hidden; display:block; position:relative;
    width:80px; height:80px;
    -webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 40px;
margin-right:10px; color:var(--color11);
}

#EstateDetail .descagent .contact .agent .imgcontact .photo img{ position:absolute;
                                                                 top: 50%; margin:auto;
  left: 50%;
  transform: translate(-50%, -50%); min-width:100%; min-height:100%; max-width:110%;
}
#EstateDetail .descagent .contact .agent .imgcontact .name{ font-weight:500; display:block; color:var(--color11); width:100%; }
#EstateDetail .descagent .contact .agent .imgcontact .contact{ color:var(--color11); width:100%; }
#EstateDetail .descagent .contact .agent .imgcontact .contact .email,#EstateDetail .descagent .contact .agent .imgcontact .contact .phone{ color:var(--color11); width:100%; }
#EstateDetail .descagent .contact .agent .imgcontact .contact .email a,#EstateDetail .descagent .contact .agent .imgcontact .contact .phone a{ color:var(--color11); text-decoration:none; font-weight:normal; }


#EstateDetail .photogallery{ padding-left:10px; }
#EstateDetail .parameters { background-color:var(--color4); color:var(--color10); padding:6rem 0; }
#EstateDetail .parameters .parameterscontent{ display:flex; flex-wrap:wrap; width:100%; justify-content:left; margin:auto; }
#EstateDetail .parameters .item{ width:48%; margin-right:2%; display:flex; flex-wrap:nowrap; padding:5px 0; border-bottom:1px solid var(--color3); }
#EstateDetail .parameters .itemlabel{ width:40%; font-weight:500; color:var(--color5); }
#EstateDetail .parameters .itemlabel:first-letter{ text-transform:uppercase; }
#EstateDetail .parameters .itemcontent{ width:60%; font-weight:600; }
#EstateDetail .parameters .itemcontent:first-letter{  }
#EstateDetail #MapyCzHolder { width:100%; height:400px; }
#EstateDetail #MapyCzHolder .compass { top:50px; }

#EstateDetail .topphoto { position:relative; }
#EstateDetail .topphoto .photocontent{ width:100%; height:0; padding-bottom:34%; position:relative; }
#EstateDetail .topphoto .photocontent div { display:block; width:100%; height:100%; position:absolute; top:0; left:0;
                                            background-repeat:no-repeat; background-size:cover; background-position:center center;
}
#EstateDetail .topphoto .statictext { max-width:1000px; margin:203px auto 0 auto; position:absolute; z-index:3; top:0; left:0; right:0; }
#EstateDetail .topphoto .statictext .title{ display:table; width:auto; padding:30px;
                                      background:rgba(0,0,0,0.5); margin:auto; text-align:center;
}
#EstateDetail .topphoto .statictext .title h1{ color:var(--color10); padding:0; margin:0; font-weight:400; }
#EstateDetail .topphoto .statictext .location{ display:table; width:auto; padding:15px 30px;
                                      background:rgba(0,0,0,0.5); margin:auto; text-align:center; color:var(--color10); font-weight:300; font-size:1.6rem;
                                      font-family:var(--font-title);
}
#EstateDetail .topphoto .buttonsinphoto { position:absolute; display:table; margin:auto; bottom:3rem; left:0; right:0;  }
    #EstateDetail .topphoto .buttonsinphotocontent { flex-wrap:nowrap; }
    #EstateDetail .topphoto .buttonsinphotocontent a.button{ padding:0 2rem; margin:0 15px; text-transform:none; font-family:var(--font-title); font-weight:400;
                                                             height:60px; line-height:60px; font-size:1.6rem;
    }

#EstateDetail .description { color:var(--color11); line-height:1.7; padding:0; }
#EstateDetail h2 { font-weight:300; margin-top:2rem; padding-top:0; color:var(--color10); }
#EstateDetail .video { background-color:var(--color4); color:var(--color10); padding-bottom:6rem; }
#EstateDetail .video h2{ margin-bottom:0; padding-bottom:0; }
#EstateDetail .video .videofile,#EstateDetail .video .videoyoutube { margin-top:3rem; }
#EstateDetail .video .videofile video { max-width:100%; }
#EstateDetail .matterport { background-color:var(--color4); color:var(--color10); padding-bottom:6rem; }
#EstateDetail .matterport h2{ margin-bottom:0; padding-bottom:0; }
#EstateDetail .floorplan { background-color:var(--color10); color:var(--color11); padding:6rem 0; }
#EstateDetail .floorplan h2{ margin-bottom:0; padding-bottom:0; color:var(--color11); }
#EstateDetail .documents { background-color:var(--color4); color:var(--color10); padding:6rem 0; }
#EstateDetail .documents h2{ margin-bottom:0; padding-bottom:0; }
#EstateDetail .price { color:var(--color1); padding:0.5rem 0; }
#EstateDetail .price h2{ margin-bottom:1rem; padding-bottom:0; color:var(--color10); }
#EstateDetail .price .pricenumber { text-align:center; font-size:3rem; font-weight:bold; }
#EstateDetail .price .pricenote { text-align:center; font-size:1.6rem; font-weight:normal; }
#EstateDetail .map { background-color:var(--color3); }
#EstateDetail .map #detailmapaholder{ width:100%;  }

#Mapa { height:400px; position:relative; width:100%; margin:0; }
#Mapa #map{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:1;}
#Mapa #map .logocontrol { position:absolute; left:0; bottom:0; }
#Mapa #map ul li { background:none; }
#Mapa #map .layer-switcher .panel ul,#Mapa #map .layer-switcher .panel ul li{ margin:0; padding:0; background:none; list-style:none; font-size:1rem; }
#Mapa #map .layer-switcher .panel ul { padding-left:10px; margin-bottom:5px; }
#Mapa #map input[type=radio] { list-style:circle; }


@media all and (max-width: 105em) {

    #EstateDetail .topphoto .statictext .title h1 { font-size:2em; }
    #EstateDetail .price { padding:3rem 0; }
}

@media all and (max-width: 85em) {

    #EstateDetail .topphoto .statictext .title h1 { font-size:1.8em; }
    #EstateDetail .topphoto .statictext .location { padding:5px 30px; }
    #EstateDetail .descagent .contact .agent .imgcontact .photo .photocontent { width:60px; height:60px; }
    #EstateDetail .descagent .descagentcontent { flex-wrap:wrap; }
    #EstateDetail .descagent .desccontent { width:100%; padding-right:0;  }
    #EstateDetail .descagent .contact { width:80%; margin-left:auto; margin-right:auto; margin-top:2em; } 
    #EstateDetail .descagent .contact .contactcontent{ flex-wrap:nowrap; }
    #EstateDetail .descagent .contact .iaminterested a { width:calc(80% - 30px); }
    #EstateDetail .descagent .contact .agent { margin-top:0; }
    #EstateDetail .descagent .contact .agent .imgcontact .photo .photocontent { width:80px; height:80px; }
    #EstateDetail .descagent .contact .iaminterested { position:relative; }
    #EstateDetail .descagent .contact .iaminterested a { top:0; bottom:0; left:0; right:0; margin-top:auto; margin-bottom:auto; position:absolute; display:table; }
    #EstateDetail .descagent .contact { padding-right:0; }
    #EstateDetail .descagent .contact { width:100%; }
}

@media all and (max-width: 75em) {

    #EstateDetail .topphoto .photocontent { padding-bottom:45%; }
}

@media all and (max-width: 61em) {

    #EstateDetail .topphoto .photocontent { padding-bottom:55%; }
    
}

@media all and (max-width: 54em) {

    #EstateDetail .parameters .item { width:100%; }
    
}

@media all and (max-width: 48em) {
    #EstateDetail .topphoto .photocontent {
        padding-bottom: 65%;
    }
    #EstateDetail .topphoto .statictext .title { padding:15px; }

}

@media all and (max-width: 42em) {
    #EstateDetail .topphoto .photocontent { padding-bottom:75%; }
    #EstateDetail .topphoto .buttonsinphoto { position:static; bottom:auto; left:auto; right:auto; background-color:var(--color3); width:100%; }
    #EstateDetail .topphoto .buttonsinphotocontent a.button { font-size:1.2rem; }
    #EstateDetail .price h2 { font-size:1.6rem; }
    #EstateDetail .price .pricenumber { font-size:2rem; }
    #EstateDetail .price { padding:2rem 0; }
    #EstateDetail .descagent .contact .contactcontent { flex-wrap:wrap; }
    #EstateDetail .descagent .contact .iaminterested a { position:static; }
    #EstateDetail .descagent .contact .documents { margin-bottom:2em; }
}

@media all and (max-width: 36em) {
    #EstateDetail .topphoto .buttonsinphotocontent { flex-wrap:wrap; }
    #EstateDetail .topphoto .buttonsinphotocontent a.button { width:100%; margin:0; padding:0; }
    #EstateDetail .topphoto .statictext .title h1,#EstateDetail .topphoto .statictext .location { font-size:1.4rem; }
    #EstateDetail .descagent .desccontent .title { font-size:1.6rem;  }
}

@media all and (max-width: 27em) {
    #EstateDetail .topphoto .photocontent { padding-bottom:100%; }
    #EstateDetail .topphoto .statictext .title h1, #EstateDetail .topphoto .statictext .location { font-size:1.2rem; }
    #EstateDetail .descagent .contact .agent .imgcontact { flex-wrap:wrap; }
    #EstateDetail .descagent .contact .agent .imgcontact .photo { margin-bottom:1rem; }
}









    


