article, aside, details, 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} 

/* OGÓLNE */
body {font-family: Arial, sans-serif; color: #444; background: #d7dbd7;}

li {   text-indent:0;  padding:0px; margin: 0px 0px 3px  5px;text-align:left;	}
ul { padding:0px; margin: 0px 0px 0px 10px; list-style-type: square;}
iframe  {max-width: 100% !important; border-bottom: #c9a56e 1px solid; width:100%; margin: 0 0 10px 0 }
#rama {position: relative; font-size:16px;  line-height: 24px; min-width: 240px;   max-width:900px; margin:0px auto; }

.do_lewej { float:left; margin: 0 20px 0 0; display:inline-block; }
.do_prawej { float:right; margin: 0 0 0 20px;display:inline-block; }
.do_srodka {text-align:center; display:block;margin: 0 auto;  }
.clear {clear:both; height:1px; width: 100%}
.clear1 {clear:both; height:1px; width: 100%; margin: 20px 0 ; border-top: #ccc 1px solid;}	
a { text-decoration:none;}
a:link, a:visited { color: #c00;}
a:hover, a:active { color: #ccc; }


/* ---  MENU GÓRNE  --- */
#NAW_ZEWN  { clear:both; width:100%;}
#NawWEWN  {position: relative;  min-width: 320px; max-width: 900px;   margin: 0 auto; }
#nawig_poz {clear:both; padding: 0; text-align: right; width:100%} 
#nawig_poz ul {margin: 0} 
#nawig_poz li {list-style:none; display:inline; margin:0; padding:0} 

#nawig_poz a { }
#nawig_poz a:link, #nawig_poz a:visited {color: #444; margin:0; padding:7px 12px 7px 12px; font-size: 15px; line-height:28px;box-shadow: 2px 3px 4px #777;-webkit-box-shadow: 2px 3px 4px #777;-moz-box-shadow: 2px 3px 4px #777; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; background: #ccc; background: linear-gradient(#ccc, #fff); }
#nawig_poz a:hover {color: #fff; background: #aaa; background: linear-gradient(#eee, #aaa);   }

/* --- NAGŁÓWEK //////////////////////////////////---*/
#NAG_ZEWN  { margin: 0px 0 1px 0; padding: 7px 0 0px 0;  background:  linear-gradient(#fff, #d7dbd7); }
#NagWEWN  { max-width:900px;   margin: 0 auto; color: #444;}
#NagLewy  {display:table-cell; text-align:left; vertical-align: middle;  width:25%; width:250px}
.logo {margin: 0}
#NagSrod  {display:table-cell; text-align: left; vertical-align: middle; min-width:240px; width:35%; padding: 0 0 0 10px;  font-size: 16px;  line-height: 20px }
#NagPrawy {display:table-cell;  text-align:right; vertical-align: middle;   min-width:160px; width:65%; font-family:'Courier New', serif;   font-size: 17px;  line-height: 24px;margin: 0 2px 0 0 ; padding:0; }
#NagPrawy img { vertical-align: middle}

 h1 {font-size: 24px; line-height: 24px;font-weight: bold;color: #333;text-align:left; font-family:'Courier New', serif; }
 h1> span {font-family: Arial, sans-serif; font-size: 14px;  line-height: 14px;}



/* ///////// BANER */
#BANER  { clear:both;  width:100%; margin:7px 0 0px 0;}
#BanerWewn  {max-width:900px; margin: 0 auto; overflow:hidden;  }
 #BanerWewn img {max-width: 100% !important; border: solid 1px white; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;}
 
/* ////////// TREŚĆ GŁÓWNA ---  */
main {  width:100%; padding: 0px 0px 0px 0px;}
main  img { max-width: 100% !important; height: auto;    display: block; }

#tekst_gl {width:100%;position: relative; color: #444; text-align:left;  margin: 10px 0 ; padding: 0;  background: linear-gradient(90deg, #ccc, #fff, #ccc);  
border: #fff 1px solid; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px;}	
.dystans {margin: 21px}
#tekst_gl h2 {display:inline; color: #444;  font-size: 18px; line-height:24px; margin: 0 ;}
#tekst_gl a.nagl {color: #c00;  font-size: 20px; line-height:24px; margin: 0 0 21px 0;}
#tekst_gl a.mail { font-size: 16px; line-height:24px;}
#tekst_lewy, #tekst_prawy {display:table-cell; padding:0px 7px 0px 0px ; width:46%; margin: 0;vertical-align: middle; }
#tekst_odstep {display:table-cell; padding:0; width:2%; }
#tekst_kontakt {display:table-cell; padding:0px 7px 0px 0px ; width:30%; margin: 0; vertical-align: middle; }
#mapa {display:table-cell; padding:0px 7px 0px 0px ; width:70%; }


a.start {display:inline-block;position: absolute; right:7px; bottom:7px; display:table-cell; vertical-align: middle;text-align:center; width: 36px; height: 36px;
  color: #fff; background: #ccc; border: solid 2px #fff;border-radius: 19px; -moz-border-radius: 19px; -webkit-border-radius: 19px;  font-size:24px; line-height:36px}
a.start:hover { color: #fff; background: #aaa; border: solid 2px #fff; }

/* ///////// STOPKA */
#PASEK_STOPKI  { clear:both; background: #ddd; background: linear-gradient(90deg, #bbb, #ddd, #bbb); border-top: #fff 1px solid;border-bottom: #fff 1px solid; width:100%;  }
     
#PasekWewnStop  {position: relative; min-width: 320px; width:97%; min-height:36px; color:#aaa; margin: 0px 10px; overflow:hidden;  }

#PasekWewnStop > h3 { position:absolute;  margin:0; white-space:nowrap;  color:#fff;
        animation:przesun 30s linear infinite; font-weight: normal;
        -webkit-animation:przesun 30s linear infinite; /* dla Google Chrome, Safari, Opera 15+ */  font-size:14px; line-height:36px}
	 
#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;font-size: 13px;  line-height: 24px; }


 /* ---- 740px ------------- */
 @media all and (max-width:740px) 
 {
#nawig_poz a { padding:9px 7px 9px 7px;  font-size: 15px; line-height:36px;}
#tekst_odstep {display:none;}
iframe  {float: none; width: 100%;  }
#NagPrawy a { display:inline-block; margin: 0 3px 0 0; border: #ccc 1px solid; padding:3px 3px ;border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; background: #ccc; background: linear-gradient(#fff, #ccc);}
 }
 
/* ---- 680px ------------- */
 @media all and (max-width:680px) 
 {
#tekst_lewy, #tekst_prawy, #mapa, #tekst_kontakt {display:block;  width:100%; }

/* MENU GÓRNE  POZIOME*/
.do_lewej {float: none}
#nawig_poz a  {text-shadow: none}
#nawig_poz {width:97%; text-align:center; position: relative; left: 0px; margin: 0;} 
#nawig_poz ul {margin:0px; width:97%;  padding: 0px 0 7px 0px;}      
#nawig_poz li { display:inline-block; position: relative; width:auto; list-style:none; text-align: center; padding:0; margin:2px 3px; } 
#nawig_poz a {display:inline-block; width:97%; height: 36px; padding:0 4px; margin:0;
		   box-shadow: 2px 3px 4px #777;-webkit-box-shadow: 2px 3px 4px #777;-moz-box-shadow: 2px 3px 4px #777;
		   border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;	
		    background: #f4f4f4; background: linear-gradient(#f4f4f4, #d5d5c5); 
		    font-size: 15px!important;  line-height:36px!important;  }
#nawig_poz a:link, #nawig_poz a:visited { padding: 4px 4px;}
#nawig_poz a:hover {   }
#NagPrawy {display: block;width:100%; text-align:center ; }
#NagPrawy a {font-size: 20px; line-height:48px; margin: 0 -12px 0 0; padding:5px 7px 5px 3px ;}
#NagSrod { width:50%;}
#NagLewy {width:50%;}

}

/* ---- 600px -------------- */
 @media all and (max-width:600px) 
 {

#rama {   }
header {height:auto}

 #baner {display: block; width:100%;text-align:center;height:auto;clear:both;float: none; margin: 0 }
main { display:block; width:100%;float:none; margin: 0}

 }

/* ---- 500px -------------- */
 @media all and (max-width:500px) 
 {
 
#NagSrod, #NagLewy { display: block;width:100%; text-align:center;min-height: 50px;}
#NagSrod h1 { text-align:center;}
.logo {max-width: 100% !important; height: auto; margin:4px auto; }

}