/*====================================================*/
/* GLOBAL styling - pagewide, sitewide */
.floatr {float:right}
.floatl {float:left}
.clearl {clear:left}
.clearr {clear:right}
.clearb {clear:both}
.bold {font-weight:bold}
.ital {font-style:italic}
.block {display:block}
.inline {display:inline}
.left {text-align:left}
.center {text-align:center}
.right {text-align:right}
.captioned {text-align:center;font-size:.8em}

html {padding:0 40px}

body {min-width:1000px;max-width:1500px;background-color:#d1d2b0;color:#112;font-family:Arial,Helvetica,sans-serif;font-size:100.01%;margin:0 auto;padding:0;line-height:1.4;
/*	background:#553355 url(images/bgtile.gif) repeat 0 -1px;*/}

img {border:0;display:block}

a{ color: #444DBB;text-decoration:none }
a:visited{ color: #666688;text-decoration:none }
a:hover,a:active{ color:black;text-decoration:underline }

/* FORM styling - including subscribe combo form */
table {border:0}
form, fieldset {border:0;margin:0;padding:0;}
tr {vertical-align:baseline;} /* styles all tr in subscription forms */
td {text-align:left;}
td:first-child {text-align:right;margin-right:4px}
.required {color:#CC0066} /* required field labels */
.subdetails {background-color:#EECCEE;padding:5px 40px 0 20px } /* subscriber details */

.rss_icon {display:inline;vertical-align:middle;margin-right:4px;}

h1,h2,h3,.h1,.h2,.h3{ font-family:Gill Sans,Arial,Helvetica,sans-serif;color:#CC0066;font-size:2.1em;margin:20px 0 0 0;font-weight:500;border-bottom:1px dotted #BBBBBB;width:90%;text-decoration:none }
h2,.h2,#rightCol h1,#rightCol .h1 {font-size:1.7em}
h3,.h3 {font-size:1.3em;border:0}

#wrapper {min-width:1000px;width:100%;max-width:1300px;font-size:.9em;text-align:left;margin:0 auto;background-attachment:fixed;background:white url('images/rightCol.gif') repeat-y top right;
-moz-box-shadow:0 0 15px #333;
-webkit-box-shadow:0 0 15px #333;
box-shadow:0 0 15px #333;
}

#topNav {z-index:3;height:19px;position:fixed;right:.4em;top:-1px;white-space:nowrap;background-color:#d1d2b0;text-align:right;padding:4px 2em 4px 0;font-size:.93em }
#leftCol #topNav ul,#topNav ul {margin:1px 0 0 0;padding:0;list-style-type:none;background-color:transparent}
#leftCol #topNav li,#topNav li {display:inline;border:0;border-left:1px solid purple;padding:0 .7em;margin:0;background-color:transparent}
#topNav li:first-child {border:0}
#topNav li:last-child {padding-right:0}
#topNav a {color:#333;text-decoration:underline;background-color:transparent}
/* HOVER and PLACEHOLDER styling - current page identified by #b_foo #a_foo nesting. *//*/*/
#topNav a:hover,#topNav a:focus,#topNav a:active,#b_about #a_about,#b_links #a_links,#u_top_sendcard #a_sendcard,#b_contact #a_contact,#u_order #a_subscribetop,#u_change #a_subscribetop,#u_top_faq #a_subscribetop,#b_home #a_home {color:black;text-decoration:none}
#leftCol #topNav a:visited {color:#777;}

#skipto {z-index:2;height:24px;width:100%;position:fixed;top:-1px;left:.5em;padding:4px 0 0 2em;background-color:#d1d2b0;text-align:left}
#skipto a {font-size:.8em;color:#888;text-decoration:none}
#skipto a:hover,#skipto a:active,#skipto a:focus {color:#000;text-decoration:underline}

#masthead {height:115px;width:100%;overflow:hidden;border:1px solid #444444;border-bottom:none;margin:27px -2px 0 -2px;background-color:#f7f0a5}

/* OLD optin styling from under masthead positioning - 20091019
#optin {text-align:center;font-weight:bold;margin:0 -2px;width:100%;height:1.5em;background-color:#f7f0a5;border-left:1px solid #444444;border-right:1px solid #444444;}*/

#inner_wrapper {padding-top:1px;background:url('/images/leftCol.gif') repeat-y;min-height:1px;margin:0 -2px;}

/* 'unifier' div allows proper sizing across browsers and platforms with minimal invasive hacks. display:inline is not for IE as you could think, but for Safari (to prevent "resizing issues") *//*/*/
#unifier {position:relative;display:inline;float:left;width:95%;padding:0 10px 0 0;margin:-1px 10px 0 -210px }

#leftCol {display:inline;float:left;width:160px;background-color:#F4CA32;padding:1em 10px 0 10px;margin:0 0 0 210px;text-align:right;border-left:1px solid #444444;}
#leftCol a {text-decoration:underline;color:#222200}
#leftCol a:visited {color:#333311}
/* PLACEHOLDER styling - this page identified by #b_foo #a_foo nesting. *//*/*/
#u_subscribe_order #a_order,
#u_subscribe_change #a_change,
#u_subscribe_sendcard #a_sendcard,
#u_subscribe_faq #a_faq,
#u_subscribe_help #a_help,
#u_subscribe_help #a_help,
#u_backissues #a_backissues,
#u_playground_build #a_build,
#u_giftshop #a_giftshop,
#u_playground_gallery #a_gallery2,
#b_service #a_service,
#u_funny_treasury #a_treasury,
#u_funny_videos #a_videos,
#u_funny_takeabreak #a_takeabreak,
#u_funny_covers #a_covers,
#u_funny_gallery #a_gallery,
#u_funny_editorials #a_editorials,
#u_funny_thisissue #a_thisissue,
#u_funny_backissues #a_backissues,
#b_features #a_features {color:purple;text-decoration:none;}
#leftCol a:hover,#leftCol a:focus,#leftCol a:active {text-decoration:none;color:white}
/* more styling for leftNav categories with sub-navigation. class 'here' hard-flags placeholder styling. *//*/*/
#a_funny,#b_subscribe #a_subscribe,#b_playground #a_playground {text-transform:uppercase;text-decoration:none;color:white;font-weight:bold;border-bottom:1px dotted #444444;}

#new {font-size:.7em;font-weight:bold;padding:1px 3px;color:white;background-color:purple;border:1px solid black;margin:0 5px 0 0}

#leftCol ul,#leftCol ul ul,#rightCol ul,#rightCol ul ul {margin:0;padding:0;list-style-type:none;background-color:#F4CA32}
#leftCol li { background-color:#E4B721 }
#leftCol li,#rightCol li {margin:2px 0;padding:5px;border:1px dotted black}
#leftCol li li,#rightCol li li {margin:0;padding:2px 0;border:0}
#leftCol ul,#rightCol ul {margin-bottom:3em;}
/*special styling for FUNNY STUFF and SUBSCRIBE menu items*/
li#li_funny_stuff,li#li_features{ margin-top:15px  }
#leftCol li#li_subscribe {margin-bottom:7px}
li#li_subscribe,li#li_subscribe ul,li#li_subscribe li,li#li_subscribe img{background-color:#ff44BB}



/* --------------------------------------------------------- */
/* special case for 1-column layouts */
body#b_playground #unifier{border-right:none;margin:-1px 3px 0 -5px}
body#b_playground #leftCol {margin:0 0 0 5px}
body#b_playground #middleCol {margin:0 0 0 205px}
body#b_playground #wrapper {background:white url('images/rightCol2.gif') repeat-y top right}
/* --------------------------------------------------------- */

#middleCol {margin:0 0 0 410px}
#middleCol h1,#middleCol h2,#middleCol h3 {margin:16px 3px 10px 10px}
#middleCol h2.cartoon {font-size:1.1em;margin:0 0 .5em 0;padding:0}
#middleCol h1:first-child {width:75%}
#middleCol p{line-height:1.5em}
#middleCol p,#middleCol img {margin:.7em 10px 0 10px}
#middleCol p {width:90%}
#middleCol ul {margin:20px;padding:0}
#middleCol #initial_content_block {margin-top:4.5em;}

.addthis_toolbox{ float:right;padding:0;margin:0;font-size:.8em;color:#666 }
.addthis_toolbox a{ margin-right:3px }

.certsdiv{ float:right;position:relative }

h2.home {width:auto;padding:10px 0 0 0;margin:0 30px 0 0;border-bottom:none;font-size:1.6em;line-height:1.1em}

.buy_this,.buy_button {width:auto;margin:10px;padding:0;border:0}
.buy_this a,.buy_button {padding:2px .7em;font-family:Gill Sans,Arial,Helvetica,sans-serif;font-size:1.7em;color:white;text-decoration:none;background-color:#ee2299}
.buy_this a:hover,#optin a:active{text-decoration:underline;background-color:#ff77dd}

.articleName {color:#800080;font-weight:bold;margin:7px 0 0 0;}

#home_cover{float:left;position:relative;top:-3em;margin:0 35px 0 0}
#this_content,#next_content,#prev_content,.content_chunk{float:left;margin:0 0 10px 10px;border:1px dotted gray}
#next_content,#prev_content,.content_chunk{padding:4px;text-align:center}
#next_content h2,#prev_content h2,.content_chunk h2 {font-size:1.1em;text-transform:uppercase;border:0;margin:0;padding:0;width:auto}
#next_content p,#prev_content p,.content_chunk p {border:0;margin:0;padding:0;font-size:.9em}

.tag_results {width:90%;margin:0 0 10px 20px}
#guarantee {font-size:1.5em;line-height:1.2em;font-style:italic;color:#CC0066}

#cartoonists {font-size:.86em;margin:3em 3px 1em 10px;border-top:1px dotted #444444;padding-top:3px;width:85%;text-transform:uppercase;clear:both}
#cartoonists ul {margin:0;padding:0;list-style:none;}
#cartoonists li {display:inline}

/* Do NOT declare a width for #rightCol (IE5 would accept only auto). Sizing this element is done through the negative margin (a bigger negative value widens the sidebar). 1px margin-right harmonizes the 1px border with the masthead elements. *//*/*/
#rightCol {padding:0 10px 20px 100%;margin:-1px 0 0 -228px;
	text-align:left;font-size:.9em;line-height:1.3em}

#editors_pick_OLD {height:90px;width:218px;background-image:url('/images/editorial_lens.jpg');margin-bottom:1.5em}
#editors_pick_OLD a {display:block;height:90px;width:218px;text-align:right;text-decoration:none;text-transform:uppercase;color:#ffff82;font-family:Gill Sans,Arial,Helvetica,sans-serif;font-size:2.7em;margin:0;padding:0;font-weight:100}
#editors_pick_OLD a span{margin:0 7px;vertical-align:-64px;}

#editors_pick {height:95px;width:218px;background:url('/images/lens_look.png') no-repeat center top;text-decoration:none;text-transform:uppercase;color:gray;font-family:Gill Sans,Arial,Helvetica,sans-serif;font-size:1.8em;text-align:center;margin:0 0 1.5em 0 }
#editors_pick a {display:block;width:178px;height:40px;text-align:center;padding:3em 30px 0 10px;color:black }
#editors_pick a:hover {color:purple;text-decoration:none}
#rightCol h1,#rightCol h2{ font-size:1.2em;text-transform:uppercase;border:0;display:inline }
#rightCol h1 + p,#rightCol h2 + p{ margin-top:2px }
/* right column menu styling - flush LEFT*/
#rightCol div#rightMenu {text-align:left;margin-bottom:2.5em}
#rightCol #rightMenu h1,#rightCol #rightMenu h2 {font-size:2em;text-transform:none;display:block;margin:1em 0 .5em 0}
#rightCol #rightMenu h1 a,#rightCol #rightMenu h2 a {color:#CC0066}
#rightCol ul,#rightCol ol{width:190px;margin:0;padding:0}
#rightCol ul ul{width:100%}
#rightCol ul,#rightCol ul ul,#rightCol li {background-color:white}
#rightCol ul li ul {border-top:1px dotted black;margin-bottom:1em;font-size:.9em}

/* PLACEHOLDER styling right column menu. *//*/*/
#u_right_origins #a_origins,
#u_right_submissions #a_submissions,
#u_right_testimonials #a_testimonials,
#u_right_faves #a_faves,
#u_right_press #a_press,
#u_right_press1 #a_press1,
#u_right_press2 #a_press2,
#u_right_press3 #a_press3,
#u_right_press4 #a_press4,
#u_right_lovenotes #a_lovenotes,
#u_right_hatemail #a_hatemail {color:black;text-decoration:none;}

#ad_container {position:relative;left:-3px}
#minisub{ background-color:#dfddd1;width:218px;font-size:.8em;padding-top:3px }
#minisub-header{ height:165px;overflow:hidden }
#minisub form{ margin:0 14px }
#minisub input{ font-size:.95em;height:10px;width:183px;margin-top:1px }
#minisub input#State{ width:110px;margin-right:5px }
#minisub input#Zip{ width:59px }
#minisub input#clickhere{ margin:2px 0 0 55px;width:77px;height:15px }

#optin{
	text-align:left;margin:0;padding:3px 0;
	width:218px;font-size:1.25em;line-height:1.3em;
	font-family:Gill Sans,Arial,Helvetica,sans-serif;
	color:#ffccee;background-color:#dd55aa;
}
#optin div {padding:0;border:0;margin:0 2px 0 6px}
#optin a {color:white;text-decoration:none}
#optin a:hover,#optin a:active{text-decoration:underline}
#tab_link {font-size:1.25em}
#safesubscribe, #howdyland {text-align:right;font-size:.95em;line-height:1.1em;padding:0 5px 5px 0}
#safesubscribe {font-size:.7em;padding-bottom:15px}

#rally{ text-align:left;margin:0;padding:3px 0;
	width:218px;font-size:1.2em;line-height:1.3em;
	font-family:Gill Sans,Arial,Helvetica,sans-serif;
	background-color:#1188AA }
#rally p,#rally h2,body#b_home #rally h2{ color:#AADDEE;padding:0;border:0;margin:0 2px 4px 6px }
#rally h2,body#b_home #rally h2{ color:white }
body#b_home #rally h2{ font-size:1.2em;text-transform:uppercase }

#rally a{ color:white;text-decoration:none }
#rally a:hover,#rally a:active{ text-decoration:underline }

#lens {margin:3px 0 1.5em 0}
.more {padding-bottom:20px;border-top:1px solid #999}
.cotw_archive {font-size:.93em}
#disqus_thread{ margin-top:2.5em;border-top:1px dotted purple }


/* I use an image in a DIV instead of a "&nbsp;" for better results across browsers  *//*/*/
.clearer {clear:both;line-height:0;height:0}

#foot {font-size:.8em;margin:0 2px 0 0;border-top:1px solid #444;padding:.5em 0 3em 0;text-transform:uppercase;background-color:#d1d2b0;text-align:center;}
#foot a:hover,#foot a:focus { color:#000;text-decoration:underline }

#bottomNav {text-align:right;margin:0 1em 2em 0;text-transform:lowercase;font-size:1em}
#bottomNav ul {float:right;margin:1px 0 0 0;padding:0;list-style-type:none}
#bottomNav li {float:left;border-left:1px solid purple;padding:0 .7em;margin:0}
#bottomNav li:first-child {border:0}
#bottomNav li:last-child {padding-right:0}
#bottomNav a {color:#777777;text-decoration:none}
#bottomNav a:focus, #bottomNav a:hover {color:black;text-decoration:underline}

.schmedia { background-color:#d1d2b0;color:white;font-size: 9px;margin-top:11px }
.schmedia a { padding-top: 30px;text-decoration:none }
.schmedia a,.schmedia a:visited { color:white }
