/****************************************** RESET **********************************************/
/***********************************************************************************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video { margin:0; padding:0; }
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display:block; }
ol, ul { list-style:none; }
blockquote, q {	quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after {	content:'';	content:none; }
table {	border-collapse:collapse;	border-spacing:0; }



/*****************************************************************************/
/********************************* TYPO **************************************/
/*
h1, h2, h3, h4, h5, h6, 
div, p, a, strong { font-family:'Open Sans', sans-serif; font-size:20px; line-height:27px; font-weight:500; color:#002F7B;  }
*/
:root {
  --red:#E41F5F;
  --white:#ffffff;
	--cyan:#03BFC7;
	--black:#000000;
	--grey:#4B5050;
	--blue:#00A0E0;
	
	--h1:40px;
	--h1Line:60px;
	--pFont:20px;
	--pFontMargin:27px;
	--liFont:25px;
	--liFontMargin:37px;
	--borderRadius:70px;
	
	--fullWidth:1424px;
}


.container{ width:var(--fullWidth); margin:0 auto; text-align:center; }
body { font-family:"Open Sans"; margin:0; color:#002F7B; }


h1 { font-size:var(--h1); color:var(--black); text-align:center; }
.h2,
h2,
h3 { font-size:var(--h1); font-weight:800; color:var(--black); text-align:center; line-height:var(--h1Line); }

header{ width:100%; background-image:url('assets/header.png'); background-repeat:repeat-x; }
header .container{ text-align:center; }

p { font-size:var(--pFont); color:var(--black); line-height:var(--pFontMargin); }
p strong { font-size:var(--pFont); color:var(--black); font-weight:800; }

.listCheck { border:var(--red) solid 2px; border-radius:90px; padding:30px 20px; }
.listCheck li { font-weight:800; font-size:var(--liFont); padding:0px 0 8px 38px; background:url('assets/iconCheck.png') no-repeat left 9px; text-align:left; list-style:none; width:500px; margin:0 auto; color:var(--grey); line-height:var(--liFontMargin); }

img { margin:0 auto; max-width:100%; height: auto; }

.pridat-do-kosiku { width:383px; background-color:var(--blue); border-radius:30px; color:white; height:60px; text-align:right; margin:0 auto; cursor:pointer; text-decoration:none; display:block; }
.pridat-do-kosiku span { font-size:30px; font-weight:500; margin-right:37px; line-height:60px; }
.pridat-do-kosiku:before { content:"\f07a"; font-family:"FontAwesome"; display:inline-block; font-size:35px; line-height:19px; color:white; padding-right:26px; vertical-align:initial; }

header .pozor { color:var(--white); padding-top:var(--pFont); font-size:var(--pFontMargin); line-height:37px; font-weight:800; padding:30px 0; }
header .logo { padding:0; margin-top: 30px}

.uvod { width:100%; text-align:center; background:url('assets/excMarkLeft.png') no-repeat 80px 50px, url('assets/comp.png')  no-repeat right top; padding:40px 0 35px; margin:20px 0 0; }
.uvod .motto { font-size:var(--h1); color:var(--cyan); font-weight:100; padding:35px 0; }

.pribeh { background:#04AAB4 url('assets/fullBg0.png') repeat-x center top; font-weight:300; text-align:left; padding:70px 100px 30px 150px; color:var(--white); position:relative; }
.pribeh p { border:#ffffff solid 1px; border-radius:120px; padding:20px 20px 20px 260px; position:relative; color:var(--white);  }
.pribeh img { position:absolute; top:50px; left:50px; }
.pribeh h2 { padding:20px 0 0; color:var(--white); }

.vznik-popis { padding:40px 0 65px; position:relative; }
.vznik-popis h2 { color:var(--red); padding:10px 0 40px; }
.vznik-popis .listCheck { margin:0 120px 0 210px; }
.vznik-popis .excMarkRight { position:absolute; top:30px; right:60px; }
.vznik-popis .peopleComp { position:absolute; top:80px; left:0; }

.graf {}
.graf p { color:var(--grey); font-weight:800; }
.graf img { }

.ochrana { position:relative; padding:0 0 30px 0; }
.ochrana h2 { color:var(--grey); padding:20px 0; }
.ochrana h2.ruzova { color:var(--red); }
.ochrana .listCheck { border:none; }
.ochrana .listCheck li { font-size:18px; padding:0 0 0 38px; width:1050px; }
.ochrana p { font-weight:800; color:var(--grey); }
.ochrana .excMarkLeft { position:absolute; bottom:15px; left:25px; }
.ochrana .excMarkRight { position:absolute; bottom:15px; right:25px; }

.block {}
.block .top { background:#23386F url('assets/fullBg3.png') repeat-x center bottom; padding:40px 90px; }
.block .bottom { background:#D8EDF5; border-bottom-left-radius:var(--borderRadius); border-bottom-right-radius:var(--borderRadius); padding:40px 130px; }
.block .top h2,
.block .top .h2 { padding:0 0 10px; color:var(--white); }
.block .bottom p { padding:0 0 20px; }
.block1 .bottom .p3 { max-width:650px; margin:0 auto; }

.leaflets { display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start; padding:50px 0; }
.leaflets img {}

.ziskejte {}
.ziskejte h2 { padding:20px; color:var(--grey); }
.ziskejte p {  }
.ziskejte p a { text-decoration:none; font-weight:800; }

.block2 {  padding:50px 0 0; }
.block2 .top { background:#D24561 url('assets/fullBg4.png') repeat-x center bottom; }
.block2 .top h2 { padding:80px 0; }
.block2 .bottom { background:#F6DAE0; }

.leaflet { padding:35px 0 0; }
.leaflets img {}

.ziskejte.v2 {}
.ziskejte.v2 .pridat-do-kosiku { background:#D24561; }
.ziskejte.v2 iframe { padding:35px 0 0; }

.block3 {  padding:50px 0 0; }
.block3 .top { background:#14A09B url('assets/fullBg5.png') repeat-x center bottom; }
.block3 .top h2 { padding:80px 0; }
.block3 .bottom { background:#D0ECEB; }

.ziskejte.v3 {}
.ziskejte.v3 .pridat-do-kosiku { background:#19B3A9; }

.footer { width:100%; text-align:left; background:url('assets/footer.png') no-repeat left bottom; }
.footer .o-autorce{ width:888px; padding:0 0 0416px; padding:60px 0 50px 450px; }
.footer .o-autorce h2 { margin-left:100px; text-align:left; }
.footer .o-autorce p { font-size:18px; font-size:18px; line-height:33px; padding-bottom:30px; }
.footer .footer-text { font-size:17px; padding:80px 0 20px; }
.footer .footer-text p { font-size:var(--pFont); font-weight:800; color:var(--white); text-align:center; }




@media only screen and (max-width:1425px) {
	/* do 1000px */
	:root {	
	--h1:32px;
	--h1Line:46px;
	--pFont:18px;
	--pFontMargin:22px;
	--liFont:20px;
	--liFontMargin:37px;
	--borderRadius:70px;
	
	--fullWidth:1024px;
}
	
	
	header { width:100%; }	
	.container,	 	 
	.imgWorkList { width:var(--fullWidth); }			
	header .pozor,
	header .pozor strong { font-size:20px; line-height:38px; }
	.body .container .h3WorkList,	
	.body .container .h2school { font-size:30px; }	
		
	.pribeh p { padding:20px 45px 20px 260px; }	
	.pribeh img { top:70px; }
	.uvod { background:url('assets/excMarkLeft.png') no-repeat 20px 50px, url('assets/comp.png') no-repeat right 40px; padding:40px 0 35px; margin:20px 0 0; background-size:185px 160px, 258px 200px; }
	
	.uvod .motto { padding:30px 0 10px; }
	.uvod .popis { text-align:left; width:auto; margin-left:285px; padding-top:5px; font-size:15px; }	
			
	.uvod .vznik { margin-top:70px; }	
	.uvod .vznik h2 { padding:15px 0; }
	.uvod .vznik img { padding:0; }
	h2 { font-size:30px; }

  .vznik-popis .listCheck { margin:0 120px 0 210px; padding:30px 20px 30px 155px; }
  
	.vznik-popis .excMarkRight { width:200px; right:30px; top:70px; }
	
	.ochrana .excMarkLeft { width:200px; left:10px; }
	.ochrana .excMarkRight { width:200px; right:10px; }
	
	.block2 .top,
	.block3 .top { padding:0px 10px 10px; }
	
	
	.footer {  }
	.footer .o-autorce { width:auto; height:auto; padding: 60px 0 0px 410px; }
	.footer .o-autorce h2 { font-size:30px; padding:0 0 20px; margin-left:80px; }
	.footer .o-autorce p { font-size:15px; line-height:25px; margin-bottom:20px; }
	.footer .footer-text { height:auto; padding:50px 0; margin-top:65px; }

}

@media only screen and (max-width:1024px) {
	:root {	
	--h1:28px;
	--h1Line:40px;
	--pFont:16px;
	--pFontMargin:22px;
	--liFont:18px;
	--liFontMargin:22px;
	--borderRadius:50px;
	
	--fullWidth:768px;
}
	
	.container,	 	 
	.imgWorkList { max-width:var(--fullWidth); width:100%; }	
	

	header .pozor { font-size:var(--pFont); line-height:var(--pFontMargin); padding:35px; }
	header .logo { max-width:500px; margin:27px auto; padding:0 0 20px; }
	
	.body .container .uvod { margin-top:0px; padding:30px 0 45px; background:url('assets/excMarkLeft.png') no-repeat 10px 50px, url('assets/comp.png') no-repeat right 60px;  background-size:139px 120px, 194px 150px; }
	.body .container .uvod h1 { font-size:var(--h1); padding:10px 0; }
	.body .container .uvod .motto { font-size:var(--h1); padding:0; }
	.body .container .uvod .popis { padding:180px 20px 10px; margin:0 auto; font-size:16px; text-align:center; }
	

	.pribeh { padding:170px 50px 30px 50px; }
	.pribeh img { top:20px; left:50%; margin-left:-25%; max-width:60%; }
	.pribeh p { padding:70px 45px 40px 45px; border-radius:70px; }
	
	.body .container .vznik-popis .listCheck { z-index:-999999; margin:0 auto; border:#002F7B solid 1px; border-radius:53px; padding:40px 20px 10px; position:relative; }
	.body .container .vznik-popis .listCheck { background:url('assets/iconCheck.png') no-repeat left 4px; background-size:20px 15px; }		
	.vznik-popis .listCheck li { padding:0px 0 0 35px; }
	.vznik-popis .peopleComp { width:200px; top:115px; }
	.vznik-popis .excMarkRight { width:150px; top:80px; right:0; } 
	.body .container .vznik-popis .listCheck { padding:20px 20px 20px 200px; }
	.listCheck li { background-size:17px; padding:0px 0 0 25px; }
	
	.pridat-do-kosiku { width:236px; height:40px; line-height:40px; display:flex; flex-wrap:nowrap;
	justify-content:center; align-items:center; }
	.pridat-do-kosiku span { line-height:40px; font-size:20px; margin:0; }
	.pridat-do-kosiku::before { padding-right:5px; font-size:24px; line-height:40px; }	

	.graf p br { display:none; }
	.ochrana .listCheck li { max-width:var(--fullWidth); width:auto; }
	.ochrana .excMarkLeft { width:120px; left:0px; bottom:5px; }
	.ochrana .excMarkRight { width:120px; right:0px; bottom:5px; }
	
	.block .top { padding:40px 50px; }
	.block .bottom { padding:40px 50px; }
	
	.block2 .top h2,
	.block3 .top h2	{ padding:30px 0 50px }
			
	
	.body .container .footer { background:none; margin:40px 0 0; }
	.body .container .footer .o-autorce { margin:0 auto; background:url('assets/footerSmall.png') no-repeat center bottom; padding:0 20px 260px; }
	.body .container .footer .o-autorce h2 { font-size:24px; padding:0; text-align:center; margin:0; }
	.footer .o-autorce p { margin:0; }
	.footer .footer-text { background:#14A09B; margin:0; padding:20px; }
	
}





@media only screen and (max-width:780px) {
	:root {	
	--h1:24px;
	--h1Line:36px;
	--pFont:16px;
	--pFontMargin:22px;
	--liFont:14px;
	--liFontMargin:22px;
	--borderRadius:50px;
	
	--fullWidth:768px;
}

    p { margin:0 15px; }
	.container,
	.body,
	.imgWorkList { max-width:var(--fullWidth); min-width:320px; } 
	
	header .pozor { font-size:13px; line-height:22px; padding:25px 10px; height: 44px}
	header .pozor strong { font-size:16px; line-height:22px; }
	
	header .logo { padding: 1px 0 18px 0; }
	header .logo img { max-width:300px; }
	.vznik-popis .peopleComp { width:320px; } 
	.body .container .uvod { background:none; }
	.pribeh img { width:260px; top:40px; left:calc(50% - 130px); margin:0; max-width:100%; }
	.pribeh p { padding:42px 15px 15px 15px; border-radius:40px; }
	.pribeh { padding:150px 20px 30px 20px; }

	.vznik-popis .excMarkRight { display:none; }
	.listCheck li { width:auto; }
	
	.ochrana .excMarkRight,
	.ochrana .excMarkLeft { display:none; }
	
	.block .top,
	.block .bottom { padding: 40px 20px; }
	
	.vznik-popis .peopleComp { max-width:200px; left:calc(50% - 100px); }
	.body .container .vznik-popis .listCheck { padding:20px 20px 20px 20px; margin:160px 0 0 0; }
	.vznik-popis { padding:40px 0 35px; }
	iframe { max-width:100%; height:auto; width:90%; }
	.vznik-popis .listCheck li { margin-left:calc(50% - 135px); }
	.vznik-popis .peopleComp { top:102px; }
	.pridat-div{
		justify-content: center;
		flex-flow: column;
		gap: 15px !important;

	}
	
}



@media only screen and (max-width:370px) {
    .vznik-popis .peopleComp {
        top: 140px;
    }

    .vznik-popis .peopleComp {
        max-width: 150px;
        left: calc(50% - 100px);
    }

}

.pridat-div{
	background-color: #ffd701;
	padding: 20px;
	display: flex;
	justify-content: center;
	gap: 50px;
}
.prohlednout {
	background: #002F7B !important;
}

.pridat-do-kosiku{
	width: unset;
	padding-left: 25px;
	margin: unset;
}

.svetlemodra { background:##00A0E0; }

.bottom-links {
	display: flex;
	justify-content: space-around;
	margin-top:20px;

}

.bottom-links a {
	color:white;
	text-decoration: none;
	font-weight: bold;
	flex: 1 1 0;
    width: 0;
    text-align: center;
}

@media (max-width: 75rem) {
	.bottom-links {
		max-width: 100%;
		flex-wrap: wrap;
	}

	.bottom-links a {
		flex: unset;
		width: unset;
		width: 100%;
	}
}






.recenze {
	width: 85%;
	margin: auto;
    margin-top: 1rem;
	position: relative;
}

.recenze h2.grey {
	color: grey;
}

.recenze * {
	box-sizing: border-box;
}


.recenze .rec-text {
	position: relative;
	border-radius: 5rem;
	font-style: italic;
	font-size: 1.2rem;
	padding: 1rem;
	padding-top: 2rem;
	padding-bottom: 4rem;
	height: 100%;
}

.recenze .rec-text p {
	position: absolute;
	bottom: 1.5rem;
	left: 50%;
	transform: translateX(-50%);
}

/* .recenze br {
	display: none;
} */

.recenze .rec-container {
	display: flex;
	flex-flow: row;
	justify-content: center;
	width: 90%;
	gap: 1.5rem;
	margin: auto;
	height: 16rem;
	
	align-items: center;
}

.recenze .rec-inner {
	width: 50%;
	position: relative;
	height: 100%;
}

.recenze h2 {
	margin-top: 2rem;
	margin-bottom: 1rem;
}

.recenze .rec-deti .rec-text {
	border: 0.15rem solid rgb(0,160,224);
}

.recenze .rec-kam .rec-text {
	border: 0.15rem solid rgb(210,69,97);
}

.recenze .rec-des .rec-text {
	border: 0.15rem solid rgb(25,179,169);
}

.recenze .rec-deti, .recenze .rec-deti * {
	color: rgb(0,160,224);
}

.recenze .rec-kam, .recenze .rec-kam * {
	color: rgb(210,69,97);
}

.recenze .rec-des, .recenze .rec-des * {
	color: rgb(25,179,169);
}

.recenze .rec-left .rec-text {
	padding-left: 4rem;
}

.recenze .rec-right .rec-text {
	padding-right: 4rem;
}

.recenze img {
	position: absolute;
	width: 8rem;
	z-index: 100;
	top: 50%;
	transform: translateY(-50%);

}

.recenze .rec-left img {
	left: -4rem;
}

.recenze .rec-right img {
	right: -4rem;
}

@media (max-width: 96.25rem) {

	.recenze {
		width: 95%;
		margin: auto;
	}

	.recenze .rec-text {
		padding: 4.5rem!important;
		height: unset;
		padding-left: 1rem!important;
		padding-right: 1rem!important;
		padding-bottom: 0.5rem!important;
		margin-left: 0!important;
	}
	
	.recenze .rec-text p {
		position: relative;
		margin: 0!important;
		padding: 0!important;
		margin-top: 2rem!important;
		width: 100%;
		text-align: center;
	}
	
	.recenze br {
		display: none;
	}
	
	.recenze .rec-container {
		flex-flow: column;
		width: 100%;
		height: unset;
		gap: 5rem;
	}
	
	.recenze .rec-inner {
		max-width: 25rem;
		width: unset;
		height: auto;
	}
	
	.recenze h2 {
		margin-top: 2.5rem;
		margin-bottom: 4.5rem;
	}
	
	.recenze h2.grey {
		margin-bottom: 0rem;
	}

	.recenze img {
		top: -4rem;
		left: 50%!important;
		right: unset!important;
		transform: translateX(-50%);
	}
}
