/* -=-  CSS JanWar Webmaster
   Janusz Warchlewski  ==  2010.02.17  */

body 
{ margin: 0; padding: 4pt 4pt 0;
  color: silver; background-color: #112;
}

body, div, a, p
{ font-family: Verdana, Arial, Tahoma, sans-serif;
  font-size: 9pt; font-weight: normal;
}

a
{ text-decoration: none;
}

img
{ border: 0;
  vertical-align: middle;
}


div.www
{ position: relative;
  width: 1200px; height: 900px;
  margin: 0 auto 8pt;
  background: #E8C816 url(dod/tlo.jpg) no-repeat;
  text-align: center;
}

div.www div, div.www div a, div.www div img
{ -o-transition: width 1s ease, height 1s ease, z-index 1s linear, opacity 1s linear, background-color 1s,
     padding-top 1s ease-out, padding-right 1s ease-out, padding-bottom 1s ease-out, padding-left 1s ease-out;
  -webkit-transition: width 1s ease, height 1s ease, padding 1s ease-out, background-color 1s,
     z-index 1s linear, opacity 1s linear;
  transition: width 1s ease, height 1s ease, z-index 1s linear, opacity 1s linear, background-color 1s,
     padding-top 1s ease-out, padding-right 1s ease-out, padding-bottom 1s ease-out, padding-left 1s ease-out;
}
div.www div
{ position: absolute;
  padding: 2px;
  filter: alpha(opacity=75);
  z-index: 40;
}
div.www div:hover
{ padding: 12px;
  z-index: 80;
  filter: alpha(opacity=100);
}

div.www div a
{ display: block;
  padding: 16px;
  border: 1px solid white;
  -moz-border-radius: 10px; border-radius: 10px;
  background-color: #40401A;
  background-color: rgba(10,10,10,0.3);
  filter: alpha(opacity=65);
}
div.www div:hover a
{ padding: 24px;
  border-color: #F0E8B0;
  -moz-border-radius: 12px; border-radius: 12px;
  background-color: #7A6A30;
  background-color: rgba(10,10,10,0.6);
  filter: alpha(opacity=100);
}
div.www div img
{ border: 3px solid #505030;
  border-color: #303020 #707040 #A0A860 #505030;
  -moz-border-radius: 4px; border-radius: 4px;
  opacity: 0.8;
}
div.www div:hover img
{ width: 800px;
  height: 600px;
  opacity: 1;
}

div.www div.cien, div.www div.cien:hover
{ padding: 16px;
  border: 1px solid #77660A;
  -moz-border-radius: 9px; border-radius: 9px;
  background-color: #444;
  background-color: rgba(10,10,10,0.65);
  z-index: 20;
  filter: alpha(opacity=65);
  transform-origin: 0 0;
  -o-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
}
div.www div.cien img, div.www div.cien:hover img
{ border: 3px solid #505030;
  border-color: #303020 #707040 #A0A860 #505030;
  -moz-border-radius: 4px; border-radius: 4px;
  filter: alpha(opacity=16);
  opacity: 0.16;
}
div.www div.cien:hover img
{ width: 360px;
  height: 240px;
}

div.www div#w1
{ position: absolute;
  left: 100px; top: 80px;
}
div.www div#w2
{ position: absolute;
  right: 200px; top: 80px;
}
div.www div#w3
{ position: absolute;
  left: 100px; bottom: 120px;
}
div.www div#w4
{ position: absolute;
  right: 200px; bottom: 120px;
}

div.www div#w21
{ position: absolute;
  left: 130px; top: 120px;
  transform: skewY(1deg);
  -o-transform: skewY(1deg);
  -moz-transform: skewY(1deg);
  -webkit-transform: skewY(1deg);
}
div.www div#w22
{ position: absolute;
  right: 170px; top: 120px;
  transform: translate(38px, 28px) skewY(1deg) scale(0.93);
  -o-transform: translate(38px, 28px) skewY(1deg) scale(0.93);
  -moz-transform: translate(38px, 28px) skewY(1deg) scale(0.93);
  -webkit-transform: translate(38px, 28px) skewY(1deg) scale(0.93);
}
div.www div#w23
{ position: absolute;
  left: 130px; bottom: 160px;
  transform: skewY(0.25deg);
  -o-transform: skewY(0.25deg);
  -moz-transform: skewY(0.25deg);
  -webkit-transform: skewY(0.25deg);
}
div.www div#w24
{ position: absolute;
  right: 170px; bottom: 160px;
  transform: translate(38px, 3px) skewY(0.25deg) scale(0.93);
  -o-transform: translate(38px, 3px) skewY(0.25deg) scale(0.93);
  -moz-transform: translate(38px, 3px) skewY(0.25deg) scale(0.93);
  -webkit-transform: translate(38px, 3px) skewY(0.25deg) scale(0.93);
}

div.www div.stopka, div.www div.stopka:hover
{ position: absolute;
  right: 2px; bottom: -2px;
}
div.www div.stopka, div.www div.stopka:hover,
div.www div.stopka i, div.www div.stopka:hover i,
div.www div.stopka a, div.www div.stopka:hover a,
div.www div.stopka a img, div.www div.stopka:hover a img
{ margin: 0;  border: 0; padding: 0;
  width: auto; height: auto;
  color: #706040; background: transparent;
  filter: alpha(opacity=100);
  opacity: 1;
}
div.www div.stopka a
{ display: inline;
  opacity: .8;
}
div.www div.stopka a img
{ filter: alpha(opacity=80);
}
div.www div.stopka a img:hover, div.www div.stopka a:hover
{ filter: alpha(opacity=100);
}
div.www div.stopka a:hover:before
{ content: " ~ email";
  color: #B0A04C;
}
div.www div.stopka:hover i
{ color: #B0A04C;
}


/*  Kuniec  */