/* CSS Document */
body {	font-family: 'Signika', sans-serif; font-size: 18px; background-color:#999; 	padding:0; margin: 0 ;  }

#head {	margin:0; padding: 0; 	background-color: #ff9933;  border-bottom:1px solid red;}	
#pudlo {clear:both; }

.blog1str {line-height: 60px;}
.blog1str a {color: #eee; 	padding: 19px 4px 4px 19px; display: block; float: left;}
.blog1str a img {margin: 0.4rem; width:50px; height:50px;  }
.czysc {clear: both; }


#foto img, #foto2 img{	margin-top:20px;	border:2px solid #666;	max-height:600px;}
#foto  p, #foto2  p{	color: #333;	margin-top: 0px;	}	

.miniatury{	margin:-10px 0 10px 0;	}
.miniatury a:hover {	border: 0px;	left: 1px;	top: 2px;	position: relative;		}
.miniatury ul{	margin: 10px 0 10px 0;	padding: 0;	display:inline;	}
.miniatury li{padding: 7px;	display:inline;	list-style-type: none;}
.miniatury img{	border: 0px; padding: 0.5em;}	
	
		
#stopka { background: #F0F0F0;	border-top:6px solid #aa7;	clear:both;	padding:10px;	background-color: #f93;	clear: both; }	
#stopka p {	margin: 0;	color: #eee;	text-align: center;		}
#stopka li{	display: inline;	}	


h1, h1 {font-size: 64px;}	
a { text-decoration:underline; color:#eee;}
a:hover {color:#f93;}
		
#foto  #foto2  {font-size:0.9em;  margin:10px 0 -13px 0; color: #555; }
#foto .numer, #foto2 .numer {background-color: #777; border-left: 50px solid #888; color: #999; font-size: 1.8em; margin: 60px 0 -10px; padding: 10px 20px;}

		/* prawy */		
#prawy {	margin: 27px 0; background-color: #888;  padding: 5px;	border-top: 6px solid #777; border-bottom: 6px solid #777; text-align: center;  display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end;}
@media (min-width: 1100px) {  #prawy {	max-width:200px;} }

#prawy div {  flex-shrink: 3;  padding: 0.5rem;  margin: 0.5rem;}

#prawy img{	width: 85px;  height: 85px;  }

/* komentarze  ---------------------------  */
div#usernotes {	background-color: transparent; color:#eed;}

div#usernotes a {	color:#fff;  text-decoration: none; }
div#usernotes a:hover {	 color:#fff;  text-decoration: underline;  }
div#usernotes div.note   {margin:0 8em 12px 2em; border-bottom:2px dashed;	padding: 4px;}

div#usernotes div.text { 	padding:2px;	margin-top:4px; background-color:#fb5; color:#000; }
div#usernotes div.text .numer { float: left;  font-size:1.2em;  margin:-2px 0 0 -32px ; color: #fff; background-color: #aa7;  padding:2px 10px 2px  2px; font-style: oblique; }

div#usernotes  td {color:#000;  }
div#stopka .jas-tex {color:#f93; font-size:1.1rem; }

div#koment {padding:16px;}
div#koment  * {box-sizing: border-box;}
div#koment  input, select, textarea {  width: 100%;  padding: 12px;  border: none;  border-radius: 8px;  resize: vertical;  color: black;} 
div#koment  label {  padding: 12px 12px 12px 0;  display: inline-block;}
div#koment  input[type=submit] {  background-color: #fff;  color:#444;  padding: 12px 20px;  border: none;  border-radius: 4px;  cursor: pointer;  float: left;}
div#koment  input[type=submit]:hover {  background-color: #eee;}
div#koment  .container {  padding: 20px;}
div#koment  .col-25 {  float: left;  width: 25%;  margin-top: 6px;}
div#koment  .col-75 {  float: left;  width: 75%;  margin-top: 6px;}
/* Clear floats after the columns */
div#koment  .row:after {  content: "";  display: table;  clear: both;}
/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */

@media (max-width: 600px) {  .col-25, .col-75, input {    width: 100%;    margin-top: 0;  }
h1, h1 {font-size: 50px; }}