/**
 * @package    hubzero-cms
 * @copyright  Copyright (c) 2005-2020 The Regents of the University of California.
 * @license    http://opensource.org/licenses/MIT MIT
 */

/*

	-- -- -- -- -- -- --
	Project feed CSS
	-- -- -- -- -- -- --

*/
	.activity > ul {
		margin-left: 30px;
	}
	.activity > ul > li {
		padding: 0;
		margin: 0;
		position: relative;
		display: block;
	}
	/* Member photo */
	.activity-actor-picture {
		float: left;
		margin: 0 20px 0 0;
		padding: 0;
		width: 48px;
		height: 48px;
		position: relative;
		-webkit-border-radius: 0.25em;
		-moz-border-radius: 0.25em;
		-ms-border-radius: 0.25em;
		-o-border-radius: 0.25em;
		border-radius: 0.25em;
		display: none;
	}
	.activity-actor-picture img {
		-webkit-border-radius: 0.25em;
		-moz-border-radius: 0.25em;
		-ms-border-radius: 0.25em;
		-o-border-radius: 0.25em;
		border-radius: 0.25em;
	}
	/* Content */
	.activity-content {
		margin: 0 0 1em 0;
		position: relative;
		background-color: #fff;
		border: 1px solid #d9d9d9;
		padding: 0;
		-ms-word-break: normal;
		word-wrap: normal;
		word-break: normal;
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		hyphens: auto;
	}
	.newitem .activity-content {
		background-color: #fff6ef;
		border-color: #f5ddcc;
	}
	.activity-body {
		position: relative;
	}
	.activity-event {
		padding: 0.61803399em 1.61803399em 1.61803399em 1.61803399em;
	}
	/*.activity-event-content .body {
		margin: 1em 0 0 0;
	}
	.activity-event-content .body>*:first-child {
		margin-top: 0;
		padding-top: 0;
	}
	.activity-event-content .body>*:last-child {
		margin-bottom: 0;
		padding-bottom: 0;
	}*/
	.activity-event-preview>*:first-child,
	.activity-event-content>*:first-child {
		margin-top: 0;
		padding-top: 0;
	}
	.activity-event-preview>*:last-child,
	.activity-event-content>*:last-child {
		margin-bottom: 0;
		padding-bottom: 0;
	}
	.activity-details {
		display: block;
		margin: 0 7em 0 0;
		color: #aaa;
		padding: 1.61803399em 1.61803399em 0 1.61803399em;
	}
	.activity-details a {
		color: #aaa;
	}
	/*.activity-actor {
		color: #333;
	}*/
	.activity-details span {
		margin-right: 1em;
	}
	.com_projects .activity .activity-event-content:before,
	.activity-event-content:before {
		color: #ccc;
	}
	.activity .activity-event-content:after {
		display: none;
	}
	/* Activity options */
	.activity-options {
		text-align: right;
		opacity: 0.5;
		padding: 0.61803399em;
		position: absolute;
		right: 1em;
		top: 1.2em;
		padding: 0;
	}
	.activity-content:hover .activity-options {
		opacity: 1;
	}
	.activity-options .icon-delete:hover:before {
		color: red;
	}
	.activity-options .icon-edit.active:before,
	.activity-options .icon-reply.active:before {
		content: "\2716";
	}
	.activity-options ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.activity-options ul>li {
		display: inline-block;
		margin: 0;
		padding: 0;
	}
	.activity-options ul>li>a {
		font-size: 1.35em;
		line-height: 1;
		margin: 0;
		white-space: nowrap;
		overflow: hidden;
		background-color: transparent;
		-webkit-transition: all 50ms ease-in 0s;
		-moz-transition: all 50ms ease-in 0s;
		transition: all 50ms ease-in 0s;
		display: inline-block;
		width: 2em;
		height: 1.8em;
		padding: 0;
		position: relative;
		color: transparent;
	}
	.activity-options ul>li>a:before {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: 0;
		padding: 0;
		line-height: 1.8;
		text-align: center;
		color: #aaa;
	}
	.activity-options ul>li>a:hover {
		border-bottom: none;
		text-decoration: none;
		color: transparent;
	}
	.activity-options ul>li>a:hover:before {
		color: #222;
	}

	.activity-comments .activity-action {
		display: none;
	}

	/* Online indicator */
	.online {
		display: block;
		width: 14px;
		height: 14px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
		border: 2px solid #fff;
		margin: 0;
		padding: 0;
		position: absolute;
		bottom: -5px;
		right: -5px;
		white-space: nowrap;
		overflow: hidden;
		text-indent: 5em;
		background-color: #ABD037;
	}

@media (min-width: 40em) {
	.activity > ul {
		margin-left: 70px;
	}
	.activity-actor-picture {
		display: block;
	}
	.activity-content {
		margin: 0 0 1em 70px;
	}
	/* Arrow */
	.activity-content:before,
	.activity-content:after {
		content: "";
		position: absolute;
		top: 10px;
		left: -20px;
		border-width: 10px;
		border-style: solid;
		border-color: transparent #dad9d9 transparent transparent;
		display: block; 
		width: 0;
	}
	.activity-content:before {
		top: 10px; 
		left: -20px;
		bottom: auto;
		border-width: 10px;
		border-color: transparent #dad9d9 transparent transparent;
	}
	.activity-content:after {
		top: 10px; 
		left: -18px;
		bottom: auto;
		border-width: 10px;
		border-color: transparent #fff transparent transparent; 
	}
	.newitem .activity-content:before {
		border-color: transparent #f5ddcc transparent transparent; 
	}
	.newitem .activity-content:after {
		border-color: transparent #fff6ef transparent transparent; 
	}
}

	.more-content:before {
		content: "\2304";
		font-family: "Fontcons";
		margin-right: 0.3em;
	}

/* Blog form
--------------------------------------------- */
	#blab fieldset {
		padding: 1em;
		border: none;
		float: none;
		margin: 1em 0 1em 0;
		color: #777;
		background: #F5F7F2;
		border: 1px solid #DEE4CD;
		-webkit-border-radius: 0.25em;
		-moz-border-radius: 0.25em;
		border-radius: 0.25em;
		background: transparent;
		border: 2px solid #eee;
		border: 2px solid rgba(0, 0, 0, 0.1);
	}
	#blab textarea {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		margin: 0;
		height: 3em;
		width: 100%;
		display: block;
		overflow: hidden;
	}
	#blab p {
		padding: 1em 0 0 0;
		margin: 0;
		text-align: right;
	}
	#blab .focused textarea {
		height: 8em;
	}
	#blab .focused p {
		display: block;
	}
	#blab input,
	.content-feed .addcomment input {
		width: auto;
	}
	.content-feed #blab input.blog-submit:hover {
		cursor: pointer;
	}

	.content-feed textarea[name="comment"] {
		width: 100%;
	}

	.blog-submit {
		display: block;
		margin: 1em 0 0 0;
		padding: 0;
		text-align: right;
	}
	.blog-time {
		font-size: 85%;
		float: right;
		color: #999;
		margin-left: 2em;
		margin-right: 0.5em;
	}

/* Side blocks
--------------------------------------------- */
	.content-feed .sidebox {
		margin-bottom: 2em;
		margin-top: 1em;
	}
	.content-feed .sidebox h4 a.hlink,
	.content-feed .sidebox h4 a.hlink:hover {
		border: none;
		color: #333;
	}
	.content-feed .sidebox p,
	.sidebox p {
		margin-top: 0;
		padding: 0.5em;
	}
	.sidebox img {
		height: 1em;
	}
	.content-feed .sidebox p.editing {
		padding-top: 0;
	}
	.content-feed .sidebox h4 span,
	#hubForm .infofeed h4 span {
		float: right;
		font-weight: normal;
		font-size: 85%;
	}

/* News feed
--------------------------------------------- */
	/*.infofeed h4, .sumup {
		padding: 0.3em 0.5em;
		background: #ededed;
		border-top: 1px solid #cccccc;
	}
	.infofeed .confirmaction {
		font-size: 85%;
		padding-top: 0;
	}
	.infofeed .confirmaction p {
		text-align: center;
	}*/

/* Preview net
--------------------------------------------- */
	.photos {
		/* Prevent vertical gaps */
		line-height: 0;
		-webkit-column-count: 5;
		-webkit-column-gap: 0px;
		-moz-column-count: 5;
		-moz-column-gap: 0px;
		column-count: 5;
		column-gap: 0px;
		margin-top: 1.5em;
		overflow: hidden;
		background: #e4ecee;
		*display: none; /* doesn't work in IE <10 */
		border: 5px solid #e4ecee;
	}
	.photos img {
		/* Just in case there are inline attributes */
		width: auto !important;
		height: 100% !important;
	}
	.photos span {
		width: 100% !important;
		min-width: 100px;
		min-height: 100px;
		height: auto;
		display: inline-block;
		background-size: cover !important;
	}
	.photos.grid4 {
		-moz-column-count:    4;
		-webkit-column-count: 4;
		column-count:         4;
	}
	.photos.grid5 {
		-moz-column-count:    5;
		-webkit-column-count: 5;
		column-count:         5;
	}
	.photos.grid1 {
		-moz-column-count:    1;
		-webkit-column-count: 1;
		column-count:         1;
	}
	.photos.grid2 {
		-moz-column-count:    2;
		-webkit-column-count: 2;
		column-count:         2;
	}
	.photos.grid3 {
		-moz-column-count:    3;
		-webkit-column-count: 3;
		column-count:         3;
	}
	@media (max-width: 800px) {
		.photos.grid4 {
			-moz-column-count:    2;
			-webkit-column-count: 2;
			column-count:         2;
		}
	}

/* Comment Form */
	.activity .commentform {
		margin: 0;
		padding: 0 1.61803399em 1.61803399em 1.61803399em;
		border: none;
	}
	.activity .addcomment {
		background-color: #f9f9f9;
		padding: 1.61803399em;
	}
	.activity .commentform fieldset {
		border: none;
		margin: 0;
		padding: 0;
	}
	.activity .commentform label {
		padding: 0;
		margin: 0;
		display: block;
	}
	.activity .commentform .focused textarea {
		height: 100px;
	}