/*  Zika - stavebni a zemni prace
    Scarabeo s.r.o. - Martin Svetlik (c) 2009   */

* { margin: 0; padding: 0; border: 0; }
body {
  background: #f4f4f4 url('./style/layout/bg.jpg') top left repeat-x;
  font-family: "Trebuchet MS", "Geneva CE", lucida, sans-serif;
  font-size: small;
  line-height: 18px;
  color: #656565;
}

/* ------------------------------ Zakladni vlastnosti ---------------------------------*/

html, body, #page { height: 100%; }
body > #page { height: auto; min-height: 100%; }
#main { padding-bottom: 153px; width: 100%; margin: 0 auto; background: url('./style/layout/bg-middle.jpg') top no-repeat; background-position: center 166px; }

a, a:visited { color: #616161; text-decoration: underline; }
a:hover, a:focus { text-decoration: none; }

table { 
  display: table; 
  border-collapse: collapse; 
  width: 100%; 
  border: 1px solid #e0e0e0; 
  margin-bottom: 25px;
}
tr { display: table-row; }
th, td { display: table-cell; border: 1px solid #e0e0e0; margin: 0; padding: 5px; vertical-align: top; text-align: center;}
th { background: #e9edef; font-weight: bold; vertical-align: middle; }

.hidden { display: none; }
.center { text-align: center; }
.right { text-align: right; }

.cleaner {
  clear: both;
  height: 1px;
  margin: -1px 0 0 0; 
  padding: 0;
  border: none;
  visibility: hidden;
}

.replacement {
  position: relative;
  overflow: hidden;
}
.replacement span {
  display: block;
  position: absolute; 
  left: 0; 
  top: 0; 
  z-index: 1;
}

/* ------------------------------ Horni cast ---------------------------------*/

#top {
  width: 967px;
  height: 167px;
  margin: 0 auto;
  background: url('./style/layout/bg-top.jpg') top left no-repeat;
  background-position: 3px 0;
}

/* --------- Logo --------- */

#top h1 a {
  position: relative;
  width: 113px; 
  height: 133px;
  overflow: hidden;
  text-align: center; 
  left: 16px;
  top: 13px;
  color: #252121;
  display: block;
  line-height: 29px;
  float: left;
  cursor: pointer;
}
#top h1 a em { font-size: 50%; color: #8a8888; font-style: normal; text-transform: uppercase; }
#top h1 a span {
  display: block;
  position: absolute; 
  left: 0; 
  top: 0; 
  z-index: 1;
  width: 113px; 
  height: 133px;
  background: url('./style/layout/logo.jpg') top center no-repeat;
}

/* --------- Navigace --------- */

#nav { 
  width: 498px;
  height: 54px;
  float: right;
  margin-top: 51px;
}

#nav ul li { 
  float: left; 
  list-style: none;
}

#nav ul li a {
  position: relative;
  overflow: hidden;
  display: block;
  cursor: pointer;
  height: 54px;
  line-height: 54px;
  text-align: center;
}
#nav ul li a span {
  display: block;
  position: absolute; 
  left: 0; 
  top: 0; 
  z-index: 1;
  height: 54px;
  background-position: 0 0;
}

#nav ul li a:hover { color: #3a3a3a; }

#nav ul li a.intro { width: 90px; }
#nav ul li a.intro span { width: 90px; background: url('./style/menu/intro.jpg') top left no-repeat; }
#nav ul li a.intro:hover span { background-position: 0 -54px; }

#nav ul li a.services { width: 111px; }
#nav ul li a.services span { width: 111px; background: url('./style/menu/services.jpg') top left no-repeat; }
#nav ul li a.services:hover span { background-position: 0 -54px; }

#nav ul li a.equipment { width: 110px; }
#nav ul li a.equipment span { width: 110px; background: url('./style/menu/equipment.jpg') top left no-repeat; }
#nav ul li a.equipment:hover span { background-position: 0 -54px; }

#nav ul li a.realization { width: 110px; }
#nav ul li a.realization span { width: 110px; background: url('./style/menu/realization.jpg') top left no-repeat; }
#nav ul li a.realization:hover span { background-position: 0 -54px; }

#nav ul li a.contact { width: 77px; }
#nav ul li a.contact span { width: 77px; background: url('./style/menu/contact.jpg') top left no-repeat; }
#nav ul li a.contact:hover span { background-position: 0 -54px; }

#nav ul li#active a span { background-position: 0 -108px; }

/* ------------------------------ Hlavicka ---------------------------------*/

#head {
  width: 964px;
  height: 249px;
  margin: 0 auto;
}

/* --------- Banner --------- */

#banner { 
  width: 698px;
  height: 250px;
  background: url('./style/layout/banner.jpg') top left no-repeat;  
  position: relative;
  left: 15px;
  float: left;
}

p.slogan {
  width: 318px;
  height: 41px;
  top: 78px;
  left: 44px;
  font-size: 150%;
}

p.slogan span {
  width: 318px;
  height: 41px;
  background: url('./style/layout/slogan.jpg') top left no-repeat;  
}

p.b-works { top: 105px; left: 44px; }

p.b-works a {
  width: 200px;
  height: 60px;
  font-size: 110%;
  display: block;
  background-color: #ffe300;
  line-height: 60px;
  text-align: center;
  cursor: pointer;
}

p.b-works a span {
  width: 200px;
  height: 60px;
  background: url('./style/buttons/b-button.jpg') top left no-repeat;  
  background-position: 0 0;
}

p.b-works a:hover span { background-position: 0 -60px; }

/* --------- Box --------- */

#banner-box { 
  width: 231px;
  float: right;
  background: #435363 url('./style/boxes/b-corner.jpg') top left no-repeat;
  position: relative;
  top: 9px;
  right: 10px;
}

#banner-box h4 {
  color: #fff;
  width: 150px;
  height: 20px;
  margin: 22px 0 10px 15px;
  font-size: 110%;
}
#banner-box h4 span {
  width: 150px;
  height: 20px;
  background: url('./style/titles/lwork.jpg') top left no-repeat;
}

#banner-box p { color: #c9d6ed; padding: 0 0 10px 15px; }
#banner-box p img { margin-top: 7px; }

div.b-all a {
  width: 231px;
  height: 46px;
  font-size: 110%;
  display: block;
  background-color: #3a3a3a;
  line-height: 46px;
  text-align: center;
  cursor: pointer;
}

div.b-all a span {
  width: 231px;
  height: 46px;
  background: url('./style/buttons/b-all.jpg') top left no-repeat;  
  background-position: 0 0;
}

div.b-all a:hover span { background-position: 0 -46px; }

/* ------------------------------ Obsah ---------------------------------*/

#cont {
  width: 967px;
  margin: 0 auto;
  padding-top: 22px;
}

#cont.hp { background: url('./style/layout/cont-bg-1.jpg') top center no-repeat; background-position: 4px 1px; }
#cont.page { background: url('./style/layout/cont-bg-2.jpg') top center no-repeat; background-position: 4px 0px; }


/* --------- Obsah vlevo --------- */

#text { float: left; width: 655px; padding: 10px 0 0 33px; }

#text p, #text ul { padding-bottom: 23px; }
#text a, #text a:visited { color: #e9aa00; }
#text strong { color: #435363; }
#text h2 { font-size: 140%; color: #435363; font-weight: normal; line-height: 40px; margin-bottom: 7px; }
#text h3 { font-size: 120%; color: #435363; font-weight: normal; line-height: 40px; }
#text ul li { padding-left: 20px; list-style: none; line-height: 25px; background: url('./style/img/bullet.jpg') center left no-repeat; background-position: 0 8px; }

#t-left { float: left; width: 300px; margin-right: 60px; }
#t-right { float: left; }

p.b-certificate { top: 146px; left: 90px; }
#text p.b-certificate a { width: 230px; height: 87px; line-height: 87px; display: block; cursor: pointer; text-align: center; color: #826801; }
p.b-certificate a span { width: 230px; height: 87px; background: url('./style/buttons/b-certificate.jpg') top left no-repeat; background-position: 0 0; }
p.b-certificate a:hover span { background-position: 0 -87px; }

p.b-smore { left: 90px; }
#text p.b-smore a { width: 230px; height: 87px; line-height: 87px; display: block; cursor: pointer; text-align: center; color: #826801; }
p.b-smore a span { width: 230px; height: 87px; background: url('./style/buttons/b-smore.jpg') top left no-repeat; background-position: 0 0; }
p.b-smore a:hover span { background-position: 0 -87px; }


/* --------- Galerie - box --------- */

.gal { width: 695px; height: 221px; background: url('./style/boxes/photo-frames.jpg') top left no-repeat; margin-bottom: 23px; }
.gal img { margin-top: 25px; }
.gal a img { border: 1px solid #d7d7d7; padding: 4px; background-color: #f4f4f4; margin-right: 25px; }
.gal a:hover img { background-color: #f9e078; }


/* --------- Aktuality --------- */

#news { 
  float: right; 
  width: 230px; 
  background: #fff url('./style/boxes/news-corner.jpg') bottom left no-repeat; 
  margin-right: 13px;
  padding: 10px 0 100px 0;
}

#news h4 { font-size: 140%; color: #435363; font-weight: normal; line-height: 40px; padding: 0 14px; }
#news ul li { 
  padding: 0 14px 15px 14px; 
  margin-bottom: 15px; 
  background: url('./style/boxes/new-line.jpg') bottom center no-repeat; 
  list-style: none;
}

#news p { margin-left: 14px; }
#news p a { width: 194px; height: 26px; cursor: pointer; display: block; }
#news p a span { width: 194px; height: 26px; background: url('./style/buttons/b-nall.jpg') top left no-repeat; background-position: 0 0; }
#news p a:hover span { background-position: 0 -26px; }


/* --------- Kontakt --------- */

fieldset { border: none; }
fieldset legend { display: none; }
fieldset label { line-height: 28px; }
fieldset input { color: #616161; }

.inp { width: 270px; background-color: #fdfdfd; border: 1px solid #eaeae9; padding: 7px 5px; font-size: 100%; font-family: "Trebuchet MS", "Geneva CE", lucida, sans-serif; font-size: 100%; }
fieldset textarea { width: 450px; height: 180px; background-color: #fdfdfd; border: 1px solid #eaeae9; padding: 10px; color: #616161; font-family: "Trebuchet MS", "Geneva CE", lucida, sans-serif; font-size: 100%; overflow: auto; }

#submit { width: 157px; height: 56px; background: url('./style/img/send.jpg') top left no-repeat; border: none; cursor: pointer; }

/* ------------------------------ Paticka ---------------------------------*/

#footer {
  position: relative;
	height: 153px;
	width: 100%; 
	margin: -153px auto;
	clear: both;
	background: url('./style/layout/footer.jpg') bottom center no-repeat;
}

#footer div { width: 964px; margin: 0 auto; padding-top: 100px; }
#footer div p { float: left; width: 40%; line-height: 45px; padding-left: 50px; color: #949494; }


.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */