/*================================================================
/*
/* Handcrafted with love by all the good people of STUDIO SYNAPSE
/*
/*	    www.studiosynapse.cz | justwow@studiosynapse.cz
/*
/*================================================================


/* =========================================================== */
/* -----  Portrait NEBO mensi nez 900 px  ------------------------------ */
@media (orientation:portrait), (max-width:899px) {
/* -----  Variables  ------------------------------ */
:root {
	--spacing-main:24px;
	--border-radius-main:18px;
	--logo-offset:16px;
	--logo-size:128px;
	--menuitem-size:72px;
	--menu-offset:8px;
	--menu-gap:0 24px;
}
/* -----  Layout  ------------------------------ */
section { flex-direction:column; padding-bottom:0;}
.part { width:100%;}
.part img { height:calc(50vh - (2 * var(--spacing-main)));}
.part.wide img { height:calc(100vh - (2 * var(--spacing-main)));}
.threequarters .part.wide img { height:calc(66vh - (2 * var(--spacing-main)));}
.part.fixed img { position:relative; top:auto; width:100%;}
.part.fixed.left img { left:auto;}
.part.fixed.right img { right:auto;}
/* -----  Texts  ------------------------------ */
.textbox { min-height:auto;}
.texts.big .textbox { padding-left:var(--spacing-main); padding-right:var(--spacing-main); padding-top:calc(var(--spacing-main) * 3); padding-bottom:calc(var(--spacing-main) * 3);}
h2 { width:auto;}
p { width:auto;}
}


/* =========================================================== */
/* -----  Portait NEBO 600 px  ------------------------------ */
@media (orientation:portrait), (max-width:601px) {
/* -----  Variables  ------------------------------ */
:root {
	--font-size-s:1rem;
	--font-size-l:1.75rem;
	--spacing-main:16px;
	--border-radius-main:20px;
	--logo-offset:8px;
	--logo-size:96px;
	--menuitem-size:68px;
	--menu-offset:20px;
	--menu-gap:0 20px;
}
/* -----  Menu and Logo  ------------------------------ */
#theLogo { bottom:auto; top:var(--logo-offset); transform:translateX(-50%) translateY(-100px) scale(1.1);}
#theMenu { bottom:var(--menu-offset); top:auto;}
.is-on-footer #theLogo { transform:translateX(-50%) translateY(calc(50vh - (1 * var(--logo-size)))) scale(1.75);}
.main-menu li.is-active a,
.webhome.active-section-2 .main-menu li:first-child a { transform:scale(1.1); color:var(--color-light-highlight); background-color:var(--color-dark-highlight); /*outline:2px solid var(--color-dark-highlight); outline-offset:2px;*/}
/* -----  Layout  ------------------------------ */
.part.narrow { width:100%;}
/* -----  Texts  ------------------------------ */
h2 { margin:1.5em 0 .15em;}
.textbox { padding-left:calc(var(--spacing-main) * 0.5); padding-right:calc(var(--spacing-main) * 0.5); padding-top:calc(var(--spacing-main) * 0.5); padding-bottom:calc(var(--spacing-main) * 4);}
}


/* =========================================================== */
/* -----  Uzky menu  ------------------------------ */
@media (max-width:525px) {
/* -----  Menu and Logo  ------------------------------ */
#theMenu .bigbig { position:absolute; margin-left:0; top:calc(-1.15 * var(--menuitem-size));}
}