.tl a, .tl span, .listSubmenu a, #paticka .tl a, input.submit, button.submit, .tlDalsiOdkazy a {position: relative; line-height: 120%; padding: 18px 40px 18px; background-color: #54af3a; color: #fff; text-decoration: none; display: inline-block; font-size: 100%; transition: .2s all ease; border-radius: 25px; font-weight: bold;}
.tl a:hover, .tl span:hover, .listSubmenu a:hover, input.submit:hover, button.submit:hover, #paticka .tl a:hover, .tlDalsiOdkazy a:hover {padding-left: 30px; padding-right: 50px;}

.tlViceInfo a {background-color: #fff; color: #111111;}
.tlViceInfo a:hover {background-color: #fff;}

input.submit, button.submit {padding: 14px 40px;}

.tl .tlSipka {width: 36px;height: 36px;position: absolute;cursor: pointer;right: 15px;top: 0; bottom: 0; background-color: transparent; transition: .15s all ease; margin: auto 0 auto 6px; z-index: 152;}
.tl .tlSipka .line {position: absolute; height: 2px; width: 35%; margin: auto; background-color: rgba(255,255,255,0); transition: .2s all ease;}
.tl .tlSipka .line1 {transform: rotate(45deg); right: 10px; top:13px;}
.tl .tlSipka .line2 {transform: rotate(-45deg); right: 10px; bottom:13px;}
.tl a:hover .tlSipka .line, .tl span:hover .tlSipka .line, button:hover .tlSipka .line {background-color: rgba(255,255,255,1); right: 5px;}

.tlViceInfo .tlSipka .line {background-color: rgba(0,0,0,0);}
.tlViceInfo a:hover .tlSipka .line {background-color: rgba(0,0,0,1);}

.pageloader {position: fixed;left: 0px;top: 0px;width: 100%;height: 100%;z-index: 300;background-color: rgb(0, 0, 0);opacity: 1;}
.pageloaderContent {position: absolute; top:0; left: 0; right:0; bottom:0; margin: auto; width: 0; height: 0;}
.lds-ellipsis,.lds-ellipsis div {box-sizing: border-box;}
.lds-ellipsis {display: inline-block;width: 80px;height: 80px; position: absolute; bottom: 0; top:0; left: -40px; right:0; margin: auto auto; }
.lds-ellipsis div {position: absolute;top: 33.33333px;width: 13.33333px;height: 13.33333px;border-radius: 50%;background: #ffffff;animation-timing-function: cubic-bezier(0, 1, 1, 0);}
.lds-ellipsis div:nth-child(1) {left: 8px;animation: lds-ellipsis1 0.6s infinite;}
.lds-ellipsis div:nth-child(2) {left: 8px;animation: lds-ellipsis2 0.6s infinite;}
.lds-ellipsis div:nth-child(3) {left: 32px;animation: lds-ellipsis2 0.6s infinite;}
.lds-ellipsis div:nth-child(4) {left: 56px;animation: lds-ellipsis3 0.6s infinite;}
@keyframes lds-ellipsis1 {0% {transform: scale(0);}100% {transform: scale(1);}}
@keyframes lds-ellipsis3 {0% {transform: scale(1);}100% {transform: scale(0);}}
@keyframes lds-ellipsis2 {0% {transform: translate(0, 0);}100% {transform: translate(24px, 0);}}

/******** hlavicka *********************************/
header.hlavicka {width: 100%; height: 102px; width: 100%; position: fixed;top: 0;z-index: 200; transition: .2s all ease; background-color: #54af3a; box-shadow: 0px 0px 8px rgba(0,0,0, .2);}
header.hlavicka .wrapper {position: relative; height: 100%; }
/*.podstrana header.hlavicka .wrapper {background: linear-gradient(to right, #000 0%,rgba(0,0,0,.2) 50%,rgba(0,0,0,.2) 50%,#000 100%);}*/
.hlavickaContent {height: 100%;}

#logo {margin: 0; position: absolute; left: 0; top: 0; transition: .2s all ease; line-height: 70%; z-index: 152; padding: 0; display:-ms-flexbox;display:flex; -ms-align-items:center;align-items: center;background-color: transparent;}

#logo a {display: block; position: absolute; text-decoration: none; border: none; width: 340px; top: 15px; left: 50px;}
#logo a img {transition: .2s all ease;}

/**********************************************/
#boxMenu {display:-ms-flexbox;display:flex; -ms-align-items:center;align-items: center;}
#hlavniMenu {position: relative; z-index: 151; }

#boxMenuContent {height: 100%; transition: .2s all ease; display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:right;justify-content:right;}
#boxMenuContent > ul {margin: 0;padding: 0;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:right;justify-content:right;  -ms-align-items:center;align-items: center; transition: .2s all ease; height: 100%;}
#boxMenuContent > ul > li {list-style: none; padding: 0 20px; transition: .2s all ease; }
#boxMenuContent > ul > li > a { display: block; text-decoration: none; font-size: 140%; position: relative;  padding: 6px 0px 8px; color: #fff; font-weight: 600; border: none; border-bottom: solid 3px rgba(255,255,255, 0); font-style: italic;}
#boxMenuContent > ul > li > a.aktivni, #boxMenuContent > ul > li > a.aktivni:hover {border-bottom: solid 3px rgba(84,175,58, 1); color: rgba(84,175,58,1);}
.podstrana #boxMenuContent > ul > li > a.aktivni, .navMin #boxMenuContent > ul > li > a.aktivni,
.podstrana #boxMenuContent > ul > li > a.aktivni:hover, .navMin #boxMenuContent > ul > li > a.aktivni:hover {border-bottom: solid 3px #1a1a18; color: #1a1a18;}

#boxMenuContent > ul > li > a:hover {border-color: rgba(255,255,255,1); }
#boxMenuContent > ul > li > a.aktivni {border-color: rgba(84,175,58,1); }
#boxMenuContent > ul > li:first-of-type {padding-left: 0;}



#boxMenuContent .boxMenuContent2 {display:-ms-flexbox;display:flex; -ms-align-items:center;align-items: center;}
#boxMenuContent .boxRychlyKontaktHlavicka {display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:right;justify-content:right; margin: 0 0 0 20px; padding: 0;}
#boxMenuContent .boxRychlyKontaktHlavicka li {list-style: none; padding: 0 20px; transition: .2s all ease;}
#boxMenuContent .boxRychlyKontaktHlavicka li:last-of-type {padding-right: 0;}
#boxMenuContent .boxRychlyKontaktHlavicka li a, #boxMenuContent .boxRychlyKontaktHlavicka li img {display: block;}
#boxMenuContent .boxRychlyKontaktHlavicka li a {height: 40px; transition: .2s all ease;}
#boxMenuContent .boxRychlyKontaktHlavicka li img {height: 100%; width: auto;}
#boxMenuContent .boxRychlyKontaktHlavicka li a:hover {transform: rotate(20deg);}
/**********************************************/
.uvod header.hlavicka:not(header.navMin) {background-color: transparent; box-shadow: none; height: 200px; }
/**********************************************/
header.navMin {}
header.navMin #logo, .podstrana #logo {width: 460px; height: 140px; background-color: #262626; clip-path: polygon(0% 0%, 100% 0%, 80% 100%, 0% 100%);}
header.navMin #logo a, .podstrana #logo a  {width: 270px; top: 12px;}
/**********************************************/
.aTl a {text-decoration: none; text-transform: uppercase; font-size: 130%; color: #000; padding: 15px 50px 10px; transition: .2s all ease; line-height: 200%;}
/******************************************************/
#hlavniObsah {position: relative; padding: 0; flex-grow: 1; background-color: #eaf5e7;}
#hlavniObsah::before {content: ""; width: 100%; height: 100%; background: transparent url(../layout/bgHlavniObsah.webp) no-repeat right 10% bottom 0%; opacity: 0.05; position: absolute; bottom: 0; margin: auto auto 0; left: 0; right: 0; background-attachment: fixed;}


.boxZakladniObsah h1 {padding: 0;}
#drobeckova-navigace {padding: 0 0 50px;}
/******************************************************/
.boxZakladniNadpis {padding: 50px 0; background: #fff url(../layout/sekce/lecebnaKosmetika.webp) no-repeat center center; background-size: cover; min-height: 600px;}
.boxZakladniNadpis.boxZakladniNadpisONas                   {background: #fff url(../layout/sekce/oNas.webp) no-repeat center center; background-size: cover; min-height: 600px;}


.boxZakladniNadpis .boxZakladniNadpisContent {background-color: #fff; padding: 15px 30px;  display: inline-block; position: relative; box-shadow: 0px 0px 27px rgba(0,0,0, .25);}
.boxZakladniNadpis .boxZakladniNadpisContent::after {clip-path: polygon(0% 0%, 100% 0%, 0% 100%, 0% 100%); background-color: #fff; position: absolute; right: -90px; top: 0; width: 90px; height: 100%; content: ""; }
.boxZakladniNadpis #drobeckova-navigace {padding: 0px; margin: 0}
.boxZakladniNadpis h1 {padding: 0; margin: 0; line-height: 120%; }
.boxZakladniNadpis{-ms-align-items:end;align-items: end; display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;}
/******************************************************/
.boxZakladni  {padding: 80px 0 80px 0; position: relative;}
.box70 {width: 70%; margin: 0 auto;}
.boxUvodMapa {background-color: #1b1b1a;padding: 0;}
.podstrana .boxZakladni {}
.podstrana .boxZakladniPrvni {padding-top: 102px;}
.boxCenterText div.text {text-align: center;}
.boxSmluvniPojistovny, .boxNovinka, .boxKontakty {background-color: rgba(0,0,0,.05); background-color: #fff;}
.boxFormularPaddingTop0 {padding-top: 0;}
/***********************************************************/
.boxZakladniSetWidth {width: 70%; }

.boxSubmenu {padding: 0; background-color: #fff;}
.boxSubmenu ul {display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:space-between;justify-content:space-between; margin: 0; padding:0;}
div.text .boxSubmenu ul li {list-style: none; margin: 0; padding: 0;}
.boxSubmenu ul a {display: block; padding: 80px 80px 75px; border-bottom: 5px solid #fff;}
.boxSubmenu ul a:nth-of-type(1) {border-color: #555;} /*** zde****/

.boxZakladniObsah { padding: 70px 0 0;  }
/******************************************************/
.boxNadpisGraf {font-size: 130%; margin: 0 0 30px; font-weight: 500; position: relative; text-align: center;}
.boxNadpisGraf span.out { padding: 0 20px; display: inline-block; position: relative;}
.boxNadpisGraf span.in {background-color: #f4517c; color: #fff; border-radius: 25px; margin:0; padding: 16px 45px; display: inline-block;}
.boxNadpisGraf::before {content: ""; width: 100%; height: 4px; background-color: #f4517c; position: absolute; top: 0; bottom: 0; margin: auto; left: 0; right: 0;}

/******************************************************/
#boxUvod {}
#boxUvod .contentBanner {background: transparent url(../layout/bgBanner.webp) no-repeat center top; background-size: cover; min-height: 100vh; position: relative; padding: 143px 0 0;}
#boxUvod .contentBanner .wrapper {-ms-align-items:center;align-items: center; position: relative;  z-index: 96;}

.boxNovinka .boxNovinkaItems {background-color: #fff;}
.boxNovinka .boxNovinkaContent  {padding: 30px 0; background-color: #fff;}
.boxNovinka .boxNovinkaFoto {width: 25%; position: relative;}
.boxNovinka .boxNovinkaFoto img {display: block;}
.boxNovinka .boxNovinkaText {width: 65%; -ms-align-items:center;align-items: center;}
.boxNovinka .boxNovinkaText p {padding: 0 0 15px;}
.boxNovinka .boxNovinkaContentFull .boxNovinkaText {width: 100%;}
.boxNovinka .boxNovinkaNadpis2 {padding: 0 0 25px 0; margin: 0;}

.boxNovinka .boxNovinkaDatum {line-height: 110%; height: 150px; width: 150px; border: solid 20px #fff; -ms-align-items:center;align-items: center; display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap; -ms-justify-content:center;justify-content: center; text-align:center; position: absolute; top: 0; right: -100px; bottom:0; margin: auto 0 auto auto; background-color: #54af3a; border-radius: 110px;}
.boxNovinka .boxNovinkaDatum span span {display: block; width: 100%; color: #fff;}
.boxNovinka .boxNovinkaFotoContent {position: relative;}
.boxNovinka .boxNovinkaFotoContent::before {content: ""; width: 4px; height: 100%; background-color: #54af3a; position: absolute; top: 0; bottom: 0; margin: auto 0 auto auto; left: 0; right: -27px;}
.boxNovinka .boxNovinkaDatum .mesic {font-size: 150%;padding: 0 0 5px;}
.boxNovinka .boxNovinkaDatum .rok {font-size: 70%; padding: 0 0 3px;}
/*******************************************************/
.boxBanner {text-align: left; color: #fff; }
.boxBanner .boxBannerNadpis {font-size: 230%; color: #fff; margin: 0; padding: 0 0 40px; line-height: 120%; font-weight: 800; font-style: italic;}
.boxBanner .boxBannerNadpis strong {display: block; font-size: 180%; line-height: 100%;}
.boxBanner .boxBannerText {font-weight: 300;}
.boxBanner .boxBannerText {font-size: 120%; color: #fff; margin: 0 auto 0 0; width: 50%;}

.boxBannerTlacitka {padding: 50px 0 0;}
.boxBannerTlacitka ul {margin: 0; padding: 0;}
.boxBannerTlacitka li {list-style: none; padding: 0; margin: 0 5px 25px 0;}
.boxBannerTlacitka li:last-of-type {margin-right: 0;}
.boxBannerTlacitka a {box-shadow: 0px 0px 27px rgba(0,0,0, .25);}

.sluzbaEstetickaDermatologie a {background-color: #e78801;}
.sluzbaDermatologie a {background-color: #0cade2;}
.sluzbaDermatochirurgie a {background-color: #f4517c;}
.sluzbaKorektivniDermatologie a {background-color: #911aff;}
.sluzbaLecebnaKosmetika a {background-color: #54af3a;}
/******************************************************/
.boxRychlyKontakt {background-color: #130a02; padding: 0; color: #fff;}
.boxRychlyKontakt .boxRychlyKontaktItem  {width: 50%; display: -ms-flexbox; display: flex;-ms-flex-wrap: wrap; flex-wrap: wrap; -ms-align-items:center;align-items: center;}
.boxRychlyKontakt .boxRychlyKontaktLeft {background: transparent url(../layout/bgRychlyKontakt.webp) no-repeat center center; background-size: cover;}
.boxRychlyKontakt .boxRychlyKontaktContent {width: 500px; margin: auto 0 auto auto; padding: 0 160px 0 0;}
.boxRychlyKontakt#boxRychlyKontakt {padding: 0; }

.boxRychlyKontakt a {color: #fff;}
.boxRychlyKontakt h2 {margin: 0 0 60px; color: #fff;}

.boxRychlyKontakt .tableOrdinacniDoba {background-color: transparent; color: #fff;}
.boxRychlyKontakt .tableOrdinacniDoba th, .boxRychlyKontakt .tableOrdinacniDoba td {background-color: transparent; border: none; padding: 0 30px 30px 0; }
.boxRychlyKontakt .tableOrdinacniDoba td {width: 35%;}
.boxRychlyKontakt .tableOrdinacniDoba th {width: 30%;}
.boxRychlyKontakt .tableOrdinacniDoba th, .boxRychlyKontakt .tableOrdinacniDoba td strong {font-weight: 900;}
.boxRychlyKontakt .tableOrdinacniDoba td .poznamka {font-size: 70%; font-weight: 200; padding: 5px 9px; border-radius: 10px; display: inline-block;line-height: 120%;}
.boxRychlyKontakt .tableOrdinacniDoba td .bgProObjednane        {background-color: #f4517c; background-color: rgba(244, 81, 124, .7);}
.boxRychlyKontakt .tableOrdinacniDoba td .bgProObjednaneVykony  {background-color: #0cade2; background-color: rgba(12, 173, 226, .7);}
.boxRychlyKontakt .tableOrdinacniDoba td .bgProLecebnaKosmetika {background-color: #54af3a; background-color: rgba(84, 175, 58, .7);}
/***********************************************************/
.galerie {padding: 0 0 20px;}
.galerie .polozka {width: 50%; padding: 0 0 20px; display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:space-between;justify-content:space-between; text-align: left;}
.galerie .polozka .foto {line-height: 60%; width: 13%;}
.galerie .polozka .nazev { width: 85%;}
.galerie .polozka h3 {font-size: 110%; padding: 0 0 10px;}
.galerie .polozka .datum {}

.boxGalerieDetail .boxGalerie {margin: 25px 0 0; display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-justify-content:left;justify-content:left; }
.boxGalerieDetail .boxGalerie .polozka {margin: 0 2% 2% 0; width: 23%;}
.boxGalerieDetail .boxGalerie .polozka a {display: block;}
.boxGalerieDetail .boxGalerie .polozka a img {display: block; margin: 0 auto;}

.boxFotogalerie .my-gallery {margin: 0 0 25px;}

.my-gallery figcaption {display: none;}

/*********************************************************/
.boxFormular .webFormular {background-color: #54af3a; padding:60px 70px; border-radius: 25px;}
.boxFormular .formular-obsah {background-color: #fff; padding:60px 70px; border-radius: 10px;}

/******************************************************/
#paticka {background-color: #000;}
#paticka, #paticka * {color: #fff;}
#paticka a {color: #fff; font-weight: normal;}
#paticka a:hover {}
#paticka a.bold {font-weight: bold;}
/******************************************************/
#paticka .patickaBottom {background-color: #000000; padding: 35px 0; font-size: 100%;}
#paticka .patickaBottom .p {padding: 0; text-align: center;}
#paticka .patickaBottom * {color: #fff;}
/********************************************************/
/*****************************************************/
#boxHlavniKontakt .boxHlavniKontakt {width: 49%;}
#boxHlavniKontakt .boxRecepce {width: 49%; text-align: right;}

#boxHlavniKontakt .boxPolozkaInformace {width: 65%;}
#boxHlavniKontakt .boxPolozkaInformace > div {line-height: 150%;}
#boxHlavniKontakt .boxPolozkaInformace .kontaktJmeno {padding: 0 0 5px; font-weight: bold; font-size: 130%;}
#boxHlavniKontakt .boxPolozkaInformace .kontaktFunkce {padding: 0 0 25px;}

#boxHlavniKontakt .boxPolozka {width: 46%; padding: 40px 35px; margin: 0 2% 4%; text-align: left; background-color: #fff;box-shadow: 0px 0px 27px rgba(0,0,0, .1);}
#boxHlavniKontakt .boxPolozka h3 {font-size: 140%; font-weight: bold; color: #000;}
#boxHlavniKontakt .boxPolozka div.p {padding: 0 0 5px;}
#boxHlavniKontakt .boxPolozkaMale div.p {background: transparent url(../layout/ikoMale.png) no-repeat 0 10px; padding: 0 0 0 80px; }
#boxHlavniKontakt .boxPolozkaFemale div.p {background: transparent url(../layout/ikoFemale.png) no-repeat 0 10px; padding-left: 80px; }
#boxHlavniKontakt .kontaktIko a, #boxHlavniKontakt .rAdresa span {padding: 5px 0 5px 27px;}
#boxHlavniKontakt .rEmail a     {background: transparent url(../layout/ikoMailTm.webp) no-repeat left 0px center;   background-size: auto 18px;}
#boxHlavniKontakt .rTelefon a   {background: transparent url(../layout/ikoTelTm.webp) no-repeat left 1px center;    background-size: auto 19px;}
#boxHlavniKontakt .rAdresa span {background: transparent url(../layout/ikoPoloha.webp) no-repeat left 2px center; background-size: auto 19px;}

#boxHlavniKontakt .boxDalsiKontaktyClanek .boxPolozka {width: 29%; margin: 0 3.5% 4% .5%;}

#boxHlavniKontakt .kontaktyTlacitka {padding: 30px 0 0;}
#boxHlavniKontakt .kontaktyTlacitka ul {margin: 0; padding: 0;}
#boxHlavniKontakt .kontaktyTlacitka li {list-style: none; padding: 0; margin: 0 20px 20px 0;}
#boxHlavniKontakt .kontaktyTlacitka .tlOrdinacniDoba a {background-color: #f4517c;}
/*****************************************************/
.boxLide {padding: 50px 0 0;}
.boxLide .boxLidePolozka {border-radius: 25px; background-color: #fff; box-shadow: 0px 0px 27px rgba(0,0,0, .1); padding: 40px 50px; margin: 0 0 90px;}
.boxLide .boxLideFoto {width: 25%;}
.boxLide .boxLideFoto img {border-radius: 400px;}
.boxLide .boxLideText {width: 70%;}
/*****************************************************/

.boxSmluvniPojistovnyContent {margin: 0; padding: 70px 0 0; }
.boxSmluvniPojistovnyContent li {display: -ms-flexbox; display: flex;-ms-flex-wrap: wrap; flex-wrap: wrap; -ms-align-items:center;align-items: center; -ms-justify-content:center;justify-content:center; padding: 0; margin: 0 0 4%; width: 29%; max-width: 400px; list-style-type: none;}
/*****************************************************/
.boxSluzbyPrehled  {padding: 40px 0 0;}
.boxSluzbyPrehled .boxSluzbyPrehledPolozka {width: 100%; border-radius: 25px; background-color: #fff; box-shadow: 0px 0px 27px rgba(0,0,0, .1); padding: 40px 50px; margin: 0 0 50px;}
.boxSluzbyPrehled .boxSluzbyPrehledPolozka ul{margin: 40px 0 0; padding:0;}
.boxSluzbyPrehled .boxSluzbyPrehledPolozka li {list-style: none; padding: 0; margin: 0 20px 20px 0;}
/*****************************************************/

.boxDalsiZakroky {padding-top: 0;}
.boxDalsiZakroky .boxSluzbyPrehled  {padding: 0;}

.tlMamZajem {margin-bottom: 50px;}

.boxMapa {line-height: 60%;/*filter: grayscale(100%);*/}

/***** POPUP BLOCK *****/
.white-popup-block {background: none repeat scroll 0 0 #FFFFFF;margin: 20px auto;max-width: 900px;padding: 2em 3em;position: relative;width: auto;}
.white-popup-block h2 {font-size: 150%; border-bottom:solid 1px #ddd; padding: 0 0 10px; margin: 0 0 25px;}