<link href='http://fonts.googleapis.com/css?family=Raleway|Rochester' rel='stylesheet' type='text/css'>
 
<style type="text/css">
   
   /****reset****/
   header, hgroup, nav, section, article, footer, div, img, p, ul, li {margin: 0; padding: 0; border:0;}
   header, hgroup, nav, section, article, footer {display: block;}

      body {
         background-image: url(../assets/stripe.jpg);
         font: normal 85%/145% 'Raleway', serif;
         color: #3a424c;
         }
      h1, h2 { 
         font-family: 'Rochester', sans serif;
         color: #3a424c
         }
      h1 {
         font-size: 36px;
         }
      h2 {
         font-size: 24px;
         }
      h3 {
         text-transform: uppercase;
         font-size: 15px;
         color: #ff5335;
         }
      h4 { 
      	 text-transform: uppercase;
         font-size: 13px;
         color: #306e73;
         }
      
      a {text-decoration: none; color: #1D181F;}
      
      p, ul {margin: 10px 0;}
      
      li {margin: 5px 0;}
      
      /***layout***/
      
      #container {
         background-color: #ffffff;
         width: 960px;
         margin: 20px auto;
         padding: 5px;
         -moz-border-radius: 15px;
         border-radius: 15px;
         -moz-box-shadow: 0 0 5px 5px #ccc;
         -webkit-box-shadow: 0 0 5px 5px #ccc;
         box-shadow: 0 0 5px 5px #ccc;
      }
      
      header, div#content, footer {
         margin: 15px 30px;
         width: 900px;
      }
      
      header {
         float: left;
         border-bottom: dotted 2px #306e73;
      }
      
      header #logo {
         margin: 0 0 10px 0;
         float: left;
      }
      
      .center {
		 margin-left:auto;
		 margin-right:auto;
		 width:70%;
		 background-color:#b0e0e6;
	  }
      
      header nav {
         float: right;
      }
      
      header nav ul li {
         display: block;
         float: left;
      }
      
      header nav ul li:after {content: "|";}
      header nav ul li:last-child:after {content:"";}
      
      header nav ul li a {
         margin: 5px;
      }
      
      header nav ul li, nav#subnav ul li {list-style: none;}
      
      nav a {
         padding: 2px 5px;
         background: #fff;
         border: solid 1px #fff;
         -moz-border-radius: 15px;
         border-radius: 15px;
      }
      
      nav a:hover, nav a:active, nav a:focus {
         color: #ffffff;
         background: #306e73;
         border: solid 1px #306e73;
         -moz-box-shadow: 2px 2px 2px 2px #ccc;
         -webkit-box-shadow: 2px 2px 2px 2px #ccc;
         box-shadow: 2px 2px 2px 2px #ccc;
      }
      
      #content { clear: both; float: left; }
      
      nav#subnav {
         float: left;
      }
      
      nav#subnav ul li ul li {margin: 8px 0;}
      
      .current { font-weight: bold; color: #3a424c; }
      
      nav#subnav ul li ul {margin-left: 15px;}
     
      section#recipe {
         margin-left: 300px;
      }
      
      #recipe ul li {
         margin-left: 15px;
         list-style: url(../assets/checkmark.png) inside;
      }
      
      /*******recipe page**********/
      
      #sides, #main, #dessert {
      	float: left;
      	width: 285px;
      }
      
      #sides, #main {
      	margin-right: 15px;
      }
      
      #sides h3, #main h3, #dessert h3 {margin-top: 0;}
      
      article {
      	clear: left;
      	float: left;
      	margin: 5px 0px;
      	width: inherit;
      	border-top: dotted 2px #306e73;
      }
      
      article h4, article p {
      	margin: 5px 0 0 0;
      	font-size: .9em;
      }
      
      article img {
      	display: block;
      	float: left;
      	margin-right: 10px;
      }
      
      /**********tables**********/
      
      table {
      	margin: 10px 0;
      	border-collapse: collapse;
      	width: 100%;
      }
      
      table th {
      	text-transform: uppercase;
      	padding: 5px;
      }
      
      table td {
      	padding: 6px;
      	text-align: center;
      }
      
      table tr:nth-of-type(even) {
      	background: #CEB59D;
      	border: solid 1px #CEB59D;
      }
      
      table td:nth-of-type(even) {
      	border-left: solid 1px #ccc;
      	border-right: solid 1px #ccc;
      }
      
      footer {
         clear: left;
         padding: 15px 0 30px 0;
         text-align: center;
         border-top: dotted 2px #306e73;
      }
            
   </style>