html {
	font-family: 'Montserrat', sans-serif;
	color:#4d4d4d; 
	font-size:12pt;
	height: 100%; 
	margin: 0px; padding: 0px; 
	background-image: url('../gfx/bg.jpg');
	background-position: top center;
	background-attachment: fixed;
	background-size: cover;
	font-weight: 500;
	}	

body {
	height: 100%; 
	margin: 0 auto; 
	padding: 0px; 
}             

#lightboxOverlay {
	width: 100%;
}

.clear-b{clear: both;}
.clear-l{clear: left;}
.clear-r{clear: right;}                 

hr {
	text-align: center; 
	width:100%; 
	background-color:#EEE; 
	height:1px; 
	border: 0px; 
	margin: 0 auto;
}

hr.small-dark {
	text-align: center; 
	background-color:#000; 
	height:3px; 
	border: 0px; 
	margin: 30px auto;
}

img {border: 1px;}
iframe {border: 0px;}

a {text-decoration: underline; color: #4d4d4d;}
a:hover.noline {text-decoration: none;}
a.noline {text-decoration: none;}
a.underline {text-decoration: underline;}
a.blank:hover {text-decoration: none;}
a.inactive {color:#C8C8C8;}

span.text-red a {color: #fa6b4f;}

h1, h2, h3, h4 {
	font-family: 'Montserrat Alternates', sans-serif;
	margin:0;
	font-weight: 600;
	line-height: 100%;
}

b {font-weight: 500;}

.spacer-200{height:200px; clear:both;}
.spacer-100{height:100px; clear:both;}
.spacer-80{height:80px; clear:both;}
.spacer-60{height:60px; clear:both;}
.spacer-50{height:50px; clear:both;}
.spacer-40{height:40px; clear:both;}
.spacer-30{height:30px; clear:both;}
.spacer-20{height:20px; clear:both;}
.spacer-15{height:15px; clear:both;}
.spacer-10{height:10px; clear:both;}
.spacer-5{height:5px; clear:both;}
.spacer-0{height:0px; clear:both;}

.fll {float:left}
.flr {float:right;}
.noborder {border: 0px;}

.text-normal {font-weight: 500;}
.text-bold {font-weight: 600;}
.text-alt {font-family: 'Montserrat Alternates', sans-serif;}

.text-center {text-align: center;}
.text-right {text-align: right;}
.text-left {text-align: left;}
.text-justify {text-align: justify;}

.text-shadow {text-shadow: 2px 2px 10px #555;}

.text-white {color:#FFF;}
.text-grey {color:darkgray;}
.text-red {color:#ffa515;}
.text-green {color:#97be3d;}
.text-orange {color:#ffa515;}


.text-6 {font-size:6pt;}
.text-8 {font-size:8pt;}
.text-10 {font-size:10pt;}
.text-11 {font-size:11pt;}
.text-12 {font-size:12pt;}
.text-13 {font-size:13pt;}
.text-14 {font-size:14pt;}
.text-16 {font-size:16pt;}
.text-18 {font-size:18pt;}                                                                          
.text-20 {font-size:20pt;}
.text-22 {font-size:22pt;}
.text-24 {font-size:24pt;}
.text-26 {font-size:26pt;}
.text-30 {font-size:30pt;}
.text-35 {font-size:35pt;}
.text-40 {font-size:40pt;}
.text-45 {font-size:45pt;}
.text-50 {font-size:50pt;}
.text-60 {font-size:60pt;}
.text-big {font-size: 6vw;}

.m0 {margin:0;}

.mt-5 {margin-top: 5px;}
.mt-7 {margin-top: 7px;}
.mt-10 {margin-top: 10px;}
.mt-15 {margin-top: 15px;}
.mt-20 {margin-top: 20px;}
.mt-30 {margin-top: 30px;}
.mt-50 {margin-top: 50px;}

.mb-5 {margin-bottom: 5px;}
.mb-10 {margin-bottom: 10px;}
.mb-20 {margin-bottom: 20px;}
.mb-25 {margin-bottom: 25px;}
.mb-30 {margin-bottom: 30px;}
.mb-40 {margin-bottom: 40px;}
.mb-60 {margin-bottom: 60px;}

.ml-5 {margin-left: 5px;}
.ml-10 {margin-left: 10px;}
.ml-15 {margin-left: 15px;}
.ml-20 {margin-left: 20px;}
.ml-25 {margin-left: 25px;}
.ml-30 {margin-left: 30px;}
.ml-50 {margin-left: 50px;}

.mr-5 {margin-right: 5px;}
.mr-10 {margin-right: 10px;}
.mr-20 {margin-right: 20px;}
.mr-25 {margin-right: 25px;}
.mr-30 {margin-right: 30px;}
.mr-50 {margin-right: 50px;}

.mauto {margin:0 auto;}

.w50 {width:50%;}
.w33 {width:33%;}
.w25 {width:25%;}

.op-50 {opacity: 0.5; filter: alpha(opacity = 30);}

.over-hide {overflow: hidden;}

.pointer {cursor: pointer;}
.table {display: table;}
.tcm {display: table-cell; vertical-align: middle;}
.tcb {display: table-cell; vertical-align: bottom;}

li {padding: 10px;}

dd {margin: 10px;}

.bg {background-color: #555;}
.bg-white {background-color: #FFF;}
.bg-yellow {background-color: #f8b601;}
.bg-orange {background-color:#f07d00;}

.round {
 	border: 0;
 	border-radius: 10px;
 	-moz-border-radius: 10px;
  	-webkit-border-radius: 10px;
}

.round-top {
	border: 0;
	border-radius: 10px 10px 0 0;
	-moz-border-radius: 10px 10px 0 0;
	-webkit-border-radius: 10px 10px 0 0;
}
  
.noround {
	border: 0;
	border-radius: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
}

.round-s {
  border: 0;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

img {
	border: 0;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.obsah-img img {
	max-width: 100%;
}

.posrel { position: relative; } 
.posabs { position: absolute; } 
.bgb {background-color: #000;}
td {vertical-align: middle;}
td.td-top {vertical-align: top; padding-top:10px;}

.cut-text { 
	text-overflow: ellipsis;
	overflow: hidden; 
	white-space: nowrap;
}

.hidden { display: none; }

.content {
	margin: auto;
	padding: 50px;
	background-color: #FFF;
	border: 0;
 	border-radius: 20px;
 	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	 
}

#header {
	width: 100%;
	display: flex; 
	align-content: center;
}

.header-logo {
	height: 217px;
}

#menu {
	width: 100%;
	height: 50px;
	border: 0;
 	border-radius: 20px;
 	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	background-color: #97be3d;
	justify-content: space-evenly;
	align-items: center;
}

#menu-mobile {
	width: 100%;
	border: 0;
 	border-radius: 20px;
 	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	background-color: #97be3d;
	justify-content: space-evenly;
	align-items: center;
	flex-flow: column wrap;
	padding: 50px 0; 
}

@supports (-ms-flow-from: thingy) { /* Edge only */

    #menu {
        justify-content: space-around;
		width: 960px;
		padding: 0 20px;
    }

}

#dulezite {
	background-color: #fa6b4f;
	padding: 30px 20px 15px 20px;
	border: 0;
 	border-radius: 20px;
 	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
}

#podpora {
	padding: 0px 20px 15px 20px;
}

#ekoskolka {
	
}


#obsah {	
	min-height: 300px;
}

.galerie-roky {
	padding: 5px;
	height: 30px;
}



/*--------------*/

@media only screen and (min-width: 1150px) {

	.desktop-only {display: flex;}
	.mobile-only {display: none;}
	.desktop-only-block {display:block;}

	#menu { display: flex; }
	#menu-mobile { display: none; }

	.content {
		width: 1000px;
		min-height: 80%;
	}

	#header {
		justify-content: flex-start;
		flex-flow: row wrap;
	}

	.header-text {
		margin: 20px 0 0 25px;
	}

	.header-kontakt {
		margin: 35px 0 0 40px;
	}

	img.logo-slunicko { width: 150px; }
	img.logo-text { width: 500px; }

	#obsah {
		width: 60%;
		float: left;
		padding: 0 0 0 40px;
	}

	#pravy-sloupec {
		width: 30%;
		float: right;
	}

	#aktuality-inc {
		padding-left: 40px;	
		width: 60%;
		float: left;
	}

	/*
	#podpora {
		width: 25%;
		float: right;
	}

	#dulezite {
		width: 25%;
		float: right;
	}
	*/

	.fotobox {
		width: 500px;
		height: 220px;
		background-color: #EEE;
		background-size: cover;
		background-position: center center;	
		border: 1px solid #C8C8C8;
	}
		
	.fotobox-text {
		width:308px;
		padding: 0 30px 0 30px;
	}
		
	.foto-box-thumb {
		width: 285px;
		height: 180px;
		background-color: rgb(248,248,248);
		background-position: center center;
		background-size: cover;
		border: 1px solid #C8C8C8;
	}
		
	.foto-box-nadpis {
		width: 245px;
		padding: 20px 20px 40px 20px;
	}

	.grid-sizer, .grid-item {
		width: 180px;
		padding:5px;
	}

}

@media only screen and (max-width: 1149px) {
	
	.desktop-only {display:none;}
	.desktop-only-block {display:none;}
	.mobile-only {display: block;}

	#menu { display: none; }
	#menu-mobile { display: flex; }

	.content {
		width: 70%;
		min-height: 80%;
	}

	#header {
		justify-content: center;
		flex-flow: column wrap;
	}

	.header-logo {
		margin: auto;
	}

	.header-text {
		text-align: center;
		padding: 20px 0 0 0;
	}

	.header-kontakt {
		margin: 50px auto 0 auto;
	}
	
	#obsah {
		width: 100%;
		float: none;
		padding: 0px 10px;
	}

	#dulezite {
		float: none;
	}

	#aktuality-inc {
		float: none	;
	}

	#podpora {
		float: none;
	}

	#obsah img {
		width: 100%;
		height: auto;
	}

	.fotobox {
		width: 500px;
		height: 220px;
		background-color: #EEE;
		background-size: cover;
		background-position: center center;	
		border: 1px solid #C8C8C8;
	}
		
	.fotobox-text {
		width:308px;
		padding: 0 30px 0 30px;
	}
		
	.foto-box-thumb {
		width: 285px;
		height: 180px;
		background-color: rgb(248,248,248);
		background-position: center center;
		background-size: cover;
		border: 1px solid #C8C8C8;
	}
		
	.foto-box-nadpis {
		width: 245px;
		padding: 20px 20px 40px 20px;
	}

	.fotky {
		display: flex;
		justify-content: center;
		flex-flow: row wrap;
	}

	.grid-sizer, .grid-item {
		width: 90%;
		padding:5px;
	}


}

@media only screen and (max-width: 800px) {



}


/* ---------------------------------- */



    
.grid:after {
    content: '';
    display: block;
    clear: both;
}

.grid-item {
    float: left;
}

.grid-item img {
    display: block;
    width: 100%;
}