html{font-size:100.01%;height:100%;width:100%;border:0;padding:0;margin:0;}
body{font-size:16px;font-family:'Noto Sans',sans-serif;color:#332f2e;margin:0;padding:0;text-align:left;background:#fff;height:100%;width:100%;border:0;line-height:1.7;overflow-x: visible !important;}
@media only screen and (max-width: 600px) {
    body{font-size:14px}
}
a img, img{margin:0;padding:0;border:0;}
a{color:#f47725;outline:none;text-decoration:underline;}
a:hover{color:#f47725;text-decoration:none;}
p,h1,h2,h3,h4,h5,h6,ul,ol,li,form,table,td{margin:0;padding:0;}
table{font-size:1em;}
.clear{clear:both;}
.fl{float:left;}
.fr{float:right !important;}
.noScreen{display:none !important;}
.break{display:block !important;}
fieldset{padding:0;margin:0;border:0}
.nowrap{white-space:nowrap !important;}
.textRight{text-align:right !important;}
.center{text-align:center !important;}
.rel{position:relative;}
ul li{list-style-type:none}
input,button,textarea{font-family:'Noto Sans',sans-serif;}
input:focus,button:focus,textarea:focus{outline:none;}
.clearfix:after{content: ".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix{display:inline-block;}
/* Hide from IE-mac \*/
* html .clearfix{height:1%;}
.clearfix{display:block;}
/* End hide from IE-mac */
div,span,a{box-sizing:border-box;}

.header{
width:100%;
height:100px;
color:#fff;
position:fixed;
top:0px;
left:0px;
z-index:100;
background-color:#fff;    
-webkit-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.1);
box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.1);
}
.header .inner{
height:100px;
color:#3f3b3b;
max-width:1200px;
margin:0 auto;
padding:0;
position:relative;
}
.header .inner .logo{
position:absolute;
top:0;
left:50px;
line-height:100px;             
z-index:10; 
font-size:24px;
font-weight:700;
text-decoration:none;
color:#000;
/*background:url(../img/logo-wave.png) no-repeat left bottom;*/
padding:0;
height:100%;
}
.header .inner .logo span{
color:#fb4e01;
}
@media only screen and (max-width: 1023px) {
    .header{
    height:80px; 
    }
    .header .inner{
    height:80px;
    }
    .header .inner .logo{
    line-height:80px;
    }      
}
@media only screen and (max-width: 600px) {
    .header .inner .logo{
    left:30px;
    }
}
@media only screen and (max-width: 400px) {
    .header .inner .logo{
    font-size:20px;
    }
}

#menu{
font-size:16px;
font-weight:bold;
margin:0;
width:100%;
text-align:right;
}
#menu li{
display:inline-block;
padding:0 0 0 30px;
}
#menu a{
display:inline-block;
text-decoration:none;
color:#000;
padding:0;
height:100px;
line-height:100px;
}
@media only screen and (max-width: 1100px) {
    #menu li{
    padding:0 0 0 20px;
    }  
}

@media only screen and (max-width: 1023px) {
    #menu li{
    display:block;
    padding:0;
    } 
    #menu a{
    height:auto;
    line-height:1.5;
    padding:15px 40px;
    font-size:18px;
    }
}
#menu .active a, #menu a:hover{
color:#fb4e01;
}

.hamburger{
z-index:10;
position:absolute;
top:21px;
right:30px;
width:40px;
height:40px;
border:none;
overflow:hidden;
background-color:transparent;
outline:none;
cursor:pointer;
}

.hamburger:before,
.hamburger:after,
.hamburger__inside{
content:"";
background-color:#000;
display:block;
position:absolute;
left:4px;
width:32px;
height:2px;
transition: transform 0.3s, opacity 0.3s;
}

.hamburger:before{
top:7px;
}
.hamburger__inside{
top:19px;
}
.hamburger:after{
top:31px;
}

.menu-active .hamburger__inside{
opacity:0;
}
.menu-active .hamburger:before{
-moz-transform: translate(0px,12px) rotate(45deg);
-ms-transform: translate(0px,12px) rotate(45deg);
-webkit-transform: translate(0px,12px) rotate(45deg);
transform: translate(0px,12px) rotate(45deg);
}
.menu-active .hamburger:after{
-moz-transform: translate(0,-12px) rotate(-45deg);
-webkit-transform: translate(0,-12px) rotate(-45deg);
-ms-transform: translate(0,-12px) rotate(-45deg);
transform: translate(0,-12px) rotate(-45deg);
}

@media(min-width:1024px){
    .hamburger{
    	display:none;
    }
}


.header__menu{
	position:absolute;
	top:0px;
	left:0px;
	padding-top:70px;
	height:100vh;
	width:100%;
	background-color:#fff;
	-moz-transform:translateY(-150%);
	-ms-transform:translateY(-150%);
	-webkit-transform:translateY(-150%);
	transform:translateY(-150%);
	transition:transform 0.7s;
}

.menu-active .header__menu{
	-moz-transform:translateY(0);
	-ms-transform:translateY(0);
	-webkit-transform:translateY(0);
	transform:translateY(0);
}

@media(min-width:1024px){	
	.header__menu, .menu-active .header__menu{
		-moz-transform:translateY(0);
		-ms-transform:translateY(0);
		-webkit-transform:translateY(0);
		transform:translateY(0);
		height:auto;
		padding:0 50px 0 0;
		transition:none;
	}
}

.flash-news{
width:100%;
min-height:60px;
background:#fb4e01;
color:#fff;
margin:100px 0 -100px 0;
text-align:center;
font-weight:700;
padding:17px 50px;
font-size:16px;
}
.flash-news a{
color:#fff;
}
@media only screen and (max-width: 1023px) {
    .flash-news{
    margin:80px 0 -80px 0;
    }
}
@media only screen and (max-width: 600px){
    .flash-news{
        padding:17px 30px;
        text-align:left;
    }
}
.flash-news p{
/*background:url(../img/icon-info.png) no-repeat left 0;*/
/*display:inline-block;*/
/*padding:0 0 0 36px;*/
} 


.button a{
background:#fb4e01;
color:#fff;
text-decoration:none;
font-size:18px;
font-weight:bold;
height:60px;
line-height:60px;
padding:0 30px;
display:inline-block;
border-radius:5px;
}
a:hover.button{
color:#fff;
}

#content{
width:100%;
background:#f4f4f4;
padding:0 50px 80px;
}
@media only screen and (max-width: 1023px) {
    #content{
    padding:0 50px 60px;
    }
}
@media only screen and (max-width: 600px) {
    #content{
    padding:0 30px 40px;
    }
}
#content .inner{
max-width:1100px;
background:#fff;
margin:-80px auto 0;
padding:80px;
position:relative;
z-index:10;
border-radius:20px;
border:1px solid rgba(0,0,0,0.1);
}
@media only screen and (max-width: 1023px) {
    #content .inner{
    padding:50px;
    }
}
@media only screen and (max-width: 600px) {
    #content .inner{
    padding:30px;
    }
}

#hero{
background: rgb(255,240,239);
background: linear-gradient(90deg, rgba(255,240,239,1) 0%, rgba(255,214,210,1) 100%);
position:relative;
margin:100px 0 0;
width:100%;
}
@media only screen and (max-width: 1023px) {
    #hero{
    margin:80px 0 0;
    }
}
#hero.hero-home{
background:url(../img/header-bg.png) no-repeat center center #ffeeed;
}
#hero .inner-home{
max-width:1200px;
height:500px;
margin:0 auto;
padding:0 50px;
position:relative;
background:url(../img/dermatologie-brno-1.png) no-repeat right 120px bottom 0px;
}
#hero .inner{
max-width:1100px;
margin:0 auto;
position:relative;
}
#hero .inner-home .text{
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
transform: translateY(-50%);
padding:0 600px 0 0;
color:#332f2e;
}
@media only screen and (max-width: 1300px) {
    #hero .inner-home .text{
    padding:0 400px 0 0;
    }
}
@media only screen and (max-width: 1023px) {
    #hero .inner-home{
    background:none;
    height:auto;
    padding:50px 50px 40px;
    }     
    #hero .inner-home .text{
    padding:0;
    position:relative;
    top:0;
    -ms-transform: none;    
    transform:none;
    }
}
@media only screen and (max-width: 600px) {
    #hero .inner-home{
    padding:50px 30px 40px;
    }     
}
#hero .inner-home .text h1{
font-size:60px;
font-weight:700;
line-height:1.1;
padding:0 0 35px;
margin:0 0 30px;
color:#000;
background:url(../img/homepage-wave.png) no-repeat left bottom;
}
@media only screen and (max-width: 1100px) {
    #hero .inner-home .text h1{
    font-size:48px;
    }
}
@media only screen and (max-width: 600px) {
    #hero .inner-home .text h1{
    font-size:36px;
    }
}
#hero .inner h1{
font-size:60px;
font-weight:700;
line-height:.95;
padding:80px 0 35px;
margin:0 auto 150px;
color:#000;
background:url(../img/homepage-wave.png) no-repeat center bottom;
text-align:center;
}
@media only screen and (max-width: 1023px) {
    #hero .inner h1{
    font-size:48px;
    padding:50px 0 35px;
    margin:0 auto 120px;
    }
}
@media only screen and (max-width: 767px) {
    #hero .inner h1{
    font-size:36px;
    padding:50px 0 35px;
    margin:0 auto 120px;
    }
}
@media only screen and (max-width: 600px) {
    #hero .inner h1{
    font-size:30px;
    padding:50px 0 35px;
    margin:0 auto 120px;
    }    
}
@media only screen and (max-width: 400px) {
    #hero .inner h1{
    font-size:24px;
    }
}
#hero .inner-home .text p{
margin:0 0 35px;
font-size:18px;
}
#hero .inner-home .text p.button{
opacity:1;
margin:0;
float:left;
}
#hero .inner-home .text p.button a{
margin:0;
height:70px;
line-height:70px;
padding:0 30px;
font-size:18px;
}
#hero .inner-home .text p.notice{
font-size:16px;
font-style:italic;
padding:7px 0 0 20px;
float:left;
width:230px;
}
@media only screen and (max-width: 600px) {
    #hero .inner-home .text p.button{
    float:none;
    }
    #hero .inner-home .text p.notice{
    float:none;
    padding:11px 0 0 0;
    margin:0;
    }
    #hero .inner-home .text p{
    font-size:16px;
    }    
}

#news{
background:#f4f4f4;
width:100%;
padding:60px 0 100px;
}
#news.archive{
top:-60px;
position:relative;
margin:0 0 -120px;
}
#news h2{
max-width:1200px;
margin:0 auto;
font-size:36px;
font-weight:700;
padding:0 25px 30px;
color:#332f2e;
text-align:center;
}
#news .inner{
max-width:1200px;
padding:0 50px;
margin:0 auto;
}
#news .news{
display:block;
width:100%;
padding:50px 50px 40px;
margin:0 0 30px;
background:#fff;
border-radius:10px;
border:1px solid rgba(0,0,0,0.1);
}
#news.archive .news{
margin-bottom:50px;
}
#news .news .date{
font-size:14px;
opacity:.6;
}
#news .news h3{
color:#6D1D00;
font-size:22px;
font-weight:700;
padding:0 0 14px;
line-height:1.3;
}
#news .news p{
padding:0 0 10px;
}
#news .archive{
max-width:1200px;
padding:0 25px;
margin:20px auto 0;
}
@media only screen and (max-width: 1023px) {
    #news{
    padding:50px 0 60px;
    }
    #news h2{
    padding:0 0 30px;
    }
    #news .inner{
    padding:0 50px;
    }
    #news .inner .clearfix{
    display:block;
    }
    #news .news{
    padding:30px;
    width:100%;
    display:block;
    margin:0 0 30px;    
    }
    #news .archive{
    padding:0;
    margin:0 auto 0;
    }    
}
@media only screen and (max-width: 600px) {
    #news{
    padding:30px 0 40px;
    }
    #news .inner{
    padding:0 30px;
    }
    #news h2{
    font-size:30px;
    }    
}

.text-content h2{
font-size:24px;
color:#6D1D00;
font-weight:700;
padding:0 0 25px;
line-height:1.3;
}
.text-content.people h2{
padding:0 0 3px;
}
.text-content h3{
font-size:18px;
padding:0 0 30px;
font-weight:700;
}
.text-content.people h3{
font-weight:400;
}
.text-content h4{
font-size:16px;
padding:0 0 10px;
font-weight:700;
}
@media only screen and (max-width: 600px) {
    .text-content h2{
    font-size:20px;
    }
    .text-contet h3{
    font-size:16px;
    }    
    .text-content h4{
    font-size:14px;
    }    
}
.text-content p{
padding:0 0 30px;
}
.text-content ul{
padding:0 0 24px;
margin:0;
}
.text-content ul li{
padding:0 0 6px 25px;
background:url(../img/li.png) no-repeat 2px 10px;
}
.text-content hr{
height:0;
border:0;
border-top:1px solid rgba(0,0,0,0.15); 
margin:10px 0 40px;
}
.text-content img{
float:right;
width:470px;
margin:0 0 30px 50px;
border-radius:10px;
}
@media only screen and (max-width: 1100px) {
    .text-content img{
    width:370px;
    }
}
@media only screen and (max-width: 1023px) {
    .text-content img{
    width:100%;
    float:none;    
    margin:0 0 30px;
    }
}



.contact{
background:#fff;
display:table;
}
.contact .box{
display:table-cell;
width:50%;
padding:0 0 0;
}
.contact .box-left{
padding-right:50px;
}
.contact .box-right{
padding-left:50px;
}
@media only screen and (max-width: 1023px) {
    .contact{
    display:block;
    }
    .contact .box{
    display:block;
    width:100%;
    padding:0;
    }
}
.contact h1{
font-size:48px;
font-weight:700;
line-height:1.2;
padding:0 0 25px;
margin:0 0 50px;
background:url(../img/h1-wave.png) no-repeat center bottom;
color:#000;
text-align:center;
}
.contact h2{
font-size:24px;
color:#6D1D00;
font-weight:700;
padding:20px 0 20px;
line-height:1.3;
}
.contact h2:first-of-type{
padding:0 0 20px;
}
.contact h3{
font-size:18px;
padding:5px 0 10px;
font-weight:700;
}
@media only screen and (max-width: 600px) {
    .contact h2{
    font-size:20px;
    }
}
.contact p{
padding:0 0 20px;
}
.contact ul{
padding:0 0 24px;
margin:0;
}
.contact ul li{
padding:0 0 6px 25px;
background:url(../img/li.png) no-repeat 2px 10px;
}
.contact ul li p{
padding:0;
}
.contact table{
margin:0 0 20px;
}
.contact table th{
width:65px;
}
.contact table th, .contact table td{
vertical-align:top;
text-align:left;
font-weight:normal;
padding:0 10px 0 0;
}
.contact table small{
white-space:nowrap;
opacity:.6;
}
@media only screen and (max-width: 1023px) {
    .contact table small{
    white-space:normal;
    }
}
.contact hr{
height:0;
border:0;
border-top:1px solid rgba(0,0,0,0.15); 
margin:22px 0 40px;
}
.contact .phone{
font-size:24px;
font-weight:700;
position:relative;
padding:0 0 20px 40px;
margin-top:-5px;
white-space:nowrap;
}
.contact .phone small{
font-weight:400;
font-size:16px;
}
.contact .phone span{
width:38px;
height:38px;
display:block;
position:absolute;
top:10px;
left:0;
background:url(../img/icon-phone.svg) no-repeat 0 0;
background-size:contain;
}
.contact .email{
font-size:24px;
font-weight:700;
position:relative;
padding:0 0 20px 40px;
margin-top:-5px;
white-space:nowrap;
}
.contact .email span{
width:38px;
height:38px;
display:block;
position:absolute;
top:10px;
left:0;
background:url(../img/icon-email.svg) no-repeat 0 0;
background-size:contain;
}

@media only screen and (max-width: 400px) {
    .contact .phone, .contact .email{
    font-size:24px;
    padding:0 0 20px 40px;
    }
    .contact .phone span, .contact .email span{
    width:24px;
    height:24px;
    }    
}

.faq{
border:1px solid rgba(0,0,0,0.1);
background:#f4f4f4;
border-radius:10px;
}
.faq .question{
border-bottom:1px solid rgba(0,0,0,0.1);
}
.faq .question:last-child{
border-bottom:0;
}
.faq .question h2{
font-size:20px;
font-weight:700;
padding:25px 25px 25px 65px;
cursor:pointer;
position:relative;
}
.faq .question h2 span{
position:absolute;
top:50%;
left:25px;
margin-top:-13px;
display:block;
background:url(../img/plus.png) no-repeat 0 0;
background-size:contain;
width:25px;
height:25px;
}
.faq .question.open h2{
color:#fb4e01;
}
.faq .question.open h2 span{
background:url(../img/minus.png) no-repeat 0 0;
background-size:contain;
}
@media only screen and (max-width: 800px) {
    .faq .question h2{
    font-size:18px;
    padding:20px 25px 20px 65px;
    }
}
@media only screen and (max-width: 600px) {
    .faq .question h2{
    font-size:16px;
    padding:20px 20px 20px 65px;
    }
}
.faq .answer{
padding:0 30px;
}

#footer{
background-color:#332f2e;
color:#fff;
text-align:center;
position:relative;
z-index:1;
}
#footer a{
color:#fff;
}
#footer .inner{
padding:70px 50px;
max-width:1200px;
margin:0 auto;
font-size:13px;
display:table;
}
#footer .inner .box{
display:table-cell;
vertical-align:top;
text-align:left;
border-right:1px solid rgba(255,255,255,0.1);
width:25%;
padding:0 20px 0 25px;
}
@media only screen and (max-width: 1200px) {
    #footer .inner .box{
    padding:0 30px;
    }
}
@media only screen and (max-width: 1100px) {
    #footer .inner{
    display:block;
    padding:50px 50px 20px;
    }
    #footer .inner .box{
    display:block;
    width:100%;
    border-right:0;
    padding:0 0 40px;
    }
}
@media only screen and (max-width: 600px) {
    #footer .inner{
    padding:30px 30px 0px;
    }
}
#footer .inner .box:first-child{
padding-left:0;
}
#footer .inner .box:last-child{
border-right:0;
padding-right:0;
}
#footer .inner .box h3{
font-size:14px;
font-weight:700;
color:#fb4e01;
padding:0 0 20px;
}
#footer .inner .box p{
padding-bottom:20px;
}
#footer .inner .box .phone, #footer .inner .box .email{
font-size:14px;
font-weight:700;
position:relative;
padding:0 0 20px 28px;
white-space:nowrap;
}
#footer .inner .box .phone small, #footer .inner .box .email small{
font-size:12px;
font-weight:400;
}

#footer .inner .box .phone span, #footer .inner .box .email span{
width:20px;
height:20px;
display:block;
position:absolute;
top:1px;
left:0;
background:url(../img/icon-phone.svg) no-repeat 0 0;
background-size:contain;
}
#footer .inner .box .email span{
background:url(../img/icon-email.svg) no-repeat 0 0;
background-size:contain;
}
#footer .inner .box table th, #footer .inner .box table td{
vertical-align:top;
text-align:left;
font-weight:normal;
padding:0 5px 0 0;
}
#footer .inner .box table small{
opacity:.6;
}
@media only screen and (max-width: 1100px) {
    #footer .inner .box h3{
    padding:0 0 10px;
    }
    #footer .inner .box p{
    padding-bottom:0px;
    }
}


#footer .inner-bot{
border-top:1px solid rgba(255,255,255,0.1);
font-size:14px;
padding:30px 0;
}
@media only screen and (max-width: 600px) {
    #footer .inner-bot{
    font-size:12px;
    }
}
#footer .inner-bot p{
opacity:.6;
padding:0 20px;
font-size:13px;
}


.day{padding:20px 0 15px;}
.day .text{float:left}
.day .date{font-weight:700;padding:0 0 10px;}
.day ul{padding:0 0 5px}
.day ul li{padding:0 0 2px;position:relative;}
.day a,.day span{margin:0 0 0 10px;position:absolute;left:100px;white-space:nowrap;}
.selectDate{padding:0 0 20px}
.selectDate p{padding:0 0 20px}
.selectDate input[type=text]{width:190px;height:48px;line-height:48px;border:1px solid #b2b2b2;background:#fff;float:left;margin:0 0 16px;padding:0 10px;font-size:16px;border-radius:5px 0 0 5px;}
@media (max-width: 500px) {
    .selectDate input[type=text]{width:100px;}
}
.selectDate input.btn{background:#332f2e;border:0;height:50px;line-height:50px;padding:0 30px;cursor:pointer;color:#fff;font-weight:400;-webkit-appearance: none;font-size:16px;border-radius:0 5px 5px 0;margin-left:-1px;}
.form1{float:right;position:relative}
.form1 .kotva{position:absolute;top:-100px;left:0}
.form1 p.title{font-weight:700;color:#6D1D00;padding:0 0 8px!important;font-size:18px}
.form1 p.subtitle{padding:0 0 30px!important;font-style:italic}
.form1 .fr{padding:0 0 0 25px}
.form1 label{font-weight:700;line-height:36px;display:block;float:left;width:97px;font-size:16px}
.form1 input[type=text]{width:190px;height:36px;line-height:36px;border:1px solid #b2b2b2;background:#fff;float:left;margin:0 0 16px;padding:0 5px}
.form1 textarea{width:520px;height:100px;border:1px solid #b2b2b2;background:#fff;float:left;padding:5px;margin:0 0 30px}
.form1 .btn{height:70px;line-height:70px;display:block;background:#fb4e01;float:left;text-align:center;cursor:pointer;border:0;padding:0 30px;color:#fff;font-size:18px;font-weight:700;border-radius:5px;margin:0 0 30px 95px}

@media (max-width: 1000px) {
    .day .text{float:none}
    .form1{float:none}
    .form1 p.title{padding:25px 0 8px!important;}
    .form1 p.subtitle{padding:0 0 20px!important;}
    .form1 .fl{float:none}
    .form1 .fr{float:none !important;padding:0;}
    .form1 label{float:none;}
    .form1 .btn{margin:0 0 30px;}
    .form1 textarea{width:100%;box-sizing: border-box;}
}
