html {
	height: 100%;
}

body {
	font-size: 14px;
	height: 100%;
	background:url(images/main-bg.jpg);
	font-family:Verdana, Geneva, sans-serif;
	margin:0;
	padding:0;
}

p {
	text-align:justify;
}

h2 {
	color: white;
}

h3 {
	font-size: 16px;
	color: #d2ab61;
	margin: 0;
	padding: 0;
}

h4 {
	font-size: 18px;
	color: white;
}

h5 {
	font-size: 12px;
}

/* This rules removes all margins from the top of the following elements */
h1, h2, h3, h4, h5, p, ul, ol, dl, table, form, blockquote {
	margin-top:0;
}

.rounded {
	margin-right:auto;
	border-radius:2ex;
    -webkit-border-radius:2ex;
    -moz-border-radius:2ex;
}

.img-right1 {
	float: right;
	margin-left: 20px;
	margin-bottom: 10px;
	margin-right: 10px;
	border: groove 1px #DDDDDD;
	padding: 4px;
	-moz-box-shadow: 2px 2px 8px #BBBBBB;
	box-shadow: 2px 2px 8px #BBBBBB;
	-webkit-box-shadow: 2px 2px 8px #BBBBBB;
}

.img-left1 {
	float: left;
	margin-left: 10px;
	margin-bottom: 10px;
	margin-right: 20px;
	border: groove 1px #DDDDDD;
	padding: 4px;
	-moz-box-shadow: 2px 2px 8px #BBBBBB;
	box-shadow: 2px 2px 8px #BBBBBB;
	-webkit-box-shadow: 2px 2px 8px #BBBBBB;
}

#headbar {
	width: 960px;
	margin-right: auto;
	margin-left: auto;
	height: 140px;
}

#g-bar {
	width: 960px;
	height: 2px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 2px;
	border-top: 2px solid #706768;
	border-bottom: 2px solid #706768;
}

#header {
	width: 960px;
	margin-right: auto;
	margin-left: auto;
}

#logo a {
	width: 250px;
	height: 140px;
	float: left;
	background:url(images/logo-over.png);
}

#phone-bx, #phone-bx2, #phone-bx3 {
	width: 214px;
	height: 60px;
	float: left;
	margin-left: 20px;
	margin-top: 3px;
}
#phone-bx a, #phone-bx2 a, #phone-bx3 a { display: block; height: 60px; text-decoration: none; width: 214px; }
#phone-bx p, #phone-bx2 p, #phone-bx3 p { visibility: hidden; }

#phone-bx { background: url(images/header-phone-stittsville.png); }
#phone-bx2 { background: url(images/header-phone-kanata-fernbank.png); }
#phone-bx3 { background: url(images/header-phone-kanata-north.png); }

#nav-main {
    width: 700px;
	height: 40px;
	margin-right: 0;
	float:right;
	padding: 0;
	margin-top: 100px;
}

/*controls styles for the "order online" button*/
#b0 a {
	width: 186px;
	height: 35px;
	float: left;
	background:url(buttons/order-online.png) no-repeat top;
}

#b0 a:hover {
	background-position: center;
}


/*controls styles for the menu button*/
#b1 a {
	width: 92px;
	height: 35px;
	float: left;
	background:url(buttons/menu.png) no-repeat top;
}

#b1 a:hover {
	background-position: center;
}

.menu #b1 a, a:hover {
	background-position: bottom;
}


/*controls styles for the specials button*/
#b2 a {
	width: 119px;
	height: 35px;
	float: left;
	background:url(buttons/specials.png) no-repeat top;
}

#b2 a:hover {
	background-position: center;
}

.specials #b2 a, a:hover {
	background-position: bottom;
}


/*controls styles for the about us button*/
#b3 a {
	width: 134px;
	height: 35px;
	float: left;
	background:url(buttons/about.png) no-repeat top;
}

#b3 a:hover {
	background-position: center;
}

.about #b3 a, a:hover {
	background-position: bottom;
}


/*controls styles for the contact button*/
#b4 a {
	width: 161px;
	height: 35px;
	float: left;
	background:url(buttons/contact.png) no-repeat top;
}

#b4 a:hover {
	background-position: center;
}

.contact #b4 a, a:hover {
	background-position: bottom;
}


/*controls styles for the contact us button
#contact-bu {
	margin-right: 0;
	float:right;
	position: relative;
	padding: 0;
	margin-top: 0;
}
	
#contact-bu a {
	width: 161px;
	height: 60px;
	float: right;
	background:url(buttons/contact2.png) no-repeat top;
}

#contact-bu a:hover {
	background-position: center;
}

.contact #contact-bu a, a:hover {
	background-position: bottom;
}

*/


/*Controls stlying for the sliding banner*/
*{
	margin:0;
	padding:0;
}

#slideshow{
	background-color:#F5F5F5;
	border:1px solid #FFFFFF;
	width: 950px;
	height:450px;
	margin-top: 15px;
	position:relative;
	margin-right: auto;
	margin-left: auto;

	-moz-box-shadow:0 0 22px #111;
	-webkit-box-shadow:0 0 22px #111;
	box-shadow:0 0 22px #111;
}

#slideshow ul{
	width: 930px;
	height:430px;
	left:10px;
	list-style:none outside none;
	overflow:hidden;
	position:absolute;
	top:10px;
}

#slideshow li{
	position:absolute;
	display:none;
	z-index:10;
}

#slideshow li:first-child{
	display:block;
	z-index:1000;
}

#slideshow .slideActive{
	z-index:1000;
}

#slideshow canvas{
	display:none;
	position:absolute;
	z-index:100;
}

#slideshow .arrow{
	height:86px;
	width:60px;
	position:absolute;
	background:url('banner-img/arrows.png') no-repeat;
	top:50%;
	margin-top:-43px;
	cursor:pointer;
	z-index:5000;
}

#slideshow .previous{ background-position:left top;left:0;}
#slideshow .previous:hover{ background-position:left bottom;}

#slideshow .next{ background-position:right top;right:0;}
#slideshow .next:hover{ background-position:right bottom;}

/*end*/


/*Styles for News Banner*/
#news-banner {
	width: 960px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 20px;
    text-align: center;
	border-top: 4px solid #706768;
	border-bottom: 4px solid #706768;
}

#news-banner h3 {
	font-size: 16px;
	color: #3f1215;
    margin-bottom: 9px;
    margin-top: 7px;
}


#main-bg {
	padding-bottom: 20px;
}

#main-wrapper {
	width: 960px;
	margin-right: auto;
	margin-left: auto;
}

#welcome {
	width: 320px;
	padding-top: 20px;
}

/*controls styling for the info boxes on the home page*/
#home-info {
	width: 960px;
	height: 300px;
	margin-top: 20px;
}

#infobox1 a {
	width: 300px;
	height: 300px;
	float: left;
	background: url(images/info-box1.jpg) no-repeat top;
	text-decoration: none;
}

#infobox1 a:hover {
	background-position: bottom;
	text-decoration:none;
}

#infobox2 a {
	width: 300px;
	height: 300px;
	float: left;
	background:url(images/info-box2.jpg) no-repeat bottom;
	position: relative;
	left: 30px;
	text-decoration:none;
}

#infobox2 a:hover {
	background-position: top;
	text-decoration: none;
}

#infobox3 a {
	width: 300px;
	height: 300px;
	float: right;
	background:url(images/info-box3.jpg) no-repeat bottom;
	text-decoration:none;
}

#infobox3 a:hover {
	background-position: top;
	text-decoration: none;
}

/* Following styles control the footer on all pages*/
#footer {
	width: 960px;
	margin-right: auto;
	margin-left: auto;
	border: 2px #968e79 solid;
	background: #706768;
}

#footer h5 {
	font-size: 12px;
	color: #3f1215;
	margin:0;
	padding:0;
}

#footer h3 {
	color: #3f1215;
    font-size: 1.0em;
    margin-bottom: 10px;
    margin-top: 10px;
}

#footer h4 a {
	color: #2a4a59;
	font-size: 10px;
}

#footer h4 a:hover {
	color: #3f1215;
}

#footer a {
	list-style-type:none;
	text-decoration: none;
}

#footer ul {
    margin: 25px;
}

#footer ul li {
    display: inline;
    font-size: 11px;
    font-weight: bold;
    padding: 0 25px;
    text-transform: uppercase;
}
#footer li a {
    color: #fff;
    text-decoration: none;
}
#footer li a:hover {
    text-decoration: underline;
}

/*The following styles control the menu chalkboard and contents*/

#menuboard {
	width: 195px;
	height: 325px;
	position: fixed;
    top: 165px;
	background:url(images/menuboard.jpg);
}

#menu-items {
	width: 195px;
	height: 280px;
	position: relative;
	top: 70px;
}

.menu-box {
	width: 680px;
	position: relative;
	left: 250px;
	top: 15px;
	background-color: #490204;
	margin-bottom: 20px;
	margin-right:auto;
	border-radius:2ex;
    -webkit-border-radius:2ex;
    -moz-border-radius:2ex;
	padding: 10px;
}

.menu-box p {
	font-size: 14px;
	color: #d2ab61;
	margin:0;
	padding:0;
}

.menu-box h4 {
	font-family:"Courier New", Courier, monospace;
	margin:0;
	padding:0;
}

.name-cont {
	width: 220px;
	height: 35px;
	background:url(images/menutitle-box.png);
	float: left;
}

.menu-title-wrap {
	width: 600px;
	height: 35px;
	position: relative;
	left: 310px;
	top: 15px;
}

.menu-title-hold {
	width: 400px;
	height: 30px;
	background:url(images/menu-title.png);
	position: relative;
	top: 5px;
	left: -10px;
}

.title-text {
	width: 250px;
	margin-left: 120px;
	
}

#menu-pizza {
	width: 560px;
	height: 630px;
	background: url(images/menus/menu-pizza.png);
	margin-left: 50px;
}

#menu-gourmet {
	width: 560px;
	height: 575px;
	background:url(images/menus/menu-gourmet.png);
	margin-left: 50px;
}

#menu-topping {
	width: 560px;
	height: 380px;
	background:url(images/menus/menu-toppings.png);
	margin-left: 50px;
}

#menu-subs {
	width: 560px;
	height: 950px;
	background: url(images/menus/menu-subs-hot.png);
	margin-left: 50px;
}

#menu-finger {
	width: 560px;
	height: 650px;
	background: url(images/menus/menu-finger.png);
	margin-left: 50px;
}

#menu-side {
	width: 560px;
	height: 510px;
	background: url(images/menus/menu-sides.png);
	margin-left: 50px;
}

#menu-lebanese {
	width: 560px;
	height: 450px;
	background: url(images/menus/menu-lebanese.png);
	margin-left: 50px;
}

#menu-salad {
	width: 560px;
	height: 269px;
	background: url(images/menus/menu-salad.png);
	margin-left: 50px;
}

#menu-desserts {
	width: 560px;
	height: 122px;
	background: url(images/menus/menu-desserts.png);
	margin-left: 50px;
}

#menu-bev {
	width: 560px;
	height: 225px;
	background: url(images/menus/menu-soft.png);
	margin-left: 50px;
}


/*Menu Buttons*/
#m1 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-pizza.png) no-repeat top;
}

#m1 a:hover {
	background-position: bottom;
}

#m2 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-gourmet.png) no-repeat top;
}

#m2 a:hover {
	background-position: bottom;
}

#m3 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-subs.png) no-repeat top;
}

#m3 a:hover {
	background-position: bottom;
}

#m4 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-finger.png) no-repeat top;
}

#m4 a:hover {
	background-position: bottom;
}

#m5 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-side.png) no-repeat top;
}

#m5 a:hover {
	background-position: bottom;
}

#m6 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-salad.png) no-repeat top;
}

#m6 a:hover {
	background-position: bottom;
}

#m7 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-lebanese.png) no-repeat top;
}

#m7 a:hover {
	background-position: bottom;
}

#m8 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-desserts.png) no-repeat top;
}

#m8 a:hover {
	background-position: bottom;
}

#m9 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/menu-soft.png) no-repeat top;
}

#m9 a:hover {
	background-position: bottom;
}

/*The following styles control the specialty item page */

#specialboard {
	width: 195px;
	height: 221px;
	position:fixed;
	top: 165px;
	background:url(images/specialboard.jpg);
}

#special-items {
	width: 195px;
	height: 180px;
	position: relative;
	top: 70px;
}

#special-pizza {
	width: 560px;
	height: 375px;
	background: url(images/menus/specials-pizza.png);
	margin-left: 50px;
}

#special-platter {
	width: 560px;
	height: 230px;
	background: url(images/menus/specials-platter.png);
	background-repeat: no-repeat;
	margin-left: 50px;
}

#special-wings {
	width: 560px;
	height: 211px;
	background: url(images/menus/specials-wings.png);
	margin-left: 50px;
}

#special-combo {
	width: 560px;
	height: 147px;
	background: url(images/menus/specials-combo.png);
	margin-left: 50px;
}

/*Special Buttons*/
#s1 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/special-pizza.png) no-repeat top;
}

#s1 a:hover {
	background-position: bottom;
}

#s2 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/special-wings.png) no-repeat top;
}

#s2 a:hover {
	background-position: bottom;
}

#s3 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/special-combo.png) no-repeat top;
}

#s3 a:hover {
	background-position: bottom;
}

#s4 a {
	width: 195px;
	height: 25px;
	float: right;
	background:url(buttons/special-platter.png) no-repeat top;
}

#s4 a:hover {
	background-position: bottom;
}

/*Styling the Contact Us Page*/
#location1, #location2, #location3 {
	width: 950px;
	height: 450px;
	margin-right: auto;
	margin-left: auto;
	background: #fff;
	border: 5px solid #968e79;
	margin-top: 20px;
}

.text {
	width: 450px;
	height: 400px;
	float: left;
	position: relative;
    text-align: center;
	left: 20px;
	top: 20px;
}
.text h1 { color: #d62746; margin-top: 1.0em; }
.text h1 a { color: #d62746; text-decoration:none; }
.text h3 { color: #3f1215; margin-top: 1.5em; }
.text p { text-align: center; margin-top: 1.0em; }

.map {
	width: 400px;
	height: 400px;
	float: right;
	position: relative;
	right: 20px;
	top: 20px;
	border: 3px solid #3f1215;
}


/*end*/

/*About Us page styles*/

#about-bx {
	width: 950px;
	margin-right: auto;
	margin-left: auto;
	background: #fff;
	border: 5px solid #968e79;
	margin-top: 20px;
}

#about-bx h1 {
	padding-left: 15px;
	padding-right: 15px;
	color: #3f1215;
    font-size:18px;
}

#about-bx h3 {
	padding-left: 15px;
	padding-right: 15px;
	color: #d62746;
	font-size:14px;
}

#about-bx h4 {
	padding-left: 15px;
	padding-right: 15px;
	color: #3f1215;
}

#about-bx p {
	padding-left: 15px;
	padding-right: 15px;
}

#about-txt {
	width: 440px;
	margin-left: 10px;
}

#about-img {
	width: 400px;
	height: 1000px;
	float: right;
	position: relative;
	top: 30px;
	right: 30px;
}

/* NetProphet - Custom styles */
.uppercase { text-transform: uppercase; }