﻿body {
	margin: 0px;
	padding: 0px;
	font-family: 'Roboto', sans-serif;
	line-height: 150%;
	background-color: white;
	color: #1D1D1D;
	background-image:url('../images/pozadi-zuby.png');
	background-position: center top;
	background-repeat: repeat-x;
}
.leva {float: left;}
.prava {float: right;}
.sirka {max-width: 1080px;clear: both;margin: auto;}
.sirka12 {width: 48%;}
.sirka13 {width: 33%; display:inline-block; vertical-align: top;}
.sirka23 {width: 66%; display:inline-block;}
.sirka14 {width: 24%; display:inline-block;}
.clear {clear: both;}
.fa {margin-right: 0.7em;}
.fa-3x {margin-right: 15px; color: #DBDBDB;}
.textprava { text-align: right; }
.textstred { text-align: center; }

/* ZAKLAD */
h1, h2, h3 {
	font-weight: 700;
	font-family: 'Roboto Condensed', sans-serif;
	color: #1D1D1D;
	line-height: 100%;
	text-transform: uppercase;
	letter-spacing: -1px;
}
h1 {font-size: 360%; padding-bottom: 10px; text-align: center; color: #1d1d1d; letter-spacing: -1px; }
h2 {font-size: 220%; padding-bottom: 25px; font-weight: 300; text-align: center; }
h3 {font-size: 140%; padding: 10px; margin: 0px; letter-spacing: 0px;}
h2 span{font-weight: 700;}
a {	color: #ee9801;}
a:hover { color: black;}
hr {
	height: 4px;
	border: 0px;
	background: #ee9801;
	clear: both;
	width: 80px;
	margin: 40px auto;
	display: block;
}
.uvodtext {
	height: 210px;
	text-align: center;
}
.uvodtext h1 {
	border: 0px;
	display: block;
	margin-top: 0px;
	margin-bottom: 0px;
}
.uvodtext h1 span{font-size: 24pt; text-transform: lowercase; font-weight: 300; display:block; margin-top: -10px; }

.uvodtext.titulka {
	height: 330px;
}
.uvodtext.titulka img{
	max-width: 90%;
	height: auto;
}

.uvodtext.titulka h1{
	text-transform: none;
	letter-spacing: -2px;
}
.uvodtext.titulka h1 span{
	font-size: 28pt;
	letter-spacing: -1px;
	color: #C0C0C0;
	display: block;
	margin-top: 0px;
}
.uvodtext.titulka a{
	margin-top: 20px;
	display: inline-block;
	padding: 12px 30px;
	color: white;
	background: #ee9801;
	text-decoration: none;
	border-radius: 15px;
}
.uvodtext.titulka a:hover{
	color: #ee9801;
	background-color: #F0F0F0;
	border: 1px #ee9801 solid;
}


/* MENU */
.menu {
	width: 100%;
	height: 140px;
	margin: auto;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	font-size: 110%;
	text-transform: uppercase;
}
.menu .logo{
	float: left;
	border: 0px;
	margin-top: 10px;
}
.menu #hlavnimenu img {
	border: 0px;
	vertical-align: text-bottom;
}
.menu #hlavnimenu {
	float: right;
}
.menu ul{
	list-style: none;
	padding: 0px;
	margin-top: 27px;
}
.menu li{
	display: inline-block;
	list-style: none;
}
.menu li a {
	color: black;
	text-decoration: none;
	padding: 10px 5px;
	margin: 0px 10px;
	border-bottom: 2px #F0F0F0 solid;
}
.menu li a:hover, .menu li a.aktiv {color: #ee9801; border-bottom: 2px #ee9801 solid; }

.menu li.prvni {
	border-left: 1px silver solid;
	margin-left: 10px;
	padding-left: 15px;
}
.menu li.ikony a {
	color: #ee9801;
	margin: 0px 10px;
}
.menu li.ikony a:hover {
  color: black;
}
.menu li.ikony a:hover img {
  filter: grayscale(100%) brightness(30%);
}
.menu li.ikony a span {
	display: none;
}
.menu li.ikony a span.kosikpocet{
	display: block;
	color: white;
	background-color: black;
	font-weight: bold;
	font-size: 10pt;
	height: 18px;
	width: 18px;
	line-height: 18px;
	padding: 0px;
	z-index: 500;
	border-radius: 100%;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	margin-left: -5px;
	margin-top: -10px;
	position: absolute;
}

/* UVOD */
.uvod {
	text-align: center;
}
.uvod a{
	font-family: 'Roboto Condensed', sans-serif;
	color: #1D1D1D;
	width: 17%;
	padding: 1%;
	padding-bottom: 20px;
	display: inline-block;
	text-decoration: none;
	text-align: center;
	font-size: 11pt;
	vertical-align: top;
}
.uvod a h1{
	font-weight: 400;
	font-size: 22pt;
	line-height: 130%;
	margin-top: 10px;
	padding: 0px;
	letter-spacing: -1px;
}
.uvod a img{margin-top: 18px; }
.uvod a:hover{background: #ee9801; color: white; }
.uvod a:hover h1{	color: white;}
.uvod a:hover img{filter:invert(1);}

/* UKAZKY */
#ukazky {
	width: 100%;
	clear: both;
	padding-top: 20px;
	text-align: center;
	line-height: 100%;
}
#ukazky a{
	display: inline-block;
	background-image: url('../images/lupa-velka.png');
	background-position: 50% 50%;
	background-repeat: no-repeat;
	margin: 3px 6px;
}
#ukazky a:hover{background-color: #ee9801;}
#ukazky img{
	float: left;
}
#ukazky img:hover{
	filter: alpha(opacity=30);
	-moz-opacity: 0.3;
	-khtml-opacity: 0.3; 
	opacity: 0.3;
}
/* OBSAH */
img {border: 0px;}
.obsahobr{border: 0px;margin-top: 30px;}
.btn {
	font-family: 'Roboto Condensed', sans-serif;
	border: 1px #ee9801 solid;
	background-color: #ee9801;
	color: white;
	padding: 12px 25px;
	font-size: 110%;
	text-decoration:none;
	display: inline-block;
	margin-top: 3px;
	margin-bottom: 3px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
}
.btn:hover {
	color: white;
	border: 1px #DF8600 solid;
	background-color: #DF8600;
}
.btn:target {
	color: white;
	border: 1px #DF8600 solid;
	background-color: #DF8600;
}

.dvasloupce {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px;
}
.trisloupce {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
}

.dvasloupce img, .trisloupce img {
  max-width: 100%;
  height: auto;
}
/* Na mobilu budou sloupce pod sebou */
@media (max-width: 700px) {
  .dvasloupce, .trisloupce {
    grid-template-columns: 1fr;
  }
}

.btno {
	font-family: 'Roboto Condensed', sans-serif;
	background-color: #fff;
	color: #6B6B6B;
	padding: 12px 20px;
	font-size: 110%;
	text-decoration:none;
	display: inline-block;
	margin-top: 3px;
	margin-bottom: 3px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
	box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
}
.btno:hover {
	background-color: #ee9801;
	color: white;
}

.cenikbtn a{
	display: inline-block; margin: 0px 5px; width: 90px; padding-top: 15px; margin-bottom: -10px;
}
.cenikbtn strong{ font-size: 180%; }
.cenikbtn span{ font-size: 80%;  }

.anone ul{
	list-style: none;
	line-height: 180%;
}
.anone img{
	margin-right: 5px;
}
.anone ul.ano {
	list-style-image: url('../images/sluzby-ano-sm.png');
}
.anone ul.ne {
	list-style-image: url('../images/sluzby-ne-sm.png');
}
.nabizime {text-align: center;}
.nabizime div {
	padding: 0px 25px;
	margin-top: 30px;
	max-width: 25%;
	display: inline-block;
	vertical-align: top;
}
#texty { max-width: 900px; margin: auto; }
#texty div { margin: 30px 0px 30px 0px;}
#texty h2 { text-align: left; padding-bottom: 0px; }

details {
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 16px 16px;
  margin-bottom: 10px;
  background: #fff;
}

summary {
  cursor: pointer;
  font-weight: bold;
  list-style: none;
  position: relative;
  padding-right: 30px;
}

summary::-webkit-details-marker {
  display: none;
}

summary::before {
  content: "";
  position: absolute;
  right: 4px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 2px solid #555;
  border-bottom: 2px solid #555;
  transform: translateY(-50%) rotate(-45deg);
  transition: transform 0.2s ease;
}

details[open] summary::before {
  transform: translateY(-65%) rotate(45deg);
}
details p {
  margin: 12px 0 4px;
  color: #666;
  line-height: 1.5;
}

.kontakty {
	margin: 10px 0px;
	text-align: center;
}
.kontakty div {
	line-height: 140%;
	text-align: center;
	width: 23%;
	display: inline-block;
	vertical-align: top;
}
.kontakty div strong {
	font-size: 130%;
	color: #494949;
}
.kontakty div a:hover strong {
	color: #F59A1A;
}

/* CENIK */
.cenik {padding-top: 0px;}
.cenikletaky {vertical-align: top;}
.cenik table, .cenikletaky table{width: 85%; border-collapse: collapse; background-color: #fff; margin: -6px auto 50px auto; 
text-align: center; vertical-align: top; box-shadow: 0px 10px 50px rgba(0,0,0,0.1); }
.cenik th, .cenikletaky th {
	padding: 15px;
	border: 0px;
	font-size: 110%;
	background-color:#ee9801;
	color: white;
}
.cenik td, .cenikletaky td {
	padding: 15px;
	border-bottom: 1px #E4E4E4 solid;
}
.cenik p { text-align: center; }
.cenikletaky{
	width: 19%;
	display: inline-block;
}

.cenikbtn .btn, .cenikbtn .btno { border-radius: 0px; box-shadow: none; text-align: center; border: 0px; }
.cenikbtn .btno { box-shadow: 0px 0px 25px rgba(0,0,0,0.1); }
.cenikbtn .btn:hover { background-color: #ee9801; }

/* KALKULACE */
#formular {
	background: white;
	max-width: 900px;
	margin: auto;
	margin-top: -40px;
	margin-bottom: 80px;
	box-shadow: 0px 10px 50px rgba(0,0,0,0.12);
	padding-top: 25px;
	padding-bottom: 10px;
	border-radius: 25px;
}
.kalkulace {
	text-align: center;
	padding-bottom: 30px;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 14pt;
	line-height: 180%;
}
.kalkulace div {
	text-align: left;
	display: inline-block;
	font-weight: bold;
	margin: 0px 10px;
}
input, select, textarea {
	font-family: 'Roboto Condensed', sans-serif;
	padding: 12px;
	margin-top: 5px;
	font-size: 12pt;
	border: 1px #d0d0d0 solid;
	border-radius: 15px;
}
select {
	cursor: pointer;
}
input[type=submit] {
	background-color: #ee9801;
	border: 1px #ee9801 solid;
	color: white;
	padding: 12px 24px;
	cursor: pointer;
	box-shadow: 2px 2px 7px silver;
	font-size: 12pt;
}
input[type=submit]#vlozit, .tlacitko.pokracovat {
	background-color: #ee9801;
	border: 1px #ee9801 solid;
	color: white;
	padding: 18px 45px;
	cursor: pointer;
	box-shadow: 2px 2px 7px silver;
	font-size: 12pt;
	margin-top: 20px;
	margin-bottom: 30px;
}
input[type=submit]:hover, input[type=submit]#vlozit:hover {
	background-color: #FF8E28;
	border: 1px #FF8E28 solid;
}
.vypisceny {
	text-align: center;
	font-size: 16pt;
	line-height: 1.4;
}
.vypisceny strong{
	font-size: 20pt;
}
.vypisceny .dph{
	font-size: 10pt;
	color: gray;
}
.hlaska {
 	text-align: center;
	margin: 35px 0px;
	display: block;
	clear: both;
	font-size: 12pt;
	background-color: #FEE2A9;
	padding: 20px;
	margin-bottom: 20px;
}

/* KOSIK */
#kosik table {
	width: 100%;
}
#kosik table td, table th{
	padding: 8px;
}
#kosik table th {
	text-align: left;
	font-size: 110%;
}
#kosik table td.cena{
	font-size: 18pt;
	padding-top: 0px;
	padding: 20px;
	text-align: center;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	line-height: 120%;
	text-align: right;
}
#kosik table .cena .nazev{
	font-size: 12pt;
	font-weight: 400;
	padding-right: 10px;
}
#kosik table .cena .vaha{
	font-weight: normal;
	font-size: 10pt;
}
#kosik .polozky input {
	width: 35px;
}
#kosik .polozky img {
	border: 0px;
	margin-left: 10px;
}
#kosik .polozky {
	border-collapse: collapse;
}
#kosik .polozky tr{
	border-bottom: 1px #d5d5d5 solid;
}
#kosik .polozky td{
	text-align: center;
}
#kosik .polozky td.textleva{
	text-align: left;
}
#kosik .polozky td strong{
	font-size: 120%;
}
#kosik .polozky th{
	padding: 10px 0px;
	font-weight: 300;
	text-align: center;
	font-size: 10pt;
	color: gray;
}
#kosik .polozky td{
	padding: 20px 12px;
}
#kosik label, #kosik input[type="radio"] { cursor: pointer; }
#kosik label img, #kosik input[type="radio"] { margin-right: 15px; }
#kosik label:hover { text-decoration: underline; }
#kosik .tlacitko.pridat, #kosik .tlacitko.zpet {
	padding: 18px 28px;
	color: #DD7400;
	background-color: white;
	border: 1px #DD7400 solid;
	margin-bottom: 50px;
	margin-right: 20px;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    -moz-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    text-decoration: none;
}
#kosik .tlacitko.zpet {
	padding: 20px 30px;
	background-color: white;
	border: 1px white solid;
	text-decoration: underline;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
#kosik .tlacitko.odeslat {
	padding: 25px 80px;
	margin-bottom: 50px;
	margin-left: 20px;
}
#kosik .tlacitko.pokracovat {
	padding: 20px 70px;
	margin-bottom: 50px;
	margin-left: 20px;
}
.tlacitko:hover {
	background-color: #ee9801;
	border: 1px #ee9801 solid;
	text-decoration: none;
}
#kosik .tlacitko.pridat:hover{
	background-color: #ee9801;
	border: 1px #ee9801 solid;;
	color: white;
}
#kosik .tlacitko.zpet:hover{
	color: black;
}
table.doprava {
	border-collapse: collapse;
	width: 90%;
	border-spacing: 0;
	margin: 40px auto;
}
table.doprava th{
	font-size: 120%;
}
table.doprava tr{
	border-bottom: 1px #d5d5d5 solid;
	height: 65px;
	vertical-align: middle;
}
table.doprava select{
	padding: 5px;
}
table.doprava .prava{
	vertical-align: middle;
	line-height: 40px;
}
.chyba {
	font-size: 150%; margin-bottom: 100px; color: #ee9801; line-height: 220%;
}
/* MAPA */
.mapa {
	width: 100%;
	height: 400px;
}
/* PATICKA */
.paticka {
	width: 100%;
	height: 400px;
	clear: both;
	background-color: #363E41;
	background-image: url('../images/linka-spodek.png');
	background-position: center top;
	background-repeat: repeat-x;
	color: #D9D9D9;
	padding-top: 120px;
	margin-top: 100px;
}
.paticka a {
	color: white;
}
.paticka a:hover {
	color: #ee9801;
}
.paticka h2 {
	color: #ee9801;
}
.paticka .btn {
	font-family: 'Roboto Condensed', sans-serif;
	color: #363E41;
}
.paticka .btn:hover {
	color: #414A53;
	border: 1px #fff solid;
	background-color: #fff;
}
.slicknav_menu {
	display:none;
}
/* ROZLISENI */
@media screen and (max-width: 850px) {
body { background-position: center 30px; }
.sirka { width: 97%; margin: auto; }
.uvod a { width: 30%; }
.kalkulace { max-width: 80%; }
.js .slicknav_menu {display:block;}
.menu, .js #menu, .obsahobr {display: none;}
.menu img{float: none;margin-left: 15px;}
.menu ul{float: none;margin-top: -20px;}
.uvodtext {margin-top: 90px;}
.uvodtext h1 span{font-size: 22pt;}
.slicknav_btn{position:relative;display:block;vertical-align:middle;float:right;padding:0.438em 0.625em 0.438em 0.625em;line-height:1.125em;cursor:pointer;}
.slicknav_menu .slicknav_menutxt{display:none;line-height:1.188em;float:left;}
.slicknav_menu .slicknav_icon{float:left;margin:0.188em 0 0 0.438em;}
.slicknav_menu .slicknav_no-text{margin:0}
.slicknav_menu .slicknav_icon-bar{display:block;width:1.125em;height:0.125em;}
.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar{margin-top:0.188em}
.slicknav_nav{clear:both}
.slicknav_nav ul,
.slicknav_nav li{display:block}
.slicknav_nav .slicknav_arrow{font-size:0.8em;margin:0 0 0 0.4em;}
.slicknav_nav .slicknav_item{display:block;cursor:pointer;}
.slicknav_nav a{display:block}
.slicknav_nav .slicknav_item a{display:inline}
.slicknav_menu:before,
.slicknav_menu:after{content:" ";display:table;}
.slicknav_menu:after{clear:both}
.slicknav_menu{*zoom:1}
.slicknav_menu{font-size:16px;}
.slicknav_btn{margin:5px;text-decoration:none;}
.slicknav_menu .slicknav_menutxt{color:#000;font-weight:bold;}
.slicknav_menu .slicknav_icon-bar{background-color:#000;}
.slicknav_menu{background:#fff;padding:5px;padding-bottom:15px; background-image:url('../images/logo.png');background-size:auto 55px;background-position:20px 8px;background-repeat:no-repeat;}
.slicknav_nav{color:#000;margin:0;padding:0;font-size:1em;font-family:'Roboto Condensed', sans-serif;font-weight:bold; padding-top: 30px; }
.slicknav_nav, .slicknav_nav ul{list-style:none;overflow:hidden;}
.slicknav_nav ul{padding:0;margin:0 0 0 20px;}
.slicknav_nav .slicknav_item{padding:5px 10px;margin:2px 5px;}
.slicknav_nav a{padding:15px;margin:0px;text-decoration:none;font-size:14pt;font-weight:400;color:#000;border-top:1px #e0e0e0 solid;}
.slicknav_nav li.kontakt a{color: #ee9801;}
.slicknav_nav .slicknav_item a{padding:0;margin:0;}
.slicknav_nav .slicknav_item:hover, .slicknav_nav a:hover{color: #ee9801;}
.slicknav_nav .slicknav_txtnode{margin-left:15px;}

.slicknav_nav .ikony a{
	color: #ee9801;
}
.slicknav_nav .ikony img {
	margin-right: 10px;
	vertical-align: middle;
}
.slicknav_nav .ikony a .kosikpocet{
	margin-left: 10px;
	background: black;
	color: white;
	display: inline-block;
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 20px;
	font-size: 10pt;
	border-radius: 100%;
}
}
@media screen and (max-width: 840px) {
.sirka {
	width: 97%;	
	margin: auto;
}
#ukazky a{
	max-width: 45%;
	margin-right: 10px;
	height: auto;
}
#ukazky a img{
	width: 100%;
	height: auto;
}
.papiry div{
	min-width: 90%;
}
.kontakty div { width: 48%; }
.kontakty div strong { font-size: 110%; }
}
@media screen and (max-width: 550px) {
.leva, .prava, #ukazky, #obsah #text, .sirka12, .sirka23{
	width: 100%;
	max-width: 100%;
	height: auto;
	float: none;
	clear: both;
}
img.leva, img.prava{
	width: auto;
	height: auto;
}
.paticka {
	height: 620px;
}
#obsah, .sirka {
	width: 97%;	
	margin: auto;
}
.uvodtext {margin-top: 80px;}
#ukazky a{
	display: inline-block;
	max-width: 24%;
	margin-right: 4px;
	height: auto;
}
.uvod a {
	width: 45%;
}
#ukazky a img{
	width: 100%;
	height: auto;
}
.mobilstred {
	text-align: center;
}
}
@media all and (max-width: 380px) {
#ukazky a{
	max-width: 30%;
}
.nabizime div {
	max-width: 90%;
	margin-bottom: 30px;
}
.uvodtext.titulka {margin-bottom: 50px;}
.kalkulace {
	text-align: left;
	padding-right: 0px;
	padding-left: 30px;
}
.kalkulace div{
	margin-bottom: 20px;
}

.paticka {
	height: 740px;
}
}