/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 *
 * 2do barva selekce
 */

::-moz-selection {
    background: #c0c0c0;
    text-shadow: none;
}

::selection {
    background: #c0c0c0;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1rem 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

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

@font-face {
    font-family: 'TeutonMager';
    src: url('fonts/TeutonMager.eot');
    src: url('fonts/TeutonMager.eot?#iefix') format('embedded-opentype'),
         url('fonts/TeutonMager.woff') format('woff'),
         url('fonts/TeutonMager.ttf') format('truetype'),
         url('fonts/TeutonMager.svg#teuton_magerregular') format('svg');
}

body, html {
	font-family: 'Verdana', sans-serif;
	text-shadow: none;

	background-color: #e5e5e5;
	height: 100%;
	min-height: 100%;
	min-width: 1024px;
}

button, input, select, textarea {
	font-family: 'Verdana', sans-serif;
}

a { color: #636363; text-decoration: underline; }
a:hover { color: #000000; }

/* --- project --- */

header {
	height: 530px;
}

header a {
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
}

header .content {
	position: relative;
	height: 100%;
	padding: 0;
	/*
	background-image: url("../img/head.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	*/
}

header h1 {
	font-family: 'TeutonMager';
	font-weight: bold;
	margin: 0;
}

header h1 a {
	color: #000000;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 45px;
	position: relative;
	top: 7px;
}

header .header-stripe {
	position: absolute;
	bottom: 0;
	padding: 1rem;
	z-index: 4;
	background-color: rgba(255,255,255,0.7);
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-align: center;
	font-weight: bold;
	width: 100%;
	box-sizing: border-box;
}

header .logo img {
	width: 100%;
	max-width: 200px;
}

header .text {
	font-family: 'TeutonMager';
	font-weight: bold;
	font-size: 22px;
}

#slider {
	position: relative;
	width: 100%;
	height: 100%;
}

#slider article {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	z-index: 1;
	opacity: 0;
	transition: opacity 1s ease;
	background-color: #f2f2f2;
}

#slider article.active {
	z-index: 2;
	opacity: 1;
}

#slider article img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.form {
	width: 50%;
	min-width: 20rem;
	box-sizing: border-box;
	padding: 1rem;
	margin: 0 auto;
	margin-top: 1rem;
	margin-bottom: 1rem;
	border: 1px solid #000000;
}

.form h2 {
	margin-top: 0;
}

.form table {
	width: 80%;
	margin: 0 auto;
}

.form th { display: none; }

.form input {
	width: 100%;
	box-sizing: border-box;
	border: 1px solid #000000;
	line-height: 2rem;
	margin-bottom: 0.5rem;
}

.form input.button {
	background-color: #000000;
	width: 50%;
	text-transform: uppercase;
	color: #ffffff;
	margin: 0;
}

#user {
	float: right;
	text-align: right;
}

.content {
	width: 100%;
	width: 1024px;
	box-sizing: border-box;
	padding: 1rem;
	margin: 0 auto;
	background-color: #ffffff;
}

h1 {
	margin-top: 0;
}

.number {
	float: left;
	width: 80px;
}

.number.number2 {
	padding-left: 80px;
}

.numberCont {
	float: left;
	width: 910px;
}

.numberCont.numberCont2 {
	width: 830px;
}

.new {
	border: 1px solid #000000;
	padding: 1rem;
}

.new h2 {
	margin-top: 0;
}

nav {
	float: left;
}

h1 { margin-top: 0; }

.main-text h1 {
	font-size: 1em;
	color: #767676;
	text-transform: uppercase;
	margin: 3em 0 0 0;
}

.main-text h2, .main-text h3 {
	font-size: 1em;
	margin: 1em 0 0 0;
}

.main-text h3 { font-style: italic; }

/* flashes */

figure.flashes {
	position: fixed;
	width: 370px;
	padding: 15px;
	top: 333px;
	left: 50%;
	margin-left: -200px;
	background-color: #636363;
	color: #ffffff;
	font-weight: bold;
	z-index: 12;
	border: 1px solid #ffffff;
}

figure a.closeFlashes {
	display: block;
	float: right;
	font-weight: bold;
	text-decoration: none;
	color: #ffffff;
}

/* recaptcha */

.recaptchaContainer.absolute {
	position: absolute;
	width: 302px;
	height: 76px;
	overflow: hidden;
	top: 50%;
	left: 50%;
	margin: -39px 0px 0px -152px;
	box-shadow: 0px 0px 40px 10px rgba(0,0,0,0.8);
}

/* paginator */

div.paginator {
	text-align: center;
	color: #14405C;
	clear: both;
	margin: 1rem 0;
}

div.paginator .number {
	border-radius: 1000px;
	display: inline-block;
	box-sizing: border-box;
	width: 2rem;
	height: 2rem;
	border: 1px solid #636363;
	padding: 3px 8px 3px 8px;
	margin: 0px 2px 0px 2px;
}

div.paginator .button {
	margin: 0px 2px 0px 2px;
}

div.paginator .current {
	background-color: #636363;
	color: #ffffff;

}

div.paginator a {
	text-decoration: none;
}

/* errors */

ul.error {
	display: block;
	background-color: #ee630f;
	color: #ffffff;
	padding: 5px 10px;
	margin: 1rem 0rem;
}

ul.error li {
	padding: 0px;
	margin: 0px;
	list-style-type: none;
	list-style-image: none;
}

/* - - - */

a[href^="error:"] {
	background: red;
	color: white;
}

pre.dump {
	position: fixed;
	bottom: 0px;
	z-index: 1000;
	background-color: #ccc;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

div.center {
	text-align: center;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}