@charset "utf-8";
@font-face {
  font-family: "ErieContour";
  src: url("./fonts/eriectn.eot"); /* IE9 Compat Modes */
  src: url("./fonts/eriectn.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/eriectn.otf") format("opentype"), /* Open Type Font */
    url("./fonts/eriectn.svg") format("svg"), /* Legacy iOS */
    url("./fonts/eriectn.ttf") format("truetype"), /* Safari, Android, iOS */
    url("./fonts/eriectn.woff") format("woff"), /* Modern Browsers */
    url("./fonts/eriectn.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Brisk";
  src: url("./fonts/briskn.eot"); /* IE9 Compat Modes */
  src: url("./fonts/briskn.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/briskn.otf") format("opentype"), /* Open Type Font */
    url("./fonts/briskn.svg") format("svg"), /* Legacy iOS */
    url("./fonts/briskn.ttf") format("truetype"), /* Safari, Android, iOS */
    url("./fonts/briskn.woff") format("woff"), /* Modern Browsers */
    url("./fonts/briskn.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "AmSanslight";
  src: url("./fonts/amsansl.eot"); /* IE9 Compat Modes */
  src: url("./fonts/amsansl.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/amsansl.otf") format("opentype"), /* Open Type Font */
    url("./fonts/amsansl.svg") format("svg"), /* Legacy iOS */
    url("./fonts/amsansl.ttf") format("truetype"), /* Safari, Android, iOS */
    url("./fonts/amsansl.woff") format("woff"), /* Modern Browsers */
    url("./fonts/amsansl.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Strenuous3D";
  src: url("./fonts/strenu3d.eot"); /* IE9 Compat Modes */
  src: url("./fonts/strenu3d.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/strenu3d.otf") format("opentype"), /* Open Type Font */
    url("./fonts/strenu3d.svg") format("svg"), /* Legacy iOS */
    url("./fonts/strenu3d.ttf") format("truetype"), /* Safari, Android, iOS */
    url("./fonts/strenu3d.woff") format("woff"), /* Modern Browsers */
    url("./fonts/strenu3d.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}
*{
   padding: 0 0 0 0;
	margin: 0 0 0 0;
}
html, body{
	font-family: AmSanslight, Geneva, Arial, Helvetica, sans-serif;
}
body{
	height:100%;
	min-height: 100%;	
}
#header h1{
	font-family: Strenuous3D, Geneva, Arial, Helvetica, sans-serif;
	font-size: 3.5em;
	padding: 30px 0 0 30px;
}
.cenik-text{
	padding-top: 5px
	
}
@media screen and (min-width: 700px) {
	#header h1 a, #header h1 a:hover{
		color: #008b8b;/*#008b8b*/
		text-decoration: none;
	}
	.galerie{
	padding: 100px 150px 0 150px;
}
.sipka-nahoru{
	position: fixed;
	right: 50px;
	bottom: 60px;
	display:block;
	
}
.cenik{
	width: 600px;
	margin: 100px auto;
}
.cenik h2{
 margin: 20px 0 0 -50px;	
}
.cenik-popis{
	display: inline-block;
	width: 200px;
}
.cenik-hodnota{
	display: inline-block;
	width: 150px;
}
.cenik-cena{
	display: inline-block;
	width: 100px;
	text-align: right;
}
.bannery{
	padding: 50px 50px 0 50px;
	text-align: center;
}
.banner{
	display: inline-block;
	width: 256px;
	height: 300px; 
	padding: 20px 40px 20px 40px;
	
	
}
.banner div.popisek{
	padding-top: 15px;
	font-size: 1.2em;
}
.podlaha-ico{
	
	width: 256px;
	height: 256px;
}
.malir-ico{
	
	width: 256px;
	height: 256px;
}
.zednik-ico{
	
	width: 256px;
	height: 256px;
}
.banner a:hover div.podlaha-ico{
	background-image: url(img/podlahy.png);
	width: 256px;
	height: 256px;
	
}
.banner a:hover div.malir-ico{
	background-image:url(img/malir.png);
	width: 256px;
	height: 256px;
	
}
.banner a:hover div.zednik-ico{
	background-image: url(img/cihly.png);
	width: 256px;
	height: 256px;
	
}
.banner a div.podlaha-ico{
	background-image: url(img/podlahy_h.png);
	width: 256px;
	height: 256px;
	transition: background 1s
}
.banner a div.malir-ico{
	background-image:url(img/malir_h.png);
	width: 256px;
	height: 256px;
	transition: background 1s
}
.banner a div.zednik-ico{
	background-image: url(img/cihly_h.png);
	width: 256px;
	height: 256px;
	transition: background 1s
}
.banner a:hover{
	text-decoration: none;
	color: #008b8b;
}
.banner a{
	text-decoration: none;
	color: #000;
	transition: background 1s;
}
.podlahy1{
	width: 600px;
	margin: 100px auto;
	
}
.malir{
	width: 600px;
	margin: 100px auto;
}
}
#header menu{
	font-family: Brisk, Geneva, Arial, Helvetica, sans-serif;
	list-style: none;
	text-align: right;
   padding-right: 50px;
   font-size: 1.5em;
}
#header menu li{
	display:  inline-block;
	padding: 0 10px 0 10px;
	
	
}
#header menu li a{
	color: #000;
	text-decoration: none;
	padding: 5px 0 5px 0;
}
#header menu li a:hover, #header menu li a.focus{
	
	color: #008b8b;
	border-bottom: dotted;
	padding: 5px 0 5px 0;
}
.fixni-menu {
	position: fixed; 
	left: 0; 
	top: 0; 
	width: 100%; 
	background: #000; 
	text-align: right; 
	padding: 10px 20px 10px 0;
	z-index: 1;
	
	
	} 
#header div.fixni-menu menu li a{
	color: #fff;
} 
#fixni-menu button {
    background: #000;
    border: 0;
    color: #fff;
    font-size: 30px;
    cursor: pointer;
    display: none;
}

#fixni-menu button:hover, #fixni-menu button:focus {
    color: #fff;
}

#fixni-menu.zobrazit menu {display: block;}

@media all and (max-width: 699px) {
   #header{
   	background-color: #000;
   }
   #header h1{
	
	
	padding: 20px 0 0 10px;
}
   #header h1 a, #header h1 a:hover{
	color: #fff;
	text-decoration: none;
}
    #fixni-menu button {
        display: block;
        width: 60px;
        height: 60px;
        margin: 0px 0 0 10px;
        font-size: 2.3em;
    }
    
    #fixni-menu menu {display: none;}
    #header menu li{
		display:  block;
		padding: 0 10px 0 10px;
		line-height: 1.4em;
	}
	#header menu li a{
		color: #fff;
		text-decoration: none;
		padding: 10px 0 10px 0;
		display: block;
		padding-left: 50px;
		width: 100%;
	}
	#header menu li a:hover, #header menu li a.focus{
	
		color: #000;
		border-bottom: none;
		padding: 10px 0 10px 0;
		background-color: #008b8b;
		padding-left: 50px;
		width: 100%;
	}
	#header menu{
	
	list-style: none;
	text-align: left;
   
   font-size: 1.5em;
}
.galerie{
	padding: 0px 20px 0px 20px;
}
.galerie img{
	width: 100px;
	height: auto;
}
.sipka-nahoru{
	position: fixed;
	right: 10px;
	bottom: 20px;
	display:block;
	
}
.cenik{
	/*width: 100%;*/
	padding: 0 10px 0 10px;
	margin: 10px auto;
}
.cenik h2{
 margin: 20px 0 0 0px;	
}
.cenik-popis{
	display: inline-block;
	/*width: 150px;*/
}
.cenik-hodnota{
	display: inline-block;
	width: 120px;
	text-align: left;
}
.cenik-cena{
	display: inline-block;
	/*width: 90px;*/
	text-align: right;
	padding-right: 20px;
	
}
.radek-cenik{
	text-align: right;
	font-size: 1.2em;
}
.cenik-text{
	font-size: 1.2em;
}
.bannery{
	padding: 20px 10px 0 10px;
	text-align: center;
}
.banner{
	display: inline-block;
	width: 100px;
	height: 120px; 
	padding: 10px 10px 10px 10px;
	
	
}
.banner div.popisek{
	padding-top: 15px;
	font-size: 1.2em;
}
.podlaha-ico{
	
	width: 100px;
	height: 100px;
}
.malir-ico{
	
	width: 100px;
	height: 100px;
}
.zednik-ico{
	
	width: 100px;
	height: 100px;
}
.banner a:hover div.podlaha-ico{
	background-image: url(img/m_podlahy.png);
	width: 100px;
	height: 100px;
	
}
.banner a:hover div.malir-ico{
	background-image:url(img/m_malir.png);
	width: 100px;
	height: 100px;

}
.banner a:hover div.zednik-ico{
	background-image: url(img/m_cihly.png);
	width: 100px;
	height: 100px;
	
}
.banner a div.podlaha-ico{
	background-image: url(img/m_podlahy_h.png);
	width: 100px;
	height: 100px;
	transition: background 1s
}
.banner a div.malir-ico{
	background-image:url(img/m_malir_h.png);
	width: 100px;
	height: 100px;
	transition: background 1s
}
.banner a div.zednik-ico{
	background-image: url(img/m_cihly_h.png);
	width: 100px;
	height: 100px;
	transition: background 1s
}
.banner a:hover{
	text-decoration: none;
	color: #008b8b;
}
.banner a{
	text-decoration: none;
	color: #000;
	transition: background 1s;
}
.podlahy1{
	
	margin: 20px auto;
	
}
.podlahy{
	padding-left: 20px;
}
.malir{
	
	margin: 20px auto;
	padding: 0 20px 0 20px;
}
}   
.posun{
	margin-top: 20px;
}
#telo{
	/*height:100%;*/
	min-height: 100%;
}
#patka{
	height: 25px;
	margin-top: -25px;
}
#patka div.autor{
	text-align: center;
}


.kontakt{
	padding-top: 100px;
	text-align: center;
}
h2.jmeno{
	width:365px;
	margin: 0 auto;
	padding-bottom: 20px;
	font-size: 2.0em;
}
.kontakt1{
	width: 365px;
	margin: 0 auto;
	padding-bottom: 5px;
	font-size: 22px;
}
.kont-label{
	display: inline-block;
	width: 60px;
	vertical-align: top;
	text-align: right;
	padding-bottom: 5px;
}
.kont-label1{
	display: inline-block;
	width: 60px;
	
	text-align: right;
	padding-bottom: 5px;
}
.telefony1{
	display: inline-block;
	width: 260px;
	text-align: left;
}
.telefon{
	
	padding-bottom: 10px;
	text-align: left;
}
.telefon a{
	color: #000;
}
.telefon a:hover{
	color: #008b8b;
	text-decoration: none;	
}
.gallery{
	text-align: center;
	padding-top: 100px;
}
.gallery a img{
	border: 3px solid #000;
	border-radius: 10px;
	margin-bottom: 2px;
}
.gallery a:hover img{
	border: 3px solid #008b8b;
	border-radius: 10px;

}

.cenik h3{
	padding-top: 15px;
	padding-bottom: 15px;	
}
.radek-cenik{
	padding: 5px 0 5px 20px;
}

.reference{
	/*width: 900px;
	margin: 100px auto;*/
	padding: 100px 50px 0 50px;
	text-align: center;
}
.reference h2{
	padding-bottom: 50px;
}
.lofo-firma img{
	max-width: 200px;
	padding-bottom: 10px;
}
.lofo-firma{
	padding: 5px 5px 5px 5px;
	width: 200;
	display: inline-block;
	vertical-align: top;
	text-align: center;	
	
}
.mezera{
	height: 25px;
}

.malir p{
	text-align: center;
	font-size: 1.2em;
}


.podlahy2{
	text-align: center;
}
.podlahy h3{
	padding-top: 20px;	
}
.dph{
	padding-top: 20px;
}
.zednik{
	text-align: center;
}
.zednik h2{
	padding-top: 100px;
}

.sipka-skryj{
	display: none;
}
#sipka-nahoru{
	width: 50px;
	height: 50px;
	border-radius: 10px 10px 10px 10px;
}
.sipka-nahoru img{
	border-radius: 10px 10px 10px 10px;
}
.schovane{
	display: none;
}