/* CSS Document */
body {
  background: url('img/bg.jpg') repeat-x left top #000;
  font-family: Arial, Arial CE, Helvetica;
  font-size:80%;
  color:#222;
  margin:0;
  }
  
/* default */

p{
  margin-top:0;
}

h2 {
  margin:5px 0;
  font-size: 130%;
}

address{
  margin-bottom:10px;
  margin-left: 40px;
}

img{
  max-width: 100%;
	height: auto;
}

.fRight {
  float: right;
}


/* layout */
.bodyPageMail{
  color:#222;
 }

.page{
  background: url("img/bgPage.png") no-repeat scroll center 60px transparent;
    margin: 0 auto;
    min-height: 594px;
}

.content {
  max-width:670px;
  margin:20px auto;
}

.fotoCista, .fotoHomepage{
  background: url(img/fotoCista.jpg) no-repeat center top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width:89.5%;
  min-height:593px;
  box-shadow: 0 10px 15px -15px #dedede;
  position:relative;
  float: left;
  overflow: hidden;
  -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
 border-radius: 10px;
}

.fotoHomepage{
  /*background: url(img/fotoHomepage.jpg) no-repeat center top;*/
}

.seznamLoga {
  margin:0 0 20px 0;
  padding:0;
}

.seznamLoga li{
  list-style: none;
  float: left;
  margin: 5px 15px 5px 15px;
  min-height:60px;
  min-width:60px;
}

.seznamLoga li a img{
  border:none;
}

.seznamLoga li:first-child{
  margin-left:0;
}

.logo {
  position:absolute;
  display: block;
  -webkit-background-size: contain !important;
  -moz-background-size: contain !important;
  -o-background-size: contain !important;
  background-size: contain !important;
  z-index:10;
}

.divButton{
  margin-top:20px;
  float:left; 
  width:33%; 
  text-align:center;
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.copyright{
  font-size: 0.8em;
}

a {
  color:#fff;
}

.center{
  text-align: center;
}

.footer{
  background: url("img/bgTransform.png") no-repeat scroll 0 0 transparent;
  min-height: 164px;
  color:#b9b9b9;
  float: right;
  width: 89.5%;
  background-size:contain;
  font-size: 90%;
  
}

/* menu */

.menu{
  width:70px;
  float:left;
}

.menu ul{
  margin:0;
  padding:0;
}

.menu li {
  padding:0;
  margin:5px 0;
  list-style-type: none;
}

.menu li:first-child {
  margin-top: 0;
}

/* loga */


.maps{
    background: url("loga/Czech-Republic_icon.png") no-repeat scroll left top transparent;
    height: 75px;
    left: 250px;
    top: 500px;
    width: 23%;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='loga/Czech-Republic_icon.png',sizingMethod='scale');
    background:none \0/; /* IE8 HACK */
}

.lev{
       background: url("loga/lev_icon.png") no-repeat scroll left top transparent;
    height: 95px;
    left: 280px;
    top: 485px;
    width: 14%;
}
/*.galery {
  top:10px;
  left:320px;
  width:270px;
  height:500px;
}
*/
.facebook {
  display: block;
  top:70px;
  left:-60px; 
  width:50px;
  height:50px;
  background: url(loga/facebook.png) no-repeat left top;
}

.twitter {
  display: block;
  top:70px;
  left:-60px; 
  width:50px;
  height:50px;
  background: url(img/twitter.png) no-repeat left top;
}

.youtube {
  display: block;
  top:130px;
  left:-60px; 
  width:50px;
  height:50px;
  background: url(loga/youtube.png) no-repeat left top;
}

.vimeo {
  display: block;
  width:50px;
  height:50px;
  background: url(img/icVimeo.png) no-repeat left top;
}

.instagram {
  display: block;
  width:50px;
  height:50px;
  background: url(img/icInstagram.png) no-repeat left top;
}

.gallery {
  display: block;
  top:10px;
  left:-60px; 
  width:50px;
  height:50px;
  background: url(loga/galerie.png) no-repeat left top;
}

.gallery1 {
  top:10px;
  left:205px; 
  width:50px;
  height:50px;
  background: url(loga/galerie.png) no-repeat left top;
}

.biography_logo {
  display: block;
  top:190px;
  left:-60px;
  width:50px;
  height:50px;
  background: url(loga/biography_logo.png) no-repeat left top;
}

.biography_logo1 {
  top:250px;
  left:-60px;
  width:50px;
  height:50px;
  background: url(loga/biography_logo.png) no-repeat left top;
}

.mail {
  display: block;
  top:250px;
  left:-60px;
  width:50px;
  height:50px;
  background: url(loga/Mail.png) no-repeat left top;
}

.rss {
  display: inline-block;
  margin:0 10px;
  width:16px;
  height:16px;
  background: url(img/rss.png) no-repeat left 3px;
}

.radek {
  top:70px;
  left:45px;
  width:180px;
  height:201px;
  background: url(loga/radek.jpg) no-repeat left top;
 }
 
.radek1 {
  top:70px;
  left:45px;
  width:180px;
  height:201px;
  background: url(loga/radek1.jpg) no-repeat left top;
 }
  
.home {
  display: block;
  top:10px;
  left:10px; 
  width:50px;
  height:50px;
  background: url(loga/home.png) no-repeat left top;
}

.partners {
  top:10px;
  left:32px; 
  width:220px;
  height:57px;
  background: url(loga/partners.png) no-repeat left top;
}


.biography {
  top:250px;
  left:45px; 
  width:180px;
  height:44px;
  background: url(loga/biography.png) no-repeat left top;
}

.contactBlock{
  top:270px;
  left:10px;
}

/* barvy */
.blue {
  color:#3B47CF;
}

.grey {
  color:#222;
}

.shadowTextWhite{
  text-shadow: 1px 1px 2px #fff;
}

.tabForm td{
  vertical-align: middle;
}

/* form */
input, textarea { 
	padding: 5px;
	border: solid 1px #ccc;
	outline: 0;
	background: #FFFFFF;
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
	box-shadow: rgba(0,0,0, 0.2) 0px 0px 8px;
	-moz-box-shadow: rgba(0,0,0, 0.2) 0px 0px 8px;
	-webkit-box-shadow: rgba(0,0,0, 0.2) 0px 0px 8px;
	}
	
textarea {
  height:75px;
}

input[type='text'], textarea{
  width:250px
}

input:hover, textarea:hover,
input:focus, textarea:focus { 
	border-color: #aaa; 
}

.submit input {
    background: none repeat scroll 0 0 #444;
    border: 0 none;
    color: #FFFFFF;
    cursor: pointer;
    padding: 5px 15px;
    width: auto;
    margin-top: 5px;
    
}

.submit input:hover
{ 
	background: none repeat scroll 0 0 #222;
}

input[type='text'].hasRealPerson{
  width:50px;
}

.error {
  color:red;
}


#tooltip
		{
			font-size: 0.875em;
			text-align: center;
			text-shadow: 0 1px rgba( 0, 0, 0, .5 );
			line-height: 1.5;
			color: #000;
			background: #fff;
			background: rgba( 255, 255, 255, .9 );
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			border-radius: 5px;
				
			position: absolute;
			z-index: 100;
			padding: 5px 10px;
		}
			#tooltip:after
			{
		        width: 0;
		        height: 0;
		        border-left: 10px solid transparent;
		        border-right: 10px solid transparent;
				border-top: 10px solid #fff;
		        border-top-color: rgba( 255, 255, 255, .9 );
				content: '';
				position: absolute;
				left: 50%;
				bottom: -10px;
				margin-left: -10px;
			}
				#tooltip.top:after
				{
			        border-top-color: transparent;
					border-bottom: 10px solid #fff;
			        border-bottom-color: rgba( 255, 255, 255, .9 );
					top: -20px;
					bottom: auto;
				}
				#tooltip.left:after
				{
					left: 10px;
					margin: 0;
				}
				#tooltip.right:after
				{
					right: 10px;
					left: auto;
					margin: 0;
				}
				
@media screen and (max-width: 600px) {
  body{
    background:#000;
  
  }
  .menu {
    width:100%;
    text-align: center;
  }
  
  .menu ul {
    display:inline-block;
    margin-bottom:5px;
  }
  
  .menu li {
    float:left;
    margin:0 5px;
  }
  
  .footer {
    width: 100%;
  }
  
  .divButton {
    display: inline-block;
    float: none;
    margin-top: 0;
    width: auto;
}

  .fotoCista, .fotoHomepage{
    width: 100%;
  }
  
  .contactBlock {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.4);
    padding: 5px 10px;
    }
    
  .footer, .page {
    background:none;
  }
}

