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

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

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, 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, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
	margin: 0;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

div {font-family: Helvetica, Arial, Sans-serif;color: rgb(77,77,77);}
.bold {font-weight: 700;}
.italic{font-style:italic;}
.size36 {font-size:36px;}
.size30 {font-size:30px;}
.size24 {font-size:24px;}
.size20 {font-size:20px;}
.size18 {font-size:18px;}
.size16 {font-size:16px;}
.size15 {font-size:15px;}
.size14 {font-size:14px;}
.size13 {font-size:13px;}
.size12, .size12 label {font-size:12px;}
.size11 {font-size:11px;}
.size10 {font-size:10px;}
.size9  {font-size:9px;}
.size8  {font-size:8px;}
.hover A:hover {text-decoration: none; border-bottom: 1px solid #1A1A1A;}
.yanone {font-family:'Yanone Kaffeesatz', Helvetica, Arial, serif;}
.hel {font-family:Helvetica;}
.hoverB A:hover{color: #82b7b9;}
.white {color: #E6E6E6;}
.whiteReal {color: white;}
.white A:link{text-decoration: none;color: #E6E6E6;}
.white A:visited{text-decoration: none;color: #E6E6E6;}
.white A:active{text-decoration: none;color: #E6E6E6;}
.hoverW A:hover{text-decoration: none; border-bottom: 1px solid #E6E6E6;}
.gray {color: #808080;}
.gray A:link{text-decoration: none;color: #808080;}
.gray A:visited{text-decoration: none;color: #808080;}
.gray A:active{text-decoration: none;color: #808080;}
.hoverG A:hover{text-decoration: none; border-bottom: 1px solid #808080;}
.green {color:#038579;}
a.green:hover{color:#82b7b9;}
a.green:active{color:#fff;}
.white{color:#fff;}
.green2{color:#038579; font-weight:700;}
.green3, .green3 a {color:#038579;}
.darkgray{color:#4d4d4d;}
.darkgray a {color:#4d4d4d;}
.wordFree { color: #00b34d; font-weight: 700; }
.almost-black {color:#333;}

.blue, .blue a, .blue label {color:#39c;}
a.blue:hover, .blue a:hover, a.blue:visited, .blue a:visited {color:#069;}
a.blue:active, .blue a:active {color:#ffd200;}

.super-red, .super-red a {color:#f33 !important;}
.super-gray, .super-gray a {color:#808080 !important;}

body{background:#fff;text-align:center;}
a{color:#3399cc; text-decoration:none;}
p{font-size:12px; color:#4d4d4d; font-family: Helvetica, Arial,sans-serif; font-weight:normal;}
.buttonreply{background-color:#ccc; color:#fff; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; font-family: Helvetica, Arial, sans-serif; font-size:12px; font-weight:500;} 
.buttonuniversal{background-color:#999; color:#fff; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; font-family: Helvetica, Arial, sans-serif; font-size:12px; font-weight:500; padding:3px 70px 3px 10px;}
.button{background-color:#ccc; color:#939393; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; font-family: Helvetica, Arial, sans-serif; font-size:12px; font-weight:500; padding:3px 10px;}

input[type="submit"]{background-color:#ccc; color:#939393; -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px; font-family: Helvetica, Arial, sans-serif; font-size:12px; font-weight:700; border:none; padding:5px 10px 5px 10px;}

.pagination {float:left;width:580px;margin-left:20px;}
.pagination .prev, .pagination .next, .pagination .page{padding:5px 10px 5px 10px; margin-top:10px; -moz-border-radius: 25px; border-radius: 25px; background-color:#ccc; color:#939393; font-size: 12px;font-weight:700;}
.pagination .prev, .pagination .next{width:100px;}
.pagination .prev {float:left;margin-right:auto;}
.pagination .next {float:right;margin-right:0; margin-left:auto;text-align:right;}
.pagination .page{float:left; margin-left:5px; margin-right:5px;}
.pagination .prev:hover, .pagination .next:hover {background:#555;}
.pagination .page:hover{background:#555;}
.pagination .current {background:#000;}
.pagination .disabled{background-color:#555 !important;}	

.linkholder {text-align:center;margin-bottom:20px;}
.linkholder li {display:inline-block;margin-left:10px;margin-right:10px;font-size:24px;}


#wrapper{width:960px; margin:0 auto; background-position: center; background-repeat:no-repeat; text-align:left; min-height:100%; position:relative; vertical-align:middle;}
#header {
  width:960px;
  margin:0 auto;
}
#comic {text-align:center;}
#comic img {max-width:960px;}
#drunkducklogo{float:left;}
#add{float:left;margin-left:10px;width:728px; height:107px;background:gray;}
#topbar{text-align:center;margin-top:-3px;}
#topbarbackcolor{background:#d1d2d4; position:absolute; top:110px; width:100%; height:30px;}
#webcomicscommunity{float:left;margin-top:5px;}
.headersearch, #id_search {-moz-border-radius:10px; border-radius:10px; -webkit-border-radius:10px; border:none; float:left;font-family: Helvetica, Arial, Sans-serif; font-size: 12px; width:125px; padding:3px 30px 3px 3px;}
.headersearchbutton{float:left;margin:4px 0 0 -20px}
#mainmenu{float:left; margin-top:5px;}
#mainmenu li{float:left; margin-left:40px;}
#mainmenu li.compact + li.compact {margin-left: 17px}
#mainmenu li a{color:#fff; font-family:'Yanone Kaffeesatz', Helvetica, serif;font-size:21px; font-weight:normal !important;}
#mainmenu a:hover{color: #006699;}
#mainmenu a:active{color: #ffd200;}
#babymenu {
  text-align:center;
  width:1015px;
  margin-top: 1px;
}
.mainmenu2{display:inline-block;padding:6px 0 6px 0;background:#ebebeb;-moz-border-radius-bottomright:10px; -moz-border-radius-bottomleft:10px; -webkit-border-radius-bottomright:10px; -webkit-border-radius-bottomleft:10px; border-bottom-left-radius:10px; border-bottom-right-radius:10px;}
.mainmenu2 li{float:left;margin-left:20px; color:#808080; font-size:12px; font-family:Helvetica, Arial, sans-serif; font-weight: 500;}
.mainmenu2 a{font-family:Helvetica, Arial, sans-serif; font-size:12px; font-weight:500; color:#808080;}
.mainmenu2 a:hover{color:#006699;}
.mainmenu2 a:active{color:#ffd200;}
#duckmarksub{float:right; margin-left:-50px; padding-right:20px; margin-top:-12px;}
#duckmarksub li{margin-right:-45px;}
#m{float:right; margin-right:10px;}
#titleofcomic {
  max-width:930px;
  margin:13px auto 20px auto;
  text-align:center;
}
#titleofcomic h1{color:#c5c5c5;}
.comicnavigation{margin-top:10px; margin-bottom:10px;text-align:center;}
.arrows {display:inline-block;}
.arrows li{float:left; margin-left:50px;}
#dropdownholder {text-align:center;margin-bottom:20px;margin-top:10px;}
#like{ display:block; height:44px; width:44px;
background:url('youlikethis.png');background-repeat:no-repeat; position:relative; top:-30px; left:120px;}
.likethis{display:inline-block;position:relative;margin-right:-400px;margin-bottom:35px;}
.comic-button{position:absolute;margin-top:-30px;right:0;}
#merchandise{position:relative;display:inline-block;margin-right:-475px;margin-bottom:20px;}
#universalblock{float:right; margin-right:110px; margin-top:-10px;}
#postbody{width:750px;padding:10px;display:inline-block;text-align:left;}
#leftbodyside{width:450px; float:left;}
h1{color:#000; font-family:'Yanone Kaffeesatz', Helvetica, serif;font-size:30px; margin-bottom:5px;}
.info{font-size:10px; margin-bottom:10px;}
.postadvertisement{float:left; width:300px; height:250px; background:#808080;}
#leftadvertisement{ margin-top:20px;height:600px; width:160px; float:left; background:#808080;}
.characters{float:right; color:#808080;}
#sayit{float:right; margin-top:10px;}
#threadbuttons{float:left; width:580px; margin-top:20px;}
.sortbutton{float:right;}
.sortbutton li{float:left; margin-left:10px;}
#comments{margin-top:20px;}
.commentThumb{width:60px; height:60px;}
.posted{line-height:18px;}
.commentcontainer{float:left; width:750px;}
.timing{color:#c5c5c5;}
#searchdiv {float:left;margin-left:10px;margin-top:6px;}
#dialog-form {text-align:left;}
option.chapter {color:#fff;background:#000;}

.thumbnailleft{float:left; height:60px; width:60px;margin-right:10px;margin-bottom:10px;}

.postcontent{width:410px;}

#commentsection{float:right; width:560px; margin-top:20px;padding:10px;}
.comments{width:550px; height:100px; background: #ccc;}
.topicsleft{float:left;width:60px;}
.topicsright{width:490px; float:left;margin-left:10px;}

.topicsleft.reply {
	margin-left: 20px;
}
.topicsright.reply {
	width: 470px;
}

#reply_form_prototype {
  display: none;
}
#reply_form textarea {
  width: 485px;
}
.reply_button {
  margin-bottom: 10px;
}
#reply_form input.button,
input.reply_button {
	float: right;
	margin-top: 10px;
}

#author_note_holder {
	float:left;
	padding:10px;
	min-height:230px;
}

#edit_bar {
	background:#ff0;
	position:fixed;
	bottom:0;
	padding:10px;
	width:100%;
}

/* EDIT BOX */
.edit-box {
	background:#82b8b8 !important;
	border: solid 3px #fff !important;
	padding:10px !important;
	border-radius:10px !important;
	-moz-border-radius: 10px !important;
	-moz-background-clip: padding;
	-webkit-background-clip: padding;
	background-clip:padding-box;
	text-align:left;
	z-index:1 !important;
}
.edit-box label {
	color:#fff;
}
.edit-box .ui-dialog-buttonpane {	
	background:#82b8b8 !important;
	border:none !important;
	padding:0 !important;
	margin:0 !important;
}
.edit-box .ui-button-text {
	background:#fff;
	color:#82b8b8;
	border-radius:25px;
    -moz-border-radius: 25px;
    padding:5px 10px 5px 10px;
    border:none;
    font-size:12px;
    font-weight:700;
}
.edit-box .ui-widget-header {
	color:#fff;
	background:none;
	border:none;
}
.edit-box .ui-dialog-titlebar-close {
	display:none;
}

/*---------------- Duck Ad --------------------*/
.duckad div {
	background-color: white;
	text-align: center;
	padding-bottom: 1px;
}
.duckad a {
	color: #0000ff;
	font-size: 11px;
	font-weight: bold;
}


/*---------------- TAGS -------------------------*/
b, strong {font-weight:700;}
i, em {font-style:italic;}
img {border:none;}
a {text-decoration:none;}

/*---------------- DISPLAY ----------------------*/
.hide {display:none;}
.inline {display:inline-block;}
.block {display:block;}
.overflow-auto {overflow:auto;}

/*---------------- BOXES ------------------------*/
.box {padding:10px;-moz-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;}
.flat-top {-moz-border-radius-topleft: 0px;-moz-border-radius-topright: 0px;border-top-left-radius: 0px;border-top-right-radius: 0px;}
.yellow-back {background:#ffe666;}
.tan-back {background:#fff1aa;}
.blue-back {background:#82b8b8;}
.green-back {background:#aee601;}
.grey-back {background:#ebebeb;}
.blue-button {
	background:#82b8b8;
	border-radius:25px;
	-moz-border-radius:25px;
	color:#fff;
	border:0;
	padding:5px 10px 5px 10px;
	position:absolute;
	top:5px;
	right:5px;
}

/*---------------- POSITIONING ------------------*/
.clear {clear:both;}
.right {float:right;}
.left {float:left;}
.no-float {float:none;}
.align-top {vertical-align:top;}
.align-middle {vertical-align:middle;}
.align-left {text-align:left;}
.align-right {text-align:right;}
.align-center {text-align:center;}
.centered {display:block;margin:0 auto;}
.relative {position:relative;}
.absolute {position:absolute;}

/*---------------- WIDTH -------------------*/
.span5 {display:inline-block;width:50px;}
.span6 {display:inline-block;width:60px;}
.span7 {display:inline-block;width:70px;}
.span8 {display:inline-block;width:80px;}
.span9 {display:inline-block;width:90px;}
.span10 {display:inline-block;width:100px;}
.span11 {display:inline-block;width:110px;}
.span12 {display:inline-block;width:120px;}
.span13 {display:inline-block;width:130px;}
.span15 {display:inline-block;width:150px;}
.span16 {display:inline-block;width:160px;}
.span18 {display:inline-block;width:180px;}
.span20 {display:inline-block;width:200px;}
.span25 {display:inline-block;width:250px;}
.span26 {display:inline-block;width:260px;}
.span32 {display:inline-block;width:320px;}
.span38 {display:inline-block;width:380px;}
.span41 {display:inline-block;width:410px;}
.span43 {display:inline-block;width:430px;}
.span44 {display:inline-block;width:440px;}
.span48 {display:inline-block;width:480px;}
.span51 {display:inline-block;width:510px;}
.span53 {display:inline-block;width:530px;}
.span54 {display:inline-block;width:540px;}
.span55 {display:inline-block;width:550px;}
.span56 {display:inline-block;width:560px;}
.span57 {display:inline-block;width:570px;}
.span58 {display:inline-block;width:580px;}
.span59 {display:inline-block;width:590px;}
.span61 {display:inline-block;width:610px;}
.span62 {display:inline-block;width:620px;}
.span93 {display:inline-block;width:930px;}
.span94 {display:inline-block;width:940px;}
.max-span5 {display:inline-block;max-width:50px;}
.max-span6 {display:inline-block;max-width:60px;}
.max-span7 {display:inline-block;max-width:70px;}
.max-span8 {display:inline-block;max-width:80px;}
.max-span20 {display:inline-block;max-width:200px;}

/*---------------- HEIGHT -------------------*/
.long5 {height:50px;}
.long7 {height:70px;}
.long10 {height:100px;}
.long25 {height:250px;}
.max-long5 {max-height:50px;}
.max-long7 {max-height:70px;}
.max-long8 {max-height:80px;}

/*---------------- MARGINS ------------------*/
.margin-auto {margin:auto;}
.no-margin {margin-right:0 !important; margin-left:0 !important; margin-top:0 !important;margin-bottom:0 !important;}
.push1 {margin-left:10px;}
.push2 {margin-left:20px;}
.push3 {margin-left:30px;}
.push4 {margin-left:40px;}
.push5 {margin-left:50px;}
.push8 {margin-left:80px;}
.push9 {margin-left:90px;}
.push24 {margin-left:240px;}
.push-right1 {margin-right:10px;}
.push-right2 {margin-right:20px;}
.push-right4 {margin-right:40px;}
.push-right8 {margin-right:80px;}
.pull1 {margin-left:-10px;}
.pull2 {margin-left:-20px;}
.pull5 {margin-left:-50px;}
.pull6 {margin-left:-60px;}
.pull7 {margin-left:-70px;}
.pull16 {margin-left:-160px;}
.lift3 {margin-top:-30px;}
.drop1 {margin-top:10px;}
.drop2 {margin-top:20px;}
.drop4 {margin-top:40px;}

/*---------------- PADDING ------------------*/
.pad0 {padding:0;}
.pad1 {padding:10px;}
.pad2 {padding:20px;}
.pad-left0 {padding-left:0;}
.pad-left2 {padding-left:20px;}
.pad-left3 {padding-left:30px;}
.pad-right0 {padding-right:0;}
.pad-right1 {padding-right:10px;}
.pad-right2 {padding-right:20px;}
.pad-top1 {padding-top:10px;}
.pad-top2 {padding-top:20px;}
.pad-bottom2 {padding-bottom:20px;}

/*---------------- SPACERS ----------------------*/
.v1 {height:10px;}
.v2 {height:20px;}
.v25 {height:25px;}
.v4 {height:40px;}
.h1 {display:inline-block;width:10px;}
.h2 {display:inline-block;width:20px;}

/*---------------- TEXT TRANSFORM --------------*/
.uppercase {text-transform:uppercase;}

/*--------------- MISC -------------------------*/
.spoiler {background:#000;color:#000;}
.spoiler:hover {color:#fff;}
.pointer {cursor:pointer;cursor:hand;}
.line-fix {line-height:18px;}
.round-inputs input[type='text'] {-moz-border-radius:25px;border-radius:25px;padding:5px 10px 5px 10px;width:50px;}
.label-clear label {clear:both;}
.big-inputs input[type='text'], .big-inputs textarea {width:530px;padding:10px;}
.show-list-styles ol, .show-list-styles ul {margin-left:10px;}
.show-list-styles ul {list-style-type:disc;}
.show-list-styles ol {list-style-type:decimal;}
.on-top {z-index:2;}
.colorpicker {z-index:3;}
.rounded {-moz-border-radius:25px;border-radius:25px;}

form.stretch-inputs input[type='text'], form.stretch-inputs textarea {width:550px;padding:10px;}

/*---------------- FORM ERRORS ------------------*/
input.error, textarea.error {border:solid 2px #f77;}
label.error {color:#f77;padding:5px;margin:0;float:none;display:block;clear:both;}

/* Unread messages notification pop-up */
#notificationBox {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 99;

  display: none;
  flex-direction: column;
  justify-content: space-between;

  width: 300px;
  height: 300px;
  margin-top: -150px;
  margin-left: -150px;
  padding: 10px;

  background: #aee601;
  border-radius: 10px;
}
#notificationBox div {
  font: 26px 'Yanone Kaffeesatz', Helvetica, serif;
  color: #39c;
  text-align: center;
}
#notificationBox a {
  color: inherit;
}
#notificationBox .nb-title {
  font-size: 24px;
  padding-left: 5px;
  text-align: left;
}
#notificationBox .nb-content {
  margin-bottom: 30px;
}
#notificationBox .nb-alert {
  margin-bottom: 7px;
  font-size: 28px;
  font-weight: bold;
  color: #b13200;
}
#notificationBox .nb-inbox {
  /*font-weight: bold;*/
}
#notificationBox .nb-settings {
  float: right;
  font-size: 18px;
}
#notificationBox .nb-x {
  float: right;
  margin-top: -7px;
  margin-right: -5px;
  padding: 7px;
  font-size: 18px;
}