@charset "utf-8";

/* Style sheet for HTML5 course                 */

header, section, footer, aside, nav, main, article, figure {
	/* HTML5 defines eight new semantic elements. All these are block-level elements. */
	/* To secure correct behavior in older browsers, you can set the CSS display      */
	/* property for these HTML elements to block:                                     */
	  display: block; 
	}

section {
	  width:800px;
	  height:350px;
	  margin-top:10px;   
          border-color:blue;          
	  border-style:solid;
	  border-width:1px;
	}

header {
	  width:800px;
	  height:100px;
          border-color:red; 
	  border-style:solid;
	  border-width:1px;          
	}

nav	{
	  width:800px;
	  height:25px;
          border-color:cyan; 
	  border-style:solid;
	  border-width:1px;
	  margin-top:10px;
	}

article {
	  width:390px;
	  height:400px;
          border-color:orange; 
	  border-style:solid;
	  border-width:1px;
	  float:left;
	}

figure	{
	  width:170px;
	  height:100px;
          border-color:green; 
	  border-style:solid;
	  border-width:1px;
	  margin:10px;                                      
	  float:right;
	}

aside	{
	  width:390px;
	  height:400px;
          border-color:yellow; 
	  border-style:solid;
	  border-width:1px;
	  float:right;                                           
	}

dialog	{
	  width:150px;
	  height:100px;
          border-color:brown; 
	  border-style:solid;
	  border-width:1px;
	  float:right;
	  margin:10px;
	}

footer	{
	  width:800px;
	  height:25px;
          border-color:pink; 
	  border-style:solid;
	  border-width:1px;
	}

body	{
	  background: #ffffcc;
	  color: black;
	  margin-left: 10%;
	  margin-right: 10%;
	}

a:link	{
	  background: #ffffcc;
	  color: #0000ff;
	  font-weight: bold; 
	}
      
a:active {
	  background: #ffcccc;
	  color: #ff0000;
	  font-weight: bold;
	}

a:visited {
	  background: #ffffcc;
	  color: #000000;
	  font-weight: bold;
	}

a:hover, a:focus	{
	  background: yellow;
	  color: #000000;
	  font-weight: bold;
	}