@charset "UTF-8";
/* CSS Document */

body{
	background:none;
	background-color:#777;
	}

#container{
	width:400px;
	height:auto;
}

#topBar{
	height:auto;
	margin-top:0;
	width:100%;
	position:fixed;
}

#title{
	font-family:"Lucida Calligraphy";
	font-weight:bold;
	font-size:82.5%;
	color:#FFF;
	width:auto;
	height:auto;
	float:left;
	margin-left:2%;
	display:inline-block;
}

#title a{
	color:#FFF;
	text-decoration:none;
}

#title a:hover{
	color:#00F;
}

#nav{
	/*display:inline-block;*/
	margin-right:5%;
	float:right;
	
}

#menu{
	with:auto;
	height:auto;
	float:left;
	
}

ul{
    font-family:Arial, Helvetica, sans-serif;
	font-variant:small-caps;
	color:#FFF;
	font-weight:bold;
    font-size:33%;
    margin:0;
    padding: 0;
    list-style: none;
}

ul li{  
    color:#000;
    display:block;
    position:relative;
    float:left;
	
}

li ul{

    display: none;
}

ul li a{ 
    display: block;
	color:#FFF;
    font-family:Arial, Helvetica, sans-serif;
	font-size: 31.35%;
    text-decoration: none;
    padding: 5% 5% 1.65% 5%;
    margin-left: 0;
    white-space: nowrap;
	
}

ul li a:hover{
	background:none;
	color:#000;
}

ul li ul li a{
	color:#FFF;
}

li:hover ul{ 
    display:block;
    position:absolute;
}

li:hover li{

    float:none;
    font-size:32.5%;
}

li:hover a{ 
    /*background:rgba(212,220,247,0.4);*/
	background:rgba(51,51,51,0.6);
}

li:hover li a:hover{
    background:#95A9B1;
	color:#000;
}

#aboutSite{
	clear:both;
	margin-top:8%;
	margin-left:auto;
	margin-right:auto;
    margin-bottom:2%;
	width:85%;
	height:auto;
	background-color:#FFF;
}

#aboutSite h1{
	font-family:Verdana, Tahoma, sans-serif;
	text-align:center;
	font-size:33.3%;
	
}

#aboutSite p{
	font-family:Verdana, Tahoma, sans-serif;
	line-height:99%;
	text-indent:0.395em;
	font-size:29.2%;
	padding-left:1%;
	padding-right:1%;

}

#linksList{
	clear:both;
	padding-top:0.01%;
	margin-left:auto;
	margin-right:auto;
    margin-bottom:2%;
	width:80%;
	height:auto;
	background-color:#FFF;
	font-family:Verdana, Tahoma, sans-serif;
	line-height:150%;
	text-indent:0.395em;
	font-size:29.2%%;
	padding-left:1%;
	padding-right:1%;
}

/*#linksList p{
    font-family:Verdana, Tahoma, sans-serif;
	line-height:150%;
	text-indent:1.2em;
	font-size:90%;
	padding-left:1%;
	padding-right:1%;
}*/

#linksList h1{
	font-family:Verdana, Tahoma, sans-serif;
	text-align:center;
}

.slidesHolder{
	display:block;
	float:left;
	width:30%;
	margin-top:4%;
	margin-left:26%;
	margin-bottom:1%;
}

.css-slideshow{
   position:relative;
   width:132px;
   height:99px;
   
}

.css-slideshow figure{
   margin: 0;
   position: absolute;
}

.css-slideshow figcaption{
   position: absolute;
   top: 0;
   color: #fff;
   background: rgba(0,0,0, .3);
   font-family:Verdana, Geneva, sans-serif;
   font-size: .7em;
   padding: 8px 12px;
   opacity: 0;
   -webkit-transition:opacity .5s;
   transition: opacity .5s;
}
.css-slideshow:hover figure figcaption{
   -webkit-transition:opacity .5s;
   transition: opacity .5s;
   opacity: 1;
}
.css-slideshow figure{
   opacity:0;
}
 
figure:nth-child(1) {
   -webkit-animation:xfade 21s 15.75s infinite;
   animation: xfade 21s 15.75s infinite;
}
figure:nth-child(2) {
   -webkit-animation:xfade 21s 10.5s infinite;
   animation: xfade 21s 10.5s infinite;
}
figure:nth-child(3) {
  -webkit-animation:xfade 21s 5.25s infinite;
   animation: xfade 21s 5.25s  infinite;
}
figure:nth-child(4) {
   -webkit-animation:xfade 21s 0s infinite;
   animation: xfade 21s 0s  infinite;
}
/*figure:nth-child(5) {
   -webkit-animation:xfade 48s 42s infinite;
   animation: xfade 48s 18s infinite;
}
figure:nth-child(6) {
   -webkit-animation:xfade 48s 42s infinite;
   animation: xfade 48s 12s infinite;
}
figure:nth-child(7) {
   -webkit-animation:xfade 48s 42s infinite;
   animation: xfade 48s 6s infinite;
}
figure:nth-child(8) {
   -webkit-animation:xfade 48s 42s infinite;
   animation: xfade 48s 0s infinite;
}*/
 
@-webkit-keyframes xfade { 
  0%{
      opacity: 1;
   }
   23% {
      opacity:1;
   }
   25%{
      opacity: 0;
   }
   98% {
      opacity:0;
   }
   100% {
      opacity:1;
   } 
   
   }
@keyframes xfade{
   0%{
      opacity: 1;
   }
   14.67% {
      opacity:1;
   }
   16.67%{
      opacity: 0;
   }
   98% {
      opacity:0;
   }
   100% {
      opacity:1;
   }
}



ul li a:hover{
	color:#00F;
}
#bottomNav{
    bottom: 0;
    position: fixed;
    text-align: center;
    width: 100%;
	color:#000;
	font-family:Verdana, Tahoma, sans-serif;
	font-weight:bold;
	font-size:29.2%;
	background:rgba(255,255,255,0.5);
	
}

#bottomNavText{
	height: 10%;
    margin: auto;
    width: 40%;
	
}