BODY, TD {
  background-color:white;
  font-family: Arial;
  font-size:0.8em;
  color: black;
  text-align: center;
  margin:0;
  padding:0;
  color:#666666;
}
A {
  text-decoration: none;
  color: #1571fa;
}
A:Hover { text-decoration: underline; }
ul { margin:0; padding:0; }
li { list-style-type: none; }
ol li {
  list-style-type: decimal;
}
input {
  background: url(../images/input-gradient.gif) top repeat-x;
}
img { border:0; }
.pngfix { behavior: url(/themes/frontend/js/iepngfix.htc) }
h2 {
  font-size: 1.6em;
  padding:0;
  margin:0;
  padding-left:0;
  font-weight: normal;
}
/* ======================================================================================= */
/*
*   Helpers classes
*
**/
.half-column {
width:44%;
float:left;
margin: 0 0px 10px 10px;
}
.odd { background-color: white; }
.even { background-color: #d5dae1; }
.center { text-align: center; }
.right { text-align: right; }
.break, .full-width { clear: both;}
.float { float:left; }
.float.right { float:right; }
.right-col { float:right; width:285px;}
.left-col { float:left; width:680px; }

/* ========================================================== */
/*
*
*
*
**/

#page {
  width:997px !important;
  width:1002px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

#footer {
  clear:both;
  border-top: 1px solid #c0e6fd;
  height:25px;
  padding-top:5px; 
  margin-left: 20px;
  margin-right:10px;
}
#footer img {
  float:left;
  padding-right:5px;
  
}

#footer ul{
  float:right;
  margin:-16px 0 5px 0;
}
#footer li{
  float:left;
  padding-left:10px;
}      
#debug {
  border:1px solid red;
  margin:20px 0 0 20px;
  padding:20px;
  font-size: 12px;
}
#breadcrumb {
  float:left;
  margin-top:4px;
  margin-bottom:-20px;
}
#branding {
  height:130px;
  background: url(../images/banner-bkg.gif) repeat-x;
  background-position: 0 25px;
  margin-left:20px;
  margin-right:10px;
}
#branding .logo img{
  border:0;
  float:left;
  margin:24px 0 0px 50px;
}
#branding .logo p{
  text-align: left;
  width:420px;
  float:left;
  font-size: 1.8em;
  margin: 65px 0 0 20px;
  color: #1571fa;
  font-weight: bold;
}   
.text {
  line-height: 150%;
}
.text li{
  list-style-type: disc;
  padding:5px 0 5px 0px;
  margin-left:30px;
}
.text ol li{
  list-style-type: decimal;

}
.gray-box {
  background:white url(../images/gray-container-bkg.gif) left top repeat-y;
  background-position: 10px 0;
  padding: 20px 0 0 10px;
  margin-top:0px;

}

.gray-box .container-bottom{
  background: white url(../images/gray-container-bottom.gif) left bottom no-repeat;
  background-position: 0px 0px; 
  margin:0;
  padding:0;
  height:20px;
  clear:both; 

}
.gray-box .title {
  font-size: 1.6em;
  color:#666666;    
  font-weight: bold;
  padding-left:35px;
  padding-top: 15px;
  margin-bottom:-10px;
}


.user-box {
  background:white url(../images/gray-container-bkg.gif) left top repeat-y;
  background-position: 10px 0;
  padding: 20px 0 0 10px;
  margin-top:0px;
}

.user-box .container-bottom{
  background: white url(../images/gray-container-bottom.gif) left bottom no-repeat;
  background-position: 0px 0px;
  height:20px;
  clear:both; 

}
.user-box .title {
  font-size: 1.6em;
  color:#666666;    
  font-weight: bold;
  padding-left:35px;
  padding-top: 15px;
  margin-bottom:-10px;
}
.cartoon .image, .cartoon .sheet {
  background: url(../images/pic-fullsize.png) left top no-repeat;
  behavior: url(/themes/frontend/js/iepngfix.htc);
  margin:0 -20px 0px 0;
  padding:29px 0 30px 38px;
}

.sheet {
  margin:0 -40px -10px 0;
  height:350px;
} 
.sheet h2 {
  padding: 10px 0 10px 0;
}
.thumbnail {
  margin:14px 20px 30px 0;
  padding: 0;
  text-align: center;

}
.custom-image {
  padding:20px;
}
.editor {
  background: url(../images/editor-bkg.jpg) center no-repeat;
  text-align: center;
  padding:0px;
}
.spinoff {
    float:left;
    padding: 2px 0 0 40px;
}
.rss-feed {
  float: right;
  background: url(../images/rss.gif) left no-repeat;
  padding: 2px 5px 3px 26px;
  margin-top: 2px;
}
.blue-border {
border:1px solid #c0e6fd;
margin: 10px 10px 20px 20px;
padding:10px 30px 20px 30px;
}
.blue-border .container-bottom {
clear:both;
}
.cartoon {
  behavior: url(/themes/frontend/js/iepngfix.htc);
  background: url(../images/pic-fullsize.png) left top no-repeat;
  width:720px;
  margin:0;
  margin-right: -40px;
  padding:0;
}
.cartoon .title {
  padding:0px 0px 5px 38px;
}
.cartoon .content {
margin:10px 50px 5px 39px;
height:360px;
border:0px solid red;
overflow: hidden;
}
.cartoon .content p{
margin:30px 0 10px 20px;
}
.cartoon .content h2{
margin-bottom: 10px;
margin-left: 20px;
}
.cartoon .content ul{
margin-left: 20px;
margin-bottom: -30px;
}
.cartoon .content li{
  list-style-type: square; 
  margin:0 0 0 15px;
  padding-bottom: 10px;
}
.cartoon .content .half-column{
margin-bottom: -20px;
}
.networking {
  margin:5px 45px 0px 0px;
  text-align: right;
  height: 30px;
}
.networking li {
  float:right;
  margin-left:10px; 
}
.user-cartoon {
  margin:0;
  padding: 0;
  background: 0;
  behavior: url(/themes/frontend/js/iepngfix.htc);
  background: url(../images/custom-sheet.png) top left no-repeat;
}
.user-cartoon .title {
margin: 0;
margin-left: 30px;
height:25px;
padding:0;

} 
.user-cartoon .image {

  padding:0;
  margin:4px -40px 15px 33px;
}
.user-cartoon .rating {
  margin-left:270px;
}
.user-cartoon .rating li {
  float:left;
}
.cartoon-author {
  width: 280px;
  float:right;
  margin-top:20px;
}
.description {
    padding: 25px 15px 0 5px;
}
.description .content {
   height:300px; 
}
.description .content h2{
  padding-bottom:10px; 
}
.description .content p{
  margin:0;
  padding:0;
  font-size:1.1em;
  line-height: 140%;
}
.description .content img {
  float: left; 
  margin: 5px 10px 10px 0;
  border: 1px solid #1571fa;
}
.description .content li a{  
    font-size: 1.1em;
}
.description .options {
  font-size: 1.5em;    
  text-align: left;
  clear:both;      
}
.description .options label {
  padding: 0 0 13px 0;
  display: block;
  font-weight: normal;
  font-size: 0.9em;
  text-align: left;
}
.description .options li{
  float:left;
  width:50%; 
}

.description .options a{
    zoom:1;
  text-align: center;
  color:white;
  display:block;
  border: 1px solid black;
  margin:0 5px 5px 5px;
  padding:4px 10px 4px 10px;
  background: url(../images/button-blue.gif) repeat-x;
}
.description .options a:hover{  
  background:black url(../images/button-darkblue.gif) repeat-x;

  text-decoration: none;
}
#comments {
  margin-left:10px;
  margin-top: 10px;
  padding-bottom: 10px;
}
#comments .comment {
  clear:both;
  margin-top:20px;
  border:0;   
}

#comments .author {
  text-align: right;
  float:left;
  font-size: 0.9em;
  line-height: 150%;
  padding-right:10px;
  padding-top:5px;
  width:110px !important;
  width:80px;
  height:190px;
}
#comments .author img{
} 
#comments .author .name { /*text-align: left;*/ }
#comments .author .name a{
  display:block;
  font-size: 1.2em;
  font-weight: bold;
  color:#0066ff;
  padding-bottom: 10px;
}  
#comments .author span { display: block; }

#comments  .header {
  float:right;
  width:540px;
  margin:0;
  padding:0;
}
#comments .header {
  background: url(../images/gradient-gray.gif) bottom repeat-x;
  padding:5px;
  margin-bottom:5px !important;
  margin-bottom:5px;
}

#comments .date {
  float:left;
  font-size: 0.9em;
}
#comments .actions {
  float:right;
  margin:0;
  padding:0;
}
#comments .actions ul {
  padding:0;
  margin: 0;
}
#comments .actions li {
  float:left;
  padding-right:10px;
  clear:none;
}
#comments .content {
  width:490px;
  float:right;
  padding:15px 15px 15px 40px;
  font-size: 1em;
  background: url(../images/comment-bkg.gif) right top no-repeat;  

}
#comments .content-end { 
  background: url(../images/comment-bottom.gif) right top no-repeat;
  height:25px;
  margin-bottom:10px;
  width:520px; 
  float:right;
}
.comment .quote {
  background-color:#eee;
  border:1px solid #bbb;
  border-left:3px solid #bbb; 
  padding:5px 5px 5px 20px;
  margin:5px 0 10px 0px;
}
.comment.loader {
  height:100px;
  background: url(../images/ajax-loader.gif) center center no-repeat;
}

#member-panel {

}
#member-panel {
  text-align: right;
  right:0;
  float:right;
  padding:0;
  margin-top:16px;
  width:300px;
  margin-bottom: -20px;
  
}
#member-panel label{
  font-size: 0;
  text-indent: -9999px;
  display:none;
} 
#member-panel-login {

  height:70px;
  text-align: right;
  margin-top:10px;
  float:left;
  margin-left:10px;
    
}

#member-panel #user_name {

  width:145px;
  border:1px solid #cccccc;
  border-top:1px solid #999999;
  padding:2px;
  color:#999999;
}

#member-panel #password {
  width:90px;
  border:1px solid #cccccc;
  border-top:1px solid #999999;
  margin-top:10px;
  padding:2px;
  color:#999999; 
}

#member-panel #login {
  width:50px;
  border:1px solid black;
  background: url(../images/blue-gradient.gif) center center repeat-x;
  color:white;
  font-weight:bold;
  font-size:0.9em;
  padding:1px 0 2px 0;
  margin-top:10px;  
}

#member-panel #login:hover {
  background-image: none;
  background-color: black;    
}

#member-panel .info-register {
  background: url(../images/info-register.gif) no-repeat;
  float:right;
  width:125px;
  height:70px;
  padding:10px 0px 10px 0px;
  text-align: center;
  line-height: 200%;
}
.comic-list {
clear: both;
}

.comic-list li {
  float:left;
  text-align: right;
  margin:10px;
}
.comic-list.vertical { 
  float:none;
  clear:both;
  padding-top:10px;
}
.comic-list.horizontal { 
clear: both;
margin:10px 0 10px 10px;
}

.comic-list.horizontal h2 { 
  float:left;
  width:90px;
  
} 
.comic-list.horizontal ul {
margin: 0;
padding:0;
}  
.comic-list.horizontal li { 
  font-size: 0.9em;
  padding:0;
  margin:0;
  margin-left:10px;
  margin-right:10px;
  opacity:0;
} 

.comic-list li img { 
  border:1px solid black;  
}    

.comic-list.vertical { 
  margin:0;
  margin-bottom: 10px;
  margin-left:-10px;
}

.comic-list.vertical p { 
  font-size: 1.6em;
  padding:0;                                                                              
  margin:0;
  margin-bottom:10px;
}   

.comic-list.vertical li { 
  font-size: 0.9em;
  padding:0;
  margin:0;
  margin-bottom:5px;
  padding-top:10px;
} 
.comic-list.user {
  margin-left:140px;
  margin-top: 40px;
}
.comic-list li .author {
  float:left;
  font-weight: bold;
}

.ugly-button-made-by-reinald-sokim {
  border:1px solid black;   
  margin: 10px 20px 10px -10px;
  padding:5px 5px 5px 30px;
  font-size: 1.3em;
  background: url(../images/button-gray.gif) repeat-x;
  color: white;
  display:block;
  text-decoration: none;  
}

.ugly-button-made-by-reinald-sokim:hover{
  background:black url(../images/button-black.gif) repeat-x;
  text-decoration: none;
}

.paging {
padding: 5px 20px 10px 0px;
clear: both;
text-align: right;
}

/* ======================================================= */
/*
*   Forms classes
*
*
*
**/
.form {
  clear:both; 
  border:1px solid #c0e6fd;
  margin: 10px 10px 20px 20px;
}

.form h1 {
font-size: 1.8em;
color: #666666;
margin:10px 0 20px 10px;
}
.form h3 {
margin-left:20px;
}
.form fieldset {
  border:none;
  padding:30px;
  background: url(../images/euh-guy.jpg) right no-repeat;
}
.form legend {
  display: none;
}
.form label {
  display:block;
  padding-bottom:5px;
}
.form .note {
  padding: 10px;
  display: block;
}
.form #login {
margin-left:0px;
}
.form .login .note {
  padding: 10px 0 0 10px ;
  display: inline;
}
.form .error{
  color: red;
}
.form .textfield {
  width:150px;
  color: #999;
}
.form .button {
  border:1px solid black;
  background: url(../images/blue-gradient.gif) center center repeat-x;
  color:white;
  font-weight:bold;
  font-size:1.1em;
  padding:5px 10px 5px 10px;
  margin-top:10px;  
}
.form .button:hover { /* not working on ie6 (mfa) */
  background-image: none;
  background-color: black;    
}
.form.comment {
  border:1px solid #c0e6fd;
  margin:0 0 20px 20px; 
  clear: both;
}
.form.comment p{
  padding:5px;
  margin:0; 
  background-color: #ddd;
}
.form.comment form{ 
    margin:0;
    padding:0;
} 
.form.comment textarea {
  width:648px;
  height:80px;
  border:0;
  font-family: sans-serif;
  font-size: 0.9em;
  padding:5px;
}

.form.comment input {
width:200px;
}  
.form.comment input.submit {
    float: right;
    margin-top: -40px;
    width: auto;
} 
.form.comment input:hover { 
  text-decoration: underline;
}
#register, #changePassword {
  padding:20px;
    
}

.login .button {
  margin-left: 85px;
}
.form h2, #changePassword h2 {
  background: url(../images/bullet-big.gif) left top no-repeat;
  padding: 0 0 20px 15px;
  color:#8c8c8c;
  margin:0;
  font-weight: normal;
}

#register fieldset, #changePassword fieldset {
  border:none;
  background: url(../images/euh-guy.jpg) right no-repeat;
}

#register legend, #changePassword legend {
  display:none;
}
#register label, #changePassword label {
  display:block;
  padding-bottom:5px;
}
#register #user_name, #email, #password, #password_confirm {
  width:150px;
  color: #999;
}

#register  textarea {
  font-family: sans-serif;
  font-size: 0.8em;
  display: none;
}

#register .error{
color: red;
}
.form .submit, .form .submit {
  border:1px solid black;
  background: url(../images/blue-gradient.gif) center center repeat-x;
  color:white;
  font-weight:bold;
  font-size:1.1em;
  padding:5px 10px 5px 10px;
  margin-top:10px;  
}

.form .submit:hover, .form .submit:hover {
    background-image: none;
    background-color: black;    
}
.form div.field-info {
margin:0 50px 0 0;
height: 50px;
font-size: 0.85em;
}
#changePassword h3 {
  clear:both;
}

.img-selector {
  text-align: center;
  width:90px;
  float: left;
  margin-bottom:10px;
}

.no-form {
  text-align: center;
  padding:0 30px 30px 30px;
  font-size: 1.4em;
  clear:both;
  font-weight: bold;
  color:#666666;
  border: 0;
  background-color: white;
  margin-left: 20px;
  zoom:1;
}
.user-profile {
  font-weight: bold;
}
.user-profile .icon img{
  margin-top: 10px;
  border: 0;
  float:left;
} 
.user-profile .meta{ 
  padding:0 0 0 10px;
  
}
.user-profile .meta p{
  padding: 0;
  margin: 10px 0 0 0;
}   
.user-profile .meta label{
display: block;
width: 80px;
float:left;
font-weight: normal;
}

#profile-form label{
display: block;
width: 80px;
float:left;
font-weight: normal;
}
.debugger {

height:200px ;
overflow: hidden;
border: 1px solid black;
text-align: left;
font-family: Courrier;
font-size: 1.4em;
padding:10px;
position: fixed;
bottom: 0;
right: 0;
background: white;
}

.options-sheet {}

.options-sheet .intro {
  float:left;
  width:140px;
  margin:0;
  padding: 0;
  background: url(../images/euh-guy-small.gif) center bottom no-repeat;
}
.options-sheet .content {
  float:right;
  width:490px;
  margin:0;
  padding: 0;
}
.options-sheet .intro p{
  padding: 20px 20px 180px 20px;
  margin: 0;
  text-align: left;
}
.options-sheet .content .argumentation {
  height:300px;
  margin-right:20px;
  margin-top: 30px;
} 
.options-sheet .content .argumentation .option {
  width:49%;
  background: url(../images/options-bkg.gif) left bottom repeat-x;
  
  vertical-align: top;
  text-align: left;
}
.options-sheet .content .argumentation .spacer {
      width: 10px;
}
.options-sheet .content .argumentation .option h2{
  text-align: left;
  font-weight: normal;
  font-size: 2.2em;
  margin:0;
  padding: 0 0 10px 0;
  
}
.options-sheet .content .argumentation .option ul {
  margin: 0;
  padding: 0;
}
.options-sheet .content .argumentation .option li{
  list-style-type: none;
  background: url(../images/arrow-mini.gif) no-repeat;
  background-position: 0 2px;
  border-bottom: 1px solid #c0e6fe;
  margin: 5px;
  padding: 0 0 5px 10px;
  font-size: 1.2em;
}
.results-sheet {
  text-align: center;
  margin-top: 20px;
  margin-left: 30px;
}
.results-sheet .content {
  width:500px;
  height: auto;
}
.results-sheet .content .title{
  height:20px;
  background-color: black;
  color: white;  
}
.results-sheet .content .option {
  width: 49%;
  text-align: center;
  vertical-align: top;
  
}
.results-sheet .content .option h2{

  font-size: 2em;
  padding: 10px 0 5px 0;   
  margin: 0;   
}
.results-sheet .content .graph{
  text-align: center;  
  padding: 0 25px 0 25px;
  background: url(../images/results-bkg.gif) top repeat-x;
  border-left:1px solid black;
  border-bottom:1px solid black;
  margin: 0 8px 0 8px;
}   
.results-sheet .content .graph .choices{ 
  height: 170px;
  width: 90px;
  border-left:30px solid none;
}  
.results-sheet .content .graph .votes{ 
  width: 90px;
  height: 170px;
  margin-right: 30px;
}  
.results-sheet .content .scores{
  color: #ccc;
  text-align: center;  
  display: inline-table; 
  font-size: 1.5em;
  margin-left: 20px;
}
.results-sheet .content .scores .legend{
  padding:5px;
  background: url(../images/underline.gif) center bottom no-repeat;  
  padding-bottom: 30px;  
} 
.results-sheet .content .scores .score{ 
  font-size: 1.2em;
  font-weight: bold;
  color: black;
  display: block;
  padding-top:5px;
} 
.blue-bar {
  background: url(../images/bar-blue.gif) repeat-y;
}
.red-bar {
  background: url(../images/bar-red.gif) repeat-y;
}
.alpha-bar {
  background: url(../images/results-bkg.gif) top repeat-x; 
}
.rating-score {
  float:right;
  margin-top:-20px;
  margin-right:10px;
  font-size: 0.9em;
}

.tooltip {
padding:10px;
background-color: white;
border: 1px solid black;
font-weight: bold;
}
.tooltip .text {
display: none;
}
#bt-editor {
  padding:15px 0 0 0;
  margin: 0;
}
#bt-gallery {
  padding:1px 0 10px 0;
  margin: 0;
}
.gallery-list {
    width:860px;
    float:left; 
}
#editor-teaser {
    float:right;
    margin-top:30px;
    margin-right:10px;
}
.scrollable {
    overflow: scroll;
}
.comment-disclaimer {
    text-align: center;
    clear: both;
    color: #999;
    font-size: 0.9em;
    padding:5px;
}
.comment-delete {
color:#aa0000;
}