@import url('reset.css');
@import url('prettyPhoto.css');

/*
		studiofabryka.pl
		mc, ekoemiter, 1 sept 2011
*/






/*
		--- classes, colors, constants
*/

.full {
	position:relative;
	width:100%;
	float:left;
}

.border(@radius) {
	border-radius: @radius;
	-moz-border-radius: @radius;
	-webkit-border-radius: @radius;
}

::-moz-selection {color: #fff; background: #ff7700;}
::selection {color: #fff; background: #ff7700;}

body {font-family:Arial, sans-serif;}

@yellow: #ffef50;
@darkgreen: #37570c;
@txtgreen: #547b20;
@lmenugreen: #0a571a;




/*
		--- basic
*/

body {background: url(../images/repeater.png) top repeat-y;}
#bg {
	float:left;
	width:100%; min-height:686px;
	background: url(../images/bg.jpg) top no-repeat;
}

.content {
	margin:0 auto;
	width:966px;
}

.logotop {
	position: absolute;
	top:1px; left:2px;
	z-index:3000;
}

header, article, footer {.full;}






/*
		--- typografia
*/


h1 {
		float:left;
		font-weight:normal;
		font-size:26px;
		color: @darkgreen;
		margin:15px 0 15px 13px;
	}

h2, h3, h4, h5 {color: @darkgreen; margin:.5em 0;}

section  {
	h2 {
		font-size:18px;
		font-weight:normal;
	}

	h3 {font-size:15px;}
	h4 {font-size:13px;}
	h5 {font-size:12px;}


	li {margin-left:30px;}

	ul li {list-style:square;}
	ol li {list-style: decimal;}

	a {
		color: #ff6600;

		&:hover {text-decoration: underline;}
	}

	p, ul, ol {
		font-size:11px;
		line-height:1.4em;
		color:@txtgreen;
		padding-bottom:1em;
	}

	td p {padding-bottom:0;}

	td {
		font-size:11px;
		line-height:1.4em;
		color:@txtgreen;
		padding:5px;
		border:1px solid #BEC9A9;
	}

	table {
		margin:10px auto;
		border-spacing: 2px;
		border-collapse: separate;
	}
}






/*
		--- header
*/

header {
	height:190px;
	overflow:hidden;
	width:100%;
	float:left;
	position: relative;
}

#logo {float:left;}

nav {
	float:left;
	clear:left;
	margin:4px 0 0 6px;
	position: relative;
	z-index:200;

	li {
		float:left;
		margin:0 5px;
	}

	a {
		font:bold 12px/1.2 tahoma, arial, sans-serif;
		text-transform: uppercase;
		color: white;
		padding:1px 5px;
	}

	.hit a, a:hover {
		background: #177f2d;
	}
}

.family {
	position: absolute;
	top:0; right:5px;
}





/*
		--- article
*/

article {
	width:102%;
	margin-top:3px;

	.sections {
		float:left;
		width:706px;
		margin-left:-4px;
		padding-bottom:25px;
		/* border-bottom:20px solid #dbe7c3; */
	}
	section {
		float:left;
		width:658px;
		margin-left:15px;
	}

}

.more {
	font:bold 9px/1.3 Verdana, arial, sans-serif;
	color: @yellow;
	float:right;

	&:hover {
		opacity:.7;
		filter:alpha(opacity=70);
	}
}





/*
		--- główne kategorie
*/

.kategorie {
	width:101%;

	a, a:hover {
		text-decoration: none !important;
	}

	li {
		float:left;
		position: relative;
		width:218px;
		height:218px;
		list-style:none;
		margin:0;
		border:1px solid white;
	}

	img {
		position: absolute;
		top:0; left:0;
		z-index:10;
	}

	span {
		text-align:center;
		display:block;
		padding:8px 10px;
		width:198px;
		min-height:30px;
		color: white;
		font-weight:bold;
		font-size:14px;
		background: url(../images/green-transp.png) 0 0;
		position: absolute;
		bottom:0; left:0;
		z-index:20;

		text-shadow: 0 1px 3px #415E1D;

		em {
			float:left;
			padding:10px 0 0 0;
			width:100%;
			font-weight:normal;
			font-style:normal;
			font-size:11px;
			display:none;
		}
	}
}








/*
		--- aside
*/

aside {
	float:left;
	width:275px;
}

.realizacje {
	float:left;
	margin:10px 0 10px 45px;

	h4 {
		color:white;
		font-size:14px;
		padding-bottom:5px;
	}
}

#news {
	float:left;
	width:100%;
	margin:0 12px;

	h2 {
		color:white;
		font-size:24px;
		font-weight:normal;
		background: #80a14f;
		float:left;
		width:247px;
		height:32px;
		line-height:1.4em;
		text-indent:10px;
		margin-bottom:10px;
	}

	.news {
		float:left;
		width:86%;
		margin:0 10px 10px 10px;
		padding-bottom:15px;
		border-bottom:1px dashed @txtgreen /1.2;

		small {
			font: 9px/1.2 Verdana, arial, sans-serif;
			color:white;
		}

		h5 {
			color: @yellow;
			margin:.2em 0;
			font:bold 14px/1.1 Verdana, arial, sans-serif;
		}

		p {
			font: 11px/1.3 Verdana, arial, sans-serif;
			color:white;
		}
		.more {margin-top:4px;}
	}
}





/*
		--- Vertical accordeon menu
*/

.vert {
	float:left;
	width:100%;
	margin-left:-20px;

	a {cursor:pointer;}

	.lvl1 > li {margin:5px 0;}

	.lvl1 > li > a {
		display:block;
		text-transform: none;
		color: @lmenugreen;
		width:276px; height:51px;
		background: url(../images/aside-category-bg.png) top no-repeat;

		img, span {float:left;}

		img {
			border:1px solid @lmenugreen;
			margin:-4px 0 0 5px;
		}

		span {
			display:block;
			width:200px;
			height:auto;
			text-transform:uppercase;
			font-size:10px;
			margin:15px 5px 0 8px;
		}
	}


	.lvl2 {
		float:left;
		width:211px;
		margin:5px 0 5px 80px;
	}

	.lvl2 li {
		float:left;
		clear:left;
		width:100%;
		margin:0;
		border-top:1px solid #405b15;
	}

	.lvl2 li:first-child {border:0;}

	.lvl2 a {
		float:left;
		height:auto;
		background: none;
		text-transform: none;
		font-weight:normal;
		padding:5px;
		width:201px;
		background: #54781d;
	}

	.lvl2 .hit a, .lvl2 a:hover {background: #E2EDCD; color: @lmenugreen;}
}






/*
		--- Footer
*/

footer {
	background: #5b8322;
	float:left;
	width:100%;
	padding:5px 0;
	margin-left:12px;
	position: relative;
}

address {
	font:normal normal 11px/1.2 Tahoma, arial, sans-serif;
	color: white;

	strong {text-transform: uppercase;}

	float:left;
	margin:10px 0 10px 20px;
}

#madeby {
	font-size:10px;
	color:white;
	position: absolute;
	bottom:10px;
	right:20px;

	span {
		float:left;
		margin:5px 3px;
	}
}






/*
		--- Formularz
*/

#contact-form {
	float:left;
	clear:right;
	width:660px;
	}
	fieldset {
		float:left;
		width:60%;
	}
	fieldset:first-child {width:40%;}
	.subject {display:none;}
	label, .label {
		float:left;
		width:100%;
		margin:3px 0;
		}
		label span, .label span {
			float:left;
			width:100%;
			color: #333;
			font-size:12px;
			padding:3px;
		}

		label input, .label input, textarea {
			float:left;
			width:90%;
			padding:3px 6px;
			border:1px solid #ccc;

			border-radius:5px;
			-moz-border-radius:5px;
			-webkit-border-radius:5px;
		}

		textarea {
			width:97%;
			height:110px;
		}

		form button {
			float:left;
			background:#FE620F;
			color: #fff;
			font-size:13px;
			font-weight:bold;
			padding:5px 10px;
			border-radius:5px;
			-moz-border-radius:5px;
			-webkit-border-radius:5px;
		}

		form #error,
		form #ok {
			display:none;
			float:left;
			padding:7px 10px;
			border-radius:5px;
			-moz-border-radius:5px;
			-webkit-border-radius:5px;
			background: #ff0000;
			margin-left:5px;
			color: #fff;
			font-weight:bold;
			font-size:13px;
		}

		form #ok {background: #1fac06;}

		.error-input {
			border:1px solid #ff0000;
			background: #ffe1e1;
		}





/*
		--- ankiety
*/

.spec_form {
	width:103% !important;


	fieldset {
		width:49% !important;
		float:left;
	}

	label, .label {padding:5px 0;}

	input.short {
		width:25px;
		float:left;
		clear:none;
	}

	span.left, span.right {
		float:left; clear: none;
		width: auto;
		line-height:1.7em;
		margin:0 5px;
	}

	span.medium {
		width:195px;
	}

	input[type="radio"], input[type="checkbox"] {
		float:left; clear:left;
		width:15px;
		margin:4px 0 0 0;
	}

	select {
		border:1px solid #ccc;
		padding:3px;
		.border(5px);
		color: #333;
		font-size:12px;
	}

	.full {
		width:100% !important;
		margin-top:15px;
		padding-top:15px;
		border-top:1px dashed #ccc;

		button, #ok, #error {float:right;}
		#ok, #error {margin-right:10px;}
	}

	.morepadding {
		padding:10px 0 !important;

	}
}






/*
		--- Gallery
*/

.gallery {
	width:101%;
	margin-top:15px;
	margin-bottom:10px;

	ul {
		margin:0;
		width:100%;
	}

	li {
		list-style:none;
		padding:0;
		float:left;
		margin:0 0 14px 14px;
	}

	li:first-child {margin-left:0;}

	img {
		max-width:150px;
		padding:2px;
		border:1px solid @darkgreen;
	}
}

.currentTextHolder {
	font-size:13px;
	color: #666;
	float:left;
	text-align: center;
	margin:1px 5px !important;
	text-indent:0;
	font-family: arial, sans-serif;
}

.pp_description {
    color: #666666;
    float: left;
    font-size: 12px;
    margin: 0;
    padding: 3px 0;
    text-indent: 0;
}





/*
		--- downlaod
*/

#download .bigger a {
	font-size:13px;
	font-weight:bold;

	&:hover {
		color: #ff7700;
		text-decoration: none;
	}
}

#download .bigger li {background: url(../images/file.png) 0 2px no-repeat;}

#download li {
	background: url(../images/file.png) 0 0 no-repeat;
	list-style:none;
	padding:5px 0 5px 25px;
	margin-left:10px;

	a {
		color: @txtgreen;
	}
}