/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
*/

* { margin: 0; padding: 0; }
body { font: 14px/2 Arial, sans-serif; }



#wrapper {background: url('img/biemmedue_logo.jpg') 50% 0% no-repeat transparent;}
#page-wrap { width: 960px; 
margin: 0px auto 20px auto;
}
#page-wrap img{
border: 1px solid #C4C4C4;
float: right;
margin: 0px 0px 10px 20px;
padding: 4px;
}
ul a li.arcotherm .image img, ul a li.arcodry .image img, ul a li.arcomat .image img {
margin: 0px auto;

text-align: center;
float:none;
}


#page-wrap li.arcotherm {color: black; margin-right: 20px !important; background: url('http://creon.pl/images/stories/stare/nagrzewnice_arcotherm.gif') 50% 95% no-repeat transparent;}
#page-wrap li.arcodry {color: black; margin-right: 20px !important;background: url('http://creon.pl/images/stories/stare/osuszacze_arcodry.gif') 50% 95% no-repeat transparent;}
#page-wrap li.arcomat {background: url('img/arcomat.png') 50% 95% no-repeat transparent;}

#page-wrap li.arcotherm img {border: 0}
#page-wrap li.arcodry  img {border: 0}
#page-wrap li.arcomat img {border: 0}


li:hover {opacity: 0.8;box-shadow: 1px 1px 24px #B5B5B5;
-moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out;
}


li {
-moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out;
border: 1px solid #C4C4C4;
border-radius: 20px;
display: inline-block;
list-style-type: none;
box-shadow: 1px 1px 14px #9E9E9E;
margin-right: 20px !important;
min-height: 380px;
padding: 15px 20px 65px;
vertical-align: top;
width: 260px;
}

#page-wrap li p {vertical-align: bottom}

li:last-child {margin-right: 0px !important;}
ul a li .image {min-height:220px}


#page-wrap-1000 { width: 1000px; margin: 60px auto; }



p, ul, h1 { margin: 0 0 20px 0; text-align: justify}


 
 

	body {
		overflow-x: hidden;
	}
	 
	#bar-ad {
		width: 416px;
		position: absolute;
		right: 0;
		top: -20px;
		font: 11px "Lucida Grande", Sans-sans-serif !important;
	}
	#bsap_aplink {
		position: absolute;
		color: #999;
		text-decoration: none;
		bottom: 8px !important;
		right: 8px !important;
		padding: 0 !important;
	}
	.bsa_it_p a:hover {
		background:none !important;
	}
	#top-bar {
background: url("http://notostudio.pl/img/header1.png") 50% 0px no-repeat transparent;
height: 150px;
padding: 0px;
position: fixed;
text-align: left;
width: 100% !important;
z-index: 6000;
min-width: 1000px;}


#top-bar-menu {
height: 30px;
margin: 0px auto;
max-width: 1000px;
position: relative;
top: 50px;
width: 100%;

}

#top-bar-menu ul  {
position: relative;
float:right;
margin-right: 10px;
 }
 
#top-bar-menu ul li {
display: inline;
padding: 0 6px;
}

#top-bar-menu ul li a {
text-decoration: none;
color: #7E7E7E;
font-weight: 700;
}

#top-bar-menu ul li a:hover {
color: black;
}
		
	#top-bar2 {
	background: url("http://notostudio.pl/img/header3.png") 50% 100% no-repeat white;
	height: 65px;
	padding: 0;
	position: static;
	padding-top: 100px;
	text-align: left;
	width: 100% !important;
	z-index: 6000;
	}	
	
	#bottom-bar {
	
	height: 230px;
	margin-bottom: 200px;
	padding: 0px 0px 15px;
	position: relative;
	text-align: left;
	min-width: 1000px;
	width: 100% !important;
	z-index: 1;
	}	
	
	
	#another-bar {
		text-align: left;
		background: #e18728;
		position: relative;
		zoom: 1;
		width: 100% !important;
		z-index: 6000;
		/* box-shadow: 0 0 10px black; */
		padding: 20px 0 15px;
	}
	#bar-inside {
		width: 960px;
		margin: 0 auto;
		position: relative;
	}
 
	#bar-buttons {
		display: inline-block;
		width: 236px;
		text-align: center;
		vertical-align: top;
		font-size: 0;
	}
	#bar-buttons a {
		font-size: 12px;
		color: white;
		display: block;
		margin: 2px 0;
		text-decoration: none;
		font: 14px "Lucida Grande", Sans-sans-serif !important;
	}
	#bar-buttons a:hover,
	#bar-buttons a:focus {
		color: #333;
	}

	#bar-badge {
		display: inline-block;
		width: 302px;
		padding: 0 !important;
		margin: 0 !important;
		background-color: transparent !important;
	}
	#bar-badge a {
		display: block;
		width: 100%;
		height: 38px;
		border-radius: 0;
		bottom: auto;
		margin: 0;
		background: url(/images/examples-logo.png) no-repeat;
		background-size: 100%;
		overflow: hidden;
		text-indent: -9999px;
	}
	#bar-badge:before, #bar-badge:after {
		display: none !important;
	}
	
	.ciag {width: 1000px; height: auto}
	
	
	#text-bar {width: 1000px; height: 50px; margin: 0 auto; color: #969798; font-size: 22px;}
	
	 
	#page-wrap #logo img {
	position: relative;
	right: 30px;
	top: 55px;
	border: 0;

	}
 
   
   #page-wrap #logo img:hover {opacity: 0.8}
   
   #toTop {
	width:100px;
        border:1px solid #ccc;
        background:#f7f7f7;
        text-align:center;
        padding:5px;
        position:fixed; /* this is the magic */
        bottom:10px; /* together with this to put the div at the bottom*/
        right: 20px;
        cursor:pointer;
        display:none;
        color:#333;
        font-family:verdana;
        font-size:11px;
}


.tabelawn1{padding: 20px 0 0 20px}
.tabelawn2{margin: 20px 0 0 0px;}
.tabelawn3{margin: 20px 0 0 0px; position:relative; left :-20px}
.tabelawn4{margin: 20px 0 0 0px;}


a {color: black; text-decoration: underline;}
a:hover {color: #686868; text-decoration: underline;}