*{box-sizing: border-box;margin:0;padding:0;}
*::selection{background-color:#8fbe22;color:White;}
header, main, footer, aside, article, section{display:block;}
a, img, button, input, textarea, select{border: none;outline: none;}
img, input, button{max-width:100%;}
a{text-decoration:none;}
a:hover{text-decoration:underline;}

.fullWidth{width:100%;}

body {
	color: #555;
    background: #f2f5fa;
    margin: 0;
	min-height: 100%;
    font-size: 16px;
    padding-top: 95px; 
}
body.fullBack{
    margin:0;padding:0;
    background-image:url('../../obr/404/l_404.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

header#header {
    position: absolute;
    z-index: 80;
    width: 100%;
    top: 0;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    background-color:white;
}
header#header.fixed{position: fixed; top:0;}
header#header.hidden{top:-200px;}
header#header.small{box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);}

#logo{
    padding-left: 12px;
    order:-1;
}
#logo .item{padding-top:5px}
#logo .item img{height:65px;}
header.small #logo .item img{height:40px;}

#logo-mobile{
    width: 75%;
    margin: auto;
}

#menu{
	margin: 0 auto;
    max-width: 1200px;
    width: 100%;
    display: flex;
    display: -webkit-flex;
    flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    position: relative;
}

#menu .content{
    padding: 10px 0;
    transition: 0.2s ease-in-out;
    display: flex;
    justify-content: space-between;
}

#primary-menu{
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    font-weight: 700;
    margin:5px;
    margin-top: 15px;
    display: flex;
}
header.small #primary-menu{margin-top:0;}

#primary-nav{flex-basis: 0;flex-grow: 1;}
#primary-menu li{list-style: none outside none;}
#primary-menu li a{padding:10px 15px;display: inline-block;width: 100%;color: #8fbe22;}
#primary-menu li a span{margin-right:2px;}

#secondary-nav{
    font-size: 14px;
    line-height: 21px;
    margin-top: 24px;
    order:1;
}
header.small #secondary-nav{margin-top:7px;}
#secondary-nav button, #secondary-nav input{display: inline-flex;background-color: white;cursor: pointer;}
#secondary-nav button:hover{text-decoration:underline;}
#secondary-nav input[type="text"]{cursor:text;}
#secondary-nav button{
    color: #173868;
    padding: 5px 10px;    
    box-shadow: none;
}
#hledani{display:inline-block;}
#hledani input{border-bottom:1px solid #173868;}
#hledani input:focus{border-color:#8fbe22;}
#hledani button:hover{text-decoration: none;}

.content{
	margin: 0 auto;
    max-width: 1200px;
    padding: 18px 5px;
    width: 100%;
    display: flex;
    display: -webkit-flex;
    flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    position: relative;	
}
.w3-row.content{display: block;}

.item{
    flex-basis: auto;
    flex-grow: inherit;
    max-width: 100%;
    padding: 5px;
    float:left;
    clear:none;
}
form .item{width:100%;}

main{
	background: #f2f5fa;
    display: block;	
    padding: 0 15px;
}

.box{margin-top:25px;width:100%;}
.box-title{padding: 15px 0;}
.box-content{
    background-color: white;
    padding:40px;
}
.box-content p {
    font-size: 16px;
    line-height: 1.7em;
    margin: 20px 0;
}
.box-content .w3-half{padding-right:5%;}
.bot-margin{margin-bottom:10px;padding:20px !important;}
p.box-info{
    margin: 0;
    margin-top: -10px;
    font-size: smaller;
    color: #173868;    
}
.box.bordered{
    border-bottom: 2px dashed #8fbe22;
    padding: 10px 0;
}

footer{
	background: #8fbe22;
	color:white;	
    font-size: 14px;
    margin-top:40px;
}

/* krouzky */
.subject-list{padding:0 10px;}
.subject-list .box-content{padding: 10px;}
.subject{
	background: white;
    padding: 25px;
    margin:25px 0;
}
.subject form{display:inline-block;margin-right:15px;margin-top:10px;}
.subject .item form{margin:0;padding:0;}
.subject-list .subject{border-radius: 5px 0 0 0;border-left: 10px solid #d6d6d6;} 
.subject-list:last-child .subject{border-radius: 0 5px 0 0;border-right: 10px solid #d6d6d6;border-left:none;} 
.subject-list .subject:hover{border-color: #8fbe22}
.subject .sub_what{text-align: justify;}
.sub_icon > span:first-child{padding-right: 5px;border-right:2px solid #d6d6d6;width: 30px;}
.subject:hover .sub_icon > span:first-child{padding-right: 5px;border-right:2px solid #8fbe22;}

.subject-list textarea, textarea#krAnotace{height:125px;resize: none;padding:5px;width:100%;border: 1px solid #8fbe22;}
textarea#krAnotace{height: 220px;}

/* sekce rozvrhu */ 
#schedule .subject{border-left:2px solid #8fbe22;}
#schedule .subject.nok{border-left-color:red;}

/* modal */
.w3-modal-content {background-color: #f2f5fa;}  
#modal-in{padding: 30px 25px 15px 25px;position: relative;color:#555;border-radius: 5px 5px 0 0;}
#modal form .w3-half{padding:10px;}
#modal-in form .item{text-align: center;}
.item.activation input{width:75px !important;text-align:center;}   /* vyjimka pro aktivaci uctu */
#modal-in form label, #pozadavek form label{min-width: 120px;display: inline-block;background: #8fbe22;padding: 10px 10px 11px 10px;color: white;border-radius: 5px 0 0 0;}
#modal-in form input, #pozadavek form input{width:70%;padding:10px 5px;border-bottom: 1px solid #9E9E9E;}
#modal-in form select{padding: 10px 5px;}
#modal-in form input:valid{border-bottom-color:#8fbe22}
#modal-in input[type="submit"]{
    background-color: #8fbe22;
    padding: 11px 40px;
    color: white;
    font-weight: bolder;
    margin: 10px;
}
#modal-in a{text-decoration: underline; color:#8fbe22;}
#modal-close{
    height: 25px;
    width: 100%;
    position: absolute;
    top: 0; left: 0;
    background-color: #8fbe22;
    border-radius: 5px 5px 0 0;
}
#modal-close span{font-weight: bolder;
    position: absolute;
    right: 0;top: 0;
    cursor:pointer;
    color: White;
    font-size: 1.2rem;
    padding: 0 15px;
    background: none;
}
#modal-err{color: red;font-weight: bolder;text-align: center;min-height:21px;}
.w3-modal{z-index: 99; padding: 1% 0;}
#zapomenute-heslo {color: black !important;}
#zcu_login{width:20px;}
.slider img{margin:auto;}

/* 404 box */
.not-found{
    -webkit-box-flex: 0;
    -ms-flex: 0 1 580px;
    flex: 0 1 580px;
    width: 580px;
    max-width: 580px;
    margin:2%;
}
.not-found .box-title{
    padding: 25px 0 25px 20px;
    background-color: #8BC34A;
    font-size: 2rem;
    color: white;
    font-weight: bolder;
}
.not-found .box-content{padding:20px;}
.not-found .box-content a{text-decoration: underline; color:#8fbe22;font-weight: bold;}
.not-found .box-content a:hover{color:#173868}

/* tlacitka a dalsi formularove prvky*/ 
button, input[type="submit"], .mail{
	position: relative;
    background-color: #8fbe22;
    box-shadow: 0 2px #3d5504;
    padding: 5px;
    font-weight: normal;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    outline: none;
}

button.red{background-color:red;color:white;}

.mail{display:block;}
main button:hover, input[type="submit"]:hover, .mail:hover{top:2px;box-shadow: 0 1px #3d5504;text-decoration:none;}
main button:active, input[type="submit"]:active, .mail:active{top:4px;box-shadow: 0 0 #3d5504;}
main button:disabled, input[type="submit"]:disabled{
    background-color: #9E9E9E;
    box-shadow: 0 2px #607D8B;
    position: static;
}
form label{background: #8fbe22;padding: 5px 0 6px 5px;color:white;border-radius:5px 0 0 0;}
form input, select{
    border-bottom: 1px solid #8fbe22;
    padding: 5px;
}
input[type="time"],input[type="date"]{padding-bottom: 3px;}
div#sprava input[type="number"], select[name="denKonani"]{padding-bottom: 4px;}

/* infobubliny */
section.indexInfo{padding:10px;}
section.indexInfo .item{    
    width: 100%;
    background-color: #8fbe22;
    color: white;
    font-size: 1.5rem;
    text-align: center;
    padding: 45px 0;
}

/* tlacitka zalozek */
.w3-bar > button{
    border-bottom: 2px solid #8099c3 !important;
    border-radius: 0;
    box-shadow: none;
    background: none;
    color: #2c4a76;
    position: static;
    margin: 0 5px;
} 
.w3-bar > button:hover, .w3-bar > button.active{border-color:#8fbe22 !important;}

/* sprava webu */
#kontakty, #uzivatele, #logy, #krouzky, #dochazka, #prehled, #sprava{background-color:white;padding:25px;}
#kontakty .w3-half{padding-right:25px;}
.w3-col .item label{min-width: 80px; display: block;float:left;}
.w3-col .item input{width: 50%;float:left;}
#sprKrouzek .w3-col .item input{width: 70%;}
form.search .item{text-align: center;}
form.search .item input, form.search .item select{width:90%;float:none;}
.denniAkce{
    padding: 5px 0; 
    margin: 10px 0;
    border-bottom: 2px solid #8fbe22;
}
.akce .w3-row.akceUser{
    border-bottom: 1px solid rgba(143, 190, 34, 0.7);
    padding: 5px 0;
}
.space{margin:5px 0;}

/*prehled krouzku */
#summary .subject{
    padding: 0 0 5px 0;
    border-bottom: 2px solid #8fbe22;
}
#summary .subject .ok{background-color:rgba(143, 190, 34, 0.3);}
#summary .subject .nok{background-color:rgba(255, 0, 0, 0.3);}
/* mobilni menu */
.mobile-icon{
    color: #173868;
    font-size: 18px;
    text-transform: uppercase;
    padding-right: 12px;
    cursor: pointer;
}
#overlay{
    position: fixed;
    top: 0;
    left: 0;       
}
#overlay.show, .w3-modal{
    width: 100%;
    height: 100%; 
    background: #00000080;    
    z-index: 99;
}
#mobile-nav{
    padding-top: 15px;
    width: 320px;
    height: 100%;
    position: fixed;
    left: -350px;
    background-color: #fff;
    background-image: url('../../obr/loga/logo_mobile.png');
    background-repeat: no-repeat;
    background-position-y: bottom;
    top: 0;
    z-index: 9999;
    transition: 0.25s all ease;
}
#overlay.show #mobile-nav{left:0;}
#mobile-secondary{margin-top: 20px;}
#mobile-primary li, #mobile-secondary li{display: block;position: relative;}
#mobile-primary li:hover{background-color:#8fbe22;}
#mobile-primary li:hover a{color:white;}
#mobile-secondary li:hover button{text-decoration: underline;}
#mobile-primary li a{
    padding: 7px 25px;
    font-size: 19px;
    width: 100%;
    display: block;
    color: #8fbe22;
    text-transform: uppercase;
}
#mobile-secondary li button{
    padding: 7px 25px;
    font-size: 16px;
    width:100%;
    text-align:left;
    background-color:transparent;
    border:none;
    color: #173868;
    cursor: pointer;
    box-shadow: none;
}

/* hlaseni zprav a chyb */ 
.message{padding-left:10px;letter-spacing: .1rem;margin: 5px 0;}
.message.zprava{    
	background: rgba(3, 169, 244, .7);
    border: 2px solid rgba(3, 169, 244, .8);
    color: white;
    font-weight: bolder;
    border-radius: 5px;}
.message.chyba{
	background: rgba(255, 0, 0, 0.7);
    border: 2px solid rgba(255, 0, 0, 0.8);
    color: white;
    font-weight: bolder;
    border-radius: 5px;
}

/* Typo */
body{font-family: 'Open Sans', sans-serif;}
h1, h2, h3, #primary-nav, #secondary-nav, #mobile-primary, #mobile-secondary a {
    font-family: 'Roboto Condensed', sans-serif;
}
h1, h2, h3{color: #8099b4; text-transform: uppercase;}
h1{
    font-size: 40px;
    font-weight: 100;
    line-height: 52px;
    margin: 0;
    padding: 0 0 5px 0;    
}
footer h2{color:white;font-weight:bolder;margin:0;}
footer .content:first-child .item{min-width:250px;}

.red{color:red;}
.green{color:#8fbe22;}
.strong{font-weight:bolder;}

.flex-loga{
    display: flex;
    justify-content: space-around;
    align-items: center;
}

/* dopsane respo */
.w3-padding-top{padding-top:15px;}
.margin-bot-5px{margin-bottom:5px;border-bottom:1px solid #8fbe22;}
.w3-padding-right-10{padding-right:10px;}
@media (max-width:600px){
    .w3-show-small{
        display:inline!important;
    }
    /*
    #logo {
        -ms-flex: 0 1 50px;
        flex: 0 1 50px; 
        width: 50px; 
        max-width: 50px;
    }*/
    body.page404{background-image:url('../../obr/404/s_404.jpg');}
    header.small #secondary-nav {margin-top: 14px;}
}
@media (min-width:993px){
    .w3-show-large{
        display:inline!important;
    }
}

@media (max-width:992px){
    .w3-show-medium{
        display:inline!important;
    }
    footer .w3-col{display: flex;justify-content: center;}
    body.page404{background-image:url('../../obr/404/m_404.jpg');}
}