/* ============================================================================================================================= */
/* ========== RESET ========== */
/* ============================================================================================================================= */

html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input, figure 
{ 
	margin: 0; 
	padding: 0; 
}

h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code, em, strong, th 
{ 
	font-size: 1em; 
	font-weight: normal; 
	font-style: normal; 
}

fieldset, iframe, table, img 
{ 
	border: none; 
}

caption,th 
{ 
	text-align: left; 
}

table 
{ 
	border-collapse: collapse; 
	border-spacing: 0; 
}

article, aside, footer, header, hgroup, nav, section, figure, figcaption 
{ 
	display: block; 
}




/* ============================================================================================================================= */
/* ========== NASTAVENI STRANKY ========== */
/* ============================================================================================================================= */

@media only screen and (min-width:1024px) {

	html, body
	{
		min-width: 320px;
		width: 100%;
		height: 100%;
		min-height: 768px;
		font-family: 'Open Sans';
		font-size: 14px;
	  	font-weight: normal;
	    color: black;
		-webkit-font-smoothing: antialiased;
		-moz-font-smoothing: antialiased;
		font-smoothing: antialiased;
		text-rendering: optimizeLegibility;
		-webkit-text-size-adjust: none;
		-webkit-appearance: none;
	}


	html, body#home
	{
		min-width: 320px; 
		height: 100%; 
		font-family: 'Open Sans';
		font-size: 14px;
	  	font-weight: normal;
	    color: black;
		-webkit-font-smoothing: antialiased;
		-moz-font-smoothing: antialiased;
		font-smoothing: antialiased;
		text-rendering: optimizeLegibility;
		-webkit-text-size-adjust: none;
	}

}


@media only screen and (max-width:1023px) {

	html, body
	{
		min-width: 320px;
		width: 100%;
		height: 100%;
		min-height: 480px;
		font-family: 'Open Sans';
		font-size: 14px;
	  	font-weight: normal;
	    color: black;
		-webkit-font-smoothing: antialiased;
		-moz-font-smoothing: antialiased;
		font-smoothing: antialiased;
		text-rendering: optimizeLegibility;
		-webkit-text-size-adjust: none;
		-webkit-appearance: none;
	}


	html, body#home
	{
		min-width: 320px; 
		height: 100%; 
		min-height: 600px;
		font-family: 'Open Sans';
		font-size: 14px;
	  	font-weight: normal;
	    color: black;
		-webkit-font-smoothing: antialiased;
		-moz-font-smoothing: antialiased;
		font-smoothing: antialiased;
		text-rendering: optimizeLegibility;
		-webkit-text-size-adjust: none;
	}

}


body { position: relative; z-index: 1; }



.whitebg
{
	background-color: rgb(255,255,255);
}


.darkbg
{
	background-color: #8F7865;
/*	background-image: url("../grafika/deska.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center top;*/
}


.slonbg
{
	background-color: #fff4e6;
}



/* Vsechny odkazy v zakladu */

a			{ color: #00A3A3; text-decoration: none; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -o-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear; } 
a:link		{ color: #00A3A3; } /* odkaz */
a:visited 	{ color: #00A3A3; } /* navstiveny */
a:active  	{ color: #00A3A3; } /* aktivni */
a:hover  	{ color: #00A3A3; text-decoration: none; } 



/* Nastaveni pisma */

h1		{ color: #000000; font-size: 36px; font-family: 'Open Sans'; font-weight: 100; }
h2		{ color: #333333; font-size: 26px; font-family: 'Open Sans'; font-weight: 100; }
h3		{ color: #000000; font-size: 24px; font-family: 'Open Sans'; font-weight: 200; }
h4		{ color: #666666; font-size: 18px; font-family: 'Open Sans'; font-weight: 200; }
h5		{ color: #333333; font-size: 16px; font-family: 'Open Sans'; font-weight: 300; }
h6		{ color: #1A1A1A; font-size: 14px; font-family: 'Open Sans'; font-weight: 300; }






@media only screen and (min-width:1024px) {

	.nadpis
	{
		max-width: 932px;
		position: relative;
		margin: 0 auto;
		display: table;
	}


	.nadpis h1
	{
		text-align: center;
		font-size: 35px;
		font-weight: 400;
		color: white;
	}


	.popis
	{
		max-width: 932px;
		position: relative;
		margin: 0 auto 15px auto;
		display: table;
	}


	.popis h2 a,
	.popis h3 a
	{
		color: white;
	}

	.popis h2
	{
		text-align: center;
		font-size: 21px;
		font-weight: 400;
		color: white;
		margin: 10px auto 0 auto;
	}


	.popis h3
	{
		text-align: center;
		font-size: 16px;
		font-weight: 400;
		color: white;
		margin: 35px auto 0 auto;
	}
}



@media only screen and (max-width:1023px) {

	.nadpis
	{
		position: relative;
		margin: 0 auto;
		display: table;
	}


	.nadpis h1
	{
		text-align: center;
		font-size: 28px;
		font-weight: 400;
		color: white;
	}


	.popis
	{
		max-width: 932px;
		position: relative;
		margin: 0 auto 15px auto;
		display: table;
	}


	.popis h2 a,
	.popis h3 a
	{
		color: white;
	}

	.popis h2
	{
		text-align: center;
		font-size: 16px;
		font-weight: 400;
		color: white;
		margin: 5px auto 0 auto;
	}


	.popis h3
	{
		text-align: center;
		font-size: 14px;
		font-weight: 400;
		color: white;
	}
}





/* Bold */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Bold.ttf');
    font-weight: 600;
    font-style: bold;
}

/* Bold Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-BoldItalic.ttf');
    font-weight: 600;
    font-style: italic;
}

/* Extra Bold */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-ExtraBold.ttf');
    font-weight: 800;
    font-style: bold;
}

/* Extra Bold Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-ExtraBoldItalic.ttf');
    font-weight: 800;
    font-style: italic;
}

/* Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Italic.ttf');
    font-weight: 400;
    font-style: italic;
}

/* Light */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Light.ttf');
    font-weight: 300;
    font-style: normal;
}

/* Light Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-LightItalic.ttf');
    font-weight: 300;
    font-style: italic;
}

/* Regular */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Regular.ttf');
    font-weight: 400;
    font-style: normal;
}

/* Semibold */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Semibold.ttf');
    font-weight: 600;
    font-style: bold;
}

/* Semibold Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-SemiboldItalic.ttf');
    font-weight: 600;
    font-style: italic;
}





@media only screen and (min-width:1024px) {

	section.articles
	{
		width: 100%;
		margin: 0 auto;
		position: relative;
		display: table;
		overflow: hidden;
	}


	section.articles-nabidka
	{
		width: 100%;
		margin: 0 auto;
		position: relative;
		display: table;
		overflow: hidden;
	}


	section.articles-nabidka article
	{
		width: auto;
		margin: 10px auto 0 auto;
		padding: 0 5px;
		position: relative;
		display: table;
	}


	section.articles-hlavicka
	{
		width: 100%;
		margin: 0 auto;
		position: relative;
		display: table;
		overflow: hidden;
	}


	section.articles-hlavicka article
	{
		width: auto;
		margin: 10px auto 5px auto;
		padding: 0 5px;
		position: relative;
		display: table;
	}


	article
	{
		width: 932px;
		margin: 25px auto;
		padding: 0 25px;
		position: relative;
		display: table;
	}



	section.articles-podmenu article
	{
		width: 932px;
		margin: 0 auto;
		padding: 0 10px;
		position: relative;
	}


	hr.hrclasic
	{
		width: 100%;
		height: 1px;
		position: relative;
		border: none;
		background-color: rgb(229,229,229);
		margin: 50px 0;
	}

}



@media only screen and (max-width:1023px) {
	section.articles
	{
		width: 100%;
		margin: 0 auto;
		position: relative;
		display: table;
		overflow: hidden;
	}


	article
	{
		margin: 15px auto;
		padding: 0 10px;
		position: relative;
		display: table;
	}


	section.articles-hlavicka
	{
		width: 100%;
		margin: 0 auto;
		position: relative;
		display: table;
		overflow: hidden;
	}


	section.articles-hlavicka article
	{
		width: auto;
		margin: 10px auto 0 auto;
		padding: 0 5px;
		position: relative;
		display: table;
	}


	section.articles-podmenu article
	{
		margin: 0 auto;
		padding: 0 10px;
		position: relative;
	}

	.napoje article
	{
		width: 100%;
		margin: 0 auto;
		position: relative;
		display: table;
		padding: 0;
	}
	hr.hrclasic
	{
		width: 100%;
		height: 1px;
		position: relative;
		border: none;
		background-color: rgb(229,229,229);
		margin: 25px 0;
	}
}






@media only screen and (min-width:640px) {
	section.articles-nabidka
	{
		width: 100%;
		margin: 0 auto;
		position: relative;
		display: table;
		overflow: hidden;
	}


	section.articles-nabidka article
	{
		width: auto;
		margin: 10px auto 0 auto;
		padding: 0 5px;
		position: relative;
		display: table;
	}
}


@media only screen and (max-width:639px) {
	section.articles-nabidka
	{
		width: 100%;
		margin: 0 auto;
		position: relative;
		display: table;
		overflow: hidden;
	}


	section.articles-nabidka article
	{
		margin: 10px auto 0 auto;
		padding: 0;
		position: relative;
		display: table;
	}
}










/* ============================================================================================================================= */
/* ========== NASTAVENI STRANKY IPHONE X ========== */
/* ============================================================================================================================= */


@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio : 3) {

	@media screen and (orientation: landscape) {

		.postbox-hornimenu
		{
			padding: 0px 44px 0px 44px;
			padding: 44px constant(safe-area-inset-right) 44px constant(safe-area-inset-left);
		}

		.postbox-pata
		{
			padding: 0px 44x 21px 44px;
			padding: 44px constant(safe-area-inset-right) 44px constant(safe-area-inset-left) 21px constant(safe-area-inset-bottom);
		}

		.postbox-conteiner
		{
			padding: 0px 44px 0px 44px;
			padding: 44px constant(safe-area-inset-right) 44px constant(safe-area-inset-left);
		}

	}



	@media screen and (orientation: portrait) {

		.postbox-hornimenu
		{
			padding: 0px 0px 0px 0px;
			padding: 0px constant(safe-area-inset-right) 0px constant(safe-area-inset-left);
		}

		.postbox-pata
		{
			padding: 0px 0px 21px 0px;
			padding: 0px constant(safe-area-inset-right) 0px constant(safe-area-inset-left) 21px constant(safe-area-inset-bottom);
		}

		.postbox-conteiner
		{
			padding: 0px 0px 0px 0px;
			padding: 0px constant(safe-area-inset-right) 0px constant(safe-area-inset-left);
		}
	}
}