.zelena { color: #8dc63f; /*font-weight: bold;*/}
.oranzova { color: #f15a22; /*font-weight: bold;*/ }
.zluta { color: #fcb32b; /*font-weight: bold;*/ }


body { 
	background: url(img/blackboard.png);
	color: #fff;
	/*font-family: 'Open Sans Condensed', sans-serif;*/
	font-family: 'Shadows Into Light Two', cursive;
	font-size: 1.5rem;
	letter-spacing: 1px;
}
a {/*color: #8dc63f;*/ color: #fbb034;}
a:hover {color: #ea5822;}
input, textarea, option, select {font-family: 'Open Sans Condensed', sans-serif; font-size: 1.5rem;}
.form-control, .form-select { font-weight: bold;}
.form-label {    
	text-transform: uppercase;
    font-size: 0.7em;
    color: #fcb32b;
    margin-bottom: 3px;
    padding-left: 7px;
}
.form-check-label {    
	text-transform: uppercase;
    font-size: 0.7em;
    color: #fcb32b;
}
.form-check-input:checked {
    background-color: #f15a22;
    border-color: #f15a22;
}

.video100 {
  width: 100%;
  height: auto;
}

/*
#uvod { 
	margin: 30px;
	padding: 30px; 
	text-align: center; 
	border: 3px solid #fff;
	background: url(img/pozadi-drevo-sm.jpg) repeat-x;
	height: 605px; overflow: hidden;
	position: relative;
}
*/

#foodTop1 {position: absolute; top: 0; left: 10%; z-index: 10; animation: fadeInAnimation ease 1s; animation-iteration-count: 1; animation-fill-mode: forwards;}
#foodTop2 {position: absolute; top: 0; left: 60%; z-index: 10; animation: fadeInAnimation ease 3s; animation-iteration-count: 1; animation-fill-mode: forwards;}
#foodLeft1 {position: absolute; left: 0; top: 30%; z-index: 10; animation: fadeInAnimation ease 5s; animation-iteration-count: 1; animation-fill-mode: forwards;}
#foodLeft2 {position: absolute; left: 0; top: 60%; z-index: 10; animation: fadeInAnimation ease 9s; animation-iteration-count: 1; animation-fill-mode: forwards;}
#foodRight1 {position: absolute; right: 0; top: 50%; z-index: 10; animation: fadeInAnimation ease 7s; animation-iteration-count: 1; animation-fill-mode: forwards;}

@keyframes fadeInAnimation {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

#obsah {z-index: 20; position: relative;}

.datum {font-size: 3rem;}
.seda {color: #919191;}
.mensi {font-size: 1.1rem;}
.form-control {font-size: 1.2rem;}
.markerWhite {background: #fff; color: #000; padding-left: 10px; padding-right: 10px;}

.rocnik {position: relative;}
.stitek {position: absolute; top: 0; right: 0; padding: 10px 20px; background: #f15a22; font-size: 1rem;}

.btn-primary {
    color: #000;
    background-color: #8dc63f;
    border-color: #8dc63f;
    font-weight: bold;
    /*text-transform: uppercase;*/
    letter-spacing: 2px;
    border-radius: 0;
}
.btn-primary:hover {
    color: #000;
    background-color: #73c304;
    border-color: #73c304;
}

.btn-secondary {
    color: #000;
    background-color: #fcb32b;
    border-color: #fcb32b;
    font-weight: bold;
    /*text-transform: uppercase;*/
    letter-spacing: 2px;
    border-radius: 0;
}
.btn-secondary:hover {
    color: #000;
    background-color: #f9a912;
    border-color: #f9a912;
}

.btn-dark {
    color: #fff;
    background-color: #111;
    border-color: #111;
    font-weight: bold;
    /*text-transform: uppercase;*/
    letter-spacing: 2px;
    border-radius: 0;
}
.btn-dark:hover {
    color: #fff;
    background-color: #000;
    border-color: #000;
}


#navigace .nav-link {background-color: rgba(0,0,0,0.5); color: #fff; padding-bottom: 2rem; font-size: 1.2rem; white-space: nowrap;}
#navigace .nav-link:hover {background-color: #f15a22; color: #000;}
#navigace .nav-link.active, #navigace .nav-link.active:hover {background-color: #000; color: #fff;}

@media (max-height: 990px) { 
	#foodLeft1 {display: none;}
}
@media (max-width: 900px) { 
	#foodLeft1 {display: none;}
}
@media (max-width: 600px) { 
	#foodTop1 {display: none;}
	#foodTop2 {left: -15%; top: -7%;}
	#foodLeft2 {display: none;}
	#foodRight1 {display: none;}
	#logo {text-align: right; margin-right: 0; margin-left: auto;}
	.rocnik .datum {font-size: 1.5rem;}
}