@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Open+Sans&family=Staatliches&display=swap');
@import url(//fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);*!
@font-face { /* H1-uvod */
 	font-family: 'Open Sans', sans-serif;
	font-family: 'Staatliches', cursive;
	font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif;
}
@font-face {
  font-family: "FontAwesome";
  src: url('../fonts/fontawesome-webfont.eot');
  src: url('../fonts/fontawesome-webfont.eot?#iefix') format('eot'), url('../fonts/fontawesome-webfont.woff') format('woff'), url('../fonts/fontawesome-webfont.ttf') format('truetype'), url('../fonts/fontawesome-webfont.svg#FontAwesome') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* color scheme Scholar: Hex: 333D51 / D3AC2B / CBD0D8 / F4F3EA */
/* -> color scheme  brisk: Hex: 4C4556 / 872642 / F6C026 / A0D3F9*/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
	font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif;
	color:#872642 ;
	
}

/* -> color scheme Scholar: Hex: 333D51 / D3AC2B / CBD0D8 / F4F3EA */
/* color scheme  brisk: Hex: 4C4556 / 872642 / F6C026 / A0D3F9 https://www.color-hex.com/color-palette/95221 
   color scheme brisket: https://www.color-hex.com/color-palette/22540*/
.row {
  max-width: 100%;
  }
 hr {
  max-width:100vw; 
  margin:1rem 0 2rem;
  }
html{
	height: 100vh;
	scroll-behavior: smooth;
}
body {
	font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif;
  /* 	margin-left:-2rem; */
  	background-color: #F4F3EA;
 }
 .top-bar{
 	color:#333D51;
 	background-color: #F4F3EA;
 	min-height:2rem;

 }
 h1{
		margin:0!important;
		/* font-weight: 400; */
		letter-spacing: 8px;
	/* 	font-size:2rem; */
		display: block-inline;
}

@media screen and (orientation:portrait){
	h1{
			margin:0!important;
			font-weight:bold;
		
	}
	.i-top-bar,.top-bar-right{
		text-align: left;
	}
	.footer-left,.footer-right{margin:0; text-align:left;}
}
@media screen and (orientation:landscape){
	h1{
			margin:0!important;
			font-weight:bold;
			letter-spacing: 8px;
		font-size:1.5rem;
	}
	.i-top-bar, .top-bar-right{
		text-align: right;
	}
}
 header{
 		background-color: #F4F3EA;
 }
} 
 @media screen and(min-width:3000px)and (orientation: landscape) {
	h1{
		font-size:2.5rem!important;
	}
 }
 /*  ul#main-menu{
 background-color: transparent!important;
 
 } */
  ul#main-menu{
  position:relative;
  top:-2.5rem;
  }
  @media screen and (orientation: landscape){
	ul#main-menu{
  position:inherit;
  top:-2.5rem;
   }
}
 #main-menu .button{
 	background-color: transparent;
 } 
 #main-menu  a:hover{
	color:#df8934;
	text-decoration: underline;
 } 
  i[class*="i-top-bar"]{
  /* 	color:#4C4556 ; */
  	color:#872642;
  	margin-right: .5rem;/*  */
  }
  i[class*="i-headicon"]{
  /* 	color:#4C4556 ; */
  	color:#872642;
  	text-align: center;
  	margin: 1rem auto 1rem ;
  }
 .top-bar h1{
 	display:inline-block;
 	font-weight: bold;
 	
 }
 .top-bar a{
 	color:#4C4556;
 	background-color: transparent!important;
 }
 
 .top-bar a:hover{
 	color:#872642;
 	
 }
 .pic-uvod{
 	background-image:url(../images/jindrichuv_hradec-zamek.jpg);
 	background-repeat: no-repeat;
 	background-position: top center;
 	background-size:cover;
 	/* background-color: #F4F3EA; */
 	max-width:100vw;
 	min-height:90vh;
 }
 .img-shadow{
  display:block;
  margin: 0 auto 2.5rem;
 	-webkit-box-shadow: 0 16px 38px -12px rgba(0,0,0,.56),0 4px 25px 0 rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2);
  -moz-box-shadow: 0 16px 38px -12px rgba(0,0,0,.56),0 4px 25px 0 rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2);
  box-shadow: 0 16px 38px -12px rgba(0,0,0,.56),0 4px 25px 0 rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2);
 }
 
.content{
 background-color: rgba(255,255,255,.65);
 max-width:100%;
 margin:-1.5rem auto 0 ;
 /* padding:1rem; */
 min-height:50vh;
}


section{
padding:1rem;
	margin: auto!important;
}
.card{
	display:table-cell;
	max-width: 20vw!important;
	padding: 1rem;
	min-height:50vh;
}

footer{
	margin:2rem;
}
.footer-left{margin-left:1.5rem; text-align:left;}
.footer-right{margin-right:1.5rem; text-align:right;}
 footer iframe{
	display:block; 
	margin:auto;
	border:none;
	width:100vw;
	min-height:300px;
}

@media screen and (max-width:720px){
ul#main-menu{
  position:inherit;
 top:0;
  }
		.pic-uvod{
 		display:none;
 		}
 		.card{
			display:block;
			padding: 1rem;
			min-width:95%;
			min-height:auto;
		}

		body{
			font-size:0.8rem;
		}
   	.content{
  	 		height: 100vh!important;
  			width:100vw!important;
  			margin:-1.5rem auto 0!important ;
  		}
  			.i-top-bar-0{
	 			margin:0 auto!important;
	 			display:block!important;
	 	}
  		.i-top-bar-1{
	 		margin: 0 8px 0 0!important;
	 	}
  		.i-top-bar-2{
			margin: 0 5px 0 8px!important;
 		}
 		.i-top-bar-3{
 			margin:0 auto!important;
		}
		.footer-left,.footer-right{margin:0; text-align:right;}
		footer iframe{
	display:block; 
	margin:auto;
	border:none;
		width:80vw;
	min-height:300px;
	}



}

/***************************btn- nahoru************************/
button#btnTopPage {
	width: 35px;
	height: 35px;
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 35px;
  border: none;
  outline: none;
  background-color: white;
  color: red;
  cursor: pointer;
  border-radius: 20px;
}

button#btnTopPage:hover {
  background-color: red;
  color: white;
}
/********************** paginator*******************/
ul.pages
{
list-style:none;
display: block;
overflow: hidden;
padding:10px;
text-align:center;
margin-left: auto;
margin-right: auto;
width:30%;
/*background-color:#3a3427;*/
 background-color:transparent;
}
@media screen and (max-width:720px){
ul.pages{width:90%;margin:.5rem auto;}
}
ul.pages li{
float: left;
cursor: pointer;
padding:3px;
margin:1px;
background-color: #ececec;
color:black;
font-weight: normal;
border:1px solid gray;
}
ul.pages li.active{
 
background-color:#1f8ab5;
color:black;
}