*{padding:0; margin:0; position:relative;box-sizing:border-box;}

body{min-width:320px; min-height:100vh; display:flex; flex-direction:column; color:#333333; font-family: Calibri, sans-serif;}

a{text-decoration:none;}
a:hover{text-decoration:underline;}

h3{font-size:1.5em;}

.site{width:100%; height:100%; max-width:1000px; min-width:320px; margin:0 auto; box-sizing:border-box;}
.site>.inner{ padding:0;}

.header{min-height:100vh; display:flex; flex-direction:column; background-image: radial-gradient(farthest-corner at 30% -70%, #555 0%, #333 60%); padding:20px 0 0; color:#ffffff; transition:0.2s}
.header>.site{display:flex; flex: 1 0 100%; flex-direction:column; align-items:center; justify-content:space-around; gap:40px; padding:30px; text-align:center;}
.header .name_line{display:flex; flex-direction:column;}
.header .name_line a{color:#ffffff; text-decoration:none;}
.header .name_line h1{font-size:4em;order:2;}
.header .name_line h1 span{display:block; font-size:0.6em;}
.header .name_line h2{font-size:2em; order:1;}
.header .phone{font-size:4.5em; color:#FFF259; font-weight:bold; padding:20px 40px; border:10px solid #FFF259; border-radius: 100px; text-shadow: 2px 2px 8px #000; box-shadow: 2px 2px 8px #000;}
.header a.phone:hover{text-decoration:none; text-shadow: 0 0 0 #000; box-shadow: 0 0 0 #000;}

.header ul.vyhody{list-style: none;display: flex; justify-content:center; flex-wrap: wrap; font-size:1.8em;}
.header ul.vyhody li{}
.header ul.vyhody li {margin-right: 0.5em; }

.header ul.vyhody li::after {content: "•"; margin-left: 0.5em;}

.header ul.vyhody li:last-child::after {content: "";}

.header .menu_box{min-height:60px;flex: 0 0 auto;background:#666666;}
.header .menu_box .menu{display:flex; align-items:center; justify-content:space-around;}
.header .menu_box .menu a{display:flex; align-items:center; justify-content:center; padding:10px; font-size:2em; color:#ffffff;}


.header .menu_box .menu{margin:0;  padding:0;  display:flex;  overflow:hidden;}
.header .menu_box .menu a{display:block;  padding:20px 30px;}
/* menu */
.header .menu_box .menu{clear:none;    max-height:none;  transition:max-height .2s ease-out;}
/* menu icon */
.header .menu-icon{cursor:pointer; padding:28px 20px;  position:relative;  user-select:none;  display:none;}
.header .menu-icon .navicon{width:35px; height:4px; display:block; background:#ffffff; position:relative;  transition:background .2s ease-out;  }
.header .menu-icon .navicon:before, .header .menu-icon .navicon:after{background:#ffffff;  content:'';  display:block;  height:100%;  position:absolute;  transition:all .2s ease-out;  width:100%;}
.header .menu-icon .navicon:before{top:10px;}
.header .menu-icon .navicon:after{top:-10px;}
/* menu btn */
.header .menu-btn{display:none;}
.header .menu-btn:checked ~ .menu{max-height:240px; padding-bottom: 10px;}
.header .menu-btn:checked ~ .menu-icon .navicon{background:transparent;}
.header .menu-btn:checked ~ .menu-icon .navicon:before{transform:rotate(-45deg);}
.header .menu-btn:checked ~ .menu-icon .navicon:after{transform:rotate(45deg);}
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after{top:0;}
/* 48em = 768px */

                                  
.content{min-height:200px;}
.content h3{width:100%; text-align:center; font-size:2em; padding-bottom:20px;}

.sluzby{display:flex; flex-wrap:wrap; align-items: end; justify-content: space-around; text-align:center;  padding:40px 0;}
.sluzby .sluzba{flex:1 0 33%; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px;font-size:1.6em;}
.sluzby .sluzba svg{max-height:80px;}

.cenik_box{max-width:90%; width:800px;margin:40px auto;}
.cenik{border:2px solid #333333; border-radius:10px; font-size:1.3em; font-weight:bold;}
.cenik .line{min-height:65px; display:flex; flex-wrap:wrap; gap:0 10px; align-items:center; justify-content:space-between; padding:10px; border-bottom:1px solid #333333;}
.cenik .line:last-child{border-bottom:0; border-radius:0 0 10px 10px;}
.cenik .line:nth-child(even) { background-color: #eeeeee;}
.cenik .line .hodnota{margin-left:auto;}
.cenik_box .pozn{text-align:left; padding:10px;}

.auta{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:40px auto; font-weight:bold; gap:50px 0;}
.auta .auto{display:flex; flex-direction:column; justify-content:center; align-items:center; flex:0 0 50%; padding:20px;font-size:1.4em; border:1px solid #333;}
.auta .auto img{width:60%;}

.o-nas{margin:40px 20px;}
.o-nas p{padding:10px 0;}



.footer{background:#333333; color:#ffffff;}
.footer .inner .flex{flex-direction:row-reverse;}
.footer .box{flex:1 1 50%; padding:30px;}
.footer .box h3,.footer .box h4{text-align:left; font-size:1.5em; margin-bottom:10px;}
.footer .box .nonstop{font-size:1.5em; margin:30px 0; font-weight:bold;}
.footer .box a{color:#ffffff;}
.footer .footer_box{padding:20px 0;display:flex; justify-content:space-between; align-items:center; gap:20px; }

.contact_form{background:#555555; color:#ffffff;}
.contact_form .inner{padding:30px;}
.contact_form h3{color:#ffffff; margin-bottom:5px;}
.contact_form input,.contact_form textarea, .contact_form button{width:100%; padding:5px; margin:5px 0;}
.contact_form textarea{height:calc(100% - 10px);}
.contact_form button{cursor:pointer; background:#dddddd; border:1px solid #333333;}
.contact_form button:hover{background:#ffffff;}
.contact_form .flex{gap:10px;}
.contact_form .flex>div:nth-child(1){flex:0 0 30%;}
.contact_form .flex>div:nth-child(2){flex:0 0 50%;}
.contact_form .flex>div:nth-child(3){flex:0 0 20%; display:flex;align-items:end;}

.contact_form .email_s{display:none;}

.contact_form .result{margin:30px 0; text-align:center; font-weight: bold; font-size: 1.2em;}
.contact_form .result .icon svg{max-height:70px; -webkit-filter: drop-shadow( 0px 0px 10px rgba(0, 0, 0, .7)); filter: drop-shadow( 0px 0px 0px rgba(0, 0, 0, .7));}
.contact_form .result .icon.ok{color:#47cf47;}
.contact_form .result .icon.err{color:#e13737;}
.contact_form .result p{padding:30px 10px;}
.contact_form .gdpr{font-size:0.9em; text-align:center; padding-top:10px;}

.contact_form a{color:#ffffff;}

.copyright{text-align:center; color:#cccccc; font-size:12px; background:#555555;}
.copyright a{color:#ffffff;}

.doc{padding:30px 0;}
.doc .bold{font-weight:bold;}
.doc ol.odstavec{list-style-type: upper-roman; list-style-position: inside; font-size:1.1em; font-weight:bold; }
.doc ol.odstavec>li{padding-bottom:10px; }
.doc ol.odstavec ol{padding-left:30px; font-size:0.9em; font-weight:normal; text-align:justify;list-style-position: outside;}
.doc ol.odstavec ol>li,.doc ol.odstavec ul>li{padding-bottom:5px;}
.doc ol.odstavec ul{padding-left:10px; list-style-type: disc;list-style-position: outside;} 

.text-left{text-align:left;}
.text-center{text-align:center;}
.text-right{text-align:right;}

.flex{display:flex;}

.hidden{display:none !important;}

@media (max-width: 1040px){
.header ul.vyhody{font-size:1.4em;}
}

@media (max-width: 768px){
.header .phone{font-size: 3.0em;padding: 15px 35px;border-width:8px;}
.header .menu_box .menu a {padding: 15px 20px;font-size: 1.6em;}
.contact_form .flex{flex-wrap: wrap;gap: 0px 10px;justify-content: right;}
.contact_form .flex>div:nth-child(1){flex:0 0 40%;}
.contact_form .flex>div:nth-child(2){flex: 0 0 calc(60% - 10px);}
}

@media (max-width: 540px){
.header .name_line h1{font-size:3.4em;}
.header .phone {font-size: 2.6em;padding: 15px 25px;border-width: 6px;}
.header ul.vyhody{font-size:1.2em;}
.header .menu_box .site{text-align:center;}
.header .menu_box .menu{flex-direction:column;  max-height:0;}
.header .menu_box .menu a{padding:10px 20px;    border:0;  }
.header .menu_box .menu{text-align:center;}
.header .menu_box .menu-icon{display:inline-block;}
.sluzby .sluzba{flex: 1 0 50%;}
.cenik{font-size:1.2em}
.auta{gap:20px 0;}
.auta .auto{flex:1 1 100%;}
.footer .inner .flex{flex-direction:column;}
.contact_form .flex>div:nth-child(3){flex:0 0 30%;}
}

@media (max-width: 425px){
.header>.site{padding:20px;}
.header .name_line h2{font-size:1.6em;}
.header .name_line h1{font-size:3.3em; line-height:1em;}
.header ul.vyhody {font-size: 1.0em;}
.header .phone {font-size: 2.4em;padding: 10px 20px;border-width: 5px;}
.sluzby{font-size:1.2em;}
.cenik{font-size:1em;}
.cenik .text{font-weight:normal;}
.cenik .line{gap:5px 10px;}
}

@media (max-width: 375px){
.header{padding:0;}
.header>.site{gap:30px;}
.header .name_line h2{font-size:1.2em;}
.header .name_line h1{font-size:2.6em; line-height:1em;}
.header .phone{font-size:1.8em; padding:10px 15px;}
.contact_form .flex{flex-direction: column;}
.contact_form textarea{height:90px;}
.contact_form button{margin:0;}
.contact_form .flex>div:nth-child(1){width:60%}
.contact_form .flex>div:nth-child(2){width:100%}
.contact_form .flex>div:nth-child(3){width:60%; margin-left:auto;}
}
@media (max-width: 320px){

}














