@charset "utf-8";
@import url("reset.css");
/* CSS Document */
body {
   background-color:#334411;
   margin:0px;
   padding:0px;
   text-align:center;
}
div#container {
    width:900px;
    margin:auto;
    background:#ffffff;
    padding:10px 5px;
}
h2 {
    text-align:left;
    padding-top:20px;
    font-size:16px;
    margin-left:65px;
    color:#000000;
}
h3 {
    text-align:left;
    padding-top:20px;
    font-size:15px;
    margin-left:85px;
    color:#000000;
}

p.description {
    text-align:justify;
    text-indent:1em;
    line-height:170%;
    font-size:15px;
    padding-top:2px;
    padding-bottom:3px;
    margin-left:60px;
    margin-right:60px;
    color:#000000;
}
ul.spec {
    text-align:left;
    text-indent:1em;
    line-height:170%;
    font-size:14px;
    padding-top:1px;
    padding-bottom:0px;
    margin-left:100px;
    margin-right:60px;
    color:#000000;
}

/*---HEADER---*/
header h1 {
   
       text-align:left;
       font-size:20px;
       padding:0px 0px;
       margin-left:20px;
       color:#000000;
}

/*---SLIDE---*/
#stage {
	position: relative;
	width: 600px;
	height:338;
	margin: 0 auto;
}
#photo1,#photo2,#photo3,#photo4,#photo5 {
	position: absolute;
	float: left;
	width: 600px;
	height: 338px;
	left:600px;
	-moz-animation: imgtrans 30s infinite;
	-webkit-animation: imgtrans 30s infinite;
	animation: imgtrans 30s infinite;
}
#photo1 {
	-moz-animation-delay: 0s;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
#photo2 {
	-moz-animation-delay: 6s;
	-webkit-animation-delay: 6s;
	animation-delay: 6s;
}
#photo3 {
	-moz-animation-delay: 12s;
	-webkit-animation-delay: 12s;
	animation-delay: 12s;
}
#photo4 {
	-moz-animation-delay: 18s;
	-webkit-animation-delay: 18s;
	animation-delay: 18s;
}
#photo5 {
	-moz-animation-delay: 24s;
	-webkit-animation-delay: 24s;
	animation-delay: 24s;
}
#frame {
	width: 600px;
	height: 338px;
	position: relative;
	overflow: hidden;
}
@-webkit-keyframes imgtrans {
 0% { left:100%; }
 5% { left:0%; }
 20% { left:0%; }
 25% { left:-100%; }
 100% { left:-100%; }
}
@-moz-keyframes imgtrans {
 0% { left:100%; }
 5% { left:0%; }
 20% { left:0%; }
 25% { left:-100%; }
 100% { left:-100%; }
}
@keyframes imgtrans {
 0% { left:100%; }
 5% { left:0%; }
 20% { left:0%; }
 25% { left:-100%; }
 100% { left:-100%; }
}

/*---NAV---*/
 nav ul {
     margin:0:
     padding:0;
     overflow:hidden;
}
 nav ul li {
    float:left;
    list-style-type:none;
}
 nav ul li a {
    display:block;
    width:150px;
    line-height:33px;
    margin:0px 0px 30px 0px;
    text-align:center;
    font-size:14px;
    color:#ffffff;
    background:#779922;
    text-decoration:none;
}

 nav ul li a:hover {
    background:#447711;
    transition-property:background ;
         transition-duration: 0.3s;
         transition-timing-function: ease;
         transition-delay: 0s;
}
 
 a {
    display:block;
    width:100px;
    line-height:20px;
    margin:0px 0px 5px 50px;
    text-align:center;
    font-size:14px;
    color:#ffffff;
    background:#779922;
    text-decoration:none;
}

 a:hover {
    background:#447711;
    transition-property:background ;
         transition-duration: 0.3s;
         transition-timing-function: ease;
         transition-delay: 0s;
}
     /*---KAL---*/
.kal {
    font-size: 38px;
  text-align: left;
  
}


/*---FOOTER---*/
footer {
     color:#000000;
     padding-top:60px;
}


}