ul.navi {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: green;
}

li.navi  {
    float: left;
}

li.navi a.navi {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li.navi a.navi:hover {
    background-color: #111;
}


body {
	background-color: lightgreen;
}
h1 {
	color:darkgreen;
	font-size:30;
	font-family:fantasy;
}
h2 {
	color:darkgreen;
	font-size:25;
	font-family:monospace;
    }
body {
	font-size:16;
	color:#316045;
	background-color: lightgreen;
}



a.slide {
color:green;
}
li.slide { 
    display:block;
	position:relative;
	background-color:green;
	width:100px;
	height:30px;
    float:top;
	padding:10px;
	margin:10px;
	transition:3s;
	border-radius:0px 15px 15px 0px;
	text-decoration:none;
	text-align:right;
	left:-125px;  
	}
	
li.slidered { 
    display:block;
	position:relative;
	background-color:green;
	width:100px;
	height:30px;
    float:top;
	padding:10px;
	margin:10px;
	transition:3s;
	border-radius:0px 15px 15px 0px;
	text-decoration:none;
	text-align:right;
	left:-125px
	}
	
li.slideyellow { 
    display:block;
	position:relative;
	background-color:green;
	width:100px;
	height:30px;
    float:top;
	padding:10px;
	margin:10px;
	transition:3s;
	border-radius:0px 15px 15px 0px;
	text-decoration:none;
	text-align:right;
	left:-125px;
	}
	
li.slideblue { 
    display:block;
	position:relative;
	background-color:green;
	width:100px;
	height:30px;
    float:top;
	padding:10px;
	margin:10px;
	transition:3s;
	border-radius:0px 15px 15px 0px;
	text-decoration:none;
	text-align:right;
	left:-125px;
	}
	
li.slidegreen { 
    display:block;
	position:relative;
	background-color:green;
	width:100px;
	height:30px;
    float:top;
	padding:10px;
	margin:10px;
	transition:3s;
	border-radius:0px 15px 15px 0px;
	text-decoration:none;
	text-align:right;
	left:-125px;
	}
	
li.slide:hover {
	background-color:lightgrey;
    width:300px;
}

li.slidered:hover {
	background-color:red;
    width:300px;
}

li.slideyellow:hover {
	background-color:yellow;
    width:300px;
}

li.slideblue:hover {
	background-color:blue;
    width:300px;
}
li.slidegreen:hover {
	background-color:#0cff00;
    width:300px;
}