body { font-family: 'Roboto', sans-serif; font-weight: 300; }

div {}

#breadcrump { padding-top: 130px; display: none;}


h2 { margin-top: 0px; color: #00ff00; line-height: 34px; }
#header .container { max-width: 1250px !important; }
.right { text-align: right; }
#header { position: fixed; top: 0; z-index: 10000; width: 100%;  }
#header hr { border: 0px; }

#header ul { list-style: none; padding: 0 !important; }
#header ul li { float: left;}
#header ul li { padding: 5px;}
#header a { color: #000; }
#header h1.logo { display: none !important;}
#header h1 { font-size: 20pt; width: 100px; text-align: right;}

#header .socials h1 { display: none; }

#header .right img { max-height: 120px;}

.clanek a { color: #00FF00 !important; }
#clanek .container { padding-left: 0; }
.clanek { padding-top: 200px; z-index: 3000; top: 120px; left: 0px; }

.nadpis_stranky { position: relative; }

.nadpis_verejne-prostory-a-urbanismus, .nadpis_vystavy, .nadpis_komercni-objekty, .nadpis_interiery, .nadpis_bydleni, .nadpis_batovske-domky, .nadpis_stranka { position: absolute; z-index: 10; top: 77px; left: 10px; }
.cl_verejne-prostory-a-urbanismus .clanek, .cl_vystavy .clanek, .cl_komercni-objekty .clanek, .cl_interiery .clanek, .cl_bydleni .clanek, .cl_batovske-domky .clanek, .clanek { padding-top: 0px;  }

	
.nadpisStranka { position: relative;  }
.nadpisStranka h2 { position: absolute; bottom: 0; text-transform: uppercase; font-family: 'Roboto' !important; font-weight: 300; padding-bottom: 0px; margin-bottom: 0px;}
ul#nav { position: relative; margin-left: 50px;}
ul#nav li:hover ul { display: block !important;  margin: 0px; margin-top: 5px; background: #fff !important;}
ul#nav li:hover ul li { display: block !important;  background: #fff !important; padding: 10px !important; padding-left: 0px; padding-left: 5px !important;}
ul#nav li a {  line-height: 40px; text-decoration: none; text-transform: lowercase;}
ul#nav li ul { display:none; position: absolute; left: 0; top: 35px; z-index: 2; list-style: none; margin: 0; padding: 0; width: 250px; background:  #fff; padding-left: 0px !important;  }
ul#nav li ul li a {  text-decoration: none; line-height: 5px !important; }
ul#nav li ul li{ list-style: none!important; margin:0px!important; padding: 0 !important; color:#4EA7D2!important; width: 100% !important; padding: 30px !important;  }
ul#nav a:hover { color: #00FF00; }
   
   .cl_ .article, .cl_clanek .article { height: 440px; overflow: hidden;}
   
   
ul.podmenu { list-style: none; padding: 0px; }
ul.podmenu a { color: #000 !important;}




.clr1 { background: #ffaaaa; }
.clr2 { background: #c8cfcf; }
.clr3 { background: #facfcf; }
.clr4 { background: #c8dcdd; }
.clr5 { background: #ffffff; }
.clr6 { background: #fcfdbc; }
.clr7 { background: #d8cfff; }
.clr8 { background: #d6d6d6; }

.grid { width: 1180px; margin: 0 auto; padding-top: 0;  }


.oddelovac { clear: both;}



.article:first-child { padding: 10px !important; margin-bottom: 30px !important; }
.article span.clr1,.article span.clr2,.article span.clr3,.article span.clr4,.article span.clr5,.article span.clr6, .article span.clr7,.article span.clr8 { padding: 10px !important; display: block; min-height: 360px; margin: 0 !important; }
.article a { color: #000 !important;}
.article a:hover { text-decoration: none;}
.article img { max-width: 100% !important;  }

.clr8 { height: 380px !important; padding: 0 !important; margin: 0 !important; }

.article .popis h5, .article .popis { display: none; height: 460px; }

.article strong { display: none;}

.article .popis { height: 360px; display: block; display: none; position: relative;  }

.article .detail { margin-top: 200px;}

.article:first-child:hover .popis {
    margin-top: 10px;
    height: auto;
    width: 340px;
    border: 0px !important;
    height: 340px;
    vertical-align: bottom;
}

.article:nth-child(3):hover .popis {
 margin-top: 120px;
 border: 0px !important;
 height: auto;
 height: 368px;
}

div.article:hover .popis {
    display: block; z-index: 1000; position: absolute; top: 0px;
    padding: 0px; font-size: 30px; color: #000; width: 100%; 
    background: rgba(0,255,0,0.5);
    display: block !important;
    vertical-align: bottom;
    padding: 10px;

}


.kategorie3 { padding: 0 !important; margin: 0 !important; width: 380px !important;padding: 10px !important; padding-bottom: 0px !important;}


span.tags {  display: block; font-size: 14px;}
span.nadpis { text-transform: uppercase; vertical-align: text-bottom; position: absolute; bottom: 10px; line-height: 30px; color: #fff; }
.article { height: 360px !important; margin-top: 20px; overflow: hidden;}

.article:first-child {
    
    margin-top: 200px !important;
    border: 0px !important;
    height: 560px !important;
  

}

.navigace a { color: #00FF00 !important; }
.prev { text-align: left; }
.next { text-align: right; }


.article:nth-child(3) {
 padding-top: 120px;
 background: none !important;
 border: 0px !important;
 height: 480px !important;
}


.article:first-child span.nadpis { bottom: 10px; }
.article:nth-child(3) span.nadpis { bottom: 10px; }

div.article:hover img {
  background: #00FF00;
  background: RGBA(0, 255, 0, 0.9);
  filter: grayscale(20);
  cursor: pointer;
    transition: all 300ms ease;
  
  
}

/* .kategorie3 { padding: 10px !important; padding-bottom: 0px !important;} */

img.logofont { height: 60px; }

.shrink { background: #fff !important; height: 70px; z-index: 99999;}
.shrink * { height: 12px; font-size: 14px; line-height: 14px; }
.shrink .right img { height: 50px; }
.shrink img.logofont { height: 40px; display: none; }
.shrink ul#nav li ul { padding-top: 10px !important; }
.shrink ul#nav li ul li{ padding-bottom: 30px !important; padding-left: 10px !important;  }

.topButton { display: none; color: #000; font-size: 50px;}
.topButton a { color: #ccc !important;}
.topButton a:hover { text-decoration: none; color: #000 !important;}
.ukazat { display: block; position: fixed; bottom: 20px; float: right; text-align: right; }

a.closer { width: 30px; height: 30px; overflow: hidden; display: block; background: url(/images/closer.png); }
a.closer:hover { background-position: 0 -30px;}
a.closer span { display: none;}
#sitecontent {padding: 30px;min-height: 400px;  }




.galerie { width: 100%; padding-top: 20px; }
.galerie div { padding-bottom: 20px;}
.galerie div img { max-width: 100%; }


#paticka a { color: #000;}




#debug { position: absolute; bottom: 0; z-index: 500; width: 150px; height: 300px; background: #000; color: #fff; font-size: 10px; right: 50px; top: 50px;overflow: scroll; display: none !important;  }

    /* Large Devices, Wide Screens */
    @media only screen and (max-width : 1200px) {

    }

    /* Medium Devices, Desktops */
    @media only screen and (max-width : 1024px) {
 .grid { width: 100%;}
    }
    
    /* Medium Devices, Desktops */
    @media only screen and (max-width : 992px) {
 .grid { width: 100%;}
    }

    /* Small Devices, Tablets */
    @media only screen and (max-width : 768px) {
 .grid { width: 100%;}
    }

    /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 480px) {
 .grid { width: 100%;}
 .article { height: 280px !important; overflow: hidden;  }  )
.article img { width: 280px !important; }
ul li ul { background: #fff; z-index: 30; display:block;  }
    }

    /* Custom, iPhone Retina */ 
    @media only screen and (max-width : 320px) {
 
 .grid { width: 100% !important; }
.article { width: 240px !important; height: 240px; overflow: hidden;  }  )
.article a img { width: 280px !important; }
ul li ul { background: #fff; z-index: 30; display:block; display: none !important;    }
.article:first-child:hover .popis {
    margin-top: 180px;
    height: auto;
    display: table-cell;
    display: block !important;
    border: 0px !important;
    height: 240px;
}

.article:first-child:hover .popis {
    height: 240px;
}

.article:nth-child(3):hover .popis {

 height: 240px;
}
     .logofont { display: none;}
     .socials .right img { width:  100px !important;}
     
     .clanek img {
       max-width: 200px !important;
      }
      
      .shrink ul#nav li ul { display: none !important;}
    }