/*------------------------------MAIN-------------------------- */
:root{
	--barva01:#82b029;
}
*,::before,::after{box-sizing:border-box;background-repeat:no-repeat}
html,body.myBody,#ContainerC{width:100%;height:100%;}
body{min-width:320px;}
#Container{display:grid;grid-template-columns: 100%;grid-template-rows: auto 1fr auto;min-height: 100%;}
#Container #topBanner{grid-column: 1/-1;grid-row: 1/2;display: grid;grid-template-columns: auto 1fr auto;grid-template-rows: repeat(2,auto) 1fr;padding-top:calc(30px - 14px);/*min-height:342px;*/height:auto;padding-bottom: 1.5em;}
#Container #centerC{grid-column: 1/-1;grid-row: 2/-2;display: grid;grid-template-columns: auto 1fr auto;grid-template-rows: auto 1fr;}
#Container #bottomC{grid-column: 1/-1;grid-row: -2/-1;}

#Container #topBanner #logoC{grid-column: 1/2;grid-row: 2/3;float: none;margin-bottom:8px;}
#Container #topBanner #jazyky{grid-column: -2/-1;grid-row: 1/2;margin: 0;justify-self: end;float: none;display: flex;align-items: center;}
#Container #topBanner #topNavig{grid-column: 2/3;grid-row: 2/3;float: none;margin-top: 0;align-self: center;justify-self: start;height: auto;}
#Container #topBanner #searchBlockC{grid-column: -2/-1;grid-row: 2/3;float: none;margin: 0;}
#Container #topBanner #topSlider{grid-column: 1/-1;grid-row: -2/-1;float: none;height:auto;}

#Container #topBanner #topSlider .container{max-width:1000px;width:100%;}

#Container #centerC #leftC{grid-column: 1/2;grid-row: 1/2;align-self: start;}
#Container #centerC #contentC{grid-column: 2/-2;grid-row: 1/-1;align-self: start;}
#Container #centerC #rightColumnC{grid-column: -2/-1;grid-row: 1/2;align-self: start;}

#ContainerC {max-width: calc(1000px + (0.75em*2));width:100%;margin: 0 auto;padding:0 0.75em;}

#contentC {float:left;width: 730px;}
#contentC.HP {width:465px;}
#ContainerC.casopis #contentC.HP {width:730px;}

#content {padding: 15px 0px  25px 0px; }

#ContainerC.casopis #content {background:url(/images/puntaCasopis.png) repeat-y 0 0;padding-left:20px;margin-top:40px;}

#content ul {margin-left:0;margin-top:0;list-style:none;}
#content ul li {padding-left:15px;background:url(/images/puntaGreen.png) no-repeat 0 5px;}
#content ul ul {margin-left:15px;}
#content ul ul li  {background:url(/images/puntaGrey.png) no-repeat 0 5px;}
#content .anot {padding:7px 7px 7px 0;}
#content .anot img {float:left;padding-right: 0.5em;}
#content #artDetailAnot .anot {font-size:1.2em;font-weight:bold;padding-top:0px;}
#content h3 a {background:transparent;}

#content .date {padding:7px;}

#content .photogaleryFoto{
	float:left;
	width: 33%;
	margin-bottom: 1em;
	text-align: center;
}
#content .photogaleryFoto img, #content #AddPcitures  img{border: 3px solid #FFF;margin-top: 0.2em;}

#content .menuText {margin-bottom:1em;}
#content .leftimg {margin-right: 2em;}
#content .rightimg {margin-left: 2em;}

#actPathC {margin: 20px 0 0 0;}
#actPath a {color:#9b9b9b; text-decoration: none;}
#actPath a:hover {text-decoration: underline;color:#706f6f;}                                         
#actualPathInner {padding: 5px 10px 3px 0px;border-bottom:1px solid;display:inline;font-size:0.85em;}
#actPath h1 {margin-top:20px;}
/* ---------------------------formulare----------------------- */ 
.inputTextSmall {width: 70px;}
.inputText {width: 200px;}
.inputSelect {width: 200px;}
.inputTextarea {width: 200px;height: 100px;}

.inputSubmit{color:#fff;background-color:#82b029; border: 1px solid #82b029;margin-left: 5px;cursor:pointer;}
#searchBlocC{margin-bottom: 1em; padding-bottom: 25px;}
/* --------------------------- horni blok -------------------------- */
#topBanner{
	max-width: 1000px;
	width:100%;
	height: 342px;
	padding-top:30px;
	position: relative;
}

#logoC {
    background: url("../images/logo.png") no-repeat scroll 0 0;
    float: left;
    width: 309px; 
    height: 44px;   
    margin-top: 0px;
    margin-left:16px;
}

#logoC.enverze {background: url("../images/logoEn.png") no-repeat scroll 0 0; width: 322px;}
#logoC.enverze a {width: 322px;}

#logoC a {
    display: block;
    width: 309px; 
    height: 44px; 
    margin: 0px;
    padding: 0px;
}

#logoC span,
#logoCasopis span {
    border: 0px none;
    left: -10000px;
    position: absolute;
}
#logoCasopis a {
    display: block;
    width: 200px; 
    height: 63px; 
    margin: 0px;
    padding: 0px;
}

#logoCasopis {
  width: 200px;
  height: 63px;
  background: url(/images/logoCasak.png);
  float: left;
  margin-right: 20px;
}

#topNavig {/*width: 475px;
  height:45px;*/
  float: left;
  margin: 8px 0 0 45px;
  /*background: url(/images/topNavigBg.png) no-repeat;*/
  padding: 0px 0 0px 0;
}
#topBanner.english #topNavig {}/*width: 465px;*/

#topNavig ul {margin:0px; padding:0px;}
#topNavig li {display: inline; 
     margin: 0px;
     margin-right:1px;
     padding: 0 0 8px 0;
     float:left;
}

#topNavig li.actual {background: url(/images/topActive.png) no-repeat center bottom;}
/*#topNavig li.actual span{font-weight:bold}*/
#topNavig li.actual a {background-color:#b0cc78;:}

#topNavig li a {display: block;color:#fff;background:#82b029;text-align:center;text-decoration:none;padding:7px 25px 4px 25px;}
#topNavig a:hover, #topNavig a:active, #topNavig a:focus { text-decoration: none;color:#fff;background-color:#b0cc78;}
#topNavig li.posledni a {border:0;}

#topNavig li.li_1 a {
    -webkit-border-top-left-radius: 15px;
    -webkit-border-bottom-left-radius: 15px;
    -moz-border-radius-topleft: 15px;
    -moz-border-radius-bottomleft: 15px;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}

#topNavig li.posledni a {
    -webkit-border-top-right-radius: 15px;
    -webkit-border-bottom-right-radius: 15px;
    -moz-border-radius-topright: 15px;
    -moz-border-radius-bottomright: 15px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

#jazyky {float:right;margin: -14px 0 5px 0;}
#jazyky a {border:0;color:#706f6f;font-size:0.9em;font-size: 0.85em;padding: 0 3px;text-decoration:none;line-height: normal;}
#jazyky a:hover,#jazyky a.actual {color:#82b029;}

#searchBlockC {
      width: 152px;
      height: 30px; 
      position: relative; 
      float:right;
      background:url(/images/searchTopBg.png) no-repeat 0 0;
      margin-top: -2px;
}
#searchText {
      width: 82px;
      background: transparent;
      height: 16px;      
      position: absolute;
      top: 6px;
      left:8px; 
      border:0;
      font-size:0.9em;    
}   
#searchText:focus{
    outline: 1px solid #82b029;
}
      
#doSearch {     
    position: absolute;
    top: 6px;
    right: 0px;
    border: 0px none;
    background: transparent;
    color: #fff;
    font-size: 0.9em;
    cursor: pointer;
    padding: 0 5px 0 0;
}
#doSearch:hover {color:#e6e9e0;}  
      
#topSlider {height:266px;float: left;overflow:hidden;} 
.container {width:1000px;}
#slides {display:none;}

/* ------------------------------ casopis -----------------------------*/
#casopisSlogan {
  background-color: rgb(130, 176, 41);
  width: 422px;
  padding: 5px 0px;
  text-align: center;
  border-radius: 15px 15px 15px 15px;
  float: right;
  margin-top: 10px;
  color: #fff;
  font-size: 1.4em;
}

h2.velke {
  font-size: 1.8em;
  padding-right: 85px;
  font-weight: normal;
  line-height: 1.1em;
}
/* --------------------------- leva navigace -------------------------- */
#leftC {	
    float:left;
    width: 270px;
	max-width: 270px;
    overflow: hidden;        
    position: relative;	
    padding-bottom: 25px;
}

#ContainerC.casopis #leftC {margin-right: 20px;width:200px;}

#left {padding:15px 0 10px 0;}

#leftNavigC {           
     padding:12px 0px;
     position: relative;
     background-color:#82b029;
     width:210px;
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    border-radius: 18px;
}

#leftNavigC li {margin:0; padding:0;}

#leftNavigC a, #leftNavigC a:link{
    display: block;
    text-decoration: none;
    color: rgb(255, 255, 255);
    padding: 6px 20px 6px 20px;
    background:url(/images/leftNavigLine.png) no-repeat 20px bottom;
}
#leftNavigC a:hover {background:#b0cc78 !important;}

#leftNavig ul {margin:0;padding: 0px;list-style: none;}

#leftNavig li.posledni a {border: 0;background:none;}
#leftNavig li.actual a {font-weight: bold;background:#b0cc78 !important;}
#leftNavig li.actual {background:url(/images/leftActive.png) no-repeat right center;}


#rightInLeft {float:left;}
#rightInLeft #rightColumn ul#obrazkoveul {float:left;margin-left:0;}

#quickContact {clear:both;color:#82b029;font-size:0.9em;margin-left: 5px;}
#quickContact p {line-height:1.1em;}
/* --------------------------- pravy blok -------------------------- */
#rightColumnC {
    float:right;
    width: 265px;
    overflow:hidden;
    padding: 13px 0 15px 0; 
}
#rightColumn {padding-bottom:0px;}
#rightColumn h3 {display:none;}
#rightColumn ul#obrazkoveul {float:right}
/*
#rightColumn ul#obrazkoveul li {list-style:none;background:url(/images/rightLeftOdkazyBg_NEW2023.png) no-repeat 0 0;width:148px;padding:0px 5px 0px 65px;margin-bottom:10px}
#rightColumn ul#obrazkoveul li#obrazek1 {background-position:0 0px;}
#rightColumn ul#obrazkoveul li#obrazek2 {background-position:0 -67px;}
#rightColumn ul#obrazkoveul li#obrazek3 {background-position:0 -134px;}
#rightColumn ul#obrazkoveul li#obrazek4 {background-position:0 -201px;}
#rightColumn ul#obrazkoveul li#obrazek5 {background-position:0 -268px;}
#rightColumn ul#obrazkoveul li#obrazek6 {background-position:0 -335px;}
#rightColumn ul#obrazkoveul li#obrazek7 {background-position:0 -402px;}
#rightColumn ul#obrazkoveul a {color:#706f6f;text-decoration:none;display:table-cell;height:58px;vertical-align:middle;font-size:0.9em;}
#rightColumn ul#obrazkoveul a:hover {color:#9b9b9b;}
*/

#rightColumn ul#obrazkoveul li {list-style:none;margin-bottom:10px}
#rightColumn ul#obrazkoveul li#obrazek1 a {background-position:0 0px;}
#rightColumn ul#obrazkoveul li#obrazek2 a {background-position:0 -67px;}
#rightColumn ul#obrazkoveul li#obrazek3 a {background-position:0 -134px;}
#rightColumn ul#obrazkoveul li#obrazek4 a {background-position:0 -201px;}
#rightColumn ul#obrazkoveul li#obrazek5 a {background-position:0 -268px;}
#rightColumn ul#obrazkoveul li#obrazek6 a {background-position:0 -335px;}
#rightColumn ul#obrazkoveul li#obrazek7 a {background-position:0 -402px;}
#rightColumn ul#obrazkoveul li a {color:#706f6f;
    text-decoration:none;
    display:table-cell;
    height:58px;width:208px;
    vertical-align:middle;
    font-size:0.9em;
    background:url(/images/rightLeftOdkazyBg_NEW2023.png) no-repeat 0 0;
    padding:0;
}


#rightColumn #aktualityBlock {
    width:168px;
    padding:12px 20px 0px 20px;
    clear:both; 
    float:right;    
    background-color:#82b029;
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    border-radius: 18px;
    color:#fff;
}
#rightColumn #aktualityBlock h4 {color:#fff;padding-bottom: 5px;}
#rightColumn #aktualityBlock a {color:#fff;text-decoration:none;}
#rightColumn #aktualityBlock .aktualita {margin-bottom:10px;font-size:0.9em;}
#rightColumn #aktualityBlock span {float:left;font-weight:bold;padding-right:1em;}
/* --------------------------- paticka -------------------------- */
#bottomC {clear:both;position: relative;border-top:1px solid #706f6f;padding:3px 0 20px 0;}
#bottomC a, #bottomC a:visited, #bottomC a:link {color:#9b9b9b;text-decoration: none;}
#bottomC a:hover, #bottomC a:active, #bottomC a:focus  {text-decoration: none;color:#706f6f;}
#bottomC ul{
	padding: 0em;
	margin: 0em;
}
#bottomC li{
	padding: 0em 0.5em;
	display: inline;
}
#bottomC li.posledni {border-right: none;}

#bottom {
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

#copyright2 {width: 400px;float:left;}

#bottomNavig {padding:0;text-align: center;float:right;}
#bottomNavig li {border-right: 1px solid #9b9b9b;}

/* --------------------------- odsazovani -------------------------- */
.odsadZleva {padding: 0em 0em 0em 1em;}

.doOrder{font-weight: bold;}





#hidenavig,#hidenavig span {display: inline-block;transition: all .4s;box-sizing: border-box;}
#hidenavig {--w:40px;--h:30px;--s:4px;position: relative;width: var(--w);height: var(--h);background: none;border: none;appearance: none;cursor: pointer;grid-column: -2/-1;grid-row: 2/3;justify-self: end;align-self: center;margin: 0.5em 0;}
#hidenavig span {position: absolute;left: 0;width: 100%;height: var(--s);background: var(--barva01);border-radius: 4px;}
#hidenavig:hover span{background:var(--barva01);}
#hidenavig span:nth-of-type(1) {top: 0;}
#hidenavig span:nth-of-type(2) {top: calc(50% - var(--s)/2);}
#hidenavig span:nth-of-type(3) {bottom: 0;}

:where(#hidenavig,.hidenavig).active span:nth-of-type(1) {transform: translateY(calc((var(--h)/2 - var(--s)/2))) rotate(-45deg);}
:where(#hidenavig,.hidenavig).active span:nth-of-type(2) {opacity: 0;}
:where(#hidenavig,.hidenavig).active span:nth-of-type(3) {transform: translateY(calc(-1*(var(--h)/2 - var(--s)/2))) rotate(45deg);}


/*-_-respo-_-*/
@media only screen and (max-width:0px) {}
@media only screen and (max-width:1025px) {
	#Container #centerC #leftC{width:auto;margin:0 0.75em 0 0;}
	#Container #centerC #contentC{width:auto;padding:0 0.25em;}
	#Container #centerC #rightColumnC{width:auto;margin:0 0 0 0.75em;}
}
@media only screen and (max-width:900px) {
	#Container #centerC{grid-template-columns: auto 1fr;grid-template-rows: repeat(2,auto) 1fr;}
	#Container #centerC #leftC{}
	#Container #centerC #contentC{}
	#Container #centerC #rightColumnC{grid-column:1/2;grid-row:2/3;margin:0 0.75em 0 0;}
	
	#rightColumn ul#obrazkoveul,#rightColumn #aktualityBlock{float:none;}
	#rightColumn ul#obrazkoveul{display:flex;flex-direction: column;}
}
@media only screen and (max-width:850px) {
	#Container #topBanner #searchBlockC{grid-column: 2/-2;grid-row: 1/2;place-self: end;margin: 0 1em 0 0;}
	#Container #topBanner #jazyky{margin:0}
	#Container #topBanner #topNavig{grid-column: 2/-1;place-self: end;margin:0}
}
@media only screen and (max-width:700px) {
	#Container #topBanner{padding-top: 0.75em;}
	#Container #topBanner #logoC,#Container #topBanner #logoC h1,#Container #topBanner #logoC a{width: 60px;height: 60px;margin: 0;padding: 0;box-sizing: border-box;display: block;}
	#Container #topBanner #logoC{background:url('../images/mini-logo.png') no-repeat;background-size:contain;margin: 0;grid-row: 1/-2;align-self: center;}
    #Container #topBanner #topNavig{margin: 0.5em 0 0 0;justify-self: end;}
	#Container #topBanner #topNavigC > ul:not(.leftNavig){display:flex;}
	#Container #topBanner #topNavigC > ul:not(.leftNavig) li{padding:0;float:none;}
	#Container #topBanner #topSlider{margin:0.75em 0 0 0;}
	
}
@media only screen and (min-width:651px) {
	#hidenavig{display:none;}
	.leftNavig{display:none;}
}
@media only screen and (max-width:650px) {
	#Container #centerC{grid-template-columns: 100%;grid-template-rows: auto 1fr auto;}
	#Container #centerC #leftC{grid-column:1/-1;grid-row:2/3;margin:0;max-width:none;}
	#Container #centerC #contentC{grid-column:1/-1;grid-row:1/2;}
	#Container #centerC #rightColumnC{grid-column:1/-1;grid-row:3/4;margin:0;}
	
	#rightColumn ul#obrazkoveul{flex-direction:row;flex-wrap: wrap;justify-content: center;}
	
	#leftNavigC{display:none;}
	#Container #topBanner #topNavig{position:relative;}
	#Container #topNavig:not(.active) #topNavigC{display:none;}
	#Container #topBanner #topNavigC{position:absolute;top:0;right:0;display:flex;flex-direction:column;min-width: 290px;z-index: 33;background: var(--barva01);border-radius: 18px 0 0 18px;overflow: hidden;}
	#Container #topBanner #topNavigC ul{display:flex;flex-direction:column;}
	#Container #topBanner #topNavigC ul.leftNavig{order:-1;}
	#Container #topBanner #topNavigC ul > li{padding: 0;margin: 0;background: none;}
	#Container #topBanner #topNavigC ul > li > a{border-radius: 0;background: transparent;text-align: right;padding: 0.5em 1em;transition: all ease 0.3s;}
	#Container #topBanner #topNavigC ul > li:is(:hover,.actual) > a{background: #b0cc78;}

}
@media only screen and (max-width:500px) {
	#topNavig li a{padding:0.4em 0.65em;}
}
@media only screen and (max-width:380px) {
	#Container #topBanner{grid-template-rows: repeat(3,auto) 1fr;}
	#Container #topBanner #jazyky{grid-column:-3/-1;grid-row:1/2;}
	#Container #topBanner #searchBlockC{grid-column:-3/-2;grid-row:2/3;margin:0 1em 0 0;justify-self:center;align-self: center;}
	#Container #topBanner #topNavig{grid-column:-2/-1;grid-row:3/4;}
}


/* #Container #topBanner{display:none;} */
/* #Container #centerC{display:none;} */
/* #Container #bottomC{display:none;} */