@charset "utf-8";
/* CSS Styles for Custom-Comments control */

div.custom-comments-main-container{
	width:100%;
	min-height:100%;
	box-sizing:border-box;
}
div.custom-comments-main-container *{
	box-sizing:border-box;
	font-family:'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif !important;
	font-size:14px;
	color:#333;
}
ul.custom-comments-comment-list{
	margin:0;
	padding:0;
	list-style:none;
}

li.custom-comments-list-item{
	margin:0;
	padding:10px;
	list-style:none;
	position:relative;

}
div.custom-comments-comment-byline{
	font-weight:bold;
	margin-bottom:-5px;
	min-height:28px;
}
span.custom-comments-comment-created-by{
	font-weight:bold;
	padding-right:10px;
	font-size:1.1em;
	letter-spacing: -1px;
}
span.custom-comments-comment-created-datetime{
	color:rgba(0,0,0,0.4);
	font-size:.85em;
	font-weight:500;
}
div.custom-comments-comment-body{
	display:inline;
	white-space:pre-wrap;
}
div.custom-comments-comment-body input{
	font-weight:normal;
	font-size:1em;
}
div.custom-comments-comment-body input[readonly] {
  border-color: transparent !important;
  color: #333 !important;
  font-weight: bold;
  background: none;
  text-shadow: none;
  padding-left: 0;
  padding-right: 10px;
  font-weight: bold;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
div.custom-comments-comment-entry-container{
	position:relative !important;
	margin-top:20px !important;
	height:auto !important;
}
textarea.custom-comments-comment-entry-box{
	resize: none !important;
	min-height: 100% !important;
	width: 100% !important;
	max-width: 100% !important;
	height: 34px !important;
	padding: 5px 5px 5px 40px !important;
	border-radius: 4px !important;
	border: 2px solid rgba(0,0,0,0.2) !important;
	overflow-y: hidden !important;
	margin-bottom: -4px !important;
}
input.custom-comments-comment-entry-button{
	position:absolute !important;
	left:0 !important;
	top:0 !important;
	width:34px !important;
	min-height:100% !important;
	font-weight:bold !important;
	font-size:1.5em !important;
	color:rgba(0,0,0,0.5) !important;
	border:2px solid rgba(0,0,0,0.2) !important;
	overflow:hidden !important;
	background-color:#efefef !important;
	border-collapse:collapse !important;
	border-style:solid !important;
	border-top-left-radius:4px !important;
	border-bottom-left-radius:4px !important;
	margin:0 !important;
	padding:0 !important;
}
input.custom-comments-comment-entry-button:hover,
input.custom-comments-comment-entry-button:active{
	background-color:#56b68b;
	color:#fff;
}
div.custom-comments-edit-info{
	display:inline;
	position:relative;
	margin-left:5px;
	margin-right:5px;
	color:rgba(0,0,0,0.5);
	cursor:pointer;
	width:auto;
}
div.custom-comments-edit-info-content{
	display:none;
	position:absolute;
	background-color:#111;
	padding:5px 7px;
	border:none;
	border-radius:4px;
	top:10px;
	z-index:999;
	margin:auto;
	left:0;
	font-size:.9em;
    text-shadow: none;
}
div.custom-comments-edit-info-content:after{
	content: "";
	position: absolute;
	top: -6px;
	left: 45%;
	border-width: 0 6px 6px;
	border-style: solid;
	border-color: #111 transparent;
	display: block;
	width: 0;
}
span.custom-comments-edit-info-edited-by{
	font-weight:600;
	padding-right:10px;
	font-size:1.1em;
	letter-spacing: 0;
	white-space:nowrap;
	color:#fff;
}
span.custom-comments-edit-info-edited-datetime{
	font-size:1em;
	font-weight:400;
	white-space:nowrap;
	color:rgba(255,255,255,0.8);
}
a.custom-comments-options-button{
	position:absolute;
	top:10px;
	right:10px;
	width:18px;
	height:18px;
	display:none;
	cursor:pointer;
	background-image:url('images/small-cog-icon.png');
}
a.custom-comments-options-button:hover,
a.custom-comments-options-button:active{
	background-image:url('images/small-cog-icon-over.png');
}
div.custom-comments-options-menu-container{
	position:absolute;
	top:10px;
	right:10px;
	width:150px;
	height:auto;
	min-height:24px;
	display:none;
}
ul.custom-comments-options-menu{
	list-style:none;
	margin:0;
	padding:0;
}
li.custom-comments-options-menu-item{
	padding:7px 5px;
}
li.custom-comments-options-menu-item .edit-comment:before{
	content:'';
	background-image:url('images/options-menu-edit.png');
	width:18px;
	height:18px;
}
li.custom-comments-options-menu-item .delete-comment:before{
	content:'';
	background-image:url('images/options-menu-delete.png');
	width:18px;
	height:18px;
}
div.custom-comments-change-controls{
	background-color:#fff5cf;
	width:100%;
	min-height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:998;
	border:1px solid rgba(0,0,0,0.2);
	border-radius:4px;
	display:none;
	padding:10px 10px 5px;
	box-sizing:border-box;
}
textarea.custom-comments-edit-comment{
	background-color:#fff !important;
	width:100% !important;
	max-height:32px !important;
	margin:0 auto !important;
	border:1px solid rgba(0,0,0,0.2) !important;
	border-radius:4px !important;
	box-sizing:border-box !important;
	resize:none !important;
}
a.custom-comments-edit-cancel,
a.custom-comments-edit-save{
	min-width:50px;
	white-space:nowrap;
	font-size:0.95em;
	color:#06F;
	text-decoration:none;
	cursor:pointer;
}
a.custom-comments-edit-cancel:hover,
a.custom-comments-edit-save:hover{
	text-decoration:underline;
}

a.custom-comments-edit-cancel{
	float:left;
	text-align:left;
}
a.custom-comments-edit-save{
	float:right;
	text-align:right;
}
div.custom-comments-options-menu{
	background-color:#fff;
	min-width:100px;
	position:absolute;
	top:30px;
	right:10px;
	z-index:998;
	box-shadow:0 1px 7px rgba(0,0,0,0.4);
	border-radius:4px;
	display:none;
	overflow:hidden;
}
ul.custom-comments-options-menu-list{
	list-style:none;
	margin:0;
	padding:0;
}
ul.custom-comments-options-menu-list li{
	padding:8px 6px 8px 32px;
	font-size:1em;
	font-weight:normal;
	color:#333;
	box-sizing:border-box;
	position:relative;
	cursor:pointer;
}
ul.custom-comments-options-menu-list li:hover{
	background-color:#69F;
	color:#fff;
}
li.custom-comments-options-menu-list-item-edit:before{
	content:'';
	position:absolute;
	left:6px;
	top:10px;
	width:18px;
	height:18px;
	background-image:url('images/options-menu-edit.png');
}
li.custom-comments-options-menu-list-item-delete:before{
	content:'';
	position:absolute;
	left:6px;
	top:10px;
	width:18px;
	height:18px;
	background-image:url('images/options-menu-delete.png');
}
div.custom-comments-delete-warning-popover{
	content:"";
	width:100%;
	min-width:100%;
	max-width:100%;
	height:100%;
	min-height:100%;
	max-height:100%;
	position:absolute;
	z-index:998;
	margin:0;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:rgba(0,0,0,0.7);
}
div.custom-comments-delete-warning-popover-msgbox{
	width:400px;
	height:150px;
	box-shadow:0 1px 7px rgba(0,0,0,0.8);
	border-radius:4px;
	overflow:hidden;
	z-index:999;
	position: fixed;
  	top: 50%;
  	left: 50%;
	transform: translate(-50%, -50%);
	background-color:#fff;
}
div.custom-comments-delete-warning-popover-msgbox header{
	background-color:#e8e8e8;
	padding:8px;
	box-sizing:border-box;
	font-size:1.1em;
	font-weight:bold;
	color:#333;
	text-align:left;
}
div.custom-comments-delete-warning-popover-msgbox p{
	padding:8px 20px 20px;
	box-sizing:border-box;
	font-size:.9em;
	font-weight:normal;
	color:#333;
	text-align:left;
}
div.custom-comments-delete-warning-popover-msgbox input[type="button"]{
	float:right;
	margin:10px 5px 10px 0;	
	border:1px solid #ccc;
	border-radius:4px;
	border-collapse:collapse;
	background-color:#f5f5f5;
	color:#333;
	font-size:.9em;
	font-weight:bold;
	padding:8px 10px;
	box-sizing:border-box;
	cursor:pointer;
}
div.custom-comments-delete-warning-popover-msgbox input[type="button"]:hover{
	border-left:1px solid rgba(0,0,0,0.3);
	border-right:1px solid rgba(0,0,0,0.3);
	border-bottom:2px solid rgba(0,0,0,0.3);	
}
div.custom-comments-delete-warning-popover-msgbox input.custom-comments-delete-button{
	color:#fff;
	background-color:#4AB1E3;	
	border:1px solid #4AB1E3;
	margin-right:10px;
}

/*
    override styles for modal display mode
*/
div.custom-comments-display-mode-modal {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    margin:0;    
}

div.custom-comments-display-mode-modal div.custom-comments-comment-list-wrapper {
    margin-bottom:5% !important;
    overflow:hidden;
    height:100% !important;
    display:block;
    position: relative;
}

div.custom-comments-display-mode-modal ul.custom-comments-comment-list-wrapper:after {
    content: "";
    display: table;
    clear: both;
}

div.custom-comments-display-mode-modal ul.custom-comments-comment-list{
    position:absolute !important;
    top:0 !important;
    bottom:70px !important;
    right:0;
    left:0;
    display:block;
    overflow-y:scroll;
    overflow-x:hidden;
    border-bottom:1px solid rgba(0,0,0,0.3);
    background-color:#fff;
}

div.custom-comments-display-mode-modal div.custom-comments-comment-entry-container{
    position:absolute !important;
    bottom:30px !important;
    width:98% !important;
    background-color:#ccc !important;
}