/* CSS Document */



/*------------------*/
/*	MENU
/*------------------------------------------------------*/

body {background:#87888A;  text-shadow: none ;}
#logo {position: relative; z-index: 6666;}
#logo h1 {color: #404245; float: left; font: bold 22px/48px Verdana,Helvetica,Sans-serif; height: 48px; margin: 0;}

.pages > .fogg-path {
background:  url(../img/bg_woda.jpg) center top no-repeat;
  height: 100% !important;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

#icon-slider {left: 50%; margin-left: 440px; position: fixed; top: 40%; z-index: 6666;}
#icon-slider ul li a {background: url(../img/buttons/sprite-slider-nav.png) no-repeat; display: block; width: 38px; height: 42px; margin-bottom:1px;  position: relative;}
#icon-slider ul li a:hover {text-decoration: none;}
#icon-slider ul li.page1 a {background-position: 0 0;}                  #icon-slider ul li.page1 a:hover {background-position: -39px 0 !important;}
#icon-slider ul li.page2 a {background-position: 0 -43px;}              #icon-slider ul li.page2 a:hover {background-position: -39px -43px !important;}
#icon-slider ul li.page3 a {background-position: 0 -86px;}              #icon-slider ul li.page3 a:hover {background-position: -39px -86px !important;}
#icon-slider ul li.page4 a {background-position: 0 -129px;}             #icon-slider ul li.page4 a:hover {background-position: -39px -129px !important;}

#icon-slider ul li.page1 a.active {background-position: -78px 0;}                  
#icon-slider ul li.page2 a.active {background-position: -78px -43px;}             
#icon-slider ul li.page3 a.active {background-position: -78px -86px;}              
#icon-slider ul li.page4 a.active {background-position: -78px -129px;}

#icon-slider ul li a span {display: none; font-family: arial, sans-serif; font-size: 12px; color:#014577; background: #aed5e9; position: absolute; left:-115px; padding:5px; border-radius:5px; width: 100px; text-align: center;}
#icon-slider ul li a span:after {display: block; position: absolute; bottom:-10px; right:0; content:url(../img/arrow_tooltip.png)}
#icon-slider ul li a:hover span {display: block; text-decoration: none;  }            

.top header {position: absolute; top:0; width: 100%;}

.top header .slider {height: 498px; width: 1200px; position: absolute; top:0; left: 50%; margin-left:-600px; z-index: 2;}
.top header .slider > div > div {height: 498px; width: 1200px;}
.top header .slider .slide1 {background: url(http://eksperci-od-zmywarek.pl/porady-ekspertow/wp-content/themes/zmywarki/img/slide/slide1.jpg) ;}
.top header .slider .slide2 {background: url(http://eksperci-od-zmywarek.pl/porady-ekspertow/wp-content/themes/zmywarki/img/slide/slide2.jpg) ;}

.top header .slider .slide1 .text {position: relative;}

.top header .slider .slide h1 {font-size: 50px; font-weight: 200; color:#fff; line-height: 1.0em; margin-bottom:20px; position: absolute; left:585px; top:232px}
.top header .slider .slide p {font-size: 14px; line-height: 18px; color:#fff; position: absolute; left:585px; top:355px;}
.top header .slider .slide p + a {font-size: 13px; background: url(http://eksperci-od-zmywarek.pl/porady-ekspertow/wp-content/themes/zmywarki/img/arrow_dark.gif) no-repeat right center; padding-right:10px; color:#0e293c; position: absolute; left:585px; top:430px;}


.top header div.mainSearch {margin: 4px 6px 0 0; overflow: hidden; position: absolute; top:1px; right:0; z-index: 6666;}
.top header div.mainSearch div { border: 1px solid #003B6A; float: left; height: 19px; width: 128px; background:  url(../img/bg-search.png) no-repeat; }
.top header div.mainSearch div input {background: none; border: 0 none; color: #808285; font-size: 11.5px; height: 15px; line-height: 15px; margin: 0; padding: 3px 3px 0; width: 122px; border-radius:0}
.top header div.mainSearch button.searchGo {background: url("../img/bg-searchGo.png") no-repeat; display: block; float: left; height: 21px; overflow: hidden; text-indent: -9000pt; width: 24px;}


#mainpage section.pages {background: #fff ;  height: 100% !important;}
#mainpage section.pages .page {position: relative; z-index: 2;}
#slide4 {background: url(../img/bg_zmywarka.jpg) top no-repeat ; height: 100% !important; padding-bottom:10px;}


#mainpage .page.active .button-nav {position: fixed; bottom:0; left:0; width: 100%; height:64px; background:  url(../img/sg_shadowpage.png) repeat-x;}
#mainpage .page.active .button-nav span {background:  url(../img/arrow_slider_down.png) no-repeat; width: 63px; height: 38px; display: block; margin: 20px auto 0; cursor: pointer;}

#homepage .wrapper {padding-top:100px;}
#homepage .text {padding:130px 140px 0 0 ;}

#homepage .buttons {position: absolute; bottom:15%; width:730px; left:50%; margin-left:-365px;}
#homepage .buttons > div {position: relative; height: 120px;;}
#homepage .buttons .button {text-indent: -9999px; height: 43px; display: block; position: absolute; bottom:0; padding:0; overflow: visible;}

#homepage .buttons .block1 h4 {color:#014f89; margin-top:25px;}
#homepage .buttons .block3 h4 {color:#f23d40;}

#homepage .buttons h4 {font-family: arial, sans-serif; font-size: 20px; text-align: center; font-weight: 700;}
#homepage .buttons h4 small {font-weight: 700; color:#000; font-size: 12px; display: block;}

#homepage .buttons .button img {display: block; left: -32px; position: absolute; top: -10px;}

#homepage .buttons .button1 {background:  url(../img/buttons/button1_slide1.png) no-repeat; width:225px;}
#homepage .buttons .button2 {background:  url(../img/buttons/button2_slide1.png) no-repeat; width:225px;}
#homepage .buttons .button3 {background:  url(../img/buttons/button3_slide1.png) no-repeat; width:215px; left:10px;}

#slide2 .button {display: block; height: 43px; margin: 0 auto; width: 182px;}
#slide2 .button1 {background:  url(../img/buttons/button1_slide2.png) no-repeat; }
#slide2 .button2 {background:  url(../img/buttons/button2_slide2.png) no-repeat; left:-25px;}
#slide3 .button1 {background:  url(../img/buttons/button1_slide3.png) no-repeat; width: 215px; height: 43px; display: block; position: absolute; top:370px; left:85px}
#slide4 .button1 {background:  url(../img/buttons/button1_slide2.png) no-repeat;  width: 182px; height: 43px; display: block; }

#slide2 .wrapper {padding-top:60px;}
#slide3 .wrapper {padding-top:110px;}
#slide4 .wrapper {padding:145px 0 0 115px;}

#slide4 .columns .columns a {text-decoration: none;}
#slide4 .columns .columns span {font-family: tahoma, Geneva, Verdana, sans-serif; font-size:12px; text-align: center; color:#22628c; display: block;}
#slide4 .columns .columns span:after {content:url(../img/arrow_red.png)}

#slide4 footer {background: #030a5e; padding:0 5px;}


#footer {position: relative; z-index: 6666;}
#footerOptions {border-bottom: 1px solid #C3C3C4; height: 30px; padding: 0 10px;}
#footerOptions a {background-image:  url(../img/footer-opts.png) ; background-repeat: no-repeat; color: #FFFFFF; display: block; float: left; font-size: 12px; font-weight: bold; height: 30px; line-height: 30px; margin-left:15px;}
#footerOptions a:hover {color: #E1E1E2; text-decoration: none;}
.scrollToTop {background-position: 0 13px; padding-left: 12px; margin:0 !important}
.fPrint {background-position: 0 -416px; padding-left: 22px;}
.fYouTube {background: url("../img/footer_youtube.png") no-repeat 0 6px !important; padding-left: 19px;}
.fFacebook {background: url("../img/footer_facebook.png") no-repeat 0 6px !important; padding-left: 12px;}
.fRecommend {background-position: 0 -59px;padding-left: 25px;}
#copy {color: #C3C3C4; font: bold 10px/10px Arial; padding: 20px 0 30px 10px;}
#copy a {text-decoration: none;}


#access {position: relative;}

#access > ul {
	list-style: none;
	font-weight: normal;
	position: relative;
	font-family: tahoma, Arial, sans-serif;
	margin: 0;
	list-style-type: none;
	letter-spacing: normal;
	position: relative;
	text-align: center;
	z-index: 1001;
	margin: 0;
  padding:0;
  height: 29px;
  position: relative;
  border-bottom:1px solid #0e293c;
  background:  url(../img/bg-mainnav.png) top repeat-x;
  width: 100%;
}
#access ul > li {
	position: relative;
	float: left;
  display: block;
  padding: 0;
  white-space: normal;
	z-index: 101;
	margin: 0;
  color:#fff; 
  font-size: 13px;
  vertical-align: middle;
  overflow: visible;
  padding:0;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight:600 !important;
  text-shadow:none;
}

#access > ul > li + li > a {border-left:1px #477b9f solid;}


#access > ul > li > a {

	text-decoration: none;
	line-height: 1;
	color: #fff;
  padding:9px 20px 8px;
  margin:0;
  text-align: center;
  vertical-align: middle;
  display: table-cell;
   background:  url(../img/bg-mainnav.png) top repeat-x;
}

#access > ul > li > a:hover, #access > ul > li.active > a, #access > ul > li:hover > a  {background-position: left -30px; color:#003B6A;}

#access > ul > li.children > a {padding-right:25px}
#access > ul > li.children > a:after {
background:  url(../img/arw-mainnav.png) no-repeat; content:''; position: absolute; right:10px; top:0; height: 20px; width: 7px;
}
#access > ul > li.children > a:hover:after, #access > ul > li:hover > a:after, #access > ul > li.active.children > a:after {background-position: left -30px;;}

#access > ul li > ul {margin: 0; position: absolute; top: 100%; width: 200px; background-color:#fff; border:1px #000 solid; border-top:none; box-shadow:0 4px 6px #aaa; -ms-box-shadow:0 4px 6px #aaa}

/* submenu */
#access ul li > ul {visibility: hidden;}
#access ul li:hover > ul {visibility: visible;}
#access ul li li {float: none; clear: both; text-align: left; }
#access ul li li a {padding:5px 10px 5px 20px; display: block; background:  url(../img/arw-mainnav2.png) no-repeat 10px 10px; color:#404245; }
#access ul li li a:hover {text-decoration: none;}

#access > ul > li.active {}


* html #access ul {
	height: 1%;
}


.container.top {}
.container.content {width: 981px; margin: 0 auto;}
#footer .wrapper {width: 981px;}
.container.footer {} 
.wrapper {position: relative;}



/* Scroll */
#scrollbar {width: 100%;  clear: both; margin: 20px 0 10px; position: relative; }
#scrollbar .viewport { width: 99%; height: 315px; overflow: hidden; position: relative; }
#scrollbar.scrollsmall .viewport {height: 85px;}
#scrollbar .overview { list-style: none; position: absolute; left: 0; top: 0; }
#scrollbar .thumb .end,
#scrollbar .thumb { background-color: #626258; }
#scrollbar .scrollbar { position: absolute; float: left; width: 15px; left:-20px;}
#scrollbar .track { background-color: transparent; height: 100%; width:13px; position: relative; padding: 0 1px; }
#scrollbar .thumb { height: 20px; width: 13px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#scrollbar .thumb .end { overflow: hidden; height: 5px; width: 13px; }
#scrollbar .disable{ display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }