body {
  font-family: 'Roboto',Arial, Helvetica, sans-serif;
  font-weight: 300;
  background: #a374c1; 
}

a { text-decoration: none; color: #6a2994; }
a:hover { text-decoration: none; color: #fff; }

.intro { display: none; }

#bgWrapp {
  width: 760px;
  height: 760px;
  top: 50%;
  left: 50%;
  margin-left: -380px;
  margin-top: -380px;
  position: absolute;
  overflow: hidden;
}

#bgWrappMain { 
  width: 320px;
  height: 320px;
  top: 40px;
  left: 50%;
  margin-left: -170px;
  margin-top: -107px;
  position: absolute;
  overflow: hidden;
}

.bg {
  top: 50%;
  left: 50%;
  margin-left: -434px;
  margin-top: -322px;
  position: absolute;
  z-index: 1;
  width: 868px;
  height: 645px;
  background: #8d61a9 url('../images/bg_aurawell.jpg') center center no-repeat;
  -webkit-animation-name: spin;
    -webkit-animation-duration: 300000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: spin;
    -moz-animation-duration: 300000ms;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: spin;
    -ms-animation-duration: 300000ms;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-transition: rotate(3600deg);
}

#bgWrappMain .bg {
  background: url('../images/bg_aurawell_main.jpg') center center no-repeat;
}

@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
} 

#logo a {   
   position: absolute;
   top: 50%;
   left: 50%;
   width: 383px;
   height: 359px;
   margin-left: -191px;
   margin-top: -179px;
   background: url('../images/logo.png') 0 0 no-repeat;
   z-index: 5;
}

#logoMain a {   
   position: absolute;
   top: 165px;
   left: 50%;
   width: 214px;
   height: 200px;
   margin-left: -115px;
   margin-top: -179px;
   background: url('../images/logo_main.png') 0 0 no-repeat;
   z-index: 5;
}    


nav {
  position: absolute;
  width: 100%;
  height: 104px;
  background: url('../images/bg_menu2.png') top center no-repeat;
  top: 50%;
  margin-top: -52px;
  z-index: 2;
}

nav.main {
  position: absolute;
  width: 100%;
  height: 104px;
  background: url('../images/bg_menu2.png') top center no-repeat;
  top: 70px;
  margin-top: -52px;
  z-index: 2;
}

ul { 
  width: 970px; 
  margin: 0 auto;
  position: relative;
}

li a { 
  position: absolute;   
  text-transform: uppercase;
  font-size: 26px;
  top: 32px;
  text-shadow: none;
}

li a:hover {  text-shadow: 1px 1px 1px #804915; }

li a#sluzby { left: 0; }
li a#prace { left: 200px; }
li a#referencie {right: 165px; }
li a#kontakt { right: 0; }

li a.active { color: #fff; text-shadow: 1px 1px 1px #804915; } 

.content {
  width: 970px;
  top: 250px;
  left: 50%;
  margin-left: -485px;
  position: absolute;
  z-index: 3;
  padding: 0 0 70px 0;
  color: #fff;
  font-size: 24px;
  text-shadow: 1px 1px 1px #67427d; 
}

.content h1 {
  color: #fff;
  font-family: 'Roboto',Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 42px;
  text-shadow: 1px 1px 1px #67427d; 
  margin: 0 0 20px 0; 
  padding:0;
  text-transform: uppercase;
}

.content ul { width: 970px; margin: 0; padding:0; }

.content ul li {
  text-transform: uppercase;
  padding: 10px 0 10px 0;
  margin: 0 0 0 20px;
  list-style-type:square;
  background: url('../images/line.png') bottom center no-repeat;
}

.text-center { text-align: center; }

#footer {
  position: fixed;
  bottom: 0;
  background: #fff;
  width: 100%;
  height: 20px;
  text-align: center; 
  padding: 10px 0 10px 0;
  color: #8c60a8;
  font-size: 14px;
  z-index: 20;
}

#footer a:hover { color: #000; }

.box {
  position: relative;
  float: left;
  width: 280px;
  height: 330px;
  font-size: 14px;
  /*background: #7e47a1;*/
  background: #fff;
  padding: 20px;
  margin: 0 2px 2px 0;
  text-align: left;
  color: #000;
  text-shadow: none; 
}

.box.sl { 
  width: 440px; 
}

.box.sl ul{ width: 100%; } 
.content .box.sl li { background: none; }

.box h2 { 
  margin: 0 0 10px 0;
  color: #8c5fa8;
  font-weight: 300;
}

.box h2 a {  color: #e0b15f; }
.box h2 a:hover {  color: #fff; }

.pod {
  color: #e0b15f;
}


a.btn {
 background: #6d3d8c; 
 font-size: 14px;
 color: #fff;
 padding: 5px 10px 5px 10px;
}

a.btn:hover { background: #e0b15f; }

a.br img{ border: 5px solid #996eb5;}
a.br:hover img { border: 5px solid #6d3d8c;}

.zav { font-size: 25px; }
