/**
 * @package    hubzero-cms
 * @copyright  Copyright 2005-2019 HUBzero Foundation, LLC.
 * @license    http://opensource.org/licenses/MIT MIT
 */

/* Intro */
	#introduction:after {
		content: "\f042";
	}

	.filter-options select {
		margin-right: 1em;
	}
	.group-list {
		overflow: hidden;
		margin: 1em 0 0 0;
	}
	.group-list .logo {
		float: left;
		max-width: 30px;
		padding: 3px;
		overflow: hidden;
	}
	.group-list .logo img {
		width: 100%;
		-webkit-border-radius: 1px;
		   -moz-border-radius: 1px;
		        border-radius: 1px;
		-webkit-box-shadow: 0 0 1px #000;
		   -moz-box-shadow: 0 0 1px #000;
		        box-shadow: 0 0 1px #000;
	}
	.group-list .details {
	}
	.group-list .details-w-logo {
		margin-left: 45px;
	}
	.group-list .details h3,
	.group-list .details-w-logo h3 {
		margin: 5px 0 0 0 !important;
	}
	.group-list .status {
		font-size: 90%;
		line-height: 1;
		font-weight: bold;
		display: inline-block;
		background-color: #6a0;
		-webkit-border-radius: 0.25em;
		   -moz-border-radius: 0.25em;
		        border-radius: 0.25em;
		margin: 3px 0 0 0;
		padding: 0.2em 0.4em;
		color: #fff;
		white-space: nowrap;
	}
	.group-list .manager {
		background-color: #ff1177;
	}
	.group-list .not-published {
		background-color: #aaa;
	}

/* Browse */
	.order-options a:before {
		content: "\2193";
		font-family: "Fontcons";
		margin-right: 0.2em;
	}
	.order-options a.desc:before {
		content: "\2191";
	}
	.container .js li {
		display: none;
	}
	.container .js li.option-select {
		display: block;
	}
	/* Entries */
	.groups-container {
		margin-top: 30px;
		display: flex;
		flex-wrap: wrap;
	}
	.groups-container:before,
	.groups-container:after {
		content: "";
		display: table;
		line-height: 0;
		clear: left;
	}
	.groups-container * {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.groups-container .group {
		display: block;
		display: flex;
		margin-bottom: 2em;
		background: #fff;
		position: relative;
		width: 100%;
	}
	.groups-container .group .group-contents {
		flex: 0 1 auto;
		width: 100%;
		display: flex;
		flex-direction: column;
	}
	.groups-container .group.notpublished,
	.groups-container .group.inactive {
		background: #f1f1f1;
	}
	.groups-container .group-contents {
		border: 1px solid rgba(0, 0, 0, 0.1);
		transition: all 0.3s ease;
	}
	.groups-container .group-contents:hover {
		border: 1px solid rgba(0, 0, 0, 0.3);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	}
	.groups-container .group-contents:hover .user-actions {
		opacity: 1;
	}
	.groups-container .group-details {
		padding: 1em;
		height: 6.7em;
		text-align: center;
		overflow: hidden;
	}
	.firefox .groups-container .group-details {
		height: 6.9em;
	}
	.groups-container img {
		height: 100%;
	}
	.groups-container .group-identity {
		display: block;
		overflow: hidden;
		border: none;
		position: relative;
		background: #f1f1f1;
		text-align: center;
		width: 80px;
		height: 80px;
		margin: 1.5em auto 0 auto;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
	}
	.groups-container .group-identity:hover {
		border: none;
	}
	.groups-container .group-identity>span {
		display: block;
		color: transparent;
		overflow: hidden;
	}
	.groups-container .group-identity>span:after {
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		content: "\f042";
		font-family: "Fontcons";
		font-size: 7em;
		line-height: 1.3em;
		color: #e1e1e1;
	}
	.groups-container .group-alias {
		color: #aaa;
		display: block;
		font-size: 85%;
	}
	/* Group member status */
	.group-membership-status {
		border: 1px solid #ddd;
		background-color: #fff;
		color: #fff;
		padding: 0.1em 0.6em;
		text-transform: uppercase;
		border-radius: 0.25em;
		font-size: 0.75em;
		letter-spacing: 0.1em;
		display: block;
		position: absolute;
		top: 1rem;
		right: -0.3em;
	}
	.group-membership-status.member {
		border-color: #66AA00;
		color: #66AA00;
	}
	.group-membership-status.manager {
		border-color: #ff1177;
		color: #ff1177;
	}
	.group-membership-status.pending {
		border-color: #AA3300;
		color: #AA3300;
	}
	.group-membership-status.invitee {
		border-color: #aaaaaa;
		color: #aaaaaa;
	}
	/* Metadata */
	.group-meta {
		background-color: rgba(0, 0, 0, 0.02);
		padding: 1em;
		color: #aaa;
		text-align: center;
		font-size: 85%;
		min-height: 6em;
	}
	.group-meta span {
		color: #666;
		display: block;
	}
	/* User actions */
	.groups-container .user-actions {
		font-size: 1.4em;
		width: 1em;
		position: absolute;
		top: 1em;
		left: 1em;
		opacity: 0.5;
		-webkit-transition: opacity 0.2s ease;
		-moz-transition: opacity 0.2s ease;
		transition: opacity 0.2s ease;
	}
	.groups-container .user-actions a {
		display: block;
		width: 1em;
		height: 1em;
		overflow: hidden;
		border: none;
		margin: 0 0 0.5em 0;
		color: #ccc;
		background: transparent;
		padding: 0;
	}
	.groups-container .user-actions a:hover {
		color: #333;
	}
	.groups-container .user-actions .manage:before {
		font-family: "Fontcons";
		content: "\f007";
	}
	.groups-container .user-actions .customize:before {
		font-family: "Fontcons";
		content: "\2699";
	}
	.groups-container .user-actions .cancel:before {
		font-family: "Fontcons";
		content: "\2716";
	}
	.groups-container .user-actions .accept:before {
		font-family: "Fontcons";
		content: "\2714";
	}
	.groups-container .user-actions .delete:before {
		font-family: "Fontcons";
		content: "\f014";
	}
	.groups-container .user-actions a:before {
		margin-right: 2em;
	}

/* No results */
	.groups-container .results-none {
		max-width: 30em;
		margin: 90px auto;
		padding: 5em 0 0 0;
		text-align: center;
		position: relative;
	}
	.groups-container .results-none p {
		font-size: 1.5em;
		line-height: 1.8em;
		font-weight: 300;
		margin: 0 0 2em 0;
	}
	.groups-container .results-none:before {
		position: absolute;
		top: 0px;
		left: 50%;
		font-size: 5em;
		margin-left: -0.5em;
		content: "\2298";
		font-family: "Fontcons";
		color: rgba(0, 0, 0, 0.2);
	}

@media (min-width: 40em) {
	.groups-container .group {
		float: left;
		width: 48.38709677419355%;
		margin-left: 3%;
	}
	.groups-container .group:first-child,
	.groups-container .group:nth-child(2n+1) {
		margin-left: 0;
	}
}
@media (min-width: 50em) {
	.groups-container .group,
	.groups-container .group:nth-child(2n+1) {
		width: 31.18279569892473%;
		margin-left: 3%;
	}
	.groups-container .group:nth-child(3n+1) {
		margin-left: 0;
	}
}
@media (min-width: 80em) {
	.groups-container .group,
	.groups-container .group:nth-child(2n+1),
	.groups-container .group:nth-child(3n+1) {
		width: 22.58064516129032%;
		margin-left: 3%;
	}
	.groups-container .group:nth-child(4n+1) {
		margin-left: 0;
	}
}

/* View */
	.com_groups .innerwrap {
		position: static;
	}

	#page_container {
		margin: 0;
		padding: 0;
		background: #f9f9f9;
	}
	#page_sidebar {
		background: #333;
	}

	#page_header {
		padding: 30px;
		margin: 0;
		background: #fff;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
		position: static;
	}
	#content-header dl dt,
	#content-header dl dd {
		display: inline;
		margin: 0;
		padding: 0;
	}
	#content-header dl {
		margin-top: 0.5em;
	}
	#content-header dl dt:after {
		content: ": ";
	}
	#content-header dl dt {
		font-weight: bold;
		margin-right: 0.2em;
	}
	#content-header dl dd {
		margin-right: 2em;
	}

	#page_options + #page_header {
		margin-right: 0;
	}
	#page_identity {
		display: none;
		position: relative;
	}
	#page_identity a {
		display: block;
		text-align: center;
		border: none;
	}
	#page_identity a:hover { 
		border: none;
	}
	#page_identity img {
		width: 100%;
		max-width: 100%;
		max-height: 300px;
	}
	#page_content {
		margin: 0;
		padding: 30px;
	}
	#page_content section.section {
		padding: 0;
	}

	#group_options {
		list-style: none;
		margin: 0;
		padding: 0;
		background: rgba(255, 255, 255, 0.1);
		padding: 1em 30px;
	}
	#group_options>li {
		text-align: center;
	}
	#group_options .btn {
		border-color: #ccc;
		border-color: rgba(255, 255, 255, 0.7);
		color: #ccc;
		color: rgba(255, 255, 255, 0.7);
		display: table-cell;
	}
	#group_options .btn-group span.dropdown-toggle::before,
	#group_options .btn .caret {
		border-top: 4px solid #fff;
		border-top: 4px solid rgba(255, 255, 255, 0.7);
	}
	#group_options span.btn {
		width: 3em;
	}
	#group_options .btn-group {
		display: table;
		width: 100%;
		text-align: left;
	}

	#page_menu {
		list-style: none;
		margin: 0;
		padding: 0;
		border-top: 1px solid #222;
	}
	#page_menu li {
		position: relative;
		margin: 0;
		padding: 0;
		border-bottom: 1px solid #222;
	}
	#page_menu li ul:after,
	#page_menu li ul li .page:before {
		background: #222;
	}
	#page_menu li:first-child {
		border-top: none;
	}
	#page_menu li a,
	#page_menu li>span,
	#page_menu li .disabled {
		color: #aaa;
		position: relative;
		display: block;
		padding: 0.75em 2em 0.75em 4em;
		border: none;
	}
	#page_menu li li a,
	#page_menu li li span {
		padding: 0.4em;
	}
	#page_menu li a:before,
	#page_menu li a:after,
	#page_menu li span:before,
	#page_menu li span:after {
		content: "";
		position: absolute;
		left: 1.8em;
		top: 0.6em;
		width: 1em;
		height: 1em;
		font-size: 1.2em;
		font-family: 'Fontcons';
		-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
		filter: alpha(opacity=100);
		opacity: 1;
		background: none;
		speak: none;
		font-style: normal;
		font-weight: normal;
		text-align: center;
	}
	#page_menu li a:before,
	#page_menu li span:before {
		content: attr(data-icon);
		color: #ccc;
	}
	#page_menu li a:hover {
		border: none;
		background: rgba(0, 0, 0, 0.35);
		color: #fff;
	}
	#page_menu li a:hover:before {
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
		filter: alpha(opacity=100);
		opacity: 1;
	}
	#page_menu li.active {
		color: #eee;
	}
	#page_menu li.active>a {
		background: #f9f9f9;
		color: #222;
		font-weight: 500;
	}
	#page_menu li.active>a:before {
		/*color: #FFF;*/
		color: #222;
	}
	#page_menu li.active>a:hover {
		border: none;
	}
	#page_menu li.active:after {
		content: "";
		display: none;
	}
	#page_menu li.protected:after,
	#page_menu li span.meta {
		position: absolute;
		right: 1em;
		top: 0.75em;
		margin: 0;
	}
	#page_menu li.protected {
		-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=90)";
		filter: alpha(opacity=90);
		opacity: 0.9;
	}
	#page_menu li.protected:after {
		content: "\f023";
		position: absolute;
		right: 1em;
		top: 0.6em;
		width: 1em;
		height: 1em;
		font-size: 1.2em;
		font-family: 'Fontcons';
		color: #999;
		-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=90)";
		filter: alpha(opacity=90);
		opacity: 0.9;
	}
	#page_menu li .meta .count {
		background: #555;
		background: rgba(255, 255, 255, 0.2);
		color: #aaa;
		font-size: 0.9em;
		line-height: 1.2;
		padding: 0.2em 0.4em;
		border-radius: 0.125em;
	}
	#page_menu li.active .meta .count {
		background: #ddd;
	}

	#page_menu li ul {
		list-style: none;
		margin: 0 0 0 30px;
		position: relative;
	}
	#page_menu li ul:after {
		content: "";
		width: 1px;
		background: #EEE;
		background: rgba(0, 0, 0, 0.35);
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
	}
	#page_menu li ul li {
		margin: 0;
		padding: 0;
		border: none;
	}
	#page_menu li ul li:first-child {
		border-top: none;
	}
	#page_menu li ul li:last-child {
		border-bottom: none;
	}
	#page_menu li ul li.protected {
		padding-right: 30px;
	}
	#page_menu li ul li.protected:after {
		top: 3px;
	}
	#page_menu li ul li .page:before {
		content: "";
		width: 0.8em;
		height: 1px;
		background: #EEE;
		background: rgba(0, 0, 0, 0.35);
		position: absolute;
		top: 45%;
		left: 0;
	}
	/*#page_menu li ul li a {
		padding-left: 20px;
	}*/
	#page_menu li.active ul li a {
		background: transparent;
	}
	#page_menu li ul li.active {
		background: none;
		font-weight: normal;
	}
	#page_menu li ul li.active > a {
		color: #555;
		font-weight: 500;
		background: transparent;
	}
	#page_menu li ul li.active a:before {
		color: #555;
	}
	#page_menu li ul li.active:after {
		background: none;
	}

	#page_menu li.option-select {
		padding: 0.75em 2em;
	}
	#page_menu.js li {
		display: none;
	}
	#page_menu.js li.option-select,
	#page_menu.js li.option-select select {
		display: block;
	}
	#page_menu.js li.option-select select {
		width: 100%;
	}

	.dropdown-menu li a:before {
		font-family: 'Fontcons';
		padding-right: 0.2em;
	}
	.dropdown-menu li a.group-invite:before    { content: '\271A'; }
	.dropdown-menu li a.group-edit:before      { content: '\2699'; }
	.dropdown-menu li a.group-customize:before { content: '\270E'; }
	.dropdown-menu li a.group-pages:before     { content: '\f016'; }
	.dropdown-menu li a.group-cancel:before    { content: '\2298'; }
	.dropdown-menu li a.group-delete:before    { content: '\f057'; }
	.dropdown-menu li a.logout:before          { content: '\f08b'; }

	.section-header {
		display: none;
	}

/* Group Pages */
	.group-page {
		position: relative;
		padding: 0 0 50px 0;
	}
	.group-page-toolbar {
		border-top: 1px solid #efefef;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 3px 0;
	}
	.group-page-toolbar span {
		color: #aaa;
		font-size: 11px;
	}
	.group-page-toolbar span a {
		color: #aaa;
		border: none;
	}
	.group-page-toolbar span a:hover {
		color: #555;
		border-bottom: 1px dotted #aaa;
	}
	.group-page-toolbar .modified {
		margin-left: 10px;
	}
	.group-page-toolbar .page-controls,
	.group-page-toolbar .page-controls > li {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	.page-controls a {
		display: block;
		float: right;
		margin: 0 0 0 5px;
		border: none;
		width: 20px;
		height: 20px;
	}
	.page-controls a span {
		position: relative;
		display: inline-block;
		width: 20px;
		height: 20px;
		color: transparent;
		background: transparent;
		-webkit-transition: all 0.1s ease-in-out;
	}
	.page-controls a span:before {
		content: '';
		font-family: 'Fontcons';
		color: #aaa;
		text-align: center;
		position: absolute;
		top: 0px;
		left: 0;
		right: 0;
	}
	.group-page-toolbar .page-controls .edit span:before { 
		content: '\270E';
	}
	.group-page-toolbar .page-controls .home span:before { 
		content: '\2302';
	}
	.group-page-toolbar .page-controls .override span {
		right: 2px;
	}
	.group-page-toolbar .page-controls .override span:before { 
		content: '\f059';
	}
	.group-page-toolbar .page-controls .category {
		border: 1px solid #000;
		box-shadow: inset 0 0 1px #000;
		width: 10px;
		height: 10px;
		margin-top: 4px;
	}

	.group-page-manager {
		/*position: relative;*/
	}
	.group-page-manager #hubForm {
		/* border: 1px solid #666; */
		z-index: 554;
	}
	.group-page-manager #hubForm ul {
		margin: auto;
	}
	.group-page-manager #hubForm p {
		margin: auto;
	}
	.group-page-manager #hubForm fieldset {
		padding: 0;
		margin: 0;
		border: 1px solid #ccc;
	}
	.group-page-manager #hubForm legend {
		float: none;
		margin: 0;
	}

	/* Page Manager Tabs */
	.group-page-manager .tabs {
		margin: 0;
		padding: 0;
		list-style: none;
		display: none;
		z-index: 555;
		position: relative;
	}
	.group-page-manager .tabs li {
		float: left;
		margin: 0 2px 0 0;
		padding: 0;
	}
	.group-page-manager .tabs li a {
		display: block;
		position: relative;
		border-bottom: none;
		padding: 10px 20px;
		font-size: 12px;
		color: #aaa;
		border: 1px solid #ccc;
		border-bottom: none;
		top: 2px;
	}
	.group-page-manager .tabs li a:hover {
		background: #efefef;
	}
	.group-page-manager .tabs li a.current {
		top: 2px;
		border-bottom: 1px solid #efefef;
		background: #efefef;
		font-weight: bold;
		color: #666;
	}

	/* Toolbar */
	.group-page-manager #hubForm .toolbar {
		background: #efefef;
		margin: 0;
		padding: 0;
		list-style: none;
		position: relative;
		height: 50px;
	}
	.group-page-manager #hubForm .toolbar li {
		margin: 0;
		padding: 0;
	}
	.group-page-manager #hubForm .toolbar .new {
		position: absolute;
		top: 10px;
		left: 10px;
	}
	.group-page-manager #hubForm .toolbar .search {
		position: absolute;
		top: 10px;
		right: 10px;
		left: 10px;
		margin-left: 360px;
	}
	.group-page-manager #hubForm .toolbar .filter {
		position: absolute;
		top: 11px;
		bottom: 13px;
		left: 120px;
		padding-left: 8px;
		border-left: 1px solid #aaa;
	}
	.group-page-manager #hubForm .toolbar .filter-search-divider {
		position: absolute;
		top: 15px;
		left: 340px;
		font-weight: bold;
		font-size: 14px;
	}
	.group-page-manager #hubForm .toolbar .filter select,
	.group-page-manager #hubForm .toolbar .filter .fs-dropdown {
		width: 200px;
	}
	.group-page-manager #hubForm .toolbar li input[type=text] {
		font-size: 11px;
	}
	.group-page-manager #hubForm .toolbar-modules .filter {
		left: 135px;
	}
	.group-page-manager #hubForm .toolbar-modules .filter-search-divider {
		left: 355px;
	}
	.group-page-manager #hubForm .toolbar-modules .search {
		margin-left: 375px;
	}

	/* Save/Reset Page Order */
	.group-page-manager .page-order-actions {
		position: absolute;
		top: 5px;
		right: 0;
		z-index: 556;
	}
	.group-page-manager .page-order-actions button {
		margin-left: 5px
	}

	/* Fixed page manager toolbar */
	.group-page-manager.pinned .tabs {
		position: fixed;
		top: 0;
		background: #FFF;
	}
	.group-page-manager.pinned #hubForm .toolbar {
		position: fixed;
		top: 44px;
		z-index: 9999;
		background: #efefef;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}
	.group-page-manager.pinned .item-list {
		margin-top: 94px !important;
	}

/* List */
	.item-list {
		list-style: none;
		margin: 0;
	}
	.item-list > li {
		margin: 0 !important;
		padding: 0;
	}
	.item-list .ui-sortable-placeholder {
		border:  2px dashed #ccc !important;
		visibility: visible !important;
		min-height: 70px;
	}
	.item-list .mjs-nestedSortable-error {
		background: #F00;
		background: rgba(255,0,0,0.1);
	}
	.item-list ul {
		margin: 0 0 0 38px !important;
		padding: 0;
		list-style: none;
		position: relative;
	}
	.item-list ul:first-of-type:after {
		content: "";
		width: 1px;
		background: #EEE;
		background: rgba(0, 0, 0, 0.1);
		position: absolute;
		top: 0;
		left: -18px;
		bottom: 36px;
		bottom: 0;
	}
	.item-list ul li {
		padding: 0;
		margin: 0 !important;
		position: relative;
	}
	.item-list ul li:after {
		content: "";
		width: 16px;
		height: 1px;
		background: #EEE;
		background: rgba(0, 0, 0, 0.1);
		position: absolute;
		top: 35px;
		left: -17px;
	}
	.item-list .not-approved {
		background: #faf4f4;
	}
	.item-list .item-container {
		margin: -1px 0 0 0;
		padding: 15px 0 15px 55px;
		position: relative;
		min-height: 40px;
		background: #FFF;
		border-top: 1px solid #efefef;
		border-bottom: 1px solid #efefef;
	}
	.item-list .item-mover {
		position: absolute;
		top:0;
		left: 0;
		width: 35px;
		height: 70px;
		cursor: move;
		border-right: 1px solid #efefef;
	}
	.item-list .item-mover:before {
		content: '';
		position: absolute;
		top: 50%;
		left: 50%;
		margin-top: -7px;
		margin-left: -10px;
		width: 20px;
		height: 15px;
		opacity: 0.5;
		background: url('/core/components/com_groups/site/assets/img/grabber.png') no-repeat 0 0;
	}
	.item-list .item-mover:hover {
		background: #efefef;
	}
	.item-list .item-mover:hover:before {
		opacity: 1;
	}
	.searching .item-list .item-mover,
	.filtering .item-list .item-mover {
		pointer-events: none;
		cursor: not-allowed
	}
	.item-list.pages .item-container {
		padding-left: 90px;
		border-left: 3px solid #ccc;
	}
	.item-list .item-container:before {
		content: '\f0f5';
		font-family: 'Fontcons';
		font-size: 30px;
		color: #ddd;
		position: absolute;
		top: 25px;
		left: 50px;
	}
	.item-list .root > .item-container {
		padding-left: 55px;
		border-left: none;
	}
	.item-list .root > .item-container:before {
		content: '\2302';
		color: #A1A91B;
	}
	.item-list .root > .item-container:before {
		left: 15px;
	}
	.item-list li.no-results {
		color: #aaa;
		font-style: italic;
		padding: 0;
		margin: 20px !important;
		min-height: inherit;
	}
	.item-list li.no-results p {
		margin: 0;
		padding: 0;
	}
	.item-list li.no-results:before {
		display: none;
	}
	.item-list .item-title {
		font-weight: bold;
	}
	.item-list .item-sub {
		color: #aaa;
		font-weight: normal;
		font-size: 11px;
	}
	.item-list .item-approved {
		position: absolute;
		top: 25px;
		right: 500px;
		width: 120px;
		height: 15px;
		color: #ab1111;
		text-align: center;
		font-size: 11px;
		font-weight: bold;
		text-transform: uppercase;
	}
	.item-list .item-state {
		position: absolute;
		top: 1em;
		right: 250px;
		width: 1em;
		height: 1em;
		font-size: 1.8em;
	}
	.item-list .item-state .unpublished,
	.item-list .item-state .published {
		display: block;
		position: relative;
		color: transparent;
		text-decoration: none;
		border: none;
	}
	.item-list .item-state .unpublished:before,
	.item-list .item-state .published:before {
		content: '\2298';
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		font-family: 'Fontcons';
		text-align: center;
		color: #ca1b1b;
	}
	.item-list .item-state .published:before {
		content: '\2714';
		color: #1d8f0e;
	}
	.item-list .item-state .unpublished:hover:before {
		color: #ab1717;
	}
	.item-list .item-state .published:hover:before {
		color: #166c0b;
	}
	.item-list .item-preview {
		position: absolute;
		top: 1em;
		right: 180px;
		width: 1em;
		height: 1em;
		font-size: 1.8em;
	}
	.item-list .item-preview a { 
		display: block;
		position: relative;
		color: transparent;
		text-decoration: none;
		border: none;
	}
	.item-list .item-preview a:before {
		content: '\f002';
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		font-family: 'Fontcons';
		text-align: center;
		color: #ccc;
	}
	.item-list .item-preview a:hover:before {
		color: #aaa;
	}
	.item-list .item-controls {
		position: absolute;
		top: 20px;
		right: 20px;
	}
	.item-list .item-controls .dropdown-menu {
		margin: 0 !important;
	}
	.item-list .item-controls .dropdown-menu:after {
		display: none;
	}
	.item-list .item-controls .dropdown-menu li {
		margin: 0.5em 0 !important;
	}
	.item-list .item-controls .dropdown-menu li:after {
		display: none;
	}
	.item-list .item-controls .dropdown-menu li a {
		color: #333;
	}
	.item-list .item-controls .dropdown-menu:before,
	.group-page-controls .dropdown-menu:after {
		display: none;
	}
	.item-list .item-controls .dropdown-menu li a.icon-delete {
		color: #991111;
	}
	.item-list .item-controls .dropdown-menu li a:hover {
		color: #ffffff;
		text-decoration: none;
		background-color: #777;
	}

	/* Categories */
	.item-list.categories .item-container:before {
		content: '\f115';
		left: 15px;
	}
	.item-list .item-color {
		position: absolute;
		top: 25px;
		right: 400px;
		width: 25px;
		height: 25px;
		background: #F00;
		border: 1px solid #555;
	}
	/* Modules */
	.item-list.modules .item-container:before {
		content: '\f02f';
		left: 15px;
	}
	.item-list .item-position {
		position: absolute;
		top: 18px;
		right: 300px;
		width: 25px;
		height: 25px;
		font-weight: bold;
		line-height: 16px;
	}
	.item-list .item-position span {
		font-size: 0.7em;
		line-height: 0.7em;
		color: #aaa;
		text-transform: uppercase;
	}

	/* Loader */
	.item-list-loader {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0,0,0,0.8);
		display: none;
	}
	.item-list-loader:after {
		content: 'Reordering Pages...';
		position: absolute;
		top: 45%;
		left: 0;
		right: 0;
		font-size: 24px;
		font-weight: 100;
		color: #fff;
		text-align: center;
	}
	.pages.rebuilding .item-list-loader {
		display: block;
	}

/* Version Content */
	.version-content {
		padding: 10px;
		min-height: 200px;
	}
	.version-code {
		display: none
	}
	.version-code .diffs th {
		border: 1px solid #FFF;
		margin: 0;
		padding: 0.2em 0.8em;
		text-align: right;
		background-color: #EFEFEF;
		width: 30px
	}
	.version-code .diffs td {
		font-family: Consolas,Monaco,monospace;
		white-space: pre-wrap;
		width: 50%;
	}
	.version-code .diffs td[colspan] {
		width: auto;
	}
	.version-code .diffs td {
		border: 1px solid #FFF;
	}
	.version-code .diff-marker {
		width: 1em;
		background: #F9F9F9;
		text-align: center;
		display: none;
	}
	.version-code .diff-addedline {
		background-color: #E9FFE9;
	}
	.version-code .diff-addedline ins {
		background-color: #AFA;
		font-weight: bold;
		text-decoration: none;
	}
	.version-code .diff-deletedline {
		background-color: #FFE9E9;
	}
	.version-code .diff-deletedline del {
		background-color: #FAA;
		font-weight: bold;
		text-decoration: none;
	}

/* Page Categories */
	#field-category-color {
		position: relative;
		display: block;
		width: 150px !important;
		border-color: #ccc;
		border-right: 30px solid #ccc;
	}

/* Edit Group Page Styles */
	.floating-iframe-col {
		position: relative;
	}
	.floating-iframe-container {
		position: absolute;
		width: 100%;
		right: 0px;
		top: 0px;
	}
	.floating-iframe-toggle {
		position: absolute;
		top: 50px;
		left: 0;
		width: 20px;
		height: 30px;
		background: #efefef;
		border: none;
		margin-left: -20px;
		box-shadow: -2px 0 2px rgba(0,0,0,0.4);
	}
	.floating-iframe-toggle:before {
		content: '\2039';
		font-family: 'Fontcons';
		font-size: 18px;
		position: absolute;
		top: 5px;
		left: 0;
		bottom: 0;
		right: 0;
		color: #777;
		text-align: center;
	}
	.floating-iframe {
		width: 100%;
		min-height: 500px;
		max-height: 700px;
		margin-top: 0.7em;
		position: absolute;
		right: 0;
		box-shadow: 0 0 5px rgba(0,0,0,0.7);
	}
	.floating-iframe-container {
		-webkit-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-ms-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.floating-iframe-container.hovered {
		width: 101%;
	}
	.floating-iframe-container.opened {
		width: 320%;
	}
	.floating-iframe-toggle:hover {
		border: none;
	}
	.floating-iframe-toggle:hover:before {
		color: #444;
	}
	.floating-iframe-toggle.opened:before {
		content: '\203A';
	}

/* overview */
	.member_browser {
		overflow: hidden;
	}
	.member_browser .member {
		padding: 1em 0;
		margin: 0 0 1.5em 0;
		display: block;
		border: none;
		-webkit-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		-ms-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.member_browser .member:hover {
		border: none;
	}
	.member_browser .member:after {
		content: "";
		line-height: 0;
		display: table;
		clear: left;
	}
	.member_browser .member img {
		float: left;
		margin: 0 1em 0 0;
		width: 50px;
		height: 50px;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		-o-border-radius: 50%;
		border-radius: 50%;
	}
	.member_browser .member .name {
		font-size: 1.2em;
	}
	.member_browser .member .org {
		display: block;
		font-size: 0.9em;
		color: #777;
	}

	#hubForm #access {
		list-style: none;
		margin: 0;
		padding: 1em;
		background: #efefef;
	}
	.preview #access img {
		width: auto;
	}
	#hubForm #access li {
		font-size: 1.1em;
		color: #444;
		border-bottom: 1px dotted #ccc;
		overflow: hidden;
		margin: 0;
		padding: 0.7em 0;
		list-style: none;
	}
	#hubForm #access li select {
		float: right;
		width: auto;
	}

	#hubForm .field-wrap ul {
		list-style-type: none;
	}

	#page_notifications {
		margin: 0 30px;
	}

@media (min-width: 40em) {
	#page_identity {
		display: block;
		background-color: #fff;
	}
	#page_identity a,
	#page_identity img {
		max-width: 6em;
	}
	#page_identity a {
		min-width: 6em;
	}
	#page_container {
		display: table;
		table-layout: fixed;
	}
	#page_sidebar {
		display: table-cell;
		width: 6em;
		min-width: 6em;
		vertical-align: top;
	}
	#page_main {
		z-index: 555;
		display: table-cell;
		vertical-align: top;
		width: 100%;
	}
	#page_menu {
		margin: 0 0 30px 0;
	}
	#page_menu li a,
	#page_menu li .disabled {
		width: 1em;
		text-indent: -500em;
	}
	#page_menu li ul li a:after {
		content: "\f016";
		font-family: "Fontcons";
		text-indent: 0;
		left: 1em;
		top: 0.3em;
	}
	#page_menu li a:before,
	#page_menu li a:after,
	#page_menu li a.alrt,
	#page_menu li .disabled:before {
		text-indent: 0;
	}
	#page_menu.js li {
		display: block;
	}
	#page_menu.js li.option-select {
		display: none;
	}

	#group_options {
		padding: 0;
		display: block;
	}
	#group_options .btn {
		display: inline-block;
	}
	#group_options span.btn {
		width: auto;
	}
	#group_options a.btn {
		width: 3.5em;
		overflow: hidden;
	}
	#group_options a.btn:before {
		content: "\2699";
		font-family: "Fontcons";
		margin-right: 2em;
	}
}
@media (min-width: 50em) {
	#page_sidebar {
		width: 225px;
		min-width: 225px;
	}
	#page_identity a,
	#page_identity img {
		max-width: 225px;
	}
	#page_identity a {
		min-width: 150px;
		max-width: 225px;
		min-height: 100px;
	}
	#page_menu li a,
	#page_menu li .disabled {
		text-indent: 0;
		width: auto;
	}
	#page_menu li li a,
	#page_menu li li span {
		padding-left: 20px;
	}
	#page_menu li ul li a:after {
		content: "";
	}
	#page_menu li .meta {
		right: 2em;
	}
	.container .js li {
		display: block;
	}
	.container .js li.option-select {
		display: none;
	}

	#group_options {
		padding: 15px 30px 15px 30px;
	}
	#group_options a.btn {
		width: auto;
		overflow: auto;
	}
	#group_options a.btn:before {
		content: "";
		display: none;
	}

	.member_browser .member {
		float: left;
		width: 30%;
		padding: 1em 1.5%;
		margin-right: 3%;
		height: 9em;
		overflow-y: auto;
		text-overflow: ellipsis;
		border: 1px solid #eee;
		border: 1px solid rgba(0, 0, 0, 0.1);
		background: #fff;
	}
	.member_browser .member:hover {
		border: 1px solid #333;
	}
	.member_browser .member:after {
		content: "";
		line-height: 0;
		display: none;
		clear: none;
	}
}
@media (min-width: 70em) {
	#page_sidebar {
		width: 285px;
		min-width: 285px;
	}
	#page_menu li a,
	#page_menu li span.disabled {
		padding: 0.75em 2em 0.75em 6.5em;
	}
	#page_menu li a:before,
	#page_menu li span:before {
		left: 3.9em;
	}
	#page_menu li span.meta {
		padding: 0;
	}
	#page_menu li ul {
		margin: 0 0 0 60px;
	}
	#page_identity a,
	#page_identity img {
		max-width: 285px;
	}
	#page_header {
		padding: 30px 60px;
	}
	#page_options {
		right: 60px;
		list-style:none;
	}
	#page_content {
		padding: 30px 60px;
	}
	#group_options {
		padding: 15px 30px 15px 60px;
	}
	.member_browser .member {
		width: 23%;
		padding: 1em 1.5%;
		margin-right: 2%;
	}
}