/* 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, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, input, legend, table, caption, tbody, tfoot, thead, tr, th, td 
{margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse; border-spacing: 0;}
strong {font-weight:bold;}
em {font-style:italic}

/* End Reset */



body {position:relative; font-family:arial, helvetica, sans-serif; font-size:13px; color:#999999; background:#FFFFFF;}

.chase {background:url(../images/illustration/chase-big.png) no-repeat 50% 84px;}
.eden {background:url(../images/layout/image_main2.png) no-repeat 50% 94px;}

a:link, a:visited {color:#FF6600; text-decoration:none;}
a:active, a:hover {color:#FF6600;}

/* classes */
.clear {clear:both !important;}
.center {text-align:center;}
.right {float:right;}
.left {float:left;}
.txt-right {text-align:right;}
.justify {text-align:justify}
.upper {text-transform:uppercase;}
.upperbold {font-weight:bold; text-transform:uppercase;}
.invisible {display:none;}
.inline {display:inline; line-height:16px;}

/* page containers */
#wrapper {position:relative; width:980px; margin: 0 auto 0 auto;}
#wrapperHeader {position:relative; width:980px; height:97px;}
#wrapperContent {position:relative; width:980px; padding:20px 0 1px 0;}



/* logo */
#logo {position:absolute; top:45px; left:36px; width:345px; height:73px; background:url(../images/layout/logohead.png)}
#logo a {display:block; height:73px; width:345px;}

/* contact */

#contactBlock {position:absolute; top:77px; left:456px; height:21px; width:112px;}

#contactBlock a {display:block; height:21px; width:112px;}

#contactBlock a.contact,
#contactBlock a.contact:link,
#contactBlock a.contact:visited {background:url(../images/layout/contactnav.gif) no-repeat left top;}

#contactBlock a.contact:active,
#contactBlock a.contact:hover {background:url(../images/layout/contactnav.gif) no-repeat left -20px;}


/* main navigation */


#mainNav {float:left; width:174px; padding-top:25px; margin-left:36px;}

#mainNav a {display:block; height:22px; width:174px; margin-bottom:21px;}

#mainNav a.illustration,
#mainNav a.illustration:link,
#mainNav a.illustration:visited {background:url(../images/layout/illustrationnav.gif) no-repeat left top;}

#mainNav a.illustration:active,
#mainNav a.illustration:hover,
#mainNav a.illustration.select {background:url(../images/layout/illustrationnav.gif) no-repeat left -24px;}


#mainNav a.design,
#mainNav a.design:link,
#mainNav a.design:visited {background:url(../images/layout/designnav.gif) no-repeat left top;}

#mainNav a.design:active,
#mainNav a.design:hover,
#mainNav a.design.select {background:url(../images/layout/designnav.gif) no-repeat left -28px;}


#mainNav a.animation,
#mainNav a.animation:link,
#mainNav a.animation:visited {background:url(../images/layout/animationnav.gif) no-repeat left top;}

#mainNav a.animation:active,
#mainNav a.animation:hover,
#mainNav a.animation.select {background:url(../images/layout/animationnav.gif) no-repeat left -23px;}

#mainNav a.comics,
#mainNav a.comics:link,
#mainNav a.comics:visited {background:url(../images/layout/comicsnav.gif) no-repeat left top;}

#mainNav a.comics:active,
#mainNav a.comics:hover,
#mainNav a.comics.select {background:url(../images/layout/comicsnav.gif) no-repeat left -24px;}

#mainNav a.about,
#mainNav a.about:link,
#mainNav a.about:visited {background:url(../images/layout/aboutnav.gif) no-repeat left top;}

#mainNav a.about:active,
#mainNav a.about:hover,
#mainNav a.about.select {background:url(../images/layout/aboutnav.gif) no-repeat left -24px;}

#mainNav a.blep,
#mainNav a.blep:link,
#mainNav a.blep:visited {background:url(../images/layout/blepnav.gif) no-repeat left top;}

#mainNav a.blep:active,
#mainNav a.blep:hover,
#mainNav a.blep.select {background:url(../images/layout/blepnav.gif) no-repeat left -25px;}


#mainNav a.resume,
#mainNav a.resume:link,
#mainNav a.resume:visited {background:url(../images/layout/resumenav.gif) no-repeat left top;}

#mainNav a.resume:active,
#mainNav a.resume:hover {background:url(../images/layout/resumenav.gif) no-repeat left -24px;}

#mainNav a.contact,
#mainNav a.contact:link,
#mainNav a.contact:visited {background:url(../images/layout/contactnav.gif) no-repeat left top;}

#mainNav a.contact:active,
#mainNav a.contact:hover {background:url(../images/layout/contactnav.gif) no-repeat left -20px;}

#mainNav a.tumblr,
#mainNav a.tumblr:link,
#mainNav a.tumblr:visited {background:url(../images/layout/tumblr.gif) no-repeat left top;}

#mainNav a.tumblr:active,
#mainNav a.tumblr:hover,
#mainNav a.tumblr.select {background:url(../images/layout/tumblr.gif) no-repeat left top;}


#mainNav a.twitter,
#mainNav a.twitter:link,
#mainNav a.twitter:visited {background:url(../images/layout/twitter.gif) no-repeat left top;}

#mainNav a.twitter:active,
#mainNav a.twitter:hover,
#mainNav a.twitter.select {background:url(../images/layout/twitter.gif) no-repeat left top;}



/*social media*/

#social {float:left; padding-top:25px; margin-left:36px;}

#social a {display:block; height:50px; width:50px; margin-bottom:21px;}

#social a.tumblr,
#social a.tumblr:link,
#social a.tumblr:visited {background:url(../images/layout/tumblr.jpg) no-repeat left top;}

#social a.twitter:active,
#social a.twitter:hover,
#social a.twitter.select {background:url(../images/layout/twitter.gif) no-repeat left top;}





/*the stuff*/
#wrapperStuff {position:relative; width:660px; margin-left:260px; padding-top:25px; min-height:500px;}

#portImg {position:absolute; top:25px; left:50px; height:500px; width:500px; text-align:center;}

#comicImg {position:absolute; top:25px; left:50px; height:500px; width:500px; text-align:center;}


/* comics links */

#comicLinks {float:left; margin-left:10px; width:100px; height:100px;}

#comicLinks a {display:block; width:100px; height:100px;}

#comicLinks a.dreds,
#comicLinks a.dreds:link,
#comicLinks a.dreds:visited {background:url(../images/layout/comicsIconsNav.gif) no-repeat left top;}

#comicLinks a.dreds:active,
#comicLinks a.dreds:hover {background:url(../images/layout/comicsIconsNav.gif) no-repeat left -100px;}

#comicLinks a.noseFriends,
#comicLinks a.noseFriends:link,
#comicLinks a.noseFriends:visited {background:url(../images/layout/comicsIconsNav.gif) no-repeat -100px top;}

#comicLinks a.noseFriends:active,
#comicLinks a.noseFriends:hover {background:url(../images/layout/comicsIconsNav.gif) no-repeat -100px -100px;}

#comicLinks a.ODC,
#comicLinks a.ODC:link,
#comicLinks a.ODC:visited {background:url(../images/layout/comicsIconsNav.gif) no-repeat -200px top;}

#comicLinks a.ODC:active,
#comicLinks a.ODC:hover {background:url(../images/layout/comicsIconsNav.gif) no-repeat -200px -100px;}

#comicLinks a.JRMM,
#comicLinks a.JRMM:link,
#comicLinks a.JRMM:visited {background:url(../images/layout/comicsnav-JRMM.jpg) no-repeat top;}

#comicLinks a.JRMM:active,
#comicLinks a.JRMM:hover {background:url(../images/layout/comicsnav-JRMM.jpg) no-repeat left -100px;}


#wrapperRtHm #logo {top:249px;}
#wrapperRtHm #mainNav {top:278px;}

/*Animation buttons*/

#animationLinks {float:left; width:200px; padding-top:25px; margin-left:36px;}

#animationLinks a {display:block; height:150px; width:200px; margin-bottom:21px;}

#animationLinks a.fizzard,
#animationLinks a.fizzard:link,
#animationLinks a.fizzard:visited {background:url(../images/layout/Fizzard-button.jpg) no-repeat left top;}

#animationLinks a.fizzard:active,
#animationLinks a.fizzard:hover {background:url(../images/layout/Fizzard-button.jpg) no-repeat left -150px;}

#animationLinks a.animationTests,
#animationLinks a.animationTests:link,
#animationLinks a.animationTests:visited {background:url(../images/layout/animation-tests.gif) no-repeat left top;}

#animationLinks a.animationTests:active,
#animationLinks a.animationTests:hover {background:url(../images/layout/animation-tests.gif) no-repeat left -150px;}

/*image slider*/
#slider {width:650px;}
#slider img{border:none;}
#slider ul, #slider li{
    position:relative;
    margin:0;
    padding:0;
    list-style:none;
	display:block;
}
#slider li { 
    width:650px;
    overflow:hidden; 
}

/* next previous arrows */
#nextArrow {position:absolute; top:25px; left:670px; width:50px; height:100px;}
#nextArrow a {display:block; width:50px; height:100px; background:url(../images/layout/nav_arrows_bg.gif) no-repeat left top;}
#nextArrow a:active, #nextArrow a:hover {background:url(../images/layout/nav_arrows_bg.gif) no-repeat -50px top;}

#prevArrowDreds {position:absolute; top:25px; left:-15px; width:50px; height:100px;}
#prevArrowDreds a {display:block; width:50px; height:100px; background:url(../images/layout/nav_arrows_bg.gif) no-repeat left -100px;}
#prevArrowDreds a:active, #prevArrow a:hover {background:url(../images/layout/nav_arrows_bg.gif) no-repeat -50px -100px;}


/* dreds*/

#nextArrowDreds {position:absolute; top:25px; left:850px; width:50px; height:100px;}
#nextArrowDreds a {display:block; width:50px; height:100px; background:url(../images/layout/nav_arrows_bg.gif) no-repeat left top;}
#nextArrowDreds a:active, #nextArrow a:hover {background:url(../images/layout/nav_arrows_bg.gif) no-repeat -50px top;}

#prevArrow {position:absolute; top:25px; left:-15px; width:50px; height:100px;}
#prevArrow a {display:block; width:50px; height:100px; background:url(../images/layout/nav_arrows_bg.gif) no-repeat left -100px;}
#prevArrow a:active, #prevArrow a:hover {background:url(../images/layout/nav_arrows_bg.gif) no-repeat -50px -100px;}

#dredsDisclaimer {position:absolute; top:1230px; left:189px; width:800px; height:445px; margin-left:10px;}
#dredsDisclaimer p {line-height:16px; margin-bottom:10px;}
#dredsDisclaimer p.attribution {font-size:14px; line-height:14px; text-transform:uppercase; margin-bottom:5px;}
#dredsDisclaimer h2 {line-height:16px; font-weight:normal; text-transform:uppercase;}

/* content styles */
#content {position:relative; width:450px; height:445px; margin-left:10px;}
#content p {line-height:16px; margin-bottom:10px;}
#content p.attribution {font-size:14px; line-height:14px; text-transform:uppercase; margin-bottom:5px;}
#content h2 {line-height:16px; font-weight:normal; text-transform:uppercase;}

#content a.maillink {color:#999999;}
#content a:active.maillink, #content a:hover.maillink {text-decoration:underline;}

#contents {position:relative; width:450px; height:445px;/* margin-left:260px;*/}
#contents p {line-height:16px; margin-bottom:10px;}
#contents p.attribution {font-size:14px; line-height:14px; text-transform:uppercase; margin-bottom:5px;}
#contents h2 {line-height:16px; font-weight:normal; text-transform:uppercase;}

#contents a.maillink {color:#999999;}
#contents a:active.maillink, #content a:hover.maillink {text-decoration:underline;}