@import "compass/css3";
*{
    
    font-family:Calibri, Arial;
}
body {
    height:800px;
  
}
img{
    width:960px;
    
}


/* slidy*/
@keyframes slidy {
0% { left: 0%; }
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}

body { margin: 0; } 
div#slider { overflow: hidden; }
div#slider figure img { width: 20%; float: left; }
div#slider figure { 
  position: relative;
  width: 500%;
  margin: 0;
  left: 0;
  text-align: left;
  font-size: 0;
  animation: 30s slidy infinite; 
}

/* end slidy*/
#main {
    width: 960px;
    text-align:justify;
    margin: 0 auto;
    padding-bottom:20px;
}

h1{
      text-align: left;
    font-weight:bold;
  font-family:Calibri, Arial;
      font-size:150%;
  letter-spacing:2px;
    color:white;
    background-color: black;
     width: 940px;
     padding:10px;
      
}

h2{
      text-align: left;
    font-weight:bold;
  font-family:Calibri, Arial;
      font-size:150%;
  letter-spacing:2px;
    color:black;
     width: 300px;
     
}

li{
    margin-left:-40px;
    list-style-type: none;
}

a {
  /* Center */
  display:block;
    width: 300px;
  margin:5px auto;
  
  /* Button */
  
  border:0;
  padding:10px;
  
  /* Text */
  text-transform:uppercase;
    text-decoration: none;
  font-weight:bold;
  font-family:Calibri, Arial;
  font-size:100%;
  letter-spacing:2px;
  color:#FFF;
  
  transition:all .3s ease;
  -o-transition:all .3s ease;
  -moz-transition:all .3s ease;
  -webkit-transition:all .3s ease;
  

}
 a:hover {
   -webkit-transform: translate(0px, 3px) ;
    cursor:pointer;
     color:LightSkyBlue;
    opacity:.85;
   
  }

 a:active {
   -webkit-transform: translate(0px, 3px) ;
    cursor:pointer;
    opacity:.50;
   
  }
a:visited {
   -webkit-transform: translate(0px, 3px) ;
    cursor:pointer;
    opacity:.85;
   
  }
.green {
    background-color:#484;
}

.blue{
    background-color:#3374ff;
}
body {
  padding-top:50px;
}