body  {font-family: 'Exo 2', sans-serif;}
a:link    { color: #000070;}
a:visited { color: #000070;}
a:hover   { color: #0096CD;}
a:active  { color: #000070;}


div.topfix {
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 980px;
  height: 140px;
}


div.menugrad {
  margin: 0;
  text-align: left;
  position: fixed;
  top: 0;
  left: 0;
  width: 225px;
  height: 100%;
  background-color: #000070;
}

div.menu {
  margin: 0;
  text-align: left;
  position: fixed;
  top: 0;
  left: 0;
  width: 225px;
  height: 100%;
}

div.banner {
  margin: 0;
  text-align: left;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 140px;
  background-color: #000070;
}

div.head {
  margin: 0;
  text-align: left;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-height: 140px;
  background-color: #000070;
}

div.topfoto {
  margin: 0;
  text-align: left;
  position: fixed;
  top: 0;
  left: 0;
  width: 250px;
  height: 140px;
}

div.logo {
  margin: 0;
  text-align: center;
  position: fixed;
  top: 13px;
  left: 0;
  width: 100%;
  height: 140px;
}

div.popmenu {
  margin: 0;
  position: fixed;
  top: 124px;
  right: 10px;
}

.foto {
    box-shadow: 7px 10px 40px grey;
    padding: 10px 10px 10px 10px;
    margin: 15px;
}


      .pokaz {
        width:715px;
        height:210px;
        background: url('spites.jpg') no-repeat;
    box-shadow: 7px 10px 40px grey;
    margin: 15px;
      }  

      #fotki {
        animation:ruch 5s steps(5) infinite, droga_lew-1 10s infinite alternate;
        -webkit-animation:ruch 5s steps(5) infinite, droga_lew-1 10s infinite alternate;
      }


      /*-------------------ANIMACJE-------------------*/
      @keyframes ruch
      {
        0% {background-position: 0 0;}
        100% {background-position: 0 -1050px;}
      }
 

      /* dla przeglądarki Google Chrome, Safari, Opera 15+ */
      @-webkit-keyframes ruch
      {
        0% {background-position:0 0;}
        100% {background-position:0 -1050px;}
      }



      .pokaz980 {
        width:980px;
        height:330px;
        background: url('spites980.jpg') no-repeat;
       }  

      #fotki980 {
        animation:ruch980 5s steps(4) infinite, droga_lew-1 10s infinite alternate;
        -webkit-animation:ruch980 5s steps(4) infinite, droga_lew-1 10s infinite alternate;
      }


      /*-------------------ANIMACJE-------------------*/
      @keyframes ruch980
      {
        0% {background-position: 0 0;}
        100% {background-position: 0 -1320px;}
      }
 

      /* dla przeglądarki Google Chrome, Safari, Opera 15+ */
      @-webkit-keyframes ruch980
      {
        0% {background-position:0 0;}
        100% {background-position:0 -1320px;}
      }






div.ofrfot {width: 280px; }

div.ofrtxt {padding-left: 310px; }



/* ------------------------ROZWIJANE MENU------------------------ */

      /* ------------------------CZĘŚĆ-GÓRNA-MENU------------------------ */

      /* wygląd głównego elementu - ol */
      ol {
        list-style-type:none;
        padding:0;
        margin:0;
        font-size:12px;
	font-weight: bold;
        height:14px;
        text-align:center;
      }

      /* wygląd wszystkich elementów - a - znajdujących się w elemencie - ol */
      ol a {
        display:block;
        text-decoration:none;
        color: black;
        padding:0 5px;
      }

      /* wygląd elementów - li - wszystkich dzieci elementu - ol */
      ol > li {
        float:left;
        width:80px;
        margin-left:1px;
        background-color:#FDD200;
        height:2em;
      }

      /* wygląd elementu - li - pierwszego dziecka elementu - ol */
      ol > li:first-child {
        margin-left:0;
      }

      /* wygląd elementów - li - wszystkich dzieci elementu - ol - po najechaniu kursorem myszki na element - li */
      ol > li:hover {
        background-color: #FDD200;
      }

      /* wygląd elementu - a - dziecka elementu - li - będącego dzieckiem elementu - ol - po najechaniu kursorem myszki na element - li */
      ol > li:hover > a {
        color: navy;
      }

      /* wygląd elementu - ul - dziecka elementu - li - będącego dzieckiem elementu - ol - po najechaniu kursorem myszki na element - li */
      ol > li:hover > ul {
        display:block;
      }

      /* ------------------------CZĘŚĆ-ROZWIJANA-MENU------------------------ */

      /* wygląd głównych rozwijanych elementów - ul */
      ol > li > ul {
        display:none;
        list-style-type:none;
	font-weight: normal;
        padding:0;
        margin:0;
      }

      /* wygląd elementu - li - w części rozwijanej */
      ol > li > ul > li {
        position:relative;
        background-color:#EEEEEE;
      }

      /* wygląd elementu - a - w części rozwijanej */
      ol > li > ul > li > a {
        border-top:1px solid #0096CD;
      }

      /* wygląd elementu - li - w części rozwijanej, po najechaniu kursorem myszki na dany element - li */
      ol > li > ul > li:hover {
        background-color:#CCCCCC;
      }

      /* wygląd elementu - a - w części rozwijanej, po najechaniu kursorem myszki na element - li */
      ol > li > ul > li:hover > a {
        color: #0096CD;
      }



html  {font-family: 'Exo 2', sans-serif; }
p     {font-family: 'Exo 2', sans-serif; text-align: justify; font-size: 21px; }
p.sol {font-family: 'Exo 2', sans-serif; text-align: justify; font-size: 21px; }
p2    {font-family: 'Exo 2', sans-serif; text-align: left;    font-size: 2vmin; padding: 0px ; margin: 0px;}
p3    {font-family: 'Exo 2', sans-serif; font-size: 2.5vmin; }
h1    {font-family: 'Exo 2', sans-serif; text-align: center;  font-size: 30px; font-style: italic; }
h2    {font-family: 'Exo 2', sans-serif; text-align: center;  font-size: 24px; font-style: italic; }
h3    {font-family: 'Exo 2', sans-serif; text-align: left;    font-size: 4.5vmin; font-style: bold; padding: 0px ; margin: 0px; }
div.head   {display:none;}


@media print {
img.foto   {height: 35mm; }
div.ofrfot {width: 40mm; }
div.ofrtxt {padding-left: 45mm; }
div.banner   {display:none;}
div.logo   {display:none;}
div.topfoto   {display:none;}
div.popmenu   {display:none;}
div.head   {display:inline;}
html  {font-family: 'Exo 2', sans-serif; }
p     {font-family: 'Exo 2', sans-serif; text-align: justify; font-size: 12pt; }
p2    {font-family: 'Exo 2', sans-serif; text-align: left;    font-size: 6pt; padding: 0px ; margin: 0px;}
p3    {font-family: 'Exo 2', sans-serif; font-size: 8pt; }
h1    {font-family: 'Exo 2', sans-serif; text-align: center;  font-size: 18pt; font-style: italic; }
h2    {font-family: 'Exo 2', sans-serif; text-align: center;  font-size: 14pt; font-style: italic; }
h3    {font-family: 'Exo 2', sans-serif; text-align: left;    font-size: 13pt; font-style: bold; padding: 0px ; margin: 0px; }
}