@charset "utf-8";
/* CSS Document */

/*html, body {height:100%}    ešte otestovat */

@font-face {
    font-family: 'pirulenregular';
    src: url('pirulen_rg-webfont.eot');
    src: url('pirulen_rg-webfont.eot?#iefix') format('embedded-opentype'),
         url('pirulen_rg-webfont.woff') format('woff'),
         url('pirulen_rg-webfont.ttf') format('truetype'),
         url('pirulen_rg-webfont.svg#pirulenregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ralewayregular';
    src: url('raleway-regular-webfont.eot');
    src: url('raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('raleway-regular-webfont.woff2') format('woff2'),
         url('raleway-regular-webfont.woff') format('woff'),
         url('raleway-regular-webfont.ttf') format('truetype'),
         url('raleway-regular-webfont.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
  font-family: 'Verdana';
  src: url('Verdana.eot?#iefix') format('embedded-opentype'),  url('Verdana.woff') format('woff'), url('Verdana.ttf')  format('truetype'), url('Verdana.svg#Verdana') format('svg');
  font-weight: normal;
  font-style: normal;
}

* {box-sizing: border-box;}

html {
font-size:100.01%;
color:#fff;
margin:0;
padding:0;
height:100%;
background-color:#1b2f48;
}

#mainBackDiv { 
width: 100%;
height: 100%;  
position: fixed;
top: 0;
left: 0;
z-index:-2; 
background-repeat:no-repeat;
background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.bg1 {background-image: url(../BACKS/back-1.jpg);}

.blured { -webkit-filter: blur(5px); filter: blur(5px); opacity:0.4; transition: all 0.3s ease-in;}
.unblur {-webkit-filter: blur(0px); filter: blur(0px); opacity:1;}

body {
font-family: ralewayregular, Verdana, Arial, Helvetica, sans-serif;
font-size:85%;
color:#ccc;
min-height:100%;
}

body, ul, p {
margin:0;
padding:0;
}

.responsive {width: 100%; /*  max-width: 320px;   */ height: auto;}
.responsive1 {width: 100%;   height: auto;}
.responsive2 {width: 95%;  max-width: 454px; height: auto; opacity: 0.5;}
.responsive3 {width: 95%;  max-width: 350px; height: auto;}

img { border:0}

:focus {outline:none;}
::-moz-focus-inner {border:0;}

.obsah {width:90%;}
.obsah img {width:100%; max-width: 560px; height: auto;}

#mainContainer
	{
	padding: 0;
	margin: 0;
	background:  linear-gradient(to bottom, rgba(000, 000, 000, 0.6) 0%, rgba(000, 000, 000, 0.0) 220px);
	}
	
#header
	{
	height:130px;
	max-width:1400px;
	width:100%;
	margin: 0 auto; /*pridal som ja*/
	}

.mainheader{
	position: relative;
	/*! float:right; */
	/*! right:0; */
	top:60px;
	/*! text-align:right; */
	/*! font-size:100%; */ 
	color:#fff;
	font-family: pirulenregular, Verdana, Arial, Helvetica, sans-serif;
	text-shadow: 2px 2px 1px rgba(0,0,0,1.0);
	font-weight: bold;
	margin: 0 auto;
	width: 100ˇ;
	max-width: 600px;
}

.mainheader p {text-shadow: 2px 2px #000;}

#MainWrapper {
	position:relative;
	/*! max-width:1400px; */
	margin: 0 auto;
	padding:0;
	}

#MenuContentWrapper {
position: relative;
/*! float:left; */
width:100%;
min-height:720px;
/*! margin: 0 auto; */
}

#ContentBlock {
position: relative;
height:100%;
margin: 90px 0 0 0px;
min-height:750px;
}

.ContentBack1 {
/*! float:right; */
margin: 10px auto 0 auto;
font-size:130%;
line-height: 15px;
height:100%;
/*min-height:750px;*/
width:100%;
/* min-width:270px; */
max-width:850px;
background: rgba(0,10,20,.5);
}

.contentTwo {
position:relative;
line-height: 1.5em;
min-height:630px;
margin-left:0px;
backdrop-filter: blur(2px);
-webkit-backdrop-filter: blur(2px);
}

#footer {
clear:both;
position:relative;
margin: 0 0 0 15px;
/*! width:100%; */
height:60px;
max-width:1300px;
}

.gdline {
position:absolute;
top:8px;
left:0px;
padding:0px;
width:100%;
color:#888;
}

.pagetext {
position:relative;
top:30px;
color:#ddd;
width:100%;
max-width:570px;
line-height:1.5em;
margin-bottom:30px;
min-height:400px;
}

.rottext {
  position:absolute;
  display:block;
  margin: 182px 0px 0px -217px;
  width: 400px;
  font-family: pirulenregular, Verdana, Arial, Helvetica, sans-serif;
  height:auto;
  font-size:200%;
	color:#b18f4b;
  -ms-transform:rotate(270deg); /* IE 9 */
  -moz-transform:rotate(270deg); /* Firefox */
  -webkit-transform:rotate(270deg); /* Safari and Chrome */
  -o-transform:rotate(270deg); /* Opera */
}

.rottext p {float:right; text-align:right;  padding:9px 3px 20px 10px;  /*! background-color:#aaa; */ text-shadow:1px 1px 1px rgba(0,0,0,1.0) }

.referencetext {float:left; width:95%;}

.darktext {color:#024;}

.bio {padding-left:50px; width:100%;}
.bio span {color:#fff; font-weight:bold;}
.bio p {color:#bbb;}
.bio .nadpis {float:right; color:#0cf; font-size:180%; font-weight:normal; line-height:25px}

.text2 {font-size:120%; line-height:1.3em;}
.text3 {font-size:140%; line-height:1.5em;}

a         {/*! font-weight:bold; */ text-decoration:none;}
a:link    {color:#eee}
a:visited {color:#eee}
a:hover   {color:#b00;}
a:active  {color:#b00} 

.hid {visibility:hidden;}
.vis {visibility:visible;}

h3 {color:#fff;}

hr {
clear: both; 
margin:0;
padding:0;
}

hr.thin {
height: 1px;
border: 0px;
background-color: #888;
margin: 10px 0 10px 0;
width: 100%;
}

#MenuBlock {
	position: relative;
	width:650px;
	font-size:120%;
	line-height:1.7em !important;
	font-family: pirulenregular, Verdana, Arial, Helvetica, sans-serif;
	text-shadow: 2px 2px 1px rgba(0,0,0,1.0);
	letter-spacing: 0.2em;
	margin: 0 auto;
}	

#MenuBlock a {
	position: relative;
	float: left;
	margin:10px 0px 0 20px;;
	<!--background:rgba(255, 255, 255, 0.1); -->
	color:#fff;
	text-align:center;
	padding: 0px 10px 0px 10px;
}

#MenuBlock a:hover {background:rgba(255, 255, 255, 0.3); color: white;}

#MenuBlock a.current {
background-color:#ccc;
color:#000;
text-shadow:none;
}

#extmainmenu {
margin-top:20px;
}

/* -------------------- MEDIA STUFF ------------------------ */

#rmbutt {
	position:absolute;
	top:20px;
	left:10px;
	cursor:pointer;
	display:none;
	z-index:100;
}

@media screen and (min-width:799px) {
	#MenuBlock {display:block !important;}	
} 

@media screen and (max-width:798px) {
	#MenuBlock {
		display:none;
		position:absolute;
		top:100px;
		height:11em;
		width: 350px !important;
		margin-left: 50px;
		z-index:100;
	    background: rgba(10,10,10,0.9); 
		padding:0 20px 0 20px;
		border: 1px solid #888;
		border-radius: 10px;		
		}
	
	#MenuBlock a {width:250px; font-size: 120%;}	

	.mainheader {top: 30px; height:50px;}
	.mainheader img {margin-left:20%; width:300px;}
	#header {height:80px;}
	
	#extmainmenu {margin-top:10px;}	
	#rmbutt {display:block;}
	#mainContainer {min-width: 400px;}
	#ContentBlock {margin-left: 40px; margin-top: 30px; max-width: 100%;}
}