html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, code, em, font, img, dl, dt, dd, ol, ul, li,
form, label, legend,
table, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
h1 {font-size: 25px;}
h2 {font-size: 21px; margin-bottom:4px; color:#2E895B }
h3 {font-size: 21px;}
h4 {font-size: 19px;}
h5 {font-size: 17px;}
h6 {font-size: 15px;}
hr {
	border: 0 #ccc solid;
	border-top-width: 1px;
	clear: both;
	height: 0;
}

body {
    font: 14px/1.5 Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
    background-color: #99CCFF;
}

p {
  margin:0;
  margin-bottom:20px;  /* Make p tags only apply space below, not above */
}

.clr { clear:both; }


.wrapAll {
  width:960px;
  margin: auto; /* Center's it */
  margin-top:10px;
}
.wrapCols {
  background:#999;
}

/* col1 and col2 create the left and right cols and size them. all padding, margings and styleing is in .inner sub div */
.col1 {
  width:628px;  /* Base width of 636px is divisable by 2, 3 or 4, subtract for margins, padding and borders */
  margin:8px;
  float:left;
  background:#FFF;
}

.col2 {
  width:300px;   /* Base width of 324px, subtract for margins, padding and borders, 8px is also deducted to make guttering */
  float:right;
  background:#666666;
  padding:8px;
}

.col2 > div {
    margin-bottom:10px;
}






/**
 *
 *  MY OWN GLOBAL SETTINGS
 */

ul {
  margin-left:10px
}

li {
  margin-left:10px
}

/* Links */
a, a:link, a:active, a:visited {
    font-weight: bold;
    color: #006BB3;
    text-decoration: none;
}
.quizlist a:visited {color: #2E895B}
a:hover {color: #000066}

a .pf, a:link .pf, a:active .pf {color:#AEAEAE} /* A, An and The coloring on cat titles in listings */
a:hover .pf {color:#000066}

a.xtraA {   /* An alternative a link style */
    text-decoration:underline;
    color:#990000;
}




/* My Page Layouts */
.box {
  background:#FFFFFF none repeat scroll 0 0;
  margin-bottom:10px;
  padding:10px;
}
.box h1, .box h3, .box bhead {   /* Creates solid header within the box */
  background:#333333 none repeat scroll 0 0;
  color:#FFFFFF;
  font: normal 18px Verdana, Arial, Helvetica, sans-serif;
  margin:-10px -10px 10px;
  padding:6px 12px;
  text-transform:uppercase;
  border-bottom: 1px dotted #000;
}
.box bhead {
  font-size:13px;
}
.box h3 {
    font-size:13px;
    padding:4px 6px;
}


.half1, .half2 {  /* Applied when splitting main column into halves, thirds etc. */
    float:left;
    width:304px;
    margin-right:4px;
}
.half2 { margin:0 0 0 4px; }






/* My Forms */

label {
    font: bold 12px Arial, Helvetica, sans-serif;
    margin: 10px 0px 2px 0px;
}

.fElem {
    font: bold 14px Arial, Helvetica, sans-serif;
    background: #D5EAFF;
    padding: 2px 4px;
    margin: 2px 0px;
    border: 2px solid #336699;
    width: 260px;
}
textarea.fElem {
    width: 600px;
}


.fBtn {
    font:bold 14px Arial, Helvetica, sans-serif;
    background:#CCCCCC;
    padding:5px;
    border:2px ridge #666666;
    margin:5px 0px;
    cursor:pointer;
    width:auto;
}

.fError {
    border: 2px solid #990000;
}

.fNote {
    font:normal 9px Arial, Helvetica, sans-serif;
    padding-left:12px;
    margin-left:2px;
    width:70%;
}

.frmSect {  /* Enclosed each section of a form */
    padding-bottom: 10px;
}



/* My Message Boxes */

.messageError, .messageInfo, .messageNote {
	background: #FFC4D2 url(/img/msg/err.png) no-repeat;
	padding: 4px 20px 26px 60px;
	margin: 4px 0px;
	line-height: 22px;
    border-top: 2px solid #FF3333;
    border-bottom: 2px solid #FF3333;
    text-align:left;
}
.messageInfo, .messageNote {
    background: #FFFFCC url(/img/msg/info.png) no-repeat;
    border-color: #FF9900;
}
.messageNote {
    background-color:#99CCFF;
    color:#532900;
    border-color:#336699;
}




/* Menu buttons in left col  */

#menu, #jokes-menu {
    background: #BEBE7E;
    border:1px solid #234600;
}

#menu a, #jokes-menu a {
    display: block;
    background: #FFCC00 url(/img/mnubg.gif) repeat-x;
    line-height:20px;
    color:#000;
    font-size:12px;
    font-weight:bold;
    width:135px;
    float:left;
    text-align:center;
    border:1px solid #4D4D4D;
    margin: 1px;
}
#menu a:hover, #jokes-menu a:hover {
    text-decoration: underline;
}

/*#menu {
  background: #AD8585;
}
#menu a {
  background: #CCFF99 url(/img/mbbgo2.gif) repeat-x;
}*/
#jokes-menu h3 {
    background-color:#234600;
}



.cat-desc {
  background-color: #CCFF99;
  border: 1px dashed #669900;
  margin:15px;
  padding:10px;
}
.cat-desc b {
  color:#234600;
}



/*
 * Styles for joke listing on Category Pages
 **/
.joke-links {
    clear:both;
    padding: 16px 0px;
    border-bottom: 1px dashed #D4D4D4;
    padding:4px 6px;
}
.joke-links:hover {
  background: #DDEEBB;
}

.joke-links .rating, .joke-links .rudeClean, .joke-links .rudeRude, .joke-links .rudeDirty, .joke-links .rudeFilthy {
    width:70px;
    float:left;
    font: bold 20px "Arial Black", Arial, Helvetica, sans-serif;
    margin-right:4px;
    line-height:22px;
}


.joke-links .rating {
    background: url(/img/outof10.png) no-repeat right;
    color: #FF0033;
    width:44px;
}
.joke-links .rudeClean { /* Rudescale */
    background: url(/img/joke-clean.png) no-repeat right;
}
.joke-links .rudeRude {
    background: url(/img/joke-rude.png) no-repeat right;
}
.joke-links .rudeDirty {
    background: url(/img/joke-dirty.png) no-repeat right;
}
.joke-links .rudeFilthy {
    background: url(/img/joke-filthy.png) no-repeat right;
}
.joke-links .row { /* The link and description */
    float:left;
    width:460px;
    font-size:13px;
    line-height:22px;
}
.joke-links .row a {
    font-size:15px;
}
.more-jokes {   /* Used in the sidebar on category pages */
    background-color: #ECE9D8;
    margin:1px;
    border:2px solid #595959;
    padding:10px;
}


/*
 * Styles for joke Pages
 **/

.extra-jokes {
  background-color: #CCFF99;
  border: 1px dashed #669900;
  margin:15px;
  padding:10px;
}
.related-jokes {
  font-size:11px;
}
.related-jokes a {
  color:#234600;
}




/*
 * Share Joke Section using Image Sprites
 **/

#share-jokes {
    padding: 6px;
    margin-left:10px;
    border-top: 1px dashed #AEAEAE;
    border-bottom: 1px dashed #AEAEAE;
    background: #ECE9D8;
}

#share-jokes img {
    margin: 3px;
    display:block;
    float:left;
}

/* Facebook, Twitter, MySpace, Stumbleupon */
.s_fb, .s_tw, .s_ms, .s_su, .s_dl, .s_email, .s_moreshare {
    background:url('/img/share-joke-sprite.png') no-repeat;;
    height:78px;
    width:62px;
}

.s_fb { background-position:0px 0px }
.s_tw { background-position:0px -80px }
.s_ms { background-position:0px -160px }
.s_su { background-position:0px -240px }
.s_dl { background-position:0px -320px }
.s_email { background-position:0px -400px; height:36px; width:200px }
.s_moreshare { background-position:0px -440px; height:36px; width:200px }




/**
** All Jokes Page
***/
.all-jokes {
  margin: 0 25px;
}


.all-jokes a {
    display:block;
    width: 240px;
    float:left;
    margin-left:35px;
}







#ratef {  /* The rate a quiz form */
    background: url(/img/rate_bg.png) no-repeat center;
    font:bold 10px Verdana, Arial, Sans-Serif;
    background-color:#E6F7FF;
    /*border:4px ridge #006699;*/
    text-align:center;
    /*padding:2px;*/
    width:260px;
    /*height:50px;    */
    padding:70px 10px 0px 10px;
    display:inline-table;
    vertical-align:middle;
}

#ratef table {
    height:50px;
}



#joke-cat-list a {
    font: bold 12px Arial, Helvetica, sans-serif;
}


.next-joke {
    font-size:22px;
    text-align:center;
    margin:25px;
    color:#FF0033;
    text-align: right;
}
.next-joke a {
    color:#FF0033;
}
.next-joke img {
    vertical-align: middle;
}


























/**
 *
 *  TABLE GRID SETTINGS
 */

table.grid{
	border-top: 1px solid #DFDFDF;
	border-right: 1px solid #DFDFDF;
	width: 100%;
}

tr.rowHead {
    background-color: #eee;
}

tr.rowHead th.first-cell{
	border-left: 1px solid #DFDFDF;
}

tr.rowHead th{
    padding: 5px;
    color: #000;
    font-size: 9pt;
    font-weight : bold;
    border-top: 3px solid #F7F5EE;
    border-bottom: 3px solid #FEBE47;
    border-left: 1px solid #fff;
    background-color: #ECE9D8;
}

.grid tr td, tr.rowEven td, tr.rowOdd td{
	border-bottom: 1px solid #99BAF3;
	border-left: 1px solid #DFDFDF;
    padding: 5px;
}

.grid tr, tr.rowOdd {
    background-color: #fff;
}

.grid tr:hover, tr.rowOdd:hover {
	background-color: #D9E8F9;
	color: #000000;
}

tr.rowEven {
    background-color: #eee;
}

tr.rowEven:hover {
	background-color: #FFFFDD;
	color: #000000;
}






.logo {
    float:left;
    width:220px;
}



/*
**  BADGES DISPLAYED ON LEFT AND RIGHT OF PAGE
*/
#twitterBadge {
	position: fixed;
	left: 0;
	top: 200px;
}