/*.banner{width: 960px; height: 155px; background: url('http://masmohelnicko.cz/banner.jpg') white no-repeat; margin: auto;} */

html {
    -webkit-text-size-adjust: 100%; /* Pro Chrome, Safari, Operu */
    -moz-text-size-adjust: 100%;    /* Pro starší verze Firefoxu */
    text-size-adjust: 100%;         /* Standardní vlastnost */
}

form {width: 100% !important; text-align: center; margin: auto; padding: 0;}


/* ========================== Menu z http://www.cssplay.co.uk/menus/final_drop.html */

.menu {position: absolute; top: 80px; right: 20px; height:50px; z-index: 100; max-width: 80%; margin-left: 250px;} /* Základní menu */
.menu ul {padding:0; margin:0; list-style-type: none;} /* Odstranění všech stylů seznamu */
.menu li {vertical-align: middle; float:left; width:auto; position:relative; margin: 0px 0px 0px 0px; padding:0;} /* Horizontální menu + relative position pro kontrolu drop-down menu */


/* ============= MENU LEVEL 1 - HLAVNÍ MENU ============= */
.menu > ul > li a, .menu > ul > li > a:visited, .menu > ul > li > a:link,.menu > ul > li > a:active {background: none; display:block;font-size:15px; text-align: center; font-family: museo700regular; text-decoration:none; 
color:#222; width:auto; height:32px; line-height:29px; font-weight: normal; padding: 12px 12px 4px 12px;
-moz-border-radius: 0px; -webkit-border-radius: 0px; -khtml-border-radius: 0px; border-radius: 0px;
    -webkit-transition: background 0.5s linear;
    -moz-transition: background 0.5s linear;
    -ms-transition: background 0.5s linear;
    -o-transition: background 0.5s   linear;
    transition: background 0.5s linear;     /* určuje za jak dlouho efekt hover zmizí */   
    
}
.menu > ul > li a:hover{color:#000; background-color:rgba(255, 255, 255, 0.7);
    -webkit-transition: background 0s linear;
    -moz-transition: background 0s linear;
    -ms-transition: background 0s linear;
    -o-transition: background 0s linear;
    transition: background 0s linear;   /* určuje jak dlouho efekt hover nabíhá */
    }
    
.current > a, .current > a:link, .current > a:active, .current > a:visited{color: black !important; background: none !important; border-bottom: 2px solid #D0523D;}
.section > a {background: none !important; border-bottom: 2px solid #D0523D;} /* svítící MENU LEVEL 1 při aktivním MENU LEVEL 2  */     
.current > a:hover {color:#000; background-color:rgba(255, 255, 255, 0.7) !important;}    
    
/* ============= MENU LEVEL 2 ============= */

.menu > ul > li > ul > li > a, .menu > ul > li > ul > li > a:visited, .menu > ul > li > ul > li > a:link,.menu > ul > li > ul > li > a:active {
background-color:rgba(255, 255, 255, 0.9); display:block;font-size:15px; text-align: left; font-family: museo700regular; text-decoration:none; 
color:#222; width: 250px; height:auto; line-height:1.0; font-weight: normal; padding:10px 10px;
-moz-border-radius: 0px; -webkit-border-radius: 0px; -khtml-border-radius: 0px; border-radius: 0px;  
-webkit-transition: background 0.1s linear;
-moz-transition: background 0.1s linear;
-ms-transition: background 0.1s linear;
-o-transition: background 0.1s linear;
transition: background 0.1s linear;   /* určuje za jak dlouho efekt hover zmizí */
}
.menu > ul > li > ul > li a:hover {color:#000; background-color:rgba(255, 238, 235, 0.9);
-webkit-transition: background 0s linear;
-moz-transition: background 0s linear;
-ms-transition: background 0s linear;
-o-transition: background 0s linear;
transition: background 0s linear;   /* určuje jak dlouho efekt hover nabíhá */
}    


.section > ul > li .current {color: white !important; background: #D0523D !important} /* Aktivní MENU LEVEL 2 */


.secondary > ul > .link > ul {display: none;}




/* efekt pro zobrazení / skrytí MENU LEVEL 2 */
.menu ul ul {position:absolute; height:0px; top:45px; left:0; width:149px; visibility: hidden; 
opacity:0;
transition: opacity 0.2s linear;
-webkit-transition: opacity 0.2s linear;
-moz-transition: opacity 0.2s linear;
-ms-transition: opacity 0.2s linear;
-o-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
}
.menu ul li:hover ul{opacity: 1;
visibility: visible;     
}                                         



/* SCHOVÁNO MENU LEVEL 2 pro 2. sekci - projekty */
.menu ul li:nth-child(2) ul  {display: none;}


.mobile-menu{display: none;}
.up_text {display: none}

/* ============= MENU LEVEL 3 ============= */

.menu > ul > li > ul > li > ul > li > a, .menu > ul > li > ul > li > ul > li > a:visited, .menu > ul > li > ul > li > ul > li > a:link,.menu > ul > li > ul > li > ul > li > a:active {
background-color:rgba(255, 255, 255, 0.7); display:block;font-size:15px; text-align: left; font-family: museo700regular; text-decoration:none; 
color:#222; width: 250px; height:auto; line-height:1.0; font-weight: normal; padding:10px 10px;
-moz-border-radius: 0px; -webkit-border-radius: 0px; -khtml-border-radius: 0px; border-radius: 0px;  
-webkit-transition: background 0.1s linear;
-moz-transition: background 0.1s linear;
-ms-transition: background 0.1s linear;
-o-transition: background 0.1s linear;
transition: background 0.1s linear;   /* určuje za jak dlouho efekt hover zmizí */
}
.menu > ul > li > ul > li > ul > li a:hover {color:#000; background-color:rgba(255, 238, 235, 0.7);
-webkit-transition: background 0s linear;
-moz-transition: background 0s linear;
-ms-transition: background 0s linear;
-o-transition: background 0s linear;
transition: background 0s linear;   /* určuje jak dlouho efekt hover nabíhá */
}    

.menu > ul > li > ul > li .section {color: white !important; background: #D0523D !important} /* svítící MENU LEVEL 1 při aktivním MENU LEVEL 3  */


/* efekt pro zobrazení / skrytí MENU LEVEL 3 */
.menu ul :hover ul ul {position:absolute; height:0px; top:0px; left:270px; width:149px; visibility: hidden; display: none;
opacity:0;
transition: opacity 0.2s linear;
-webkit-transition: opacity 0.2s linear;
-moz-transition: opacity 0.2s linear;
-ms-transition: opacity 0.2s linear;
-o-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
}
.menu ul :hover ul :hover ul
{opacity: 1;
visibility: visible;
}


/* hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {width:150px;w\idth:128px;}
* html .menu ul ul {top:30px;t\op:31px;}
* html .menu {width:960px; w\idth:1105px;} /* hack to correct IE5.5 faulty box model */
* html .menu a, * html .menu a:visited {width:149px; w\idth:138px;} /* a hack so that IE5.5 faulty box model is corrected */
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;;} /* style the table so that it takes no ppart in the layout - required for IE to work */



/* MAIN LAYOUT */


.white-flash {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 1px solid red;
  background: white;
  opacity: 0;
  pointer-events: none;
  z-index: 999;
  transition: opacity 0.1s ease;
}

.white-flash.target {
  opacity: 1;
}


body {
    margin: 0;
    background: #EDEEED   ;    
    font-size: 15px; /* This overrides the browsers default font size */
    line-height: 1.6; /* If you change the font-size make sure you change the line-height value as well - the usual ratio is around 1.5 (font-size x 1.5 = line-height) */
    color: black;
    font-family: sans-serif, Arial, Helvetica;
    -webkit-text-size-adjust: none; /* The text size is not adjusted for Safari on iPhone */
    
    opacity: 0;
    animation: fadeIn 0.5s forwards;

}
  body a { text-decoration: underline; color: black; transition-duration: 0.5s;} /* this removes the underline from all links */
  body a:link { -webkit-tap-highlight-color: black } /* this sets the highlight color when links are tapped on Safari (browser) on iPhone */



/* Animation for the fade-in effect */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}




	.ie7 body,
	.ie8 body {
	    min-width: 860px; /* media queries are not supported in ie7/8 without a polyfill */
	}
  
  
/* HEADER */
.header {
    width: 100%;
    
    height: 400px;
    
                                                                  
    background: url(../images/header_cr.jpg) center 45% repeat-x;
    background-size: 100%;
}



.header-text{
color: white; font-size: 25px; font-weight: bold;   font-style: italic; position: absolute; text-align: right; width: 50%; right: 2%; top: 150px; text-shadow: 3px 3px 10px black;
display: none;
}

.header-in{
    max-width: 1400px;
    width: 100%;
    position: relative;
    margin: auto;
}



.header .mikroregion{
position: absolute; right: 25px; top: 30px;
}

.header .mikroregion a{
color: white; padding: 10px; background: #D0523D; border-radius: 5px; text-decoration: none;
}

.header .mikroregion a:hover{
background: black;
}

	/* Brand */
	header .brand, header .brand:hover {
	position: absolute;
      top: 0;
      left: 2%;
      width: 250px;
      height: 200px;
      
	}
		.brand .nadpis{display: none;}
		.brand p {display: none;}
        
.content h1{
width: 100%;
height: 45px;
padding-top: 17px;
color: white;
font-size: 27px !important;
text-align:center;
/* border: 1px solid blue;*/
position: absolute;
left: 0px; 
top: 400px;
z-index: -5;
background: url(../images/header_nadpis.jpg) center center repeat;
}

header .subtitle{
position: absolute; 
top: 500px;
right: 20px;
width: 300px;
height: 50px;
color: black;
background-color:rgba(255, 255, 255, 0.7);
font-size: 20px;

}


/* MIXED */
header:after,
.main:after,
#Root:after,
.search-bar:after,
header .inner:after,
footer:after { /* clearfix */
    height: 0;
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
}
.search-bar form input.action,
.header .primary li a,
/*.footer a { /* adds color transition when links/inputs on hover */
    -moz-transition: color 0.5s;
    -webkit-transition: color 0.5s;
    transition: color 0.5s;
    */
}
/*.footer a.brand { color: #333; margin-left: 0; }
.footer a.brand:hover { color: #B80000; }*/
body h1 span.amp {
    font-family: Baskerville,"Goudy Old Style","Palatino","Book Antiqua",Georgia;
    font-style: italic;
}


/*  CONTENT */  
  
	.main {
	    
/*      border: 2px solid green;*/
      margin: auto;
      padding-bottom: 50px;
          width: 100%;
    max-width: 1400px;
    
          
     
      
	    /*padding: 40px 0 60px;*/
	    min-height: 300px;
-moz-border-top-right-radius: 0px;
-webkit-border-top-right-radius: 0px;
-khtml-border-top-right-radius: 0px;
border-top-right-radius: 0px;     
}
      

	.inner {
      width: 95%;
/*      border: 1px solid yellow;*/
	    margin: auto;
	    padding: 0 0px;
        
        
   
                 }

	.no-sidebar .content-container {
	    float: left;
	    width:100%; 
        /* makes content container full width when there is no sidebar */
	}

  

  .content{

padding-bottom: 10px;  
float: right;
width: 63%;
margin: 130px 20px 50px 0px;

 /*border: 1px solid blue;*/
}

.no-sidebar{
width: 100% !important;
float: none;
margin: 130px 0px 50px 0px !important; 
}

.sidebar{
float: left;
width: 30%;
margin: 100px 10px 50px 20px;
}

.sidebar h3{border-bottom: 2px solid #DC3A2E; padding: 10px 0px 10px 25px; }

.sidebar .date{
font-size: 17px;
font-weight: bold;
}

.sidebar a, .sidebar a:link, .sidebar a:visited, .sidebar a:active{
color: black;
display: block;
font-weight: normal;
min-height: 20px;
padding: 15px 10px 15px 20px;
border-bottom: 1px solid #ddd; 
text-decoration: none;
}

.sidebar .section {color: white !important; background: #DC3A2E !important} /* Aktivní MENU LEVEL 2 */

.sidebar .section > ul > li .current {color: black !important; background: linear-gradient(to left, white calc(100% - 3px), #DC3A2E calc(100% - 10px)) !important} /* Aktivní MENU LEVEL 2 */

.sidebar .section > ul {color: black !important; background: #fff; !important} /* Aktivní MENU LEVEL 2 */

.sidebar ul li ul a{font-weight: normal !important;}

.sidebar ul li ul li {}

.sidebar a:hover{
background: #f9f9f9;
}

 

.sidebar .current {background: #fff !important; border-bottom: none !important} /* Aktivní MENU LEVEL 2 */

.sidebar .current ul {display: none}

.sidebar li .current {background: #DC3A2E !important; border-bottom: none !important; color: white !important} /* Aktivní MENU LEVEL 2 */

.sidebar article{display: none;}

.sidebar hr{color: white; border: 1px dotted white; height: 0px;}





/* NOVINKY */ 

.news{
position: relative;
width: 641px;
min-height: 100px;
background: url(../images/home-news.png) no-repeat;
}

.news .text{display: none;}

.news .date{
/*width: 125px;
height: 25px;
text-align: center;
font-weight: bold;
color: white;
float: left;
font-size: 16px;
padding-top: 8px;
*/

position: relative;
top: 100px;
color: silver;
width: 90px;
margin: auto;


}

.news .title{
/*width: 500px;
height: 25px;
float: right;
margin-right: 10px;
*/
}

.news .title a, .clankyseznam .title a{
color: black;
text-decoration: none;
font-weight: normal;
font-size: 17px;
display: block;      
width: 90%;
padding: 100px;
border: 1px solid red;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: transparent url(../images/box-bg.png) -70px 60px no-repeat;
}

.news a:hover, .clankyseznam a:hover{ background: #FFDAD4 url(../images/box-bg-hover.png) -90px 80px no-repeat;}




.news, .clankyseznam{
width: 27%;
height: 100px;
float: left;
border: 1px solid silver;
background: white;
padding: 2%;
margin: 1%;
text-align: center;
overflow: hidden;
position: relative;      
border-radius: 10px;    
}

.inpage {width: 15%; position: relative; top: -30px; left: 10px; }

.home-firstword{
-moz-column-count: 2;
-moz-column-gap: 20px;
-webkit-column-count: 2;
-webkit-column-gap: 20px;
-ms-column-count: 2;
-ms-column-gap: 20px;
-o-column-count: 2;
-o-column-gap: 20px;
column-count: 2;
column-width: 15em;
column-gap: 2em;  
column-rule: 1px dotted #ddd;
}

.home-firstword p{
margin: 0px 0px 20px 0px; 
}

.home-firstword .next a{
background: url(../images/menu-button-active2.png);
padding: 10px 20px 8px 20px;
text-align: center; 
color: white;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px; 
}

.home-firstword .next a:hover{
background: orange;
color: black;
}


.home-vsechny-novinky{
clear: both;
border: 1px solid #EDEEED;
}


.home-vsechny-novinky a{
color: white; padding: 10px; background: #D0523D; border-radius: 5px; text-decoration: none;
display: block;
margin: 60px auto 60px auto;
width: 250px;
text-align: center;
}


.home-vsechny-novinky a:hover{
background: black;
}


.home-box{
width: 33%;
height: 270px;
text-align: center;
overflow: hidden;
position: relative;
float: left;
font-size: 20px;
}

.home-box:nth-of-type(3), .home-box:nth-of-type(4){
border-right: 3px dotted #D0523D;
}

.home-box .numbers{
font-size: 80px;
margin-top: 0px;
color: #D0523D;
}


.home-numbers1 {position: absolute; width: 120%; left: -20%; height: 570px; background: white; z-index: -1;}
.home-numbers2 {background: white !important; padding: 80px 0% 80px 0%;}












.galerie{
position: relative;
float: left;
width: 280px;
background: white;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
text-align:center;
margin: 10px 10px 10px 0px;
font-size: 14px;
}

.galerie .title{
display: block;
width: 100%
height: 20px;
padding-top: 5px;
margin-bottom: 10px;
}


.galerie:hover{background: url(../images/menu-button-hover.png);}
.fancybox:hover{border-bottom: 2px solid #777;}

img{border: 0;}






/* FOOTER */
.footer {
    position: relative;
    color: white;
    font-family: sans-serif, Arial, Helvetica !important;
    line-height: 1.8 !important;
    background: #D0523D;
    font-size: 15px;
    line-height: 22px;
        width: 96%;
    padding: 0% 2% 3% 2%;
    height: auto;
  
     
    
}

.footer-box{float: left; width: 25%}

.footer a{color: white; text-decoration: none; transition: 300ms; 
  border-bottom: 1px solid transparent; display: inline-block;}

.footer a:hover{border-color: white;}

footer h2{font-size: 22px; margin-bottom: 20px;}

.footer .button a {
  border: none;
  color: black;
  padding: 5px 15px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  margin: 10px 0px;
  cursor: pointer;
  border-radius: 10px;
  
  background-color:rgba(255, 238, 235, 0.7);
}

.footer .button a:hover {
background-color: white;   
  
}



.logo-leader, .logo-prv, .logo-eu{
position:absolute;
height: 100px;      
}

 footer .text{
position: absolute;
top: 125px; 
left: 45px;
 }

.logo-leader{
left: 45px;
width: 100px;
background: url(../images/logo-leader.png) no-repeat;
}

.logo-prv {
left: 230px;
background: url(../images/logo-prv.png) no-repeat;
width: 250px;
}
.logo-eu{
left: 572px;
background: url(../images/logo-eu.png) no-repeat;
width: 120px;
}



	.footer .left {
	    float: left;
	    color: #000;
	    display: block;
	    margin-bottom: 10px;
	}
	.footer .right {
	    float: right;
	    display: block;
	    margin-bottom: 10px;
	}
	.footer span {
	    padding: 0 3px;
	    color: #bbb;
	}
	.footer .primary,
	.footer .primary ul {
	    display: inline;
	    margin: 0;
	    padding: 0;
	}
		.footer .primary li {
		    display: inline;
		}
	.ie6 .footer .primary li,
	.ie7 .footer .primary li { /* this is a bugfix for ie6/7 */
	    display: inline;
	    zoom: 1;
	    margin-right: 10px;
	}
	.footer .primary li:after { /* adds '/' to separate the footer navigation items */
	    padding: 0 3px 0 5px;
	    content: '/';
	    color: #999;
	}
	.footer .primary li:last-child:after {
	    content: ''; /* makes sure last nav item doesn't have a '/' following it */
	}
	.footer .arrow {
	    padding: 0 8px 0 5px;
	    color: #b80000;
	    font-size: 13px;
	}
	.footer .primary .nav-open-button {
	    display: none; /* the footer includes the primary nav include - this makes sure the nav open close button doesn't show up */
	}
  
  


























 	/* Search form */

	.search-bar {
		position: absolute;
		right: 13px;
		top: 12px;
	}
		.search-bar .field {
			margin: 0;
			padding: 0;
		}
		.search-bar form input.text {
		    width: 155px;
		    padding: 5px 34px 5px 15px;
		    color: #888;
		    margin: 0;
		    border: none;
		    -moz-border-radius: 14px;
		    border-radius: 14px;
		    background: #fff;
		}

		.search-bar form input.action { /* positions the search button icon over the top of the search input */
		    font-size: 14px;
		    position: absolute;
		    right: 5px;
		    top: 0;
		    cursor: pointer;
		    border: none;
		    padding: 5px;
		    background: none;
		    font-family: 'WebSymbolsRegular';
		    color: #848484;
			border-radius: 0;
			margin: 0;
		}
		.search-bar form input.active,
		.search-bar form input.action:hover {
		    color: #000;
		}
		.search-bar form input:focus,
		.header textarea:focus {
		    outline: none; /* removes default browser outlining on focus */
		}
		.search-dropdown-icon {
		    display: none; /* hides search-dropdown-icon when site is at full width - media queries set it to display:block when at mobile/tablet width */
		}
    


/* PAGE SPECIFIC LAYOUT */

	/* Homepage */
		/* currently no Hompage specific styles - feel free to add your own */
    .HomePage .header{height: 500px;}
    .HomePage .content h1{top: 500px;}
    .HomePage .content{margin-top: 75px !important;}
    .HomePage .header-text{display: block;}
    
    body.HomePage {background: #eee url(../images/office-bg.jpg) center 30%; background-size: 100%; overflow: hidden !important;  /*background: linear-gradient(
    to bottom,
    #fff 0vh,        top color 
    #fff 90vh,       end of first color 
    #eee 90vh,       start of second color 
    #eee 100vh       bottom color */
  );
}

	/* Search Results */
	.typography .searchResults h1 {
		margin-bottom: 0;
		padding-bottom: 0;
		border-bottom: none;
	}
	.searchResults p.searchQuery {
	    margin-bottom: 10px;
	    font-size: 15px;
	    font-weight: bold;
	}
	.searchResults ul#SearchResults {
	    padding: 0;
	    border-bottom: 1px solid #e5e5e5;
	    margin:0;
	}
		.searchResults ul#SearchResults li {
		    border-top: 1px solid #e5e5e5;
		    padding: 20px 0;
		    list-style-type: none;
		}
		.searchResults ul#SearchResults p {
		    margin-bottom: 10px;
		}
		.searchResults #PageNumbers a {
		    padding: 0 5px;
		}
		.searchResults #PageNumbers .pagination {
		   	border-bottom: 1px solid #e5e5e5;
		    padding: 20px 0;
		    display:table; /* displays the pagination as a table so that elements stay inline and the middle column adjusts its size to accomodate and the right arrow stays to the right */
		    width:100%;
		}
		.searchResults #PageNumbers .pagination span{
			display:table-cell; /* each element in the pagination div displays as a table cell */
		}
		.searchResults #PageNumbers p {
		    text-align: center;
		    padding:20px 0;
		}
		.searchResults #PageNumbers .next,
		.searchResults #PageNumbers .prev {
		    font-size: 14px;
		    padding: 0 20px;
		    display:table-cell; /* each element in the pagination div displays as a table cell */
		    vertical-align: middle;
		    border-bottom:0 !important;
		}
		.searchResults #PageNumbers .next {
		    margin-left: 15px;
		}
		.searchResults #PageNumbers .prev {
		    margin-right: 15px;
		}

/* DEVICE & RESPONSIVE LAYOUT */
.header .nav-open-button {
    display: none; /* removes the nav toggle button for desktop site */
}
#media-query-trigger {
    /* instead of detecting the width of the window in simple/javascript/script.js it detects the visibility of this element (which is set using media queries) 
    instead to trigger the hiding/showing of nav and search in mobile mode */
    display: none;
    visibility: hidden;
}

/* BREAKPOINT 960px */

@media only screen and (max-width: 960px) {
	.content img {
	    max-width: 97%;
	    height: auto;
	}
    .footer-box{float: none; width: 100% !important;}
    .header-text{background: rgba(0, 0, 0, 0.5); padding: 1%; font-size: 15px; font-weight: bold; font-style: italic; position: absolute; text-align: center; width: 98%; right: auto; top: 480px; text-shadow: 3px 3px 10px black;}
	.header .primary ul {
	    margin-left: -12px;
	    -webkit-padding-start: 0px; /* removes default webkit padding on ul items */
	}
    .no-mobile{display: none;}
    .yes-mobile{display: block !important; text-align: center; padding-bottom: 15px}
    
  .inpage {width: 83% !important;
padding: 1% 4% 1% 4% !important; }  


	/* Brand */
	header .brand, header .brand:hover {
	position: absolute;
      top: 80px;
      right: auto;
      left: auto;
      text-align: center;
      width: 100%;

      
      
      
	}
		.brand .nadpis{display: none;}
		.brand p {display: none;}
    
    
.header {
    width: 100%;
    
    height: 570px !important;
    background: url(../images/header_cr.jpg) center 45% repeat-x;
    background-size: 350%;
    
    

    
    
}

    
    	/* Homepage */
		/* currently no Hompage specific styles - feel free to add your own */
    .HomePage .header{    width: 100%;
    
    height: 570px !important;
    background: url(../images/header_cr.jpg) center 45% repeat-x;
    background-size: 350%;}
    .HomePage .content h1{top: 0;}
    .HomePage .content{margin: 130px 20px 50px 0px !important;}
    .HomePage .header-text{display: block;}
    
    
    .home-box{
width: 100%;
height: 270px;
text-align: center;
overflow: hidden;
position: relative;
float: left;
font-size: 20px;
padding: 30px 0 30px 0;
}

.home-box:nth-of-type(3), .home-box:nth-of-type(4){
border-bottom: 3px dotted silver;
border-right: none;
}


.home-box .numbers{
font-size: 80px;
margin-top: 0px;
color: #D0523D;
}

.home-numbers1 {position: absolute; width: 120%; left: -20%; height: 1400px; background: white; z-index: -1;}
.home-numbers2 {background: white !important; padding: 80px 0% 80px 0%;}




.header img{width: 200px
}
.header .mikroregion{
display: none;
}

.up_text {display: block;z-index: 15; background: white; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5); position: fixed; width: 97%; padding-left: 3%; border-bottom: 1px solid white; padding-top: 25px; padding-bottom: 25px; text-align: left; font-size: 17px; color: black; }
  .up_text a{color: black; text-decoration: none; font-weight: normal;}
  .up_text_pc{display: none;}
  .up_text_mobile{display: block;}

.inner {
      width: 100%;}

.content h1{
width: 96%;
height: auto;
padding: 2%;
color: white;
font-size: 27px !important;
text-align:center;
/* border: 1px solid blue;*/
position: absolute;
left: 0; 
top: 570px !important;
z-index: -5;
background: url(../images/header_nadpis.jpg) center center repeat;
}

  .content{
padding: 0px 5% 10px 5%;  
width: 90% !important;
margin: 130px 0 50px 0;
float: none;






    
.news, .clankyseznam{
width: 90% !important;
padding: 1% 4% 1% 4% !important;


}




}

.sidebar{
display: none;
}





.mobile-menu{cursor: pointer; display: block; position: fixed; z-index: 20; top: 0px; right: 0px; width: 70px; height: 70px; background: url('../images/mobile-menu.png') center center no-repeat}
 
/* ========================== Menu z http://www.cssplay.co.uk/menus/final_drop.html */

.menu {
position: fixed; margin: auto; width: 100%; height: 100%; max-width: 100%;
background: rgba(255, 255, 255, 0.9);
 overflow-y: auto;
 overflow-x: hidden;  
display: none; top: 80px; padding-top: 10px; right: 0px; z-index: 10;} /* Základní menu */
.menu ul {padding:0; margin:0; list-style-type: none;} /* Odstranění všech stylů seznamu */
.menu li {vertical-align: middle; float:left; width:100%; position:relative; margin: 0px 0px 0px 0px; padding:0;} /* Horizontální menu + relative position pro kontrolu drop-down menu */


/* ============= MENU LEVEL 1 - HLAVNÍ MENU ============= */
.menu > ul > li a, .menu > ul > li > a:visited, .menu > ul > li > a:link,.menu > ul > li > a:active {background: none; display:block;font-size:15px; text-align: center; font-family: museo700regular; text-decoration:none; 
color:#222; width:auto; height:50px; line-height:29px; font-weight: normal; padding: 25px 12px 4px 12px;
-moz-border-radius: 0px; -webkit-border-radius: 0px; -khtml-border-radius: 0px; border-radius: 0px;
    -webkit-transition: background 0.5s linear;
    -moz-transition: background 0.5s linear;
    -ms-transition: background 0.5s linear;
    -o-transition: background 0.5s   linear;
    transition: background 0.5s linear;     /* určuje za jak dlouho efekt hover zmizí */   
    
}
.menu > ul > li a:hover{color:#000; background-color:rgba(255, 255, 255, 0.7);
    -webkit-transition: background 0s linear;
    -moz-transition: background 0s linear;
    -ms-transition: background 0s linear;
    -o-transition: background 0s linear;
    transition: background 0s linear;   /* určuje jak dlouho efekt hover nabíhá */
    }
    
.current > a, .current > a:link, .current > a:active, .current > a:visited{color: white !important; background: #D0523D !important; border-bottom: 2px solid #D0523D;}
.section > a {background: none !important; border-bottom: 2px solid #D0523D;} /* svítící MENU LEVEL 1 při aktivním MENU LEVEL 2  */     
.current > a:hover {color:#000; background-color:rgba(255, 255, 255, 0.7) !important;}    


    



/* ============= MENU LEVEL 2 ============= */

.menu > ul > li > ul > li > a, .menu > ul > li > ul > li > a:visited, .menu > ul > li > ul > li > a:link,.menu > ul > li > ul > li > a:active {
background-color:rgba(255, 255, 255, 0.9); display:none;font-size:15px; text-align: left; font-family: museo700regular; text-decoration:none; 
color:#222; width: 250px; height:auto; line-height:1.0; font-weight: normal; padding:10px 10px;
-moz-border-radius: 0px; -webkit-border-radius: 0px; -khtml-border-radius: 0px; border-radius: 0px;  
-webkit-transition: background 0.1s linear;
-moz-transition: background 0.1s linear;
-ms-transition: background 0.1s linear;
-o-transition: background 0.1s linear;
transition: background 0.1s linear;   /* určuje za jak dlouho efekt hover zmizí */
}
.menu > ul > li > ul > li a:hover {color:#000; background-color:rgba(255, 238, 235, 0.9);
-webkit-transition: background 0s linear;
-moz-transition: background 0s linear;
-ms-transition: background 0s linear;
-o-transition: background 0s linear;
transition: background 0s linear;   /* určuje jak dlouho efekt hover nabíhá */
}    


.section > ul > li .current {color: white !important; background: #D0523D !important} /* Aktivní MENU LEVEL 2 */





}
}





/* BREAKPOINT 640px */

/* when changing the breakpoint below, change it ito the same value in the script.js file as well */
@media only screen and (max-width: 640px) { 
	body {
	    max-width: 640px;
	}
	#media-query-trigger {
	    visibility: visible;
	}

	/* Navigation*/

	.tablet-nav .header .brand {
	    float: none;
	    display: inline-block;
	    margin-left: 22px;
	    margin-bottom: 22px;
	}
		.brand h1 {
		    font-size: 40px;
		}
		.brand h1 {
		    padding-right: 100px; /* padding stops .brand text from overlapping the search and nav buttons */
		}
	.tablet-nav .header {
	    padding: 0px;
	}
		.tablet-nav .header .inner {
		    padding: 20px 0 0 0;
		    min-height: 0;
		}
		.tablet-nav .header .primary .nav-open-button { /* styling and positioning of the nav toggle button */
		    z-index: 100;
		    width: 20px;
		    height: 20px;
		    position: absolute;
		    right: 20px;
		    top: 35px;
		    display: block;
		    cursor: pointer;
		    font-family: 'WebSymbolsRegular';
		    font-size: 20px;
		    color: #ededed;
		}
		.tablet-nav .header .primary ul {
		    z-index: 10;
		    position: relative;
		    display: none; /* initially hiding the navigation */
		    float: left;
		    margin: 0;
		    padding: 0;
		    white-space: normal;
		    width: 100%;
		}
			.tablet-nav .header .primary ul li {
			    width: 100%;
			    margin: 0;
			    padding: 0;
			    float: none; /* displays list items vertically */
			    background: none;
			    position: relative;
			    text-shadow: 0 1px #fff;
			}
			.tablet-nav .header .primary ul li:after { /* creates the arrow for the primary nav links */
			    content: '\003e';
			    display: block;
			    position: absolute;
			    right: 20px;
			    top: 0px;
			    font-family: 'WebSymbolsRegular';
			    font-size: 14px;
			    color: #999;
			    text-align: center;
			    vertical-align: middle;
			    line-height: 38px;
			}
			.tablet-nav .header .primary ul li a,
			.tablet-nav .header .primary ul li.current a,
			.tablet-nav .header .primary ul li.section a { /* styling the  top level nav links */
			    padding: 10px 0 10px 22px;
			    font-weight: bold;
			    border-bottom: 1px solid #bbb;
			    color: #434343;
			    background: #e7e7e7;
			}
			.tablet-nav .header .primary ul li.current a,
			.tablet-nav .header .primary ul li.section a {
				background: #CCCCCC; /* makes background on current top level page slightly darker */
			}
			.tablet-nav .header .primary ul li a:hover {
			    color: inherit;
			}
			.tablet-nav .header .primary li.section:after,
			.tablet-nav .header .primary li.current:after {
			    display: none; /* hides the link arrow on current top level page */
			}
			.tablet-nav .tablet-nav .header nav.primary ul li {
				padding: 0;
			}

	/* Search Form */
	.search-bar { /* adds new styling to mobile search bar */
	    width: 100%;
	    position: relative;
	    top: 0;
	    right: 0;
	    display: none; /* hides searchbar initially */
	    padding: 20px 0;
	    margin: 0;
	    background-color: #E7E7E7;
	}
	.search-dropdown-icon { /* styling for search toggle button */
	    display: block;
	    cursor: pointer;
	    width: 20px;
	    height: 20px;
	    position: absolute;
	    right: 60px;
	    top: 34px;
	    font-family: 'WebSymbolsRegular';
	    font-size: 20px;
	    color: #ededed;
	    text-align: center;
	    line-height: 20px;
	}
	.search-bar form {
	    margin: 0;
	    width: 100%;
	}
		.search-bar form fieldset {
		    padding: 0 18px;
		    left: 0;
		    right: 0;
		    position: relative;
		}
	.search-bar div.field {
	    margin-bottom: 0;
	}
	.search-bar form input.text {
	    width: 89%; /* makes search input full width - allowing for space either side */
	    max-width: 89%;
	    padding: 8px 10% 8px 1%;
	    text-indent: 15px;
	    position: relative;
	    display: block;
	    right: 0;
	    left: 0;
	    border: 1px solid #e5e5e5;
	    background: #fff;
	    font-size: 17px;
	    -moz-border-radius: 20px; /* increase border radius due to increased padding */
		border-radius: 20px;
	}
	.search-bar form input.action {
	    right: 5%;
	    top: 2px;
	    font-size: 18px;
	}

	/* Main Content */
	.main {
	    padding: 20px 0 45px; /* decrease padding so that more content can fit on screen */
        
	}
	.content-container{
	    width: 100%; /* sidenav is now shown above the page content */
	    margin-bottom: 30px; 
        
	}
		.typography h1 { /* decrease size of page heading due to smaller screen */
		    font-size: 30px;
			line-height:35px;
		    margin-bottom: 15px;
		    padding-bottom: 10px;
		}
		.typography p {
		    font-size: 13px;
		    line-height: 50px;
		}
	p.intro {
	    font-size: 19px;
	    line-height: 27px;
	}
	.main .inner {
	    padding: 0 22px;
      
	}
	/* Secondry Nav */
	.secondary li a {
	    line-height: 24px;
	}
	.secondary li .arrow {
	    line-height: 26px;
	}
	/* Footer */
	.footer .right {
	    float: left;
	    width: 100%;
	}
}



/* Print Styles */


/* Based on HTML5 boilerplate print styles */
@media print {
	* {
	    background: transparent !important;
	    color: black !important;
	    box-shadow: none !important;
	    text-shadow: none !important;
	    filter: none !important;
	    -ms-filter: none !important;
	}
	a,
	a:visited {
	    text-decoration: underline
	}
	a[href]:after {
        content: " (" attr(href) ")";
    }
    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

	thead {
	    display: table-header-group
	}
	tr,
	img {
	    page-break-inside: avoid
	}
	img {
	    max-width: 100% !important
	}
	pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }
    @page {
        margin: 0.5cm;
    }
    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

    /* Simple theme custom print styles */
	.header,
	.footer,
    .nav-open-button,
    .search-bar,
    .search-dropdown-icon,
    nav.primary {
	    display: none;
	}
}

a {
  -webkit-tap-highlight-color: rgba(255, 218, 212, 0.5) !important; /* Prohlížeče založené na WebKit/Blink (iOS Safari, Android Chrome) */
  tap-highlight-color: rgba(255, 218, 212, 0.5) !important; /* Standardní */
}