@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,700,900&display=swap&subset=latin-ext');

BODY { 
background-color: #fff;
font-family: 'Montserrat', sans-serif;
color: #333;
font-size: 14px;
margin: 0px auto 0px auto;
padding: 0px;
width: 100%; 
}

p { font-family: 'Montserrat', sans-serif; color: #333; }
b { color: #000; }

.obalovaci { margin: 0px auto 0px auto;  position: relative; width:100%; max-width: 1200px; }
.row{ display: inline-block; width: 100%; margin: 0px; padding: 20px 0px 20px 0px; text-align: center;  background-color: #fff;}
.spacer {display: inline-block;  width: 96%; padding: 2% 4% 2% 4%; margin: 0px; /* text-align: left; */ }
.topslider {/* background-size: cover; */ background-size: 100% ; background-attachment: fixed; background-repeat: no-repeat; background-position: top; height:510px; z-index: 1; }
.topslider h1 {color: white; text-shadow: 0 0 3px #878d94;}

a { color: #ccc; text-decoration: none;  }
a:hover { text-decoration: underline; }

.logo { display:block; float: left;  margin:10px; 	padding-top: 7px;  }

/* responsivni menu */
.menu { /*position: absolute;   position: fixed;	*/ width: 100%;	top: 0px;	font-size: 14px; text-align: center; background-color: #fff; }		
ul.topnav {    /*max-width: 1000px; */  list-style-type: none;  margin: 0px;  padding: 24px 0px 20px 0px;  overflow: hidden;  text-align: right; }


  
.topnav li {display: inline-table;   }
ul.topnav li a {	
  display: inline-block; 
  color: #000;
  text-align: center;
  margin: -10px 0px 0px 0px;
  padding: 10px 25px 10px 25px;
  transition: 0.1s;
  border-right: 0px solid #fff;
}

ul.topnav li a:hover {background-color: #666; color: #fff; text-decoration: none; /*margin: -20px 0px -50px 0px; */ /* padding: 10px 66px 10px 66px; */}
ul.topnav li.icon {display: none;}
ul.topnav li.prvni {display: none;}



.gray{ background-image:linear-gradient(45deg, #aaa, #999); display: inline-block; width: 92%; margin: 0px; padding: 4%; text-align: center; color: #fff; }
.gray h3 { color: #fff; font-size: 2.3em; }
.gray p { color: #fff; }
.gray button { border: 1px solid #fff; COLOR: #FFF; }
hr{ height: 1px; 	background-color: #ccc; 	border-bottom-color: #ccc; 	border: 0; 	margin: 20px 0px 20px 0px; }

h1 {		font-size: 2.8em;	color: #000;	font-weight: 800;	line-height: 110%; letter-spacing: -1px;}
h2 {		font-size: 2.0em;	color: #000; 	font-weight: 400;	line-height: 133%; letter-spacing: -1px;} /* headline */
h3 {		font-size: 2.0em;	/* color: #FF8C00; */	font-weight: 800;		line-height: 116%;}
h4 {		font-size: 1.2em;	color: #000;	font-weight: 800;	line-height: 133%; text-transform: uppercase;}
h5 {		font-size: 0.9em;	color: #666; font-weight: 400;	}

.blok_polovina { 	line-height: 133%;  	float: left;	width: 560px;    padding: 0px;	margin: 20px;		text-align: left;}
.blok_ctvrtina {    display: inline-table;	width: 270px;     padding: 10px 10px 10px 10px;	 margin-top: 20px;	margin-bottom: 40px; text-align: center; COLOR: #000; line-height: 1.6;}
.blok_tretina { line-height: 133%;  display: inline-block;	width: 300px;     padding: 20px;}

.ikonky { margin:20px; }
.orange { /* COLOR: #F66201; */ COLOR: #000;}

button { 
padding: 15px 20px 15px 20px; MARGIN: 5px 20px 25px 20px;  COLOR: #333;  font-size: 14px; FONT-WEIGHT: 300; BACKGROUND-COLOR: transparent; CURSOR: pointer; font-family: 'Montserrat', sans-serif;  border-radius: 7px; border: 1px solid #333; }
button:hover { COLOR: #FFF; BACKGROUND-COLOR: #666; /* box-shadow: 2px 2px 14px #666; */ border: 1px solid #fff;}


.blok_ctvrtina ul {list-style: none; margin-left: -1.3em;}
.row-flex ul {list-style: none; margin-left: -1.3em;}
.blok_ctvrtina li::before {content: "⚬"; color: #999;  display: inline-block; width: 1em;  margin-left: -1em; }
.row-flex li::before {content: "⚬"; color: #999;  display: inline-block; width: 1em;  margin-left: -1em; }
.blok_ctvrtina li {padding-bottom:7px;}

/* flexible kontainery */
.row-flex {  display: flex;  flex-wrap: wrap;    padding-bottom: 40px;  box-sizing: border-box;}
.column-flex {text-align:left;  flex: 25%;  max-width: 25%;  padding: 0 14px;  box-sizing: border-box;}

.column-flex div {
  margin-top: 18px;
  padding: 10px 15px 15px 15px;
  vertical-align: middle;
  background-color: white;
  width:100%;
  box-sizing: border-box;
}

.column-flex div:hover {  background-color: #efefef; color: #000; }

.row li { padding-bottom: 5px;  }


.row-imageholder {display: inline-block;  width: 98%; padding: 2%; margin-top: -90px;}
/* imageholdery vyjizdeci */

.imageHolder {float: left;  position: relative; width: 323px; height: 440px;  margin: 10px; padding: 1% 2% 2% 1% ; overflow: hidden;  box-shadow: none; text-align: center;background-color: #fff; border: 1px solid #efefef;} 
.imageHolder:hover { 	box-shadow: 0px 0px 2px #999;}
.imageHolder .caption { 
opacity: 1.0; position: absolute; width: 100%;  bottom: -59px; left: 0px; padding: 5% 5% 5% 0%;  color: #fff; background-color: #aaa; text-align: center; font-weight:normal; font-size: 12px;
		-webkit-transition: all 500ms ease-out;
		-moz-transition: all 500ms ease-out;
		-o-transition: all 500ms ease-out;
		-ms-transition: all 500ms ease-out;	
		transition: all 500ms ease-out;
} 

.caption h3 { font-size:13px;	color: #fff;	font-weight: 300; line-height: 116%; text-align: left;}
.caption b { font-size:14px;	color: #fff;	line-height: 116%; text-align: left;}

.caption p{ color: #fff; text-align: center; font-size: 17px;}
.imageHolder:hover .caption { 
	opacity: 1.0; background-color: #666;	-moz-transform: translateY(-30px);	-o-transform: translateY(-30px);	-webkit-transform: translateY(-30px);	transform: translateY(-30px); 
} 

.paticka{ font-size: 11px; margin: 0px 0px 0px 0px; padding: 40px; text-align: left; background-color: #333; color: #000; bottom: 0px; color: #efefef; }
.paticka li {display: inline-table;	width: 156px; padding: 0px 40px 20px 0px; text-align: left;}
.paticka ul {display: inline-table; list-style: none; padding: 0px; }
.paticka b { color: #fff; font-size: 13px; }
.paticka img{ padding: 5px; }


/* odstraneni modreho obdelniku pro chrome */
button:focus, input:focus, textarea:focus {outline: none;} 

/*formularove pole*/

input[type=text] { font-family: 'Montserrat', sans-serif;	font-size: 14px; width:90% ;    padding: 10px 10px;    margin: 1% 10% 5% 0%;    box-sizing: border-box;	border-radius: 0px;	border: 2px solid #ccc;	}
textarea { font-family: 'Montserrat', sans-serif;	font-size: 14px; 	width:90% ;    padding: 10px 10px;    margin: 1% 0% 1% 0%;    box-sizing: border-box;	border-radius: 0px;	border: 2px solid #ccc;	}
input[type=text]:focus {    color: #fff;  background-color:#D42427; }
input[type=checkbox] {  transform: scale(1.4); accent-color: #666;}
select, option {  padding: 10px 10px; margin-left:5px; }

#schovej:focus {   color: #fff;  background-color:#A31E68;	 }

@media screen and (max-width: 1285px) {
.topslider {/* background-size: cover; */ background-size: 100% ; height:360px; background-position: center -40px; }
} 

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

BODY { background-color: #fff; font-size: 15px; margin: 0px auto 0px auto; padding: 0px; width: auto; line-height: 110%; color: #000 ;}
p{	font-size: 15px;	}


.logo  {position: fixed; padding-left: 20px; top: 5px; z-index: 200; }
/* responsivni menu */
.menu {position: fixed;	width: 100%;	top: 0px;	font-size: 13px; z-index: 100; }
.obalovaci { margin: 0px auto 0px auto;  position: relative; width:100%; max-width: 1024px; }
.topslider:hover, .topslider:focus {  /* transform: translatey(-20px);  scale(1.1) ; overflow: hidden; */  }



ul.topnav {  
  max-width: 1024px; 
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #fff;
  border-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #ccc;
  box-shadow: 0px 0px 0px #666;
}

ul.topnav li {  padding-left: 0px; padding-right: 0px; }

ul.topnav li a {	
  display: inline-block; 
  color: #000;
  background-color: #fff;
  margin: 0px 0px 0px 0px;
  padding: 30px 20px 30px 20px;
  text-decoration: none;
  transition: 0.1s;
  border-right: 0px solid #efefef;
}

ul.topnav li a:hover {/* background-color: #A31E68; color: #Fff; */ margin: 0px 0px 0px 0px;  padding: 30px;}

.logo-velke{padding: 0px 0px 0px 50px; }
.row{ float: none; display: inline-block; width: 100%; margin: 0px auto 0px auto; padding: 0px; text-align: center; background-color: #fff; }
.spacer { float: none; display: inline-block; margin: 0 auto 0 auto; text-align: center; }

.head  {width: 100%; float: left;padding: 0px 0px 0px 0px; background-color:#fff;}

.spacer li {		
	width: 100%;
	padding: 10px 10px 10px 10px;	
	margin-left: 19px;
	float: left;
	text-align: left;
	font-weight: 300;
}

.paticka{ display: inline-block; width: 90%; margin: 0px auto 0px auto; padding: 5%;   bottom: 0px; }
.paticka li {	min-width: 100px;     padding: 0px 40px 20px 0px; }

/* imageholdery vyjizdeci */

.row-imageholder {display: inline-block;  width: 100%; padding: 0%; margin-top: -30px; text-align: center;}

.imageHolder {float: none; display: inline-table;  position: relative; width: 323px; /*height: 360px; */ margin: 5px; padding: 1% 2% 2% 1% ; overflow: hidden;  box-shadow: none; } 
.imageHolder:hover { 	box-shadow: none;}



.blok_ctvrtina {    display: inline-table;	width: 21%;     padding: 4%;	margin: 0%;	color: #000;		text-align: center;}
.blok_polovina { 		float: left; 	line-height: 133%;      display: inline-block; 	width: 46%;    padding: 2%;	margin: 0%;		text-align: left;}


}

@media screen and (max-width: 940px) {
.row{float: left; display: initial; width: 100%; margin: 0px ; padding: 4% 0% 2% 0%; text-align: center;  }
.topslider {height:250px;  background-size:contain; background-position: center 95px; }
/* responsivni menu zmensene  cast I. */
ul.topnav li:not(:first-child) {display: none; }
ul.topnav li.icon {	float: right;	display: inline-block;	z-index: 999;	}
ul.topnav.responsive {position: relative;  }
ul.topnav.responsive li.icon   {    position: absolute;    right: 0;    top: 0; 		}
ul.topnav.responsive li {    margin: 0px;	padding: 0px;	float: none;    display: inline;  	}
ul.topnav.responsive li a {    display: block;    text-align: left;  	}
/* responsivni menu ultra zmensene konec */

.column-flex {    flex: 50%;    max-width: 50%;  }

.gray{ width: 100%; margin: 0px; padding: 0%; text-align: center; color: #fff; }

.row-imageholder { display: inline-table; text-align: center;  }
.blok_ctvrtina {  display: inline-table;	width: 49%;     padding: 0% 0% 8% 0%;	margin: 0%;		text-align: center;}
.blok_polovina { 		float: left; 	display: inline-block; 	width: 40%;    padding: 5%;	margin: 0%;		text-align: left;}

}

@media screen and (max-width: 490px) {
BODY { margin: 0px; padding: 0px; width: 100%; text-align: center; }

.obalovaci {margin: 0px; padding: 0px; position: relative; width:100%; max-width: 490px; background-color: transparent;}
.row{display: block; width: 100%; margin: 0px ; padding: 4% 0% 2% 0%; text-align: center; background-color: #fff; float: left; }
.spacer {float: none; display: inline-block; width: 90%; padding: 5%; margin: 0px; background-color: #fff; text-align: center;}
	
.head  { display: block; margin: 10px auto 40px auto; padding: 0px; text-align: center; }
.logo  { padding-left: 20px; top: 15px;  }

.column-flex {    flex: 100%;    max-width: 100%;  }

h1 {font-size: 25px;}
h3 {font-size: 19px; }

.headline{	display: block; padding: 80px 0px 120px 0px; color:#000; width: 100%; background-color: #B31B67; margin: 0px 0px -60px 0px; }

.headline H1{display: block; color:#fff; }
.headline p{	display: block; color:#fff; font-weight: bold; }

.f-pozadi{	float: left;}

.blok_tretina { 	display: block;	width: 86%;    padding: 5%;	margin: 8% 2% 0% 2%;	text-align: center;	min-height: initial;}
.blok_ctvrtina {    /* display: block;	*/ width: 80%;	padding: 0px 0px 20px 0px;	margin: 5%;	}
.blok_polovina {    /* display: block;	*/ width: 80%;	padding: 5%;	margin: 5%;	}

.row-flex ul {list-style: none; margin-left: 0.7em;}
.row-flex li::before {content: "⚬"; color: #999;  display: inline-block; width: 1em;  margin-left: -1em; }

/* imageholdery vyjizdeci */
.row-imageholder {display: inline-block;  width: 98%; padding: 0%; margin-top: -40px;}
.imageHolder { float: none; display: block; position: relative; width: 86%; height: 400px;  margin: 5%; padding: 2% ;  box-shadow: 0px 0px 1px #ccc;} 

/* responsivni menu zmensene  cast I. */
	
ul.topnav li:not(:first-child) {display: none; }
ul.topnav li.icon { 	float: right;	display: inline-block;	z-index: 1000;	}
ul.topnav.responsive { position: relative; /*padding-top: 60px; */}
ul.topnav.responsive li.icon   {    position: absolute;    right: 0;    top: 0; 		}
ul.topnav.responsive li {    margin: 0px;	padding: 0px;	float: none;    display: inline;  	}
ul.topnav.responsive li a {    display: block;    text-align: left;  }
ul.topnav li a:hover {background-color: #fff; color: #000; margin: 0px 0px 0px 0px;  padding: 30px;}	
/* responsivni menu ultra zmensene konec */

.slider{ display: none }

img {  max-width: 100%;   box-sizing: border-box; }
ul {		padding: 0px;		margin: 0px; }
li {		padding: 0px;		margin: 0px; }

.paticka_logo { display: none; }
.paticka{ font-size: 11px; float:none;  width: 90%; margin: 0px; padding: 5%;   bottom: 0px; border-top: 0px solid #ccc; text-align: center; }

.paticka ul {    float:none;    padding: 0px;	margin: auto;	border-right: 0px solid #ccc;}
.paticka li {    float:none;	width: 100%;    padding: 0px 0px 20px 0px ;	margin: 0px;}


}