/*
   New Perspectives on HTML and CSS
   Tutorial 4
   Case Problem 2

   Pizza Style Sheet
   Author: David Katelansky
   Date:   05/23/2015

   Filename:         pizza.css
   Supporting Files: 

*/

*
{
   padding: 0px;
   margin: 0px;
}

body
{   
   background-color: red;
   font-family: Verdana,Geneva, 'sans-serif';
}

#container
{
   width: 1000px;
   margin-top: 0px;
   margin-bottom: 0px;
   margin-left: auto;
   margin-right: auto;
   border-right-color: black;
   border-left-color: black;
   border-left-width: 1px;
   border-right-width: 1px;
   border-left-style: solid;
   border-right-style: solid;
   background-color: white;
   background-image: url(redbar.png);
   background-repeat: repeat-y;   
   background-position: 0px 100px; 
}

header
{
   display: block;
   background-color: white;
   height: 100px;
}

section
{
   display: block;
}

nav
{
   display: block;
}

nav.horizontal
{
   height: 70px;
   width: 100%;
   background-color: white;
}

nav.horizontal li
{
   background-color: white;
   font-size: 16px;
   height: 50px;
   line-height: 50px;
   width: 180px;
   display: block;
   float: left;
   text-align: center;
}

nav.horizontal li a
{
   display: block;
   background-color: red;
   color: white;
   -moz-border-radius: 30px/25px;
   -webkit-border-radius: 30 25px;
   border-radius: 30px/25px;
   text-decoration: none;
}

nav.horizontal li a:hover
{
   background-color: rgb(255, 101, 101);
   color: black;
}

nav.vertical
{
   clear: left;
   float: left;
   width: 200px;
}

nav.vertical li
{
   list-style-type:none;
   text-indent: 20px;
   margin-top: 20px;
   margin-bottom: 20px;
}

nav.vertical li a
{
   color: white;
   text-decoration: none;
}

nav.vertical li a:hover
{
   color: black;
}

#main
{
   background-color: rgb(255, 211, 211);
   float: left;
   width: 600px;
}

#main > p
{
   font-size: 20px;
   margin: 15px;
}

#main img
{
   float: right;
   margin: 15px;
   width: 350px;
   -moz-border-radius-bottomleft: 350px;
   -webkit-bottom-left-radius: 350px;
   border-bottom-left-radius: 350px;
}

.coupon
{
   border-color: black;
   border-style: dashed;
   border-width: 5px;
   float: left;
   width: 170px;
   height: 150px;
   margin-top: 20px;
   margin-bottom: 20px;
   margin-left: 10px;
   margin-right: 10px;
   background-image: url('slice.png'), url(notice.png);
   background-repeat: no-repeat, no-repeat;
   background-position: center, bottom right;
   background-color: white;  
}

.coupon h1
{
   position: relative;   
   color: white;
   background-color: rgb(192, 0, 0);
   font-size: 16px;
   letter-spacing: 2px;
   font-weight: normal;
   text-align: center;
   height: 25px;
   font-variant: small-caps;   
}

.coupon > p
{
   position: relative;
   font-size: 14px;
   text-align: center;   
   margin: 5px;
}

aside
{
   display: block;
   float: left;
   width: 200px;
}

aside h1
{
   color: rgb(192, 0, 0);
   font-size: 20px;
   letter-spacing: 2px;
   font-weight: normal;
   text-align: center;
}

aside li
{
   background-color: rgb(255, 135, 135);
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border-radius: 5px;
   color: black;
   list-style-type: none;
   margin: 10px;
   padding: 5px;
}

footer
{
   display: block;
   clear: left;
   margin-left: 200px;
}

footer address
{
   border-top: 1px solid red;
   color: red;
   font-sixe: 10px;
   font-style: normal;
   text-align: center;
   margin-top: 25px;
   padding-bottom: 20px;
}