/*--------------------------------------------------------
	css theme name: coccodrillo
	author: bartosz mediger (http://mediger.net)

	created: aug 10, 2010


*/



/********************************      Basic Structure      ********************************/


* { margin: 0; padding: 0; }


address {
	float: left;
	font-style: normal; }


blockquote { 
	width: 100%; float: left;
	line-height: 18px;
	text-align: left; }
	
	blockquote p {
		padding: 0 0 20px 0;;
		font-size: 18px; }
	

body {
	min-height: 987px; _height: 987px;
	background: url(../images/backt.jpg) no-repeat top center;
	font: 14px/22px Arial, Helvetica, sans-serif; }


body, html { width: 100%;  height: 100%; }



button, .button {
	float: left;
	width: 54px; height: 28px;
	background: url(../images/btn.gif);
	border: none;
	line-height: 28px;
	text-align: center;
	text-transform: uppercase;
	font-family: Tahoma;
	font-size: 10px;
	cursor: pointer;
	color: white; }

	button:hover,
	.button:hover {
		background-position: 0 -28px;
		text-decoration: none;
		color: white; }



fieldset { border: none; }


	
html {
	background: url(../images/backc.gif);
	overflow: auto;
	overflow-x: hidden;
	color: #333; }



img { border: none; }



ins { text-decoration: none; }




p {
	padding-bottom: 15px; }

	p img { float: left; margin: 0 15px 15px 0; }




textarea {
	font-size: 11px;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	color: #333;
	overflow: auto; }


ul, ol { margin: 0 0 15px 20px; }

ol { float: left; }







/********************************      Elements styling      ********************************/

h2, h4, h5 {
	font-weight: bold;
	color: #333; }
	
h1, h2, h3, h5, h6 { font-family: Georgia; }

h1 {
	float: left;
	width: 100%;
	font-size: 36px;
	font-weight: normal;
	line-height: 10px;
	color: #cb002b; }
	
	h1 span { font-size: 14px; }

h2 {
	font-size: 20px;
	font-weight: normal; }

h3 { font-size: 18px; font-weight: normal; }

h4 { font-size: 14px; font-weight: bold; }

h5 { font-size: 12px; line-height: 17px; }

h6 { font-size: 11px; float: left; }


a {
	text-decoration: none;
	color: #cb002b }
	
	a:hover {
		text-decoration: underline;
		cursor: pointer;
		color: #cb002b; }










.back,
#buttons { 
	float: left;
	width: 535px;
	border-top: 1px solid #ccc;
	margin: 25px 15px 0 0;
	padding: 8px 0 0 0; }

	.back a,
	#buttons a {
		float: right;
		font-size: 10px;
		font-weight: bold;
		color: #cb002b }
		
		#buttons a:hover { text-decoration: underline; }
	
	#buttons .prev { margin: 0 5px 0 0; }
	
	#buttons .prev:before { content: "« "; }
	#buttons .next:after { content: " »"; }






#center {
	position: relative;
	width: 980px;
	margin: 0 auto; }







#container {
	float: left;
	width: 980px; min-height: 580px; _height: 580px;
	position: relative;
	padding: 95px 0 40px 0;
	overflow: hidden; }









#dostepne {
	float: left;
	width: 415px;
	padding: 30px 0 0 20px; }

	#dostepne a {
		font-family: Georgia;
		font-size: 12px;
		text-transform: uppercase;
		color: #333; }

	#dostepne dl {
		float: left;
		width: 200px;
		margin: 0 0 25px 0; }

	#dostepne dd {
		float: left;
		width: 188px;
		background: url(../images/star.gif) no-repeat left 5px;
		padding: 0 0 0 12px;
		line-height: 17px; }
	
	#dostepne dt { 
		float: left;
		background: none !important;
		font-family: Georgia;
		font-size: 18px;
		color: #00a6b7; }
		
	/*#dostepne dl.red { float: right !important; }*/
	
		#dostepne dl.red dt { color: #cb002b !important; }











#foot {
	float: left;
	width: 100%;
	background: url(../images/foot.jpg) no-repeat center;
	line-height: 18px;
	font-family: Georgia; }
	
	#foot a { color: #bcc588; }
	
	#foot h4, #foot dt {
		padding: 0 0 6px 0;
		text-transform: uppercase;
		font-size: 14px; font-weight: bold; }

	#foot .content {
		position: relative;
		width: 980px; height: 167px;
		margin: 0 auto;
		padding: 105px 0 0 0; }


	#copy a:hover { border-bottom: 1px solid #333; }

	/*****************      Boxes       *****************/

	#copy {
		float: left;
		width: 243px;
		font-size: 13px;
		color: white; }

	#na-skroty {
		position: absolute; left: 0; top: 187px;
		width: 295px;
		list-style: none;
		margin: 0; }

		#na-skroty a {
			font-family: Arial;
			font-size: 11px;
			line-height: 10px;
			color: #d8d098; }
			
			#na-skroty a:before { content: "> "; }



	#nasi { 
		position: absolute; top: 106px; left: 382px; z-index: 10;
		background: url(../images/nasi-partnerzy-pl.png);
		width: 216px; height: 113px; }

		#nasi a {
			position: absolute;
			display: block;
			text-indent: -10000px; }

		#nasi .qlturka,
		#nasi .orange { 
			left: 0; top: 25px;
			width: 106px; height: 42px; }
			
		#nasi .orange { top: 70px; }
		
		#nasi .pampers {
			right: 0; top: 50px;
			width: 100px; height: 40px; }


	#pytania {
		width: 214px; height: 187px;
		background: url(../images/phone.gif) no-repeat left 3px; }











#flags {
	position: absolute; top: 37px; right: 231px;
	width: 99px; height: 29px; }

	#flags a {
		float: left;
		width: 33px; height: 29px;
		background-repeat: no-repeat !important;
		text-indent: -10000px;
		_filter:alpha(opacity=50); -moz-opacity: .5; opacity: .5; }

	#flags a.hit,
	#flags a:hover { _filter:alpha(opacity=100); -moz-opacity: 1; opacity: 1; }

	#flags a.pl { background: url(../images/flag-pl.gif); }
	#flags a.gb { background: url(../images/flag-gb.gif); }
	#flags a.ro { background: url(../images/flag-ro.gif); }








#gallery {
	float: left;
	width: 100%; }

	#gallery a {
		float: left;
		margin: 0 5px 0 0; }

	#gallery a:hover { _filter:alpha(opacity=80); -moz-opacity: .8; opacity: .8; }


	#gallery .item {
		float: left;
		position: relative;
		width: 175px;
		text-align: center; }
	
		#gallery .item .printer {
			position: absolute;
			top: 8px; right: 0;
			width: 32px; height: 32px;
			background: url(../images/printer.gif);
			margin: 0;
			border: 1px solid #ccc; }
	
		#gallery .item .printer:hover { _filter:alpha(opacity=80); -moz-opacity: .8; opacity: .8; }


	#dla-starszakow .item { width: 191px; }
	#dla-starszakow .item .printer { top: 0px; right: 7px; }







#garment {
	float: left;
	width: 573px;
	padding: 0 0 25px 0; }

	#garment td {
		padding-right: 45px;
		font-size: 12px; line-height: 18px; }

	#garment .photo {
		padding: 0 10px 0 0;
		text-align: center }









div#kontakt { width: 573px; }

	div#kontakt a { text-decoration: underline; }

	div#kontakt h4 { font-size: 16px; }

	div#kontakt .left {
		float: left;
		width: 200px; }
		
	div#kontakt .right {
		float: right;
		width: 330px; }








#kleks {
	position: absolute; top: 50px; right: 0; z-index: 100;
	width: 157px; height: 186px;
}




/* formularz kontaktowy */

#formularz {
	float: left;
	width: 550px; }

#kontakt .button {
	float: right;
	border: 0 none;
	width: 77px; height: 28px;
	background: url(../images/btn_send.png);
	margin: 0 30px 0 0;
	text-indent: -10000px; }
	
	form#kontakt .button:hover { background-position: 0 -28px; }	


#kontakt fieldset {
	border: 0;
	width: 100%; }

#kontakt .propozycja { font-size: 20px; }

#kontakt input { line-height: 14px; }

#kontakt input, select {
    float: left;
    width: 165px;
    padding: 3px;
	border: 1px solid #ccc; }
	 
	#kontakt textarea {
	 	width: 360px;
		height: 140px;
		float: left;
		border: 1px solid #cfcfcf;
		padding: 4px; }


#kontakt label {
    float: left;
    width: 100%;
    clear: both;
    margin: 1px;
    display: block;
    padding: .3em 0 .3em 0;
    cursor: pointer; }

   #kontakt label span {
        float: left;
        width: 25%;
        margin: 1px;
        padding: 0 /*3px*/10px 0 0;
        text-align: right; line-height: 14px; }



  








#left {
	float: left;
	width: 400px; }






#logo {
	position: absolute; top: 0; left: 0; z-index: 10;
	display: block;
	width: 298px; height: 55px;
	background: url(../images/logo-cc.png);
	text-indent: -10000px; }








#menu { }

	.dzial { width: 162px; background: url(../images/m_dzial-pl.gif); }
	.katalog { width: 103px; background: url(../images/m_katalog-pl.gif); }
	.kolekcja { width: 112px; background: url(../images/m_kolekcja-pl.gif); }
	.klub { width: 205px; background: url(../images/m_klub-pl.gif); }
	.ofirmie { width: 104px; background: url(../images/m_ofirmie-pl.gif); }
	.sklepy { width: 88px; background: url(../images/m_sklepy-pl.gif); }
	

	#menu a:hover { background-position: 0 -38px !important; }










#menu-info { position: absolute; top: 12px; left: 350px; }


	#menu-info a {
		padding: 0 10px 0 10px;
		border-right: 1px solid #b9baab;
		font-family: Georgia;
		font-size: 10px;
		text-transform: uppercase;
		color: #b9baab; }
	
	#menu-info a:hover,
	#menu-info a.hit {
		color: #dcdcdc;
		text-decoration: none; }
	








#nav, #nav * { color: #666; }

#nav a:hover { text-decoration: none; color: #5b005a; }








#pages {
	float: left;
	width: 573px;
	padding: 15px 0 25px 0;
	text-align: center; }

	#pages a {
		border: 1px solid #ccc;
		padding: 1px 3px 1px 3px; }
		
	#pages a:hover {
		background: #efefef;
		text-decoration: none; }
	
	#pages a.hit {
		background: #5b005a;
		color: #fff; }

	#pages .arleft, #pages .arleft:hover {
		width: 17px; height: 20px;
		background: url(../images/arrow-left.gif) no-repeat left 8px;
		padding: 5px 12px 5px 8px;
		border: none; }
		
	#pages .arright, #pages .arright:hover {
		width: 17px; height: 20px;
		background: url(../images/arrow-right.gif) no-repeat right 8px;
		padding: 5px 8px 5px 10px;
		border: none; }

		 #pages .arleft:hover,
		 #pages .arright:hover { _filter:alpha(opacity=80); -moz-opacity: .8; opacity: .8; }








#polska { position: absolute; left: -30px !important; }







#preview { float: left; }





#printImages { display: none; }





#products {
	filter: left;
	width: 100%;
	padding: 10px 0 0 0; }

	#products a {
		float: left;
		background: url(../images/dots.gif) repeat-x;
		margin: 5px; }

		#products a:hover { text-decoration: none; }

	#products a img {
		float: left;
		padding: 3px; }

	#products a:hover img { _filter:alpha(opacity=80); -moz-opacity: .8; opacity: .8; }









#qlturka {
	float: left;
	width: 160px;
	padding: 0;
	margin: 0 0 0 20px;
	font-size: 11px; }






#right {
	float: right;
	width: 550px;
	padding: 20px 0 0 0; }
	
	#right h1 {
		padding-bottom: 15px;
		text-transform: uppercase; }

	#right p { clear: both; }









#search {
	float: left;
	position: relative;
	width: 100%;
	padding: 10px 0 3em 0; }
	
	#search label {
		display: block;
		padding-bottom: 0 !important;
		text-transform: uppercase;
		font-family: Georgia; }

	#search li {
		float: left;
		position: relative;
		padding-bottom: 10px; }

	#search select {
		width: 140px;
		border: 1px solid #ccc; }

	#search ul {
		width: 150px;
		list-style: none;
		float: left;
		margin: 0 0 0 0; }
		
		#search ul label { font-size: 12px; }
	
	#search button {
		position: absolute; top: 32px; right: 20px;
		width: 77px; height: 28px;
		background: url(../images/btn_search2.png);
		text-indent: -10000px; }
		
		#search button:hover { background-position: 0 -28px; }








#slideshow {
    position:relative;
    height: 319px; }
    
    .start #slideshow { height: 345px; }

#slideshow IMG { position:absolute; top:0; left:0; z-index:8; }

#slideshow IMG.active { z-index: 10; }

#slideshow IMG.last-active { z-index: 9; }












#storeLocator {
	float: left;
	position: relative;
	width: 573px;
	min-height: 300px; _height: 300px;
	padding: 0 20px 20px 0; }

	#storeLocator .intro {
		position: relative;
		width: 500px;
		padding: 0 40px 0 0;
		float: left; }

	#storeLocator .intro img { padding: 20px 0 0 0; }

	#storeLocator .intro p {
		position: absolute; top: 70px; right: 0;
		font-size: 16px; }

	#storeLocator h2 { padding: 0 0 10px 0 }

	#storeLocator h3 { margin: 0 0 10px 0 }
	
	#storeLocator h4 {
		font-size: 20px;
		margin: 0 0 15px 0; }

	#storeLocator h5 {
		border-bottom: 1px dashed #ccc;
		padding: 0 0 2px 0;
		text-transform: uppercase; }
		
	#storeLocator p { font-size: 12px; line-height: 18px; }
	
	#storeLocator .col,
	#storeLocator .col2 {
		float: left;
		width: 250px;
		padding: 5px 30px 0 0;
		text-align: left; }
	
	#storeLocator .col .map,
	#storeLocator .col2 .map {
		position: absolute; top: 0px; right: 15px;
		display: block;
		width: 43px; height: 18px; min-height: 18px;
		background: url(../images/button_map.gif) no-repeat;
		_filter: alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7; }
		
		#storeLocator .map:hover { _filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; }
		
	#storeLocator .store { position: relative; }













#wyszukiwarka {
	position: absolute; top: 0; right: 0;
	width: 234px; height: 40px;
	background: url(../images/search-form.png); }
	
	#wyszukiwarka button { 
		float: right;
		width: 47px; height: 40px;
		background: url(../images/btn_search.png);
		text-indent: -10000px; }

	#wyszukiwarka a {
		font-family: Georgia;
		font-size: 11px;
		line-height: 12px;
		color: white; }

	#wyszukiwarka input {
		float: left;
		width: 170px; height: 18px;
		border: none;
		margin: 14px 2px 0 5px;
		outline: none;
		color: #666; }










#zajawki {
	float: left;
	width: 980px; min-height: 280px;
	background: url(../images/zajawki-bg.jpg) no-repeat top left; }

	a.item:hover { cursor: pointer; text-decoration: none; }
	.start a.item { color: #333; }
	.start a.item:hover p { text-decoration: underline; }

	#zajawki h2 {
		padding: 0 0 20px 22px;
		text-transform: uppercase;
		color: white; }
		
	#zajawki img {
		float: left;
		margin: 4px 8px 4px 0; }

	#zajawki p {
		padding: 0;
		line-height: 14px;
		font-size: 11px !important;
		font-family: Arial; }
	
	.item {
		float: left;
		width: 255px; 
		padding: 0 0 10px 0; }
		
		.item h5 {
			padding: 0 0 2px 0;
			font-weight: bold;
			text-transform: uppercase; }
		
		.start #zajawki .item {
			width: 205px;
			padding: 0 0 20px 20px; }

	#zajawki .more { float: right; }
	#zajawki .more:hover { text-decoration: underline; }



	/*****************      Boxes       *****************/

	#aktualnosci,
	#cogdziekiedy,
	#dlarodzica,
	#promocje { float: left; }

		.start #aktualnosci,
		.start #cogdziekiedy,
		.start #dlarodzica,
		.start #promocje {
			width: 225px; min-height: 213px; _height: 213px;
			padding: 0 17px 0 0; }
			
		.start #aktualnosci p,
		.start #cogdziekiedy p,
		.start #dlarodzica p,
		.start #promocje p { line-height: 14px; }

	#aktualnosci .left, #aktualnosci .right,
	#cogdziekiedy .left, #cogdziekiedy .right,
	#dlarodzica .left, #dlarodzica .right,
	#promocje, .left, #promocje .right {
		float: left;
		width: 245px;
		padding: 5px 30px 0 0; }

	#aktualnosci p,
	#cogdziekiedy p,
	#dlarodzica p,
	#promocje p { font-size: 12px; line-height: 18px; }


	#aktualnosci .more,
	#cogdziekiedy .more,
	#dlarodzica .more,
	#promocje .more {
		background-repeat: no-repeat !important;
		background-position: left 9px !important; }

	#aktualnosci .more {
		background: url(../images/arrow_black.gif) no-repeat left 8px;
		color: #000; }

	#dlarodzica .more {
		background: url(../images/arrow_green.gif);
		color: #888b54; }

	#cogdziekiedy .more {
		background: url(../images/arrow_yellow.gif);
		color: #a48e41; }


	#promocje .more {
		background: url(../images/arrow_brown.gif);
		color: #9d6e43; }


	#cogdziekiedy {
		width: 210px !important;
		margin-left: 15px; }
	
		.start #zajawki #cogdziekiedy .item {
				width: 210px;
				padding: 0 0 0 20px; }

	#promocje { float: right !important; }









#zobacz {
	float: left;
	list-style: none;
	margin: 0;
	padding: 30px 0 0 30px; }
	
	#zobacz dt, #zobacz a { font-family: Georgia; }

	#zobacz dt {
		font-size: 18px;
		padding: 0 0 10px 0;
		text-transform: uppercase;
		color: #cb002b; }

	#zobacz a { 
		font-size: 14px;
		text-transform: uppercase;
		color: #333; }
	
	#zobacz dd {
		background: url(../images/star.gif) no-repeat left 8px;
		padding: 0 0 0 12px; }









/********************************      General Classes      ********************************/

.back { float: right; margin-right: 25px; }
	
	.back a:hover { text-decoration: underline; }
	.back a:before { content: "« "; }


.baner { 
	float: left;
	width: 100%;
	text-align: center; }




.more {
	font-size: 11px;
	font-weight: bold;
	padding: 0 0 0 8px; }

	


/*
 *  formularz - jajo
 */

#formularz-jajo {float:left; width:330px; margin: 0 0 0 117px; }

#formularz-jajo fieldset {
	
	width:auto;
	padding:25px 0 25px 25px; 
	background:#92C355;
	border:1px solid #92C355;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius:5px;
	}
#formularz-jajo label {float:left; width:auto;}
#formularz-jajo span, #formularz-jajo input {
	
	float:left; clear:left;
	font:.8em/1 Tahoma;
	color:#000;
}

img#capchta {float:left; margin:0 0 0 10px;}
span#special {width:300px;}

#formularz-jajo span {padding:10px 0 5px 0;}
#formularz-jajo input {
	
	width:270px;
	padding:4px;
	border:1px solid #436F0D;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius:5px;
	color:#002800;
}

#toleft {float:left; clear:left;}
#toleft span {width:120px;}
#k_miasto {margin-left:10px;}
#formularz-jajo span.m10p {margin: 0 0 0 33px;}
#k_miasto {margin:0 0 0 30px;}
#formularz-jajo input.short {width:150px;}
#formularz-jajo input.vshort {width:80px;}
#formularz-jajo input.sendbutton {

	float:right;
	display:block;
	margin:25px 0 0 25px;
	width:130px;
	padding:3px 10px;
	background: #436F0D;
	cursor:pointer;
	color:#fff;
}



/*
 *  kupon jajo kolorowanka
 */
body.emptyBg {background:#fff !important;}
#kupon {margin:0 auto; width:566px; position:relative;}
#kupon p {font:.7em/1.2 Arial; z-index:20;}
#kupon img {position:absolute; top:0; left:0; z-index:10;}
#dane {position:absolute; z-index:20; background:#fff; top:630px; padding:0 10px;}
#numer {position:absolute; top:580px; right:5px; z-index:30;}
#numer p {z-index:30; font:bold 1em/2 Arial;}