.clearfix   { clear:both !important; height: 0px !important; width:100% !important }

.nnx-cms { line-height: 170% !important; font-size: 100%  } 

.nnx-cms b { font-weight: 500 }
.nnx-cms a { text-decoration: underline }


a.nnx-seemore { display: inline-block; float: left; position: relative; border-bottom: 1px solid transparent; transition:border-color .4s ease-in-out }
a.nnx-seemore:after { content: "\f0da"; font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; font-size: 100%;padding-right: 0.5em;position: relative; left: 5px;}
a.nnx-seemore:hover { border-color: #b4b4b4 }

a.nnx-extlink { display: inline-block; float: left; position: relative; border-bottom: 1px solid transparent; transition:border-color .4s ease-in-out }
a.nnx-extlink:after { content: "\f08e"; font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; font-size: 100%;padding-right: 0.5em;position: relative; left: 5px;}
a.nnx-extlink:hover { border-color: #b4b4b4 }


.nnx-cms iframe { width: 100% }

.nnx-cms h1 { font-size: 240%; font-weight: 200; color:#515152; border-left:5px solid #ffba00; padding: 0 0 0px 15px !important; margin: 0 0 20px 0; line-height: 120%  }
.nnx-cms h1.subtitle { font-size: 200%; font-weight: 200; color:#515152; border-left:5px solid #ffba00; padding: 0 0 0px 15px !important; margin: 0 0 20px 0; line-height: 100%  } 
.nnx-cms h1.subtitle small { font-size: 50%; margin-top:-50px; display: inline-block; color: #737373 !important; font-weight: 300 !important }
.nnx-cms h2 { font-size: 140%; font-weight: 500; color:#515152; padding: 0 0 10px 0; margin: 0; line-height: 120%; }
.nnx-cms h3 { font-size: 130%; font-weight: 600; color:#ffba00; padding: 0 0 10px 0; margin: 0; line-height: 120%; }


/* table */
.nnx-table-default { width: 100% }
.nnx-table-default td { padding-right: 8px; font-weight: 400 }


/* hr */
.nnx-cms hr { clear: none; width: 100%; height: 10px; background:transparent; display: block; margin: 5px 0; border-top:none; border-left: none; border-right: none }
.nnx-botype-solid  { border-style: solid }
.nnx-botype-dotted { border-style: dotted }
.nnx-botype-dashed { border-style: dashed }

.nnx-bocol-l_silver { border-bottom-color: #eaeaea }
.nnx-bocol-silver   { border-bottom-color: #e3e3e3 }
.nnx-bocol-gray     { border-bottom-color: #b1b1b1 }
.nnx-bocol-blue     { border-bottom-color: #257ed0 }
.nnx-bocol-l_blue   { border-bottom-color: #00bbff }

.nnx-bowidth-1px    { border-bottom-width: 1px }
.nnx-bowidth-3px    { border-bottom-width: 3px }
.nnx-bowidth-6px    { border-bottom-width: 6px }

.nnx-cms hr.nnx-preHR-default { border-bottom:1px solid silver }
.nnx-cms hr.nnx-preHR-pre1    { border-bottom:1px solid #257ed0 }
.nnx-cms hr.nnx-preHR-pre2    { border-bottom:1px solid #fff }
.nnx-cms hr.nnx-preHR-pre3    { border-bottom:3px solid silver }
.nnx-cms hr.nnx-preHR-pre4    { border-bottom:3px solid #257ed0 }



/* columns */
.nnx-col { /*padding: 5px;*/ overflow: hidden; box-sizing: border-box   }

/* width */
.nnx-width-5 { width: 5% }
.nnx-width-10 { width: 10% }
.nnx-width-15 { width: 15% }
.nnx-width-20 { width: 20% }
.nnx-width-25 { width: 25% }
.nnx-width-30 { width: 30% }
.nnx-width-33 { width: 33.3% }
.nnx-width-35 { width: 35% }
.nnx-width-40 { width: 40% }
.nnx-width-45 { width: 45% }
.nnx-width-50 { width: 50% }
.nnx-width-55 { width: 55% }
.nnx-width-60 { width: 60% }
.nnx-width-65 { width: 65% }
.nnx-width-70 { width: 70% }
.nnx-width-75 { width: 75% }
.nnx-width-80 { width: 80% }
.nnx-width-85 { width: 85% }
.nnx-width-90 { width: 90% }
.nnx-width-95 { width: 95% }
.nnx-width-100 { width: 100%; clear: both; width:100% !important }

/* colors */
.nnx-bg-silverLight { background: #eaeaea; padding: 10px }
.nnx-bg-silver { background: silver; padding: 10px}
.nnx-bg-gray { background: gray; padding: 10px }
.nnx-bg-blue { background: #257ed0; padding: 10px; color: #fff }


/* float */
.nnx-float-left { float:left }
img.nnx-float-left { margin:  10px 20px 10px 0 }
.nnx-float-right { float:right }
.nnx-float-none { float:none }
.nnx-float-center { float:none; margin-left: auto; margin-right: auto }


/* align */
.nnx-align-left { text-align: left }
.nnx-align-right { text-align: right }
.nnx-align-center { text-align: center }
.nnx-align-justify { text-align: justify } 


/* image */
.nnx-img { max-width: 100% }


/* button */
.nnx-button { display: inline-block; color: #fff; text-decoration: none !important; background: #5ec5ff; padding: 4px 10px 2px 10px; border-radius: 12px; transition: background .2s ease-in-out; cursor: pointer  }
.nnx-button:after { content: "\f08e"; font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; font-size: 100%;padding-right: 0.5em;position: relative; left: 10px;}
.nnx-button:hover { background: #3486F8; color: #fff; text-decoration: none }

.nnx-button-big { display: inline-block; padding: 8px 16px; background: silver; color: black; border-radius: 4px;  }
.nnx-button-sized { display: inline-block; padding: 4px 8px; background: silver; color: black; border-radius: 4px; min-width: 150px; margin: 0 5px 5px 0 }
.nnx-button-sized:hover { background: #e6e6e6; text-decoration: none }


/* font */
.nnx-font-70 { font-size: 70% }
.nnx-font-80 { font-size: 80% }
.nnx-font-90 { font-size: 90% }
.nnx-font-110 { font-size: 110% }
.nnx-font-120 { font-size: 120% }
.nnx-font-130 { font-size: 130% }
.nnx-font-140 { font-size: 130% }
.nnx-font-150 { font-size: 140% }
.nnx-font-160 { font-size: 150% }

/* ULLI */
.ulli-block {display: block; position:relative; padding-left: 30px; min-height: 20px; font-weight: 200; margin:12px 0 12px 0; }
.ulli-block i.fa { position: absolute; left:0; top:2px;font-size: 110% }
.ulli-block.cogs i, .ulli-block.check i { color: #52AE3A; font-size: 130% }
.ulli-block.pin { padding-left: 20px }
.ulli-block.pin i { color: #52AE3A; font-size: 130% }
.ulli-block.quest i { color: #153d89; font-size: 130% }
.ulli-block.minus i { color: #52AE3A; font-size: 130% }
.ulli-block.quest { padding-top: 3px}



/* boxy - automaticky formatovane z externich skriptu */


/* předdefinované boxy */
.nnx-pre-sidebar { float: right; box-sizing: border-box; background: #f5f5f5; padding: 15px; font-size: 85%; line-height: 150%; width: 26% }

.nnx-pre-graybox1  { padding: 15px; margin: 0 1%; background: rgba(187, 187, 187, 0.20); width: 98%; float: left; min-height: 200px }
.nnx-pre-graybox2 { padding: 15px; margin: 0 1%; width: 98%; float: left; border-left:1px solid #6815a2 }
.nnx-pre-graybox3 { padding: 15px; margin: 0 1%; background: rgba(187, 187, 187, 0.20); width: 98%; float: left }

.nnx-pre-cntr { height: 150px; width: 150px; float: left; text-align: center; font: 0/0 a; margin: 5px; border: 1px solid transparent; padding:5px }
.nnx-pre-cntr img { vertical-align: middle; max-height: 90%; max-width: 90% }
.nnx-pre-cntr:before { content: ' '; display: inline-block; vertical-align: middle; height: 100%; }




/* Gallery */
.g-icon-box { display: block; float:left; border: 1px solid #e8e8e8; float: left; margin: 6px }
.g-icon-box div { background-repeat: no-repeat; background-position: center center; background-size: cover; overflow: hidden; height: 150px; width: 190px; }
.g-icon-box:hover { border: 1px solid #00b1f1 }


/* Auth page */
.page-auth { max-width: 260px; margin-top: 15px }
.page-auth input[type='text'], .page-auth input[type='password'] { margin-bottom: 8px; width: 100%; font-size: 100%; padding: 3px 5px; border-radius:3px }
.page-auth input[type='submit'] { margin-bottom: 8px; font-size: 100%; padding: 5px 12px; border:0; border-radius:3px; color: #fff; background: #184e8f }




@media screen and (max-width: 820px) {  
    
    .nnx-col { margin-bottom: 15px } 
     
    .left-menu { margin-bottom: 25px }

	.nnx-width-5 { width: 20% }
	.nnx-width-10 { width: 30% }
	.nnx-width-15 { width: 30% }
	.nnx-width-20 { width: 50% }
	.nnx-width-25 { width: 50% }
	.nnx-width-30 { width: 50% }
	.nnx-width-33 { width: 50% }
	.nnx-width-35 { width: 50% }
	.nnx-width-40 { width: 100% }
	.nnx-width-45 { width: 100% }
	.nnx-width-50 { width: 100% }
	.nnx-width-55 { width: 100% }
	.nnx-width-60 { width: 100% }
	.nnx-width-65 { width: 100% }
	.nnx-width-70 { width: 100% }
	.nnx-width-75 { width: 100% }
	.nnx-width-80 { width: 100% }
	.nnx-width-85 { width: 100% }
	.nnx-width-90 { width: 100% }
	.nnx-width-95 { width: 100% }
	.nnx-width-100 { width: 100%; clear: both; width:100% !important }
	
	.g-icon-box { width: 45%; box-sizing: border-box }	
	.g-icon-box div { background-repeat: no-repeat; background-position: center center; background-size: cover; overflow: hidden; height: 200px; width: 100%; }	

}


@media screen and (max-width: 620px) {  

    .nnx-box-event  { width: 100%; margin-bottom: 10px }
    
	.nnx-width-5 { width: 50% }
	.nnx-width-10 { width: 50% }
	.nnx-width-15 { width: 15% }
	.nnx-width-20 { width: 100% }
	.nnx-width-25 { width: 100% }
	.nnx-width-30 { width: 100% }
	.nnx-width-33 { width: 100% }
	.nnx-width-35 { width: 100% }
	.nnx-width-40 { width: 100% }
	.nnx-width-45 { width: 100% }
	.nnx-width-50 { width: 100% }
	.nnx-width-55 { width: 100% }
	.nnx-width-60 { width: 100% }
	.nnx-width-65 { width: 100% }
	.nnx-width-70 { width: 100% }
	.nnx-width-75 { width: 100% }
	.nnx-width-80 { width: 100% }
	.nnx-width-85 { width: 100% }
	.nnx-width-90 { width: 100% }
	.nnx-width-95 { width: 100% }
	.nnx-width-100 { width: 100%; clear: both; width:100% !important }
	
	.g-icon-box { width: 97%; box-sizing: border-box }	
	.g-icon-box div { height: 250px }
}