/*******************************************************************************************************************
*  Author: Tomas Lach (www.tomaslach.cz)                                                                           
*  Date: 11.11.2011                                                                                                
*******************************************************************************************************************/

/*******************************************************************************************************************
*  IMPORT OTHER STYLES                                                                                             
*******************************************************************************************************************/
@import url("./reset.css");
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic);

/*******************************************************************************************************************
*  BASE                                                                                                            
*******************************************************************************************************************/
html {background: #fff url('../img/background.jpg') no-repeat 50% 45px}
body {color: #373737;font: normal 13px Arial, Tahoma, Verdana;}
p {line-height: 1.7em;margin-bottom: 15px}
address {line-height: 1.7em;margin-bottom: 15px;font-style: normal;padding-bottom: 15px;}


/*******************************************************************************************************************
*  LINKS                                                                                                           
*******************************************************************************************************************/
a, a:link, a:focus {color: #dd4729;outline: 0;}
a:hover, a.hover {color: #dd4729;text-decoration: none}
a.more {padding-right: 15px;background: url('../img/arrow.gif') no-repeat 100% 50%}

/*******************************************************************************************************************
*  H1 - H4                                                                                                         
*******************************************************************************************************************/
h1, h2, h3, h4 {color: #5f3315;margin-bottom: 15px}
h1 {font-size: 1.8em;}
h2 {font-size: 1.4em;font-weight: 400}
h3 {font-size: 1.2em;}
h4 {font-size: 1.1em;}

/*******************************************************************************************************************
*  HEADER                                                                                                          
*******************************************************************************************************************/
#header {height: 220px;}
#header #logo {width: 137px;height: 108px;display: block;background: url('../img/logo-bako-interiery.png') no-repeat;text-indent: -9999px;text-decoration: none;position: absolute;top: 0;left: 0}
#header nav ul {font-family: 'Lato';width: 100%;height: 65px;background: url('../img/background-navigation.png') no-repeat;position: absolute;left: 0px;top: 135px}
#header nav ul li:first-child {background: none;padding-left: 0}
#header nav ul li {float: left;}
#header nav ul li a {float: left;color: #fff;height: 65px;line-height: 65px;text-decoration: none;font-size: 1.15em;background: url('../img/navigation-sep.gif') no-repeat 0 50%;font-weight: 300;display: block;padding: 0 20px;}
#header nav ul li:first-child a {background: none;}
#header nav ul li:hover a,
#header nav ul li.active a {color: #efac7f;}

/*******************************************************************************************************************
*  CONTENT                                                                                                         
*******************************************************************************************************************/
#container {background: url('../img/background-content.png') no-repeat}
#content {padding: 30px 20px;width: 650px;float: left}
#content ul.styled {margin-bottom: 20px}
#content ul.styled li {padding: 0 0 5px 20px;background: url('../img/li.gif') no-repeat 0px 4px;line-height: 1.4em;}
#content .gallery {margin-left: -19px;width 709px;}
#content .gallery a {display: block;float: left;padding: 5px;background: url('../img/background-image.png') no-repeat 50% 50%;margin-left: 19px;}
#content .gallery a:hover {background: #dd4729}
#content .gallery a img {float: left}

#aside {background: url('../img/background-aside.png') no-repeat 0 50px;width: 209px;padding: 35px 20px 20px;float: right;border-left: 1px dotted #d2d2d2;border-bottom: 1px dotted #d2d2d2}
#aside a.map {display: block;padding: 5px;background: url('../img/background-image.png') no-repeat 50% 50%;}
#aside a.map:hover, 
#aside a.map.hover {background: #dd4729}
#aside a.map img {float: left;width: 199px}


/*******************************************************************************************************************
*  FOOTER                                                                                                          
*******************************************************************************************************************/
#footer {background: url('../img/background-footer-image.png') no-repeat 50% 0;height: 160px}
#footer .wrap{background: url('../img/background-footer.png') no-repeat 50% 100%;}
#footer .wrap p {padding: 25px 20px 20px;color: #492a18;font-size: 0.9em}
#footer .wrap p a {color: #492a18}

/*******************************************************************************************************************
*  OTHER STYLES                                                                                                    
*******************************************************************************************************************/
.wrap {margin: 0 auto;position: relative;width: 940px}
.mask {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}