gistfile1.scss

/*This is a clean gradient menu purely based on CSS3  */
$lightgrey: #A8ACAD; //assigning colors to variables
$darkgrey:#736F6E;

div#header 
{
  background:-webkit-gradient(linear, left top, left bottom, from($lightgrey), to($darkgrey)); //gradient for the navigation menu
  background: -moz-linear-gradient(top, $lightgrey, $darkgrey);
  
  border:
  { //nesting properties of a specific namespace
radius: 10px; 
 	left: 1px solid rgba(0, 0, 0, 0.1);
right: 1px solid rgba(255, 255, 255, 0.1);
  }
  box:
  {
shadow: 5px 5px 20px #a5a5a5;
  }
  width: 95%;
  height: 50px;
  margin:
  {
  left: 10px;
  right: 20px;
  }
  ul 
  {
    	padding: 0;
    	margin: 0;
    	float: left; 
  }
  li 
  {
   	 float: left;
    	list-style: none;
    	a 
{
      		&:link // reference operator in action
{
        			display: block;
        			text:
{
          				decoration: none;
          				align: center;
          				shadow: 0px 0px 10px #000; 
                		}	
        			height: 35px;
        			width: 95px;
        
        			padding:
{
top: 15px;
            			left: 10px;
            			right: 10px;
}        
        			color: #ffffff;
        			font:
{
weight: bold;
}
        			border:
   			{
left: 1px solid rgba(255, 255, 255, 0.1);
            			right: 1px solid rgba(0, 0, 0, 0.1);
}
}
      		&:visited 
{
         			color: #ffffff;
        			font:	
{
weight: bold;
}
        			border:
   			{
left: 1px solid rgba(255, 255, 255, 0.1);
             			right: 1px solid rgba(0, 0, 0, 0.1);
}
        			text:
{
shadow: 0px 0px 10px #000;
} 
}
     		 &:hover 
{
        			color: orange;
        			text:
{
shadow: 0px 0px 10px #000;
}
 }
 }
 }
 }//Sass is simply good, right?