article, footer, header, main, nav, section { display: block;}
body, table, td, tr, img, h1, h2, h3, h4, p, div, form {margin: 0; padding: 0; text-indent:0; border:0} 
html {  height: 100%; scroll-behavior: smooth; }
/* OGÓLNE */
body {font-family: Arial, sans-serif; color: #444; background: #fff; font-size:16px; }
a {text-decoration:none; font-size: 14px;  line-height: 24px; }
a:link,a:visited { color:#c00;}
a:hover,a:active { color: #777; }
li {   text-indent:0;  padding:0px; margin: 0px 0px 0px 24px;text-align:left;line-height:22px; }
ul { padding:0px; margin:  7px 0px 5px 0px; list-style-type: square;}

/* STRUKTURA STRONY */

#NAW_ZEWN  {position: fixed; top:3px; min-height:24px; width: 100%;  background: #fff; z-index: 10;  background-color: rgba(255, 255,255, 0.77); /*  ostatnia liczba przeźroczystość 0-1 ,  FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */ 
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#77ffffff,endColorstr=#77ffffff);/* IE6–IE9, pierwsze 2 liczby po # przeźroczystość w syst. szesnastkowym*/  zoom: 1;;}
#NawWEWN  { height:24px; min-width: 320px; max-width:960px; color:red;  margin: 0 auto; text-align:right;  }
      /* wygląd elementów - li */
      #NawWEWN  li {  list-style-type:none; display:inline; margin:-5px 0 0 0; padding: 0;  float:right;    }
      /* wygląd elementów - a */
      #NawWEWN  a:link, #NawWEWN  a:visited {  display:block; padding: 0 14px 0 14px; text-decoration:none;  text-align:center; color:#c00;   font-family: Arial, sans-serif; }
      /* wygląd elementów - a - po najechaniu kursorem myszki na element - li */
     #NawWEWN a:hover { color:#f00; background: #eee; }

#NAG_ZEWN  {margin: 33px auto 0; background: #777}
#NagWEWN  {position: relative; height:200px; min-width: 320px; max-width:960px;margin: 0 auto 0; background: #777  url(grafiki/baner.jpg) no-repeat top right; }

#NagLewy  {display:table-cell;  vertical-align: middle; min-width: 250px; height:200px; color: #fff; text-align:center; font-size: 21px;  line-height:24px;font-weight: normal;}
#NagLewy h1 {border-bottom: #fff 1px solid;  font-size: 21px;  line-height:24px; font-weight: normal; text-shadow: #000 1px 2px 1px;}
#NagLewy h2 {font-family: Arial, sans-serif; font-size: 14px;  line-height:24px; font-weight: normal; text-shadow: #000 1px 1px 2px;}
#NagPrawy {position: relative; display:table-cell;height:200px;  width:75%;}
#NagPrawy img.logo {position: absolute; right:0px; top:10%;}
#NagPrawy img.tel {position: absolute; right:0px; top:67%;}
#ZAW_ZEWN  {background: #fff;}
#ZawWEWN  {min-width: 320px; max-width:960px; background: #eee; margin: 0 auto}
.ZawLewy  {display:table-cell; background-color:#ddd; border-bottom: #eee 3px solid; min-height:28px;  min-width: 200px;}
.ZawLewy> h3 {margin: 0 7px 7px 21px; color: #c00; font-weight: normal; font-size: 20px;  line-height:28px;}
.ZawLewy> p {margin: 0 7px 7px 21px; color: #444; font-weight: normal; font-size: 16px;  line-height:22px;}
.ZawLewy> img {margin: 21px 0}
.ZawLewy> span, #ZawPrawy span  {color: #c00; font-size: 20px;  line-height:28px; }
.ZawLewy> img, #ZawPrawy img{ max-width: 100% !important; }

.ZawPrawy {display:table-cell; min-height:100px; width:74%;  border-bottom: #fff 3px solid;}
.ZawPrawy> li {list-style-image: url(grafiki/pkt.gif)}
.tekst> iframe { max-width: 100% !important; }
 
.tekst { font-size: 15px;  line-height:24px; margin: 28px 48px}
.tekst> a > h2 { font-size: 18px;  line-height:24px; color: #000; }
.tekst> a > h2:hover {color: #C00; }
.doprawej {float: right; margin: 0 0 7px 14px}
#PASEK_ZEWN  { background: #fff;}
#PasekWEWN  { height:30px; min-width: 320px; max-width:960px; color:red; background: #fff; margin: 0 auto}



/* ///////// STOPKA */
#PASEK_STOPKI  { clear:both; background:#777; width:100%;}
     
#PasekWewnStop  {position: relative;min-width: 320px; width:97%;height:28px; color:#ccc; margin: 0px 10px 20px 10px; overflow:hidden;  }

#PasekWewnStop > h3 { position:absolute;  margin:0; white-space:nowrap;  color:#ccc;font-size:14px; line-height:28px;
        animation:przesun 30s linear infinite;font-weight: normal;
        -webkit-animation:przesun 30s linear infinite; /* dla Google Chrome, Safari, Opera 15+ */}
	 
#PasekWewnStop  > p:hover  {
        animation-play-state:paused;
        -webkit-animation-play-state:paused;
      }

    /* ------------ANIMACJA-PRZESUN------------ */
      @keyframes przesun
      {
        0% { transform:translateX(0); padding-left:100%; }
        100% { transform:translateX(-100%); padding-left:100%; }
      }

      @-webkit-keyframes przesun /* dla Google Chrome, Safari, Opera 15+ */
      {
        0% { -webkit-transform:translateX(0); padding-left:100%; }
        100% { -webkit-transform:translateX(-100%); padding-left:100%; }
      }
footer {text-align:center; }

/* ---- 860px ------------- */
/*  @media all and (max-width:860px) 
{
#tekst { margin: 28px 7px 28px 21px}
}  */
/* ---- 700px ------------- */
 @media all and (max-width:700px) 
{
#NAG_ZEWN  {margin: 80px auto 0; background: #fff}
#NagWEWN  {position: relative; height:200px; min-width: 320px; max-width:960px;margin: 0 auto 0; background: #777  }


.ZawLewy, .ZawPrawy  {display: inline-block; width:100%;}
.ZawLewy> img {display:none;}
.ZawLewy> p {padding: 7px 7px 0 0px}
.ZawPrawy> img { width: 30%; height:auto}
.tekst { margin: 28px 18px}
	  
#NawWEWN  { height:24px; min-width: 320px; max-width:960px;  margin: 0 auto; text-align:right;  }
      /* wygląd elementów - li */
      #NawWEWN  li {  margin: -5px 0 7px 3px; padding: 0;  float:right;    }
      /* wygląd elementów - a */
      #NawWEWN  a:link, #NawWEWN  a:visited {  padding: 3px 7px 3px 7px; 
	  border: #ccc 1px solid; border-radius: 4px; 	-moz-border-radius: 4px; 	-webkit-border-radius: 4px;  color:#444;  background: #eee  }
      /* wygląd elementów - a - po najechaniu kursorem myszki na element - li */
     #NawWEWN a:hover { color:#f00; background: #fff; }	  
	 
	 
} 
/* ---- 500px ------------- */
@media all and (max-width:500px) 
{
#NAG_ZEWN  {margin: 0px auto 0; }
#NAW_ZEWN { display:none;}
#NagLewy  {min-width: 170px; height:200px; color: #fff; text-align:center; font-size: 21px;  line-height:24px;font-weight: normal;}
#NagPrawy {position: relative; display:table-cell;height:200px;  width:45%;}

#NagLewy h1 {border-bottom: #fff 1px solid;  font-size: 16px;  line-height:20px; font-weight: normal; text-shadow: #000 1px 2px 1px;}
#NagLewy h2 {font-family: Arial, sans-serif; font-size: 14px;  line-height:24px; font-weight: normal; text-shadow: #000 1px 1px 2px;}

#NagPrawy img.logo {position: absolute; right:0px; top:10%;max-width: 100% !important; height: auto }
#NagPrawy img.tel {position: absolute; right:0px; top:67%;max-width: 100% !important; height: auto}
.doprawej {float:none}
}