@font-face { font-family:"Regular";  src: url("font/Asap-Regular.ttf") format("truetype"); }
@font-face { font-family:"SemiBold";  src: url("font/Asap-SemiBold.ttf") format("truetype"); }
@font-face { font-family:"Bold";  src: url("font/Asap-Bold.ttf") format("truetype"); }
@font-face { font-family:"Medium";  src: url("font/Asap-Medium.ttf") format("truetype"); }

* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	font-family: "Regular", "Tahoma CE", Tahoma, "Verdana CE", Verdana, "Arial CE", Arial, Sans-serif, serif;
	font-size: 16px;
	padding: 0;
	margin: 0;
	color: #2B2825;
}

.mb20 { margin-bottom: 20px !important; }
.mt20 { margin-top: 20px !important; }
.mt40 { margin-top: 40px !important; }

.center-block { display:block;margin-right:auto;margin-left:auto; }
.wAuto { width: auto !important; }
.taCenter { text-align: center !important; }


@media (max-width: 400px) {
	header > div, main > div, footer > div { width: 100%; margin: 0 auto; }
	body#base main .root { width: 100%; margin: 0 auto; }
}

header { padding: 20px 15px; }

header .logo { position: relative; }
header .logo img { height: 40px; }
header .logo p { font-size: 14px; font-family: "SemiBold"; position: absolute; top:1px; left: 95px; }
header .logo p + p { color: #ACA098; top: 17px; }

p { line-height: 1.5em; }
p.strong { font-family: SemiBold !important; }
a { color: #FF781B; }

.otm-warn { background-color: #d52b38; color: #fff; padding: 20px; }

footer { background-color: #efece6; }
footer p { line-height: 1.7em; }
footer h2 { margin-bottom: 10px; }
footer > div { padding: 30px 25px; }
footer .copy span:first-child { display: block; margin-bottom: 10px; }
footer .copy span:last-child { padding-left: 20px; }
footer .row > div { margin-top: 20px; }

main h1 { font-size: 32px; font-family: SemiBold; font-weight: normal; margin-bottom: 30px; color: #2B2825; }
main h2 { font-size: 26px; font-family: SemiBold; font-weight: normal; margin-top: 30px; color: #2B2825; }
main h3 { font-size: 20px; font-family: SemiBold; font-weight: normal; margin-top: 30px; color: #2B2825; }
main h4 { font-size: 18px; font-family: SemiBold; font-weight: normal; margin-top: 30px; color: #2B2825; }

#home main div.zs { padding: 90% 25px 20px 25px; background-image: url("/img/keyvisual@2x.png"); background-position: 15% top; background-size: 110% auto; background-repeat: no-repeat; }
#home main div.zs h1 { font-size: 32px; font-family: SemiBold; font-weight: normal; }
#home main div.zs h2 { font-size: 18px; font-family: SemiBold; font-weight: normal; margin-bottom: 20px; }
#home main div.zs p { margin-top: 10px; color: #594232; font-size: 16px; }

#home main div.home-content { background: url("/img/patter_stroke@2x.png"); padding: 25px; background-size: 300px; }
#home main div.home-content .clanky {  margin-bottom: 30px; }
#home main div.home-content article { background-color: #F7F5F2; padding: 15px; margin-bottom: 15px; break-inside: avoid; }
#home main div.home-content article img.ill { margin: -15px -15px 15px -15px; width: calc(100% + 30px); }
#home main div.home-content article h2 { font-family: SemiBold; font-weight: normal; font-size: 20px; color: #2B2825; margin-bottom: 10px; margin-top: 0; }
#home main div.home-content article p { margin-bottom: 10px; color: #594232; }
#home main div.home-content article span.tag { display: inline-block;background-color: #FEF9FF; font-family: Bold; font-weight: normal; font-size: 12px; padding: 5px 10px; text-transform: uppercase; }
#home main div.home-content article span.tag-datum { background-color: transparent; font-family: Medium; color: #ACA098; }
#home main div.home-content article span.tag-druzina { color: #CD69DD; }
#home main div.home-content article span.tag-skola { color: #FF781B; }

main h2.akce-udalosti { margin-top: 40px; margin-bottom: 25px; }

main article.sponzoring { background-color: #fff !important; padding: 30px; margin-top: 30px; }
main article.sponzoring h2 { font-size: 26px; font-family: SemiBold; font-weight: normal; margin-bottom: 30px; }
main article.sponzoring p { font-family: Regular; font-size: 12px !important; color: #2B2825; border-bottom: solid 1px #EFECE6; padding-bottom: 23px !important; margin-bottom: 23px; line-height: 1em; }
main article.sponzoring p img { margin-top: 15px; }
main article.sponzoring p a { font-size: inherit; color: #29449D; }
main article.sponzoring p:last-child { border-bottom: none; padding-bottom: 0 !important; margin-bottom: 0 !important; }

#home main div.home-content article:last-child { margin-bottom: 0; }

main .akce-seznam .akce { display: table; margin-bottom: 10px; background-color: #F7F5F2; height: 77px; width: 100%; border-left: solid 3px #ACA098; }
main .akce-seznam .akce-tento-mesic { border-color: #FF781B; }
main .akce-seznam .akce .datum { display: table-cell; padding: 0; vertical-align: center; text-align: center; width: 77px; height: 100%; background-color: #fff; color: #2B2825; }
main .akce-seznam .akce .datum span { display: block; }
main .akce-seznam .akce .datum .den { font-size: 30px; font-family: SemiBold; line-height: 1.4em; padding-top: 8px; }
main .akce-seznam .akce .datum .mesic { font-size: 10px; font-family: Medium; text-transform: uppercase;  }
main .akce-seznam .akce .popis { display: table-cell; vertical-align: middle; }
main .akce-seznam .akce .popis p { color: #594232; line-height: 24px !important; font-size: 16px; padding-left: 15px !important; padding-top: 7px !important; }

header #nav-opener, header #nav-closer { position: absolute; top:28px; right: 15px; z-index: 100; display: block; cursor: pointer; }
header #nav-closer { display: none; }

header .fb { position: absolute; top:28px; right: 50px; }
header .fb a { display: block; width: 23px; height: 23px; background-image: url("/img/FB.svg"); background-position: left top; background-size: 23px 23px; }
header .fb:hover a { background-image: url("/img/FB_over.svg"); }


header nav { display: none; z-index:20; position: fixed; top:70px; left: 0; height: 100vh; width: 100%; padding: 0 15px; background-color: #fff; }
header nav ul { list-style-type: none; padding: 20px 0; }
header nav ul li { padding: 0; }
header nav ul li a { padding: 15px 40px 15px 38px; display: block; border-left: solid 3px transparent; }
header nav ul ul { padding-top: 0; padding-bottom: 0; }
header nav ul ul li { padding: 0; }
header nav ul ul li a { padding: 10px 20px 10px 60px; }
header nav a { font-family: SemiBold !important; font-weight: normal; font-size: 18px; color: #594232 !important; text-decoration: none !important; }

/*header nav > div > ul > li:hover > a { border-left: solid 3px #FF781B; color: #FF781B !important; }*/
/*header nav ul > li.aktivni a { color: #ACA098 !important; }*/
header nav ul > li.aktivni > a { border-left: solid 3px #FF781B; color: #FF781B !important; }
header nav ul li.aktivni li a { color: #594232 !important; border-left: none; }
header nav ul ul li.aktivni > a { color: #FF781B !important; }

header nav ul ul a { font-family: Medium !important; font-weight: normal; font-size: 16px;  }


a.btn { border: solid 2px #FF781B; color: #FF781B; font-family: Bold; font-size: 16px; border-radius: 5px; padding: 16px 30px; display: inline-block; text-align: center; text-decoration: none; }

.nastym h2 { margin-bottom: 20px; margin-top: 40px; }
/*p.clovek { display: block; width: 100%; padding: 10px 0; font-family: Regular; font-size: 16px; color: #594232; }*/
p.clovek { display: table; width: 100%; }
p.clovek span { display: table-cell; }
p.clovek span.img { display: table-cell; width: 80px; }
p.clovek span.txt { font-family: Regular; font-size: 16px; color: #594232; padding: 0; vertical-align: middle; }
p.clovek span:first-line { font-family: SemiBold; font-size: 20px; color: #2B2825; line-height: 0.8em; }
/*span.clovek:after { clear: both; }*/

.skolnirok p:nth-child(odd) { margin-bottom: 0px !important; }
/* md */
@media (min-width:1100px) {
	footer .copy { padding-bottom: 20px; }
	footer .copy span { display: inline !important; margin: 0; padding: 0 20px 0 0 !important; }
	.md-pr30 { padding-right: 30px !important; }
}

body.menu-on header { background-image: linear-gradient(#fff, #f0efed); }
body.menu-on nav { display: block; }
body.menu-on #nav-opener  { display: none; }
body.menu-on #nav-closer  { display: block; }
body.menu-on #logo  { display: none; }
body.menu-on main { display: none; }
body.menu-on footer { display: none; }

body#base main { background-image: linear-gradient(#f0efed, #fff); background-size: auto 50px; background-repeat: repeat-x; }
body#base main > div { padding: 30px 25px; }
body#base main h1 { font-size: 32px; font-family: SemiBold; font-weight: normal; color: RGB(43, 40, 37); padding: 0; margin: 0 0 30px 0; }
body#base main p { font-size: 16px; font-family: Regular; font-weight: normal; color: RGB(89, 66, 50); line-height: 1.5em; margin: 0 0 10px 0; padding: 0; }

body#base main article.sponzoring { padding: 30px; box-shadow: 0 2px 60px RGBA(89, 66, 50, 0.1); margin-top: 30px; }
body#base main article.sponzoring h2 { margin-top: 0; font-size: 26px; }

@media (min-width: 1100px) {

	#home { padding-top: 30px; }
	#home { background-image: url("/img/zsbabi_bg@2x.png"); background-repeat: no-repeat; background-size: 100% auto; background-position: top center; }
	#home main div.home-content article h2 { margin-top: 0px; }
	#home main div.zs { padding: 30px 750px 200px 0; background-image: url("/img/keyvisual@2x.png"); background-position: right top; background-size: 70% auto; background-repeat: no-repeat; }
	#home main div.zs h1 { font-size: 46px; line-height: 1em; margin-bottom: 13px; }
	#home main div.zs h2 { font-size: 26px; color: RGB(172, 160, 152); }
	#home main div.zs p { font-size: 18px; }
	#home .home-content > div { width: 1100px; margin: 0 auto; }
	#home .home-content .clanky { padding-right: 30px; column-count: 2; column-gap: 30px; }
	#home .home-content .clanky article { margin-bottom: 30px; }
	#home main div.home-content h2.akce-udalosti { margin-top: 0px; }

	header > div:first-child { width: 1100px; margin: 0 auto; /*background-color: #0dcaf022;*/ position: relative; }
	footer > div { width: 1100px; margin: 0 auto; padding-left: 0; padding-right: 0; }
	main div.zs { width: 1100px; margin: 0 auto; }
	main div.zs p { padding-bottom: 10px; }

	header #nav-opener { display: none; }
	header .fb { top: 32px; right: 15px; }
	header .fb a { height: 30px; width: 30px; background-size: 30px; }
	header .logo img { height: 86px; margin-left: 20px; }
	header .logo p { display: none; }

	header nav { width: auto; height: auto; margin: 0 auto; left: unset; display: block; position: absolute; top:8px; right: 60px; padding: 0; background-color: transparent; }
	header nav ul { display: table; padding: 0; }
	header nav ul li { display: table-cell; position: relative; }
	header nav ul li a { /*background-color: #0dcaf033;*/ padding: 25px 0px; font-family: SemiBold; font-size: 21px; border-left: none; border-top: solid 3px transparent; margin: 0 15px;}
	header nav ul li ul { display: none; position: absolute; width: 280px; top: 77px; left: calc(50% - 140px); background-color: RGBA(255, 255, 255, 0.98); padding: 30px 20px; margin: 0; box-shadow: 0 2px 60px RGBA(89, 66, 50, 0.2); }
	header nav ul li ul a { padding: 10px; margin: 0; font-family: Medium; font-size: 18px; }
	header nav ul li ul a:hover { color: #FF781B !important;  text-decoration: underline !important;}
	header nav ul li ul li { display: table-row; }
	header nav > div > ul > li:hover > a { border-left: none; border-top: solid 3px #FF781B; }
	header nav > div > ul > li:hover ul { display: block; }
	header nav ul > li.aktivni a { border-left: none; }


	#base header { padding-top: 0; height: 88px; }
	#base nav { top: 5px; }
	#base main h2.akce-udalosti { margin-top: 10px; margin-bottom: 25px; }

	#base header .fb { top: 28px; }

	#base header .logo { padding-top: 20px; }
	#base header .logo img { height: 47px; margin-left: 0; }
	#base header .logo p { display: block; left: 125px; font-family: SemiBold; font-size: 20px; top:20px; }
	#base header .logo p:last-child { font-size: 15px; padding-top: 8px; top: 37px; }

	/*#base main article.sponzoring { padding: 30px; box-shadow: 0 2px 60px RGBA(89, 66, 50, 0.1); margin-top: 30px; }*/
	/*#base main article.sponzoring h2 { margin-top: 0; font-size: 26px; }*/

	#base main .akce-seznam .akce .popis p { padding-top: 15px !important; }

	body#base main > div { width: 1100px; margin: 0 auto; padding-left: 0; padding-right: 0; }
	body#base main h1 { font-size: 46px; font-family: SemiBold; font-weight: normal; color: #2B2825; padding: 0; margin: 0 0 40px 0; }
	body#base main h2 { font-size: 36px; font-family: SemiBold; font-weight: normal; color: #2B2825; padding: 0; margin: 30px 0 0 0; }
	body#base main h3 { font-size: 26px; font-family: SemiBold; font-weight: normal; color: #2B2825; padding: 0; margin: 30px 0 0 0; }
	body#base main h4 { font-size: 20px; font-family: SemiBold; font-weight: normal; color: #2B2825; padding: 0; margin: 30px 0 0 0; }
	body#base main p { font-size: 18px; font-family: Regular; font-weight: normal; color: #594232; line-height: 1.5em; margin: 0 0 20px 0; padding: 0; }


	div.two-columns { column-count: 2; }
	div.three-columns { column-count: 3; }
	div.two-columns p.clovek { break-inside: avoid; width: auto;  }

	.nastym > h2 { margin-top: 20px !important; }
	.nastym h2 { margin-bottom: 30px !important; margin-top: 60px !important; }
	.nastym p.clovek { margin-bottom: 10px !important; }

}