/*
 projekt: oki 
 author: marcin.lisok@fox.com.pl
 data: 2009-07-29
*/

* { font-family: "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, Sans-Serif; }
  
html {
  height: 100%;
  min-height: 100%;
}
body {
  height: 100%;
  min-height: 100%;
  color: #fff;
  font-size: 140%;
  background: #e3e3e3 url('/images/tap/lay-bdy-background.png') repeat-x left top;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 { color: #fff; font-weight: normal; }
h1 { font-size: 170%; }
h2 { font-size: 170%; }
h3 { font-size: 140%; }
h4, h5, h6 { font-size: 120%; }

a { color: #fff; text-decoration: underline; }
a:hover { text-decoration: none; }

#container {
  width: 1032px;
  height: auto;
  min-height: 100%;
  margin: 0 auto;
  position: relative;
} 
#header {
  width: 100%;
  height: 142px;
  color: #000;
  background: #c7e0e2 url('/images/tap/lay-hdr-background.jpg') no-repeat;
  position: relative;
}
#logo {
  top: 58px;
  left: 46px;
  width: 134px;
  height: 75px;
  position: absolute;
}
#metcal {
  top: 58px;
  left: 250px;
  width: 165px;
  height: 75px;
  position: absolute;
}
#techcon {
  top: 58px;
  left: 488px;
  width: 126px;
  height: 75px;
  position: absolute;
}
#wrapper {
  padding: 0 16px;
  background: transparent url('/images/tap/lay-wrp-background-24bit.png') repeat-y;
}
#subheader { padding: 1px 0 1px 30px; background: #232323 url('/images/tap/lay-sub-background.png') repeat-x left bottom; }
#content {
  padding: 0 30px;
  min-height: 300px;
}
#footer {
  clear: both;
  height: 67px;
  margin: 0 0 20px;
  background: #131313 url('/images/tap/lay-ftr-background.png') no-repeat;
}
#oki img {
  margin: 0 auto;
  display: block;
}



#what-if {
  left: 16px;
  top: 133px;
  height: 229px;
  margin: 0;
  padding: 80px 0 0 235px;
  list-style: none;
  background: transparent url('/images/tap/lay-ul-background.png') no-repeat;
  position: absolute;
}
#what-if li { padding: 0 0 0 13px; margin: 10px 0; background: transparent url('/images/tap/lay-ul-bullet-light.png') no-repeat left center; }
#what-if li.title { padding: 0; margin: 0; font-size: 310%; background: transparent; }


#header .video {
  left: 726px;
  top: 181px;
  width: 252px;
  text-align: center;
  background: transparent url('/images/tap/lay-video.png') no-repeat;
  position: absolute;
}
#header .video a {
  width: 204px;
  margin: 24px auto 15px;
  position: relative;
  outline: none;
  display: block;
}

#content .video {
  right: 5px;
  top: 2px;
  width: 192px;
  height: 156px;
  background: transparent url('/images/tap/lay-frame.png') no-repeat;
  outline: none;
  position: absolute;
}
#content .video img { margin: 20px auto 0; }

.video img { display: block; }
.video span.click-to-view {
  left: 0;
  bottom: 0;
  height: 35px;
  padding: 0 0 0 40px;
  font-size: 12px;
  text-align: left;
  line-height: 35px;
  background: transparent url('/images/tap/lay-clicktoview.png') no-repeat;
  display: inline;
  position: absolute;
}

#header .video span.click-to-view { width: 164px; }
#content .video span.click-to-view { left: 20px; bottom: 20px; width: 112px; }
/*
a:hover span.click-to-view,
a:focus span.click-to-view { display: inline; }
*/

#subheader h1 { margin: 30px 0 10px; }
#tap { float: right; }

ul.bullets {
  margin: 10px 0;
  padding: 0;
  list-style: none;
}
ul.bullets li {
  margin: 5px 0;
  padding: 0 0 0 14px;
  background: transparent url('/images/tap/lay-ul-bullet-dark.png') no-repeat left center;
}


.box {
  margin: 30px 0;
  padding: 10px 5px 20px 30px;
  border: 1px solid #2d2e2d;
  background: #1b1b1b;
  position: relative;
}

.gradient {
  margin: 30px -30px;
  padding: 1px 29px 1px 30px;
  background: transparent url('/images/tap/lay-gradient.png') repeat-x left top;
}



.bubble {
  left: 400px;
  top: 5px;
  width: 300px;
  height: 126px;
  padding: 10px 0;
  font-size: 12px;
  background: transparent url('/images/tap/lay-bubble-background.png') no-repeat center top;
  position: absolute;
}
.bubble-left  { float: left;  width: 32px; height: 146px; margin: -10px 5px -10px 0; background: transparent url('/images/tap/lay-bubble-left.png') no-repeat; }
.bubble-right { float: right; width: 32px; height: 146px; margin: -10px 0 -10px 5px; background: transparent url('/images/tap/lay-bubble-right.png') no-repeat; }
.bubble p { margin: 27px 30px 30px; }

.bubble-address {
  width: 361px;
  height: 137px;
  padding: 28px 0px 0 30px;
  font-size: 11px;
  background: transparent url('/images/tap/lay-bubble-address.png') no-repeat;
  display: none;
  position: absolute;
}
.bubble-address p { margin: 0; }

.location { cursor: pointer; }

#map {
  clear: both;
  width: 791px;
  height: 438px;
  margin: 0 auto;
  display: block;
}
p.address { display: none; }


#training     .bubble { left: 440px; width: 250px; }
#application  .bubble { left: 395px; width: 340px; }
#productivity .bubble { left: 465px; width: 200px; }

.employees { margin: 10px auto 30px; border: 1px solid #2d2e2d; display: block; }


.legend-white {
  float: left;
  margin: 0 20px 30px 0;
  padding: 0 0 0 30px;
  line-height: 24px;
  background: transparent url('/images/tap/lay-dot-white.png') no-repeat left center;
}
.legend-blue {
  float: left;
  margin: 0 20px 30px 0;
  padding: 0 0 0 30px;
  line-height: 24px;
  background: transparent url('/images/tap/lay-dot-blue.png') no-repeat left center;
}

#popup { top: 50px; left: 0; margin: 0; position: fixed; z-index: 1000; }
#popup a.close { top: 35px; right: 73px; width: 77px; height: 28px; background: transparent url('/images/tap/lay-pop-close.png') no-repeat right top; position: absolute; cursor: pointer; }
#popup a.close span { display: none; }
#popup table { width: auto; border-collapse: collapse; }
#popup td { padding: 0; border: 0; vertical-align: middle; }
#popup td h1 { margin: 30px 0 0 0; vertical-align: middle; padding-right: 25px; }
#popup td.cell1x1 { width: 48px; height: 75px; background: transparent url('/images/tap/lay-pop-background1x1.png') no-repeat left top; }
#popup td.cell1x2 { background: transparent url('/images/tap/lay-pop-background1x2.png') repeat-x center top; }
#popup td.cell1x3 { width: 73px; height: 75px; background: transparent url('/images/tap/lay-pop-background1x3.png') no-repeat right top; }
#popup td.cell2x1 { width: 48px; background: transparent url('/images/tap/lay-pop-background2x1.png') repeat-y left center; }
#popup td.cell2x2 { background: #202020; }
#popup td.cell2x3 { width: 73px; background: transparent url('/images/tap/lay-pop-background2x3.png') repeat-y right center; }
#popup td.cell3x1 { width: 48px; height: 85px; background: transparent url('/images/tap/lay-pop-background3x1.png') no-repeat left bottom; }
#popup td.cell3x2 { background: transparent url('/images/tap/lay-pop-background3x2.png') no-repeat left bottom; }
#popup td.cell3x3 { width: 73px; height: 85px; background: transparent url('/images/tap/lay-pop-background3x3.png') no-repeat right bottom; }
#popup iframe { width: 100%; height: 100%; padding: 0; margin: 0; border: 0; }





#newsletter {
  padding: 10px 20px 20px 155px;
  background: #1b1b1b url('/images/tap/lay-envelope.png') no-repeat 40px center;
}
#newsletter div.message {
  top: 30px;
  right: 30px;
  width: 300px;
  margin: 0;
  padding: 30px 25px;
  background: #252525;
  border: 1px solid #2d2e2d;
  position: absolute;
  text-align: center;
}



form,
form p,
form input { vertical-align: middle; }

#frm-newsletter {
  top: 30px;
  right: 30px;
  margin: 0;
  padding: 20px 25px;
  background: #252525;
  border: 1px solid #2d2e2d;
  position: absolute;
}
#frm-newsletter input.text {
  width: 200px;
  padding: 5px 5px;
  height: 20px;
  background: #fff;
  border: 1px solid #d3d4d3;
}
#frm-newsletter input.button {
  height: 31px;
  width: 98px;
  padding: 0 0 2px;
  color: #fff;
  font-size: 90%;
  background: #0084cb url('/images/tap/lay-btn-blue.png') no-repeat;
  border: none;
}
#frm-newsletter p.error {
  margin-top: -5px;
  padding-bottom: 5px;
}


.video { text-decoration: none; }


#container:after,
#wrapper:after,
#subheader:after,
.box:after,
.clearfix:after {
  clear: both; 
  height: 0; 
  content: "."; 
  display: block; 
  font-size: 0;
  line-height: 0;
  visibility: hidden;
}