@charset "utf-8";
/* CSS Document */

/*
	Reseting styles
	CSS Reset provided by Eric Meyer - http://meyerweb.com
*/

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, 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: normal;
	font-style: inherit;
	font-size: 100.1%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
body, p {font-family: "Courier New", Courier, monospace}
body {
	line-height: 1;
	
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
/* End of CSS Reset */


body {
	background: url('/images/bg.jpg') #686c91 repeat-x top;
}

/***** LAYOUT ******/
#wrapper {
	
}
#wrapper-inner {
	position: relative;
	margin:0 auto;
	
	height: 800px;
	background: url('/images/fridge-closed.jpg') no-repeat left top;
}
#wrapper-inner-opened {
	position: relative;
	margin:0 auto;
	
	height: 800px;
	background: url('/images/fridge-opened.jpg') no-repeat left top;
}
/******** Fridge Items **********/
.tedlnancy {
	position: absolute;
	top: 99px;
	left: 98px;
	width: 207px;
	height: 44px;
}
.fridge-door {
	position: absolute;
	top: 283px;
	left: 350px;
	width: 325px;
	height: 460px;
	z-index: 200
}

.hulu {position:absolute;top:31px;left:393px;width:212px;height:59px}
.ucla {position:absolute;top:167px;left:400px;width:173px;height:63px}
.h-reporter {position:absolute;top:255px;left:393px;width:186px;height:63px}
.stern {position:absolute;top:446px;left:393px;width:206px;height:83px}
.broadway {position:absolute;top:359px;left:410px;width:151px;height:42px}

.message {
	position: absolute;
	top: 181px;
	left: 172px;
	width: 120px;
	height: 42px;
}
.emailme {
	position: absolute;
	top: 234px;
	left: 250px;
	width: 87px;
	height: 21px;
}
.shrimp {
	position: absolute;
	top: 181px;
	left: 238px;
	width: 94px;
	height: 92px;
}
.open {
	position: absolute;
	top: 300px;
	left: 65px;
	width: 173px;
	height: 146px;
}
.tooth {
	position: absolute;
	top: 427px;
	left: 256px;
	width: 84px;
	height: 84px;
}
.amazon {
	position: absolute;
	top: 640px;
	left: 252px;
	width: 105px;
	height: 64px;
}
.phyllis {
	position: absolute;
	top: 161px;
	left: 59px;
	width: 82px;
	height: 96px;
}
.introjs {
	position: absolute;
	top: 359px;
	left: 220px;
	width: 100px;
	height: 35px;
}
.forewordjs {
	position: absolute;
	top: 410px;
	left: 205px;
	width: 140px;
	height: 45px;
}
/***************************************/
/********* Links To Letters ************/

.lettersfromanut-btn {
	position: absolute;
	top: 484px;
	left: 82px;
	width: 120px;
	height: 37px;
}
.storiesfromamoron-btn {
	position: absolute;
	top: 484px;
	left: 214px;
	width: 120px;
	height: 37px;
}
.hellojunkmail-btn {
	position: absolute;
	top: 543px;
	left: 199px;
	width: 120px;
	height: 15px;
}
.afternoonstories-btn {
	position: absolute;
	top: 615px;
	left: 107px;
	width: 215px;
	height: 15px;
}

.oddvious-btn {
	position: absolute;
	top: 652px;
	left: 119px;
	width: 99px;
	height: 28px;
}
.news-btn {
	position: absolute;
	top: 496px;
	left: 426px;
	width: 83px;
	height: 15px;
	z-index: 300
}
.newlettersfromanut-btn {
	position: absolute;
	top: 394px;
	left: 449px;
	width: 155px;
	height: 15px;
	z-index: 301
}
.familytree-btn {
	position: absolute;
	top: 670px;
	left: 410px;
	width: 155px;
	height: 15px;
	z-index: 302
}

/****************************/
/********* BOOKS ************/

.bookcovers {
	position: absolute;
}
.lettersfromanut {
	top:104px;
	left: 587px;
	width: 120px;
	height: 172px;
}
.morelettersfromanut {
	top: 133px;
	left: 730px;
	width: 120px;
	height: 173px;
}
.evenmorelettersfromanut {
	top: 185px;
	left: 1234px;
	width: 120px;
	height: 176px;
}
.hellojunkmail {
	top: 175px;
	left: 865px;
	width: 120px;
	height: 173px;
}
.storiesfrommoron {
	top: 11px;
	left: 984px;
	width: 120px;
	height: 173px;
}
.tedunmasked {
	top: 13px;
	left: 705px;
	width: 277px;
	height: 45px;
}
.larryking {
	top: 60px;
	left: 705px;
	width: 158px;
	height: 23px;
}
.larrykingfull {
	top: 60px;
	left: 863px;
	width: 53px;
	height: 23px;
}
.larrykingshort {
	top: 60px;
	left: 925px;
	width: 56px;
	height: 23px;
}
.todayshow {
	top: 83px;
	left: 705px;
	width: 277px;
	height: 24px;
}
.todayshow2 {
	top: 108px;
	left: 1050px;
	width: 132px;
	height: 23px;
}
.afternoonstories {
	top: 201px;
	left: 989px;
	width: 120px;
	height: 168px;
}
.allnewletters {
	top: 391px;
	left: 1014px;
	width: 120px;
	height: 168px;
}

.buyallnewletters {
	top: 383px;
	left: 1140px;
}

.buyallnewamazon {
	top: 449px;
	left: 1140px;
}

.buyallnewbarnes {
	top: 470px;
	left: 1140px;
}


.buyallnewindiebound {
	top: 497px;
	left: 1140px;
}

.buyallnewrandomhouse {
	top: 519px;
	left: 1140px;
}
.theoddvious  {
	top: 191px;
	left: 1111px;
	width: 125px;
	height: 185px;
}

.familytree  {
	top: 377px;
	left: 867px;
	width: 125px;
	height: 185px;
}

.ccc {
	position: absolute;
	top: 343px;
	left: 630px;
	width: 252px;
	height: 170px;
}
.ccc img {margin-bottom:3px}

.podcast-pic {width:90px;height:90px;top:11px;left:1188px}
.podcast {width:231px;height:20px;top:110px;left:1119px}
.listen {width:231px;height:20px;left:1123px;top:134px}
.listen-link {width:109px;height:21px;top:157px;left:1121px}

.modal:target:before {
    display: none;
}
.modal:before {
    content:"";
    display: block;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
}
.modal .modal-dialog {
    background: #fefefe;
    border: #333333 solid 1px;
    
    margin-left: -225px;
    position: fixed;
    left: 50%;
    z-index: 11;
    width: 550px;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
    top: 5%;
   
}
.modal:target .modal-dialog {
    top: -100%;
    -webkit-transform: translate(0, -500%);
    -ms-transform: translate(0, -500%);
    transform: translate(0, -500%);
}
.modal-body {
    padding: 15px;
}
.modal-header, .modal-footer {
    padding: 10px 20px;
}
.modal-header {
    border-bottom: #eeeeee solid 1px;
}
.modal-header h2 {
    font-size: 20px;
}
.modal-footer {
    border-top: #eeeeee solid 1px;
    text-align: right;
}

.btn-close {
    position: absolute;
    right: 5px;
    top: 0;
}
.modal-body img {width:100%;height:auto}