﻿
@media all and (max-width: 130em) {
    #MainPage { font-size:1.2em; }
}

@media all and (max-width: 120em) {
    
}


@media all and (max-width: 110em) {
    
}

@media all and (max-width: 100em) {
    
    /*.PageLayout,#TopPage .PageLayout { width:96%; margin:auto 2%; }
    #TopPage .PageLayout .Left { margin-left:0; }
    #footer #LogoFooter { width:13%; background-size:contain; background-position:top 3em left; }
    #footer .Right { width:87%; }*/
}

@media all and (max-width: 90em) {
    #MainPage { font-size:1.1em; }
    #NasTym .NasTymList .BoxAgent .Photo { width:30%; }
    #NasTym .NasTymList .BoxAgent .Description { width:68%; }
    .clientForm.demand {  }
    .clientForm { width:calc(100% - 30px); padding:15px; }
}

@media all and (max-width: 80em) {

    

    .HeaderBG .HeaderBGContent .HeaderBGTextContent { width:96%; margin:0 2%; }
    #Reference #RefEstateList { width:96%; margin:0 2%; }
    #EstateBox .Left a.button { left:2%; }
    #EstateBox .Right a.button { right:2%; }
    #NumeroBox #NumeroBoxContent { width:96%; margin:0 2%; }
    #footer #footerTop {  width:96%; padding:0 2%; }
    #footerBottom .footerBottomContent { width:96%; margin:0 2%; }
    #referenceList {width:96%; margin:0 2%; }
    #RefListBox { width:96%; margin:0 2%; }
    #NemovitostProdat #ContentPage .PageLayout{ width:96%; margin:0 2%; }
    #NemovitostKoupit #ContentPage .PageLayout{ width:96%; margin:0 2%; }
    #DetailNabidka #ContentHeader{ display:table; width:96%; margin:0 2%; }
    #DetailNabidka .Telo .PageLayout { width:96%; margin:0 2%; padding:0; }
    #DetailNabidka .MapaContent #MapyCzHolder { height:15em; }
    #Onas .TextPageContent { width:96%; margin:0 2%; }
    #OnasTimeLine .TimeLine{  width:96%; margin-left:2%; margin-right:2%; }
    #Sluzby .boxes { width:96%; margin-left:2%; margin-right:2%; }
    #Kontakt .TextPageContent { width:96%; margin-left:2%; margin-right:2%;  }
    #KontaktUserText .PageLayout { width:96%; margin-left:2%; margin-right:2%;  }
    #DetailNabidka #DalsiNabidka .PageLayout { margin:0; width:100%; }
    #DalsiNabidka .PageLayout { background-position:left bottom -3em; }
    #TextPageDetail .TextPageContent,#BlogDetail #ContentPage {width:96%; margin-left:2%; margin-right:2%;  }
    #Reference .Home-reference { width:96%; margin:0 2%; }
    .HeaderBG.Default .HeaderBGContent .HeaderBGTextContent { width:96%; }
    .ContentText { width:96%; margin:0 2%; }
    h2 { font-size:2em; }
    h3 { font-size:1.6em; }
    #TextPageDetail .TextPageContent { padding:0; }
    #SeznamNemovitosti h2 { padding-left:0; }
    #SeznamNemovitosti { width:96%; margin:0 2%; }
    .certificate tr { flex-wrap:wrap; justify-content:center; }
}


/*1200px*/
@media all and (max-width: 75em) {
    #MainPage { font-size:1em; }
    #TopMenu .MainMenu ul li { padding: 0 1.2rem; }
    .TitulBoxy { width:96%; padding:1em 2%; }
}

/*1088px*/
@media all and (max-width: 68em) {

    #MenuButton { display:block; }
    #Menu { position:absolute; padding:0; width:0; height:100%; right:0;
            background-color:rgba(255,255,255,1); overflow:hidden;
    }
    
    #TopMenu { display:none; }
    #TopPage a.logo .logoimg { max-width:90%; max-height:90%; }
    #TopPage a.logo { width:160px; height:32px; margin:0 10px; padding:10px 0; }
    #TopPage .HeaderTlac { height:100%; margin-right:80px; }
    
    #MenuButton { top:2px; right:15px; }
    #MenuButton .butt { top:0; }
    #CloseMenu { top:2px; width:48px; height:48px; display:block; position:absolute; right:0.45em;
                 line-height:48px; font-size:2em; text-align:center; font-weight:bold; color:black; background-color:white;
    }
    #Menu #MenuContent { position:relative; width:100%; height:100%; }
    #Menu #MenuContent #TopMenu { display:block; width:calc(100% - 50px); position:static; float:right; padding-top:6em; padding-right:50px; display:table; }
    #Menu #MenuContent #TopMenu li a { color:#142d41; text-align:right; text-transform:none; }
    #Menu #MenuContent #TopMenu li a.MenuActive { color:var(--color2); }
    #Menu #MenuContent #TopMenu li, #Menu #MenuContent #TopMenu ul { margin:0; padding:0; background:none; }
    #Menu #MenuContent .button.HeaderTlac { width:auto; display:table; padding:0 1em; float:right; margin-right:90px; margin-top:1em;
                                            background-color:#142d41; color:white;
    }
    #Menu #MenuContent .PhoneTlac { float:right; width:48px; height:48px; margin-top:1em; margin-right:1em;
                                    background-image:url(/Images/ico-form-tel.png); background-position:center center; background-repeat:no-repeat; 
    }
    #Menu #MenuContent .PhoneTlac span{ display:none; }
    #ReferencesClassicList { 
        display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
    }
    #ReferencesClassicList .item {  }
    #ReferenceList .RefEstateListClassicContent .Item { width:48%; }
    #NumeroBox #AnimateNumber #AnimateNumberContent .BoxNumber { border:none; width:48%; margin:0.5em 1%; padding:0; }
    #NumeroBox #AnimateNumber #AnimateNumberContent { display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;
    flex-wrap: wrap; }
    #EstateBox { background-size:cover; }
    #BottomMenu { display:none; }
    #listestates .item { width:48%; }
    #DetailNabidka .BoxPhoto { width:80%; margin-left:10%; margin-right:10%; }
    #DetailNabidka .ZahlaviPopisek { margin-top:2em; width:100%; }
    #DetailNabidka .ZahlaviPopisek .TwoColumnTable{ width:40%; margin-right:5%; float:left; }
    #DetailNabidka .ZahlaviPopisek .LeftMapaAgent{ width:55%; margin-top:0; }
    #DetailNabidka #Makler #maklerPolozky .TwoColumnTable { width:100%; }
    #DetailNabidka #Makler { padding-top:0.8em; }
    .InfoBox .InfoBoxContent .BoxBlueBox { width: calc(50% - 30px); }
    #Kontakt #KontaktBox .item.text { width:60%; }
    #Kontakt #KontaktBox .item.kontakt { width:38%; margin-left:2%; }
    #Kontakt #KontaktBox .item .button.tel { margin-top:0; }
    #Kontakt #KontaktBox .item .button {  margin-left:0; width:100%;}
    #DetailNabidka { padding-top:4em; }
    #TopPage .Right { width:calc(100% - 180px); background:white; }
    #TextPageDetail,#Nemovitosti,#DetailNabidka,#ReferenceList,#Kontakt,#NemovitostKoupit,#NemovitostProdat,#BlogList,#BlogDetail { padding-top:52px; }
    #Menu #MenuContent #TopMenu li a { color:black; font-weight:bold; }
    #Menu .button { position:static; }
    #footer #footerTop .ClientFormContent { width:100%; margin-top:1em; }
    .LogoTrans { width:calc(100% - 15px); margin-left:0; }
    #Menu #MenuContent #TopMenu { width:calc(100% - 200px); padding-right:200px; padding-top:4em; }
    #Menu #MenuContent #TopMenu ul{ width:100%; }
    #Menu #MenuContent #TopMenu ul a{ line-height:2.5em; padding-left:30px; padding-right:30px; width:calc(100% - 60px); }
    #Menu #MenuContent #TopMenu ul a span{ border:none; padding-bottom:0; margin-bottom:0; padding-right:0; margin-right:0; }
    #Menu .button.MenuMobileProdat { width:200px; color:white; position:absolute; right:0; top:70px; }
    #Menu .button.MenuMobileKoupit { width: 200px; color: white; position: absolute; right: 0; top: 120px; }
    #listestatescard .item .imgWrap { float:left;   }
    #listestatescard .item .price { margin:0; position:static; margin-bottom:15px; }
    #listestatescard .item .description { padding:10px; display:table; width:calc(100% - 20px);  }
    #DetailNabidka .ZahlaviPopisek .MaklerOstatni .TwoColumnTable { width:100%; }
    #TopMenu ul li.OdhadZdarma { display:block; }
    #Menu #MenuContent #TopMenu { width:300px; margin-right:0; margin-left:auto; padding-right:0; float:none; display:table; }
    #Menu #MenuContent .PhoneTlacMini { float:none; display:table; width:230px; margin-right:0; margin-left:auto; }
    #Menu #MenuContent #TopMenu ul a.linkProdej,
    #Menu #MenuContent #TopMenu ul a.linkPronajem,
    #Menu #MenuContent #TopMenu ul a.linkOdhad
    { height:48px; background-color:var(--color1); color:white;
                                                  line-height:48px; font-weight:500; text-transform:uppercase; text-align:center;
                                                  margin-top:0.2em;
    }
    #Menu #MenuContent #TopMenu ul a.linkOdhad {  margin-bottom:1em;}
    #Menu #MenuContent #TopMenu ul a.linkProdej span,
    #Menu #MenuContent #TopMenu ul a.linkPronajem span,
    #Menu #MenuContent #TopMenu ul a.linkOdhad span
    { text-align:center; margin-left:auto; margin-right:auto;
    }
    #Menu #MenuContent #TopMenu ul a { width:12em; }
    #MobilMenu { display:block;
    }
        
}

@media all and (max-width: 58em) {


    #footerBottom .footerBottomContent .footerBCItem.facebook { width:30px; }
    #footerBottom .footerBottomContent .footerBCItem { width:calc(100% - 100px); }
    #footerBottom .footerBottomContent .footerBCItem.Last { width:75px; }
    #DetailNabidka .BoxPhoto { margin:0; width:100%; }
    #Duvera .BoxBlueBox { width:calc(50% - 60px); }
    #team .item { width:48%; }
    #TopPage .HeaderTlac { display:none;}
    #TopPage .social { position:absolute; left:50%; }
    #footerBottom .footerBottomContent .Two .Boxes { flex-wrap:wrap; }
    #footerBottom .footerBottomContent .Two { position:static; margin-left:25%; }
    #DetailNabidka .BoxPhoto #carousel { display:none; }
    .BoxUser { width:47%; }
    .videoyoutube { width:100%; }
    .CrumbMenu .oddelovac.two,.CrumbMenu .detail { display:none; }
    #ReferencesClassicList .item { width:calc(100% - 30px); margin-left:0; margin-right:0; }
    #referenceList .cards { display:block; }
    #ReferencesClassicList .item .Field.Description { height:auto; }
    #MobilMenu .social { left:0; position:static; }
    #TopPage { background:none; }
    /*.header { background:none; background-color:rgba(0,0,0,0.2); }*/
    #TopPage a.logo { background-color:var(--color1); margin:0; padding:10px; background-position:center center; }
    #TopPage .Right { background:white; }
    .HeaderBG .HeaderBGContent .HeaderBGTextContent .button { /*background-color:rgba(0,0,0,0.2);*/ }
    #ReferenceListTrailer #ReferencesTrailerList .flex{ flex-wrap:wrap; justify-content:center; }
    #ReferenceListTrailer #ReferencesTrailerList .item { width:50%; }
    
}

@media all and (max-width: 48em) {

    
    #Sluzby .HeaderBG .HeaderBGContent .HeaderBGTextContent { top:0; padding-top:6em; height:30em; }
    #Sluzby .HeaderBG .HeaderBGContent .buttons .button { height:3em; width:30%; }
    #Sluzby .HeaderBG .HeaderBGContent .buttons {   display: flex; flex-wrap: wrap; }
    #Sluzby .boxes .item{  }
    #Sluzby .boxes .item .photo{ width:100%; height:0; padding-top:56.24%; position:static; }
    #Sluzby .boxes .item .content { width:100%; padding:2em 0; }
    #Sluzby .boxes .item .content .button { position:static; }
    #DalsiNabidka .PageLayout { background-image:none; }
    #DalsiNabidka .DNContent { width:100%; }
    #Newsletter #NewsletterContent .PageLayout{ width:96%; margin-left:2%; margin-right:2%;  }
    #DetailNabidka .ZahlaviPopisek .TwoColumnTable { margin:0; width:100%; }
    #DetailNabidka .ZahlaviPopisek .LeftMapaAgent { margin-top:2em; width:100%; }
    #DetailNabidka #PodrobnePolozky .LevySloupec { width:100%;}
    #DetailNabidka #PodrobnePolozky .PravySloupec { width:100%; margin-left:0;}
    .BoxUser { margin-right:0; width:100%; }
    .TimeLine .TimeLineContent .TimeLineRow .Artical { right:0; left:auto; }
    .TimeLine .TimeLineContent .TimeLineRow::after { right:28px; left:auto; }
    .TimeLine .TimeLineContent .TimeLineRow .Title { float:left; margin-left:0; margin-right:auto; width:calc(100% - 50px); }
    .TimeLine .TimeLineContent .TimeLineRow.Alternative .Title { float:left; margin-left:0; margin-right:auto; width:calc(100% - 50px); }
    .TimeLine .TimeLineContent .TimeLineRow { padding-bottom:2em; }
    .TimeLine .TimeLineContent .TimeLineRow .Description,.TimeLine .TimeLineContent .TimeLineRow.Alternative .Description { margin-left:0; margin-right:auto; width:calc(100% - 50px); }
    .TimeLine .TimeLineContent .TimeLineRow.Alternative .Description { margin-left:0; margin-right:auto; float:left; }
    #Kontakt #KontaktBox .item .button { padding:0 15px; width:100%; }
    #Kontakt #KontaktBox .item.text { width:100%; }
    #Kontakt #KontaktBox .item.kontakt { width:100%; margin-left:0; margin-top:1em; }
    #KontaktUserText .mapaIframe { width:100%; margin-bottom:2em; height:15em; }
    #EstateBox #EstateBoxContent .W50 { width:100%; position:static; display:table; }
    #EstateBox #EstateBoxContent .W50 a.button { float:none; position:static; width:80%; margin-top:2em; }
    #EstateBox #EstateBoxContent { height:auto; display:table; width:100%; padding-bottom:2em; }
    body .RadWindow .rwContent { min-width:400px; }
    body .clientForm .Item.Captcha div div div img { max-width:100%; }
    .HeaderBG.Default .HeaderBGContent .HeaderBGTextContent { bottom:auto; margin-top:0; padding-top:0; }
    .HeaderBG.Default .HeaderBGContent .HeaderBGTextContent p{  }
    .HeaderBG .HeaderBGContent .HeaderBGTextContent .button { padding:0 1em; }
    .HeaderBG .HeaderBGContent #btHeaderArrowToBottom { display:none; }
    .ViceInformaci #ContactForm { width:calc(100% - 30px); }
    .BoxUser { width:97%; }
    .HeaderBG.Default .HeaderBGContent .HeaderBGTextContent {  }
    .HeaderBG .HeaderBGContent .HeaderBGTextContent .button { width:13rem; float:none; margin-left:auto; margin-right:0; margin-bottom:0.5rem; }
    
    .Counter .CounterItem .CounterBox .Count { font-size:2rem; }
    .Counter .CounterItem .CounterBox { width:170px; height:170px; }
    .Counter .CounterContent { flex-wrap:wrap; justify-content:center; }
    .Counter .CounterItem { width:200px; }
    #blogList .item .PhotoContent { flex-wrap:wrap; }
    #blogList .item .PhotoContent .Photo{ width:100%; }
    #blogList .item .PhotoContent .Other{ width:100%; }
    #blogList .item .Photo img { max-width:100%; }
    #blogList .item .Name { margin-top:1rem; }
     .TitulSluzby .Box { width:calc(50% - 60px); }
    #VolPolBox ul li { width:calc(50% - 20px); }
}

@media all and (max-width: 38em) {

    h1,h2 { font-size:1.6em; }
    .HeaderBG .HeaderBGContent .HeaderBGTextContent h1 { font-size:3rem; }
    #ReferencesClassicList .item { width:calc(100% - 30px); }
    #ReferenceList .RefEstateListClassicContent .Item { width:96%; margin:1em 2%; }
    #NumeroBox #AnimateNumber #AnimateNumberContent .BoxNumber { width:96%; margin:1em 2%; }
    #team .item { width:96%; margin:1em 2%; }
    body .RadWindow .rwContent { min-width:310px; }
    #listestates .item { width:96%; margin:1em 2%; }
    .InfoBox .InfoBoxContent .BoxBlueBox { width:calc(100% - 30px); }
    #Duvera .BoxBlueBox { width:Calc(100% - 30px); margin:1em 15px; }
    #Sluzby .HeaderBG .HeaderBGContent .buttons .button { height:4em; }
    #TopPage .social { display:none; }
    .HeaderBG .HeaderBGContent .HeaderBGTextContent .button { font-size:0.9em; margin-top:0.5em; }
    .ImgW25 { width:50%; }
    #listestatescard .item .imgWrap { width:100%; margin:0; border:none; border-bottom:5px solid var(--color1); margin-bottom:0.5em; }
    .clientForm.estate #Nabidka, .clientForm.demand #Nabidka { width: 100%; }
    .clientForm.estate #Klient, .clientForm.demand #Klient { width: 100%; margin-top: 1em; }
    #footer #footerTop .NadpisForm { font-size:1.6em; }
    .ImgW50 { margin:1em 0; width:100%; float:none; }
    .FormatBox.W50 { width:100%; max-width:none; margin:1em 0; }
    .ImgW25.Right { margin-left:0; min-width:100%; max-width:100%; min-height:100%; }
    .ImgW25.Left { margin-right:0; min-width:100%; max-width:100%; min-height:100%; }
    #BlogDetail .Photo { margin-left:0; width:100%; }
    #MobilMenu .social { display:block;
    }
    #BlogList .item { padding:30px; width:calc(100% - 90px); }
    .VodoznakNumber { float:none; display:table; }
    #ReferenceListTrailer #ReferencesTrailerList .item { width:100%; }
}
@media all and (max-width: 30em) {

    #DetailNabidka .BoxPhoto #carousel { display:none; }
    .HeaderBG.Default .HeaderBGContent .HeaderBGTextContent p { display:none; }
    .HeaderBG .HeaderBGContent .HeaderBGTextContent h1 { margin-top:6rem; text-align:center; margin-bottom:3rem; }
    .HeaderBG .HeaderBGContent .HeaderBGTextContent .button { margin-left:auto; margin-right:auto; }
    #Sluzby .HeaderBG .HeaderBGContent .buttons .button { height:3.5em; width:90%; }
    #Sluzby .HeaderBG .HeaderBGContent .HeaderBGTextContent { height:43em; }
    #TopPage a.PhoneTlac { display:none; }
    #footerBottom .footerBottomContent .First { display:none; }
    #footerBottom .footerBottomContent .Two { margin-left:0; }
    #DetailNabidka #Makler #maklerFoto { width:80px; height:80px; }
    #ReferencesClassicList .item .Field.Photo { width:80px; height:80px; }
    .HeaderBG.Default .HeaderBGContent .HeaderBGTextContent { position:absolute; display:table; top:auto; bottom:2rem; margin:auto;  }
    .Counter .CounterItem .CounterBox { margin-top:1rem; }
    #blogList .item .Name h3 a{ font-size:1.4rem; }
    .TitulSluzby .Box { width:calc(100% - 60px); }
    #VolPolBox ul li { width:calc(100% - 20px); }
    /*#VolPolBox h3 { text-align:left; }*/
}
@media all and (max-width: 23em) {

    #blogList .item .Name h3 a{ font-size:1.3rem; }
    
}
