/* reset.css */
html {margin:0;padding:0;border:0;}
body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, nav, section {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure, dialog, footer, header, hgroup, menu, nav, section {display:block;}
body {line-height:1.5;background:white;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;float:none !important;}
table, th, td {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:'';}
blockquote, q {quotes:"" "";}
a img {border:none;}
:focus {outline:0;}
/* ----------------------------------  End reset css  ----------------------------------------*/


* {
  box-sizing: border-box; /* Základní nastavení sizing box pro flexibilní layout */
}

html, body {
height: 100%;

 
}

body {
	font-family: 'Arima Madurai', Raleway, Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 0em;
	font-size: 1em;
	background-image: url(../images/bg_body.jpg);
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
}



body.Kontakt {
	background-image: url(../images/001.jpg);
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
}




body.Akce, body.Historie, body.Muzeum {

	background-image: none;
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
}


.nadpis{
	font-size: 1.6vw;
	margin: 0.2em;
	padding: 0.5em 0.5em;
	font-family: Raleway, serif;
	font-weight: normal;
	text-align: center;
	text-transform: uppercase;
	color: #B6B6B6;
}



.left {
 
  padding: 20px;
  float: left;
  width: 20%; 
 
}
body.Basic .right {

 border: Black 1px solid;
 border-radius: 2.5em ;
   background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0, 0.6); 

}

body.Basic .right h2, h3, h4, p, td{
	color: White;
}

.main {
  
  padding: 20px;
  float: left;
  width: 60%; 
 
}

.right {
 
  padding: 20px;
  float: left;
  width: 20%; 
  animation: AnimMain 4s ease 1s 1 normal both;
}

.container {

  display: block;
  width: 86%;
  margin: 0px auto;

}



.container:after {
clear: both; 
content: " "; 
display: block;
}

.footer {
	
	 display: block;
	width: 100%;
	margin: 0em auto;
	position: fixed;
	bottom: 0px; 
	border-top: #274F00 1px solid;
  text-align: center;
  background-color: rgb(255,255,255); 
  background-color: rgba(255,255,255, 0.8); 

	
	
}
.footer:hover {
	background-color: #F9F9F9;
}


/* ------------------------------------- IMG ----------------------------------------*/
.img_logo{
	width: 10%;
	position: fixed;
	top: 0.2em;
	right: 2.5em;
	float: right;
	margin: 0.3em 0.5em;
	padding: 0.2em;
	
}

.img_01{
 display: block;
	width: 86%;
	margin: 0.2em auto;
	padding: 0.2em;
	
	
}

.img_02{
 display: block;
	width: 68%;
	margin: 0.2em auto;
	padding: 0.2em;
	
	
}


/* ---------------------------- Style -------------------------------------- */

H1{
	
	font-size: 2em;
	margin: 0.2em;
	padding: 1.4em 0.2em;
	margin: 0em auto;
}

H2 {
	font-size: 1.6em;
	font-weight: bold;
	margin: 0.2em;
	padding: 0.2em 0.5em;
	text-align: left;
}


H3 {
	font-size: 1.4em;
	font-weight: bold;
	margin: 0.2em;
	padding: 0.2em 1.5em;
}

H3.bez_pruhu {
	background-color: transparent;
}

H4{
	
	font-size: 1.2em;
	margin: 0.2em;
	padding: 0.2em 1.5em;
	font-style: oblique;
}



H5 {
	font-size: 1.3em;
	font-weight: bold;
	padding: 0.2em 0.5em;
	
	
	
}

H6 {
	font-size: 1.2em;
	font-weight: bold;
	padding: 0.2em 0.5em;
	
	
	
}

a {
	
	text-decoration: none;
	color: Black;

	
}


.bold {
	font-weight: bold;

	
}

.centred {
	  display: block;
	  margin: 0px auto;
	  text-align: center;

	
}

table {
	font-weight: bold;

	
}

td {
	 padding: 0.2em 0.5em;

	
}

table.four td {
	width: 20%;
	padding: 1.2em 1.5em;
	border: #888888 1px solid;
	 border-radius: 0.25em ;
	text-align: center;
	box-shadow: 3px 5px 2px #6A6A6A;
	background-color: White;
	
	
}



/* Use a media query to add a break point at 800px: */
@media screen and (max-width: 1920px) {

body {
	 font-size: 0.6em;
}


}



/* Use a media query to add a break point at 800px: */
@media screen and (max-width: 800px) {

body {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 0em;
	background-image: none;
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

  .left, .main, .right {
    width: 100%; /* The width is 100%, when the viewport is 800px or smaller */
  }
}


/*  ---------------------------------  Animation framekey --------------------------------*/

@keyframes AnimMain {
	0% {
		opacity: 0;
		
	}

	100% {
		opacity: 1;
		
	}
}