/* general css ----------------------------------- */
html {
	scroll-behavior:smooth;
	overflow-x: hidden;
	height: 100%;
}
body {
	overflow: hidden;
	font-size: 16px;
	font-weight: 400;
	font-family: "Poppins", sans-serif;
	color: #202932;
}
body::-webkit-scrollbar, div::-webkit-scrollbar {width: 6px;}
body::-webkit-scrollbar-track, div::-webkit-scrollbar-track {background: #FCFCFD;}
body::-webkit-scrollbar-thumb, div::-webkit-scrollbar-thumb {
   background-color: #2B3B4B;
   border: 1px solid #2B3B4B;
}
img {max-width:100%;}
a, button, img, header, footer, span, strong, :before, :after, .btn, input {
	transition: all 0.3s ease-in-out;
	outline: none;
}

a {color: #21407d;}
a:hover {
	color: #183360;
	text-decoration: none;
}
.shadow main, .shadow footer {
	filter: blur(4px);
	transform: scale(1.02);
}
.modal-open section, .modal-open footer, .modal-open header {
	filter: blur(4px);
	transform: scale(1.02);
}
section, .container {position: relative;}
.landscape, .mobile {display: none;}

	@keyframes hovermenu { 
		0% {width: 0;}
		100% {width: 100%;}
	}

.viewport {
	overflow: hidden;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.sitebar {
	position: fixed;
	bottom: 0;
	left: 0;
	background: #3D5859;
	height: 2px;
	z-index: 10;
}



/* navigace ----------------------------------- */
header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 10;
	padding: 30px 0;
}
header .container {padding: 25px 100px 15px 100px;}
header .container:before {
	position: absolute;
	top: 0;
	right: 12px;
	bottom: 0;
	left: 12px;
	background: #86A7AE;
	content: "";
	border-radius: 15px;
}
.logo {
	display: block;
	color: #3D5859;
	text-decoration: none;
	font-size: 100px;
	font-weight: 700;
	position: relative;
}
.logo:hover {color: #3D5859;}
.logo:before {
	background: url("/assets/images/logo.svg") no-repeat top left;
	content: "";
	position: absolute;
	top: 10px;
	right: 0;
	width: 94px;
	height: 122px;
}
.logo:hover:before {transform: scale(1.1);}
header .navbar {padding: 0;}
header .nav-item {padding: 0 15px;}
header .nav-item:first-child {padding-left: 0;}
header .nav-link {
    color: #000;
	position: relative;
	font-size: 16px;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
header .nav-link:hover {color: #fff;}
header .nav-link:hover:before {
	background: #fff;
	width: 100%;
	height: 1px;
	bottom: 5px;
	left: 0;
	animation: hovermenu 0.4s 1;
	content: "";
	position: absolute;
}
header .active .nav-link {color: #fff;}
header .active .nav-link:after {
	background: #fff;
	width: 100%;
	height: 13px;
	bottom: -15px;
	left: 0;
	content: "";
	position: absolute;
}
header .active .nav-link:hover:before {display: none;}
.scroll-down header {top: -300px;}
.shortmenu header {padding-top: 0;}
.shortmenu header .container {padding: 25px 40px 15px 40px;}
.shortmenu header .container:before {border-radius: 0 0 15px 15px;}
.shortmenu .logo {
	display: inline-block;
	font-size: 22px;
	padding-right: 60px;
}
.shortmenu .logo:before {
	top: -15px;
	width: 45px;
	height: 80px;
}
.shortmenu .navbar {
	display: inline-block;
	padding-left: 10%;
}
.shortmenu header .nav-link {font-size: 14px;}
.navbar-toggler {border: none;}
.navbar-toggler:focus {box-shadow: none;}
.hamburger {
   width: 20px;
   height: 20px;
   position: absolute;
   transform: rotate(0deg);
   transition: .5s ease-in-out;
   cursor: pointer;
   right: 10px;
   top: -25px;
}
.hamburger span {
   display: block;
   position: absolute;
   height: 2px;
   width: 100%;
   border-radius: 9px;
   opacity: 1;
   left: 0;
   transform: rotate(0deg);
   transition: .25s ease-in-out;
}
.hamburger span {background: #3D5859;}
.hamburger span:nth-child(1) {top: 0px;}
.hamburger span:nth-child(2), .hamburger span:nth-child(3) {top: 7px;}
.hamburger span:nth-child(4) {top: 14px;}
.hamburger.open span {background: #3D5859;}
.hamburger.open span:nth-child(1) {
   top: 11px;
   width: 0%;
   left: 50%;
}
.hamburger.open span:nth-child(2) {transform: rotate(45deg);}
.hamburger.open span:nth-child(3) {transform: rotate(-45deg);}
.hamburger.open span:nth-child(4) {
   top: 11px;
   width: 0%;
   left: 50%;
}

/* home ------------------------- */
.home {padding: 300px 0 60px 0;}
.home .col-sm-2, .home .col-sm-3, .home .col-sm-4, .home .col-sm-7 {padding-bottom: 25px;}
.homemenu01, .homemenu02, .homemenu03, .homemenu04, .homemenu05 {
	display: block;
	position: relative;
	height: 100%;
	border-radius: 15px;
	text-decoration: none;
	color: #020000;
	font-weight: 600;
	font-size: 22px;
	padding: 30px 25px;
	overflow: hidden;
	background: #FDEA9B;
}
.homemenu02 {background: #FACC5D;}
.homemenu03 {background: #F08A58;}
.homemenu04 {background: #D291A1;}
.homemenu05 {
	background: #BEE4EE;
	color: #254D56;
}
.homemenu01:hover, .homemenu02:hover, .homemenu03:hover, .homemenu04:hover, .homemenu05:hover {filter: contrast(115%);}
.homemenu01:before, .homemenu02:before, .homemenu03:before, .homemenu04:before, .homemenu05:before {
	content: "";
	position: absolute;
	height: 330px;
	width: 150px;
	background: url("/assets/images/strednik.svg") no-repeat center;
	top: 26%;
	left: 10%;
}
.homemenu02:before {
	height: 150px;
	width: 235px;
	background: url("/assets/images/kompas2.svg") no-repeat center;
	top: 49%;
	left: 0%;
}
.homemenu03:before {
	height: 290px;
	width: 191px;
	background: url("/assets/images/pohled2.svg") no-repeat center;
	top: 35%;
	left: 20%;
}
.homemenu04:before {
	height: 175px;
	width: 200px;
	background: url("/assets/images/ico04.svg") no-repeat center;
	top: 49%;
	left: 12%;
}
.homemenu05:before {
	height: 150px;
	width: 205px;
	background: url("/assets/images/ico05.svg") no-repeat center;
	top: 10%;
	left: auto;
	right: 3%;
}
.homemenu01:hover:before {transform: translate(0,-50px) rotate(15deg);}
.homemenu02:hover:before {transform: rotate(-170deg);}
.homemenu03:hover:before {transform: translate(-50px,0) rotate(-10deg);}
.homemenu04:hover:before {transform: translate(-50px,-50px) rotate(-10deg);}
.homemenu05:hover:before {
	right: 50%;
	transform: translate(50%,4%) scale(1.1);
}
.homemenu01 span, .homemenu02 span, .homemenu03 span, .homemenu04 span, .homemenu05 span {
	position: relative;
	display: block;
}
.homemenu05 span {
	position: absolute;
	left: 25px;
	bottom: 30px;
}
.homemenu01:hover span, .homemenu02:hover span, .homemenu03:hover span, .homemenu04:hover span, .homemenu05:hover span {
	transform: scale(1.1);
	color: #000;
}
.home ul {
	border-radius: 15px;
	padding: 30px 25px;
	background: #DBE9EB;
	border: solid 1px #93BDC4;
	list-style-type: none;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	height: 100%;
}
.home ul li {
	flex: 0 0 auto;
	width: 25%;
	position: relative;
}
.home ul li:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 15px;
	border-right: solid 2px rgba(180,210,217,.5);
}
.home ul li:last-child:before {display: none;}
.home ul li a {
	position: relative;
	overflow: hidden;
	display: block;
	text-decoration: none;
	color: #254D56;
	font-size: 22px;
	font-weight: 600;
	height: 100%;
	background: url("/assets/images/ico06.svg") no-repeat left 15px bottom;
	background-size: 120px auto;
	padding: 0 15px;
}
.home ul li + li a {background-image: url("/assets/images/ico07.svg");}
.home ul li + li + li a {background-image: url("/assets/images/ico08.svg");}
.home ul li + li + li + li a {background-image: url("/assets/images/ico09.svg");}
.home ul li a:hover {
	background-position: left 15px bottom 16px;
	color: #000;
}
.home ol {
	border-radius: 15px;
	padding: 30px 25px;
	background: #4F6D6E;
	border: solid 1px #93BDC4;
	list-style-type: none;
	text-align: center;
	display: inline-block;
	margin: 0;
}
.fb, .ig, .yb, .x {
	height: 38px;
	width: 38px;
	background: url("/assets/images/fb.svg") no-repeat center;
	display: inline-block;
	margin: 5px 25px;
}
.ig {background: url("/assets/images/ig.svg") no-repeat center;}
.yb {background: url("/assets/images/yb.svg") no-repeat center;}
.x {background: url("/assets/images/x.svg") no-repeat center;}
.fb:hover, .ig:hover, .yb:hover, .x:hover {transform: scale(1.15);}

/* footer ----------------------------------- */
footer {
	color: #4F6D6E;
	font-size: 14px;
	padding: 60px 0;
	border-top: solid 2px #4F6D6E;
}
footer h6 {
	background: url("/assets/images/logo.svg") no-repeat top left;
	background-size: 48px auto;
	font-size: 20px;
	font-weight: 700;
	padding-left: 60px;
	margin: 0 0 20px 0;
}
footer p {padding-left: 60px;}
footer ul {
    list-style-type: none;
	margin: 0;
	padding: 0;
}
footer ul li {padding: 0 0 13px 0;}
footer a {
	color: #4F6D6E;
	text-decoration: none;
	position: relative;
	padding: 0 0 5px 0;
	display: inline-block;
}
footer a:hover {color: #000;}
footer a:hover:before {
	background: #000;
	width: 100%;
	height: 1px;
	bottom: 3px;
	left: 0;
	animation: hovermenu 0.4s 1;
	content: "";
	position: absolute;
}
footer span {
	font-size: 16px;
	color: #000;
	display: block;
	padding-top: 30px;
}

/* subpage ------------------------- */
.subpage {padding: 300px 0 60px 0;}
.subpage .homemenu01, .subpage .homemenu02, .subpage .homemenu03, .subpage .homemenu04 {padding: 20px 25px;}
.subpage .homemenu01:before {
	height: 100px;
	width: 70px;
	top: 10px;
	left: auto;
	right: 20px;
}
.subpage .homemenu01 {color: #E8C42F;}
.subpage .homemenu02 {color: #B38820;}
.subpage .homemenu03 {color: #C75822;}
.subpage .homemenu04 {color: #B45F74;}
.subpage .col-sm-3 .active {
	color: #000;
	text-decoration: underline;
}
.subpage .col-sm-3 .active:hover {filter: contrast(100%);}
.subpage .col-sm-3 .active:hover span {transform: scale(1);}
.subpage .col-sm-3 .active:hover:before {transform: translate(0,0) rotate(0);}
.subpage .homemenu02:before {
	height: 80px;
	width: 105px;
	top: 19px;
	left: auto;
	right: 0px;
}
.subpage .homemenu03:before {
	height: 140px;
	width: 110px;
	top: 0;
	left: auto;
	right: 20px;
}
.subpage .homemenu04:before {
	height: 100px;
	width: 100px;
	top: 9%;
	left: auto;
	right: 20px;
}
.subpage .homemenu01:hover:before {transform: translate(0,-5px) rotate(15deg);}
.subpage .homemenu04:hover:before {transform: translate(-30px,-10px) rotate(-10deg);}
.sidemenu .homemenu05 {
	height: auto;
	margin-top: 25px;
}
.sidemenu .homemenu05:before {top: 25%;}
.sidemenu .homemenu05:after {
	content: "";
	display: block;
	padding-bottom: 85%;
}
.sidemenu .homemenu05 span {
	top: 30px;
	bottom: auto;
}
.sidemenu .homemenu05:hover:before {
	right: 0;
	transform: translate(-10%,2%) scale(1.1);
}
.sidemenu .homemenu05.active:hover:before {right: 3%;}
.sidemenu ul {
	border-radius: 15px;
	padding: 30px 25px;
	background: #DBE9EB;
	border: solid 1px #93BDC4;
	list-style-type: none;
	margin: 25px 0 0 0;
}
.sidemenu ul li {
	position: relative;
	border-bottom: solid 2px rgba(180,210,217,.5);
}
.sidemenu ul li:last-child {border-bottom: none;}
.sidemenu ul li a {
	position: relative;
	overflow: hidden;
	display: block;
	text-decoration: none;
	color: #254D56;
	font-size: 22px;
	font-weight: 600;
	height: 100%;
	background: url("/assets/images/ico06.svg") no-repeat right center;
	background-size: 90px auto;
	padding: 40px 0;
}
.sidemenu ul li + li a {background-image: url("/assets/images/ico07.svg");}
.sidemenu ul li + li + li a {background-image: url("/assets/images/ico08.svg");}
.sidemenu ul li + li + li + li a {background-image: url("/assets/images/ico09.svg");}
.sidemenu ul li a:hover {
	background-position: right 15px center;
	color: #000;
}
.sidemenu ol {
	margin: 25px 0 0 0;
	border-radius: 15px;
	padding: 30px 10px;
	background: #4F6D6E;
	border: solid 1px #93BDC4;
	list-style-type: none;
	text-align: center;
}
.sidemenu ol li {
	display: inline-block;
	padding: 0 10px;
}
.sidemenu .fb, .sidemenu .ig, .sidemenu .yb, .sidemenu .x {
	height: 38px;
	width: 38px;
	background: url("/assets/images/fb.svg") no-repeat center;
	display: block;
	margin: 0;
}
.sidemenu .ig {background: url("/assets/images/ig.svg") no-repeat center;}
.sidemenu .yb {background: url("/assets/images/yb.svg") no-repeat center;}
.sidemenu .x {background: url("/assets/images/x.svg") no-repeat center;}



.strednik, .pohled, .kompas, .skupiny, .duchovni, .bez-symbolu {
	position: relative;
	overflow: hidden;
	border-radius: 15px;
	margin-top: 25px;
	padding: 40px 25px 0 25px;
}
.strednik *, .pohled *, .kompas *, .skupiny *, .duchovni *, .bez-symbolu * {position: relative;}

.strednik:before, .pohled:before, .kompas:before, .skupiny:before, .duchovni:before, .bez-symbolu:before {
	position: absolute;
	background: linear-gradient(#589494, #fff );
	top: 0;
	left: 0;
	width: 100%;
	height: 360px;
	content: "";
}


.strednik:before {background: linear-gradient(#FDEA9B, #fff);}
.programy:before {background: linear-gradient(#FFDEAD, #fff);}
.projekty:before {background: linear-gradient(#bc8f8f, #fff);}
.kdojsme:before {background: linear-gradient(#86A7AE, #fff);}
.knihy:before {background: linear-gradient(#A9A9A9, #fff);}

.strednik:after {
	content: "";
	position: absolute;
	height: 270px;
	width: 190px;
	background: url("/assets/images/strednik.svg") no-repeat center;
	top: 38px;
	right: 5%;
}

.pohled:before {background: linear-gradient(#F08A58, #fff);}
.pohled:after {
	content: "";
	position: absolute;
	height: 270px;
	width: 230px;
	background: url("/assets/images/pohled2.svg") no-repeat center;
	top: 0px;
	right: 5%;
}


.kompas:before {background: linear-gradient(#FACC5D, #fff);
width: }
.kompas:after {
	content: "";
	position: absolute;
	height: 270px;
	width: 200px;
	background: url("/assets/images/kompas2.svg") no-repeat center;
	top: 30px;
	right: 5%;
}
.skupiny:before {background: linear-gradient(#D291A1, #fff);}
.skupiny:after {
	content: "";
	position: absolute;
	height: 270px;
	width: 200px;
	background: url("/assets/images/ico04.svg") no-repeat center;
	top: 30px;
	right: 5%;
}
.duchovni:before {background: linear-gradient(#BEE4EE, #fff);}
.duchovni:after {
	content: "";
	position: absolute;
	height: 270px;
	width: 200px;
	background: url("/assets/images/ico05.svg") no-repeat center;
	top: 30px;
	right: 5%;
}
.subpage h1 {
	font-weight: 600;
	font-size: 44px;
	margin: 0 0 20px 0;
}
.subpage h2 {
	font-weight: 700;
	font-size: 22px;
	margin: 0 0 20px 0;
}
.subpage h3 {
	font-weight: 700;
	font-size: 16px;
	margin: 30px 0 5px 0;
}
.subpage iframe {
	width: 80% !important;
	height: auto !important;
	aspect-ratio: 16 / 9;
	border: 0;
	margin-bottom: 30px;
}
.uvod {padding: 0 33% 80px 0; z-index: 999;}

figure.alignright {
	float: right;
	//width: 200px;
}
figure .alignright img {

}

/* Styly pro galerii obrázků */
figure.wp-block-gallery {
    display: flex;
    flex-wrap: wrap; /* Zajistí, že obrázky se budou zalamovat na nový řádek, když není dostatek místa */
    align-items: flex-start; /* Zarovná obrázky a popisky na začátek jejich kontejneru */
    justify-content: flex-start; /* Zarovná obsah doleva */
    gap: 10px; /* Přidá mezery mezi obrázky */
}

figure.wp-block-gallery .wp-block-image {
    float: left; /* Zarovnání obrázků doleva */
    width: 25%; /* Nastaví šířku každého obrázku na 200px */
    margin: 10px; /* Odebere vnější okraje */
    box-sizing: border-box; /* Vypočítá šířku včetně padding a border */
}

figure.wp-block-gallery img {
    width: 100%; /* Nastaví obrázky na plnou šířku svého kontejneru */
    height: auto; /* Udržuje poměr stran obrázků */
    display: block; /* Zabraňuje nežádoucím mezerám pod obrázky */
}

figure.wp-block-gallery .wp-element-caption {
    text-align: center; /* Centruje popisky pod obrázky */
    font-size: 0.8em; /* Nastaví menší velikost písma pro popisky */
    color: #666; /* Šedá barva textu */
    margin: 5px 0 10px; /* Nastaví mezery okolo popisků */
}

.strednik .wp-block-media-text  {
	float: left;
}
.strednik .wp-block-media-text .wp-block-media-text__media {
	width: 120px; float: left;
}


.strednik .wp-block-media-text .wp-block-media-text__content {
	float: right;
	max-width: 750px;
	overflow: hidden;
}

/* tom 2024 ---------------------------- */