/* wyzerowanie kluczowych właściwości */
* {
	margin					: 0px;
	border					: none;
	padding					: 0px;
}

/* ***************************************** */
/* Opis wyglądu strony "Chata na Bucniku"    */
/* wersja 1.0                                */
/*                                           */
/* Tomasz Barnert                            */
/* barnert@o2.pl                             */
/* www.mariba.pl							 */
/* ***************************************** */

html, body {
	height					: 100%;
}

body  {
	width					: 100%;
	font-family				: Arial, sans-serif;
	background-color		: #FFFFFF;
	background-image		: url('../grafika/tlo_zewnetrzne.jpg');
	background-repeat		: repeat-y;
	background-position		: top center;
}

/* Kontener - rodzic dla wszystkich elementów oprócz stopki */

#kontener {
	margin					: 0px auto;
	width					: 1200px;
	height					: auto;
	min-height				: 100%;
	background-image		: url('../grafika/tlo_glowne.jpg');
	background-repeat		: repeat-y;
	background-position		: 0px 212px;	
}

/* Nagłówek strony z elemenatami graficznymi */

#naglowek {
	width					: 1200px;
	height					: 212px;
	background-image		: url('../grafika/belka_gora.jpg');
	background-repeat		: no-repeat;
	background-position		: top left;
	z-index					: 10;
}

#naglowek h1 {
	width					: 1200px;
	height					: 212px;
	background-image		: url('../grafika/naglowek.png');
	background-repeat		: no-repeat;
	background-position		: top left;	
	position				: relative;
	top						: -286px;
	left					: 0px;
	z-index					: 100;
}

#naglowek h1 span {
	visibility				: hidden;
}

#ptaszek {
	width					: 216px;
	height					: 286px;
	background-image		: url('../grafika/ptaszek.png');
	background-repeat		: no-repeat;
	position				: relative;
	top						: 10px;
	left					: 710px;
	z-index					: 99;
}

/* Menu dla strony lewej */


#menu_lewe {
	margin-top				: 53px;
	width					: 198px;
	height					: auto;
	min-height				: 300px;
	overflow				: hidden;
	float					: left;
	z-index					: 9;
}

#menu_lewe ul {
	width					: 50px;
	height					: auto;
	list-style-type			: none;
	float					: right;
}

#menu_lewe li {
	margin					: 38px 0px;
	width					: 122px;
	height					: 50px;
	float					: right;
}

#menu_lewe a {
	display					: block;
	height					: 48px;
	line-height				: 50px;
	width					: 120px;
	font-family				: 'Arial Narrow', Arial, sans-serif;
	font-weight				: bold;
	color					: white;
	font-size				: 16px;
	text-align				: center;
	text-decoration			: none;
	text-transform			: uppercase;
	position				: relative;
	left					: 45px;
	border					: 1px solid white;
	
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

#menu_lewe a.akt {
	font-weight				: 700;
}

/* Menu dla strony prawej */

#menu_prawe {
	margin-top				: 53px;
	width					: 198px;
	height					: auto;
	min-height				: 300px;
	float					: right;
	overflow				: hidden;
	z-index					: 9;
}

#menu_prawe ul {
	width					: 50px;
	height					: auto;
	list-style-type			: none;
	float					: left;
}

#menu_prawe li {
	margin					: 38px 0px;
	width					: 122px;
	height					: 50px;
	float					: left;
}

#menu_prawe a {
	display					: block;
	height					: 48px;
	line-height				: 50px;
	width					: 120px;
	font-family				: 'Arial Narrow', Arial, sans-serif;
	font-weight				: 700;
	color					: white;
	font-size				: 16px;
	text-align				: center;
	text-decoration			: none;
	text-transform			: uppercase;
	position				: relative;
	left					: -45px;
	border					: 1px solid white;
	
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=-3);
	
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

#menu_prawe a.akt {
	font-weight				: 700;
}


/* Opis wyglądu dla treści poszczególnych podstron */

#tresc {
	margin-top				: 30px;
	margin-bottom			: 100px;
	padding-bottom			: 40px;
	width					: 804px;
	height					: auto;
	min-height				: 530px;
	float					: left;
	background-image		: url('../grafika/tlo_tresc.png');
	background-repeat		: repeat;	
	position				: relative;
	z-index					: 9;
}

/* Kolor belki dla każdej podstrony ustawiany bezpośrednio w szablonie */
/* podobnie jak kolor czcionki i ozdobniki w nagłówku wg odpowiedniej kolorystyki strony */
#tresc #pasek_gora {
	width					: 802px;
	height					: 24px;
	border					: 1px solid #FFFFFF;
	background-color		: #FFFFFF;
	text-align				: center;
}

#tresc #pasek_dol {
	width					: 802px;
	height					: 10px;
	border					: 1px solid #FFFFFF;
	background-color		: #FFFFFF;
	position				: absolute;
	bottom					: 0px;
}


/* Główny nagłówek na każdej stronie */

#tresc  h1 {
	padding					: 10px 5px;
	height					: 50px;
	line-height				: 50px;
	font-family				: Oswald, Arial, sans-serif;
	font-weight				: normal;
	font-style				: normal;
	font-size				: 30px;
	float					: left;
}

#tresc h1.ozdobnik_lewy, #tresc h1.ozdobnik_prawy {
	padding					: 10px 0px;
	width					: 70px;
	height					: 50px;
	background-repeat		: no-repeat;
	background-position		: 0px 20px;
}

#tresc h1.ozdobnik_lewy {
	margin-left				: 15px;
	float					: left;
}

#tresc h1.ozdobnik_prawy {
	margin-right			: 15px;
	float					: left;
}

/* akapity tekstu w treści strony */

#tresc p {
	padding					: 0px 20px 10px 20px;
	text-align				: justify;
	font-family				: Arial, sans-serif;
	font-size				: 13px;
}

/* nagłówki w treści strony */

#tresc h2 {
	padding					: 10px 20px 10px 20px;
	height					: 20px;
	line-height				: 20px;
	font-family				: Oswald, Arial, sans-serif;
	font-weight				: 400;
	font-size				: 18px;
	color					: #757575;
}

#tresc h3 {
	padding					: 0px 20px 10px 20px;
	height					: 18px;
	font-family				: Oswald, Arial, sans-serif;
	font-weight				: 400;
	line-height				: 18px;
	font-size				: 16px;
	color					: #757575;
}

/* zdjęcia w treści - ogólnie */
#tresc img {
	margin					: 10px;
	border					: 2px solid #FFFFFF;
	-webkit-border-radius	: 10px;
	-moz-border-radius		: 10px;
	border-radius			: 10px;
}

#tresc img.left {
	margin					: 10px;
	margin-left				: 0px;
	border					: 2px solid #FFFFFF;
	-webkit-border-radius	: 10px;
	-moz-border-radius		: 10px;
	border-radius			: 10px;
	float					: left;
}

#tresc img.right {
	margin					: 10px;
	margin-right			: 0px;
	border					: 2px solid #FFFFFF;
	-webkit-border-radius	: 10px;
	-moz-border-radius		: 10px;
	border-radius			: 10px;
	float					: right;
}

#tresc img.center {
	display					: block;
	margin					: 10px auto;
	border					: 2px solid #FFFFFF;
	-webkit-border-radius	: 10px;
	-moz-border-radius		: 10px;
	border-radius			: 10px;
	clear					: both;
}

/* mapa Google na stronie Dojazd */

#tresc div.mapa {
	margin					: 0px 20px 10px 20px;
	width					: 380px;
	height					: 340px;
	float					: right;
}

#tresc div.mapa iframe{
	margin					: 0px;
	width					: 376px;
	height					: 316px;
	border					: 2px solid #FFFFFF;
	-webkit-border-radius	: 10px;
	-moz-border-radius		: 10px;
	border-radius			: 10px;
}

#tresc div.mapa a {
	font-size				: 10px;
	float					: right;
}

/* Mini galeria zdjęć na stronie głównej */

#tresc div.galeryjka {
	margin					: 0px 20px 10px 20px;
	width					: 404px;
	height					: 270px;
	float					: right;
	overflow				: hidden;
}

#tresc div.galeryjka img{
	margin					: 0px;
	width					: 400px;
	height					: 266px;
	border					: 2px solid #FFFFFF;
	-webkit-border-radius	: 10px;
	-moz-border-radius		: 10px;
	border-radius			: 10px;
}

/* podział na dwie kolumny - na stronie Kontakt */

#tresc div.tresc_lewa {
	width					: 274px;
	float					: left;
	clear					: both;
}

#tresc div.tresc_prawa {
	width					: 530px;
	float					: right;
}

/* Fromularz kontaktowy                        */

#formularz_kontakt {
	margin-left				: 20px;
	width					: 485px;
	font-size				: 12px;
	position				: relative;
}

#formularz_kontakt fieldset {
	padding					: 5px 10px;	
	width					: 463px;
	border					: 1px solid #d9d9d9;
}

#formularz_kontakt input, #formularz_kontakt textarea {
	margin					: 3px 0px;
	border					: 1px solid #d9d9d9;
	width					: 320px;
}

#formularz_kontakt input {
	height					: 15px;
}

#formularz_kontakt textarea {
	padding					: 0px;
	width					: 463px;
	min-height				: 200px;
	max-height				: 400px;
	font-size				: 13px;
	overflow				: auto;
	resize					: vertical;
}

#formularz_kontakt .pola_form {
	margin					: 0px;
	padding					: 0px;
}

#formularz_kontakt .form_blad {
	color					: #F23252;
	font-size				: 10px;
}

#formularz_kontakt .form_pole_blad {
	background-color		: #FFEDED;
}

#formularz_kontakt #przycisk {
	width					: 100px;
	height					: 20px;
	line-height				: 20px;
	font-size				: 11px;
	cursor					: pointer;
	float					: left;
	-webkit-border-radius	: 4px;
	-moz-border-radius		: 4px;
	border-radius			: 4px;
}

#formularz_kontakt #licznik_znakow {
	padding-right			: 5px;
	border					: 1px solid #d9d9d9;
	width					: 35px;
	height					: 15px;
	line-height				: 15px;
	text-align				: right;
	color					: #A9A9A9;
	background-color		: #FFFFFF;
	float					: right;
	display					: none;
}

#formularz_kontakt #load {
	margin-top				: -30px;
	margin-left				: -60px;
	position				: absolute;
	top						: 50%;
	left					: 50%;
	z-index					: 12;
}

#formularz_kontakt #sukces {
	margin-top				: 15px;
	margin-left				: -150px;
	border					: 1px solid #EC0A6A;
	width					: 300px;
	height					: 50px;
	line-height				: 50px;
	text-align				: center;
	background-color		: #FFFFFF;
	position				: absolute;
	top						: 50%;
	left					: 50%;
	cursor					: pointer;
	z-index					: 12;
}



/* style dla hiperłączy w treści */

#tresc a {
	text-decoration			: none;
	color					: #EC0A6A;
}

#tresc a:hover, #tresc a:focus {
	text-decoration			: underline;
	color					: #910841;
}


/* Ukryty tytuł strony dla stron wczytywanych w Ajaxie */
#hidden_title {
	display					: none;
}

/* Opis wyglądu stopki strony */

#stopka {
	margin					: 0px auto;
	margin-top				: -47px;
	width					: 1200px;
	height					: 47px;
	line-height				: 47px;
	background-image		: url('../grafika/tlo_tresc.png');
	background-repeat		: repeat;	
	clear					: both;
	position				: relative;
	z-index					: 11;
}

#stopka p {
	display					: block;
	margin					: 0px auto;
	width					: 1200px;
	height					: 47px;
	text-align				: center;
	font-size				: 12px;
	color					: #7E2A6A;
}

#stopka a {
	width					: 130px;
	height					: 47px;
	display					: block;
	position				: relative;
	margin-top				: -47px;
	margin-left				: 1070px;
	overflow				: hidden;
}

/* potrzebne do utrzymania wysokości kontenera dopasowanej do treści */

div.clear {
	clear					: both;
}

/* Strony typu BLOG */
div.blog_lewy {
	width					: 623px;
	height					: auto;
	min-height				: 300px;
	float					: left;
}

div.blog_wpis {
	margin					: 10px 20px;
	margin-bottom			: 0px;
	height					: auto;
	min-height				: 150px;
	border-bottom			: 1px solid #D4D4D4;
	overflow				: auto;
}

div.blog_wpis_uciety {
	margin					: 10px 20px;
	margin-bottom			: 0px;
	height					: 150px;
	overflow				: hidden;
}

div.blog_wpis_pokaz {
	margin					: 0px 20px;
	width					: 583px;
	height					: 25px;
	line-height				: 25px;
	-webkit-border-bottom-left-radius	: 10px;
	-webkit-border-bottom-right-radius	: 10px;
	-moz-border-radius-bottomleft		: 10px;
	-moz-border-radius-bottomright		: 10px;
	border-bottom-left-radius			: 10px;
	border-bottom-right-radius			: 10px;
	background-color		: #FFFFFF;
	text-align				: center;
	color					: #898989;
	cursor					: pointer;
	display					: none;
}

div.blog_wpis_pokaz:hover, div.blog_wpis_pokaz:focus {
	color					: #000000;
}

#tresc div.blog_wpis p, #tresc div.blog_wpis h2, #tresc div.blog_wpis h3 {
	padding-left			: 0px;
	padding-right			: 0px;
}

div.blog_wpis h2 span.data_wpisu {
	float					: right;
	font-size				: 12px;
}

#tresc div.blog_prawy {
	padding-top				: 50px;
	padding-left			: 10px;
	padding-right			: 10px;
	width					: 160px;
	height					: auto;
	min-height				: 350px;
	float					: right;
	border-left				: 1px solid #D4D4D4;
	background-image		: url('../grafika/icon_kalendarz.png');
	background-repeat		: no-repeat;
	background-position		: center top;
	font-size				: 12px;
}

#tresc div.blog_prawy ul{
	margin					: 0px;
	list-style-position		: inside;
	list-style-type			: none;
}

#tresc div.blog_prawy ul.blog_lista_miesiac li {
	margin-bottom			: 10px;
	padding-left			: 10px;
}

#tresc div.blog_prawy ul.blog_lista_wpisy li {
	margin-bottom			: 0px;
	margin-left				: 20px;
	padding-left			: 0px;
	list-style-position		: outside;
	list-style-type			: disc;
}

#tresc div.blog_prawy ul a {
	color					: #000000;
}

#tresc div.blog_prawy ul.blog_lista_rok a {
	font-weight				: bold;
}

#tresc div.blog_prawy ul.blog_lista_miesiac a {
	font-style				: italic;
	font-weight				: normal;
}

#tresc div.blog_prawy ul.blog_lista_wpisy a {
	font-style				: normal;
}

#tresc div.blog_nawigacja {
	margin-top				: 10px;
	text-align				: center;
}

#tresc div.blog_nawigacja a{
	font-size				: 12px;
}

#tresc div.blog_nawigacja span{
	font-size				: 12px;
	color					: #898989;
}

/* Galeria z minaiturami zdjęć dla kategorii */

#tresc div.galeria_min {
	margin					: 10px auto;
	padding					: 0px;
	width					: 275px;
	height					: 205px;
	overflow				: hidden;
	border					: 2px solid #FFFFFF;
	-webkit-border-radius	: 10px;
	-moz-border-radius		: 10px;
	border-radius			: 10px;
	background-color		: #FFFFFF;
}

#tresc div.galeria_min img {
	margin					: 0px;
	padding-bottom			: 3px;
	width					: 275px;
	height					: 183px;
	border					: none;
}

#tresc div.galeria_min p {
	padding					: 0px 10px;
	text-align				: center;
	font-family				: Oswald, Arial, sans-serif;
	font-weight				: normal;
	font-style				: normal;
	font-size				: 12px;
	color					: #494949;
	margin-top				: -5px;
}

#tresc div.galeria_lewo {
	margin-left				: 100px;
	float					: left;
}

#tresc div.galeria_prawo {
	margin-right			: 100px;
	float					: right;
}

#tresc div.galeria_lewo a, #tresc div.galeria_prawo a{
	display					: block;
	width					: 275px;
	height					: auto;
	overflow				: auto;
}

#tresc div.galeria_zdjecia_ukryte {
	display					: none;
}

#tresc div.galeria_zdjecia_duze {
	margin					: 0px;
	height					: auto;
	min-height				: 200px;
	text-align				: center;
}

#tresc div.galeria_zdjecia_duze  img{
	margin					: 0px auto;
	margin-bottom			: 20px;
	width					: 700px;
	float					: none;
	display					: block;
}

#tresc div.galeria_zdjecia_duze  a{
	font-size				: 12px;
}

/* OPIS WYGLĄDU TABEL */
#tresc table {
	margin					: 10px auto;
	border					: 1px solid #959595;
	border-collapse			: collapse;
	font-size				: 12px;
}

#tresc th {
	font-weight				: bold;
}

#tresc th, #tresc td {
	padding					: 2px 10px;
	border					: 1px solid #959595;
	text-align				: left;
	vertical-align			: middle;
}

/* OPIS WYGLĄDU LIST */

#tresc ul {
	margin					: 5px 35px;
	list-style-type			: disc;
	list-style-position		: outside;
}

#tresc li {
	font-size				: 12px;
}

#tresc ol {
	margin					: 5px 35px;
	list-style-type			: decimal;
	list-style-position		: outside;
}

/* OPIS WYGLĄDU POZOSTAŁYCH ELEMENTÓW */

#tresc hr{
	height					: 2px;
	width					: 784px;
	margin					: 0px 10px;
	background-color		: #AFAFAF;
}

/* Okienko FB */
#okienko {
	width				: 400px;
	height				: 400px;
	position			: fixed;
	top					: 75px;
	right				: -325px;	
	z-index				: 100;
}

#raczka {
	width				: 75px;
	height				: 75px;
	background-image	: url('../grafika/fb_icon_75.png');
	background-repeat	: no-repeat;
	float				: left;
	cursor				: pointer;
	opacity				: 0.8;
}

#raczka:focus, #raczka:hover {
	opacity				: 1.0;
}

#box {
	width				: 325px;
	height				: 400px;
	float				: right;
}

#box iframe {
	width					: 325px;
	height					: 400px;
	border					: none;
	background-color		: rgba(255, 255, 255, 0.9);
	float					: left;
	overflow				: hidden;
}
