@import url(http://fonts.googleapis.com/css?family=Open+Sans:300,400);  


body {
    width: 100%; 
    margin: 0px;
    background: #ffffff;
    font-family: "Open Sans", Arial, Helvetica, sans-serif; 
    font-size: 100%; 
    line-height: 100%;
}  

/* @group Marquee */
/* http://visualidiot.com/articles/css3 */

.marquee {
    height: 30px;
    
    overflow: hidden;
    position: relative;
}
    .marquee div {
        display: block;
        width: 200%;
        height: 30px;
        
        position: absolute;
        overflow: hidden;
        
        -webkit-animation: marquee 4s linear infinite;
        -moz-animation: marquee 4s linear infinite;
        -ms-animation: marquee 4s linear infinite;
        -o-animation: marquee 4s linear infinite;
        animation: marquee 4s linear infinite;
    }
    .marquee span {
        float: left;
        width: 50%;
    }
    
@-webkit-keyframes marquee {
    0% { left: 0; }
    100% { left: -100%; }
}
@-moz-keyframes marquee {
    0% { left: 0; }
    100% { left: -100%; }
}
@-ms-keyframes marquee {
    0% { left: 0; }
    100% { left: -100%; }
}
@-o-keyframes marquee {
    0% { left: 0; }
    100% { left: -100%; }
}
@keyframes marquee {
    0% { left: 0; }
    100% { left: -100%; }
}


.blink {
    -webkit-animation: blink .75s linear infinite;
    -moz-animation: blink .75s linear infinite;
    -ms-animation: blink .75s linear infinite;
    -o-animation: blink .75s linear infinite;
    animation: blink .75s linear infinite;
}

@-webkit-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}

@-moz-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}

@-ms-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}

@-o-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}

@keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}



header {
    width: 100%;
    top: 0;
    left: 0;
    z-index: 100; 
}

/* for some wacky reason I use: section, sitewide, id=content, id=article */

section, article,  header {
    display: block;
    float: left;
    width: 100%; 
}

hr {
   border: 0; 
   height: 0.1px; 
   background: #ddd;
   color: #ddd;
   width: 50%;
   margin-top:2em;
   margin-bottom:2em;
}

.fenceClass pre {
    white-space: pre;
}

.fenceClass {
    overflow-x: scroll;
    background: #f8f8f8;
    border: 1px solid #dddddd;
    padding: 2px 5px 2px 5px;
}

/*
code {
    color: #000;
    font-size:1.2em;
}

pre {
    background:#eee;
}
*/


#content code {
    font-size:13px;
    background: #f8f8f8;
    padding: 2px 5px 2px 5px;
    border: 1px solid #dddddd;
}

#content pre {
    line-height: 1em; 
    background: #f8f8f8;
}

#content pre code {
    padding:0;
    border:none;
}

#content p {
    margin-top: 30px;
    margin-bottom: 30px;
}


header nav {
    text-align: left;
    background: #2B547E;
    font: .9em/1.5 "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
    padding-left: 1em;
}

header nav ul {
    margin: 0 0 0 6em; 
    padding: .4em 0 .5em 0; 
    list-style-type: none;
}

header nav ul li {
    display: inline;
    margin-left: 1em;
}

header nav ul li:first-child {
    margin-left: 0;
}

header nav ul li ul {
    display: none;
}

header nav a, header nav a:visited {
    color: #f8f8f8;
    text-decoration: none;
}

header nav a:hover {
    color: #ffffff;
    text-decoration: underline;
}

header #homelink a, header #homelink {
    color: #f8f8f8;
    text-decoration: none;
}

header #homelink {
    position: absolute;
    left: .5em;
    top: .4em;
    background: none;
    z-index: 99 !important;
    font: .9em/1.5 "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

header #counters {
    position: absolute;
    right: 3em;
    color: #c0c0c0; 
    top: 7px;
    font-size: .8em;
    display: inline;
}

header #counters a {
    color: #f8f8f8;
}

header #counters a:hover {
    color: #ffffff;
}

section {
    margin: 0px auto 0px;
    position: relative;
}

article {
    margin: 0;
    padding: 0;
}

#caretlink a {
    color: #95d600;
 text-decoration: none; 
}
#caretlink a:visited {
    color: #95d600;
 text-decoration: none; 
}
#caretlink a:hover {
    color: #95d600;
 text-decoration: underline; 
}

.makeitdiv {
    margin-top: 20px; 
    color: #262729; 
    font-size: 130%; 
    font-weight: bold;
}

.makeitspan {
    color: #95d600; 
    font-family: cursive; 
    text-decoration: none; 
    border-bottom: 2px solid #262729; 
    font-size: 130%; 
    vertical-align: super;
}

#sitewide {
    margin: 0px auto;
    padding: 0;
    max-width: 47.5em; /* 760 px */
}

/* font-size for content inherits from body which is set to 100% */
#content {
    color: #000000;
}

#article {
    color: #222222;
    line-height: 170%;
    font-size: 110%;
}

#article a {
    text-decoration: none;
}
#article a:hover {
    text-decoration: underline;
}

/*
#article blockquote {
  margin-left: .6em;
  padding-left: 1em;
  border-left: .2em solid #eee; 
}
*/

#article li {
    padding-top: 0px;
    padding-bottom: 5px;
}


#mobilecontent {
    border-bottom: 1px solid #e0e0e0;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 130%; 
}

#content {
    margin-right: 15px; 
    margin-left: 10px;
}



/*******************************/

img {
/*    max-width: 720px; */
    max-width: 100%;
}

.titletextsize {
    font-size: 1em;
}

.tcat
{
        background: #98bd8c; 
	color: #FFFFFF;
        margin-left:5px; 
        margin-right:5px; 
        text-align: center;
}
.tcat a:link, .tcat_alink
{
	color: #ffffff;
	text-decoration: none;
}
.tcat a:visited, .tcat_avisited
{
	color: #ffffff;
	text-decoration: none;
}
.tcat a:hover, .tcat a:active, .tcat_ahover
{
	color: #ffffff;
	text-decoration: underline;
}

blockquote {
    margin-right: 2%; 
    margin-left: 2%;
}

/*
strong, th {
    color: #9cf;
}
*/


table {
font-family: "Open Sans", Arial, Helvetica, sans-serif;  
font-size: 95%;
}
input {
    background-color: #fff;
    border: 1px solid #CCCCCC; 
}
.submitbutton {
    background: #2B547E;   
    color: #fff;
}
textarea {
    font-family: "Open Sans", Arial, Helvetica, sans-serif;  
    font-size: 1em; 
    background-color: #fff;
    border: 1px solid #ccc; 
}
.blogviewtitle {
    font-size: 110%;
    font-weight: bold;
    color: #000;    
}
.blogviewtitle a {
    font-size: 110%;
    font-weight: bold;
    color: #000;
    text-decoration: none;
}
.blogviewtitle a:visited {
    font-size: 110%;
    font-weight: bold;
    color: #000;
    text-decoration: none;
}
.blogviewtitle a:hover {
    font-size: 110%;
    font-weight: bold;
    color: #000;
    text-decoration: underline;
}
a {
   text-decoration: none; 
/*    color: #0000cc;  */
}
a:visited {
    /*  color: #990099;  */
    /*  color: #ff00cc; */
/* color: #cc0099;  yes */
/* color: #cc3399; yes being used */
/* color: #cc00cc; maybe */
/* color: #cc00ff; maybe */
/* color: #cc3300; reddish */
color: #c39;
}
a:hover {
    text-decoration: underline;
}
.paratag {
    width: 95%;
 /*   background: #faebd7;  */
    background: #ffff99;
    padding: 1%;
}
.verysmalltext{
    font-size: 60%;
}
.smalltext, .tagtext, .blocktext {
    font-size: 90%;
}
.bigtext {
    font-size: 130%; 
}
#titlearea {
    font-family: "Open Sans", Arial, Helvetica, sans-serif;  
    background: #2B547E;   
    color: #fff;
    padding-top: 3px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 3px;
}
#titlearea a {
    color: #fff; 
    text-decoration: none;
}
.sitetitle a {
    font-size: 130%; 
    font-family: Arial, helvetical, sans-serif; 
    text-decoration: none;
    color: #fff;
}
.floatright {
    float: right;
}
#navbar {
    font-family: Arial, Helvetica, sans-serif;  
    color: #000;
    background: #fff;
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 4px;
    padding-bottom: 4px;
}
#navbar a {
    color: #000;
    text-decoration: none;
}
#navbar a:hover {
    text-decoration: underline;
}
#breadcrumbs {
    color: #000; 
    padding-left: 10px;
    font-size: 70%;
}
#breadcrumbs a {
   /*  color: #666;  */
   color: #888; 
}
#breadcrumbs a:visited {
   /*  color: #666;  */
   color: #888; 
}
#breadcrumbs a:hover {
    text-decoration: underline;
}
#important {
    width: 100%;
}
#footer {
    margin-top: 25px;
    text-align: center;
    font-size: 80%;
}
#narrowcol {
    float: right;
    background: #000; 
    width: 200px;
    display:inline;
    margin-left:    20px;
    margin-top: 20px;
    margin-right: 20px; 
    border: 1px solid #666; 
    font-size: 80%;
}
#narrowcol a:hover {
    text-decoration: underline;
}

/* #narrowcol p {padding: 0 5px} */

#narrowcol p {
    padding-left: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
}


#toc {
    float: right;
    display: inline;
    background: #f0fff0; /* tower blue */
    margin-top: 20px;
    margin-right: 20px;
    margin-left: 20px;
    width: 200px;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 5px;
    border: 1px solid #ccc;
    line-height: 100%;
}

/* id thread used only for blog view */
#thread {
/*    margin-right: 300px; */
/*    margin-left: 50px; */
    margin-bottom: 50px;
}
/*
.commentblue {
    background: #f0f0ff;
    padding: 0px 5px 0px 5px;
}
*/
/*
.commentblue p {
    margin:0;
    padding: 2px 5px
}



*/
#parulaform input {
        float: left;	 
	margin-bottom: 10px;
}
#parulaform textarea {
 /*       float: left;	 */
}
#parulaform label {
        float: left;	
	text-align: right;
	padding-right: 20px;
/*        width: 120px; */
}
#parulaform br {
	clear: left;
}
a.extlink {
    text-decoration: none;  
/* 7june2013    border-bottom: 1px dashed;   */
}
a:hover.extlink {
    text-decoration: underline;
    border-bottom: 0px; 
}

/* general headline setup borrowed from DokuWiki */
h1, h2, h3, h4, h5 {
    color: #000; 
    background-color: transparent;
    font-size: 100%;
/*    font-family: Trebuchet MS, verdana, tahoma, arial, sans-serif; */
    line-height: 1.1em;
    font-weight: normal;
    margin-left:    0;
    margin-right:   0;
    margin-top:     0.5em;
    margin-bottom:  1em;
    padding-left:   0;
    padding-right:  0;
    padding-bottom: 0;
    padding-top: 5px;
    border-bottom: 1px solid #ccc;
    clear: left;
}
/* special headlines borrowed from DokuWiki */

h1 {font-size: 140%; margin-left: 0px; border-bottom: none; font-weight: bold;}
h2 {font-size: 130%; margin-left: 0px; border-bottom: none; font-weight: bold; padding-top: 1.5em;}
h3 {font-size: 120%; margin-left: 0px; border-bottom: none; font-weight: bold; padding-top: 1.5em;}
h4 {font-size: 110%; margin-left: 0px; border-bottom: none; font-weight: bold; padding-top: 1.5em;}
h5 {font-size: 90%; margin-left: 0px; border-bottom: none; font-weight: bold; padding-top: 1.5em;}



.tags {
/*    background: #ddd; */
/* this one background-color: #f0f0ff;  */
    background-color: #ececec;  
    margin-left: 20px;
    padding: 8px;
    line-height: 150%;
    width: 120px;
    text-align: left;
    border: 1px solid #ccc;
}
.added {
    background-color: #cff;
}
.removed {
    background-color: #fcc;
}
.changed {
    background-color: #ff6;
}
.unmodified {
}
/* tag cloud info from petefreitag.com */
.smallestTag  { font-size: xx-small; }
.smallTag     { font-size: small; }
.mediumTag    { font-size: medium; }
.largeTag     { font-size: large; }
.largestTag   { font-size: xx-large; }

.toclevel1 {margin-left: 0px;}
.toclevel2 {margin-left: 5px;}
.toclevel3 {margin-left: 10px;}
.toclevel4 {margin-left: 15px;}
.toclevel5 {margin-left: 20px;}
.toclevel6 {margin-left: 25px;}

.highlighted {
    margin-right: 2%;
    margin-left: 2%;
    background: #f5faff; 
    padding: 1%;
    border: 1px solid #ccc;
    margin-bottom: 20px;
}

.imageright {
    float: right;
    background: #eee;
    text-align: left;
    padding: 10px;
    font-size: 80%;
    margin-left: 10px;
    border: 1px solid #ccc;
}
.imageleft {
    float: left;
    background: #eee;
    text-align: left;
    padding: 10px;
    font-size: 80%;
    margin-right: 10px;
     border: 1px solid #ccc;
}

a.noarticle {
    text-decoration: none;      
    color: #c00;
}

.imagecaptionarea {
    background-color:#000;
    color: #f6f6f6;
    margin-top:8px;
    border:1px solid #000;
    width:740px; /* was 930px */
}

.imagecaptiontext {  
    font-size: 90%;
    font-family: arial,helvetica,sans-serif;
    padding: 4px 10px 4px 10px; 
}


#leftcontent {
background: #f8eaba; 
border: 1px solid #ccc;   
padding: 5px;  
width: 45%;
vertical-align: top;
}

#rightcontent {
background: #ffdddd;      
border: 1px solid #ccc;   
padding: 5px;
width: 45%;
vertical-align: top;
/* float: right; */

}

#bogusarea {
 background: #6080a0; 
 padding-right: 0px;
 padding-left: 0px;
 padding-bottom: 5px; 
 padding-top: 5px; 
}
.miniblogto {
    background-color: #e0e0e0;
}
.miniblogfrom {
    background: #f8eaba;
}
.miniblogpost {
    /* border-bottom: 1px solid #d7edfc */
    border-bottom: 1px solid #e0e0e0;
}
#cosidonate {
 background: #000;
 color: #fff;
 text-align: center;
 font-weight: bold;
}
#cosidonate a {
 color: #fff; 
 text-decoration: none; 
}
#cosidonate a:visited {
 color: #fff; 
 text-decoration: none; 
}
#cosidonate a:hover {
 color: #fff; 
 text-decoration: none; 
}
.hmbinfo {
    color: #666;
   font-size: 95%;
}
.commentpostedby {
    font-size: 90%;
    color: #666;
}
.xmasgreen
{
    COLOR: green;
    FONT-SIZE: 8px;
    FONT-FAMILY: "Times New Roman";
    TEXT-DECORATION: none;
}
.xmasred
{
    COLOR: red;
    FONT-SIZE: 8px;
    FONT-FAMILY: "Times New Roman";
    TEXT-DECORATION: none;
}

/* the button CSS, javascript, and html code is from metafilter.com */
	.buttons {
			background: #ccc;
			border: 1px solid #ccc;
			margin: 1;
			float:left;
		}
		
		.raise	{
			border-top: 1px solid buttonhighlight;
			border-left: 1px solid buttonhighlight;
			border-bottom: 1px solid buttonshadow;
			border-right: 1px solid buttonshadow;
			background: #ccc;
			margin:1;
			float:left;
		}
		
		.press {
			border-top: 1px solid buttonshadow;
			border-left: 1px solid buttonshadow;
			border-bottom: 1px solid buttonhighlight;
			border-right: 1px solid buttonhighlight;
			background: #ccc;
			margin:1;
			float:left;
		}	
		
		#toolbar {
                        display: none; /* added 14feb2014 */
			margin: 0;
			width: 100px;
			padding: 0;
			height:20px;
			background: #ccc;
			border-top: 1px solid buttonhighlight;
			border-left: 1px solid buttonhighlight;
			border-bottom: 1px solid buttonshadow;
			border-right: 1px solid buttonshadow;
			text-align:left;
		}

.bb0 {
    background: #f6f6f6;
}
.bb1{
    background: #f5faff;
}
.sticky {
background: #fff;
}


/* new css */

#newnarrowcol {
    float: right;
    width: 150px;
    display:inline;
    margin-left:    20px;
    margin-top: 10px;
    margin-right: 20px; 
    border: 1px solid #666; 
    background: #eee; 
    font-size: 80%;
}
#newnarrowcol a:hover {
    text-decoration: underline;
}

#newnarrowcol p {
    padding-left: 3px;
    margin-top: 7px;
    margin-bottom: 7px;
}

#newtitlearea {
    font-family: Arial, Helvetica, sans-serif;  
    background: #2B547E;   
    color: #fff;
    padding-top: 7px;
    padding-left: 5px;
    padding-right: 2px;
    padding-bottom: 7px;
}
.newsitetitle a {
    font-weight: bold; 
    font-size: 85%;  
    text-decoration: none;
    color: #fff;
}
.newsitetitle a:visited {
    font-weight: bold; 
    font-size: 85%;  
    text-decoration: none;
    color: #fff;
}
#newnavbar a {
    color: #fff;
    text-decoration: none;
    font-size: 90%; 
}
#newnavbar a:visited {
    color: #fff;
    text-decoration: none;
}
#newnavbar a:hover {
    color: #fff;
    text-decoration: underline;
}
.normalcontent {
    padding-top: 15px;
    padding-bottom: 15px;
}

.normalcontent .imageright {
    float: left;
    background: #fff;
}

.negativecontent {
    background:#fce8d2; 
    border: 1px solid #f00; 
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 2px;
    padding-right: 2px;
}

.positivecontent {
    background:#ccffcc; 
/*    background: #ccff00;  lake erie algae green - august 2014 */
    border: 1px solid #355e3b; 
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 2px;
    padding-right: 2px;
}  

.positiveandnegativecontent {
    background:#fce8d2; 
    border: 10px solid #ccffcc;
    padding: 0 5 0 5; 
    padding-top: 15px;
    padding-bottom: 15px;
}  

/* new for vertical message board view */
#verticalheader {
    padding: 4 4 4 4;
    background: #fff9d7;
}
#topicscolumn {
    border-bottom: 1px solid #eff5fb;
    padding: 5 5 5 5;
}
#repliescolumn {
    background: #f0f7fc;
    border-bottom: 1px solid #d7edfc;
    padding: 5 5 5 0;
}
#lastpostcolumn {
    border-bottom: 1px solid #eff5fb;
    padding: 5 5 5 5;
}
#verticalfooter {
    padding: 5 5 5 5;
    background: #eff5fb;
}

#activism a {
    width: 100%;
    margin-left: 10px;
    font-size: 85%;
    text-decoration: none;
}
#activism a:visited {
    width: 100%;
    margin-left: 10px;
    font-size: 85%;
    text-decoration: none;
}
#activism a:hover {
    width: 100%;
    margin-left: 10px;
    font-size: 85%;
    text-decoration: underline;
}

.neworupdatedthread {
 /*   background: #ffffcc; */
}

#politicsthreadlink {
    text-transform: lowercase;
}
#politicsthreadlink a {
    color: #b0b0b0;
    text-decoration: none;
}
#politicsthreadlink a:visited {
    color: #b0b0b0;
    text-decoration: none;
}
#politicsthreadlink a:hover {
    color: #000000;
    text-decoration: underline;
}

.thumbnail2 {
 float:left; 
 margin:0px 0px; 
 overflow:hidden;
 width:30px; 
 padding-right: 5px;
}

.politics
{
        margin-left: 25px;
        margin-right: 25px;
        padding-bottom: 2px;
        padding-top: 2px;
        text-align: center;
}
.politics a:link
{
	text-decoration: none;
}
.politics a:visited
{
	text-decoration: none;
}
.politics a:hover
{
	text-decoration: underline;
}

#greylinks a {
    color: #999999;
    text-decoration: none;
    font-size: small;
}
#greylinks a:visited {
    color: #999999;
    text-decoration: none;
}
#greylinks a:hover {
    color: #999999;
    text-decoration: underline;
}

#whitelinks a {
    color: #fff;
    text-decoration: none;
}
#whitelinks a:visited {
    color: #fff;
    text-decoration: none;
}
#whitelinks a:hover {
    color: #fff;
    text-decoration: underline;
}

#bbcontent {
/*
    margin-right: 3%; 
    margin-left: 3%;
*/
    line-height: 140%;
    font-size: 90%; 
}

.articletitle {
    color: #000;
}
.articletitle a {
    color: #000; 
    text-decoration: none;
}
.articletitle a:visited {
    color: #000; 
    text-decoration: none;
}
.articletitle a:hover {
    color: #000; 
    text-decoration: none;
}
.highlighted small {
    color: #000000;
    font-size: 85%;
}
.highlighted small a {
     color: #3366cc;
     text-decoration: none;
}
.highlighted small a:visited {
     color: #3366cc;
     text-decoration: none;
}
.highlighted small a:hover {
     color: #3366cc;
     text-decoration: underline;
}
#darkgreylinks {
   color: #a0a0a0; 
   font-size: 85%;
}
#darkgreylinks a {
    color: #000;
    text-decoration: none;
}
#darkgreylinks a:visited {
 /*   color: #888;   */
    color: #888;
    text-decoration: none;
}
#darkgreylinks a:hover {
    color: #000;
    text-decoration: underline;
}

.datechange {
    color: #b0b0b0;
    font-size: 70%;
    margin-left: 10px;
}

#mobilecommentcount {
    clear: right;
    float: right;
}

hr {
    border: 1px solid #000066; 
}

 #textareabox {
    background-color: #fff; 
/*
    background-image: url('http://toledotalk.com/images/festivus-donation-card-2.JPG');
    background-repeat:no-repeat;
    background-position:right bottom;
*/
    width: 70%;
    height: 175px;
 }
 #textareaboxarticle {
    background-color: #fff; 
    width: 80%;
    height: 250px;
 }

#title {
    width: 300px;
}

#smallerscreens {
    display: none;
}

#messagebox {
    background-color: #fff; 
    width: 300px; 
}

.privatemessagecount {
    background: #ff0;
}

#halloffame {
    background: green;
    padding-left: 5px;
    padding-right: 5px;
}
#halloffame a {
    color: white;
}
#halloffame a:visited {
    color: yellow;
}

#hallofshame {
    background: red;
    padding-left: 5px;
    padding-right: 5px;
}
#hallofshame a {
    color: white;
}
#hallofshame a:visited {
    color: yellow;
}

#lastcommentline {
    color: #888;
    font-size: 85%;
}
#newthreadcommentcount {
    color: #666;
    font-size: 95%;
    line-height: 100%;
}
#weatheralertssmall {
    float: right;
    line-height: 100%;
    font-size: small;
    display:none;
}
#weatheralerts {
    float: right;
    line-height: 100%;
    font-size: small;
}
#weatheralertswhite {
    float: right;
    line-height: 100%;
    font-size: small;
}
#weatheralertsyellow {
    float: right;
    line-height: 100%;
    font-size: small;
    border: 1px solid #ffff33; 
}
#weatheralertsred {
    float: right;
    line-height: 100%;
    font-size: small;
    padding: 2px;
    border: 1px solid #ff3333; 
}
#mobilecontentnewthread {
    border-bottom: 1px solid #e0e0e0;
    padding-top: 15px;
    padding-bottom: 15px;
    background: #f0fff0; /* tower blue */
}

#hidebutton {
    font-size: 1em;
    color: #f8f8f8;
    background: #00cc33; 
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px; 
    border: 1px solid #00cc33;
    font-weight: bold;
}
#hidebutton:hover {
    color: #ffffff;
}
#unhidebutton {
    font-size: 1em;
    color: #666666;
    background: #c0c0c0; 
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px; 
    border: 1px solid #c0c0c0;
    font-weight: bold;
}
#unhidebutton:hover {
    color: #000000;
}
.hidecomment {
/*    display: none; */
    font-size: 10px;
    color: #ccc;
}  
.hidecomment .commentpostedby {
    text-transform: lowercase;
    color: #ccc;
}






/******************* MEDIA QUERIES START **********************/
@media only screen and (min-width: 12em) { 
    header {
        position: fixed;
    }

    section {
        padding-top: 1.5em;
    }

    #weatheralerts, #weatheralertswhite, #weatheralertsyellow, #weatheralertsred  {
        display: none;
    }

    #weatheralertssmall {
        display: inline;
        padding-top: 5px;
    }

    #sitewide {
        padding: .4em .2em 0 .2em;
    }

    .mean-container .mean-bar {
        position: fixed;
    }

    header #counters {
        display: none;
        right: 1em;
    }
}

@media only screen and (min-width: 48em) { 
    header #counters {
        display: inline;
    }
    #weatheralerts, #weatheralertswhite, #weatheralertsyellow, #weatheralertsred  {
        padding-top: 5px;
        display: inline;
    }

    #weatheralertssmall {
        display: none;
    }

}

/********** desktop or laptop >= 1224px **********/
/* 76.5em = 1224 px */
@media only screen and (min-width: 76.5em) { 
}


/********** tablet 768-1024px **********/
/* 75em = 1200px */
@media only screen and (max-width: 75em) { 
 #textareabox {
    background-color: #fff; 
    height: 175px;
    width: 70%;
 }
 #textareaboxarticle {
    background-color: #fff; 
    width: 70%;
    height: 200px;
 }
}


/********* smartphone 320-480px  **********/
/* 37.5em = 600px */
@media only screen and (max-width: 37.5em) {
 #textareabox {
    background-color: #fff; 
    height: 125px;
    width: 80%;  
 }
 #textareaboxarticle {
    background-color: #fff; 
    height: 125px;
    width: 80%;
 }
 #breadcrumbs {
    display: none;
 }
 #newthreadcommentcount {
    display: none;
 }
 #title {
     width: 270px;
 }
 #largerscreens {
     display: none;
 }
 #smallerscreens {
     display: inline;
 }
 #toc {
    display: none;
 }
 nav ul {
    display: none;
 }

 nav ul {
    display: inline;
 }
 header {
    position: relative;
 }

}

/************* end media queries ***************/