﻿.commentsCtr {
   float: left;
   background: var(--pres-main-bg-light);
   padding: 20px;  
   width: 100%;
	margin-top: 30px;
}

.commentsContainer, .postedComments{
   float: left;
   margin: 0px 0px 0px 0px;
   width: 100%;
}

.commentsLoad {
   clear: both;
   margin-top: 30px;
   float: left;
   width: 100%;
}

.postedComments {
   border-top: solid 1px #bbbbbb;
}

.commentsBox {
   float: left;
   clear: both;
   width: 100%;
}

.commentsTextarea {
   float: left;
   clear: both;
   height: 90px;
   max-width: 100%;
   min-width: 100%;
   width: 100%;
   margin: 10px 0px 10px 0px;  
   border: solid 1px #bbbbbb;
   font-size: .9em;
   padding: 10px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

.comment {
   color: var(--pres-main-fg-color);
   font-size: 1em;
   padding: 20px;
   width: 100%;
   height: auto;
   float: left;
   box-shadow: 0px 0px 2px #888888;
   margin: 0px 0px 20px 0px;
}

.comment .user, .comment .date {
   font-size: .8em;
}

.comment .date 
{
	float: right;
}

.comment .user 
{
	float: left;
}

.commentBody {
   float: left;
   margin: 5px 0px 20px 0px;
   line-height: 1.25em;
   width:100%;
   font-size: 1em;
}

.commentTools {
   float: left;
   clear: both;  
   width: 100%;
   border-top: solid 1px #ffffff;
}

.cheerThis {
   float: left;
   clear: both;
   margin: 0px 0px 0px 0px;
}

.inlineCheerCount, .inlineCheerText {
   float: left;
   position: relative;
   font-size: .8em;
   text-align: center;
   line-height: 2.125em;
}

.inlineFlagContainer {
   float: right;
   color: #888888;
   margin: 0px 0px 0px 0px;
   font-size: .9em;
}

.flagCommentTxt {
   float: left;
   margin: 3px 0px 0px 0px;  
}

.fancyFlag {
   float: right;
}

.inlineCheerCopy {
   float: right;
   margin: 0px 0px 0px 0px;
}

.totalComments {
   float: left;
   font-size: 1em;
   color: var(--pres-main-fg-color);
	width: 100%;
	padding: 10px 0px;
   text-transform: uppercase;
}

/* NO USER PROMPT FOR COMMENTS */
.noUserBg {
   position: fixed;
   background: var(--pres-main-bg-dark);
   opacity: .8;
   width: 100%;
   min-height: 100%;
   top: 0px;
   left: 0px;
   z-index: 10001;
   display: none;
}

.noUserPrompt {
   width: 500px;
   height: 170px;
   background-color: #eeeeee;
   color: var(--pres-main-fg-color);
   margin: 300px auto 0px auto;  
   position: fixed;
   top: 0px;
   z-index: 10002;
   display: none;
   box-shadow: 0px 0px 5px #000000;
}

.noUserHeading {
   float: left;
   width: 100%;
   padding: 20px;
   font-size: 2em;
   background: #eeeeee; /* Old browsers */
   background: -moz-linear-gradient(top,  #eeeeee 0%, #bbbbbb 100%); /* FF3.6+ */
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#bbbbbb)); /* Chrome,Safari4+ */
   background: -webkit-linear-gradient(top,  #eeeeee 0%,#bbbbbb 100%); /* Chrome10+,Safari5.1+ */
   background: -o-linear-gradient(top,  #eeeeee 0%,#bbbbbb 100%); /* Opera 11.10+ */
   background: linear-gradient(to bottom,  #eeeeee 0%,#bbbbbb 100%); /* W3C */
   font-family: bebas;
}

.message {
   width: 100%;
   padding: 0px;
   float: left;
   clear: both;
   font-size: 1em;
   font-weight: normal;  
   color: var(--pres-main-fg-color);
   margin: 20px 0px 0px 0px;
}

.noUserButtonContainer {
   width: 100%;
   padding: 20px;
   float: left;
   clear: both;
   margin: 10px 0px 0px 0px;  
}

.noUserPromptButtons {
   margin: 0px 0px 0px 0px;
   cursor: pointer;
   display: inline-block;
   vertical-align: baseline;
}

.noUserPromptButtons:hover {
   text-decoration: underline;  
}

/* END PROMPT FOR COMMENTS */


/* Old Style */
.postCommentButton {
   background-image: none !important;
   background-color: #ff4e00;  
   height: 35px;
   font-size: 1em !important;
   width: auto;
   padding: 10px;
}

.unflag {
   float: right;
}

.newsDeleteComment {
   float: right;
   width: 24px;
   height: 24px;
   line-height: 24px;
   margin: 0px 10px 0px 0px;  
   clear: none; 
   cursor: pointer;
   font-size: 24px;
   text-align: center;
   text-decoration: none; 
}

.postCommentError {
   display: none;
   float: left;
   color: #910000;
   background: var(--pres-main-bg-light);
   

   font-size: 10pt;
   padding: 5px 5px 5px 5px;
   margin: -1px 0px 0px 5px;
   border: solid 1px #eeeeee;
} 

.editBtn 
{
   cursor: pointer;
   float: left;
   margin: 0px;
   padding: 0px 20px;
   line-height: 40px;
}

.showMoreComments {
   float: left;
   clear: both;
   cursor: pointer;
   padding: 10px;
   margin: 10px 0px;
   float: left;
   width: 100%;
	text-align: center;
	font-size: 1em;
	border: none;
}

.showMoreComments:hover {
   background-color: #dddddd;  
}

@media all and (min-width: 320px) and (max-width: 767px) {
   .commentsCtr
   {
		margin: 0px 2% 20px 2%;
		width :96%;
		box-shadow: 0px 0px 3px var(--pres-main-fg-color);
		-webkit-box-shadow: 0px 0px 3px var(--pres-main-fg-color);
		-moz-box-shadow: 0px 0px 3px var(--pres-main-fg-color);
   }
   
   .noUserBg {
      position: fixed;
   }
   
   .noUserPrompt {
      width: 96%;
      top: 20%;
      margin: 0px 0px 0px 0px;
      left: 2%;
   }   
}