@import 'http://ruvenproductions.bplaced.net/css?href=Mobile.css';
@import 'http://fonts.googleapis.com/css?family=Roboto+Condensed:300';

/* COMMENT FONT *
input[type="text"].cInput { font-family: Roboto Condensed !important; }
textarea.cTextarea, textarea.rTextarea { font-family: Roboto Condensed !important; } */

/* COMMENT USER COLOR */
.comment[data-writer-group="highlight"] { background: #BEDFFF; }
.comment[data-writer-group="highlight"] .commentarrow { border-color: transparent #BEDFFF #BEDFFF transparent; }
.comment[data-writer-group="highlight"] .commenttitle { border-bottom: 1px solid #BEDFFF; }

#commentsectionheader h2 .num {
	font-size: 14px !important;
}

#writecommentarea span.actiontitle {
	margin-left: 5px;
	font-size: 18px;
}
#writecommentarea #writecomment {
	max-width: 600px;
	margin-top: 5px;
	padding: 5px;
	padding-bottom: 30px;
	background: #E0EEFF;
	border-radius: 4px;
}
#writecommentarea #writecomment input[type="text"].cInput {
	width: calc(100% - 11px);
	padding: 2.5px 5px;
	background: white;
	border: none;
	border-radius: 2px;
	font-family: 'Roboto Condensed', monospace, Arial, sans-serif;
}
#writecommentarea #writecomment input[type="text"].cInput.cTitle.clicked {
	height: 24px;
	font-size: 16px;
	font-weight: lighter !important;
}
#writecommentarea #writecomment input[type="text"].cInput.cTitle.alreadyclicked {
	font-weight: bold;
}
#writecommentarea #writecomment textarea.cTextarea.cContent {
	height: 40px;
	min-height: 40px;
	max-height: 200px;
	width: calc(100% - 13px);
	min-width: calc(100% - 11px);
	max-width: calc(100% - 11px);
	margin-top: 5px;
	padding: 2.5px 5px;
	border: none;
	border-radius: 2px;
	font-family: 'Roboto Condensed', monospace, Arial, sans-serif;
}
#writecommentarea #writecomment textarea.cTextarea.cContent.clicked {
	min-height: 150px;
}
#writecommentarea #writecomment input[type="submit"].cSubmit {
	height: 22px;
	margin-top: 2px;
	margin-right: 2px;
	padding: 0px 2.5px;
	background: #BADAFF;
	border: 1px solid #8EC5FF;
	border-radius: 2px;
	line-height: 20px;
	float: right;
	display: inline-block;
	cursor: pointer;
	transition: .5s;
}
#writecommentarea #writecomment input[type="submit"].cSubmit:hover {
	background: #CAE5FF;
}
input[type="submit"].bluesubmit {
	height: 22px;
	padding: 0px 2.5px;
	background: #BADAFF;
	border: 1px solid #8EC5FF;
	border-radius: 2px;
	line-height: 0px;
	display: inline-block;
	cursor: pointer;
	transition: .5s;
}
input[type="submit"].bluesubmit:hover {
	background: #CAE5FF;
}

#e__Comments_Write {
	margin-bottom: 20px;
}
#e__Comments_Timeline {
	width: 100%;
	display: inline-block;
}

.commentfield {
	padding-top: 20px;
	clear: both;
}
.commentfield:first-of-type {
	padding-top: 0px;
}
.commentfield.hidden-comment, .reply.hidden-comment {
	opacity: .2;
	transition: .2s;
}
.commentfield.hidden-comment:hover, .reply.hidden-comment:hover {
	opacity: 1;
}
#newcomment {
	display: none;
}
.commentavatar {
	height: 100px;
	width: 100px;
	background-repeat: no-repeat !important;
	background-size: 100% 100% !important;
	float: left;
}
.commentusername {
	margin-left: 10px;
	line-height: 40px;
	color: #454545;
	font-weight: bold;
	display: none;
	float: left;
}
.commenttime {
	margin-top: 100px;
	font-size: 10px;
	float: left;
	position: absolute;
	display: none;
}
.comment {
	min-height: 150px;
	width: calc(100% - 110px);
	background: #E0EEFF;
	float: right;
}
.commentarrow {
	height: 1px;
	width: 1px;
	margin-left: -25px;
	margin-top: 10px;
	border-width: 15px;
	border-style: solid;
	border-color: transparent #E0EEFF #E0EEFF transparent;
}
.commentcontent,
.commenttext {
	min-height: 73px;
	padding: 5px;
}
.commenttext.notitle {
	margin-top: -45px !important;
}
.commenttitle {
	margin-top: -40px;
	margin-left: 5px;
	margin-right: 5px;
	font-size: 18px;
	border-bottom: 1px solid #BADAFF;
}
.commentcontent .commenttext {
	margin-top: 2.5px;
}
.commenteditor {
	display: none;
}
.commentedit {
	padding: 0px 10px;
	padding-top: 2.5px;
}
.commentedit .commentreply {
	display: inline-block;
}
.commentedit .commentreply span.activateReplyEditor.replylink {
	margin-top: -2px;
	font-weight: bold;
}
.commentedit .commentreply span.activateReplyEditor.replylink:hover {
}
.replyeditor .commenteditlink { margin-top: -25px !important; }
.replyeditor .deactivateCommentEditor { font-size: 12px; }
.commenteditor .commenteditform {
	margin-top: -40px;
	margin-left: 1px;
}
.commenteditor .commenteditform .cTitle {
	height: 20px;
	width: calc(100% - 11px);
	padding: 5px 5px 2.5px 5px;
	background: white;
	border: none;
	font-size: 18px;
	font-family: 'Roboto Condensed', monospace, Arial, sans-serif;
}
.commenteditor .commenteditform .cContent {
	min-height: 68px;
	max-height: 200px;
	min-width: calc(100% - 11px);
	max-width: calc(100% - 11px);
	margin-top: 5px;
	padding: 5px;
	border: none;
	font-family: 'Roboto Condensed', monospace, Arial, sans-serif;
}
.commenteditor .commenteditform .cSubmit {
	/*height: 22px;*/
	height: 26px;
	margin-top: 5px;
	/*padding: 2.5px 10px 0px 10px;*/
	padding: 7.5px 14px 5px 14px;
	background: #99BEE9;
	border: 0; /* 1px solid #8EC5FF; */
	border-radius: 6px;
	color: #14225f;
	font-weight: 600;
	line-height: 0;
	display: inline-block;
	cursor: pointer;
	transition: .5s;
}
.commenteditor .commenteditform .cSubmit:hover {
	background: #7FB1EC;
	box-shadow: 0 0 6px #94b2CB;
}
.commenteditor .commenteditlink {
	margin-top: -20px;
	margin-right: 5px;
}

.commenteditor.replyeditor .commenteditform .cContent {
	min-height: 50px;
	height: 50px;
	max-height: 100px;
	padding: 4px;
	min-width: calc(100% - 80px);
	max-width: calc(100% - 80px);
	margin-top: 40px;
	margin-left: 10px;
	border: 1px solid #E0EEFF;
}
.commenteditor.replyeditor .commenteditform .rSubmit {
	background: none;
	border: none;
	font-size: 12px;
	font-style: italic;
	margin-left: 65px;
}

.commenteditlink {
	/*margin-top: 2px;*/
	float: right;
	clear: both;
}
.commenteditlink .editlink {
	font-style: italic;
}
/* */
.commentdeletelink {
	float: right;
}
.commentdeletelink form input[type="submit"] {
	display: none;
}
.editlink.deletelink {
	margin-right: 16px;
	font-style: italic;
}
.commentdeletelink form:first-of-type {
	margin-right: -8px;
}
.e__Comment_Hide_Label.hide,
.e__Comment_Unhide_Label.hide,
.commentsToggle.hide {
	display: none;
}

.replyfield {
	padding-top: 10px;
	clear: both;
}
.writereply {
	width: 80%;
	margin-bottom: 10px;
	padding: 5px;
	background: #E0EEFF;
	float: right;
	display: none;
	position: relative;
	z-index: 1.5;
}
.writereply .rContent {
	min-width: calc(100% - 12px);
	max-width: calc(100% - 12px);
	min-height: 50px;
	max-height: 120px;
	margin-left: 1px;
	padding: 5px;
	border: 0px;
	font-family: 'Roboto Condensed', monospace, Arial, sans-serif;
}
.writereply .rSubmit {
	margin-top: 5px;
}

.replyfield .commentreplies {
	clear: both;
}
.commentreplies small.replynumber {
	margin-top: -5px;
	float: right;
}
.commentreplies .replyfieldborder {
	width: calc(100% - 110px);
	margin-top: 2.5px;
	margin-bottom: 5px;
	padding-top: 5px;
	border-top: 1px solid #D0E8FF;
	float: right;
}
.commentreplies .replyfieldborder .replyfieldarrow {
	height: 10px;
	width: 20px;
	margin-top: -15px;
	margin-right: 80px;
	background: url('../../Skins/default-images/reply_arrow_whitebg.png') no-repeat;
	float: right;
}
.commentreplies .reply {
	margin-bottom: 10px;
	width: calc(100% - 110px);
	float: right;
	clear: both;
}
.commentreplies .reply .replyavatar {
	height: 60px;
	width: 60px;
	background-repeat: no-repeat !important;
	background-size: 100% 100% !important;
	float: left;
}
.commentreplies .reply .replyavatar img {
	display: none;
}
.commentreplies .reply .replycontent {
	min-height: 50px;
	width: calc(100% - 80px);
	padding: 5px;
	background: #E0EEFF;
	float: right;
}
.replyeditdeletelinks {
	display: none;
}

.commentsToggle {
	margin-top: 4px;
	font-size: 12px;
	float: right;
}

#siteComments {
	display: none;
}

/* SMALL SCREENS */
/* COMMENTS */
@media (max-width: 720px) {
	.commentavatar {
		height: 40px;
		width: 40px;
		border-radius: 100%;
		margin-bottom: 5px;
	}
	.commentusername { display: inline-block; }
	.commenttime {
		margin-top: 0;
		margin-left: 10px;
		display: block !important;
		line-height: 44px;
		position: relative;
	}
	.comment {
		width: 100%;
		border-radius: 14px;
	}
	.commentarrow { display: none; }
	.commenttitle { margin-top: 0; }
	input.bluesubmit[type="submit"], .commentedit .commentreply span.activateReplyEditor.replylink {
		padding: 5px 10px;
		background: #BADAFF;
		border: none;
		border-radius: 8px;
		font-weight: bold;
		line-height: 22px;
		cursor: pointer;
	}
	.commentcontent .commentcontent { margin: 0 !important; }
	.commentreplies .replyfieldborder { width: calc(100% - 40px); }
	.commentreplies .reply { width: 100%; }
	.commentreplies .reply .replycontent {
		width: calc(100% - 50px);
		border-radius: 10px; /* Comments 14px */
	}
	.commentreplies .reply .replyavatar {
		height: 30px;
		width: 30px;
		border-radius: 100%;
	}
	.commenttext.notitle,
	.commenteditor .commenteditform	{
		margin-top: 0 !important;
	}
}