html { 
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-ms-font-smoothing: antialiased;
font-smoothing: antialiased; 
}

@media only screen {

    body {
        font: 'trebuchet ms', arial, sans-serif;
        color: #777;
        margin: 0;
        padding: 0;
        background: #f4f4f6 url('../img/header_bg.jpg') top left repeat-x;
    }

    .cleaner {
        clear: both;
    }

    /**************************************************************** Nahoru dolu ********************************************************************/
    
    a.btmTop {
        position: absolute;
        right: 20px;
		bottom: 50px;
        display: block;
        height: 36px;
        width: 28px;
        z-index: 3000;
		background: url('../img/footer_anchor.png');
		background-position: top
    }
    
    a.btmTop span {
        display: none;
    }
    


    /**************************************************************** N A V I G A C E *******************************************************************/
    
    #hmbm {
        display: none;
    }
    
    
    #holder {
        width: 1000px;
        height: 150px;
        margin: 0 auto;
        position: relative;
		background: url('../img/header_img.jpg') center top sno-repeat;
    }
    
    #holder .logo a {
        display: block;
        width: 335px;
        height: 109px;
        background: url('../img/logo-dt.png') no-repeat;
        position: absolute;
        top: 16px;
        left: 0;
    }
    
    #holder .fb a {
        display: block;
        width: 30px;
        height: 30px;
        background: url('../img/fb.png') center no-repeat;
        position: absolute;
        right: 6px;
        top: 12px;
    }
    
    #holder .logo a span, #holder .fb a span {
        display: none;
    }


    #holder .navigace {
        position: absolute;
		right: 0;
        width: 72%;
		padding-top: 60px;
		border: solid 0 red;
    }

    #holder .navigace ul {
        list-style-type: none;
        margin: 0;
	}
    
    #holder .navigace ul li a {
        background: url('../img/nav-bg.png') top left repeat-x;
		border: solid 0 rgb(38,52,69,0.5);
		border-right-width: 1px
	}
	
	#holder .navigace ul li a.first-child {
        background: url('../img/nav-bg-side.png') top left no-repeat;
		border: solid 0 rgb(38,52,69,0.5);
		border-right-width: 1px
	}
	
	#holder .navigace ul li a.last-child {
        background: url('../img/nav-bg-side.png') top right no-repeat;
		border: solid 0 rgb(38,52,69,0.5);
	}
	
	#holder .navigace ul li a:link, #holder .navigace ul li a:visited {
        height: 29px;
		display: inline-block;
        color: #ffffff;
        text-decoration: none;
        float: left;
        margin: 0;
        padding: 11px 16px 0 16px;
        font: 'Trebuchet MS', arial, sans-serif;
		font-size: 15px;
        text-align: left;
	}
	
    #holder .navigace ul li a:hover {
        display: block;
        background: url('../img/nav-bg-hover.png') top center no-repeat;
		transition: 0.3s
    }
	
	#holder .navigace ul li a.first-child:hover {
        background: url('../img/nav-bg-hover.png') top left no-repeat;
		border: solid 0 rgb(38,52,69,0.5);
		border-right-width: 1px
	}
	
	#holder .navigace ul li a.last-child:hover {
        background: url('../img/nav-bg-hover.png') top right no-repeat;
		border: solid 0 rgb(38,52,69,0.5);
	}
    
	#holder .navigace ul li a.selected-first {
		background: url('../img/nav-bg-selected.png') top left no-repeat;
	} 
	
	#holder .navigace ul li a.selected-last {
		background: url('../img/nav-bg-selected.png') top right no-repeat;
	}
	
	#holder .navigace ul li a.selected {
		background: url('../img/nav-bg-selected.png') top center no-repeat;
	}
  }  
    
    

/**************************************************************** max-width: 999px *******************************************************************/

@media only screen and (max-width: 999px) {
	
	body {
        background: #f4f4f6 url('../img/header_bg_mb.jpg') top left repeat-x;
    }


    #hmbm {
        display: block;
        width: 45px;
        height: 35px;
        position: absolute;
        right: 20px;
        top: 22px;
        z-index: 2000;
        background: transparent url('../css/HamMenu.png') left top no-repeat;
        cursor: pointer;
    }

    #hmbm.opn {
        background-image: url('../css/HamMenuX.png');
    }


    #holder {
        width: 100%;
		height: 80px;
        position: relative;
    }
	
	#holder .logo a {
        width: 171px;
        height: 50px;
        background: url('../img/logo-mb.png') top left no-repeat;
        top: 14px;
        left: 20px;
    }
	
	 #holder .fb a {
        width: 40px;
        height: 40px;
        right: 80px;
        top: 22px;
    }

    #holder .navigace {
        width: 100%;
        min-width: 0;
		padding-top: 10px;
        overflow: hidden;
        background: #273f5b;
        display: none;
        top: 0;
        right: 0;
		z-index: 1000
    }

    #holder .navigace ul {
        list-style: none;
        margin: 30px 0 0 0;
        padding: 0 0 15px 0;
        width: 100%;
    }
	
	#holder .navigace ul li a {
        background: transparent;
		border: solid 0 rgb(38,52,69,0.5);
		border-right-width: 1px
	}
	
	#holder .navigace ul li a.first-child {
        background: transparent;
		border: solid 0 rgb(38,52,69,0.5);
		border-right-width: 1px
	}
	
	#holder .navigace ul li a.last-child {
        background: transparent;
		border: solid 0 rgb(38,52,69,0.5);
	}

    #holder .navigace ul li a:link, #holder .navigace ul li a:visited {
        display: block;
        width: 100%;
        margin: 0;
        padding: 20px 0;
        white-space: nowrap;
        font-size: 16px;
		font-weight: 100;
        color: #ffffff;
        text-align: center;
        float: left;
        border-bottom: solid 1px #1e2f43;
		
    }
	
	#holder .navigace ul li a.selected-first, #holder .navigace ul li a.selected-last, #holder .navigace ul li a.selected {
		background: transparent;
	} 
    

}