/*
Theme Name: VZS
Theme URI: http: //www.vzs.cz/
Description: Theme for VZS
Author: Jakub Mottl
Version: 2.0 
Tags: red, blue, white
*/

@import url(css/bootstrap-theme.min.css);
@import url(css/bootstrap.min.css);

.c {*zoom: 1;}
.c:before, .c:after {content: ""; display: table;}
.c:after {clear: both;}

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

html {font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%}
body {margin: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {display: block;}
audio, canvas, progress, video {display: inline-block; vertical-align: baseline;}
[hidden], template {display: none;}
a {background-color: transparent;}
a:active, a:hover {outline: 0;}
abbr[title] {border-bottom: 1px dotted;}
b, strong {font-weight: bold;}
dfn {font-style: italic;}
h1 {font-size: 2em; margin: .67em 0;}
mark {background: #ff0; color: #000;}
small {font-size: 80%}
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
img {border: 0;}
figure {margin: 1em 40px;}
hr {box-sizing: content-box; height: 0;}
pre {overflow: auto;}
code, kbd, pre, samp {font-family: monospace, monospace; font-size: 1em;}
button, input, optgroup, select, textarea {color: inherit; font: inherit; margin: 0;}
button {overflow: visible;}
button, select {text-transform: none;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance: button; cursor: pointer;}
button[disabled], html input[disabled] {cursor: default;}
input {line-height: normal;}
input[type="checkbox"], input[type="radio"] {box-sizing: border-box; padding: 0;}
input[type="search"] {-webkit-appearance: textfield; box-sizing: content-box;}
fieldset {border: 1px solid #c0c0c0; margin: 0 2px; padding: .35em .625em .75em;}
legend {border: 0; padding: 0;}
textarea {overflow: auto;}
optgroup {font-weight: bold;}
table {border-collapse: collapse; border-spacing: 0;}
td, th {padding: 0;}
html {min-height: 100%; position: relative;}
img {border: 0 none; vertical-align: middle; max-width: 100%; height: auto;}
input, select {outline: none;}
input[type=submit], button {cursor: pointer;}
body, ul, ol, p, h1, h2, h3, h4, h5, h6, input, select, form {margin: 0; padding: 0;}
h1, h2, h3, h4, h5, h6 {font-weight: bold;}
ul {list-style-type: none;}
a {text-decoration: underline; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;}
a, a:visited, a:link, a:focus {outline: none; color: #c21e1d;}
a:hover, a:visited:hover, a:link:hover, a:focus:hover {text-decoration: none; color: #16377c;}
p {padding: 0; margin: 20px 0; font-size: 14px; line-height: 24px;}

/*Main CSS*/
body {font-family: 'Open Sans', Arial, sans-serif; font-size: 14px; font-weight: normal; color: #05173c; min-height: 100%; overflow-x: hidden; background-color: #fff;}
h1+h2, h1+h3, h1+h4, h1+article h2 {margin-top: 0 !important;}
.wrap {max-width: 900px; margin: 0 auto; position: relative; *zoom: 1;}
.wrap:before, .wrap:after {content: ""; display: table;}
.wrap:after {clear: both;}
@media all and (min-width: 768px) and (max-width: 901px), all and (max-width: 767px) {
	.wrap {padding-left: 3% !important; padding-right: 3% !important;}
}
@media all and (min-width: 1300px) {
	.wrap {max-width: 65%}
}
iframe {border-width: 0; width: 100% !important;}
.button {text-decoration: none; height: 50px; line-height: 50px; padding: 0 20px; display: inline-block; font-size: 14px; color: #fff !important; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; background-color: #c21e1d; font-weight: bold;}
.button .fa {margin-left: 6px; color: #f9b435;}
.button:hover {color: #fff; background-color: #16377c;}
.button.dark {background-color: #000; color: #fff !important;}
.button.dark:hover {background-color: #fff; color: #000 !important;}
.button.button-large {font-size: 24px; height: 78px; line-height: 78px; width: 600px;}
@media all and (max-width: 767px) {
	.button.button-large {width: 100%}
}
.content {background: #fff center top no-repeat; position: relative;}
.cpage {*zoom: 1; margin-top: 114px; background-color: #fff; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; padding-bottom: 30px;}
.cpage:before, .cpage:after {content: ""; display: table;}
.cpage:after {clear: both;}
.main {float: right; width: 68.89%; -webkit-border-radius: 0 8px 8px 8px; -moz-border-radius: 0 8px 8px 8px; -ms-border-radius: 0 8px 8px 8px; -o-border-radius: 0 8px 8px 8px; border-radius: 0 8px 8px 8px; overflow: hidden;}
@media all and (max-width: 767px) {
	.main {float: none; width: 100%; margin-bottom: 20px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px;}
}
.main-inner {padding-left: 6.45%; padding-right: 6.45%; background-color: #fff; padding-top: 25px; padding-bottom: 30px;}
@media all and (max-width: 767px) {
	.main-inner {padding-left: 3%; padding-right: 3%}
}
.main h1+h2, .main h1+h3, .main h1+p {margin-top: 0;}
.main h1 {line-height: 36px; font-size: 28px; color: #c21e1d;}
.main h1:after {content: ""; display: block; width: 10em; height: 1em; margin-top: 0.6ex; border-top: 1px solid #b0b0b0; padding-top: 1px; border-image: radial-gradient(#b0b0b0, #f4f4f4) 1;
	background: radial-gradient(farthest-corner at center top, #efefef 0%, white 60%); background-clip: content-box;}
.main h2 {line-height: 28px; margin-bottom: 20px; margin-top: 40px; font-size: 22px;}
.main h3, .main h4, .main h5 {line-height: 24px; margin-bottom: 20px; margin-top: 40px; font-size: 18px;}
.main ul {margin: 20px 0;}
.main ul>li {position: relative; padding-left: 20px; margin-bottom: 10px; line-height: 24px;}
.main ul>li:before {font-size: 30px; font-weight: 900; content: '▸'; color: #c21e1d; position: absolute; left: -3px; top: -2px;}
.main ol {list-style-type: none;}
.main ol>li {counter-increment: item; margin-bottom: 10px; line-height: 24px; padding-left: 24px; position: relative;}
.main ol>li:before {content: counter(item) "."; color: #c21e1d; font-size: 20px; font-weight: 800; position: absolute; left: 0; top: -3px;}
.main table {margin: 30px 0; width: 100% !important; border-collapse: collapse;}
.main table tr:nth-child(2n+2) {background-color: #f9f9f9;}
.main table tr th {text-align: left; color: #c21e1d; font-weight: bold; padding: 6px; border: 1px solid #eee;}
.main table tr td {padding: 6px; border: 1px solid #eee;}
.main img.alignleft {float: left; margin: 20px 20px 20px 0;}
.main img.alignright {float: right; margin: 20px 0 20px 20px;}
.main img.aligncenter {display: block; margin: 20px auto;}
.main img.alignnone {float: none;}
.main img.size-large {box-shadow: 0 5px 10px #aaa;}
.main .news-list>li:hover .title {color: #16377c;}
.main .news-list>li .title {color: #c21e1d;}
.main .news-list>li .title:hover {color: #16377c;}
.main .news-list>li .perex {color: #05173c;}
.sidebar {float: left; width: 31.11%}
@media all and (max-width: 767px) {
	.sidebar {float: none; width: 100%}
}
.breadcrumbs {background-color: #eee; padding: 10px 20px 10px 40px; font-size: 12px; color: #5a5959;}
@media all and (max-width: 767px) {
	.breadcrumbs {padding-left: 3%; padding-right: 3%}
}
.breadcrumbs a {color: #5a5959;}

.sidemenu, .topmenu {background-color: #c21e1d; color: #fff;}

.topmenu {text-align: left; display: none; position: fixed; top: 0; left: 0; width: 100%; max-height: 100%; z-index: 5; overflow: auto;}
.topmenu .menu, .topmenu #menu-button {overflow: hidden;}
.topmenu .menu {display: none;}
.topmenu .menu.responsive {display: block;}

#menu-button:before {content: '☰'; margin-right: 1ex;}
#menu-button.responsive:before {content: '✖';}

.sidemenu {color: #fff; padding: 20px; -webkit-border-radius: 8px 0 0 0; -moz-border-radius: 8px 0 0 0; -ms-border-radius: 8px 0 0 0; -o-border-radius: 8px 0 0 0; border-radius: 8px 0 0 0; border-bottom: 7px solid #f9b435;}
.menu>li {border-top: 1px solid #b0b0b0; border-image: linear-gradient(to right, #b91b1a, #a11110, #b91b1a, #c21e1d) 1;}
.menu>li>.sub-menu {display: none; background-color: #b41c1b; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px;}
.menu>li>.sub-menu>li.current-menu-item>a {color: #f9b435;}
ul.menu>li>.sub-menu>li>a {font-size: 13px; color: #fff; text-decoration: none; display: block; padding: 4px 20px;}
.menu li.current-menu-item>a, .menu li.current-menu-ancestor>a, .menu li.current-page-ancestor>a {color: #f9b435;}
.menu li.current-menu-item.menu-item-has-children>.sub-menu, .menu li.current-menu-ancestor.menu-item-has-children>.sub-menu {display: block;}
.menu li.menu-item-has-children>a:after { content: '▼'; float: right;}
.menu li.menu-item-has-children.current-menu-item>a:after, .menu li.menu-item-has-children.current-menu-ancestor>a:after { content: '▲'}
.sidemenu>ul>li:first-child>a {background: none;}
.sidemenu>ul>li:first-child>a, .sidemenu>ul>li:first-child {border: none;}

.menu>li>a, .topmenu>ul>li>a {display: block; height: 40px; line-height: 42px; color: #fff; text-decoration: none; font-weight: 600; font-size: 17px; padding: 0 20px; position: relative;
	border-top: 1px solid #c21e1d; border-image: linear-gradient(to right, #cb2524, #df3332, #cb2524, #c21e1d) 1; background: radial-gradient(farthest-corner at 30% top, rgba(0,0,0,0.07) 0%, rgba(0,0,0,0.0) 40%);}

@media all and (max-width: 767px) {
	.topmenu {display: block;}
	.header {margin-top: 40px;}
	.sidemenu {display: none;}
	.news {border-radius: 8px !important;}
}
@media all and (min-width: 768px) and (max-width: 901px) {
	.sidemenu>ul>li>a {font-size: 14px;}
}
ul.menu li>a:hover {color: #f9b435 !important;}

.menu>li.image {background-position: 20px center; background-repeat: no-repeat;}
.menu>li.image>a {padding-left: 50px;}

.menu>li.member {background-image: url(extras/zralok.svg)}
.menu>li.photo {background-image: url(extras/image.svg)}

li.widget {list-style-type: none; margin-bottom: 1em;}

.news {background-color: #16377c; color: #fff; padding: 20px; -webkit-border-radius: 0 0 8px 8px; -moz-border-radius: 0 0 8px 8px; -ms-border-radius: 0 0 8px 8px; -o-border-radius: 0 0 8px 8px; border-radius: 0 0 8px 8px; position: relative;}
.news h3 {font-size: 18px; color: #fff; line-height: 24px; margin-bottom: 20px;}
.news h3 .fa {color: #f9b435; margin-right: 6px;}
.news a {color: #f9b435;}
.news a:hover {color: #fff;}
.news-list>li {margin-bottom: 30px;}
.news-list>li a {text-decoration: none;}
.news-list>li a:hover .title {color: #fff;}
.news-list>li .title {display: block; color: #f9b435; font-size: 14px; line-height: 18px; text-decoration: underline;}
.news-list>li .perex {display: block; padding-top: 4px; font-size: 13px; line-height: 18px; color: #fff;}
.banner {display: block; margin: 46px 0 32px 0;}
.cols {padding: 20px 0; *zoom: 1;}
.cols:before, .cols:after {content: ""; display: table;}
.cols:after {clear: both;}
.cols .col {float: left; margin-right: 2%}
@media all and (max-width: 500px) {
	.cols .col {margin-right: 0 !important; float: none !important; width: 100% !important;}
}
.cols .col h4 {margin-top: 0; color: #c21e1d;}
.cols.cols-3 .col {width: 32%}
.cols.cols-3 .col:nth-child(3n+3) {margin-right: 0;}
.cols.cols-2 .col {width: 49%}
.cols.cols-2 .col:nth-child(2n+2) {margin-right: 0;}
.small {font-size: 11px; line-height: 14px;}
.border-bottom {border-bottom: 1px solid #eee;}
.files {font-size: 12px; line-height: 18px;}
.header {background-image: none; border-bottom: 6px solid #c21e1d; text-align: right; top: 0;}

.line.white {border-top: 10px solid #16377c; background-color: white;}
.line.blue {border-bottom: 7px solid #f9b435; background-color: #16377c;}
.line.red {border-bottom: 6px solid #f9b435; background-color: #c21e1d; height: 13px; position: absolute; width: 100%; z-index: 0;}

.header>.wrap {min-height: 93px;}
.header .logo {position: absolute; left: 0; top: 0; width: 176px; padding: 20px; border-radius: 50%; background-color: white; height: 176px; display: block; z-index: 3;}
.header .logo img {width: 100%}
@media all and (max-width: 550px) {
	.header .logo {right: 0; padding: 10px; margin-left: auto; margin-right: auto; width: 100px; height: 100px; top: 65px;}
}
.header .supertitle {font-size: 40px; color: #c21e1d; font-family: "Arial Black", Arial, sans-serif; font-weight: 900; margin-top: 8px;}
.header .subtitle {font-size: 30px; color: white; font-family: "Arial Black", Arial, sans-serif; font-weight: 900;}
@media all and (max-width: 800px) {
	.header .supertitle {font-size: 24px;}
 	.header .subtitle {font-size: 18px;}
}
@media all and (max-width: 550px) {
	.header {text-align: center;}
}
@media all and (max-width: 450px) {
	.header .supertitle {font-size: 18px;}
 	.header .subtitle {font-size: 14px;}
}
.footer {background-color: #16377c; color: #fff; font-size: 13px;}
@media all and (max-width: 500px) {
	.footer {text-align: center;}
}
.footer a {color: #f9b435; text-decoration: underline;}
.footer a:hover {color: #fff;}
.footer-left {float: left; max-width: 210px;}
@media all and (max-width: 500px) {
	.footer-left {float: none; max-width: 100%}
}
.footer-right {float: right;}
@media all and (max-width: 500px) {
	.footer-right {float: none;}
}
.footer .wrap {padding: 30px 0;}

/*body > footer ~ div {display: none}*/
/*body > div#wpadminbar {display: block}*/