/*--OGOLNE--*/

body						{background-color: #FBFBFB; color: #202020; font-family: tahoma, verdana, arial, helvetica, sans-serif; font-size: 11px;}
a							{color: #202020; text-decoration: none;}
a:hover						{color: #f31e10;}
a:visited					{color: #202020;}
textarea					{width: 100%; border: 1px solid gray; background-color: transparent;}
textarea:focus				{background-color: white; border: 1px;}

.new-img-children a img 			{ width: 296px; height: auto; margin-top: 10px;}
.random-img-children a img 			{ width: 296px; height: auto;}
/*--.new-img-children a:hover img		{border: 1px solid #ff2e10;}--*/
.imgname							{font-size: 14px;}
.imgautor a							{color: #202020; text-decoration: none;}
.imgautor a:hover					{color: #f31e10;}
.imgautor a:visited					{color: #202020;}
.obrazek_random a img 		{width: 296px; height: auto;}		/*-------UŻYWANE--------*/
/*--.obrazek_random a:hover img	{border: 1px solid #ff2e10;}--*/	/*-------TAKŻE-W--------*/
.obrazek_random a			{border: 0px;}					/*---COMMENTS_ALL_BIT---*/
.obrazek_margin a			{margin: 0px; border: 0px solid white; text-decoration: underline;}
.obrazek_margin a:hover		{text-decoration: none;}
.obrazek_margin img			{margin: 0px; border: 1px solid white; width: 296px; height: auto;}
/*--.obrazek_margin img:hover	{border: 1px solid #ff2e10;}--*/

.pasek						{width: 187px; margin-left: auto; margin-right: auto; font-size: 8px; text-align: center; color: #333333; font-weight: bold; position: relative; top: -1px;}
.niepubliczne				{background-color: #FFD800;}
.admin						{background-color: #E10000;}

.frametitle					{font-size: 12px; padding-top: 5px;	font-weight: bold; margin-top: 10px;}
.l1,#komorka_all_news		{background-color: #EEEEEE;}
.l2							{background-color: #E0E0E0;}
.l3,#tabela_all_news		{background-color: #D5D5D5;}
.maincat,.b					{font-weight: bold;}
.new						{color: red;}
.title						{font-size: 16px; font-weight: bold;}
#wyswietlen					{font-size: 9px; font-weight: normal;}
.homecat					{border: 0px solid #D5D5D5; border-top: 0px; padding: 0px; margin-bottom: 10px;}
.paging						{width:100%; padding: 10px; text-align: center; font-size: 12px;}
		
/*--menu dolne--*/
.naglowek					{font-size: 12px; font-weight: bold; height: 20px; line-height: 20px; border-bottom: 1px solid #A8A8A8;}
.mt_normal					{padding-top: 3px; padding-bottom: 3px;}
.mt_random					{padding: 10px 3px 10px 3px; display: flex; align-content: stretch; overflow: hidden;}

#contact_form, #contact_close	{display: none;}
#contact_url				{cursor:pointer;}
#contact_url_msg			{cursor:pointer; display: none;}

.commentinput				{border: 1px solid gray; background-color: transparent;}

@media (max-width: 600px)	{	
	.mainborder				{padding-top: 50px;}
	.desktop-menu-container, .desktop-menu-left, .desktop-menu-right, .search_bit, .login_bit, #right_commentform, #gora_lewa, #gora_prawa, .menumain, .menumain_new, .menudown-container	 {display: none;}
	.mobile-menu-container	{display: flex; align-content: stretch; position: fixed; left: 0px; top: 0px; width: 100%; background-color: #FBFBFB; z-index: 3;}
	.mobile-menu-left 		{width: 100%;}
	.mobile-menu-left a 	{width: 100px; margin: auto; display: block; border: 0px;}
	.mobile-menu-left img 	{width: 100px; margin: auto; margin-top: 5px; margin-bottom: 5px;}
	.mobile-menu-right 		{display: block; color:#000; padding-top: 3px; cursor:pointer; float: right; width: 35px; padding-right: 10px; height: 100%;}
	.mobile-menu-right a 	{border: 0px;}
	.mobile-menu-right img 	{width: 20px; margin-top: 15px;}
	.mm-user-box 			{font-size: 12px !important;}
	.mm-user-box a 			{display: inline !important; padding: 0px !important; background: none;}
	aside nav 				{display:none;}
	aside nav ul 			{list-style:none;}
	aside nav ul li 		{margin-bottom:1px;}
	aside nav ul li a img	{width: 12px;}
	aside nav ul li a 		{display:block;font-size:14px;text-decoration:none; padding:6px 10px;}
	aside nav ul li a:hover	{background:#EEEEEE;}
	#details_div_glowny		{padding-bottom: 10px;	margin-top: 5px; width: 100%; padding-top: 50px;}
	.tresc					{width: 100%; padding: 10px; padding-bottom: 0px;}
	.tresc_home				{width: 100%;}
	.commenttextarea		{width: 100%;}
	#left_commentform		{width: 100%;}
	.shouttextarea			{border: 0px; border-bottom: solid #585858 1px; width: 280px; background-color: #FBFBFB;}
    .main2	 				{width: 100%;}
	.menugora				{}
	.userbox-link 			{display: inline; background: none; font-size: 11px;}
	#zbiornik_cat			{background-color: #FBFBFB;}
	#zbiornik_news			{width: 88%; margin: auto; margin-bottom: 10px;}
	.new-img-links			{background-color: #FBFBFB; font-size: 12px; padding-bottom: 10px;}
	.new-img-container 		{display: flex; justify-content: center; flex-direction: row; flex-wrap: wrap; z-index: 0;}
	.new-img-children 		{background-color: #FBFBFB;}
	.footer					{text-align: center; padding: 3px; font-size: 10px;}
}

@media (min-width: 601px) 	{ 
	.mainborder				{border-bottom: 0px solid #A8A8A8; margin-top: 10px; position: relative; z-index: 0;}
	.main2					{width: 1200px; margin-left: auto; margin-right: auto; background-color: F7F7F7;}
	.menugora				{position: relative; height: 94px; background-image: url('images/baner.png'); text-align: left; padding-top: 5px; width: 100%; background-repeat: no-repeat;}
	.mobile-menu-container, .mobile-menu-left, .mobile-menu-right  {display: none;}
	aside nav 				{display:none; position: relative; left: -50px; top: -500px;}
	aside nav ul 				{list-style:none;}
	aside nav ul li 				{margin-bottom:1px;}
	aside nav ul li a 			{display:block;font-size:14px;text-decoration:none;background:white;padding:6px 10px;}
	aside nav ul li a:hover		{background:#EEEEEE;}
	#details_div_glowny		{padding-bottom: 10px; padding-top: 5px; width: 100%;}
	#gora_lewa				{float: left; padding-left: 5px; vertical-align: top; font-size: 12px; font-weight: bold; width: 49%;}
	#gora_prawa				{float: right; text-align: right; padding-right: 5px; font-size: 12px; font-weight: bold; width: 49%;}
	.menumain				{float: left; width: 195px;	border-right-style: solid; border-right-width: 0px; border-right-color: #555555; background-color: #FBFBFB;}
	.menumain_new 			{display: none; position: absolute; top: 100px; z-index: 3; width: 250px; border: 1px solid #E6E6E6; background-color: #FBFBFB; font-size: 12px;}
	.menumain_new a img		{width: 12px;}
	.menumain_new a			{display: block; padding: 7px; padding-left: 10px; text-decoration: none; border: 0px;}
	.menumain_new a:hover	{background-color: #E6E6E6;}
	.menudown-container		{border-bottom: 0px solid #A8A8A8; margin-top: 0px; position: relative; z-index: 0; display: flex;}
	.menudown				{width: 300px;}
	.search_bit, .login_bit {display: none; position: absolute; top: 100px; right: 0px; z-index: 3; width: 250px; padding: 5px; padding-left: 10px; border: 1px solid #E6E6E6; background-color: #FBFBFB;}
	.tresc					{float: right; width: 100%; padding: 10px; padding-bottom: 0px;}
	.commenttextarea		{width: 358px;}
	#left_commentform			{float: left; width: 468px;}
	#right_commentform			{float: right;}
	.shouttextarea			{border: 0px; border-bottom: solid #585858 1px; width: 83%; background-color: #FBFBFB;}
	.mt_ankieta				{padding: 7px;}
	.ankieta				{}

	.desktop-menu-container	{display: flex; align-content: stretch; height: 30px;}
	.desktop-menu-left 		{display: block; padding-top: 3px; cursor: pointer; float: right; width: 30px; margin-top: 30px;}
	.desktop-menu-left img 	{clear: both;}
	.desktop-menu-center 		{display: block; width: 100%; margin-top: 32px;}
	.desktop-menu-center a 		{display: block; position: relative; top: -22px; left: 55px; width: 130px; height: 61px; border: 0px;}
	.desktop-menu-search 		{display: block; padding-top: 3px; cursor:pointer; width: 100px; margin-top: 24px;}
	.desktop-menu-search img 	{clear: both;}
	.desktop-menu-login 		{display: block; padding-top: 3px; cursor:pointer; width: 100px; margin-top: 24px;}
	.desktop-menu-login img 	{clear: both;}
	
	#zbiornik_cat			{float: left; width: 42%; margin-bottom: 5px;}
	#zbiornik_news			{float: right; width: 57%; margin-bottom: 5px;}
	.new-img-links			{background-color: #FBFBFB; width: 25%;}
	.new-img-links div		{padding-left: 5px; position: relative; top: 50%; transform: translate(0%,-50%)}
	.new-img-container 		{display: flex; justify-content: stretch; flex-direction: row; flex-wrap: wrap; width: 100%; align-content: stretch; margin-left: auto; margin-right: auto; overflow: hidden;}
	.new-img-children 		{width: 25%; background-color: #FBFBFB;}
	.random-img-children 	{width: 100%; background-color: #FBFBFB;}
	.footer					{text-align: center; padding: 3px; font-size: 10px;}
}

/*-- HOME --*/
.pad3 						{padding: 3px;}
.shouts						{margin-bottom: 10px; text-align: justify; height: 360px; padding: 3px; overflow: auto; width: 100%;}
	
/*-- DETAILS --*/
#imgtitle					{padding: 3px;}
#image_div 					{background-color: #141414; text-align: center; padding-top: 2px; position: relative; overflow: hidden;}
#image_div img 				{max-width: 100%; height: auto;}
.data						{min-height: 232px;font-size: 12px; margin-left: 5px; background-image: url('images/1261.gif'); background-position: right top; background-repeat: no-repeat;}
.data p						{padding-bottom: 10px;}
.data_desc a				{text-decoration: underline dotted;}
.sto 						{width: 100px;}
#prev_image				{position: absolute; width: 50%; height: 100%;}
#prev_image:hover		{background-image: url('img/prev_image.png'); background-position: 5% center; background-repeat: no-repeat;}
#next_image				{position: absolute; width: 50%; height: 100%; left: 50%;}
#next_image:hover		{background-image: url('img/next_image.png'); background-position: 95% center; background-repeat: no-repeat;}
#prev_image a			{display: block; width: 100%; height: 100%; border: 0px;}
#next_image a			{display: block; width: 100%; height: 100%; border: 0px;}

				

/*--COMMENTS--*/
.comments				{display: table; width: 100%;}
.comments_body			{display: table-row-group;}
.comment_bit			{display: table-row; border-bottom: 1px dotted #D5D5D5;}
.comment_bit > div			{padding: 5px; display: table-cell;}
.comment_user_name		{font-weight: bold;}
.comment_user_level		{font-size: 9px; color: gray; padding-bottom: 3px;}
.comment_date			{font-size: 9px; color: gray;}

/*--LISTA--*/
.lista 						{border-width: 0px; background-color: #D5D5D5; width: 799px; text-align: left;}
.lista tr td a:hover 			{color: #ff2e10;}
.lista tr td a 					{border: 0px;}
.lista tr td a img 				{border: 0px;}
.lista_naglowek 				{text-align: center; background-color: #D5D5D5; font-weight: bold; font-size: 12px; height: 23px;}

/*-- inputy --*/
.searchinput				{border-width: 0px 0px 1px 0px; border-color: #A8A8A8; margin-bottom: 4px; margin-top: 3px; width: 125px; position: relative; left:2px; background-color: #FBFBFB;}
.searchinput-desktop		{border-width: 0px 0px 1px 0px; border-color: #A8A8A8; margin-bottom: 4px; margin-top: 3px; width: 216px; position: relative; left:2px; background-color: #FBFBFB;}
.searchinput-mobile			{border-width: 0px 0px 1px 0px; border-color: #A8A8A8; margin-bottom: 4px; margin-top: 3px; width: 85%; position: relative; left:2px;}
.searchbutton				{border: 0px; margin: 0px; position: relative; left:-1px; top:4px;}
.searchbutton-desktop		{border: 0px; margin: 0px; position: relative; left:-1px; top:4px; width: 24px;}
.logininput					{border-width: 0px 0px 1px 0px; border-color: #A8A8A8; margin-bottom: 4px; margin-top: 3px; width: 100%; position: relative; left:2px;}
.smalltext					{font-family: Tahoma,Verdana; font-size: 10px;}
.red						{color: red;}

.button						{background-color: #D5D5D5;	border: 1px solid #585858; font-family: Tahoma;	font-weight: bold; padding: 3px; font-size: 12px;}
#zuod						{margin-top: 10px; margin-left: 10px;}
#divpusty					{clear: both;}
#opisowa					{width: 90px;}

/*-- tabsy --*/
div.demolayout				{width: 100%; margin: 10px 0 10px 0;}
ul.demolayout				{list-style-type: none; width: 100%; float: left; background: url(img/pixel.gif) bottom left repeat-x;}
ul.demolayout li				{margin: 0 2px 0 0; float: left;}
ul.demolayout a				{background: #EEEEEE; float: left; display: block; padding: 4px 8px; border: 1px solid #D5D5D5; border-bottom: 0; text-decoration: none; font-weight: bold;}
ul.demolayout a:hover			{background: #FBFBFB; color: red;}
ul.demolayout a.active		{background: #FBFBFB; padding-bottom: 5px; cursor: default;}
.tabs-container				{clear: left; border: 1px solid #D5D5D5; border-top: 0px; padding: 20px 8px 0px 8px; padding: 5px; text-align: justify;}
#demo h2						{font-size: 100%; margin: 0px 0px 20px 0px;}


/*--CONTACT_FORM--*/
.hide1						{display: none; height: 350px;}
.left						{float: left; width: 288px;}
.right						{font-size: 10px; margin-top: 12px; float: right; text-align: right; width: 80px;}

/*--ankieta--*/
.odp 						{font-size: 10px;}
/*--wyniki ankiety--*/
.pytanie 					{font-weight: bold; font-size: 14px; padding-bottom: 10px;}
ul.wyniki_zbiornik 			{padding: 0; margin: 10px 0; list-style: none; width: 700px;}
.wyniki_zbiornik li 			{clear:both; padding: 3px 5px 3px 10px; overflow: hidden;}
.wyniki_zbiornik li p			{display: inline; padding: 0; margin: 0 0 10px; line-height: 16px;}
.wyniki_procent				{float: right; margin-top: 1px; text-align: right; width: 34px;}
.wyniki_ramka 				{border: 1px solid #E0E0E0; display: inline; height: 7px; float: right; margin: 5px 0px 0px 5px; overflow: hidden; width: 150px;}
.wyniki_ramka span 			{display: block; height: 7px; background: #D40000; float: left; overflow: hidden;}
.wyniki_url					{font-size: 10px;}
.wyniki_suma 				{margin-top: 5px; margin-bottom: 20px;}

/*-- loading animation --*/

.romb-parent {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #FBFBFB; 
}
.romb {  
  display: block;
  position: absolute;
  width: 50px;
  height: 50px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}	

.romb div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 50px;
  height: 50px;
  background-color: #E6E6E6;
  transform: rotate(45deg) skew(12deg,12deg);
  animation-name: romb;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes romb {
 100% {transform: rotate(45deg) skew(12deg,12deg) scale(0.5); opacity: 0.0;}
}

/*-- hover animation --*/

.romb-hover {position: relative; overflow: hidden;}

.romb-hover:hover div {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: rotate(45deg) skew(12deg,12deg) translate(-50%,-50%);
  width: 1px;
  height: 1px;
  background-color: #E6E6E6;
  opacity: 0.3;
  animation-name: romb-hover;
  animation-duration: 0.5s;
  animation-iteration-count: 1; 
  animation-timing-function: ease-out;
}

@keyframes romb-hover {
 100% {transform: rotate(45deg) skew(12deg,12deg) scale(400); background-color: transparent;}
}

/*--

.lds-ring {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #FBFBFB; 
}
.lds-parent {
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.lds-parent div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  border: 4px solid #fff;
  border-radius: 50%;
  animation: lds-ring 2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #f31e10 transparent transparent transparent;
}
.lds-parent div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-parent div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-parent div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}