/* GLOBAL RESET ===========================================================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

body { line-height: 1; color: black; background: white; }

ol, ul { list-style: none; }

table { border-collapse: separate; border-spacing: 0; vertical-align: middle; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: "" ""; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; }

a img { border: none; }

section, article, aside, header, footer, nav, dialog, figure { display: block; }

/* DEFAULT INLINE ELEMENTS  ===========================================================================*/
a { color: #3f9fd5; text-decoration: none; }
a:hover { text-decoration: underline; }

em { font-style: italic; }

strong { font-weight: bold; }

/* DEFAULT BLOCK ELEMENTS ===========================================================================*/
h1, h2, h3, h4, h5, h6, p, ol, ul, hr, table, blockquote { margin-bottom: 1em; font-weight: normal; }

/* General Site Structure ===========================================================================*/
body { margin-top: 10px; font: 11px/1.5em Verdana, 'Liberation Sans', FreeSans, sans-serif; color: #666666; background-color: #E8B951 }
#page { width: 780px; margin: 0 auto; padding: 0 1px; background-color: #fff; }
#bd { padding: 10px; }

/* Header ===========================================================================*/
header { position: relative; width: 780px; border-top: 1px solid #fff; height: 143px; background: transparent url(/cookbook/img/header_bg.jpg) top center no-repeat; }
header .recipeBox { position: absolute; top: 10px; right: 10px; text-align: right; }
header .recipeBox p { margin-bottom: .5em; font-size: 10px; color: #cf4e33; text-transform: uppercase; }
header .recipeBox a { color: white; }
header a.logo { position: absolute; display: block; width: 140px; height: 108px; }
header nav { position: absolute; top: 108px; height: 35px; border-bottom: 1px solid #fff; }
header nav a { display: block; height: 35px; }
header nav ul { margin: 0; padding: 0; border: 0; outline: 0; overflow: hidden; display: inline-block; }
header nav ul { display: block; }
header nav ul li { list-style-image: none; list-style-type: none; margin-left: 0px; white-space: nowrap; display: inline; float: left; padding-left: 0; padding-right: 0; }
header nav ul li:first-child, header nav ul li.first { padding-left: 0px; }
header nav ul li:last-child, header nav ul li.last { padding-right: 0px; }
header nav li.NavCook a { width: 195px; background: transparent url(/cookbook/img/header_nav.jpg) top left no-repeat; }
header nav li.NavCook a:hover { background-position: 0 -35px; }
header nav li.NavPantry a { width: 195px; background: transparent url(/cookbook/img/header_nav.jpg) -195px 0 no-repeat; }
header nav li.NavPantry a:hover { background-position: -195px -35px; }
header nav li.NavTipsTricks a { width: 195px; background: transparent url(/cookbook/img/header_nav.jpg) -390px 0 no-repeat; }
header nav li.NavTipsTricks a:hover { background-position: -390px -35px; }
header nav li.NavExtras a { width: 195px; background: transparent url(/cookbook/img/header_nav.jpg) -585px 0 no-repeat; }
header nav li.NavExtras a:hover { background-position: -585px -35px; }

footer { overflow: hidden; display: inline-block; border-bottom: 1px solid #fff; padding: 10px; background-color: #999; }
footer { display: block; }
footer .recipeBox { display: inline; float: right; margin-top: 1em; width: 300px; text-align: right; }
footer .recipeBox p { margin-bottom: .5em; font-size: 10px; color: #cf4e33; text-transform: uppercase; }
footer .recipeBox a { color: white; }
footer nav { display: inline; float: left; margin-right: 20px; padding: 5px 10px 0 5px; color: #fff; font-family: Verdana; font-size: 12px; line-height: 18px; }
footer nav li.first { margin-bottom: 5px; font-weight: bold; }
footer nav a { font-weight: normal; color: #ccc; }
footer nav a:hover { color: #666; text-decoration: none; }
footer p { margin-top: 5px; font-size: 12px; color: #fff; text-align: right; font-family: Verdana; }

/* Video Page Content ===========================================================================*/
#bd h1 { font-size: 18px; font-weight: bold; line-height: 1em; color: #3f9fd5; }
#bd p { width: 425px; }
#bd p.left { display: inline; float: left; }
#bd p.right { display: inline; float: right; width: 280px; }
#bd p.small { font-size: 9px; }
#bd p.callout { width: 254px; border: 1px solid #dadada; padding: 13px; background-color: #fff2c4; }

/* Video Player ===========================================================================*/
.videoWrapper { overflow: hidden; display: inline-block; clear: both; margin-bottom: 2em; }
.videoWrapper { display: block; }
.videoWrapper a.player { display: block; float: left; width: 426px; height: 315px; }
.videoWrapper #player1 { height: 315px; }
.videoWrapper #player2 { height: 239px; }
.videoWrapper .playlist { float: right; width: 275px; }
.videoWrapper .playlist.scrollable { height: 239px; overflow: scroll; overflow-x: hidden; }
.videoWrapper .playlist li { width: 255px; margin-bottom: 1em; border: 1px solid #dadada; }
.videoWrapper .playlist a { overflow: hidden; display: inline-block; color: inherit; text-decoration: inherit; cursor: inherit; width: 241px; min-height: 91px; border: 2px solid #fff; padding: 5px; background-color: #efefef; }
.videoWrapper .playlist a { display: block; }
.videoWrapper .playlist a:active, .videoWrapper .playlist a:focus { outline: none; }
.videoWrapper .playlist a img.thumbnail { display: inline; float: left; margin-right: 11px; }
.videoWrapper .playlist a strong { display: block; color: #607f89; }
.videoWrapper .playlist a .duration { display: block; margin-top: 1em; color: #000; }
.videoWrapper .playlist a .duration img { margin-right: 5px; vertical-align: middle; }