@white:#ffffff;
@black:#000000;
@grey:#444645;
@darkgrey:#121312;
@lightg: #f0f0f0;
@lightgrey:#e1e1e1;
@lightgrey2:#d9d9d9;
@fontgrey: #636363;
@fontgrey2:#7A7A7A;
@fontgrey3:#aaaaaa;
@ssp:'Source Sans Pro', sans-serif;
@extralight:"K-ExtraLight";

@font-face{
	font-family: "K-ExtraLight";
	src: url('../fonts/KozGoPr6N-ExtraLight.otf')  format('opentype');
	src: url('../fonts/KozGoPr6N-ExtraLight.woff');
}

html,
body{
	margin:0;
	padding:0;
	position: relative;
	width:100%;
	height:100%;
	font-smoothing: always;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
	font-family: @ssp;
	.nicescroll-rails{
		z-index: 99999;
	}
	a{
		&:focus{
			outline: none;
			text-decoration: none;
		}
	}
	img{
		max-width: 100%;
	}
	h1{
		font-family: @extralight;
		font-size: 39px;
		color: @white;
	}
	h2{
		font-family: @extralight;
		font-size: 32px;
		color: @fontgrey;
		line-height: 36px;
	}
	h3{

	}
	h4{

	}
	span{

	}
	p{

	}
}



/* ------- SIDEBAR ------- */


img#loading{
	margin:0 auto;
	padding-right: 271px;
	display: block;
}
#wrapper{
  	padding-left: 271px;
  	min-height: 100%;
  	background-color: rgba(255, 255, 255, 0.35);
  	#sidebar-wrapper{
		margin-left: -271px;
		left: 271px;
		width: 271px;
		background: @white;
		position: fixed;
		height: 100%;
		overflow: hidden;
		z-index: 1000;
		font-family: @ssp;
		font-weight: 200;
		color:@fontgrey2;
		nav{
			.sidebar-nav{
			    position: absolute;
			    top: 0px;
			    width: 271px;
			    list-style: none;
			    margin: 0;
			    padding: 0;
			    li{	
			    	line-height: 29px;
				    list-style: none;
				    color:@fontgrey2;
				    padding-top: 1px;
				    font-size: 17px;
				    letter-spacing: 0.5px;
					color: #828282;
					display: block;
					text-align: center;
					text-decoration: none;
					text-transform: uppercase;
					-webkit-transition: all 200ms ease;
					-moz-transition: all 200ms ease;
					-ms-transition: all 200ms ease;
					-o-transition: all 200ms ease;
					transition: all 200ms ease;
					cursor: pointer;
					&:hover{
					    color: @black;
					    text-decoration: none;
					}
					i{
						padding-left: 10px;
						margin-right: -20px;
						padding-top: 2px;
						font-size: 13px;
					}
				    &.sidebar-brand{
				    	border:none;
				    	text-align: center;
				    	padding: 80px 0;
				    }
				    a{
				    	color:@fontgrey2;
				    	padding-top: 1px;
				    	font-family: @ssp;
				    	font-weight: 200;
				    	font-size: 17px;
				    	letter-spacing: 0.5px;
						color: #828282;
					    display: block;
					    text-align: center;
						text-decoration: none;
						text-transform: uppercase;
						-webkit-transition: all 200ms ease;
						-moz-transition: all 200ms ease;
						-ms-transition: all 200ms ease;
						-o-transition: all 200ms ease;
						transition: all 200ms ease;
						&:hover{
						    color: @black;
						    text-decoration: none;
						}
					}
					&.openSub{
						ul.subMenu{
							width:274px;
							display: none;
							padding: 0;
							background-color: @lightg;
							-webkit-box-shadow:inset 0 1px 2px 0 #919191;
							box-shadow:inset 0 1px 2px 0 #919191;
							li{
								border:none;
								line-height: 22px;
								&:first-child{
									padding-top: 6px;
								}
								&:last-child{
									padding-bottom: 8px;
								}
								a{
									font-family: @ssp;
									font-weight: 300;
									font-size: 14px;
									color:@fontgrey;
									text-transform: none;
									-webkit-transition: all 200ms ease;
									-moz-transition: all 200ms ease;
									-ms-transition: all 200ms ease;
									-o-transition: all 200ms ease;
									transition: all 200ms ease;
									&:hover{
										color:@black;
									}
								}
							}
						}
					}
				}
			}
		}
		footer{
			text-align: center;
			bottom:15px;
			position: absolute;
			span{
				display: block;
				width:191px;
				margin-left: 36px;
				font-size: 13px;
				a{
					font-family: @ssp;
					color:@fontgrey;
					font-weight: 300;
					font-size: 12px;
				}
			}
		}
		#menu-toggle{
			display: block;
			width:40px;
			height:40px;
			position: fixed;
			background-color: @white;
			margin-left:271px;
			z-index: 9999;
			border:1px solid @black;
		    i{
				color:@grey;
				width:40px;
				height:40px;
				padding:6px;
		    }
		}
	}
}

@media (max-width:1367px){

#wrapper{
  	padding-left: 240px;
  	#sidebar-wrapper{
		margin-left: -240px;
		left: 240px;
		width: 240px;
		nav{
			.sidebar-nav{
			    width: 240px;
			    li{	
			    	line-height: 28px;
				    &.sidebar-brand{
				    	padding: 50px 10px 50px 10px;			   
				    }
					&.openSub{
						ul.subMenu{
							width: 244px;
							li{
								&:first-child{
									padding-top: 4px;
								}
								&:last-child{
									padding-bottom: 6px;
								}
								a{
									font-size: 13px;
									font-weight: 400;
								}
							}
						}
					}
				}
			}
		}
		footer{
			bottom:12px;
			span{
				margin-left: 24px;
			}
		}
		.toggle-bar{
			background-color: @black;
			top:0;
			bottom:0;
			width:50px;
			#menu-toggle{
			    i{
					
			    }
			}
		}
	}
}

}




@media (max-width:767px) {

#wrapper {
  padding-left: 0;
}

#sidebar-wrapper {
  left: 0;
}

#wrapper.active {
  position: relative;
  left: 250px;
}

#wrapper.active #sidebar-wrapper {
  left: 250px;
  width: 250px;
  transition: all 0.4s ease 0s;
}

#menu-toggle {
  display: inline-block;
}

}



/* ------- CONTENT ------- */



#page-content-wrapper{
	margin:0 0 0 2000px;
	padding:0;
	width:100%;
	.page-content{
		.row{
			margin:0;
			padding:0;
		}
		.row.text{
			div{
				text-align: left;
				padding:50% 0 0 50%;
				span{
					height: 95%;
					display: block;
					padding:40px;
					letter-spacing: 1px;
					margin:-48.3% 0 0 -48.5%;
					position: absolute;
					width:97%;
					h1{
						padding: 50% 0 0 50%;
						line-height: 84px;
						font-size: 72px;
						margin:-29% 0 0 -5%;
					}
				}
			}
		}
		.news-detail{
			.row{
				padding: 60px 0;
				display: none;
				width:70%;
				margin-left: 2000px;
				div{
					padding:20px 15px;
					background-color: @white;
					-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
					box-shadow: 1px 2px 0 0 #A6A6A6;
					div{
						-webkit-box-shadow: none;
						box-shadow: none;
						img{
							margin:0 auto;
							display: block;
						}
						h1{
							color:@fontgrey;
							text-align: center;
							margin-top:25px;
							margin-bottom: 0;
							text-transform: uppercase;
						}
						div{
							width:100px;
							padding: 0;
							height: 1px;
							margin:25px auto;
							background-color: @lightgrey;
							-webkit-box-shadow: none;
							box-shadow: none;
						}
						p{
							color:@fontgrey;
							font-family: @ssp;
							font-weight: 300;
							display: block;
							font-size: 15px;
							line-height: 22px;
							span.a-left{
								text-align: left;
							}
						}
						a.back{
							-webkit-border-radius: 3px;
							border-radius: 3px;
							font-family: @ssp;
							font-weight: 400;
							border:1px solid @lightgrey2;
							color:@fontgrey2;
							display: block;
							padding:11px 0;
							text-align: center;
							width:100px;
							margin:30px auto 15px;
							line-height: 18px;
							font-size: 15px;
							&:hover{
								text-decoration: none;
								border-color:#cf5429;
								color:#9c401f;
							}	
						}
					}
				}
			}
		}
		.row.news{
			width:70%;
			margin-left: 15%;
			text-align: center;
			padding:40px 0;
			div{
				padding:5px;
				div{
					margin: 5px 0;
					background-color: @white;
					padding:20px 15px 21px;
					-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
					box-shadow: 1px 2px 0 0 #A6A6A6;
					h2{
						color:@fontgrey;
						margin-top:30px;
						margin-bottom: 25px;
						text-transform: uppercase;
					}
					div{
						width:100px;
						padding: 0;
						height: 1px;
						margin:0 auto;
						background-color: @lightgrey;
						-webkit-box-shadow: none;
						box-shadow: none;
					}
					p{
						margin-top:25px;
						margin-bottom: 22px;
						color:@fontgrey;
						font-family: @ssp;
						font-weight: 300;
						display: block;
						font-size: 15px;
						line-height: 22px;
						span.a-left{
							text-align: left;
						}
					}
					a{
						-webkit-border-radius: 3px;
						border-radius: 3px;
						font-family: @ssp;
						font-weight: 400;
						border:1px solid @lightgrey2;
						color:@fontgrey2;
						display: block;
						padding:11px 0;
						width:100px;
						margin:0 auto;
						line-height: 13px;
						font-size: 12px;
						&:hover{
							text-decoration: none;
							border-color:#cf5429;
							color:#9c401f;
						}
					}
				}
			}
		}
		.row.instytucje{
			width:60%;
			margin-left: 20%;
			padding:40px 0;
			div{
				margin: 5px 0;
				background-color: @white;
				padding:18px 15px;
				-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
				box-shadow: 1px 2px 0 0 #A6A6A6;
				div{
					padding:0;
					margin:0;
					-webkit-box-shadow:none;
					box-shadow: none;
					h2{
						color:@fontgrey;
						margin:-5px 0 13px 27px;
						text-transform: uppercase;
					}
					div{
						width:100px;
						padding: 0;
						height: 1px;
						margin:0 0 0 30px;
						background-color: @lightgrey;
						-webkit-box-shadow: none;
						box-shadow: none;
					}
					p{
						margin: 12px 0 0 30px;
						color:@fontgrey2;
						font-family: @ssp;
						font-weight: 300;
						display: block;
						font-size: 14px;
						line-height: 22px;
					}
					a{
						color:#9c401f;
					}
					a.more{
						display: block;
						width:120px;
						height: 50px;
						margin:10px -27px 0 0;
						bottom:0;
						float:right;
						&:hover{
							text-decoration: none;
							border-color:@fontgrey;
							color:@grey;
						}
					}
					a.official{
						font-family: @ssp;
						font-weight: 300;
						-webkit-border-radius: 3px;
						border-radius: 3px;
						border:1px solid @lightgrey2;
						color:@fontgrey2;
						display: block;
						padding:11px 0;
						width:100px;
						margin:10px 0 0 30px;
						line-height: 13px;
						font-size: 12px;
						text-align: center;
						&:hover{
							text-decoration: none;
							border-color:#cf5429;
							color:#9c401f;
						}
					}
				}
			}
		}
		.row.rada{
			width:60%;
			margin-left: 20%;
			padding:40px 0;
			div{
				padding:5px;
				div{
					margin:0;
					background-color: @white;
					padding:18px 15px;
					-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
					box-shadow: 1px 2px 0 0 #A6A6A6;
					text-align: center;
					h1{
						color:@fontgrey;
						margin:0;
					}
					h2{
						text-align: center;
						color:@fontgrey;
						margin:0;
						&.czlonkowie{
							margin-bottom: 25px;
						}
					}
					img{
						margin-bottom: 15px;
					}
					div{
						width:100px;
						padding: 0;
						height: 1px;
						margin:15px auto;
						background-color: @lightgrey;
						-webkit-box-shadow: none;
						box-shadow: none;
					}
					p{
						font-family: @ssp;
						font-size: 14px;
						font-weight: 400;
						color:@fontgrey2;
						margin-top: 30px;
					}
					table{
						width:90%;
						margin:25px 6% 30px;
						tr{
							line-height: 28px;
							td{
								font-family: @ssp;
								font-weight: 400;
								font-size: 15px;
								width:50%;
								text-align: left;
							}
						}
					}
				}
			}
		}
		.row.budzet{
			width:60%;
			margin-left: 20%;
			padding:40px 0;
			div{
				padding:10px;
				div{
					margin:0;
					background-color: @white;
					padding:30px;
					-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
					box-shadow: 1px 2px 0 0 #A6A6A6;
					text-align: center;
					h1{
						color:@fontgrey;
						margin:0;
						text-transform: uppercase;
					}	
					h2{
						line-height: 42px;
						color:@fontgrey;
						margin:0;
						text-transform: uppercase
					}
				}
				a{
					div{
						margin:0;
						background-color: @white;
						padding:30px;
						-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
						box-shadow: 1px 2px 0 0 #A6A6A6;
						text-align: center;
						h1{
							color:@fontgrey;
							margin:0;
							text-transform: uppercase;
						}
						h2{
							line-height: 42px;
							color:@fontgrey;
							margin:0;
							text-transform: uppercase;
						}
					}
				}
			}
		}
		.row.history{
			width:60%;
			margin-left: 20%;
			padding:40px 0;
			div{
				padding:10px;
				div{
					margin:0;
					background-color: @white;
					padding:30px;
					-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
					box-shadow: 1px 2px 0 0 #A6A6A6;
					text-align: center;
					h1{
						color:@fontgrey;
						margin:0;
					}
				}
			}
		}
		.row.kontakt{
			width:70%;
			margin-left: 15%;
			padding:40px 0;
			#map_canvas{
				width:100%;
				height:500px;
				-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
				box-shadow: 1px 2px 0 0 #A6A6A6;
				img{
					max-width:none;
				}
			}
			div{
				padding:10px;
				.inner{
					background-color: @white;
					padding:30px;
					-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
					box-shadow: 1px 2px 0 0 #A6A6A6;
					text-align: left;
					a{
						color:@fontgrey;
						text-decoration: none;
						&:hover{
							text-decoration: none;
							border-color:#cf5429;
							color:#9c401f;
						}	
					}
					h1{
						color:@fontgrey;
						margin:0;
						text-align: center;
					}
					span{
						font-family: @ssp;
						color:@fontgrey2;
						text-align: left;
						font-size: 21px;
						font-weight: 300;
						display: block;
						margin-bottom: 0;
					}
					.line{
						width:100px;
						padding: 0;
						height: 1px;
						margin:15px 0 17px;
						background-color: @lightgrey;
						-webkit-box-shadow: none;
						box-shadow: none;
					}
					table{
						width:70%;
						tr{
							td{
								font-size: 16px;
								color:@fontgrey;
								font-weight: 300;
								margin:2px 0;
								float: left;
								text-align: left;
								&:first-child{
									width:30%;
								}
								&:last-child{
									max-width: 70%;
								}
							}
						}
					}
				}
			}
		}
		.row.galeria{
			width:70%;
			margin-left: 15%;
			padding:40px 0;
			div{
				padding:10px;
				div{
					margin:0;
					background-color: @white;
					padding:20px;
					-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
					box-shadow: 1px 2px 0 0 #A6A6A6;
					text-align: center;
					img{
						display: block;
						margin:0 auto;
					}
					span{
						font-weight: 300;
						font-size: 16px;
						color:@fontgrey;
						margin: 20px 0;
						display: block;
					}
					a{
						-webkit-border-radius: 3px;
						border-radius: 3px;
						font-family: @ssp;
						font-weight: 400;
						border:1px solid @lightgrey2;
						color:@fontgrey2;
						display: block;
						padding:11px 0;
						width:100px;
						margin:0 auto;
						line-height: 13px;
						font-size: 12px;
						&:hover{
							text-decoration: none;
							border-color:#cf5429;
							color:#9c401f;
						}	
					}
				}
			}
		}
		.galeria-detail{
			.row{
				padding: 60px 0;
				display: none;
				width:70%;
				margin-left: 2000px;
				.outer{
					text-align: center;
					margin:0 auto;
					padding: 30px 0 15px;
					background-color: @white;
					-webkit-box-shadow: 1px 2px 0 0 #A6A6A6;
					box-shadow: 1px 2px 0 0 #A6A6A6;
					img{
						display: block;
						margin:0 auto;
					}
					a.back{
						-webkit-border-radius: 3px;
						border-radius: 3px;
						font-family: @ssp;
						font-weight: 400;
						border:1px solid @lightgrey2;
						color:@fontgrey2;
						display: block;
						text-align: center;
						padding:11px 0;
						width:100px;
						margin:30px auto 15px;
						line-height: 18px;
						font-size: 15px;
						&:hover{
							text-decoration: none;
							border-color:#cf5429;
							color:#9c401f;
						}	
					}
				}
			}
		}
	}
}

@media (max-width:1025px){

html,
body{
	h1{
		font-size: 32px;
	}
	h2{
		font-size: 27px;
		line-height: 30px;
	}
	h3{

	}
	h4{

	}
	span{

	}
	p{

	}
}

#page-content-wrapper{
	.page-content{
		.row.text{
			div{
				span{
					h1{
						line-height: 60px;
						font-size: 56px;
						margin:-18% 0 0 -12%;
					}
				}
			}
		}
		.row.news{
			width:84%;
			margin-left: 8%;
			div{
				div{
					padding:15px;
					h2{
						margin-top:25px;
						margin-bottom: 20px;
					}
					p{
						margin-top:20px;
						margin-bottom: 20px;
						font-size: 14px;
						line-height: 20px;
					}
				}
			}
		}
		.row.instytucje{
			width:84%;
			margin-left: 8%;
			div{
				padding:15px;
				div{
					h2{
						color:@fontgrey;
						margin:-3px 0 13px 27px;
						text-transform: uppercase;
					}
				}
			}
		}
		.row.rada{
			width:84%;
			margin-left: 8%;
			div{
				div{
					padding:15px;
					table{
						width:94%;
						margin:25px 3% 30px;
					}
				}
			}
		}
		.row.budzet{
			width:80%;
			margin-left: 10%;
		}
	}
}

}