.flex-container {
    display: -webkit-flex;
    display: flex;  
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    text-align: center;
	max-width: 980px;
	margin: 0 auto;
}

.flex-container > * {
    padding: 15px;
    -webkit-flex: 1 100%;
    flex: 1 100%;
}

.article {
    text-align: left;
	border-top: 1px solid silver;
}

header {
	text-align: left;
	float: left;
	margin: 0 auto;
	/*background: burlywood;*/ 
}

/* Zápatí */
footer {
	margin: 0px auto 10px auto;
	border-top: 1px solid silver;
	font-family: Arial, Helvetica, sans-serif;
}

footer p {
	margin: 0;
	padding: 0;
	line-height: normal;
	font-size: 0.8em;
	text-transform: uppercase;
	text-align: center;
	color: rgb(103, 103, 103);
}

footer a {
	text-decoration: none;
	color: rgb(103, 103, 103);
}

footer a:hover {
	text-decoration: underline;
}

nav {
	width: 980px;
	padding: 0;
	border-top: 1px solid silver;
}

@media all and (min-width: 768px) {
    .nav {text-align:left;-webkit-flex: 1 auto;flex:1 auto;-webkit-order:1;order:1;}
    .article {-webkit-flex:5 0px;flex:5 0px;-webkit-order:2;order:2;}
    footer {-webkit-order:3;order:3;}
}





body {
	margin: 0;
	padding: 0;
	background-color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: rgb(103, 103, 103);
}

h1, h2, h3 {
	margin: 0;
	padding: 0;
	font-weight: normal;
	color: rgb(0, 37, 79);
}

h1 {
	font-size: 2em;
	padding-bottom: 0.8em;
}

h2 {
	font-size: 1.3em;
	padding-top: 0.8em;
	padding-bottom: 0.5em;
}

h3 {
	font-size: 1.2em;
	padding-top: 0.5em;
}

p, ul, ol {
	margin-top: 0;
	line-height: 140%;
}

em {
	font-style: normal;
	font-weight: bold;
}

/*seznam s odrážkami*/
ul, ol {
}

ul {
	list-style-image: url(../obrazky/odrazka-ctverec.png);
}

.seznam-bez-odrazek {
	list-style-type: none;
}

a {
	text-decoration: none;
	color: rgb(178, 0, 0);
}

a:hover {
	text-decoration: underline;
}

img.border {
	border: 0;
}


/* Logo v záhlaví*/
#logo {
	margin: 0;
	padding: 0;
}

#logo p {
	margin: 0;
	padding: 0;
	/*text-shadow: silver -1px 1px 2px;*/
	font: normal 18px Georgia, "Times New Roman", Times, serif;
	font-style: italic;
}

#logo p.nadpis-webu {
	padding-top: 15px;
	padding-left: 0px;
	padding-bottom: 10px;
	letter-spacing: -1px;
	/*text-transform: lowercase;*/
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	font-size: 36px;
	color: rgb(23, 49, 70);
}

#logo a {
	border: none;
	background: none;
	text-decoration: none;
	color: rgb(148, 0, 40);
}

/* Menu */
.nav ul {
	margin: 0;
	padding: 0px 0px 0px 4px;
	list-style: none;
	line-height: normal;
}

.nav li {
	float: left;
}

.nav a {
	display: block;
	margin-right: 1px;
	padding: 0px 15px;
	text-decoration: none;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: normal;
	color: rgb(78, 91, 100);
	border: none;
}

.nav a:hover {
	text-decoration: none;
	color: rgb(178, 0, 0);
}

.nav li.vybrana a {
	color: rgb(178, 0, 0);
}

/* Tlačítko */
a.tlacitko {
	color: white; /* barva textu */
	text-decoration: none; /* odebrat podtržení u odkazů */
	background: rgb(212,75,56); /* pozadí tlačítka */
	padding: 0.4em 1.5em; /* odsazení od textu */
	outline: none; /* odstraňovat vnější rámeček v Mozilla */
	font-size: 1.4em;
} 

a.tlacitko:hover {
	background: rgb(152,15,0); 
} /* při najetí myší */

a.tlacitko:active {
	background: rgb(232,95,76); 
} /* při stisknutí */


a.tl-vice {
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	color: rgb(68,68,68);
	text-decoration: none;
	padding: .4em 1.4em;
	outline: none;
	border: 1px solid rgba(0,0,0,.1);
	border-radius: 2px;
	background: rgb(245,245,245) linear-gradient(#f4f4f4, #f1f1f1);
	transition: all .218s ease 0s;
}
a.tl-vice:hover {
	border: 1px solid rgb(198,198,198);
	background: #f7f7f7 linear-gradient(#f7f7f7, #f1f1f1);
	box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
a.tl-vice:active {
	border: 1px solid rgb(204,204,204);
	background: rgb(238,238,238) linear-gradient(rgb(238,238,238), rgb(224,224,224));
	box-shadow: 0 1px 2px rgba(0,0,0,.1) inset;
}

/* ----- vodorovná čára ----- */
hr {
    border: 0;
    border-top: 1px solid rgb(210, 210, 225);
    margin: 30px 0;
}

/* ----- tabulky ----- */
table, th, td {
	border: 1px solid rgb(210, 210, 225);
	border-collapse: collapse;
}

table {
	/*margin-left: /*30px;*/
	margin-top: 15px;
	margin-bottom: 10px;
	width: 100%;
}

th {
	background: rgb(170, 170, 180);
	color: rgb(245, 245, 245)
}

td {
	/*color: rgb(63, 63, 63)*/
	vertical-align: top;
}

th, td {
	padding: 3px 5px;
} 

th.doleva, td.doleva {
	text-align: left; /* zarovnání k levému okraji buňky */
} 

th.doprava, td.doprava {
	text-align: right; /* zarovnání k pravému okraji buňky */
}

th.stred, td.stred {
	text-align: center; /* zarovnání na střed */
}

/* ----- formulare ----- */
input[type="button"], input[type="submit"] {
	display: inline-block;
	text-align: center;
	width: 130px; /*výchozí šířka tlačítka*/
	border: 0px;
	background: rgb(89, 102, 119); 
	background: -webkit-linear-gradient(top, rgb(89, 102, 119), rgb(63, 76, 93));
	background: -moz-linear-gradient(top, rgb(89, 102, 119), rgb(63, 76, 93));
	background: -ms-linear-gradient(top, rgb(89, 102, 119), rgb(63, 76, 93));
	background: -o-linear-gradient(top, rgb(89, 102, 119), rgb(63, 76, 93));
	background: linear-gradient(rgb(89, 102, 119), rgb(63, 76, 93));
	-webkit-border-radius: 6;
	-moz-border-radius: 6;
	border-radius: 6px;
	color: rgb(255, 255, 255);
	font-size: 120%;
	font-weight: 100;
	margin-top: 8px;
	padding: 5px 0px 5px 0px;
	cursor: pointer; /*kurzor myši ručička (aby chování bylo stejné jako html tlačítka)*/
	text-decoration: none;
	color: rgb(230, 230, 230);
}

input[type="button"]:hover, input[type="submit"]:hover {
	color: rgb(255, 255, 255);
	background: rgb(80, 110, 125);
	background-image: -webkit-linear-gradient(top, rgb(104, 117, 134), rgb(78, 91, 108));
	background-image: -moz-linear-gradient(top, rgb(104, 117, 134), rgb(78, 91, 108));
	background-image: -ms-linear-gradient(top, rgb(104, 117, 134), rgb(78, 91, 108));
	background-image: -o-linear-gradient(top, rgb(104, 117, 134), rgb(78, 91, 108));
	background-image: linear-gradient(to bottom, rgb(104, 117, 134), rgb(78, 91, 108));
	text-decoration: none;
}

input, textarea, select {
	padding: 5px;
	margin-bottom: 5px;
	color: rgb(73, 73, 93);
}

select {
	width: 12em;
}

label {
	display: block;
	float: left;
	clear: left;
	width: 140px;
	padding-right: 1em;
	text-align: right;
	line-height: 1.8em;
	font-size: 110%;
	color: rgb(73, 73, 93);
}

br {
	clear: both;
	margin-bottom: 20px;
}

span.skryty {
	display: none;
}