@import url("https://fonts.googleapis.com/css?family=Dosis:400,500,600,700,800&subset=latin,latin-ext");
@import url("https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&subset=cyrillic,latin-ext");


body, body * {
position: relative;
margin: 0;
padding: 0;
border: 0;
outline: 0;
box-sizing: border-box;
float: none;
clear: both;
font-family: Roboto;
font-size: 20px;
color:rgba(0, 0, 0, 1);
}

header, main, section.menu, footer {
width: 100%;
}

header, main, section, .col, footer {
opacity: 0;
transition: opacity ease-in-out 1s;
}

.inside {
margin: 0 auto;
}

header {
height: 570px;
overflow: hidden;
}

header #logo {
z-index: 101;
float: right;
}

header #logo h1 {
font-size: 50px;
color:rgba(0, 0, 0, 1);
font-family: Dosis;
text-transform: uppercase;
}

header #logo h1:hover div {
background-color:rgba(219, 47, 47, 0.9);
color:rgba(0, 0, 0, 1);
}

header #logo h1:hover div:nth-child(2) {
color:rgba(219, 47, 47, 0.9);
background-color: rgba(255, 255, 255, 0.9);
}

header #logo h1 div {
float: right;
font-family: Dosis;
text-align: center;
width: 20vw;
background-color: rgba(255, 255, 255, 0.9);
color:rgba(219, 47, 47, 0.9);
height: 70px;
line-height: 70px;
transition: color ease-in-out 0.5s, background-color ease-in-out 0.5s;
}

header #logo h1 div:nth-child(2) {
background-color:rgba(219, 47, 47, 0.9);
color:rgba(0, 0, 0, 1);
width: 25vw;
height: 100px;
line-height: 100px;
font-size: 72px;
letter-spacing: 20px;
}

header #logo h1 div:nth-child(3) {
width: 30vw;
}

header #slider {
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}

header #slider div {
opacity: 0;
transition: opacity ease-in-out 1s;
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

header #slider div.active {
opacity: 1;
}

header #slider div img {
position: absolute;
}

header #slider div img.slideBG {
width: 100%;
height: 100%;
filter: blur(10px);
}

header #slider div img.slideFR {
height: 100%;
left: 0;
right: 0;
margin: 0 auto;
}

header .info {
position: absolute;
top: 25%;
height: 25%;
z-index: 102;
}

header .info div {
font-size: 30px;
font-family: Dosis;
background-color:rgba(219, 47, 47, 0.9);
color:rgba(0, 0, 0, 1);
padding: 20px;
text-transform: uppercase;
font-weight: bold;
}

header .info div:nth-child(2) {
background-color: white;
color:rgba(219, 47, 47, 0.9);
}

section.menu, footer {
margin-top: -70px;
width: 100%;
height: 50px;
background-color:rgba(219, 47, 47, 0.7);
height: 70px;
line-height: 70px;
font-size: 50px;
font-family: Dosis;
font-weight: bold;
text-transform: uppercase;
color:rgba(0, 0, 0, 1);
text-decoration: none;
text-align: center;
}

section.menu nav, footer nav {
display: flex;
justify-content: center;
font-family: inherit;
font-weight: inherit;
color: inherit;
text-decoration: inherit;
font-size: inherit;
}

section.menu nav a, footer nav a {
display: flex;
flex-direction: column;
flex: 0;
padding: 0 50px;
font-family: inherit;
font-weight: inherit;
color: inherit;
text-decoration: inherit;
font-size: inherit;
transition: background-color ease-in-out 0.5s;
}

section.menu nav a:hover, footer nav a:hover {
background-color: rgba(0, 0, 0, 0.3);
}

section.menu.admin {
margin-top: 20px;
}

section.menu.admin nav a {
font-size: 20px !important;
}

main {
display: flex;
justify-content: center;
flex-wrap: wrap;
}

main section {
display: flex;
flex-direction: column;
flex: 1 1 50%;
padding: 20px;
font-size: 20px;
}

main section .inner {
background-color:rgba(219, 47, 47, 0.2);
background: linear-gradient(180deg, rgba(219, 47, 47, 0.2) 0%, white 80%);
padding: 20px;
height: 100%;
}

main section h1, main section h2, main section h3, main section h4 {
background-color:rgba(219, 47, 47, 0.9);
padding: 20px;
color:rgba(0, 0, 0, 1);
font-size: 30px;
font-family: Dosis;
text-transform: uppercase;
}

main section h1 a, main section h2 a, main section h3 a, main section h4 a {
font-family: inherit;
font-weight: inherit;
color: inherit;
text-decoration: inherit;
font-size: inherit;
}

main section .inner h1, main section .inner h2, main section .inner h3, main section .inner h4 {
padding: 20px;
display: block;
margin: 20px 0;
}

main section a {
text-decoration: underline;
color:rgba(219, 47, 47, 0.9);
font-weight: bold;
color: rgba(0, 0, 0, 1);
}

main section img {
max-width: 100%;
}

main section p {
padding: 20px 0;
margin: 20px 0;
}

main section ul {
list-style-type: circle;
list-style-position: inside;
margin: 20px 0;
}

main section:only-child h2 {
display: block;
margin-bottom: 20px;
}

main section img {
display: block;
width: 100%;
height: auto;
}

main section .columns {
display: flex;
justify-content: center;
flex-wrap: wrap;
}

main section .columns .col {
display: flex;
flex-direction: column;
flex: 1 1 25%;
padding: 10px;
}

main section .columns .col.col6 {
flex: 1 1 16.7%;
}

main section .columns .col.col5 {
flex: 1 1 20%;
}

main section .columns .col.col4 {
flex: 1 1 25%;
}

main section .columns .col.col3 {
flex: 1 1 33%;
}

main section .columns .col.col2 {
flex: 1 1 50%;
}

main section .columns.backward {
justify-content: flex-end;
}

main section .columns.c6 .col {
flex: 1 1 16.7%;
}

main section .columns.c5 .col {
flex: 1 1 20%;
}

main section .columns.c4 .col {
flex: 1 1 25%;
}

main section .columns.c3 .col {
flex: 1 1 33%;
}

main section .columns.c2 .col {
flex: 1 1 50%;
}

main section .columns .image_delete {
top: 10px;
display: block;
position: absolute;
background: white;
border-radius: 50%;
width: 40px;
height: 40px;
text-align: center;
line-height: 40px;
}

main section .photo {
width: 100%;
}

main section .photo div {
background-position: top center;
background-repeat: no-repeat;
background-size: cover;
width: calc((100vw - 177px) / 4);
height: calc((100vw - 177px) / 4);
margin: 0 auto;
overflow: hidden;
border-radius: 20px;
box-shadow: 0 0 10px black;
}

main section .photo div:hover {
box-shadow: 0 0 20px black;
}

main section .photo div.rotr {
transform: rotate(90deg);
}

main section .photo div.roth {
transform: rotate(180deg);
}

main section .photo div.rotl {
transform: rotate(270deg);
}

main section .photo div img {
display: none;
}

main section .photo span {
display: block;
text-align: center;
font-size: 20px;
padding: 10px;
background-color:rgba(219, 47, 47, 0.7);
color: rgba(0, 0, 0, 1);
font-family: Dosis;
margin: 0 auto;
border-radius: 0px 0px 20px 20px;
width: calc((100vw - 177px) / 4);
position: absolute;
bottom: 0;
left: 0;
right: 0;

}

footer {
margin-top: auto;
background: rgba(219, 47, 47, 0.9);
}

footer a {
float: right;
font-size: 20px;
margin-right: 10px;
color:rgba(0, 0, 0, 1);
}

footer .fb-like.fb_iframe_widget {
display: inline-flex;
}

.prispevek {
width: 90%;
padding: 10px;
box-sizing: border-box;
display: block;
border: 1px solid #fff;
margin-bottom: 10px;
}

.prispevek:first-child() {
margin-top: 10px;
}

.prispevek div.top {
background-color: #ed1a23;
margin: -11px;
font-weight: 700;
margin-bottom: 0px;
padding: 0 10px;
box-sizing: border-box;
}

.prispevek div.top a:hover {
color:rgba(0, 0, 0, 1);
text-decoration: underline;
}

.prispevek .jmeno {
float: left;
}

.prispevek .datum {
float: right;
}

.prispevek .titulek {
font-size: 15px;
font-weight: 400;
}

.prispevek .zprava {
font-size: 14px;
font-weight: 400;
}

form {
width: 100%;
}

form table {
width: inherit;
}

input, select {
display: block;
height: 40px;
border: 2px solid rgba(219, 47, 47, 0.9);
font-size: 20px;
padding: 5px;
line-height: 26px;
margin: 10px;
width: 100%;
cursor: pointer;
}

input:hover, input:focus, select:hover, select:focus {
box-shadow: 0px 0px 10px;
}

input[type=radio], select[type=radio] {
box-shadow: none;
width: 40px;
height: 40px;
}

.page_config label {
width: 100%;
cursor: pointer;
}

.page_config input[type=radio] {
display: inline-block;
box-shadow: none;
width: 20px;
height: 20px;
}

textarea {
display: block;
width: 100%;
border: 2px solid rgba(219, 47, 47, 0.9);
line-height: 26px;
font-size: 20px;
padding: 5px;
margin: 10px;
}

@media screen and (max-width: 1546px) {
header #logo h1 div {
font-size: 20px;
height: 40px;
line-height: 40px;
}
header #logo h1 div:nth-child(2) {
line-height: 50px;
height: 50px;
font-size: 30px;
}
section.menu, footer {
margin-top: -40px;
height: 40px;
line-height: 40px;
font-size: 30px;
}
section.menu nav a, footer nav a {
padding: 0 20px;
}
footer {
margin-top: 0;
}
}

@media screen and (max-width: 1000px) {
body {
min-width: 500px;
}
header {
height: 200px;
}
header .info {
top: 12%;
}
header .info div {
font-size: 20px;
}
header #logo h1 div {
width: 200px;
}
header #logo h1 div:nth-child(2) {
width: 250px;
}
header #logo h1 div:nth-child(3) {
width: 300px;
}
section.menu, footer {
font-size: 20px;
}
section.menu nav a, footer nav a {
padding: 0 10px;
}
main section {
flex: 1 1 100%;
}
main section h2 {
font-size: 20px;
padding: 10px;
}
main section .columns .col {
flex: 1 1 50%;
}
main section .columns .col .photo div {
width: calc((100vw - 140px) / 2);
height: calc((100vw - 140px) / 2);
}
main section .columns .col .photo span {
width: calc((100vw - 140px) / 2);
}
}

@media screen and (max-width: 700px) {
main section .columns .col {
flex: 1 1 100%;
}
main section .columns .col .photo div {
width: calc((100vw - 80px));
height: calc((100vw - 80px));
}
main section .columns .col .photo span {
width: calc((100vw - 80px));
}
}

#lightbox, #lightbox * {
clear: none;
}