.przyklad2{
    //word-break: break-all;
    text-align: justify;
    max-width: 100%;
    margin: 0 auto;
}

article p{
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}


.przyklad{
word-wrap:break-word;
}

.bg {
  width: 100vw;
  height: 100vh;
  background: url('https://images.pexels.com/photos/235985/pexels-photo-235985.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260')
    no-repeat;
  background-size: cover;
  display: flex;
  align-content: center;
  align-items: center;
  .content {
    flex: 1;
    text-align:center;
    color: #fff;
    p {
      font-size: 3rem;
    }
    a {
      display: inline-block;
      padding: 2%;
      background-color: #ddd;
    }
  }
}





.kontener {
  position: relative; /* obrazek będzie się zmieniał rozmiar wraz ze stroną */
  text-align: center; /* wyśrodkowanie obrazka */
  color: black; /* kolor tekstu */
}

.srodek {  >>tekst zawsze będzie na środku
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.guzik {
  position: absolute;
  top: 70%; /* położenie względem kontenera, ale też wynikające z ilości tekstu. nad tym należy mieć kontrolę. przycisk będzie na środku, ale tylko w pionie. w poziomie będzie schodził poniżej tekstu */
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  /* tutaj oczywiście możesz dodać inne dodatkowe style dla przycisku */
}





.nekrolog {
  
background: #787878 url(nekrolog_wzor.jpg) repeat left top ;  

//background: white;//#8eca8e;
  border: 2px solid #3b5998;//#6e9b6e;
  border-radius: 8px;
  padding: 1ex;
}

body{ font-family: verdana,tahoma;font-size: 11px;color: #000;background-color: #fff;}	
td { font-family: verdana,tahoma;font-size: 11px;color: #000}

a:link,a:visited,a:active {color: #000;text-decoration: none;}
a:hover {color: #9E3F09;text-decoration: underline;}

.tlo { background-color: #ffffcc }


.xfoto {background: url(images/arrow.gif);text-align:center;font-weight:bold;color:#fff}


.foto {text-align:center;border:1px solid #3B5998;padding:0px;font-size:0px;letter-spacing:1px; width:150px;}

.top {background: url(images/tlofb.jpg); width:800px;height:70px}

.topbraz {background: url(images/topbraz1.jpg); width:800px;height:120px}

.topbnniebieski {background: url(images/topbnn.jpg); width:800px;height:120px}


.topn {background: url(http://parafiagrzawa.pl/images/tlofb.jpg); width:800px;height:75px}

.topministranci {background: url(images/topministranci.jpg); width:800px;height:80px}

.topdm {background: url(images/topdm.jpg); width:800px;height:80px}

.topniski {background: url(images/topfb.jpg); width:800px;height:70px}

.toprw {background: url(images/toprw.jpg); width:800px;height:80px}

.topniedziela {background: url(images/topniedziela.jpg); width:800px;height:120px}

.topsynod {background: url(images/topsynod2.jpg); width:800px;height:70px}

.topziel {background: url(images/topziel.jpg); width:800px;height:80px}

.topczerwony {background: url(images/topczerwony.jpg); width:800px;height:80px}

.topfiolet {background: url(images/topfiolet.jpg); width:800px;height:120px}

.topblack {background: url(images/topblack.jpg); width:800px;height:80px}

.tresc {width: 450px; height: 100%; float: right; padding: 5px 15px;}

.topja {background: url(images/baner.swf); width:800px;height:120px}

.m {background: url(images/tlo.jpg); width:200px;height:30px;text-align:center;font-weight:bold;color:#fff}

.mbraz {background: url(images/topbraz1.jpg); width:200px;height:30px;text-align:center;font-weight:bold;color:#fff;solid:2;size:2}

.mbrazszer {background: url(images/topbraz1.jpg); width:200px;height:30px;text-align:center;font-weight:bold;color:#fff;solid:2;size:2}

.mziel {background: url(images/tlo.jpg); width:200px;height:30px;text-align:center;font-weight:bold;color:#fff}

.m2 {background: url(images/topziel.jpg); width:30px;height:30px;text-align:center;font-weight:bold;color:#fff}

.madwent {background: url(images/tloadwent.jpg); width:200px;height:30px;text-align:center;font-weight:bold;color:#fff}

.mja {background: url(images/tlosnieg.jpg); width:200px;height:30px;text-align:center;font-weight:bold;color:#fff}



.mjaf {background: url(images/tlofirmy.jpg); width:200px;height:20px;text-align:center;font-weight:bold;color:#fff}

.mjaf2 {background: url(images/tlofirmy2.jpg); width:200px;height:20px;text-align:center;font-weight:bold;color:#fff}

.mjaf3 {background: url(images/tlofirmy3.jpg); width:200px;height:20px;text-align:center;font-weight:bold;color:#fff}

.mjaf1 {background: url(images/tlofirmy1.jpg); width:200px;height:20px;text-align:center;font-weight:bold;color:#fff}



.t {text-align:center;border:1px solid #3B5998;padding:10px;font-size:11px;letter-spacing:1px}

.tbraz {text-align:center;border:1px solid #4d0000;padding:10px;font-size:11px;letter-spacing:1px}



.trw {text-align:center;border:1px solid #000000;padding:10px;font-size:11px;letter-spacing:1px}

.tsynod {text-align:center;border:1px solid #FDC909;padding:10px;font-size:11px;letter-spacing:1px}

.tfiolet {text-align:center;border:1px solid #660066;padding:10px;font-size:11px;letter-spacing:1px}


.tblack {text-align:center;border:1px solid #000000;padding:10px;font-size:11px;letter-spacing:1px}

.tniedziela {text-align:center;border:1px solid #000000;padding:10px;font-size:11px;letter-spacing:1px; font color:white}

.tczerwony {text-align:center;border:1px solid #ff0000;padding:11px;font-size:11px;letter-spacing:1px}



.tziel {text-align:center;border:1px solid #006633;padding:10px;font-size:11px;letter-spacing:1px}

.brd {border:1px solid #C6C6C6}

.linki {padding:9px;letter-spacing:1px}
.newsy {padding:10px;text-align:justify}

#linkisr{width:480px;}
#linkiprawa{width:120px;}

.stopka {border:1px solid #3B5998;padding:5px;font-size:11px;letter-spacing:1px}
img {border: 0px;}  

.stopkabraz {border:1px solid #4d0000;padding:5px;font-size:11px;letter-spacing:1px}
img {border: 0px;}  

.stopkasynod {border:1px solid #FDC909;padding:5px;font-size:11px;letter-spacing:1px}
img {border: 0px;} 

.stopkarokwiary {border:1px solid #808080;padding:5px;font-size:11px;letter-spacing:1px}
img {border: 0px;}  

.stopkaziel {border:1px solid #006633;padding:5px;font-size:11px;letter-spacing:1px}

.stopkafiolet {border:1px solid #660066;padding:5px;font-size:11px;letter-spacing:1px}


.stopkaczerwony {border:1px solid #ff0000;padding:5px;font-size:11px;letter-spacing:1px}


.stopkaniedziela {border:1px solid #0066cc;padding:5px;font-size:11px;letter-spacing:1px}

.stopkablack {border:1px solid #000000;padding:5px;font-size:11px;letter-spacing:1px}

.napis {left;font-size:35px;padding:0 0 0 20px}
.www {background: url(images/top11.jpg); width:200px;height:15px;text-align:center;font-weight:bold;color:#fff;left}

.off, .on { 
 display: block;
 padding-right: 4px; 
 cursor: pointer;
}

.off {
 background: url('/resource/2off.png') center right no-repeat;
}
.on {
 background: url('/resource/2on.png') center right no-repeat;
}






ul#navigation {
    position: fixed;
    margin: 0px;
    padding: 0px;
    top: 100px;
    left: 0px;
    list-style: none;
    z-index:9999;
}


ul#navigationfiolet {
    position: fixed;
    margin: 0px;
    padding: 0px;
    top: 100px;
    left: 0px;
    list-style: none;
    z-index:9999;
}

ul#navigation li {
    width: 200px;
}
ul#navigation li #posuw {
    display: block;
    margin-left: -650px;
    width: 450px;
    height:480px;    
    background-color:#CFCFCF;
    background-repeat:no-repeat;
    background-position:left;
    border: 2px solid #9E3F09;
    -moz-border-radius:0px 10px 10px 0px;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -khtml-border-bottom-right-radius: 10px;
    -khtml-border-top-right-radius: 10px;
    /*-moz-box-shadow: 0px 4px 3px #000;
    -webkit-box-shadow: 0px 4px 3px #000;
    */
    opacity: 1;

    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
}




ul#navigation .home #posuw{
    background-image: url(images/xxx.gif);    
}

ul#navigation .home #posuwfiolet{
    background-image: url(images/xxx.gif);    
}


ul#navigation .about a      {
    background-image: url(../images/id_card.png);
}
ul#navigation .search a      {
    background-image: url(../images/search.png);
}
ul#navigation .podcasts a      {
    background-image: url(../images/ipod.png);
}
ul#navigation .rssfeed a   {
    background-image: url(../images/rss.png);
}
ul#navigation .photos a     {
    background-image: url(../images/camera.png);
}
ul#navigation .contact a    {
    background-image: url(../images/mail.png);
}


#facebook-likebox {
    height: 480px;
    width: 294px;
    position: fixed;
    right: -305px;
    top: 50%;
    margin-top: -246px;
    background-color: #ffffff;
    border-color: #335F9D;
    border-style: solid;
    border-width: 1px 0px 1px 1px;
    padding: 5px;
    z-index: 6;
}

#facebook-likebox-button {
    position: absolute;
    left: -43px;
    top: -1px;
    display: block;
    padding: 12px 16px;
    background-color: #335F9D;
    border-radius: 5px 0px 0px 5px;

}













/* reset */
.musli *{
	padding:0;
	margin:0;
	list-style:none;
}
.musli{
	position:fixed;
	right:0px;
	top:150px;
	z-index:100;
	list-style:none;
}
.musli-bottom{
	left:300px;
	bottom:0px;
	right:auto;
	top:auto;
}
.musli-top{
	left:300px;
	top:0px;
	right:auto;
	bottom:auto;
}
.musli-left{
	left:0px;
	top:200px;
	right:auto;
	bottom:auto;
}
.musli > li{
	cursor:pointer;
	width:35px;
	height:35px;
	margin-bottom:1px;
	position:relative;
}
.musli-bottom > li, .musli-top > li{
	margin-right: 1px;
	margin-bottom: 0;
	float:left;
}
.musli > li > img{
	-moz-border-radius: 5px 0 0 5px;
	-webkit-border-radius: 5px 0 0 5px;
	border-radius: 5px 0 0 5px;
}
.musli-bottom > li > img{
	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
}
.musli-top > li > img{
	-moz-border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
}
.musli-left > li > img{
	-moz-border-radius: 0 5px 5px 0;
	-webkit-border-radius: 0 5px 5px 0;
	border-radius: 0 5px 5px 0;
}
.musli > li > div{
	padding:5px;
	background: #fff;
	float:left;
	width:286px;
	height:296px;
	-moz-border-radius: 0 0 0 8px;
	-webkit-border-radius: 0 0 0 8px;
	border-radius: 0 0 0 8px;
	position:absolute;
	top:0;
	left:35px;
	z-index:100;
}
.musli-bottom > li > div{
	top:35px;
	left:auto;
	-moz-border-radius: 0 8px 0 0;
	-webkit-border-radius: 0 8px 0 0;
	border-radius: 0 8px 0 0;
}
.musli-top > li > div{
	bottom:35px;
	left:auto;
	top:auto;
	-moz-border-radius: 0 0 8px 0;
	-webkit-border-radius: 0 0 8px 0;
	border-radius: 0 0 8px 0;
}
.musli-left > li > div{
	top:0px;
	left:auto;
	right:35px;
	-moz-border-radius: 0 0 8px 0;
	-webkit-border-radius: 0 0 8px 0;
	border-radius: 0 0 8px 0;
}
.musli-google{
	border: solid #cd3c2a 3px;
}
.musli-facebook{
	border: solid #0170cf 3px;
}
.musli-twitter{
	border: solid #07afee 3px;
}
.musli-nk{
	border: solid #8fc44c 3px;
}