@media screen and (max-width: 990px) {
.navbar-brand {width: 30%!important; margin: 10px 0 10px 0;}
div.BoxInfoPravaHorni {position: relative; width: 95%; clear: both; height: 600px; display: block; background: url('/images/banner/vizualizace-ptlnp-003.png'); background-position: -900px 0; background-repeat: no-repeat; border: none;
  }
div.BoxInfoLevaHorni{position: relative; width: 95%; margin: 0 auto 0 auto;}
.BoxTym {width: 95%; margin: 0 auto 0 auto;}
  ul.SeznamObsah {color: rgba(0,0,0,0.7); font-size: 1.4rem; text-align: center; list-style: none; padding: 0; margin: 0;}
  .NadpisSeznamObsah {font-weight: 600; font-size: 1.4rem; margin: 20px 0 5px 0; text-align: center;}
  div.BoxSite {float: right; margin: 0 0px 15px 0px;}
  img.LogoPTLNPUvod {width: 59%; margin: 10% 0 0 0;}
.NadpisTmavePozadi {font-size: 3.2rem; padding: 5% 5% 3% 5%; text-align: center; color: rgba(255,255,255,0.9); font-weight: 100;}
.NadpisSvetlePozadi {font-size: 3.2rem; padding: 5% 5% 2% 5%; text-align: center; color: rgba(0,0,0,0.9); font-weight: 100;}
.NadpisSvetlePozadiUvod {font-size: 2.8rem; padding: 5% 0 2% 0%; text-align: left; color: rgba(0,0,0,0.9); font-weight: 100;}
.PodnadpisSvetlePozadiUvod {font-size: 1.8rem; padding: 5% 0 2% 0%; text-align: left; color: rgba(0,0,0,0.9); font-weight: 100;}
.PodnadpisTmavePozadi {font-size: 2.1rem; padding: 5% 0 2% 0%; text-align: center; color: rgba(255,255,255,0.9); font-weight: 100;}
.PodnadpisSvetlePozadi {font-size: 2.1rem; padding: 3% 0 1% 0%; text-align: center; color: rgba(0,0,0,0.9); font-weight: 100;}
.NadpisObrazkyTmavePozadi {font-size: 2rem; text-align: center; color: rgba(255,255,255,0.9); padding: 10% 5% 20px 5%;}
.NadpisObrazkySvetlePozadi {font-size: 2rem; text-align: center; color: rgba(0,0,0,0.9); padding: 10% 5% 20px 5%;}
 
.ObrazkyTextLeva {float: none; width: 99%; margin: 30px auto 30px auto;}
.ObrazkyTextPrava {float: none; width: 99%; margin: 30px auto 30px auto;}
div.OddelovacPruhy {height: 30px;}  
.BoxObrazkyStred {width: 95%; padding: 20px; margin: 0 auto 0 auto;}
.BoxPatickaKontakty {width: 100%; color: rgba(255,255,255,0.8); margin: 30px 0 20px 0; clear: both;}
  
h3.H3Tlacitko {cursor: pointer; cursor: hand; text-decoration: none; width: 90%; padding: 20px; background-color: #EE9200; color: white; border: none; border-radius: 8px; margin: 50px auto 20px auto; text-align: center; transition: 0.5s;}
  
h3.H3Tlacitko:hover {cursor: pointer; cursor: hand; text-decoration: none; width: 90%; padding: 20px; background-color: #68942D; color: white; border: none; border-radius: 8px; margin: 50px auto 20px auto; text-align: center; transition: 0.5s;}

h3.H3Tlacitko span {cursor: pointer; display: inline-block; position: relative; transition: 0.5s;}
h3.H3Tlacitko span:after {content: '\00bb'; position: absolute; opacity: 0; top: 0; right: -20px; transition: 0.5s;}
h3.H3Tlacitko:hover span {padding-right: 25px;}
h3.H3Tlacitko:hover span:after { opacity: 1; right: 0;}   
  

#Tlacitko {cursor: pointer; cursor: hand; text-decoration: none; width: 90%; padding: 20px; background-color: #EE9200; color: white; border: none; border-radius: 8px; margin: 50px auto 20px auto; text-align: center; transition: 0.5s;}
  
#Tlacitko {cursor: pointer; cursor: hand; text-decoration: none; width: 90%; padding: 20px; background-color: 68942D; color: white; border: none; border-radius: 8px; margin: 50px auto 20px auto; text-align: center; transition: 0.5s;}

#Tlacitko span {cursor: pointer; display: inline-block; position: relative; transition: 0.5s;}
#Tlacitko span:after {content: '\00bb'; position: absolute; opacity: 0; top: 0; right: -20px; transition: 0.5s;}
#Tlacitko:hover span {padding-right: 25px;}
#Tlacitko:hover span:after { opacity: 1; right: 0;}   

.skryvany {display: none} 

.PosunMobilniVerze {margin-top: 70px;}

.FotoPaticka {width: 95%; float: none; margin: 0 auto 0 auto;} 
.KontaktyPaticka {width: 95%; float: none; margin: 0 auto 0 auto;}
.LogoPaticka {width: 99%; opacity: 0.9;padding: 0; border: 1px solid rgba(255,255,255,0.7);}
.TextKontaktyPaticka {margin-left: 20px; margin-top: 10px;}
  
.ImgSponzor {margin: 2px auto 2px auto; border: 1px solid rgba(0,0,0,0.3); width: 95%;}
  
.BoxTlacitka {margin: 50px auto 50px auto; width: 95%; border: none; text-align: center;} 
  
.LevyBoxKariera {background-color:transparent; color: rgb(0,73,146); padding: 20px; font-size: 1.1rem; margin: 0 auto 30px auto; width: 95%; border-bottom: 1px solid rgba(0,0,0,0.2);}
.PravyBoxKariera {background-color:transparent; color: rgb(0,73,146); padding: 5px; font-size: 1.1rem; margin: 0 auto 30px auto; width: 95%; border-bottom: 1px solid rgba(0,0,0,0.2);}
.BoxKarieraFotoNadpis {position: absolute; bottom: 22%; width: 95%; right: 0; padding: 25px; background: rgba(0,73,146,0.7); color: rgba(255,255,255,0.9);}  

.ObrazkyNovinky {width: 95%; margin: 0 auto 0 auto;}
.com-contact__container {width: 100%; float: none; margin: 0;}
}



@media screen and (min-width: 1000px) {
.navbar-brand {width: 12%!important; margin: 10px 0 10px 0;}
div.BoxInfoPravaHorni {position: relative; float: right; width: 45%; height: 100vh; display: block; background-image: url("/images/banner/vizualizace-ptlnp-003.png"); background-position: -900px 0; background-repeat: no-repeat; border: none;
  }
div.BoxInfoLevaHorni{position: relative; width: 50%; float: left;}
.BoxTym {width: 25%; float: left;}
ul.SeznamObsah {color: rgba(0,0,0,0.7); font-size: 1.4rem; text-align: left;}
.NadpisSeznamObsah {font-weight: 600; font-size: 1.4rem; margin: 10px 0 -2px 0;}
div.BoxSite {float: right; margin: 0 10px 0 10px;}
img.LogoPTLNPUvod {width: 35%; margin: 10% 0 0 0;}

.NadpisTmavePozadi {font-size: 3.2rem; padding: 2% 5% 2% 5%; text-align: center; color: rgba(255,255,255,0.9); font-weight: 400;}
.NadpisSvetlePozadi {font-size: 3.2rem; padding: 5% 5% 2% 5%; text-align: center; color: rgba(0,0,0,0.9); font-weight: 400;}
.NadpisSvetlePozadiUvod {font-size: 2.8rem; padding: 5% 0 2% 0%; text-align: left; color: rgba(0,0,0,0.9); font-weight: 100;}
.PodnadpisSvetlePozadiUvod {font-size: 1.8rem; padding: 5% 0 2% 0%; text-align: left; color: rgba(0,0,0,0.9); font-weight: 100;}
.PodnadpisTmavePozadi {font-size: 2.1rem; padding: 5% 0 2% 0%; text-align: center; color: rgba(255,255,255,0.9); font-weight: 400;}
.PodnadpisSvetlePozadi {font-size: 2.1rem; padding: 3% 0 1% 0%; text-align: center; color: rgba(0,0,0,0.9); font-weight: 400;}
.NadpisObrazkyTmavePozadi {font-size: 2rem; text-align: center; color: rgba(255,255,255,0.9); padding: 10% 5% 20px 5%;}
.NadpisObrazkySvetlePozadi {font-size: 2rem; text-align: center; color: rgba(0,0,0,0.9); padding: 10% 5% 20px 5%;}

.ObrazkyTextLeva {float: left;}
.ObrazkyTextPrava {float: right;}
  
div.OddelovacPruhy {height: 5px;}
.BoxObrazkyStred {width: 60%; padding: 20px; margin: 0 auto 0 auto;} 
.BoxPatickaKontakty {width: 50%; float: left; color: rgba(255,255,255,0.8);}

  
h3.H3Tlacitko {cursor: pointer; cursor: hand; text-decoration: none; width: 20%; padding: 20px; background-color: #EE9200; color: white; border: none; border-radius: 8px; margin: 50px auto 20px auto; text-align: center; border: 1px solid; padding: 10px; box-shadow: 3px 3px 3px 0px #A4A4A4; transition: 0.5s;}

h3.H3Tlacitko:hover {cursor: pointer; cursor: hand; text-decoration: none; width: 20%; padding: 20px; background-color: #68942D; color: white; border: none; border-radius: 8px; margin: 50px auto 20px auto; text-align: center; border: 1px solid; padding: 10px; box-shadow: 3px 3px 3px 0px #A4A4A4; transition: 0.5s;}

  
h3.H3Tlacitko span {cursor: pointer; display: inline-block; position: relative; transition: 0.5s;}
h3.H3Tlacitko span:after {content: '\00bb'; position: absolute; opacity: 0; top: 0; right: -20px; transition: 0.5s;}
h3.H3Tlacitko:hover span {padding-right: 25px;}
h3.H3Tlacitko:hover span:after { opacity: 1; right: 0;}   

#Tlacitko {cursor: pointer; cursor: hand; text-decoration: none; width: 20%; padding: 20px; background-color: #EE9200; color: white; border: none; border-radius: 8px; margin: 50px auto 20px auto; text-align: center; border: 1px solid; padding: 10px; box-shadow: 3px 3px 3px 0px #A4A4A4; transition: 0.5s;  
}
  
  
  
#Tlacitko:hover {cursor: pointer; cursor: hand; text-decoration: none; width: 20%; padding: 20px; background-color: #68942D; color: white; border: none; border-radius: 8px; margin: 50px auto 20px auto; text-align: center; border: 1px solid; padding: 10px; box-shadow: 3px 3px 3px 0px #A4A4A4; transition: 0.5s;   
}

#Tlacitko span {cursor: pointer; display: inline-block; position: relative; transition: 0.5s;}
#Tlacitko span:after {content: '\00bb'; position: absolute; opacity: 0; top: 0; right: -20px; transition: 0.5s;}
#Tlacitko:hover span {padding-right: 25px;}
#Tlacitko:hover span:after { opacity: 1; right: 0;}    
  

.skryvany {display: none;}
 
.PosunMobilniVerze {margin-top: 0;}
  
.FotoPaticka {width: 25%; float: left;} 
.KontaktyPaticka {width: 75%; float: left;}
.LogoPaticka {width: 50%; opacity: 0.9;padding: 0; margin-left: 0px; border: 1px solid rgba(255,255,255,0.8);}
.TextKontaktyPaticka {margin-left: 20px; margin-top: -10px;}
  
.ImgSponzor {float: left; margin: 0.25%; border: 1px solid rgba(0,0,0,0.3); width: 7.777%;}
  
  .BoxTlacitka {float: left; width: 29%; margin: 2%; border: none; text-align: center;}

.LevyBoxKariera {background-color:transparent; color:  rgb(0,73,146); padding: 20px; font-size: 1.1rem; margin: 0 0 30px 0; width: 50%; float: left;}
.PravyBoxKariera {background-color:transparent; color:  rgb(0,73,146); padding: 20px; font-size: 1.1rem; margin: 0 0 30px 0; width: 50%; float: right;}
.BoxKarieraFotoNadpis {position: absolute; bottom: 22%; width: 65%; right: 0; padding: 25px; background: rgba(0,73,146,0.7); color: rgba(255,255,255,0.9);}

.ObrazkyNovinky {width: 35%; float: left; margin: 0 2% 2% 0;}
.com-contact__container {width: 25%; float: left; margin-right: 4%;}
}






.metismenu.mod-menu .metismenu-item {font-weight: 100;}


.FotoTym {border-radius: 10px;}

p.TextUvodTucne {font-size: 1rem; font-weight: 600;}
p.TextUvod {font-size: 1rem; font-weight: 100; text-align: justify;}

p.TextObrazkySvetlePozadi {color: rgba(0,0,0,0.9); font-size: 1.2rem; text-align: center;}
p.TextObrazkySvetlePozadiTucne {color: rgba(0,0,0,0.9); font-size: 1.2rem; text-align: center; font-weight: 600;}
p.TextObrazkyTmavePozadi {color: rgba(255,255,255,0.9); font-size: 1.2rem; text-align: center;}
p.TextObrazkyTmavePozadiTucne {color: rgba(255,255,255,0.9); font-size: 1.2rem; text-align: center; font-weight: 600;}


.ObrazkyTmavePozadi {border: 2px solid rgba(255,255,255,0.8); border-radius: 6px;}
div.TextBoxTmavePozadi {width: 65%; margin: 0 auto 0 auto; font-size: 1.4rem; text-align: center; color: rgba(255,255,255,0.9);}
div.TextBoxSvetlePozadi {width: 65%; margin: 0 auto 0 auto; font-size: 1.4rem; text-align: center; color: rgba(0,0,0,0.9);}
.BoxHorniSocialniSite {text-align: right; color: rgba(255,255,255,0.9); margin: 14px 0 0 0; font-size: 0.8rem; line-height: 24px; vertical-align: middle;}


.row, .container-fluid {--bs-gutter-x: 0rem;}

.BoxyObrazky {margin: 10px;}

div.cistic {clear: both;}






.js .toggle-contenta { overflow: hidden; display: none; transition: height .2s; background: transparent;}
.js .toggle-header { cursor: pointer; -ms-touch-action: manipulation; /* IE10  */ touch-action: manipulation; /* IE11+ */}
  
.toggle-obsah {position: relative; display: block; background: transparent; color: black; width: 100%; padding: 0; text-decoration: none; margin-bottom: 0;}
.arrow-obsah {position: absolute; top: 12px; left: -30px;}
.arrow-obsah::before, .arrow-obsah::after {position: relative; content: ''; display: block; width: 10px; height: 1px; background: black; transition: 0.3s ease-in-out;}
.arrow-obsah::before {transform: rotate(45deg);}
.arrow-obsah::after {left: 6px;top: -1px;transform: rotate(-45deg);}
.toggle-obsah {background: transparent;}
.toggle-obsah.active .arrow::before {transform: rotate(-45deg);}
.toggle-obsah.active .arrow::after {transform: rotate(45deg);}







.flip-box {background-color: transparent; width: 450px; height: 450px; border: 1px solid #f1f1f1; perspective: 1000px; display: block; /* Remove this if you don't want the 3D effect */}

/* This container is needed to position the front and back side */
.flip-box-inner {position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.8s; transform-style: preserve-3d;}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-box:hover .flip-box-inner {transform: rotateY(180deg);}

/* Position the front and back side */
.flip-box-front, .flip-box-back {position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; /* Safari */ backface-visibility: hidden;}

/* Style the front side (fallback if image is missing) */
.flip-box-front {background-color: transparent; color: black;}

/* Style the back side */
.flip-box-back {background-color: transparent; color: yellow; width: 100%; height: 100%; transform: rotateY(180deg);}








/*///////////////////    SKRÝVÁNÍ  TEXTU  //////////////////////////////*

    /* schování tlačítka */
    .js .live .schovat div {display: none}
    /* nastylování „ikony“ plus nebo mínus */
    .live button span:before {content: "+"; display: inline-block; margin-right: .5em; padding: 0 .4em; border-radius: 3px; background: #fff; color: #000}
    /* ikona minus bude mít pomlčku */
    .live button span.skryt:before {content: "–"}
    /* když je obsah schovaný, schováme popisek „Skrýt“ */
    .live .schovat .skryt {display: none}
    /* když je obsah zobrazený, schováme popisek „Zobrazit“ */
    .live .ukazat .zobrazit {display: none} 




.Sponzor {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
  text-align: center;
}

li.OdrazkyUvod::marker {
  color: #FFA608;
}

li.OdrazkyUvodSeznam {
	margin: 0;
	padding: 0 0 0 40px;
	list-style: none;
	background-image: url("/images/grafika/trojuhelnik-ptlnp-svg.svg");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 36px;
}



/* ///////////////////////////   OBSAH  /////////////////////////////////  */


.UvodnikClanek {width: 25%; float: left; margin-right: 2%;}

.site .mod-breadcrumbs__wrapper {padding: 10px; background-color: #f9f9f9; width: 100%; margin-bottom: 10px;}

h1.H1Obsah {text-align: center; font-size: 3.2rem; color: #F79B00; font-weight: 200; margin-top: 10px;}

.blog .page-header::after {background-color: transparent;}
.btn-secondary {width: 100%;}

.UvodniFoto {width: 88%; margin: 0 auto 0 auto; text-align: center;}
.TextUvodB0 {text-align: center; width: 65%; margin: -20px auto 50px auto; font-weight: 600; font-size: 1.4rem; color: rgba(255,255,255,0.7);}
.OdkazWebUvodB1 {text-decoration: underline; color: rgba(255,255,255,0.8); font-size: 1.3rem;}
.TextUvodC0 {text-align: center; width: 65%; margin: -20px auto 50px auto; font-weight: 600; font-size: 1.4rem; color: rgba(0,0,0,0.5);}
.TextUvodC1 {font-weight: 400; font-size: 1.3rem;}
.SeznamTopC1Tucne {font-weight: 600; font-size: 1.2rem;}
.SeznamTopC1 {font-size: 1.2rem;}
.OdkazTopC1 {color: blue; font-size: 1.3rem;}

#section1 {text-align: left; color: rgba(255,255,255,0.7); margin: 14px 0 0 0; font-size: 0.8rem; line-height: 24px; vertical-align: middle; float: left;}
.OddelovacTopNazevSkoly {height: 14px; clear: both;}
.IkonyHorniLista {float: left; margin: 0 4px 0 10px; width: 24px;}

.PatickaNadpis {width: 80%; margin: 20px auto 20px auto;}
.BoxPatickaNadpis {width: 80%; margin: 0 auto 0 auto; font-size: 1.4rem; text-align: center; color: rgba(255,255,255,0.7);}
.P-TextPatickaNadpis {font-size: 1.6rem;}
.BoxNadpisKontaktyPaticka {margin: 20px;}
.PNadpisKontaktyPaticka {font-size: 2.0rem; font-weight: 600; }
.PPodnadpisKontaktyPaticka {font-weight: 400; font-size: 1.4rem;}
.FotoPaticka {width: 30%; float: left;}
.FotoPatickaKontakty {width: 100%; border-top-right-radius: 8px; border-top-left-radius: 8px;}
.LogoPTLNPPaticka {width: 100%;}
.KontaktyPaticka {float: left; width: 65%; margin: 1px; font-size: 1.3rem;}
.KontaktyPatickaNadpis {margin: 1px; font-size: 1.6rem;}
.BoxMapaPaticka {margin: 0px;}
#section9 {background-color: #336DA8;}


.active {background-color: rgba(0,49,92,0.2); border-radius: 4px;}

.breadcrumb-item {margin-right: 4px; padding-right: 10px;}


.BoxKarieraFoto {position: relative}
.NadpisFotoKariera {font-size: 2.2rem; line-height: 2.5rem; font-weight: 600;}
.BoxKarieraFotoPodnadpis {font-size: 1.8rem; line-height: 2rem; font-weight: 300;}
.ModryBoxKariera {background-color: rgb(0,73,146); color: white; padding: 20px; font-size: 1.4rem; margin: 0 0 30px 0;}
.PruhlednyBoxKariera {background-color: transparent; color:  rgb(0,73,146); padding: 20px; font-size: 1.4rem; margin: 0 0 30px 0;}



