
nav ul {
 list-style-type: 	none;	
 margin:		center;			
 background-color: 	#333333;
 text-align: 	center;
}

nav li { display: inline-block;	}

nav li a {
 display: 		block;		
 color: 		white;
 text-align: 	center;
 padding: 		12px 16px;
 text-decoration: 	none;

}

nav li a:hover:not(.active) {	
 background-color: 	pink;
}

nav .active { color: orange; }




body { 
 font-family: Arial, Helvetica, sans-serif;
 font-size: 100%; 
 background-image: url("images/coffee.jpg");
 }

h1 { font-size: 3.5em; }

h2 { font-size: 1.875em; }

p { font-size: 1.275em; }

footer { font-size: 0.8em; }




h1 { color: white; }
h2 { color: white; }
h3 { color: white; }
h4 { color: rgb(255, 0, 0); }
p { color: white; }


#green { color: #00ff00; }

.blue{ color: blue; }


 
#left {
 float:			left;
 width: 		200px;
 height:		200px;
 background:		grey;
 color:			white;

 border-color: 		#dcdcdc; /* red green blue yellow; */
 border-style: 		solid;   /* dotted, dashed, double */
 border-width: 		2px;
 /* border: 		5px solid #dcdcdc; */

 border-radius: 	10px;

 padding: 		10px;

 margin-top:		10px;
 margin-bottom: 	10px;
 margin-right: 		20px;
 margin-left: 		20px;
	
/* margin: 		10px 20px 30px 40px; */
/* margin: 		10px 20px; */
}




#right {
 float:			right;
 width: 		200px;
 height:		200px;
 background: 		#ff9966;
}




.important {
 font-weight:		bold;
 font-style: 		italic;
 text-decoration:	underline;
}



figure#transport {
 width: 		540px;
 font-style: 		italic;
 font-size: 		0.8em;
 border: 		thin black solid;
 margin: 		0.5em;
 padding: 		0.5em;

}



figure#css {
 clear:			both;

/*
 width: 		80%;
 margin-left: 		auto;
 margin-right: 		auto;
*/

 height: 		150px;
 text-align: 		center;
}


figure#css img {
    width: auto;
    height: 150px;
}




footer p {
 text-align: center;
 color: blue;
 text-height: 25px;
}


section {
 margin-bottom: 	100px;
}
 

footer {
 width: 		100%;
 height: 		50px;
 background: 	white;

 position:		fixed; 
 bottom:		5px;
 left:			0px;
}


table {
border-collapse: collapse;
width: 80%;
margin-left: auto;
margin-right: auto;
}

table, th, td {
border: 2.5px solid rgba(0,0,0,0.8); 
padding: 10px;
color: white;
background-color: rgba(0,0,0,0.4)
}

td img{
text-align: center;
width: 100%;
height: auto;
}

form {
background: #eee;
margin: auto;
width: 90%;

font-family: Arial, Helvetica, sans-serif;
font-size: 0.875em;

line-height: 1.8em;
color: #09c;

border-radius: 10px;
padding: 10px;
border: 1px solid #999;
}
