:root {

  --marge:#006ba5;
  --leela:#675a95;
  --barbie:#e63478;

  --elsa:#9ac6dd;
  --ursula:#7e84ad;
  --peppa:#f79cbf;

  --maleficent:#9bc7a3;
  --belle:#f0e0a4;
  --patrick:#e5b0a7;

  --leelaRGB:103,90,149;
  --ursulaRGB:126,132,173;


  --fancygradient:linear-gradient(to top left, #ffffff99, #ffffff99 35%, transparent 75%), linear-gradient(20deg, #fe89bd 0%, #ffbca1 20%, #ffb6b6 37%, #fff0e9 85%);
  --fancygradientdarker:linear-gradient(to top left, #ffffffee, #ffffff22 40%, transparent 75%), linear-gradient(20deg, #fe89bd 0%, #ffbca1 20%, #ffb6b6 37%, #fff0e9 85%);
}

/*
—————————————————
Global
193-196-203
—————————————————
*/
html {
	color:#666;
	font:15px/1.4 cera-pro, sans-serif;
}
* {
	box-sizing:border-box;
}
p {
	margin-bottom:1em;
}
p.center {
	text-align:center;
}
strong {
	font-weight:bold;
}
h1 {
	font-size:1.8em;
	font-weight:500;
	line-height:1.1;
	margin-bottom:1.3em;
}
h1 small, span.job-number, a.job-number, .watch {
	display:inline-block;
	font-size:0.866rem;
	font-weight:normal;
	line-height:1.1;
	color:#888;
	background:#f2f2f3;
	border-radius:5px;
	padding:0.3em 0.5em;
	position:relative;
	margin-left:0.6em;
	letter-spacing:0;
}
a.job-number:hover {
	color:#808080;
	background:#ececed;
}
a.job-number:active {
	color:#777;
	background:#e7e7e8;
}
h1 + p.subheading {
	margin-top:-2.1em;
	margin-bottom:2.1em;
	color:#aaa;
}
.subheading a:hover {
	text-decoration:underline;
}
h1:last-child,
p:last-child {
	margin-bottom:0;
}
h2 {
	font-size:1.6em;
	font-weight:500;
	line-height:1.2;
	margin-bottom:1em;
	text-transform:lowercase;
}
h2.center {
	display:block;
	text-align:center;
	border:0;	
	padding:0;
}
h2.table-section {
	margin-bottom:0.2em;
	padding:0.2em 0.55em;
	border-radius:0.4em;
	color:#4987c3;
	background:#ecf2f9;
	border:0;
}
h1 .button,
h2 .button {
	font-weight:500;
	font-size:1rem;
	margin-left:1.2em;
	letter-spacing:0;
	vertical-align:top;
}
h3 {
	font-size:1.2em;
	margin-bottom:1em;
	font-weight:500;
}
h3 small {
	font-size:0.9rem;
	font-weight:normal;
	margin-left:0.2em;
}
h4 {
	text-transform:lowercase;
	font-weight:500;
	font-size:1.2em;
	margin-bottom:0.5em;
}
#fine-print {
	text-align:center;
	margin-top:3em;
	color:#999;
}
#fine-print li {
	display:inline-block;
	text-transform:lowercase;
}
#fine-print li:after {
	display:inline-block;
	width:1.5em;
	content:'\2022';	
}
#fine-print li:last-child:after {
	display:none;
}




/*
——————————————————
Containers
——————————————————
*/
#page-sidebar {
	position:fixed;
	top:0; left:0;
	width:4em;
	height:100%;
	background:#29292f;
	z-index:10;
}
#page-content {
	margin-left:4em;
	position:relative;
}
#page-content.home {
	margin-right:22em;
	xtransition:margin-right 300ms ease-in-out;
}

.activity-bar-closed .activity-bar {
	width:4em;
	padding:0;
}
.activity-bar-closed #page-content {
	margin-right:4em;
}






/*
—————————————————
Activity Bar
—————————————————
*/
.activity-bar {
	position:fixed;
	top:0; right:0;
	width:22em;
	height:100%;
	background:#fff;
	border-left:3px solid #eee;
	padding:3.5em 2em 2em 2em;
	overflow-y:auto;
	scrollbar-width:thin;
	xtransition:width 300ms ease-in-out;
}
.activity-bar .button-toggle {
	position:absolute;
	font-size:1.2em;
	top:0.5em; left:0.5em;
	width:2em;
	height:2em;
	line-height:2;
	text-align:center;
	cursor:pointer;
}
.activity-bar .button-toggle:before {
	font-family:fa-light;
	content:'\f340';
}
.activity-bar-closed .button-toggle {
	left:0;
	width:100%;
}
.activity-bar-closed .button-toggle:before {
	content:'\f344';
}
.activity-bar-closed .activity-bar {
	width:4em;
	padding:0;
}
.activity-bar-closed .activity-bar h3,
.activity-bar-closed .activity-bar div,
.activity-bar-closed .activity-bar ul {
	display:none;
}
.activity-bar-closed #content {
	margin-right:4em;
}
.activity-bar h3.divider {
	border-top:1px solid #ddd;
	padding:0 2rem;
	margin-left:-2rem;
	margin-right:-2rem;
	padding-top:1em;
}
.activity h5 {
	font-size:0.9375rem;
	margin-bottom:1.4em;
}
.activity h5 span {
	display:inline-block;
	border:1px solid #ccc;
	line-height:1.5em;
	border-radius:0.75em;
	padding:0 0.6em;
}
.activity ul {
	margin-bottom:1.7em;
}
.activity ul li:last-child {
	margin-bottom:0.5em;
}
.activity ul:last-child {
	margin-bottom:0;
}
ul.activity {
	margin-bottom:2.5em;
}
ul.activity:last-child {
	margin-bottom:0;
}
.activity li {
	position:relative;
	font-size:0.8125rem;
	margin-bottom:1.8em;
}
.activity .time {
	position:absolute;
	top:-1em; left:0;
	color:#bbb;
	font-size:0.875em;
	line-height:1;
}
.activity span.title {
	display:block;
}
.activity-text {
	display:block;
	padding:0.7em 1.2em 0.7em 3.2em;
	border-radius:0.5em;
	position:relative;
}
.activity-text:before {
	content:'\f075';
	font-family:fa-solid;
	position:absolute;
	top:calc(50% - 1em); left:0.7em;
	line-height:2;
	width:2em;
	text-align:center;
	border-radius:1em;
	font-size:0.9em;
}


.activity li.waiting-for-me .activity-text,
.activity li.feedback .activity-text {
	color:#7bc087;
	background:#8cc6960e;
}
.activity li.comments .activity-text {
	color:var(--barbie);
    background:#e634780e;
}
.activity li.status-change .activity-text {
    color:#0f81c2;
    background:#0f81c20e;
}
.activity li.board-approval .activity-text {
	color:#848cc9;
	background:#edeff7;
}
 .activity-bar li.comments:after {
	display:none;
}
 .activity-bar .comment {
	padding-left:0;
	border-left:0;
}

.activity li.waiting-for-me .activity-text:before,
.activity li.feedback .activity-text:before {
	content:'\f004';
	background:#8cc6961c;
}
.activity li.waiting-approval .activity-text:before {
	content:'\f017';
}
.activity li.waiting-assigned .activity-text:before {
	content:'\f007';
}

.activity li.comments .activity-text:before {
	content:'\f075';
    background:#e634781c;
}
.activity li.status-change .activity-text:before {
	content:'\f00c';
    background:#0f81c21c;
}
.activity li.board-approval .activity-text:before {
	content:'\f00c';
	color:#fff;
	background:#848cc9;
}


.activity li.waiting-for-me a:hover .activity-text,
.activity li.feedback a:hover .activity-text {
	background:#8cc69614;
}
.activity li.comments a:hover .activity-text {
    background:#e6347814;
}
.activity li.status-change a:hover .activity-text {
    background:#0f81c214;
}
.activity li.board-approval a:hover .activity-text {
    background:#7e84ad14;
}

.activity-text .rating {
	display:inline-block;
}






/*
——————————————————
Home Projects
——————————————————
*/
.home-actions {
	margin-bottom:3em;
}
.home-actions a {
	display:inline-block;
	margin-right:1em;
	width:12em;
	height:6em;
	border-radius:0.5em;
	background:var(--fancygradientdarker);
	text-transform:lowercase;
	position:relative;
}
.home-actions a:before {
	content:'+';
	position:absolute;
	top:0.2rem; left:0.8rem;
	font-size:3em;
	line-height:1;
	color:#d68f9a;
}
.home-actions a + a {
	filter:hue-rotate(215deg);
}
.home-actions a + a + a {
	filter:hue-rotate(290deg);
}
.home-actions a + a + a + a {
	filter:hue-rotate(140deg);
}
.home-actions a span {
	position:absolute;
	bottom:1rem; left:1rem;
	color:#fff;
    line-height:1;
    font-size:1.3em;
}

.home-projects-wrapper {
	margin-bottom:3em;
}
.home-projects-wrapper:last-child {
	margin-bottom:0;
}
.home-projects {
	width:calc(100% + 2em);
	margin-right:-2em;
	margin-bottom:3em;
}
.home-projects:last-child {
	margin-bottom:0;
}
.home-projects .tile {
	float:left;
	width:calc(100% / 3 - 2em);
	margin:0 2em 2em 0;
}
@media only screen and (max-width:1600px) {
	.home-projects .tile {
		width:calc(100% / 2 - 2em);
	}
}
.home-projects h2 a {
	display:inline-block;
	font-size:0.9rem;
	margin-left:1.5em;
	line-height:1.8em;
	background:rgba(193 196 203 / 55%);
	padding:0 1em;
	border-radius:2em;
	vertical-align:bottom;
}
.home-projects h4 {
	text-transform:none;
	margin:0;
}
.home-projects .tile a {
	display:block;
	height:20em;
	position:relative;
	overflow:hidden;
	color:inherit;
	background:#fff;
	border-radius:0.5em;
	transition:border-color 150ms;
	border:1px solid #dadbdd;
}
.home-projects-completed .tile {
	width:calc(33.333% - 2.5em);
}
.home-projects .image {
	position:absolute;
	top:0; left:0;
	width:calc(50% - 1.6rem);
	height:100%;
	padding:1.3em;
	display:flex;
	justify-content:center;
	align-items:center;
	background:rgb(193 196 203 / 23%);
	transition:background-color 150ms;
}
.home-projects .tile-textonly {
	filter:hue-rotate(215deg);
}
.home-projects .tile-textonly a,
.home-projects .tile-textonly .text {
	border-color:#f3bfc7 !important;
}
.home-projects .tile-textonly .image {
	background:var(--fancygradientdarker) !important;
	justify-content:left;
}
.home-projects .tile-textonly .image span {
	font-size:2em;
	text-transform:lowercase;
	color:#fff;
	line-height:1.1;
}
.home-projects .tile a:hover {
	border-color:#cacbcd;
}
.home-projects .tile a:hover .image {
	background:rgb(193 196 203 / 34%);
}
.home-projects .image img {
	border-radius:6px;
	max-width:100%;
	max-height:100%;
}
.home-projects .image img.brand-logo {
	max-width:6.5em;
	max-height:5em;
	mix-blend-mode:multiply;
	border-radius:0;
}
.home-projects .text {
	position:absolute;
	top:0; left:calc(50% - 1.6rem);
	width:calc(50% + 1.6rem);
	height:100%;
	padding:2rem;
	border-left:1px solid #dadbdd;
}

.home-projects h3 {
	line-height:1.2;
}
.home-projects p {
	margin-top:1em;
}
.home-projects .comments {
	position:absolute;
	bottom:1.6em; right:1.6em;
}
.home-projects .comments:before {
	font-family:fa-light;
	content:'\f075';
	margin-right:0.3em;
}
.home-projects .comments-recent:before {
    color:var(--barbie);
	font-family:fa-solid;
}
.home-projects .progress {
	position:absolute;
	bottom:4rem; left:50%;
	width:calc(50% - 1.6rem);
}
.home-projects .progress-bar {
	height:0.4em;
	background:rgb(193 196 203 / 40%);
	border-radius:0.2em;
}
.home-projects .progress-bar span {
	display:block;
	height:100%;
	background:var(--barbie);
	border-radius:0.2em;
}
.home-projects .progress-bar-completed span {
	background:#61c391;
}
.home-projects .progress-score {
	font-size:0.8666rem;
	margin-top:0.3em;
}

.home-projects .status-lozenge {
	color:#fff;
	padding:0 0.85em;
	line-height:2;
	border-radius:2em;
	font-size:0.9em;
	font-weight:500;
	text-transform:lowercase;
	position:absolute;
	bottom:3.6rem;
	left:2rem;
}
.home-projects .status-light-blue {
	background:var(--elsa);
}
.home-projects .status-blue {
	background:var(--marge);
}
.home-projects .status-green {
	background:var(--maleficent);
}
.home-projects .status-pink {
	background:var(--barbie);
}
.home-projects .status-purple {
	background:var(--leela);
}

.home-projects .status-date {
	position:absolute;
	bottom:2rem;
	left:2rem;
	font:italic 0.9em/1 'Segoe UI', 'Gill Sans', 'Trebuchet MS', sans-serif;
}

.home-projects .milestones span {
	font-size:0.85em;
	display:block;
	color:#ddd;
}
.home-projects .milestones span:before {
	font-family:fa-solid;
	content:'\f00c';
	display:inline-block;
	width:1.3em;
}
.home-projects .milestones span.complete {
	color:#333;
}
.home-projects .milestones span.complete:before {
	color:var(--elsa);
	content:'\f00c';
}













@media only screen and (max-width:1800px) {
	.home-projects .tile a {
		height:18.5em;
	}
	.home-projects .text {
		padding:1.6rem;
	}
	.home-projects .status-lozenge {
		bottom:3.2rem;
		left:1.6rem;
	}
	.home-projects .status-date {
		bottom:1.6rem;
		left:1.6rem;
	}
}


.home-projects-completed .tile a {
	height:16em;
}
.home-projects-thumb {
	width:calc(100% + 1.6em);
	margin-right:-1.6em;
}
.home-projects-thumb .tile {
	width:calc(100% / 6 - 1.6em);
	margin-right:1.6em;
	margin-bottom:1.6em;
}

@media only screen and (max-width:1800px) {
	.home-projects-thumb .tile {
		width:calc(100% / 5 - 1.6em);
	}
}
@media only screen and (max-width:1600px) {
	.home-projects-thumb .tile {
		width:calc(100% / 4 - 1.6em);
	}
}




.home-projects-thumb .tile a {
	height:22em;
}
.home-projects-thumb .image {
	width:100%;
	height:16em;
}
.home-projects-thumb .text {
	top:16em; left:0;
	width:100%;
	height:6em;
	padding:0.5em 0.9em 0 0.9em;
	border-left:0;
	border-top:1px solid #dadbdd;
}
.home-projects-thumb .text h4 {
	font-size:1em;
	margin-bottom:0.2em;
}
.home-projects-thumb .text h5 {
	font-size:0.9em;
	line-height:1.1;
	max-height:2.2em;
	overflow:hidden;
	margin-bottom:0.2em;
}
.home-projects-thumb .text h5 + h5 {
	
}
.home-projects-thumb .text p {
	display:none;
}

/*
——————————————————
Company Page
——————————————————
*/
.company-heading strong {
	display:block;
	font-weight:500;
}
.company-heading span {
	display:block;
	font-size:1rem;
	color:#aaa;
	line-height:1.5;
	font-weight:normal;
}
.company-tabs {
	height:calc(3em + 2px);
	border-bottom:2px solid #e2e2e2;
	padding-left:1em;
	margin-bottom:3.5em;
}
.company-tabs li {
	float:left;
	margin-right:0.5em;
}
.company-tabs a {
	display:block;
	line-height:3em;
	height:3em;
	padding:0 1.5em;
	text-align:center;
	text-transform:lowercase;
	font-weight:500;
	border:2px solid #fff;
	border-bottom:0;
	border-radius:0.6em 0.6em 0 0;
	transition:background-color 200ms;
}
.company-tabs a:hover {
	background:#f6f6f6;
}
.company-tabs li.active a {
	background:#fff;
	height:calc(3em + 2px);
	border-color:#e2e2e2;
}
.company-tabs a:before {
	font-family:'fa-light';
	font-size:1.8em;
	float:left;
	width:1.8em;
	line-height:1.666;
}

.company-tabs li.tab-current a:before {
	content:'\f0e7';
	color:var(--peppa);
}
.company-tabs li.tab-completed a:before {
	content:'\f00c';
	color:var(--elsa);
}
.company-tabs li.tab-brands a:before {
	content:'\f024';
	color:var(--ursula);
}
.company-tabs li.tab-portfolios a:before {
	content:'\f0b1';
	color:var(--maleficent);
}
.company-tabs li.tab-people a:before {
	content:'\f75b';
	color:var(--patrick);
}

.company-logo-wrapper {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	height:100%;
	float:left;
	width:6em;
	height:3.8em;
	margin:-0.3em 1.5em 0 0;
}
.company-logo-wrapper img {
	display:block;
	max-width:6em;
	max-height:3.8em;
}


/*
——————————————————
Brand Logos
——————————————————
*/
#company-logos {
	width:calc(100% + 1.2em);
	margin-right:-1.2em;
}
#company-logos li {
	float:left;
	width:calc(100% / 7 - 1.2em);
	height:13em;
	margin:0 1.2em 1.2em 0;
}

@media only screen and (max-width:1800px) {
	#company-logos li {
		width:calc(100% / 6 - 1.2em);
	}
}
@media only screen and (max-width:1600px) {
	#company-logos li {
		width:calc(100% / 5 - 1.2em);
	}
}
@media only screen and (max-width:1300px) {
	#company-logos li {
		width:calc(100% / 4 - 1.2em);
	}
}





#company-logos a {
	display:block;
	width:100%;
	height:100%;
	position:relative;
	background:rgba(193 196 210 / 14%);
	border-radius:0.5em;
	padding:0.8em;
	transition:background-color 100ms;
	overflow:hidden;
}
#company-logos a:hover {
	background:rgba(193 196 210 / 20%);
}
#company-logos a:active {
	background:rgba(193 196 210 / 31%);
}
#company-logos .image-wrapper {
	display:flex;
	align-items:center;
	width:9em;
	height:9em;
	margin:auto;
}
#company-logos img {
	display:block;
	margin:auto;
	max-width:9em;
	max-height:5em;
	mix-blend-mode:multiply;
}
#company-logos p {
	position:absolute;
	bottom:0; left:0;
	width:100%;
	padding:0.7em 0.5em;
	text-align:center;
	font-size:0.9em;
	line-height:1.2;
	margin:0;
	background:rgba(193 196 210 / 24%);
}
#company-logos p strong,
#company-logos p span {
	display:block;
}







/*
——————————————————
File Status
——————————————————
*/
.file-status {
	display:inline-block;
	width:13em;
	text-align:center;
}
.file-status span {
	display:block;
	line-height:2.2em;
	text-align:center;
	font-weight:500;
	background:#eee;
	border-radius:1.1em;
	font-size:0.9em;
}
.file-status span.up-to-date {
	color:#4db881;
	background:#61c39122;
}
.file-status span.not-found {
	color:var(--barbie);
	background:#e6347822;
}
.file-status span.new-version {
	color:#0f81c2;
	background:#0f81c222;
}   
.file-status span:before {
	font-family:fa-light;
	display:inline-block;
	width:1.2em;
	text-align:center;
	margin-right:0.2em;
	font-size:1.1em;
}

.file-status span.up-to-date:before  { content:'\f00c' }
.file-status span.not-found:before   { content:'\f06a' }
.file-status span.new-version:before { content:'\f021' }

.syncing span:before {
	display:none;
}






/*
——————————————————
Fancybox Overrides
——————————————————
*/
.fancybox__content {
	border-radius:1em;
	padding:1.2em;
}
.fancybox__iframe {
	border-radius:0.5em;
}

.fancybox-fullscreen .fancybox__backdrop {
	background:#fff;
}
.fancybox-fullscreen .fancybox__content,
.fancybox-fullscreen .fancybox__container:not(.is-compact) .fancybox__slide.has-close-btn {
	padding:0;
}
.fancybox-fullscreen .fancybox__content {
	height:100% !important;
}
.fancybox-fullscreen .fancybox__container:not(.is-compact) .has-iframe .fancybox__content {
	width:100%;
	height:100%;
}
.fancybox-fullscreen .fancybox__content > .is-close-btn {
	position:fixed;
	top:2em; right:2em;
	width:4rem;
	height:4rem;
	color:#d0d0d0;
	text-decoration:none;
	border:0;
	background:#fff;
	border-radius:50%;
	overflow:hidden;
	padding:0;
	cursor:pointer;
	opacity:1;
	z-index:10001;
}
.fancybox-fullscreen .is-close-btn:hover {
	color:#bbb;
}
.fancybox-fullscreen .is-close-btn:active {
	color:#aaa;
}
.fancybox-fullscreen .is-close-btn:before {
	content:'\f057';
	display:block;
	width:100%;
	text-align:center;
	font-size:4rem;
	font-family:fa-light;
	line-height:1;
	transition:color 150ms;
}
.fancybox-fullscreen .is-close-btn svg {
	display:none;
}



/*
.fancybox-content {
	border-radius:8px !important;
	overflow:hidden !important;
}
.fancybox-bg {
	background:#fff !important;
}
.fancybox-is-open .fancybox-bg {
	opacity:1 !important;
}
.fancybox-slide {
	padding:0 !important;
}

*/


a {
	color:inherit;
	text-decoration:none;
}
.not-added {
	color:#c1c4cb;
}










#ols {
	height:5.0666em;
	margin-bottom:1em;
}
#ols img {
	position:absolute;
	top:0.8em;
	right:0.8em;
	width:2.6em;
	height:3.4666em;
	margin:auto;
	transition:opacity 200ms;
}
#ols img.logo {
	left:0.7em; right:auto;
}



#nav {
	position:relative;
}
#nav .menu {
	color:#888;
}
#nav .menu li {
	position:relative;
}
#nav .menu-item {
	display:block;
	height:2.6em;
	transition:color 150ms, background-color 150ms;
	overflow:hidden;
}
#nav .menu-item:hover,
#nav.open a.home {
	color:#ccc;
	background:rgba(255,255,255,0.07);
}
#nav .menu-item:before {
	float:left;
	font:1.4em/2.6rem fa-light;
	width:4rem;
	text-align:center;
}
#nav .menu-item span {
	display:none;
}
#nav .parent span:after {
	content:'\f078';
	font-family:fa-light;
	font-size:0.9em;
	display:inline-block;
	margin-left:0.4em;
}
#nav a.home:before {
	content:'\e487';
}
#nav a.portfolios:before {
	content:'\f0b1';
}
#nav a.companies:before {
	content:'\f500';
}
#nav a.new:before {
	content:'\f055';
	color:var(--barbie);
	font-family:fa-solid;
}

.favourite {
	text-align:right;
	margin-top:1.5em;
}
.favourite input {
	display:none;
}
.favourite label {
	display:inline-block;
	width:1.3em;
	height:1.5em;
	text-align:center;
	color:#ddd;
}
.favourite label:after {
	content:'\f005';
	font-family:fa-light;
	cursor:pointer;
}
.favourite label:hover {
	color:#aaa;
}
.favourite input:checked + label:after {
	font-family:fa-solid;
	color:var(--belle);
}
.home-menu {
	display:none;
	position:absolute;
	top:2.4em; left:2.8em;
	background:#fff;
	border:1px solid #eee;
	border-radius:0.5em;
	box-shadow:0 0 1em rgba(0,0,0,0.1);
	overflow:hidden;
	padding:0.4em;
}
.home-menu li.divider {
	border-bottom:1px solid #ddd;
	padding-bottom:0.3em;
	margin-bottom:0.3em;
}
#nav.open .home-menu {
	display:block;
}
.home-menu a {
	display:block;
	padding:0.4em 0.9em;
	border-radius:0.4em;
	white-space:nowrap;
}
.home-menu a:hover {
	background:#f5f5f7;
}
.home-menu a:active {
	background:#e5e5e799;
}
.home-menu li:last-child a {
	border:0;
}







.companies-menu {
	width:17em;
	transition:opacity 100ms;
	transition-delay:150ms;
}
.companies-menu li a {
	display:block;
	color:#888;
	padding:0.1em 1.3em;
	transition:color 200ms;
}
.companies-menu li.active a,
.companies-menu li a:hover {
	color:#fff;
}
.companies-menu ul + a {
	display:inline-block;
	color:#aaa;
	background:rgba(255,255,255,0.15);
	line-height:2em;
	font-size:0.8em;
	font-weight:500;
	border-radius:2em;
	padding:0 1em;
	margin:1em 0 0 1.3rem;
	transition:color 200ms;
}
.companies-menu ul + a:hover {
	color:#fff;
}
#profile {
	position:absolute;
	bottom:0.6em; left:0.6em;
}
#profile .avatar {
	cursor:pointer;
}
#profile-menu {
	display:none;
	position:absolute;
	bottom:3.6em; left:2.2em;
	width:14em;
	background:#fff;
	border:1px solid #eee;
	border-radius:0.5em;
	box-shadow:0 0 1em rgba(0,0,0,0.1);
	overflow:hidden;
	padding:0.4em;
}
#profile.open #profile-menu{
	display:block;
}
#profile a {
	display:block;
	padding:0.4em 0.9em;
	border-radius:0.4em;
	text-transform:lowercase;
}
#profile a:hover {
	background:#f5f5f7;
}
#profile a:active {
	background:#e5e5e799;
}
#profile li:last-child a {
	border:0;
}



.close-button {
	position:fixed;
	top:1em; right:1em;
	width:4em;
	height:4em;
	color:#d0d0d0;
	text-decoration:none;
	border:0;
	xbackground:#fff;
	border-radius:50%;
	overflow:hidden;
	padding:0;
	cursor:pointer;
	z-index:10001;
}
.client-view .close-button {
	right:auto; left:1em;
}
.close-button:hover {
	color:#bbb;
}
.close-button:active {
	color:#aaa;
}
.close-button:before {
	content:'\f00d';
	display:block;
	width:100%;
	text-align:center;
	font-size:3em;
	font-family:fa-light;
	line-height:4rem;
	transition:color 150ms;
}
body.hide-scrollbar .close-button {
	display:none;
}


.logo-wrapper {
	display:block;
	height:3em;
	margin-bottom:1em;
}
.brand-logo {
	margin:0 auto;
	max-height:3em;
	max-width:9em;
}
.project-title {
	font-size:1.15em;
	font-weight:normal;
	line-height:1.2;
	margin:0 0 2em 0;
	text-align:right;
	text-transform:none;
	color:#666;
}
.project-title strong {
	display:block;
	font-weight:500;
	font-size:1.3rem;
	margin-bottom:0.2em;
}
.project-title span {
	word-wrap:break-word;
}
.project-title span.domain {
	color:#aaa;
	font-size:0.9em;
}
.project-title span.long-domain {
	font-size:0.75em;
}
.cobranding {
	text-align:center;
	margin-bottom:3em;
}
.cobranding div {
	height:6em;
	width:9em;
	display:inline-block;
	vertical-align:top;
}
.cobranding span.plus {
	font-size:2.5em;
	width:1.8em;
	line-height:6rem;
	color:#ccc;
	display:inline-block;
	vertical-align:top;
	font-weight:300;
}
.cobranding div span {
	display:flex;
	height:100%;
	align-items:center;
	justify-content:right;
}
.cobranding div:last-child span {
	justify-content:left;
}
.cobranding img {
	display:block;
	max-width:9em;
	max-height:6em;
}
#menu {
	position:fixed;
	top:3em; left:4em;
	padding:0 1em 0 2em;
	width:15em;
	border-right:1px solid #ddd;
	text-align:right;
}
#menu li {
	margin-bottom:0.8em;
}
#menu li.home-link {
	border-top:1px solid #ddd;
	min-width:8em;
	float:right;
	margin-top:0.3em;
}
#menu li.home-link a {
	padding-top:0.7em;
	padding-left:0.7em;
	text-transform:none;
}
#menu li.home-link a:before {
	content:'\e487';
	display:inline-block;
	width:1.6em;
	font-family:fa-light;
	font-size:0.9em;
	color:#bbb;
	text-align:left;
}
#menu a {
	display:block;
	padding:0 1em;
	margin-right:-1em;
	line-height:1.05;
	text-transform:lowercase;
}
#menu a:hover {
	color:var(--barbie);
}
#menu li.active a {
	color:var(--barbie);
	font-weight:500;
	padding-right:0.6em;
	border-right:0.4em solid var(--barbie);
}
#menu li ul {
	display:inline-block;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
	font-size:0.85em;
	padding:0.3em 0;
	margin-top:0.8em;
}
#menu li li {
	margin:0;
}
#menu li li a,
#menu li.active li a {
	padding:0.2rem 1em;
	color:inherit;
	font-weight:normal;
	border:0;
}
#menu li li.active a {
	color:var(--barbie);
	font-weight:500;
}


#submenu {
	position:absolute;
	top:0; left:4em;
	background:#000;
	padding:1em;
	border-radius:0.5em;
}


.avatar {
	display:block;
	width:2.8em;
	height:2.8em;
	line-height:2.8em;
	border-radius:50%;
	color:#fff;
	font-weight:500;
	xbackground:linear-gradient(to bottom right, var(--elsa), var(--ursula));
	text-align:center;
	overflow:hidden;
	cursor:default;
}
.avatar img {
	display:block;
	width:100%;
	height:100%;
}






#content-wrapper {
	margin-left:16em;
	padding:4em;
}
#content {
	margin:auto;
	max-width:1600px;
	position:relative;
}
#feed {
	padding-left:3.5em;
	max-width:1200px;
	margin:auto;
}
.post {
	display:block;
	padding:1em;
	margin-bottom:1.2em;
	border-radius:1em;
	background:rgba(193 196 210 / 17%);
	transition:background-color 100ms;
	position:relative;
}
.post-clickable:hover {
	cursor:pointer;
	background:rgba(193 196 210 / 24%);
}
.post h3 {
	text-transform:lowercase;
	font-size:1.6em;
	position:relative;
	margin-bottom:0.3em;
	padding:0 0.1em;
}
.post h3:before {
	content:'';
	width:2rem;
	height:2rem;
	border:2px dashed #d0d0d0;
	border-radius:50%;
	position:absolute;
	top:0; left:-4rem;
	box-sizing:border-box;
	pointer-events:none;
}
.post-approved {
	position:absolute;
	top:1.7rem; right:1.6rem;
	font-size:0.85em;
	color:#999;
}
.post-approved:before {
	content:'\f00c';
	font-family:fa-solid;
	margin-right:0.4em;
	color:#bbb;
}
.post-completed h3:before {
	opacity:1;
	content:'\f00c';
	font-family:fa-solid;
	font-size:1.2rem;
	text-align:center;
	line-height:2rem;
	border:0;
	color:#fff;
	background:var(--marge);
}








.post-content {
	background:#fff;
	padding:1.5em;
	border-radius:0.6em;
	position:relative;
	box-shadow:0 0 0.5em rgb(0 0 0 / 3%);
}


.post-content dl {
	float:left;
}
.post-content dt {
	float:left;
	clear:left;
	width:6em;
	text-transform:lowercase;
	padding:0.25em 0;
	font-weight:500;
	color:#96aecb;
	xcolor:var(--ursula);
}
.post-content dd {
	float:left;
	width:22em;
	padding:0.25em 0;
}
.post-content input.date {
	background:#f0f0f0;
	border:0;
	border-radius:2em;
	padding:0.2em 0.5em;
	outline:0;
	color:inherit;
}
.brief-readonly {
	background:#fafafa;
	border:1px solid #ddd;
	padding:1em;
	border-radius:0.3em 0.3em 0 0;
	margin:0.5em 0.5em 0 0.5em;
}
.brief-readonly-truncated {
	max-height:12em;
	overflow:hidden;
	position:relative;
}
.brief-readonly-truncated:after {
	content:'';
	background:linear-gradient(to bottom, transparent, #fafafa);
	height:5em;
	width:calc(100% - 2px);
	position:absolute;
	bottom:0; left:1px;
}
.view-full-brief {
	display:block;
	background:#ddd;
	text-align:center;
	padding:0.3em;
	margin:0 0.5em 0.5em 0.5em;
	border-radius:0 0 0.3em 0.3em;
	cursor:pointer;
	color:#666;
}
.view-full-brief:after {
	content:'View less';
}
.brief-readonly-truncated + .view-full-brief:after {
	content:'View more';
}
.post .brief-readonly h3 {
	text-transform:none;
	padding:0;
}
.post .brief-readonly h3:before {
	display:none;
}
.post .brief-readonly h2 {
	font-size:1.4em;
	margin-bottom:0.6em;
}
.post .brief-readonly h3 {
	font-size:1.2em;
	margin-bottom:0.7em;
}
.post .brief-readonly h4 {
	font-size:1.1em;
	margin-bottom:0.9em;
}
.post .brief-readonly p {
	margin-bottom:1em;
}
.post .brief-readonly ul {
	padding-left:2.3em;
	margin-bottom:1em;
}
.post .brief-readonly ul li {
	list-style:disc;
	margin-bottom:0.4em;
}


.board-thumb {
	float:left;
	display:flex;
	align-items:center;
	justify-content:center;
	margin:-0.3em 3em -0.6em -0.3em;
	width:5em;
	height:7.5em;
}
.board-thumb img {
	display:block;
	max-width:5em;
	max-height:7.5em;
	margin:auto;
	border-top:0.3em solid #fff;
	border-left:0.3em solid #fff;
	box-shadow:-0.4em -0.4em rgba(193 196 210 / 34%);
	transition:box-shadow 150ms;
}
.board-thumb img.clear {
	display:none;
}
.board-thumb img:hover {
	box-shadow:-0.4em -0.4em rgba(193 196 210 / 55%);
}
.board-message-wrapper {
	text-align:center;
	margin:0 auto 2.4em auto;
	position:relative;
}
.board-message {
	max-width:40em;
	position:relative;
	padding-left:4.6em;
	display:inline-block;
	text-align:left;
}
.board-message .avatar {
	position:absolute;
	top:0; left:0;
	font-size:1.3em;
}
.board-message .text {
	display:inline-block;
	padding:0.9em 1.2em;
	background:#fff;
	border-radius:0.5em;
	position:relative;
	border:1px solid #e2e2e2;
	box-shadow:0 0.1em 0.3em #eee;
}
.board-message .multiple-messages {
	display:block;
	width:35em;
	margin-bottom:0.8em;
}
.board-message .multiple-messages:after {
	content:'';
	position:absolute;
	bottom:-1em; left:50%;
	width:2px;
	height:1em;
	background:#e2e2e2;
}
.board-message .multiple-messages:last-child {
	margin-bottom:0;
}
.board-message .multiple-messages:last-child:after {
	content:none;
}
.board-message .avatar + .text:before {
	content:'';
	width:0; height:0;
	border-style:solid;
	border-width:0.6em 0.6em 0.6em 0;
	border-color:transparent #e2e2e2 transparent transparent;
	position:absolute;
	top:1em; left:-0.6em;
}
.board-message .text strong {
	color:var(--barbie);
	background:#e634780e;
	padding:0 0.3em;
	font-weight:500;
	border-radius:0.3em;
	white-space:nowrap;
}




.package-description {
	font-size:0.85em;
	width:calc(100% - 45em);
	float:right;
	margin-top:3.5em;
	border-left:1px solid var(--elsa);
	padding-left:1em;
	color:#999;
}
.post-completed .package-description {
	margin-top:0.5em;
}




.package-graphic {
	float:left;
	transition:opacity 150ms;
	width:8em;
	height:8em;
	background-image:url(/Images/Blobs/1.png);
	background-image:url(/Images/Blobs/6.png);
	background-size:100%;
	position:relative;
	margin:0 1em 0 -0.5em;
}
.package-graphic .product-icon {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
}
.package-graphic .product-icon img {
	display:block;
	margin:auto;
	height:100%;
	transform:scale(0.90);
}
.package-graphic + .sow-details {
	float:right;
	width:calc(100% - 11.5em);
}


.post h4 {
	font-size:1.1em;
	font-weight:500;
	text-transform:lowercase;
	margin-bottom:1.2em;
}
.post .short-brief h4 {
	margin-top:1.2em;
	margin-bottom:0.6em;
}

.post .textarea-wrapper {
	display:block;
	position:relative;
	min-height:4em;
	margin-bottom:0.7em;
	width:calc(100% - 18em);
}
.post .textarea-wrapper textarea {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	padding:0.8em 0.9em;
	min-height:4em;
	border:none;
	border-bottom:1px solid #d2d2d2;
	border-radius:5px;
	box-shadow:0 0.1em 0.2em rgba(0,0,0,0.04);
	transition:border-color 100ms;
	line-height:1.3;
	box-sizing:border-box;
	outline:none;
	background:#f6f6f7;
}
.post textarea {
	resize:vertical;
}
.post textarea:focus {
	outline:0;
	border-bottom-color:#cfcfcf;
	box-shadow:0 0.1em 0 rgba(0,0,0,0.09);
}
.post .textarea-wrapper:after {
	content:attr(data-content) ' ';
	visibility:hidden;
	white-space:pre-wrap;
	display:block;
	padding:0.8em 0.6em;
	border-bottom:1px solid #fff;
	line-height:1.3;
}








.button {
	display:inline-block;
	min-width:9em;
	background:var(--barbie);
	color:#fff;
	font-weight:500;
	height:2.4em;
	line-height:2.4em;
	border-radius:1.2em;
	border:0;
	outline:0;
	cursor:pointer;
	text-align:center;
	text-transform:lowercase;
	padding:0 1em;
	transition:box-shadow 100ms;
	user-select:none;
}
.button:hover {
	box-shadow:0 0 0 100vmax inset rgb(0,0,0,0.05);
}
.button:active {
	box-shadow:0 0 0 100vmax inset rgb(0,0,0,0.10);
}
.button-small { /* use for verify button on intake form? */
	height:2em;
	line-height:2em;
	min-width:7em;
}
.button-right {
	float:right;
}
.button-secondary {
	color:#ff317c !important;
	background:#fff !important;
	border:2px solid #ff317c;
	line-height:100%;
}
.button-blue {
	background:var(--marge);
}
.button-blue:hover {
	background:#00649d;
}
.button-blue:active {
	background:#005d93;
}
.button-gray {
	color:#666;
	background:#e9e9ea;
}
.button-gray:active {
	background:#e2e2e4;
}
.button-yellow {
	color:#333;
	background:#ffb;
}
#artwork-tools .button-clear {
	background:none;
	color:#999;
}
#artwork-tools .button-clear:hover {
	background:#fafafa;
}
#artwork-tools .button-clear:active {
	background:#f6f6f6;
}

.button-mobile:before {
	content:'\f3ce';
	content:'\e196';
	font-family:fa-light;
	margin:0 0.4em;
}
.toggle-thumbs {
	margin-left:0.4em;
}
.toggle-thumbs:after {
	content:'\f078';
	font-family:fa-solid;
	font-size:0.8em;
	display:inline-block;
	width:0.7em;
	text-align:center;
	margin-left:1em;
	transition:transform linear 200ms;
}
.thumbs-visible .toggle-thumbs:after {
	transform:rotate(180deg);
}

.doc-link {
	padding-left:2.5em;
	position:relative;
	text-transform:none;
	margin-bottom:1.2em;
}
.doc-link:before {
	font-family:fa-light;
	content:'\f15b';
	position:absolute;
	top:0.7em; left:1em;
	line-height:1;
}
.doc-link.doc:before ,
.doc-link.xls:before,
.doc-link.pdf:before {
	font-family:fa-solid;
	content:'\f1c2';
	color:var(--marge);
	font-size:1.2em;
	top:0.55em; left:0.75em;
}
.doc-link.xls:before {
	content:'\f1c3';
	color:#61c391;
}
.doc-link.pdf:before {
	content:'\f1c1';
	color:#d03;
}



.approve-sow {
	position:absolute;
	top:-1.3em; right:1.5em;
	text-align:center;
	width:14rem;
}
.approve-sow .button {
	display:block;
	text-transform:none;
	width:14rem;
	margin-bottom:0.5em;
}

.has-trigger {
	width:15.5rem;
}
.has-trigger .button {
	float:left;
	border-radius:1.2em 0 0 1.2em;
	width:12.9rem;
}
.button +.trigger {
	float:right;
	width:2.6rem;
	height:2.4em;
	line-height:2.4em;
	border-radius:0 1.2em 1.2em 0;
	color:#fff;
	background:var(--barbie);
	cursor:pointer;
	border-left:1px solid rgb(0,0,0,0.22);
	text-align:center;
	padding-right:0.3em;
	box-shadow:0 0 0 100vmax inset rgb(0,0,0,0.07);
}
.button + .trigger:after {
	content:'\f078';
	font-family:fa-solid;
	font-size:0.9em;
	transition:transform linear 200ms;
	display:inline-block;
}
.trigger-menu-active .button + .trigger:after {
	transform:rotate(180deg);
}
.trigger-menu {
	position:absolute;

}

.terms-note a {
	color:var(--barbie);
}



#feed-sidebar {
	width:15em;
	position:absolute;
	top:13em; right:0;
	background:#ddd;
	height:20em;
}







.timeline-wrapper {
	height:8.5em;
	padding-top:3em;
}
.timeline-content-obscured {
	position:relative;
}
.timeline-content-obscured .timeline-wrapper {
	filter:blur(3px);
	opacity:0.3;
}
#feed .timeline-content-obscured .timeline-wrapper {
	filter:none;
	opacity:1;
}
.timeline-phases {
	width:100%;
	height:1.6rem;
}
.timeline-phases .phase {
	float:left;
	height:1.6rem;
	text-align:center;
	color:#fff;
	font-size:0.9em;
	line-height:1.6rem;
	position:relative;
}
.timeline-phases .client-phase {
	background:#7E84AD;
}
.timeline-phases .client-phase:before {
	content:'Feedback';
	position:absolute;
	top:-1.4em; left:calc(50% - 3em);
	width:6em;
	text-align:center;
	font-size:0.8em;
	xfont-weight:500;
	text-transform:lowercase;
	color:var(--ursula);
	line-height:1.05;
}
.timeline-phases .client-phase:first-child,
.timeline-phases .studio-phase:first-child {
	border-radius:2em 0 0 2em;
}
.timeline-phases .client-phase:first-child:before {
	xtop:-2.65em;
	content:'Brief & Assets';
	width:10em;
	left:calc(50% - 5em);
}
.timeline-phases .zero-days:after {
	content:'';
	background:var(--ursula);
	width:2em;
	height:100%;
	position:absolute;
	top:0; left:calc(50% - 1em);
	z-index:1;
}
.timeline-phases .studio-phase {
	background:var(--elsa);
}
.timeline-phases .studio-phase:before {
	xcontent:'Studio';
	position:absolute;
	top:-1.6em; left:calc(50% - 3em);
	width:6em;
	text-align:center;
	font-size:0.77em;
	font-weight:500;
	text-transform:lowercase;
	color:#f32d75;
	color:#aaa;
	line-height:1.05;
}
.timeline-phases .studio-phase:last-child {
	border-top-right-radius:2em;
	border-bottom-right-radius:2em;
}
.timeline-message-wrapper {
	text-align:center;
	margin-top:2em;
}
#feed .timeline-message-wrapper {
	display:none;
}
.timeline-message {
	display:inline-block;
	text-align:center;
	color:var(--leela);
	background-color:rgba(var(--leelaRGB), 0.12);
	font-size:0.9em;
	padding:0.5em 2em;
	border-radius:5em;
	margin:0;
}
.timeline-message-prominent {
	color:#fff;
	background-color:var(--leela);
	position:relative;
	top:-8em;
}
.timeline-days {
	width:100%;
	height:1.2rem;
	xopacity:0;
	transition:opacity 200ms;
}
.timeline-wrapper:hover .timeline-days {
	opacity:1;
}
.timeline-days div {
	float:left;
	height:1.2rem;
	box-sizing:border-box;
	border-right:1px solid #dadada;
	text-align:center;
	color:#c0c0c0;
	font-size:0.8em;
	line-height:1.2rem;
	position:relative;
	cursor:default;
}
.timeline-days div.weekend {
	color:#b5b5b5;
	background:#e8e8e8;
	border:0;
}
.timeline-days div.weekend + div.weekend {
	border-right:1px solid #dadada;
}
.timeline-days div.holiday {
	background:#d8d8d8;
}
.timeline-days div.today {
	color:#fff;
	background:var(--barbie);
}
.timeline-days div.today:before {
	content:'TODAY';
	font-weight:500;
	font-size:0.6rem;
}
.timeline-days div .date-label {
	position:absolute;
	top:2em; left:0;
	white-space:nowrap;
	color:#333;
	background:#fff;
	padding:0.3em 0.6em;
	border-radius:0.3em;
	box-shadow:0 0 0.5em #00000055;
	text-align:left;
	display:none;
	z-index:1;
}
.timeline-days div .date-label strong {
	display:block;
	font-weight:500;
}
.timeline-days div:hover {
	color:#777;
	background-color:#ffd;
}
.timeline-days div:hover .date-label {
	display:block;
}
.phase-start-date,
.phase-end-date {
	position:absolute;
	top:1.6rem; 
	padding-top:2em;
	color:#444;
	line-height:1.1;
	width:8em;
}
.phase-start-date {
	left:-0.5px;
	text-align:left;
	padding-left:0.5em;
	border-left:1px solid #dadada;
}
.phase-end-date {
	right:0;
	text-align:right;
	padding-right:0.5em;
	border-right:1px solid #dadada;
}
.phase-start-date strong,
.phase-end-date strong {
	font-size:1.1em;
	font-weight:500;
	background:#fff;
}



#feed .post .timeline-wrapper {
	padding-top:5em;
	font-size:0.95em;
}
#feed .phase-start-date,
#feed .phase-end-date {
	top:auto;
	bottom:1.6rem;
	padding-top:0;
	padding-bottom:2em;
}






.team-person {
	display:block;
	background:rgba(193 196 210 / 21%);
	padding:0.8em 0.5em 0 4em;
	height:3.8em;
	border-radius:1.9em;
	line-height:1.1;
	position:relative;
	margin-bottom:1em;
}
.team-person:last-child {
	margin-bottom:0;
}
.team-person .avatar {
	position:absolute;
	top:0.5em; left:0.5em;
	margin:0;
	color:#fff;
}
.commenter .avatar,
.pink .avatar {
	background:linear-gradient(to bottom right, var(--peppa), var(--ursula));
}
.team-person strong {
	display:block;
	font-weight:500;
}
.team-person .email {
	font-size:0.8em;
}
.team-avatars {
	font-size:0.75em;
	margin-bottom:2em;
}
.team-avatars li {
	float:left;
	margin:0 0.4em 0.4em 0;
}


.commenter {
	float:left;
	font-size:0.67em;
	padding-top:1.2em;
	width:calc(33.33% - 0.8em);
	margin-bottom:0.7em;
	margin-right:0.8em;
}
.commenter strong {
	font-size:1.3em;
}
.commenter .email {
	display:none;
}
.commenter .avatar span {
	display:block;
	transform:scale(1.1);
}









/*
—————————————————
Tabs
—————————————————
*/
.tabs {
	border-bottom:1px solid #ddd;
	height:2em;
	margin:2em 0 3.2em 0;
	text-transform:lowercase;
}
h2 + .tabs, .tabs:first-child {
	margin-top:0;
}
.tabs + .grid {
	margin-top:-0.6em;
}
.tabs li {
	float:left;
	position:relative;
}
.tabs a {
	display:block;
	height:calc(2em + 1px);
	line-height:2em;
	padding:0 1.2em;
	box-sizing:border-box;
	transition:border-color 150ms linear;
	border-bottom:3px solid rgba(255,255,255,0);
	position:relative;
}
.tabs a span {
	font-size:0.8em;
	color:#bbb;
	margin-left:0.5em;
	font-weight:500;
}
.tabs li.active a {
	border-bottom-color:#ff317c;
}
.tabs li.active a span {
	color:#f02e75;
}
.tabs a:hover {
	border-bottom-color:#ddd;
}
.tabs a:active {
	border-bottom-color:#ccc;
}


.tabs .tooltip {
	position:absolute;
	top:-0.5em; right:0em;
	cursor:default;
	width:1.8em;
	text-align:center;
}
.tabs .tooltip:before {
	content:'\f059';
	font-family:fa-solid;
	color:#339ad4;
}
.tabs .tooltip-text {
	position:absolute;
	bottom:calc(100% + 0.7em); right:-1.3em;
	max-width:80%;
	color:#fff;
	background:linear-gradient(to bottom, #444, #333);
	box-shadow:0 0 1.2em rgba(0,0,0,0.15);
	border-radius:6px;
	padding:0.8em 1em;
	font-size:0.875em;
	pointer-events:none;
	opacity:0;
	transition:200ms;
}
.tabs .tooltip:hover + .tooltip-text {
	bottom:calc(100% + 1em);
	opacity:1;
}
.tabs .tooltip-text:after {
	content:'';
	width:0;
	height:0;
	border-style:solid;
	border-width:0.8em 0.8em 0 0.8em;
	border-color:#333 transparent;
	position:absolute;
	top:100%; right:1.8em;
}
.tabs li ul {
	position:absolute;
	top:100%; left:0;
	background:#fff;
	border:1px solid #ddd;
	border-radius:5px;
	padding:0.5em 0;
	z-index:7;
	display:none;
}
.tabs li:hover {
	padding-bottom:0.5em;	
}
.tabs li:hover ul {
	display:block;
}
.tabs li ul li {
	float:none;
	padding-bottom:0 !important;	
}
.tabs li ul a {
	white-space:nowrap;
	line-height:1.8em;
	height:auto;
	border-bottom:0;
}
.tabs li ul a:hover {
	background:#f2f2f2;
}
.tabs li ul a:active {
	background:#ececec;
}





/*
—————————————————
Board Tiles
—————————————————
*/
#board-tiles {
	width:calc(100% + 2.5em);
	margin-right:-2.5em;
	margin-bottom:-2.5em;
}
#board-tiles li {
	float:left;
	width:calc(50% - 2.5em);
	margin:0 2.5em 2.5em 0;
}
#board-tiles a {
	display:block;
	height:20em;
	position:relative;
	overflow:hidden;
	color:inherit;
	background:#fff;
	border-bottom:3px solid #dadbdd;
	border-radius:0.5em;
	transition:border-color 150ms;
}
#board-tiles .image {
	position:absolute;
	top:0; left:0;
	width:calc(50% - 1.6rem);
	height:100%;
	padding:1.3em;
	display:flex;
	justify-content:center;
	align-items:center;
	background:rgb(193 196 203 / 40%);
	transition:background-color 150ms;
}
#board-tiles a:hover {
	border-color:#cacbcd;
}
#board-tiles a:hover .image {
	background:rgb(193 196 203 / 55%);
}
#board-tiles img {
	border-radius:6px;
	max-width:100%;
	max-height:100%;
}
#board-tiles .text {
	position:absolute;
	top:2rem; left:50%;
	width:calc(50% - 1.6rem);
}
#board-tiles h3 {
	line-height:1.2;
}
#board-tiles p {
	margin-top:1em;
}
#board-tiles .comments {
	position:absolute;
	bottom:1.6em; right:1.6em;
}
#board-tiles .comments:before {
	font-family:fa-light;
	content:'\f075';
	margin-right:0.3em;
}
#board-tiles .comments-recent:before {
    color:var(--barbie);
	font-family:fa-solid;
}
#board-tiles .progress {
	position:absolute;
	bottom:4rem; left:50%;
	width:calc(50% - 1.6rem);
}
#board-tiles .progress-bar {
	height:0.4em;
	background:rgb(193 196 203 / 40%);
	border-radius:0.2em;
}
#board-tiles .progress-bar span {
	display:block;
	height:100%;
	background:var(--barbie);
	border-radius:0.2em;
}
#board-tiles .progress-bar-completed span {
	background:#61c391;
}
#board-tiles .progress-score {
	font-size:0.8666rem;
	margin-top:0.3em;
}



#creative-tiles {
	width:calc(100% + 2em);
	margin:3em -2em 0 0;
}
#creative-tiles li {
	float:left;
	width:calc(25% - 2em);
	margin:0 2em 3em 0;
	position:relative;
}
#creative-tiles.three-up li {
	width:calc(33.333% - 2em);
}
#creative-tiles.three-up li:nth-child(3n + 1) {
	clear:left;
}
#creative-tiles a {
	display:block;
	padding:50%;
	position:relative;
}
#creative-tiles li.comments:after,
#creative-tiles li.approved:after {
	top:-0.5em;
	right:-0.5em;
}
#creative-tiles .thumb {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	background:rgba(193 196 210 / 23%);
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:0.5em;
}
#creative-tiles img,
#creative-tiles video {
	max-width:calc(100% - 2em);
	max-height:calc(100% - 2em);
}
#creative-tiles.rounded-corners img,
#creative-tiles.rounded-corners video {
	border-radius:0.5em;
}
#creative-tiles.rounded-corners .pin-data {
	border-radius:0.5em;
}
#creative-tiles span.caption {
	display:flex;
	align-items:center;
	height:3em;
	padding:0.7em 0.2em 0 3.3em;
	color:#222;
	position:relative;
	font-size:0.9em;
	line-height:1.2;
	text-align:left;
}
#creative-tiles span.caption:before {
	content:'';
	width:2.2em;
	height:2.2em;
	background:rgba(193 196 210 / 30%);
	border-radius:50%;
	position:absolute;
	top:0.7em; left:0.5em;
}
#creative-tiles span.placeholder:after {
	content:'';
	background:rgba(193 196 210 / 30%);
	position:absolute;
	top:1.3em; left:3.3em;
	width:calc(100% - 4.5em);
	height:1em;
}










/*
—————————————————
Project Steps
—————————————————
*/
.steps {
	display:inline-block;
	height:3.5em;
	background:rgba(193 196 203 / 20%);
	padding:0.5em;
	margin:0.5em auto 6em auto;
	border-radius:2.5em;
}
.steps li {
	float:left;
	width:2.5em;
	height:2.5em;
	border-radius:50%;
	background:#d5d7dc;
	border:0.2em solid #d5d7dc;
	margin-right:7.6666em;
	position:relative;
}
.steps a {
	color:inherit;
	text-decoration:none;
	display:block;
	position:relative;
	height:6.8em;
	margin-top:-2em;
	z-index:6;
}
.steps span {
	position:absolute;
	top:0; left:calc(50% - 3em);
	width:6em;
	text-align:center;
	font-size:0.8666em;
}
.steps strong {
	position:absolute;
	top:5.3rem; left:calc(50% - 5rem);
	width:10rem;
	line-height:1.2;
	text-align:center;
	font-weight:normal;
	font-size:0.8666em;
}
.steps div {
	position:absolute;
	top:0.925em;
	right:2.3em;
	width:8em;
	height:0.25em;
	background:#d5d7dc;
	z-index:-1;
}
.steps-narrow li {
	margin-right:4.6666em;
}
.steps-narrow div {
	width:5em;
}
.steps-narrow strong {
	left:calc(50% - 4em);
	width:8em;
}
.steps li:last-child {
	margin-right:0;
}
.steps li:first-child div {
	display:none;
}
.steps li.active {
	border-color:#ff317c;
	background:#fff;
}
.steps li.current {
	background:#ff317c;
}
.steps li.complete:after {
	content:'\f00c';
	font-family:fa-solid;
	font-weight:normal;
	color:#ff317c;
	position:absolute;
	width:2.2em;
	line-height:2.2em;
	text-align:center;
	top:0; left:calc(50% - 1.1em); 
	z-index:5;
}
.steps li.current:after {
	color:#fff;
}
.steps li.active div {
	background:#ff317c;
}



/*
—————————————————
Toolbar
—————————————————
*/
.toolbar {
	display:inline-block;
	background:rgba(193 196 203 / 25%);
	border-radius:50px;
	box-sizing:border-box;
	padding:0.6em;
	margin-bottom:1.5em;
	margin-top:-0.7em;
	position:relative;
}
.toolbar input.text, .toolbar select, .grid td select {
	display:inline-block;
	padding:0.3em 0.5em;
	line-height:1.2;
	border-radius:1.2em;
	border:0;
	width:auto;
	height:2.4em;
	box-sizing:border-box;
	max-width:25em;
	margin-right:0.3em;
	outline:0;
	border-bottom:2px solid rgba(0, 0, 0, 0.10);
}
.toolbar select {
	padding-right:1.2em;
}
.toolbar select.filtered {
	color:#006aa7;
	background:#f0f6fa;
	border-color:#006aa7;
	box-shadow:2px 2px #006aa7;
}
.toolbar input.text {
	width:13em;
	padding:0.4em 0.7em;
}
.toolbar input.button {
	width:7em;
	margin-left:0em;
}
.toolbar .counts {
	position:absolute;
	top:5.5em; right:0;
}
.toolbar .counts li {
	display:inline-block;
	font-size:0.9375em;
}
.toolbar .counts li:after {
	content:' / ';
	margin:0 0.3em;
}
.toolbar .counts li:last-child:after {
	display:none;
}















.status {
	margin:-1em 0 3em 0;
	text-align:center;
}
.status p {
	display:inline-block;	
	padding:0.5em 1.2em 0.5em 0.8em;
	line-height:2;
	border-bottom:3px solid #dadbdd;
	border-radius:3em;
	margin:0;
	background:#fff;
}
#form .status {
	margin:-3.4em 0 -1.2em 0;
}
#form .status p {
	border:0;
	box-shadow:0 0 0.7em #dadada;
}
.status p:before {
	float:left;
	content:'\f0a4';
	color:#ff317c;
	font-family:fa-solid;
	font-size:1.75em;
	line-height:2rem;
	margin-right:0.5em;
}
.status-warning p:before {
	content:'\f06a';
}
.status-waiting p:before {
	content:'\f017';
}
.status-completed p:before,
.status-approved p:before,
.status-sent p:before {
	content:'\f00c';
	color:#61c391;
}
.status .button {
	margin:0 -0.6em 0 0.8em!important;
}





.round-heading {
	cursor:pointer;
	user-select:none;
	display:inline-block;
}
.round-heading span {
	font-size:0.85em;
	font-weight:normal;
	color:#777;
}
.round-heading:after {
	font-family:fa-light;
	font-size:0.9em;
	content:'\f078';
	margin-left:0.5em;
	margin-right:-1em;
	color:#999;
	display:inline-block;
	width:1em;
	text-align:center;
	transition:transform linear 200ms;
}
.round-heading.active:after {
	transform:rotate(180deg);
}
ul.rounds {
	display:none;
	position:absolute;
	z-index:2;
	top:4.5em; left:1.8em;
	width:16em;
	border:1px solid #e2e2e2;
	box-shadow:0 0.1em 0.3em rgba(0,0,0,0.2);
	background:#fff;
	border-radius:0.5em;
	padding:0.5em 0;
	user-select:none;
}
ul.trigger-menu {
	top:2em;
	left:auto;
	right:1.6em;
	width:15.4em;
}
.round-heading.active + ul.rounds,
.trigger-menu-active + ul.trigger-menu {
	display:block;
}
 ul.rounds a {
	display:block;
	padding:0.2em 1em;
	text-transform:lowercase;
}
 ul.rounds a:hover {
	background:rgba(193 196 210 / 17%);
}
 ul.rounds a:active {
	background:rgba(193 196 210 / 23%);
}

.round-intro {
	max-width:50em;
	margin:0.5em auto;
	position:relative;
	padding-left:3.2em;
	min-height:2em;
}
.round-intro .avatar {
	position:absolute;
	top:0.2em; left:0;
	font-size:0.9em;
}
.round-intro .text {
	border-left:1px solid var(--elsa);
	padding-left:1em;
}

 ul.previous-projects li {
	border-bottom:1px solid #ddd;
	padding:0.4em 0;
}
 ul.previous-projects li:first-child {
	padding-top:0;
}
 ul.previous-projects li:last-child {
	border:0;
	padding-bottom:0;
}
 ul.previous-projects a {
	text-transform:none;
	
}


#pins {
	
}
.pin-slider {
	padding:1em 0;
	position:relative;
}
.pins {
	overflow:hidden;
	height:26.6em;
	overflow:hidden;
}
.pins ul {
	width:10000px;
	height:26.6em;
	transition:margin-left ease-in-out 600ms;
}
.pins li {
	float:left;
	padding:0.8em;
	position:relative;
}
.pins ul.small {
	width:auto;
	text-align:center;
}
.pins ul.small li {
	float:none;
	display:inline-block;
}
.pins img,
.pins video {
	display:block;
	width:auto;
	height:25em;
	box-sizing:border-box;
	outline:0;
}
.rounded-corners .pins img,
.rounded-corners .pins video {
	border-radius:0.6em;
}
.pins a {
	display:block;
	position:relative;
	text-decoration:none;
}
.pins a.video:after {
	content:'\f04b';
	font-family:fa-solid;
	color:#fff;
	font-size:4em;
	line-height:1;
	width:1em;
	text-align:center;
	position:absolute;
	top:calc(50% - 0.5em);
	left:calc(50% - 0.5em);
	opacity:0.75;
	transition:200ms opacity;
}
.pins a.video:hover:after {
	opacity:1;
}
.pin-data {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.85);
	transition:opacity 200ms;
	opacity:0;
	padding:4em 1em 0.7em 1em;
	text-align:center;
	color:#fff;
	font-weight:500;
}
a:hover .pin-data {
	opacity:1;
}


.squares .pins {
	height:21.6em;
}
.squares .pins ul {
	height:21.6em;
}
.squares .pins a {
	background:rgba(193 196 210 / 23%);
	display:flex;
	width:20em;
	height:20em;
	align-items:center;
	justify-content:center;
	border-radius:0.6em;
}
.squares .pins img,
.squares .pins video {
	width:auto !important;
	height:auto;
	max-width:18em;
	max-height:18em;
}
.rounded-corners .pin-data {
	border-radius:0.6em;
}
.rounded-corners .squares .pins img,
.rounded-corners .squares .pins video {
	border-radius:0.6em;
}

li.comments:after,
li.approved:after {
	content:'\f075';
	font-family:fa-solid;
	font-size:0.9em;
	color:#fff;
	background:var(--elsa);
	width:2.3em;
	height:2.3em;
	line-height:2.3em;
	text-align:center;
	position:absolute;
	border-radius:50%;
	top:0.2em; right:0.2em;
	z-index:1;
}
li.approved:after {
	content:'\f00c';
	background:#61c391;
}
.pin-data h4 {
	margin-bottom:0.2em;
	color:#61c391;
}
.pin-data h4:before {
	content:'\f00c';
	font-family:fa-solid;
	font-size:0.9em;
	margin-right:0.3em;
}
.pin-data h4.comment {
	color:var(--elsa);
	border:0;
	padding:0;
}
.pin-data h4.comment:before {
	content:'\f075';
}
.pin-data p {
	font-size:0.9em;
	padding:0 1.5em;
}
.pin-data span {
	display:block;
}
a:hover .pin-data:after {
	content:'view creative';
	position:absolute;
	bottom:2.4em; left:calc(50% - 4.5em);
	width:9em;
	background:rgba(255,255,255,0.2);
	line-height:2em;
	border-radius:2em;
}
.slide-arrow {
	position:absolute;
	top:calc(50% - 2em);
	width:4em;
	height:4em;
	color:#d0d0d0;
	text-decoration:none;
	border:0;
	background:#fff;
	border-radius:50%;
	overflow:hidden;
	padding:0;
	cursor:pointer;
}
.slide-arrow:hover {
	color:#bbb;
}
.slide-arrow:active {
	color:#aaa;
}
.slide-arrow:before {
	display:block;
	width:100%;
	text-align:center;
	font-size:4em;
	font-family:fa-light;
	line-height:4rem;
	transition:color 150ms;
	line-height:1;
}
.slide-prev {
	left:-5.4em;
}
.slide-next {
	right:-5.4em;
}
.slide-prev:before {
	content:'\f0a8';
}
.slide-next:before {
	content:'\f0a9';
}


/*
—————————————————
Uncommented
—————————————————
*/
.uncommented {
	padding:2em;
	text-align:center;
}
.uncommented h3 {
	margin-bottom:0.7em;
}
.uncommented p {
	margin-bottom:2em;
}
.uncommented li {
	float:left;
	height:10em;
	margin-right:1em;
}
.uncommented li:last-child {
	margin:0;
}

.uncommented a {
	display:block;
}

.uncommented img, .uncommented video {
	display:block;
	height:10em;
	border-radius:0.5em;
}


/*
—————————————————
Board Preview
—————————————————
*/
#board {
	margin-top:2em;
}
#board ul {
	text-align:center;
	font-size:0;
}
#board li {
	display:inline-block;
	width:25%;
	font-size:1rem;
	margin-bottom:3em;
	position:relative;
	padding:0.8em;
	vertical-align:top;
}
#board .three-up li {
	width:26% !important;
}
#board .five-up li {
	width:20%;
}
#board a {
	display:block;
	width:0;
	padding:75% 50%;
	position:relative;
	text-decoration:none;
}
#board img,
#board video {
	display:block;
	box-sizing:border-box;
	border-radius:16px;
	outline:0;
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
}
#board span.caption {
	display:flex;
	align-items:center;
	height:3em;
	padding:0.7em 0.2em 0 3.3em;
	color:#222;
	position:relative;
	font-size:0.9em;
	line-height:1.2;
	font-family:'Segoe UI', cera-pro;
	text-align:left;
}
#board span.caption:before {
	content:'';
	width:2.2em;
	height:2.2em;
	background:#dadada;
	border-radius:50%;
	position:absolute;
	top:0.7em; left:0.5em;
}
#board span.placeholder:after {
	content:'';
	background:#dadada;
	position:absolute;
	top:1.3em; left:3.3em;
	width:calc(100% - 4.5em);
	height:1em;
}
#board .square li {
	width:50%;
}
#board .square a {
	padding:50%;
}
#board .square li:nth-child(2n + 1) {
	clear:left;
}












.thumbnail-pins a {
	width:0;
	height:0;
	padding:50%;
	background:#fff;
	border-radius:16px;
	overflow:hidden;
}
.thumbnail-pins .image {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	padding:1.3em;
	display:flex;
	justify-content:center;
	align-items:center;
	background:rgb(193 196 203 / 25%);
	transition:background-color 150ms;
}
.thumbnail-pins a:hover .image {
	background:rgb(193 196 203 / 30%);
}
.thumbnail-pins img,
.thumbnail-pins video {
	border-radius:6px;
	width:auto;
	max-width:100%;
	max-height:100%;
}



.square-pins a:after,
.square-pins img,
.square-pins video {
	border-radius:0;
}
.stacked .pins li {
	float:none;
	width:auto;
	margin-bottom:5em;
	text-align:center;
}
.stacked .pins a {
	display:inline-block;
}
.stacked .pins a:after {
	display:none;
}
.stacked .pins img,
.stacked .pins video {
	display:inline-block;
	border-radius:0;
	width:auto;
	max-width:100%;
	margin:auto;
	box-shadow:0 0 12px rgba(0,0,0,0.02);
}








.pins .shim {
	display:block;
	position:relative;
}
.pins .image-shim {
	height:0;
}
.pins .shim:after {
	content:'';
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	border-radius:16px;
	background:rgba(0,0,0,0.03);
	transition:background-color 150ms;
}
/* Shimmer */
.pins .image-shim:after {
	background:linear-gradient(to right, #f7f7f7 0%, #ededed 20%, #f7f7f7 40%, #f7f7f7 100%);
	background-size:800px 100%; 
	animation:shimmer 1s linear infinite forwards;
}
@keyframes shimmer {
	0% {
		background-position:-468px 0;
	}
	100% {
		background-position:468px 0;
	}
}
.pins .image-shim-loaded:after {
	background:rgba(0,0,0,0.03);
}
.pins li:hover .shim:after {
	background:rgba(0,0,0,0.09);
}

.pins .image-shim img {
	position:absolute;
	top:0; left:0;
	height:100%;
	opacity:0;
	transition:opacity 250ms;
}
.pins .image-shim img.loaded {
	opacity:1;
}
















.pins .icons {
	display:block;
	height:1.6em;
	margin-top:0.4em;
	text-align:center;
	color:#bbb;
}
.pins .icons span {
	display:inline-block;
	line-height:1.6em;
	margin:0 2em;
	color:#333;
}
.pins .icons span:before {
	font-family:fa-solid;
	float:left;
	width:1.5em;
	text-align:center;
	color:#ccc;
}
.pins .icon-comments:before {
	content:'\f075';
}
.pins .icon-approvals:before {
	content:'\f164';
}
.pins .icons .icon-approvals.icon-active:before {
	color:#61c391;
}


.pins .arrows {
	display:none;
}
.pins .carousel-pin .arrows {
	display:block;
	position:absolute;
	top:calc(50% - 2.5em);
	left:0;
	width:100%;
}
.pins .carousel-pin .arrows:before,
.pins .carousel-pin .arrows:after {
	font:1.5em/2 fa-solid;
	content:'\f053';
	color:#fff;
	width:2em;
	text-align:center;
	float:left;
}
.pins .carousel-pin .arrows:after  {
	content:'\f054';
	float:right;
}




.pins .arrows {
    display: none
}

.pins .carousel-pin .arrows {
    display: block;
    position: absolute;
    top: calc(50% - 2.5em);
    left: 0;
    width: 100%
}

.pins .carousel-pin .arrows:before,.pins .carousel-pin .arrows:after {
    font: 1.5em/2 fa-solid;
    content: '\f053';
    color: #fff;
    width: 2em;
    text-align: center;
    float: left
}

.pins .carousel-pin .arrows:after {
    content: '\f054';
    float: right
}

.overlay {
}

.carousel {
	position:relative;
	margin:auto
}

.carousel-inner {
	width:100%;
	border-radius:16px;
	overflow:hidden;
	position:relative
}

.carousel-inner:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: rgba(0,0,0,.4);
    pointer-events: none;
    opacity: 0;
    transition: opacity 100ms linear
}

.carousel-inner:hover:after {
    opacity: 1
}

.carousel ul {
    height: 100%;
    transition: margin-left 400ms ease-in-out
}

.carousel li {
    float: left;
    height: 100%
}

.carousel img {
    display: block;
    width: 100%;
    xheight: 100%
}

.carousel-nav {
    font: 1.5em/2 fa-solid;
    color: #fff;
    width: 2em;
    text-align: center;
    position: absolute;
    top: calc(50% - 1.5em);
    left: 0;
    z-index: 2;
    cursor: pointer
}

.carousel-nav:after {
    content: '\f053'
}

.carousel-nav-next {
    left: auto;
    right: 0
}

.carousel-nav-next:after {
    content: '\f054'
}

.carousel-dots {
    position: absolute;
    text-align: center;
    bottom: -2.5em;
    left: 0;
    width: 100%
}

.carousel-dot {
    display: inline-block;
    width: 1em;
    height: 1em;
    background: #ddd;
    border-radius: 50%;
    cursor: pointer;
    margin: 0 .3em
}

.carousel-dot-active {
    background: #aaa
}
























/*
—————————————————
Briefing Form
—————————————————
*/

.fancybox-content {
	border-radius:1.2em !important;
}

.brief-step {
	max-width:1300px;
	padding:1.8em;
}
.brief-links {
	height:4em;
	margin:0 auto 1em auto;
	text-transform:lowercase;
	line-height:1.05;
	max-width:60em;
}
.post-content .brief-links {
	margin-top:1em;
}
.post-completed .brief-links {
	margin:0 auto;
}
.brief-links li {
	float:left;
	width:25%;
	text-align:center;
}
.brief-links a {
	display:block;
	height:4em;
	position:relative;
}
.brief-links a:before {
	content:'';
	display:block;
	margin:0 auto 0.3em auto;
	width:1.4rem;
	height:1.4rem;
	border:1px dashed #ccc;
	border-radius:50%;
	box-sizing:border-box;
}
.brief-links li.completed a:before {
	content:'\f00c';
	font-family:fa-solid;
	font-size:0.85rem;
	text-align:center;
	line-height:1.4rem;
	border:0;
	color:#fff;
	background:var(--marge);
	background:#ccc;
}
.brief-links li.active a {
	color:var(--barbie);
}
.brief-links li.active.completed a:before {
	background:var(--barbie);
}
.brief-links a:after {
	content:'\f105';
	font-family:fa-light;
	position:absolute;
	top:0.2em; right:0;
	color:#eee;
	font-size:3em;
	line-height:1;
}
.brief-links li:last-child a:after {
	display:none;
}
.brief-links span {
	display:block;
	font-size:0.9em;
	color:#aaa;
}
.brief-links strong {
	font-size:1.1em;
	font-weight:500;
}


/*
—————————————————
Assets
—————————————————
*/
.asset-summary {
	text-align:center;
}
.asset-summary li {
	display:inline-block;
	vertical-align:top;
	width:15em;
	text-transform:lowercase;
	margin-bottom:-1em;
}
.asset-summary strong {
	display:block;
	font-size:1.1em;
    font-weight:500;
}
.asset-summary strong:before {
	content:'\f07b';
	display:block;
	font-family:fa-solid;
	font-size:2.2em;
	width:3em;
	text-align:center;
	color:#e9e9e9;
	margin:auto;
}
.asset-summary .has-files strong:before {
	color:var(--marge);
}
.asset-summary span {
	display:block;
	color:#aaa;
	position:relative;
    top:-4.55em;
	font-size:0.8em;
	font-weight:500;
}
.asset-summary .has-files span {
	top:-3.8em;
	font-size:1em;
	color:#fff;
}

/*
—————————————————
Alerts
—————————————————
*/
.confirm-message, .error-message {
	padding:0.5rem 2rem 0.5rem 1rem;
	color:#fff;
	background:#61c391;
	box-sizing:border-box;
	font-weight:500;
	position:relative;
	border-radius:0.6em;
	margin-bottom:1em;
}
.error-message {
	background:var(--leela);
}
#form .confirm-message, #form .error-message {
	margin:-3em -3em 2em -3em;
	border-radius:0.6em 0.6em 0 0;
}
.confirm-message {
	padding-left:2.5rem;
}
.confirm-message:before {
	font-family:fa-solid;
	content:'\f00c';
	margin-right:0.5em;
	position:absolute;
	top:0.5rem; left:1rem;
}
.confirm-message .close,
.error-message .close {
	font-family:fa-solid;
	position:absolute;
	top:0; right:0;
	padding:0.5em 1em;
	cursor:pointer;
}
.confirm-message .close:before,
.error-message .close:before {
	font-family:fa-solid;
	content:'\f00d';
}


/*
—————————————————
Form Elements
—————————————————
*/
#form {
	padding:3em;
	border-radius:1em;
	background:rgba(193 196 203 / 17%);
	width:100%;
	margin-bottom:1em;
	position:relative;
}


#form h2 {
	border:0;
}
#form h3 {
	padding-top:0.7em;
}
#form h3:first-child {
	padding-top:0;
}
#form p, #form .field-wrapper {
	margin-bottom:1.3em;
}
#form p:last-child, #form .field-wrapper:last-child {
	margin-bottom:0.3em;
}
#form label {
	display:inline-block;
	padding:0.15em 0.6em calc(0.15em - 1px) 0.6em;
	border-radius:5px 5px 0 0;
	font-size:0.8666em;
	font-weight:500;
	transition:background-color 150ms linear;
	vertical-align:bottom;
	z-index:1;
	color:#4987c3;
	background:#d5e6f3;
}


#form.briefing-form {
	padding-bottom:2.4em;
}
#form.briefing-form p {
	margin-bottom:1.8em;
}
#form.briefing-form p:last-child {
	margin-bottom:0;
}
xh3.step-heading {
	margin-bottom:1.8em;
}
xh3.step-heading span {
	display:inline-block;
	color:#fff;
	background:var(--barbie);
	padding:0.1em 0.7em;
	border-radius:3em;
}
#form.briefing-form label {
	padding:0.3em 0.9em;
	font-size:0.9333em;
}
#form.briefing-form textarea,
#form.briefing-form .textarea-wrapper:after {
	padding:0.8em 0.9em;
	min-height:3em;
}
.upload-folder h2 {
	font-size:1.2em;
	margin-bottom:2em;
}
.upload-folder .button {
	position:absolute;
	top:1.8em; right:1.8em;
	font-size:0.866em;
}


.conditional-field {
	margin-top:1em;
}
.stock-note {
	display:block;
	padding:0.8em;
	font-size:0.9em;
	background:#ffffdd
}


#form .checkboxes label {
	float:none;
	background:none;
	padding:0 0 0 0.5rem;
	position:relative;
	top:-0.1em;
	user-select:none;
	color:inherit;
	font-weight:normal;
}
#form .file-list-checkboxes label {
	background:none;
	color:inherit;
	font-weight:normal:
}
#form .switches label {
	padding-left:0;
	font-weight:normal;
	font-size:0.9375em;
	color:inherit;
	background:none;
}
#form .select-all {
	margin-bottom:0.7em;
}
#form .select-all label {
	font-size:1.2em;
	font-weight:500;
	letter-spacing:-0.02em;
}
#form .round-label {
	float:left;
	width:3em;
	margin-top:0.35em;
}
#form .round-label + input.text {
	width:calc(100% - 3em);
	border-radius:5px;
}
#form .tooltip {
	display:inline-block;
	margin-left:0.6em;
	font-size:0.9em;
	line-height:1.4;
}
#form .tooltip:after {
	content:'\f121';
	font-family:fa-solid;
	color:#999;
}







#form label.has-tooltip {
	display:block;
	position:relative;
	padding-right:3em !important;
}
#form .tooltip {
	position:absolute;
	top:0; right:0;
	cursor:default;
	width:1.8em;
	text-align:center;
}
#form .tooltip:before {
	content:'\f059';
	font-family:fa-solid;
	color:#339ad4;
}
#form .tooltip-text {
	position:absolute;
	bottom:calc(100% + 0.5em); right:-1.6em;
	max-width:65%;
	color:#fff;
	background:linear-gradient(to bottom, #444, #333);
	box-shadow:0 0 1.2em rgba(0,0,0,0.15);
	border-radius:6px;
	padding:0.8em 1em;
	font-size:0.875em;
	pointer-events:none;
	opacity:0;
	transition:200ms;
}
#form .tooltip:hover + .tooltip-text {
	bottom:calc(100% + 1em);
	opacity:1;
}
#form .tooltip-text:after {
	content:'';
	width:0;
	height:0;
	border-style:solid;
	border-width:0.8em 0.8em 0 0.8em;
	border-color:#333 transparent;
	position:absolute;
	top:100%; right:1.8em;
}
















#form input.text,
#form textarea,
#form select {
	display:block;
	font-size:1em;
	width:100%;
	border:none;
	border-bottom:1px solid #d2d2d2;
	border-radius:0 5px 5px 5px;
	box-shadow:0 0.1em 0.2em rgba(0,0,0,0.04);
	transition:border-color 100ms;
	line-height:1.3;
	box-sizing:border-box;
	padding:0.5em 0.6em;
	outline:none;
	background:#fff;
}
#form input.text:focus,
#form textarea:focus,
#form select:focus {
	outline:0;
	border-bottom-color:#cfcfcf;
	box-shadow:0 0.1em 0 rgba(0,0,0,0.09);
}

#form input.text::placeholder,
#form textarea::placeholder {
	color:#aaa;
}



#form .textarea-wrapper {
	display:block;
	position:relative;
	min-height:2.75em;
}
#form .textarea-wrapper textarea {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
}
#form textarea {
	resize:vertical;
}
#form .textarea-wrapper:after {
	content:attr(data-content) ' ';
	visibility:hidden;
	white-space:pre-wrap;
	display:block;
	padding:0.5em 0.6em;
	border-bottom:1px solid #fff;
	line-height:1.3;
}













#form p.focused label {
	xbackground:#6cbbe8;
	xcolor:#fff;
}



#form .schedule-send select {
	width:auto;
	display:inline;
}


#form .auto-width select {
	display:inline;
	width:auto;
}
#form select.auto-width {
	width:auto;
}
#form .date-picker label {
	display:block;
	width:10em
}
#form .date-picker select {
	display:inline;
	width:auto;
}

.no-label {
	border-radius:5px !important;
}
:root {
    --ck-z-default: 100000 !important;
    --ck-z-modal: calc( var(--ck-z-default) + 999 ) !important;
}
#form .selector label {
	background:none !important;
	padding:0;
	font-size:0.875em;
	font-weight:normal;
}
#form .selector input {
	margin-right:0.3em;
}
#form .error label {
	background:var(--barbie) !important;
	color:#fff !important;
}
#form .yes-no-error label:first-child {
	color:var(--barbie) !important;
}
#form .error input.text:focus,
#form .error textarea:focus,
#form .error select:focus {
	border-color:var(--barbie) !important;
}
.floated-fields {
	width:102%;
	margin-right:-2%;
}
.floated-fields p,
.floated-fields .field-wrapper {
	float:left;
	margin-right:2%;
}
.floated-fields-large {
	width:101.5%;
	margin-right:-1.5%;
}
.floated-fields-large p,
.floated-fields-large .field-wrapper {
	margin-right:1.5%;
}
.floated-fields input.text,
.floated-fields textarea,
.floated-fields select {
	width:100%;
}
p.form-buttons {
	max-width:35em;
}
#form.large-form + p.form-buttons,
p.form-buttons-large {
	max-width:100%;
}
.form-buttons .button {
	margin-right:0.6em;
}
.form-column-left {
	float:left;
	width:50%;
	padding-right:2em;
}
.form-column-right {
	float:right;
	width:50%;
	border-left:1px solid #ccc;
	padding-left:2em;
}
.form-section-wrapper,
.form-section {
	margin-bottom:2.8em;
}
.form-section:last-child,
#form .floated-fields:last-child p {
	margin-bottom:0;
}
#form.large-form .checkboxes label {
	background:none;
	user-select:none;
}
#form.large-form p.form-buttons {
	padding:1.2em;
	margin:1.8em -1.2em -1.2em -1.2em;
	background:#ddd;
	border-radius:0 0 8px 8px;
}
#form .tbc {
	position:absolute;
	top:-0.2em; right:0;
}
#form .tbc label {
	position:static;
	color:inherit !important;
	background:none !important;
}
.link-right {
	float:right;
	color:var(--barbie);
}
#hubspot-messages-iframe-container {
	display:none!important;
}
#form .input-grid {
	margin-bottom:1em;
}
#form .input-grid:last-child {
	margin-bottom:0;
}
#form .input-grid p {
	height:2.7em;
	margin:0;
}
#form .input-grid input,
#form .input-grid select {
	float:left;
	width:10em;
	margin-right:0.4em;
	border-radius:5px !important;
}
#form .input-grid select {
	width:18em;
}
#form .input-grid input::placeholder {
	color:#bbb;
}
#form .input-grid input.currency-label {
	width:5em;
}
#form .input-grid input.amount {
	width:7em;
}
#form .input-grid input.who {
	width:16%;
}
#form .input-grid input.what {
	width:calc(64% - 0.8em);
}
#form .input-grid input.days {
	width:20%;
	margin-right:0;
}
#form .input-grid input.channel-status {
	width:11em;
}
#form .input-grid input.channel-status + select {
	width:calc(100% - 11.4em);
	margin-right:0;
}

.floated-lists div {
	float:left;
	width:15em;
	padding-right:3em;
	padding-bottom:2em;
}
.floated-lists h3 {
	font-size:1.1rem;
	min-height:3em;
}



#form .configurator {
	padding:1.4em;
	background:#e4e4e4;
	border-radius:8px;
}
#form .configurator h3 {
	margin-top:1.4em;
	padding-top:0;
	border-bottom:1px solid #bbb;
    padding-bottom:0.4em;
	margin-bottom:0.4em;
}
#form .configurator h3:first-child {
	margin-top:0;
}
#form .configurator label {
	background:none;
	padding:0;
	color:#666;
}
#form .configurator p {
	margin-bottom:0.2em;
}
#form .configurator input.text, #form .configurator textarea, #form .configurator select {
	border-radius:4px;
	font-size:0.9em;
}












#form .select-list label {
	display:block;
	margin-bottom:0.8em;
	border-radius:0.3em;
	padding:0.3em 0.5em;
	text-align:center;
}
#form .select-list ul {
	margin-bottom:1em;
}
#form .select-list li {
	margin-bottom:0.3em;
	user-select:none;
}
#form .select-list input {
	display:none;
}
#form .select-list input + label {
	display:flex;
	position:relative;
	color:inherit;
	background:#fff;
	border:2px solid #fff;
	cursor:pointer;
	box-shadow:0 0 1em rgba(0,0,0,0.03);
	font-size:1rem;
	font-weight:normal;
	align-items:center;
	justify-content:center;
	padding:0.2em 0.5em;
	margin:0;
}
#form .select-list input + label:hover {
	border-color:#d5e6f3;
}
#form .select-list input:checked + label {
	color:#fff;
	background:#4987c3;
	border-color:#4987c3;
}


#form #objectives {
	margin-bottom:2em;
}
#form #objectives li {
	float:left;
	width:calc(33.333% - 1em);
	margin-right:1em;
	margin-bottom:1em;
}
#form #objectives.objectives-scj li {
	width:calc(25% - 1em);
}
#form #objectives input + label {
	height:6em;
	padding-left:5em;
	text-align:left;
	justify-content:left;
}
#form #objectives label:before {
	content:'';
	font-family:fa-light;
	font-size:2em;
	position:absolute;
	top:1em; left:0.7em;
	line-height:1;
	color:#cddbec;
	color:rgba(73 135 195 / 40%);
	width:1.2em;
	text-align:center;
}
#form #objectives li.sales label:before   { content:'\f07a' }
#form #objectives li.leads label:before   { content:'\e0e5' }
#form #objectives li.traffic label:before { content:'\f245' }
#form #objectives li.brand label:before   { content:'\f02b' }
#form #objectives li.reach label:before   { content:'\f0a1' }
#form #objectives li.app label:before     { content:'\f3ce' }

#form #objectives input:checked + label:before {
	content:'\f00c';
	color:rgba(255,255,255,0.7);
}




#demographics  {
	width:calc(100% + 2em);
	margin-right:-2em;
	margin-bottom:2em;
}
#demographics div {
	float:left;
	width:calc(25% - 2em);
	margin-right:2em;
}


#project-details-selector  {
	width:calc(100% + 2em);
	margin-right:-2em;
	margin-bottom:2em;
}
#project-details-selector div {
	float:left;
	width:calc(33.333% - 2em);
	margin-right:2em;
}
#project-details-selector div {
}
#form #project-details-selector .select-list input + label {
	padding:0.7em;
}
#form #project-details-selector .select-list-detailed input + label {
	padding:2em 3em;
}
#form .select-list-detailed {
	width:calc(66.666% - 2em);
}
#form .select-list-detailed input + label,
#form .select-list-detailed input + label b {
	display:block;
}
#form .select-list-detailed input + label b {
	margin-bottom:0.1em;
	font-size:1.3em;
	font-weight:500;
}
#form .select-list-detailed input + label span {
	display:block;
	margin:auto;
	max-width:30em;
}
#form .select-list-detailed input + label:before {
	content:'';
	font-family:fa-light;
	font-size:2em;
	position:absolute;
	top:0.6em; left:0.6em;
	line-height:1;
	color:#cddbec;
	color:rgba(73 135 195 / 40%);
	width:1.2em;
	text-align:center;
}
#form .select-list-detailed input:checked + label:before {
	content:'\f00c';
	color:rgba(255,255,255,0.7);
}


#brief-builder  {
	width:calc(100% + 2em);
	margin-right:-2em;
	margin-bottom:2em;
}
#brief-builder div {
	float:left;
	width:calc(33.33% - 2em);
	margin-right:2em;
}
#form #brief-builder label {
	display:flex;
	height:3em;
	align-items:center;
	justify-content:center;
}



#form .yes-no,
#form .radio {
	margin:0.5em 0 2.2em 0 !important;
	padding-left:1em;
	border-left:0.3em solid #d8e5f2;
}
#form .yes-no br {
	display:none;
}
#form .yes-no input {
	position:relative;
	left:1em;
	opacity:0;
}
#form .yes-no label:first-child,
#form .radio label:first-child {
	display:block;
	padding:0;
	background:none;
	margin-bottom:0.7em;
	font-weight:normal;
	color:inherit;
	max-width:55em;
}
#form .radio span label {
	display:inline;
	background:none;
}
#form .yes-no span label {
	display:inline-block;
	background:#fff;
	border-bottom: 1px solid #d2d2d2;
    box-shadow: 0 0.1em 0.2em rgb(0 0 0 / 4%);
	color:#777;
	font-size:1rem !important;
	line-height:2em;
	border-radius:1em;
	padding:0 1em;
	min-width:5em;
	text-align:center;
	cursor:pointer;
	position:relative;
	left:-1em;
	user-select:none;
	box-sizing:border-box;
}
#form .yes-no span label:hover {
	background:#fff;
}
#form .yes-no span label:active {
	border-color:#bbb;
	box-shadow:0 0 0.7em #e5e5e5;
}
#form .yes-no span :checked+label {
	color:#fff;
	background:#4987c3;
	border:0;
	box-shadow:0 0 0.7em #e5e5e5;
}


.selection-lozenges {
	margin-top:2em;
}
.selection-lozenges li {
	display:inline-block;
	line-height:2em;
	border-radius:1em;
	margin:0 0.5em 0.7em 0;
	font-weight:500;
	padding:0 2.2em 0 1em;
	position:relative;
	user-select:none;
	color:#fff;
	background:#4987c3;
}
.selection-lozenges li strong {
	font-weight:500;
}
.selection-lozenges li .remove {
	position:absolute;
	top:0.5em; right:0.5em;
	width:1em; height:1em;
	cursor:pointer;
}
.selection-lozenges li .remove:after {
	content:'\f057';
	display:block;
	font-family:fa-solid;
	width:1em;
	height:1em;
	line-height:1em;
	text-align:center;
}


.starters li {
	display:inline-block;
	line-height:2em;
	border-radius:1em;
	margin:0 0.3em 0.7em 0;
	font-weight:500;
	padding:0 1em;
	position:relative;
	user-select:none;
	color:#fff;
	background:#4987c3;
	cursor:pointer;
	font-size:0.866em;

	color:#4987c3;
	background:#d5e6f3;
}





#brief-steps ul  {
	max-width:50em;
	margin:auto;
	border-radius:0.7em;
	overflow:hidden;
	height:2.6em;
	background:#eaebed;
	margin-bottom:2em;
	padding:0.3em;
}
#brief-steps li {
	float:left;
	width:calc(25% - 0.225em);
	margin-right:0.3em;
	line-height:2em;
	text-align:center;
	cursor:pointer;
	border-radius:0.5em;
	transition:background-color 100ms;
}
#brief-steps li:last-child {
	margin:0;
}
#brief-steps li:hover {
	background:rgba(255,255,255,0.8);
}
#brief-steps li.selected {
	color:#fff;
	background:#ff317c;
}








/*
—————————————————
Upload Assets
—————————————————
*/
#uploads-wrapper {
	display:table;
	border-spacing:2em;
	width:calc(100% + 6em);
	margin:-1.6em -4em -2em -2em;
	table-layout:fixed;
}
.upload-folder {
	display:table-cell;
	background:#fff;
	box-shadow: 0 5px 10px #eaeaea;
	border-radius:0.6em;
	padding:1.5em;
	position:relative;
}
.upload-folder .button {
	position:absolute;
	top:1.8em; right:1.8em;
}
.upload-folder .progress-wrapper {
	opacity:0;
}
.upload-folder .progress-text {
	font-size:0.866em;
	text-align:center;
	margin-bottom:0.3em !important;
	height:1.5em;
}
.upload-folder .progress {
	width:100%;
	height:0.7em;
	margin-bottom:1em;
	background:rgba(193 196 203 / 24%);
	border-radius:0.35em;
}
.upload-folder .progress-bar {
	background:#ff317c;
	width:0;
	height:100%;
	border-radius:0.35em;
	transition:width 150ms;
	box-shadow:inset 0 2px 9px rgba(255,255,255,0.15), inset 0 -2px 6px rgba(0,0,0,0.3);
	position:relative;
	overflow:hidden;
}
.upload-folder .progress-bar-success {
	background:#61c391;
}
.upload-folder .progress-bar:after {
	content:'';
	position: absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	background-image:linear-gradient(
		-45deg, 
		rgba(255, 255, 255, .2) 25%, 
		transparent 25%, 
		transparent 50%, 
		rgba(255, 255, 255, .2) 50%, 
		rgba(255, 255, 255, .2) 75%, 
		transparent 75%, 
		transparent
	);
	background-size:3em 3em;
	animation:move 2s linear infinite;
}

@keyframes move {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position:3em 3em;
  }
}



.upload-folder .progress-bar-no-transition {
	transition:none !important;
}


.upload-widgets {
	width:calc(100% + 0.8em);
	margin-right:0.8em;
	height:4em;
	margin-bottom:1em;
}
.upload-widgets li {
	float:left;
	width:calc(25% - 0.8em);
	width:calc(33.333% - 0.8em);
	height:4em;
	margin-right:0.8em;
	position:relative;
	cursor:pointer;
	background:rgba(193 196 203 / 17%);
	border-radius:0.5em;
	user-select:none;
}
.upload-widgets li:hover {
	background:rgba(193 196 203 / 24%);
}
.upload-widgets li:active {
	background:rgba(193 196 203 / 31%);
}
.upload-widgets li.local input {
	opacity:0;
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	z-index:1;
	cursor:pointer;
}
.upload-widgets li.cloud:before {
	content:'';
	position:absolute;
	top:0.4rem; left:0;
	width:100%;
	height:2.2em;
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	xfilter:grayscale(1);
	xopacity:0.6;
	transition:all 150ms;
	pointer-events:none;
}
.upload-widgets li:hover:before {
	filter:grayscale(0);
	opacity:1;
}
.upload-widgets li.cloud-local:before {
	background-image:url(/Images/icon-cloud-local.png);
}
.upload-widgets li.cloud-box:before {
	background-image:url(/Images/icon-cloud-box.png);
}
.upload-widgets li.cloud-dropbox:before {
	background-image:url(/Images/icon-cloud-dropbox.png);
}
.upload-widgets li.cloud-google-drive:before {
	background-image:url(/Images/icon-cloud-google-drive.png);
}
.upload-widgets li.cloud-onedrive:before {
	background-image:url(/Images/icon-cloud-onedrive.png);
}
.upload-widgets span {
	font-size:0.7333em;
	text-align:center;
	position:absolute;
	bottom:0.3rem; left:0;
	width:100%;
	line-height:1rem;
	color:#777;
	pointer-events:none;
}
.small-upload-widgets {
	height:3em;
}
.small-upload-widgets li {
	height:3.2em;
	font-size:0.8em;
}
.small-upload-widgets span {
	display:none;
}


.assets-list li {
	border-top:0.05em solid #ddd;
	height:2em;
	clear:left;
	font-size:0.8em;
}
.assets-list li li {
	padding-left:1em;
}
.assets-list li ul {
	display:none;
}
.assets-list h3 {
	margin-bottom:0.3em;
	padding-top:0 !important;
}
.assets-list h3 + ul {
	margin-bottom:1.4em;
	border-bottom:0.05em solid #ddd;
}
.assets-list a:hover {
	color:var(--barbie);
}
.assets-list span.filename {
	float:left;
	padding:0.5em 0;
	line-height:1;
	width:calc(100% - 8em);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.assets-list span.filename:before {
	content:'\f15b';
	font-family:fa-light;
	float:left;
	width:1.2em;
	text-align:center;
	margin-right:0.3em;
	color:#94b8d3;
}
.assets-list span.filename em {
	display:inline-block;
	font-size:0.8em;
	font-weight:500;
	padding:0.2em 0.5em;
	background:#a085c4;
	color:#fff;
	border-radius:1em;
	margin-left:1em;
}
.assets-list span.zip:before {
	content:'\f07b';
}
.assets-list span.filesize {
	float:left;
	padding:0.5em 0;
	line-height:1;
	width:6em;
	text-align:right;
}
.assets-list span.delete-file {
	float:right;
	padding:0.5em 0;
	line-height:1;
	width:2em;
	text-align:right;
	cursor:pointer;
}
.assets-list span.delete-file:after {
	content:'\f2ed';
	font-family:fa-light;
	color:#94b8d3;
}


.asset-selector-list {
}
.asset-selector-list h3 {
	margin-bottom:0.3em;
	padding-top:0 !important;
}
.asset-selector-list h3 + ul {
	margin-bottom:1.4em;
}
.asset-selector-list li {
	font-size:0.8em;
	position:relative;
}

.asset-selector-list input {
	position:absolute;
	top:0.5em; left:0.5em;
}
.asset-selector-list label {
	display:block;
	cursor:pointer;
	height:2em;
	line-height:2em;
	border-radius:0.9em;
	padding:0 0.4em 0 2em;
	transition:background-color 150ms;
	user-select:none;
}
.asset-selector-list label:hover {
	background:#ddd;
}




/*
—————————————————
Quote List
—————————————————
*/

.quote-list {
	margin-top:2em;
	margin-bottom:-1.6em;
}
.quote-list a {
	float:left;
	width:15em;
	height:7.4em;
	color:inherit;
	background:rgba(193 196 210 / 17%);
	border-radius:6px;
	margin:0 1.6rem 1.6em 0;
	text-align:center;
	padding:0.7em;
	xbox-shadow:0 5px 10px #eaeaea;
	position:relative;
	text-decoration:none;
	box-sizing:border-box;
}
.quote-list a:after {
	font-family:fa-light;
	content:'\f105';
	position:absolute;
	top:calc(50% - 0.5em); left:100%;
	width:1.6rem;
	font-size:2.4rem;
	line-height:1;
	color:#ddd;
	box-sizing:border-box;
}
.quote-list a:last-child:after {
	content:'';
}
.quote-list a.invoice:after {
	content:'';
}
.quote-list .heading {
	display:block;
}
.quote-list .job-number {
	display:block;
	font-size:0.875rem;
	margin-bottom:0.3em;
	background:none;
}
.quote-list .status-bar {
	position:absolute;
	bottom:0; left:0;
	border-radius:0 0 6px 6px;
	padding:0.15em;
	width:100%;
	font-weight:500;
	box-sizing:border-box;
	line-height:1.6rem;
}
.quote-list .accepted {
	color:#fff;
	background:#61c391;
}
.quote-list .sent,
.quote-list .latest-version {
	color:#fff;
	background:#006aa7;
}
.quote-list .unpaid {
	color:#fff;
	background:#ff317c;
}
.quote-list .status-bar:before {
	font-family:fa-solid;
	font-weight:normal;
	margin-right:0.3em;
}
.quote-list .status-bar:after {
	font-family:fa-solid;
	font-weight:normal;
	margin-left:0.3em;
}
.quote-list .accepted:before {
	content:'\f00c';
}
.quote-list .sent:before {
	content:'\f017';
}
.quote-list .unpaid:after {
	xcontent:'\f054';
}



/*
—————————————————
SOW & Brief
—————————————————
*/
.section-readonly {
	margin-bottom:2.4em;
	position:relative;
}
.section-readonly h3.section-heading {
	float:left;
	font-size:1.1em;
	color:#fff;
	background:#095d9d;
	padding:0.4em 1.4rem !important;
	border-radius:0.5rem 0.5rem 0 0;
	margin:0;
	outline:0;
}
.section-readonly .section-content {
	clear:left;
	background:#fff;
	padding:1.4em;
	border-radius:0 0 0.5rem 0.5rem;
	border-bottom:3px solid #dadbdd;
	position:relative;
}
.section-readonly .section-hero-image {
	display:none;
	position:absolute;
	top:0; right:0;
	width:18em;
	height:100%;
	border-radius:0 0.6em 0.6em 0;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
	background-color:#dadce4;
}
.section-readonly .section-hero-image .button {
	width:6em;
	position:absolute;
	bottom:1em; left:calc(50% - 3em);
	background:#00000044;
	color:#fff;
}
.section-locked {
	xopacity:0.5;
	xpointer-events:none;
}
.section-has-image .section-content {
	padding-right:20em;
}
.section-has-image .section-hero-image {
	display:block;
}


.section-readonly dl {
	
}
.section-readonly dt {
	float:left;
	clear:both;
	width:12rem;
	padding:0.2em 0.3em;
	font-weight:500;
	outline:0;
}
.section-readonly dd {
	float:right;
	width:calc(100% - 13rem);
	padding:0 0 1.8em 1em;
	border-left:1px solid #ccc;
	min-height:3em;
	outline:0;
}
.section-readonly dd:last-child {
	padding-bottom:0.5em;
}
.section-focused h3.section-heading {
	background:var(--barbie);
}
.section-comments {
	width:28em;
	position:absolute;
	top:2.4em; left:calc(100% + 2.5em);
	border-left:3px solid var(--barbie);
	border-radius:0.5em;
	padding:1.6em;
	background:#fff;
	display:none;
}
.section-focused .section-comments {
	display:block;
}



/*
—————————————————
Brief Editor
—————————————————
*/
.brief-editor-wrapper {
	background:#f1f1f4;
}
.brief-editor-wrapper h1 span {
	font-weight:normal;
}
.brief-editor-wrapper .section-readonly .section-content {
	border-radius:0 0.6em 0.6em 0.6em;
}
#page-dirty {
	display:none;
	color:#fff;
	background:var(--leela);
	margin:0 -0.8em -0.8em -0.8em;
	padding:0.4em 1.2em;
	border-radius:0 0 0.5em 0.5em;
}
#page-dirty a {
	display:inline-block;
	background:rgba(255,255,255,0.3);
	color:var(--leela);
	font-size:0.8em;
	font-weight:500;
	margin-left:1em;
	padding:0 0.6em;
	border-radius:1em;
}
#editor-panel {
	position:relative;
	padding:0 3em 3em 3em;
	transition:background-color 150ms;
	z-index:1;
}
#info-panel {
	position:absolute;
	top:1em; left:1em;
	width:36em;
	height:calc(100vh - 2em);
	padding:1em;
	border-radius:1em;
	background:#f1f1f4;
	z-index:3;
}
#editor-panel + #info-panel {
	position:fixed;
	left:auto; top:0; right:0;
	overflow:hidden;
	background:#dadce4;
	height:100%;
	padding:1.6em;
	border-radius:0;

	background:none;
	padding:0;
	top:15.3em;
    right:13em;
	height:auto;
}
#editor-panel + #info-panel #task-content {
	border-radius:0.5em;
	height:auto;
	overflow:hidden;
	border-left:3px solid var(--barbie);
}


.brief-editable dt:hover,
.brief-editable .subsection-markup:hover {
	background:#f4f4f7;
}
.brief-editable dt:focus,
.brief-editable .subsection-markup:focus {
	background:#fffddd;
}
.brief-editable dd p:first-child,
.brief-editable dd ul:first-child {
	margin-top:0 !important;
}
.brief-editable dd p:last-child,
.brief-editable dd ul:last-child {
	margin-bottom:0 !important;
}
.comments-selector {
	position:absolute;
	top:0; right:2em;
	cursor:pointer;
}
.brief-editable dd .subsection-markup {
	background:#fff;
	padding:0.2em 0.3em !important;
	border:0 !important;
	border-radius:0 !important;
	box-shadow:none !important;
	outline:0 !important;
}
.brief-editable dd.editing {
	position:relative;
}
.brief-editable dd.editing .subsection-markup {
	pointer-events:none;
	border:1px solid orange !important;
	background:#fefbf5;
	position:relative;
}
.brief-editable span.editing-detail {
	display:none;
}
.brief-editable dd.editing span.editing-detail {
	display:block;
	background:orange;
	color:#fff;
	position:absolute;
	top:0; right:0;
	font-size:0.8em;
	font-weight:500;
	padding:0.1em 0.3em;
}


.brief-editable dd .subsection-markup h2:first-child,
.brief-editable dd .subsection-markup h3:first-child,
.brief-editable dd .subsection-markup h4:first-child,
.brief-editable dd .subsection-markup p:first-child {
	margin-top:0 !important;
}
.brief-editable dd .subsection-markup h2,
.brief-editable dd .subsection-markup h3,
.brief-editable dd .subsection-markup h4 {
	font-weight:500;
}
.brief-editable dd .subsection-markup h2 + h3 {
	padding-top:0;
}
.brief-editable dd .subsection-markup p,
.brief-editable dd .subsection-markup h4,
.brief-editable dd .subsection-markup blockquote {
	margin-bottom:1em;
}
.brief-editable dd .subsection-markup {
	counter-reset:termscounter;
}
.brief-editable dd .subsection-markup a {
	color:#f32d75;
}
.brief-editable dd .subsection-markup ol {
	padding-left:1.8em;
	margin:0 0 1.2em 0;
}
.brief-editable dd .subsection-markup ol li {
	padding-left:0.5em;
	margin-bottom:0.4em;
	list-style:none;
}
.brief-editable dd .subsection-markup ol li:before {
	content:counter(termscounter) '. ';
	counter-increment:termscounter;
	display:inline-block;
	width:1.8em;
	margin-left:-1.8em;
}
.brief-editable dd .subsection-markup ol li ol {
	counter-increment:none;
	margin:0.4em 0 1.2em 1.3em;
}
.brief-editable dd .subsection-markup ol li ol li {
	list-style:lower-alpha outside;
}
.brief-editable dd .subsection-markup ol li ol li:before {
	counter-increment:none;
	content:'';
}
.brief-editable dd .subsection-markup ul {
	padding-left:2.3em;
	margin:0 0 1.2em 0;
}
.brief-editable dd .subsection-markup ul li {
	list-style:disc;
	margin-bottom:0.4em;
}









/*
—————————————————
CK Editor
—————————————————
*/
.ck-editor__editable_inline,
.ck-editor__editable_inline.ck-focused {
	background:#fff;
	padding:0.2em 0.3em !important;
	border:0 !important;
	border-radius:0 !important;
	box-shadow:none !important;
	outline:0 !important;
}
.ck-editor__editable_inline.ck-focused {
	outline:0;
}
.ck-editor__editable_inline h2:first-child,
.ck-editor__editable_inline h3:first-child,
.ck-editor__editable_inline h4:first-child,
.ck-editor__editable_inline p:first-child {
	margin-top:0 !important;
}
.ck-editor__editable_inline h2,
.ck-editor__editable_inline h3,
.ck-editor__editable_inline h4 {
	font-weight:500;
}
.ck-editor__editable_inline h2 + h3 {
	padding-top:0;
}
.ck-editor__editable_inline p,
.ck-editor__editable_inline h4,
.ck-editor__editable_inline blockquote {
	margin-bottom:1em;
}
.ck-editor__editable_inline {
	counter-reset:termscounter;
}
.ck-editor__editable_inline a {
	color:#f32d75;
}
.ck-editor__editable_inline ol {
	padding-left:1.8em;
	margin:0 0 1.2em 0;
}
.ck-editor__editable_inline ol li {
	padding-left:0.5em;
	margin-bottom:0.4em;
	list-style:none;
}
.ck-editor__editable_inline ol li:before {
	content:counter(termscounter) '. ';
	counter-increment:termscounter;
	display:inline-block;
	width:1.8em;
	margin-left:-1.8em;
}
.ck-editor__editable_inline ol li ol {
	counter-increment:none;
	margin:0.4em 0 1.2em 1.3em;
}
.ck-editor__editable_inline ol li ol li {
	list-style:lower-alpha outside;
}
.ck-editor__editable_inline ol li ol li:before {
	counter-increment:none;
	content:'';
}
.ck-editor__editable_inline ul {
	padding-left:2.3em;
	margin:0 0 1.2em 0;
}
.ck-editor__editable_inline ul li {
	list-style:disc;
	margin-bottom:0.4em;
}

/*
—————————————————
Projects
—————————————————
*/
#boards {
	width:calc(100% + 2em);
	margin-right:-2em;
}
#boards li {
	float:left;
	width:calc(16.666% - 2em);
	margin:0 2em 3em 0;
	position:relative;
}
#boards li:nth-child(6n + 1) {
	clear:left;
}
#boards a {
	display:block;
	text-decoration:none;
	color:inherit;
	text-align:center;
}
#boards span.cover {
	display:block;
	padding:75% 50%;
	background-repeat:no-repeat;
	background-position:top center;
	background-size:cover;
	margin-bottom:0.6em;
	position:relative;
	border-radius:8px;
}
#boards span.cover-logo {
	background-size:128px auto;
	background-position:center;
}
#boards span.cover:after {
	content:'';
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	border-radius:8px;
	background:rgba(0,0,0,0.03);
	transition:background-color 150ms;
}
#boards a:hover span.cover:after {
	background:rgba(0,0,0,0.1);
}
#boards strong {
	display:block;
	font-weight:normal;
	overflow-wrap:break-word;
}
#boards span.viewed {
	display:block;
	color:#aaa;
	font-size:0.875em;
}







/*
—————————————————
Terms
—————————————————
*/

.terms-box {
	padding:1.5em;
	background:rgba(255,255,255,0.8);
	border-radius:5px;
	border:1px solid #ddd;
	counter-reset:termscounter;
}
.terms-box h2 {
	text-transform:none;
}
.terms-box a, dd a {
	color:#f32d75;
}
.terms-box ol {
	padding-left:1.8em;
	margin:0 0 1.2em 0;
}
.terms-box ol li {
	padding-left:0.5em;
	margin-bottom:0.4em;
	list-style:none;
}
.terms-box ol li:before {
	content:counter(termscounter) '. ';
	counter-increment:termscounter;
	display:inline-block;
	width:1.8em;
	margin-left:-1.8em;
}
.terms-box ol li ol {
	counter-increment:none;
	margin:0.4em 0 1.2em 1.3em;
}
.terms-box ol li ol li {
	list-style:lower-alpha outside;
}
.terms-box ol li ol li:before {
	counter-increment:none;
	content:'';
}
.terms-box ul, ul.bullet {
	padding-left:2.3em;
	margin-bottom:1em;
}
.terms-box ul li, ul.bullet li {
	list-style:disc;
	margin-bottom:0.4em;
}
.terms-box table {
	border:1px solid #ddd;
	margin-bottom:1.2em;
	margin-left:2.3em;
}
.terms-box table.full-width {
	width:calc(100% - 2.3em);
}
.terms-box table + p {
	margin-left:2.3em;
}
.terms-box table tr {
	border-bottom:1px solid #ddd;
}
.terms-box table th {
	background:#eee;
	padding:0.4em 2em 0.4em 0.7em;
}
.terms-box table td {
	padding:0.4em 2em 0.4em 0.7em;
}
.terms-box table tr:last-child,
.terms-box table td:last-child {
	padding-right:0.7em;
}
.terms-switcher {
	border-radius:0 0 5px 5px;
	padding:0.5em;
	cursor:pointer;
	color:#666;
	background:#ddd;
	text-align:center;
}
.terms-switcher:hover {
	background:#d7d7d7;
}
.terms-switcher:active {
	background:#d2d2d2;
}
.terms-switcher:before {
	content:'View full terms';
}
.view-abridged:before {
	content:'View abridged terms';
}
.terms-switcher:after {
	font-family:fa-solid;
	content:'\f078';
	margin-left:0.4em;
}
.view-abridged:after {
	content:'\f077';
}
.terms-abridged {
	border-radius:5px 5px 0 0;
}
.terms-abridged + .terms-full {
	display:none;
	border-radius:5px 5px 0 0;
}









/*
—————————————————
Team
—————————————————
*/
.team-wrapper {
	max-width:56em;
	margin:auto;
}
.team-columns {
	width:calc(100% + 6em);
	margin-right:-6em;
}
.team-column {
	float:left;
	width:calc(50% - 6em);
	margin-right:6em;
}
.team-column h3 {
	text-transform:lowercase;
	margin-top:2em;
	font-size:1.3rem;
}
.team-column p {
	margin:-1em 0 2em 0;
}
.team-column .error {
	clear:left;
	display:block;
	color:#ff317c;
	font-weight:500;
	font-size:0.9em;
	padding-top:0.5em;
}
.team {
	margin-bottom:3em;
}
.team li {
	position:relative;
	margin-bottom:1em;
}
.team .team-person {
	margin-bottom:0;
}
.team li .context-menu {
	top:1.2em;
	right:0.8em;
	z-index:auto;
}
.team .text strong {
	display:block;
	padding-top:0.1em;
	font-weight:500;
}
.team .text span {
	display:block;
	color:#818284;
	font-size:0.9em;
}
.team .avatar {
    margin:0 0.6rem 0 0;
}
.team-grid {
	width:calc(100% + 2em);
	margin-right:-2em;
}
.team-grid li {
	float:left;
	width:calc(100% / 4 - 2em);
	margin:0 2em 1em 0;
}
@media only screen and (max-width:1800px) {
	.team-grid li {
		width:calc(100% / 3 - 2em);
	}
}



/*
—————————————————
Intake Form
—————————————————
*/
.connect-logos {
	width:100%;
	height:7em;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:3em;
	position:relative;
}
html.intake {
	overflow-y:scroll;
}
.connect-logos:after {
	content:'';
	position:absolute;
	top:1.5em; left:calc(50% - 3.2em);
	height:4em;
	border-left:1px solid #000;
}
.ols-only:after {
	display:none;
}
.connect-logos img {
	width:11em;
	margin:0 2.5em;
}
.connect-logos .logo-ols {
	width:5.5em;
	height:5.5em;
}
.connect-logos .logo-pp {
	height:2.84em;
}
.premium-plus-logos {
	height:6em;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:3em;
}
.premium-plus-logos span.logo {
	display:inline-block;
	width:10em;
	height:6em;
	margin:0 1em;
	position:relative;
}
.premium-plus-logos span.logo img {
	display:block;
	max-width:8em;
	max-height:6em;
	margin:auto;
}
.premium-plus-logos span.logo + span.logo:before {
	content:'';
	position:absolute;
	top:0.75em; left:-1em;
	width:1px;
	height:4.5em;
	border-left:0.5px solid #000;
}
.intake-form {
	padding-bottom:5em;
}
.intake-intro {
	margin:auto;
	font-size:1.2em;
	max-width:37em;
	text-align:center;
	margin-bottom:2.5em;
	line-height:1.6;
}
.intake-form h2 {
	display:block;
	text-align:center;
	letter-spacing:-0.02em;
	font-size:1.7em;
	font-weight:normal;
}
.adjacent-fields {
	margin-bottom:2.5em;
}
.adjacent-fields p {
	float:left;
	padding:0 0.6em;
	position:relative;
}
.adjacent-fields p:first-child {
	padding-left:0;
}
.adjacent-fields p:last-child {
	padding-right:0;
}
.adjacent-fields label {
	display:block;
	font-size:0.85em;
	text-align:center;
	margin-bottom:0.3em;
}
.adjacent-fields input.text {
	display:block;
	width:100%;
	height:2.6em;
	background:#f0f0f0;
	border-radius:1.3em;
	border:0;
	padding:0.6em 1em;
	line-height:1.4;
	outline:0;
	border:2px solid transparent;
	transition:border-color 200ms, background-color 200ms;
	text-align:center;
}
.adjacent-fields input.text::placeholder {
	color:#999;
}
.adjacent-fields input.text:focus {
	border-color:#90d4f0;
	background:#fff;
}
.adjacent-fields input.error,
.adjacent-fields input.error:focus {
	border-color:var(--barbie);
	background:#fff;
}
.adjacent-fields p .button {
	height:2em;
	line-height:2em;
}
#package-error {
	color:var(--barbie);
	opacity:0;
	transition:opacity 200ms;
}
#package-error.package-error-visible {
	opacity:1;
}
.create-button {
	text-align:center;
	font-size:1.3em;
	display:none;
}
#verified {
	float:none;
	text-align:center;
	display:none;
}
#verified:before {
	content:'\f00c';
	font-family:fa-solid;
	color:#61c391;
	margin-right:0.3em;
}


.package-wrapper {
	margin-bottom:3em;
}
.choose-package {
	text-align:center;
}
.choose-package li {
	display:inline-block;
	vertical-align:top;
	width:15%;
	padding:0 0.5em;
	margin-bottom:1em;
}
.choose-package li:nth-child(5):before {
	content:'\a';
}
.choose-package li input {
	display:none;
}
.choose-package label {
	display:block;
	transition:opacity 150ms;
}
.has-selection label {
	opacity:0.5;
}
.choose-package input:checked + label {
	opacity:1;
}
.choose-package li .product-icon-wrapper {
	display:block;
	width:0;
	height:0;
	padding:50%;
	background-size:100%;
	cursor:pointer;
	position:relative;
}
.choose-package li .product-icon {
	pointer-events:none;
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
}
.choose-package li .product-icon img {
	display:block;
	margin:auto;
	height:100%;
	transition:transform 150ms;
}

.choose-package li:nth-child(1) .product-icon-wrapper { background-image:url(/Images/Blobs/1.png) }
.choose-package li:nth-child(2) .product-icon-wrapper { background-image:url(/Images/Blobs/2.png) }
.choose-package li:nth-child(3) .product-icon-wrapper { background-image:url(/Images/Blobs/3.png) }
.choose-package li:nth-child(4) .product-icon-wrapper { background-image:url(/Images/Blobs/4.png) }
.choose-package li:nth-child(5) .product-icon-wrapper { background-image:url(/Images/Blobs/5.png) }
.choose-package li:nth-child(6) .product-icon-wrapper { background-image:url(/Images/Blobs/6.png) }
.choose-package li:nth-child(7) .product-icon-wrapper { background-image:url(/Images/Blobs/7.png) }
.choose-package li:nth-child(8) .product-icon-wrapper { background-image:url(/Images/Blobs/8.png) }

.choose-package + .choose-package li:nth-child(1) .product-icon-wrapper { background-image:url(/Images/Blobs/5.png) }
.choose-package + .choose-package li:nth-child(2) .product-icon-wrapper { background-image:url(/Images/Blobs/6.png) }
.choose-package + .choose-package li:nth-child(3) .product-icon-wrapper { background-image:url(/Images/Blobs/7.png) }
.choose-package + .choose-package li:nth-child(4) .product-icon-wrapper { background-image:url(/Images/Blobs/8.png) }



.choose-package li:hover img {
	transform:scale(1.1);
}
.choose-package li span {
	display:block;
	font-size:0.9em;
	line-height:1.2;
	text-align:center;
}



#product-detail {
	margin-bottom:4em;
}
.intake-form #product-detail h2 {
	text-transform:none;
}
#product-detail .back {
	position:relative;
	top:-1.8em; left:-2em;
	color:#fff;
	background:var(--barbie);
	padding:0.3em 1.3em;
	border-radius:2em;
	font-size:0.9em;
	cursor:pointer;
	text-transform:lowercase;
	font-weight:500;
}
#product-detail .back:before {
	content:'\f104';
	font-family:fa-solid;
	margin-right:0.4em;
}


.connect-package-detail {
	display:none;
	background:#fff;
	border-radius:1em;
	box-shadow:0 0 0.6em rgba(0,0,0,0.15);
	padding:2.5em;
}
.connect-package-detail ul {
	margin-bottom:1em;
}
.connect-package-detail h2 {
	text-align:left;
}


.package-checkboxes {
	margin-top:1.5em;
}
.package-checkboxes br,
.package-checkboxes input {
	display:none;
}
.package-checkboxes label {
	display:block;
	padding:0.5em 0 0.5em 2em;
	cursor:pointer;
	position:relative;
}
.package-checkboxes label:before {
	content:'';
	position:absolute;
	top:0.4em; left:0;
	font-family:fa-solid;
	background:#ddd;
	width:1.6em;
	height:1.6em;
	line-height:1.6em;
	cursor:pointer;
	text-align:center;
	border-radius:5px;
}
.package-checkboxes label:hover:before {
	background:#d7d7d7;
}
.package-checkboxes input[type="radio"]:checked + label:before {
	content:'\f00c';
	color:#fff;
	background:var(--marge);
}
.package-checkboxes .button {
	width:7em;
	margin-top:2em;
}
#details-form {
	display:none;
}
.mocks-intake .heading-choose,
.mocks-intake .product-wrapper,
.mocks-intake #product-detail {
	display:none;
}
.mocks-intake #details-form {
	display:block;
}



/*
——————————————————
New package layout
——————————————————
*/
.product-list {
	width:calc(100% + 1.2em);
	margin-right:-1.2em;
}
.product-list li {
	width:calc(33.333% - 1.2em);
	float:left;
	margin-right:1.2em;
	margin-bottom:1.2em;
}
.product-list-center-aligned {
	width:auto;
	margin-right:0;
	text-align:center;
}
.product-list-center-aligned li {
	display:inline-block;
	float:none;
	margin:0 0.5em 1em 0.5em;
	text-align:left;
}
.product-list h3 {
	color:#224e73;
	font-size:1.4em;
	line-height:1;
}
.product-list li input {
	display:none;
}
.product-list li label {
	display:block;
	background:rgba(193 196 210 / 23%);
	padding:1.6em;
	border-radius:1em;
	cursor:pointer;
}
.product-list li label:hover {
	background:#224e73;
}
.product-list li label:hover h3 {
	color:#fff;
}
.product-icons {
	height:4.8em;
}
.product-icons div {
	float:left;
	width:2.7em;
	height:4.8em;
	background:var(--elsa);
	margin-right:0.4em;
	border-radius:0.4em;
	position:relative;
}
.product-icons div.max,
.product-icons div.spotlight {
	width:5.8em;
}
.product-icons div.video:after,
.product-icons div.spotlight:after,
.product-icons div.idea:after {
	content:'\f144';
	font-family:fa-solid;
	font-size:1.3em;
	width:1em;
	height:1em;
	line-height:1em;
	text-align:center;
	position:absolute;
	top:calc(50% - 0.5em);
	left:calc(50% - 0.5em);
	color:#1b405d;
}
.product-icons div.idea:before {
	content:'';
	position:absolute;
	bottom:0.7em; left:0.3em;
	width:calc(100% - 0.6em);
	background:#1b405d;
	height:0.2em;
	border-radius:0.1em;
}
.product-icons div.spotlight {
	height:3.6em;
}
.product-icons div.spotlight .tiles {
	position:absolute;
	top:3.75em; left:0;
	width:100%;
	height:1.05em;
	padding:0.15em 0 0.15em 0.15em;
	background:var(--elsa);
	border-radius:0.2em;
}
.product-icons div.spotlight .tiles span {
	float:left;
	width:calc(25% - 0.15em);
	height:100%;
	margin-right:0.15em;
	background:#f1f1f4;
	border-radius:0.1em;
}
.product-list li label:hover div.spotlight .tiles span {
	background:#224e73;
}

.product-icons div .extra {
	font-size:1.3em;
	font-weight:500;
	color:#1b405d;
	width:2em;
	height:1em;
	line-height:1em;
	text-align:center;
	position:absolute;
	top:calc(50% - 0.5em);
	left:calc(50% - 1em);
}
.product-icons div.iteration {
	background:#adb2ce;
}

.product-list input:checked + label {
	opacity:1;
}


.xconnect-package-detail {
	background:#1b405d;
	color:#fff;
	position:relative;
}
.xconnect-package-detail h2 {
	color:#d3f4ee;
	font-size:1.4em;
	font-weight:500;
}
.xback {
	position:absolute;
	top:-1em;
	left:-1em;
	color:#1b405d;
	cursor:pointer;
	background:#d3f4ee;
	padding:0.3em 0.7em;
	border-radius:2em;
}



/*
—————————————————————
Newest package layout
—————————————————————
*/
.product-tiles {
	width:calc(100% + 1.6em);
	margin-right:-1.6em;
}
.product-tiles li {
	width:calc(25% - 1.6em);
	float:left;
	margin:0 1.6em 1.6em 0;
	filter:hue-rotate(215deg);
	transition:filter 200ms;
	user-select:none;
}
.product-tiles li:hover {
	filter:hue-rotate(130deg);
}
.product-tiles li:last-child {
	filter:none;
}
.product-tiles label {
    display:block;
	height:22em;
	position:relative;
	overflow:hidden;
	color:inherit;
	background:#fff;
	border-radius:0.5em;
	transition:border-color 150ms;
	border:1px solid #f3bfc7;
	cursor:pointer;
}
.product-tiles input {
	display:none;
}
.product-tiles .image {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:16em;
	padding:1.3em;
	display:flex;
	align-items:center;
	background:var(--fancygradientdarker);
}
.product-tiles .image span {
	font-size:2em;
	text-transform:lowercase;
	color:#fff;
	line-height:1.1;
}
.product-tiles .text {
	position:absolute;
	top:16em; left:0;
	width:100%;
	height:6em;
	padding:0.5em 0.9em 0 0.9em;
	border-top:1px solid #f3bfc7;
}
.product-tiles .text h4 {
	font-size:1em;
	margin-bottom:0.2em;
}
.product-tiles .text h5 {
	font-size:0.9em;
	line-height:1.1;
}



/*
——————————————————
Unit Customisation
——————————————————
*/
.unit-customise {
	position:relative;
	padding-left:7em;
	margin-bottom:1em;
}
.unit-customise .add {
	position:absolute;
	top:0.25em; left:0;
	width:5.8em;
}
.unit-customise .add span {
	float:left;
	width:1.6em;
	height:1.8em;
	line-height:1.8em;
	background:#eee;
	text-align:center;
	border-radius:0.3em 0 0 0.3em;
	border:1px solid #ddd;
	cursor:pointer;
}
.unit-customise .add span:hover {
	background:#e2e2e2;
}
.unit-customise .add span:active {
	background:#ddd;
}
.unit-selected .add span {
	background:var(--elsa) !important;
	color:#fff;
	border-color:var(--elsa);
}
.unit-customise .add span:last-child {
	border-radius:0 0.3em 0.3em 0;
}
.unit-customise .add input {
	float:left;
	width:2.6em;
	height:1.8em;
	line-height:1.8em;
	border:1px solid #ddd;
	border-left:0;
	border-right:0;
	text-align:center;
	outline:none;
	pointer-events:none;
}
.unit-selected .add input {
	border-color:var(--elsa);
}
.unit-customise h4 {
	text-transform:none;
	margin-bottom:0;
	font-size:1.1em;
	font-weight:normal;
	line-height:1;
}
.unit-customise .credits {
	color:#bbb;
}
.total-bar {
	position:absolute;
	bottom:0; left:0;
	height:3.5em;
	width:100%;
	background:rgba(193 196 210 / 23%);
	padding:0.55em 1em
}
.total-bar .total {
	font-size:1.2em;
	line-height:2;
}
.total-bar .button {
	float:right;
	min-width:6em;
}
#customise.fancybox__content {
	padding:0.6em;
}





/*
——————————————————
Package Builder
——————————————————
*/
#cart {
	width:30%;
	float:right;
	padding:0.7em 1.5em;
	border-left:1px solid #d2d2d2;
}
#builder {
	width:calc(70% - 4.5em);
	float:left;
	border-radius:0.6em;
}
#builder h2 {
	text-align:left;
}
.unit-type-wrapper {
	xpadding:0.25em;
	margin-bottom:1.2em;
	border-radius:0.5em;
}
.unit-type-wrapper h3 {
}
.unit-type-wrapper ul {
	width:calc(100% + 1.2em);
	margin-right:-1.2em;
}
.unit-wrapper {
	float:left;
	width:calc(50% - 1.2em);
	height:8em;
	margin:0 1.2em 1.2em 0;
	padding:1em 1em 1em 8em;
	background:rgba(193 196 210 / 23%);
	border-radius:0.6em;
	position:relative;
}
.unit-wrapper .diagram {
	background:#fff;
	background:var(--elsa);
	border-radius:0.3em;
	position:absolute;
	top:1em; left:2em;
	width:4em; height:6em;
}
.unit-wrapper .max {
	left:1em;
	width:6em;
}
.unit-wrapper .video:after {
	content:'\f144';
	font-family:fa-solid;
	font-size:1.3em;
	width:1em;
	height:1em;
	line-height:1em;
	text-align:center;
	position:absolute;
	top:calc(50% - 0.5em);
	left:calc(50% - 0.5em);
	color:var(--elsa);
	color:#224e73;
}
.unit-wrapper h4 {
	text-transform:none;
	margin-bottom:0.3em;
	line-height:1.1;
	color:#224e73;
}
.unit-wrapper .credits {
	margin-bottom:0.5em;
}
.unit-wrapper .buttons .button {
	min-width:2em;
	width:2em;
	height:2em;
	border-radius:1em;
	line-height:2em;
	text-align:center;
	padding:0;
	background-color:rgba(193 196 210 / 80%);
}
.unit-wrapper .add {
	font-size:0.9375em;
}
.unit-wrapper .add input {
	float:left;
	border:0;
	outline:0;
	width:3.5em;
	background:#fff;
	border-radius:0.4em 0 0 0.4em;
	padding:0.3em;
	height:2em;
}
.unit-wrapper .add .button {
	float:left;
	border-radius:0 0.4em 0.4em 0;
	min-width:4em;
	width:4em;
	height:2em;
	line-height:2em;
}

#cart-summary h2 {
	text-align:left;
}
#cart-summary ul {
	margin-bottom:1.5em;
}
#cart-summary li {
	background:rgba(193 196 210 / 17%);
	padding:0.8em 0.8em 0.8em 5em;
	border-radius:0.4em;
	margin-bottom:0.6em;	
	position:relative;
}
#cart-summary h4 {
	text-transform:none;
	font-size:1rem;
	line-height:1.1;
	margin-bottom:0.2em;
}
#cart-summary input {
	border:1px solid #ddd;
	border-radius:0.3em;
	padding:0.3em;
	width:3.2em;
	outline:0;
	position:absolute;
	top:0.8em; left:0.8em;
}
#cart-summary .remove {
	position:absolute;
	top:0.5em; right:0.5em;
	cursor:pointer;
}
#cart-summary .remove:after {
	content:'\f00d';
	font-family:fa-light;
	display:block;
	width:1em;
	height:1em;
	line-height:1em;
	text-align:center;
}
.cart-total {
	border-top:1px solid #d2d2d2;
	border-bottom:1px solid #d2d2d2;
	padding:0.3em 0;
}
.cart-total span {
	float:right;
}
.cart-delivery {
	margin-bottom:1.5em;
}

/*
—————————————————
Client Search
—————————————————
*/
.search-suggest {
	height:6em;
	position:relative;
	xz-index:2;
}
.search-suggest input {
	float:left;
	width:calc(100% - 5em);
	border:1px solid #ddd;
	border-radius:5px;
	border-bottom-color:#ccc;
	outline:none;
	padding:0.5em 0.7em;
	margin-right:0.5em;
}
.search-suggest input:focus {
	border-bottom-color:#ccc;
	box-shadow:0 2px 2px #f5f5f5;
}
.suggestions {
	background:#fff;
	padding:0.5em 1.2em;
	display:none;
	width:100%;
	max-height:500px;
	overflow-y:auto;
	box-shadow:0 0 15px rgba(0,0,0,0.2);
	position:absolute;
	top:3.3em;
	border-radius:5px;
	z-index:2;
}
.suggestions li {
	position:relative;
	padding:0.5em 1.2em;
	line-height:1.2em;
	outline:none;
	color:inherit;
	margin:0 -1.2em;
	user-select:none;
	cursor:pointer;
}
.suggestions li.selected {
	background:#f5f5f5;
}
.suggestions li.selected:active {
	background:#eee;
}
.suggestions strong {
	display:block;
	font-size:0.875em;
}
.suggestions span {
	display:block;
	font-size:0.8125em;
	color:#777;
}








/*
—————————————————
Creative Briefs
—————————————————
*/
.creative-brief {
	border:none;
	border-bottom:1px solid #d2d2d2;
	border-radius:0.6em;
	box-shadow:0 0.1em 0.2em rgba(0,0,0,0.04);
	transition:border-color 100ms;
	line-height:1.3;
	box-sizing:border-box;
	background:rgba(193 196 203 / 17%);
	padding:3em 11.5em 1.5em 1.5em;
	background:#fff;
	overflow:hidden;
	position:relative;
	margin-bottom:1.2em;
	min-height:7em;
}
.creative-brief h3 {
	background:#4987c3;
	color:#fff;
	position:absolute;
	top:0; left:0;
	padding:0.1em 0.8em;
	border-radius:0 0 0.6rem 0;
}
.creative-brief dl {
	font-size:0.9em;
}
.creative-brief dt {
	float:left;
	width:6em;
	clear:left;
	font-weight:bold;
	padding-bottom:1.2em;
}
.creative-brief dd {
	float:left;
	width:calc(100% - 6em);
	padding-bottom:1.2em;
	border-left:1px solid #ddd;
	padding-left:1em;
}
.creative-brief dd p:last-child {
	margin-bottom:0 !important;
}
.creative-brief dd:last-child {
	padding-bottom:0;
}
.creative-brief dd a {
	color:inherit;
	font-size:0.8rem;
	display:inline-block;
}
.creative-brief .file-list span.filename {
	display:inline-block;
	overflow:visible;
}
.creative-brief a.button {
	position:absolute;
	top:1.5em; right:13em;
}
.main-asset {
	position:absolute;
	top:0; right:0;
	width:10em;
	height:100%;
	padding:1em;
	background-image:url(/Images/clear.gif);
	background-color:rgba(193 196 203 / 40%);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
}




.file-list li {
	font-size:0.8em;
}
.file-list a {
	color:inherit;
}
.file-list a:hover {
	color:var(--barbie);
}
.file-list span.filename {
	display:block;
	padding:0.4em 0;
	line-height:1;
	width:calc(100% - 6em);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.file-list span.filename:before {
	content:'\f15b';
	font-family:fa-light;
	float:left;
	width:1.2em;
	text-align:center;
	margin-right:0.3em;
	color:#94b8d3;
}






















/*
—————————————————
Deliverable
—————————————————
*/

#artwork-sidebar {
	height:100vh;
	background:#29292f;
	padding:1.6em;
	overflow-y:auto;
	display:none;
}
#artwork-sidebar p {
	text-align:center;
	line-height:1.2;
	margin-top:2em;
	color:#fff;
}
#artwork-sidebar p strong {
	display:block;
}

#artwork-sidebar .button-back {
	background:rgba(255,255,255,0.1);
	color:rgba(255,255,255,0.6);
	display:block;
	width:auto;
}
#artwork-sidebar .button-back:hover {
	color:rgba(255,255,255,0.8);
}
#artwork-sidebar .button-back:before {
	content:'\f053';
	font-family:fa-solid;
	font-weight:normal;
	font-size:0.8em;
	margin-right:0.5em;
}
.submit-round {
	padding:1.6em;
	margin:2em -1.6em 2em -1.6em;
	color:#fff;
	background:rgba(255,255,255,0.1);
}
.submit-round-ready {
	background:#ff317c;
}
#artwork-sidebar .submit-round p {
	text-align:center;
	margin-top:0;
}

.board-switcher {
	position:relative;
}
#artwork-sidebar .board-switcher + p {
	margin-top:1em;
}
.board-switcher ul {
	position:absolute;
	top:calc(100% + 0.3em); left:0;
	padding:0.5em 0;
	background:#fff;
	border-radius: 0.3em;
	width:100%;
	z-index:1;
	display:none;
}
.board-switcher ul a {
	display:block;
	width:100%;
	padding:0.5em 1em;
	text-decoration:none;
}
.board-switcher ul a:hover {
	background:#f2f2f2;
}
.board-switcher ul a:active {
	background:#eee;
}
.board-switcher-trigger {
	display:block;
	text-align:center;
	cursor:pointer;
	text-decoration:none;
	padding:0.4em;
	transition:background-color 150ms;
	display:block;
	font-weight:500;
	background:rgba(255,255,255,0.1);
	color:rgba(255,255,255,0.6);
	border-radius:1em;
}
.board-switcher-trigger:after {
	content:'\f078';
	font-family:fa-solid;
	font-size:0.8em;
	font-weight:normal;
	margin-left:0.4em;
}
.board-switcher-trigger:hover {
	color:rgba(255,255,255,0.8);
}
.board-switcher-trigger-active:after  {
	content:'\f077';
}
.board-switcher-trigger-active + ul {
	display:block;
}


#artwork-grid {
	width:100%;
	height:100vh;
	xgrid-template-columns:16em calc(70% - 8em) calc(30% - 8em);
}
#artwork-grid.info-panel-expanded {
	xgrid-template-columns:16em calc(60% - 8em) calc(40% - 8em);
}


#artwork-sidebar #thumbs {
	width:calc(100% + 1em);
	margin-right:-1em;
	margin-top:1.5em;
}
#artwork-sidebar #thumbs li {
	float:left;
	width:calc(50% - 1em);
	margin-right:1em;
	margin-bottom:1em;
}
#artwork-sidebar #thumbs li a {
	display:block;
	position:relative;
}
#artwork-sidebar #thumbs li img {
	display:block;
	width:100%;
	border-radius:0.3em;
	filter:grayscale(1);
	opacity:0.3;
	transition:all 300ms;
}
#artwork-sidebar #thumbs li:nth-child(odd) {
	clear:left;
}
#artwork-sidebar #thumbs li:hover img {
	opacity:0.8;
	filter:none;
}
#artwork-sidebar #thumbs li.active img {
	opacity:1;
	filter:none;
}
#artwork-sidebar #thumbs li.approved a:after {
	content:'\f00c';
	font-family:fa-solid;
	color:#fff;
	background:#61c391;
	width:1.8em;
	height:1.8em;
	line-height:1.8em;
	text-align:center;
	position:absolute;
	border-radius:50%;
	top:-0.5em;
	right:-0.5em;
	font-size:0.8em;
}






#artwork-sidebar #thumbs.square-thumbs a {
	width:0;
	height:0;
	padding:50%;
	background:rgba(255,255,255,0.1);
	border-radius:0.3em;
}
#artwork-sidebar #thumbs.square-thumbs .image {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	padding:0.3em;
	display:flex;
	justify-content:center;
	align-items:center;
	transition:background-color 150ms;
}
#artwork-sidebar #thumbs.square-thumbs img,
#artwork-sidebar #thumbs.square-thumbs video {
	border-radius:3px;
	width:auto;
	max-width:100%;
	max-height:100%;
}







#artwork-panel {
	float:right;
	position:relative;
	width:calc(100% - 38em);
	height:100vh;
	padding:4.5em 12em 3em 12em;
	transition:background-color 150ms;
	z-index:1;
}
.client-view #artwork-panel {
	float:left;
}
.thumbs-visible #artwork-panel {
	padding-top:13.5em;
}
.thumbs-visible #thumbs-slider {
	display:block;
}
#artwork-panel .latest {
	text-align:center;
	margin:-1em 0 1em 0;
}
#artwork-tools {
	position:absolute;
	width:30em;
	top:1em; left:calc(50% - 15em);
	text-align:center;
}
#compare {
	position:absolute;
	background:#29292fdd;
	top:0; left:0;
	width:100%;
	height:100%;
	display:none;
	z-index:4;
}
#compare.narrow {
	width:calc(100% - 38em);
	left:38em;
	z-index:1;
}
#artwork-panel + #compare {
	background:#fff;
}
#close-compare {
	position:absolute;
	top:1em; right:1em;
	cursor:pointer;
	width:1.5em;
	line-height:1.2em;
	text-align:center;
	font-size:1.6em;
	color:#fff;
	opacity:0.7;
}
#close-compare:hover {
	opacity:1;
}
#close-compare:after {
	content:'\f00d';
	font-family:fa-light;
}
#toggle-compare-narrow {
	position:absolute;
	top:1em; left:1em;
	cursor:pointer;
	width:1.5em;
	line-height:1.2em;
	text-align:center;
	font-size:1.6em;
	opacity:0.7;
}
#toggle-compare-narrow:hover {
	opacity:1;
}
#toggle-compare-narrow:after {
	content:'\f340';
	font-family:fa-light;
}
#compare.narrow #toggle-compare-narrow:after {
	content:'\f344';
}
#compare p {
	height:4em;
	text-align:center;
	margin:auto;
	color:#fff;
}
#artwork-panel + #compare #close-compare,
#artwork-panel + #compare p {
	color:#333;
}
#compare p strong {
	display:block;
	font-weight:500;
	xline-height:2;
	border-radius:1em;
	padding:0 1em;
	font-size:1.2em;
}
#compare p span {
	display:block;
}

#compare img.single,
#compare video {
	display:block;
	max-width:100%;
	max-height:calc(100vh - 10em);
	margin:auto;
	box-shadow:0 0 0.7em rgba(0,0,0,0.08);
	border-radius:1em;
	outline:0;
}
#compare .previous,
#compare .current {
	position:absolute;
	top:0; left:3em;
	width:calc(50% - 3em);
	height:100vh;
	padding:2em 2em 4em 2em;
	display:flex;
	align-items:center;
}
#compare .current {
	left:auto; right:3em;
}
#compare .compare-artwork {
	width:100%;
	position:relative;
	max-width:36em;
	margin-left:auto;
	margin-right:auto;
}
.compare-video-controls {
	position:absolute;
	top:-1.2em; left:calc(100% - 1.6em);
	width:7.2em;
	height:4em;
	z-index:1;
}
.compare-video-controls span {
	float:left;
	width:3.2rem;
	text-align:center;
	color:rgba(255,255,255,0.7);
	background:red;
	font-size:1.2em;
	line-height:3.2rem;
	border-radius:50%;
	background:rgba(0,0,0,0.3);
	cursor:pointer;
}
.compare-video-controls span:hover {
	color:#fff;
}
.compare-video-controls span:last-child {
	float:right;
}
.compare-video-controls span:after {
	font-family:fa-solid;
}
.compare-video-controls #compare-play:after {
	content:'\f04b';
}
.compare-video-controls #compare-play.pause:after {
	content:'\f04c';
}
.compare-video-controls #compare-mute:after {
	content:'\f6a9';
}
.compare-video-controls #compare-mute.unmuted:after {
	content:'\f028';
}

#info-panel {
	position:absolute;
	top:1em; left:1em;
	width:36em;
	height:calc(100vh - 2em);
	padding:1em;
	border-radius:1em;
	background:#f1f1f4;
	z-index:3;
}
.client-view #info-panel {
	left:auto; right:1em;
	overflow:hidden;
}
#info-panel.approved:after {
	content:'\f00c';
	background:#61c391;
	position:absolute;
	top:-0.6em;
	right:-0.6em;
	font-family:fa-solid;
	font-size:0.9em;
	color:#fff;
	width:2.3em;
	height:2.3em;
	line-height:2.3em;
	border-radius:50%;
	text-align:center;
}


.artwork-wrapper {
	width:100%;
	height:100%;
	max-width:100%;
	max-height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	position:relative;
}
#artwork-panel .status + .artwork-wrapper {
	max-height:calc(100% - 5em);
}
.artwork-wrapper img.single,
.artwork-wrapper video {
	display:block;
	max-width:100%;
	max-height:100%;
	margin:auto;
	box-shadow:0 0 0.7em rgba(0,0,0,0.08);
	outline:0;
}
.rounded-corners .artwork-wrapper img.single,
.rounded-corners .artwork-wrapper video {
	border-radius:1em;
}

.artwork-wrapper img {
	cursor:pointer;
}
.artwork-wrapper-top {
	width:10em;
	margin:1.2em auto;
	display:none;
}
.artwork-wrapper-top img,
.artwork-wrapper-top video {
	display:block;
	max-width:100%;
	margin:auto;
	border-radius:0.3em;
}

.artwork-text {
	display:none;
}
.artwork-text-wrapper {
	height:100%;
	max-width:100%;
	display:flex;
	position:relative;
	transition:100ms background-color;
	background:#fff;
}

.artwork-text-wrapper img:hover {
	xbackground:rgba(0,0,0,0.5);
	xmix-blend-mode:multiply;
}
.artwork-text-wrapper img {
	xmix-blend-mode:multiply;
}


.artwork-with-text .artwork-text {
	display:block;
}
.artwork-with-text .artwork-text-wrapper {
	display:block;
	height:auto;
	max-height:100%;
	width:22vw;
	overflow-y:overlay;
	box-shadow:0 0 0.7em rgba(0,0,0,0.08);
	background:#fff;
	border-radius:1em 1em 0 0;
}


.artwork-text-wrapper::-webkit-scrollbar {
	display:block;
	width:10px;
	display:none;
}
.artwork-text-wrapper::-webkit-scrollbar-button {
	display:none;
}
.artwork-text-wrapper::-webkit-scrollbar-track {
	background-color:#00000000;
}
.artwork-text-wrapper::-webkit-scrollbar-track-piece {
	background-color:#00000000;
}
.artwork-text-wrapper::-webkit-scrollbar-thumb {
	background-color:#00000000;
	border:1px solid #ffffff40;
	border-radius:24px;
}
.artwork-text-wrapper:hover::-webkit-scrollbar-thumb {
	background-color:#00000025;
}




.artwork-with-text img.single,
.artwork-with-text video,
.artwork-with-text .carousel-inner {
	border-radius:0 !important;
	box-shadow:none;
}
.artwork-with-text .carousel-inner {
	margin-bottom:2em;
}
.artwork-text {
	padding:1.6em;
	font-family:-apple-system, BlinkMacSystemFont, Arial, 'Segoe UI';
	font-size:0.9em;
	color:#222;
}
.artwork-text h3 {
	font-size:1.6em;
	font-weight:600;
	margin-bottom:0.4em;
	outline:0;
	padding:0.2rem;
	line-height:1.1;
}
.artwork-text .artwork-description {
	outline:0;
	padding:0.2rem 0.4rem;
}
.artwork-text h3:focus,
.artwork-text .artwork-description:focus {
	background:#fffddd;
}
.artwork-text h3:empty:after,
.artwork-text .artwork-description:empty:after {
	content:attr(placeholder);
	pointer-events:none;
	color:#aaa;
}
.dummy-avatar {
	height:2em;
	position:relative;
	float:left;
	width:50%;
	margin-top:1.7em;
}
.dummy-avatar:before {
	content:'';
	position:absolute;
	top:0; left:0;
	width:2.4em;
	height:2.4em;
	border-radius:50%;
	background:#e9e9e9;
}
.dummy-avatar div {
	position:absolute;
	top:0.4em; left:3.2em;
}
.dummy-avatar div:before {
	content:'';
	position:absolute;
	top:0; left:0;
	width:7em;
	height:0.6em;
	background:#e9e9e9;
}
.dummy-avatar div:after {
	content:'';
	position:absolute;
	top:1em; left:0;
	width:4em;
	height:0.6em;
	background:#e9e9e9;
}
.dummy-lozenges {
	height:2.4em;
	position:relative;
	float:right;
	margin-top:1.7em;
}
.dummy-lozenges:before {
	content:'';
	float:left;
	width:6em;
	height:2.4em;
	background:#eee;
	border-radius:1.2em;
	margin-right:0.5em;
}
.dummy-lozenges:after {
	content:'';
	float:left;
	width:6em;
	height:2.4em;
	background:#ccc;
	border-radius:1.2em;
}



.artwork-nav a {
	position:absolute;
	top:calc(50% - 2em);
	width:4em;
	height:4em;
	color:#d0d0d0;
	text-decoration:none;
	outline:none;
	z-index:1;
}
.artwork-nav a:hover {
	color:#bbb;
}
.artwork-nav a:active {
	color:#aaa;
}
.artwork-nav a span {
	display:none;
}
.artwork-nav a:before {
	display:block;
	width:100%;
	text-align:center;
	font-size:4em;
	font-family:fa-light;
	line-height:4rem;
	transition:color 150ms;
}
.artwork-nav a.arrow-prev {
	left:5em;
}
.artwork-nav a.arrow-prev:before {
	content:'\f0a8';
}
.artwork-nav a.arrow-next {
	right:5em;
}
.artwork-nav a.arrow-next:before {
	content:'\f0a9';
}
#info-panel .artwork-nav {
	display:none;
}
#info-panel .artwork-nav a {
	top:-0.5em;
	width:2.5em;
	height:3em;
}
#info-panel .artwork-nav a.arrow-prev {
	left:0;
}
#info-panel .artwork-nav a.arrow-next {
	right:0;
}
#info-panel .artwork-nav a:before {
	content:'\f053';
	font-size:2em;
	line-height:1.5;
}
#info-panel .artwork-nav a.arrow-next:before {
	content:'\f054';
}
#task-tools-wrapper {
	position:relative;
}




#thumbs-slider {
	position:absolute;
	top:4em; left:0;
	height:8em;
	width:100%;
	padding:1em;
	text-align:center;
	display:none;
}
#thumbs-slider li {
	display:inline-block;
	margin:0 0.3em;
	position:relative;
	vertical-align:top;
}
#thumbs-slider img {
	height:6em;
	filter:grayscale(1);
	opacity:0.7;
	border-radius:0.25em;
	transition:all 150ms;
}
#thumbs-slider a:hover img,
#thumbs-slider li.active img {
	filter:none;
	opacity:1;
}
#thumbs-slider li.approved:after {
	font-size:0.7em;
	top:-0.6em; right:-0.6em;
}

#thumbs-slider.squares .image {
	display:flex;
	align-items:center;
	justify-content:center;
	width:6em;
	height:6em;
	background:#f1f1f4;
	border-radius:0.3em;
	overflow:hidden;
}
#thumbs-slider.squares img {
	max-width:5.4em;
	max-height:5.4em;
	border-radius:0;
	height:auto;
}



.creative-approval,
.creative-approved {
	height:4em;
	padding:0.8em;
	background:rgba(193 196 210 / 35%);
	text-align:center;
	margin:-1em -1em 1em -1em;
	border-radius:0.6em 0.6em 0 0;
}

.creative-approved {
	color:#fff;
	background:#61c391;
	font-weight:500;
}
.creative-approved p {
	line-height:2rem;
	vertical-align:top;
}
.creative-approved p:before {
	content:'\f00c';
	font-family:fa-solid;
	font-size:1.2em;
	line-height:2rem;
	margin-right:0.2em;
	position:relative;
	top:0.1em;
}
.creative-approved .button-undo {
	margin-left:1em;
	background:#fff;
	border:0;
	display:inline-block;
	width:4em;
	font-size:0.9em;
	border-radius:0.8em;
	height:1.6em;
	cursor:pointer;
}


#info-header {
	padding:0.5em 0.5em 1.5em 0.5em;
	position:relative;
}
#info-panel-variable {
	overflow-y:auto;
	height:calc(100vh - 3.5em);
	height:calc(100vh - 7.5em);
}
#info-header h1 {
	font-size:1.1em;
	font-weight:500;
	text-align:center;
	word-wrap:break-word;
}
#info-header .capped {
	height:5.6em;
	overflow:hidden;
	position:relative;
}
#info-header .capped:after {
	content:'';
	position:absolute;
	bottom:0; left:0;
	width:100%;
	height:100%;
	background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
}
#info-header .capped-visible {
	height:auto;
}
#info-header .capped-visible:after {
	display:none;
}
#info-header .button {
	display:none;
}
#info-header #description.capped + .button {
	display:inline-block;
}
#info-header .button-expand:before {
	content:'Read more';
}
#info-header .capped-visible + .button-expand:before {
	content:'Read less';
}
.button-expand {
	font-size:0.8333em;
	margin-top:0.8em;
}
.resize-info-panel {
	display:none;
	position:absolute;
	top:0; right:1em;
	cursor:pointer;
	width:2.4em;
	height:2.4em;
	text-align:center;
	line-height:2.4em;
	border-radius:50%;
}
.resize-info-panel:after {
	font-family:fa-light;
	font-size:1.4rem;
	content:'\f34b';
}
.info-panel-expanded .resize-info-panel:after {
	content:'\f34c';
}





.thread-switcher {
	height:2.3em;
	width:20em;
	margin:auto;
}
.thread-switcher li {
	float:left;
	width:48%;
	margin:0 1%;
}
.thread-switcher span {
	display:block;
	line-height:2em;
	padding-top:0.3em;
	text-align:center;
	text-transform:lowercase;
	font-weight:500;
	border-radius:0.5em 0.5em 0 0;
	cursor:pointer;
	user-select:none;
}
.thread-switcher span:hover {
	background:rgba(193 196 210 / 35%);
}
.thread-switcher.client-mode li:first-child span {
	color:#fff;
	background:var(--marge);
}
.thread-switcher.studio-mode li:last-child span {
	color:#fff;
	background:var(--barbie);
}

.client-mode .client-thread,
.studio-mode .studio-thread {
	display:block;
}
.client-mode .studio-thread,
.studio-mode .client-thread {
	display:none;
}


#comments-panel h3 {
	font-size:1.7em;
	text-transform:lowercase;
	text-align:center;
	margin-bottom:0.7em;
}





#comments-panel {
	position:relative;
	padding-bottom:0;
	font-size:0.9375em;
}


#info-content {
	background:#fff;
	border-radius:0.6em;
	box-shadow:0 0 0.5em rgb(0 0 0 / 3%);
	padding:1.5em;
}

.client-mode + #info-content {
	border-top:0.3em solid var(--marge);
}
.studio-mode + #info-content {
	border-top:0.3em solid var(--barbie);
}


#actions {
	display:none;
	text-align:center;
	font-size:1.05em;
	margin-bottom:1.5em;
}
#actions .button {
	width:8em;
	margin-bottom:0.7em;
}

#comments-panel {
	position:relative;
}



.add-comment {
	margin-bottom:2em;
	min-height:2.8em;
	position:relative;
}
.add-comment textarea {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	border:1px solid #ddd;
	background:#fbfbfb;
	border-radius:1.4em;
	padding:0.75em 0.75em 0.75em 3.2em;
	box-sizing:border-box;
	margin-bottom:0.4em;
	outline:0;
	resize:none;
	line-height:1.3;
}
.add-comment:after {
	content:attr(data-content) ' ';
	visibility:hidden;
	white-space:pre-wrap;
	display:block;
	padding:0.75em 0.75em 0.75em 3em;
	border:1px solid #fff;
	line-height:1.3;
}
.add-comment textarea:focus {
	border-color:#ccc;
	background:#fff;
	padding-bottom:4em;
}
.add-comment-focused:after {
	padding-bottom:4em;
}
.add-comment label {
	position:static;
	font-weight:normal;
	font-size:0.9em;
	margin-left:0.2em;
	pointer-events:auto;
	transition:background 200ms, border 200ms;
}
.add-comment .button {
	position:absolute;
	bottom:0.5em; right:0.5em;
	z-index:2;
	font-size:0.8666em;
	display:none;
}
.add-comment-focused .button {
	display:block;
}
.add-comment .button-upload {
	right:auto; left:0.5em;
}
.add-comment .button-upload:after {
	xcontent:'\f0c6';
	font-family:fa-light;
	font-family:fa-solid;
}


#info-panel .avatar {
	position:absolute;
	top:calc(0.3em + 1px); left:calc(0.3em + 1px);
	width:2.2em;
	height:2.2em;
	line-height:2.2em;
}
#info-panel .avatar span {
	xfont-size:0.9em;
	xline-height:2.2rem;
}


/*
—————————————————
Context Menu
—————————————————
*/
.context-menu {
	position:absolute;
	z-index:1;
	top:0.3em; right:0.4em;
}
.context-menu-dots {
	display:inline-block;
	width:1.2em;
	height:1.2em;
	text-align:center;
	border-radius:50%;
	line-height:1.2em;
	cursor:pointer;
	transition:200ms;
}
.context-menu-dots:hover,
.context-menu-active .context-menu-dots {
	background:#f2f2f2;
}
.context-menu-dots:before {
	content:'\f142';
	font-family:fa-light;
}
.dots-horizontal:before {
	content:'\f141';
}
.context-menu-actions {
	display:none;
	position:absolute;
	top:1.7em; right:-4em;
	max-width:20em;
	color:#333;
	background:#fff;
	box-shadow:0 0 1.2em rgba(0,0,0,0.15);
	border-radius:6px;
	padding:0.4em 0;
	font-size:0.875em;
	z-index:1;
}
.context-menu-actions a {
	display:block;
	cursor:pointer;
	white-space:nowrap;
	user-select:none;
	padding:0.2em 0.8em;
	text-decoration:none;
}
.context-menu-actions a:hover {
	color:#ff317c;
}
.context-menu-active .context-menu-actions {
	display:block;
}

/*
—————————————————
Comments
—————————————————
*/
#info-panel .comments h4 {
	text-align:center;
	position:relative;
	height:1.6em;
	margin:1.7em 0 1.2em 0;
}
#info-panel .comments h4:before {
	content:'';
	border-top:1px solid #ddd;
	position:absolute;
	top:0.9em; left:0;
	width:100%;
}
#info-panel .comments h4 span {
	display:inline-block;
	line-height:1.6em;
	border:1px solid #d7d7d7;
	border-radius:1em;
	padding:0 0.8em;
	background:#fff;
	position:relative;
	z-index:1;
}
#info-panel .comments li {
	min-height:3em;
	position:relative;
	margin-bottom:1em;
	padding-left:2.2em;
}
#info-panel .comments li ul {
	margin-top:0.6em;
	margin-left:-0.5em;
}

#info-panel .comments .avatar {
	position:absolute;
	top:0; left:0;
	font-size:0.7rem;
	margin-right:0.6em;
}
.comment {
	padding-left:0.8em;
	border-left:5px solid #eee;
}
.comment-body {
	position:relative;
	padding-bottom:2em;
}
.approval .comment-text {
	padding:0.5em 0.7em;
	border-radius:0.6em;
}
.comment-text p {
	margin-bottom:0.6em;
	line-height:1.3;
}
.comment-text p:last-child {
	margin-bottom:0;
}

.comments li.approval .comment-text p:first-child:before {
	font-family:fa-solid;
	content:'\f00c';
	margin-right:0.3em;
	font-size:1.3em;
	line-height:1;
	color:#61c391;
}
.comments li.project-lead.approval .comment-text p:first-child:before,
.comments li.studio.approval .comment-text p:first-child:before,
.comments li.studio-contact.approval .comment-text p:first-child:before {
	color:#fff;
}
.comments li.project-lead.approval .comment-text:not(.comments li li .comment-text),
.comments li.studio.approval .comment-text:not(.comments li li .comment-text),
.comments li.studio-contact.approval .comment-text:not(.comments li li .comment-text) {
	color:#fff;
	background:#61c391;
}
.comments li.reply-comment .comment-text p:first-child:before {
	display:none !important;
}


.comments .userdata {
	margin-bottom:0.5em;
}
.comments .userdata span.timestamp {
	font-size:0.875em;
	color:#aaa;
}

.comments .userdata strong:after {
	display:inline-block;
	margin:0 0.6em;
	color:#695390;
	font-weight:500;
	text-transform:uppercase;
	line-height:1;
	background:#6953901c;
	font-size:0.65em;
	padding:0.35em 0.75em;
	border-radius:0.85em;
	position:relative;
	top:-0.15em;
}
.comments li.project-lead .userdata strong:after {
	content:'Project Lead';
}
.comments li.studio .userdata strong:after {
	content:'Studio';
	color:#ff317c;
	background:#ff317c1c;
}
.comments li.studio-contact .userdata strong:after {
	content:'Studio Contact';
	color:#ff317c;
	background:#ff317c1c;
}


.comment-context-menu {
	position:relative;
	z-index:1;
}

.comments .menu-dots {
	display:inline-block;
	background:#f2f2f2;
	width:1.2em;
	height:1.2em;
	text-align:center;
	border-radius:50%;
	line-height:1.2em;
	cursor:pointer;
	opacity:0;
	transition:200ms;
}
.comments .comment:hover .menu-dots,
.comments .menu-dots-active {
	opacity:1;
}
.comments .menu-dots:before {
	content:'\f141';
	font-family:fa-light;
}
.comments .menu-actions {
	display:none;
	position:absolute;
	top:2em; right:-4em;
	max-width:20em;
	color:#333;
	background:#fff;
	box-shadow:0 0 1.2em rgba(0,0,0,0.15);
	border-radius:6px;
	padding:0.4em 0;
	font-size:0.875em;
}
.comments .menu-actions span {
	display:block;
	cursor:pointer;
	white-space:nowrap;
	user-select:none;
	padding:0.2em 0.8em;
}
.comments .menu-actions span:hover {
	color:#ff317c;
}
.comments .menu-dots-active + .menu-actions {
	display:block;
}




.comment-images {
	float:left;
}
.comment .comment-images {
	margin:0 !important;
}
.comment .comment-images .delete {
	display:none;
}
.comment-images-visible {
	display:inline-block;
}
.comment-images ul {
	float:left;
}
.comment-images li {
	display:inline-block;
	margin:0.2em 0.6em 0.2em 0;
	position:relative;
	vertical-align:top;
}
.comment-images a {
	display:block;
	overflow:hidden;
	border-radius:0.3em;
	background:#000;
}
.comment-images img {
	display:block;
	width:3em;
	height:3em;
	object-fit:cover;
}
.comment-images a:hover img {
	opacity:0.97;
}
.comment-images .delete,
.comment-attachments .delete {
	display:none;
}

.comment-extras {
	margin-top:0.5em;
}
.comment-attachments {
	float:left;
}
.comment-attachments ul {
	float:left;
}
.comment .comment-attachments {
	float:left;
	margin:0 !important;
}
.comment-attachments li {
	display:inline-block;
	margin:0.2em 0.6em 0.2em 0;
	position:relative;
	vertical-align:top;
}
.comment-attachments a {
	display:block;
	overflow:hidden;
	border-radius:0.3em;
	width:3em;
	height:3em;
	text-align:center;
	background:#fff;
	color:rgba(193 196 210);
	border:2px solid rgba(193 196 210);
}
.comment .comment-attachments .delete {
	display:none;
}
.comment-attachments a span {
	display:none;
}
.comment-attachments a:before {
	content:'\f15b';
	font-family:fa-solid;
	font-size:1.5em;
	line-height:calc(2em - 4px);
}
.comment-attachments a.doc,
.comment-attachments a.docx {
	color:#2b579a;
	border-color:#2b579a;
}
.comment-attachments a.doc:before,
.comment-attachments a.docx:before {
	content:'\f1c2';
}
.comment-attachments a.xls,
.comment-attachments a.xlsx {
	color:#217346;
	border-color:#217346;
}
.comment-attachments a.xls:before,
.comment-attachments a.xlsx:before {
	content:'\f1c3';
}
.comment-attachments a.pdf {
	color:#d00;
	border-color:#d00;
}
.comment-attachments a.pdf:before {
	content:'\f1c1';
}
.comment-attachments a.png:before,
.comment-attachments a.jpg:before,
.comment-attachments a.jpeg:before,
.comment-attachments a.gif:before,
.comment-attachments a.tif:before {
	content:'\f1c5';
}










.comments .metadata {
	color:#aaa;
	position:absolute;
	bottom:0.3em; left:0;
	opacity:0;
	transition:opacity 150ms;
}
.comment:hover .metadata {
	opacity:1;
}
.comments .metadata div {
	display:inline-block;
}
.comments .metadata .action {
	display:inline-block;
	font-size:0.8125em;
	margin-right:0.9em;
	user-select:none;
}
.comments .like,
.comments .reply {
	cursor:pointer;
}
.comments .liked,
.comments .like:hover,
.comments .reply:hover {
	color:#ff317c;
}
.comments .reply-wrapper,
.comments .edit-wrapper {
	position:relative;
	display:none;
	margin:0.4em -0.8em;
}
.comments .edit-wrapper {
	margin:0.4em 0 1.5em 0;
}
.comments .reply-wrapper-active {
	display:block;
}
.comments .reply-active {
	pointer-events:none;
	color:#ff317c;
}
.comments .reply-wrapper .button,
.comments .edit-wrapper .button {
	position:absolute;
	bottom:0.5em;
	right:0.5em;
	margin-right:0;
	z-index:2;
	font-size:0.8666em;
}
.comments .edit-wrapper .button-cancel {
	right:5em;
}
.comments .reply-wrapper textarea,
.comments .edit-wrapper textarea {
	display:block;
	width:100%;
	height:100%;
	border:1px solid #ddd;
	background:#fbfbfb;
	border-radius:1em;
	padding:0.75em 0.75em 3em 0.75em;
	box-sizing:border-box;
	outline:0;
	resize:none;
	line-height:1.3;
	position:absolute;
	top:0; left:0;
	overflow:hidden;
}
.comments .reply-wrapper textarea:focus,
.comments .edit-wrapper textarea:focus {
	border-color:#ccc;
}
.comments  .reply-wrapper:after,
.comments  .edit-wrapper:after {
	content:attr(data-content) ' ';
	visibility:hidden;
	white-space:pre-wrap;
	display:block;
	padding:0.75em 0.75em 3em 0.75em;
	border:1px solid #fff;
	line-height:1.3;
}

.comments li.edit-mode .metadata,
.comments li.edit-mode .comment-text {
	display:none;
}
.comments li.edit-mode .edit-wrapper {
	display:block;
}
.comments li.edit-mode.hidden .comment-hidden {
	display:none;
}
.comments li.edit-mode.hidden .comment-body {
	display:block;
}


.comments .likes {
	color:#000;
	margin-left:0.4em;
}
.comments .likes:before {
	content:'\f164';
	font-family:fa-solid;
	color:#ff317c;
	margin-right:0.2em;
}
.comments .likes-wrapper {
	float:right;
	margin-top:-0.3em;
}
.comments .likes-box {
	position:relative;
	background:#fff;
	border-radius:1em;
	padding:0 0.2em 0.1em 0.2em;
	box-shadow:0 0.15em 0.3em rgba(0,0,0,0.1);
}
.comments .likers {
	position:absolute;
	top:2.5em; right:0;
	color:#fff;
	background:linear-gradient(to bottom, #444, #333);
	box-shadow:0 0 1.2em rgba(0,0,0,0.15);
	padding:0.8em 1.1em;
	border-radius:6px;
	z-index:2;
	pointer-events:none;
	opacity:0;
	transition:200ms;
}
.comments .likes-wrapper:hover .likers {
	top:2em;
	opacity:1;
}
.comments .likers span {
	display:block;
	white-space:nowrap;
}
.comments-locked {
	display:none;
	margin:1em auto 0 auto;
	background:#f2f2f2;
	border-radius:0.5em;
	padding:0.6em 1em 0.7em 1em;
	color:#777;
	position:relative;
	text-align:center;
}
.comments-locked:before {
	font-family:fa-solid;
	content:'\f023';
	font-size:1.2em;
	margin-right:0.7em;
}

/*
—————————————————
Hidden comments
—————————————————
*/
.comment-hidden {
	display:none;
	background:#f3f4f4;
	padding:0.7em;
	border-radius:1em;
	line-height:1.3;
	margin-bottom:2.2em;
	position:relative;
}
.comment-hidden-status {
	margin:0;
	font-style:italic;
}
.comment-hidden p {
	color:#888;
}
.hidden .comment-body,
.hidden ul,
.hidden .reply {
	display:none;
}
.hidden .comment-hidden {
	display:block;
}
.view-hidden {
	position:absolute;
	top:0.9em; right:1.2em;
	cursor:pointer;
	font-size:0.8125em;
	color:#888;
	user-select:none;
}
.hidden-comment-text {
	display:none;
	background:#fff;
	padding:0.6em 0.8em;
	box-shadow:0 0 0.5em rgba(0,0,0,0.1);
	border-radius:0.6em;
	z-index:2;
	margin-top:0.8em;
}
.view-hidden-active + .hidden-comment-text{
	display:block;
}
		

/*
.has-replies .comment-body {
	position:relative;
}
.has-replies .comment-body:after {
	content:'';
	position:absolute;
	top:0.1em; left:-2em;
	width:0.12rem;
	height:calc(100% + 1.5em);
	background:#ddd;
}
.reply-comment .comment-body:after {
	left:-5em;
	top:-2.2em;
	height:calc(100% + 3.8em);
}
.last-reply .comment-body:after {
	display:none;
}
.reply-comment:before {
	content:'';
	position:absolute;
	top:0; left:-2em;
	width:1.6em;
	height:1em;
	border-radius:0 0 0 0.8em;
	border-bottom:0.12rem solid #ddd;
	border-left:0.12rem solid #ddd;
}
*/










/*
—————————————————
Activity
—————————————————
*/
#activity {
	height:3.5em;
	padding:0.8em 1.5em;
	background:rgba(193 196 210 / 35%);
	overflow:hidden;
	position:absolute;
	bottom:0; left:0;
	width:100%;
	text-decoration:none;
}
#activity h3 strong {
}
#activity h3 span {
	font-weight:300;
}
#activity h3:before {
	content:'\f4a6';
	content:'\f06e';
	font-family:fa-light;
	display:inline-block;
	margin-right:0.6em;
	position:relative;
	top:0.15em;
}


#collaborators {
	font-size:0.9333em;
	max-width:900px;
	margin:0;
}
#collaborators th {
	background:#f2f2f2;
	padding:0.3em 0.7em;
}
#collaborators td {
	border-top:1px solid #ddd;
	padding:0.3em 0.7em;
	color:#bbb;
	padding-right:3em;
	white-space:nowrap;
}
#collaborators tr.viewed td {
	color:#333;
}




/*
—————————————————
Context Menu
—————————————————
*/
.context-menu {
	position:absolute;
	xz-index:1;
	top:0.3em; right:0.4em;
}
.context-menu-dots {
	display:inline-block;
	width:1.2em;
	height:1.2em;
	text-align:center;
	border-radius:50%;
	line-height:1.2em;
	cursor:pointer;
	transition:200ms;
}
.context-menu-tasks {
	display:inline-block;
	position:relative;
	top:0; right:0;
	vertical-align:top;
	margin:0 0.1em;
}
.context-menu-tasks .context-menu-dots {
	width:1.9em;
	height:1.9em;
	line-height:1.9em;
	background:#fff;
}
.context-menu-dots:hover,
.context-menu-active .context-menu-dots {
	background:#f2f2f2;
}
.context-menu-tasks .context-menu-dots:hover {
	box-shadow:0 0.2em 0.5em rgba(0,0,0,0.05);
	background:#fff;
}
.context-menu-dots:before {
	content:'\f142';
	font-family:fa-light;
}
.context-menu-actions {
	display:none;
	position:absolute;
	top:1.7em; right:-4em;
	max-width:20em;
	color:#333;
	background:#fff;
	box-shadow:0 0 1.2em rgba(0,0,0,0.15);
	border-radius:6px;
	padding:0.4em 0;
	font-size:0.875em;
	z-index:1;
}
.context-menu-actions a {
	display:block;
	cursor:pointer;
	white-space:nowrap;
	user-select:none;
	padding:0.2em 0.8em;
	text-decoration:none;
}
.context-menu-actions a:hover {
	color:var(--barbie);
}
.context-menu-active .context-menu-actions {
	display:block;
}
 .context-menu li.section-top {
	padding-top:0.4em;
	margin-top:0.4em;
	border-top:1px solid #ddd;
}
.context-menu a.checkbox {
	padding-top:0.15em;
	padding-bottom:0.15em;
}
.context-menu a.checkbox:before {
	content:'\f0c8';
	display:inline-block;
	font-family:fa-light;
	width:1.4em;
}
.context-menu a.checked:before {
	content:'\f14a';
	font-family:fa-solid;
	color:var(--marge);
}


/*
—————————————————
Tag Icons
—————————————————
*/
.tag-icons {
	text-align:center;
	margin-top:-1em;
	display:inline-block;
}
.tag-icon {
	display:none;
	font-size:0.7em;
	font-weight:500;
	line-height:1.4em;
	color:#fff;
	text-align:center;
	min-width:4em;
	padding:0 0.6em;
	border-radius:2em;
}
.tag-active {
	display:inline-block;
}
.tag1 {
	color:var(--barbie);
	background:#e6347822;
}
.tag2 {
	color:#4db881;
	background:#61c39122;
}


/*
—————————————————
Uploads
—————————————————
*/
.uploaded-files ul {
	background:#fff;
	border-radius:6px;
	padding:0.6em 0;
	margin:1em 0;
	width:100%;
	border:2px solid #ccc;
}
.uploaded-files li {
	padding:0.2em 0.8em;
	font-size:0.875em;
}
.uploaded-files li:nth-child(2n+1) {
	background:#eee;
}
.uploaded-files a {
	font-weight:500;
	color:inherit;
	text-decoration:none;
}
.uploaded-files a:hover {
	color:#ff317c;
}
#feedbackInputs .uploaded-files {
	clear:both;
}
#feedbackInputs .uploaded-files ul {
	border:0;
	margin:0;
	padding:0;
	border-radius:0;
	max-width:100%;
}
#feedbackInputs .uploaded-files li {
	display:inline-block;
	margin:0 0.5em 0.6em 0;
	background:none !important;
	padding:0;
}
.attachments a,
#feedbackInputs .uploaded-files a {
	display:block;
	padding:0 1em;
	line-height:2.2em;
	border-radius:2em;
	white-space:nowrap;
	background:#fff;
	border:1px solid #ccc;
	text-overflow:ellipsis;
	overflow:hidden;
	max-width:15em;
}
.attachments {
	display:block;
	margin:0.7em 0 -0.6em 0;
	font-size:0.875em;
}
.attachments a {
	display:inline-block;
	margin:0 0.5em 0.6em 0;
	color:inherit;
	text-decoration:none;
}
.attachments a:hover,
#feedbackInputs .uploaded-files a:hover {
	border-color:#aaa;
	color:inherit;
}
.attachments a:before,
#feedbackInputs .uploaded-files a:before {
	font-family:fa-solid;
	content:'\f15b';
	margin-right:0.4em;
	color:#ff317c;
	font-size:1.1em;
}






/*
—————————————————
Feedback List
—————————————————
*/
.feedback-list {
	max-width:60em;
	margin:auto;
}
.feedback-list li {
	background:#f5f5f5;
	padding:1.2em;
	margin-bottom:1em;
	border-radius:0.5em;
	position:relative;
}
.feedback-list li:last-child {
	margin:0;
}
.feedback-list p {
	margin-bottom:0.5em;
}
.feedback-list .checkbox {
	position:absolute;
	top:0; left:-3em;
	width:1.8em;
	height:1.8em;
	cursor:pointer;
	color:#fff;
	background:#fff;
	border-radius:0.3em;
	border:2px solid #ccc;
	text-align:center;
	line-height:1.8em;
}
.feedback-list li.checked .checkbox {
	border:none;
	background:#61c391;
}
.feedback-list li.checked .checkbox:after {
	content:'\f00c';
	font-family:fa-solid;
}

/*
—————————————————
Edit Tasks
—————————————————
*/

#task-content {
	background:#fff;
	border-radius:0 0 0.6em 0.6em;
	box-shadow:0 0 0.5em rgb(0 0 0 / 3%);
	padding:1.5em;
	overflow-y:auto;
	height:calc(100vh - 12.8em);
	scrollbar-width:thin;
}
.tasklist {
	font-size:0.9333em;
	line-height:1.3;
}
.tasklist .top-level-task {
	background:#fff;
	border-top:1px solid #ddd;
	padding:1em 0.5em 1em 2.8em;
	position:relative;
	transition:150ms box-shadow;
	min-height:2.8em;
}
.tasklist .top-level-task:first-child {
	border-top:0;
}
.tasklist .task-content {
	white-space:pre-wrap;
}
.tasklist .task-metadata-resolved + .task-header,
.tasklist .task-metadata-resolved + .task-header + .task-content {
	color:#ccc;
}
.tasklist .task-heading {
	padding:2em 0 0.3em 0;
	background:#fff;
	border-top:0;
	border-bottom:3px solid #ddd;
	margin-bottom:0.4em;
}
.tasklist .task-heading .task-content {
	font-size:1.2em;
	line-height:1.3rem;
	font-weight:500;
	padding-right:3em;
}
.tasklist .task-drag-handle {
	display:none;
	position:absolute;
	top:0; left:0;
	width:1.3em;
	height:100%;
	background:#ddd;
	cursor:move;
	border-radius:0.6em 0 0 0.6em;
}


.tasklist .task-drag-handle:after {
	content:'\f7a5';
	font-family:fa-solid;
	width:1.3em;
	height:1em;
	line-height:1em;
	text-align:center;
	color:#aaa;
	position:absolute;
	top:calc(50% - 0.5em);
	left:0;
}

.tasklist .new-task-wrapper,
.tasklist .new-reply-wrapper {
	display:none;
}
.tasklist .new-reply {
	min-height:2em;
}
.tasklist .new-task-wrapper:first-child {
	margin-top:0;
}

.tasklist .task-hotspots {
	position:absolute;
	top:0; right:1em;
	cursor:pointer;
	display:none;
}
.tasklist .task-hotspots:before {
	content:'\e269';
	font-family:fa-light;
	font-size:2em;
}


.tasklist .task-metadata {
	position:absolute;
	top:0.6em; left:0;
}
.tasklist .roundel {
	display:block;
	width:2em;
	height:2em;
	line-height:2em;
	border-radius:50%;
	cursor:pointer;
	overflow:hidden;
	text-align:center;
}
.tasklist .roundel span {
	display:block;
	width:2.5em;
	height:2.5em;
	line-height:2.5em;
	color:#fff;
	font-weight:500;
	font-size:0.8em;
	background:linear-gradient(to bottom right, var(--elsa), var(--ursula));
}
.tasklist .task-metadata-resolved .roundel {
	background:#61c391;
	background:#ddd;
}
.tasklist .task-approval .roundel {
	background:#848cc9;
}

.tasklist .task-approval .roundel:after,
.tasklist .task-metadata-resolved .roundel:after {
	content: '\f00c';
	font-family:fa-solid;
	color:#fff;
}
.tasklist .task-metadata-resolved.task-ignored .roundel {
	background:#fff;
	border:2px solid #ddd;
	line-height:calc(2em - 2px);
}
.tasklist .task-metadata-resolved.task-ignored .roundel:after {
	content: '\f00d';
	color:#ddd;
}

.tasklist .roundel img {
	display:block;
	width:100%;
	height:100%;
	transition:filter 150ms;
}
.tasklist .roundel img:hover {
	filter:brightness(90%);
}

.tasklist .task-approval .roundel img,
.tasklist .task-approval .roundel span,
.tasklist .task-metadata-resolved .roundel img,
.tasklist .task-metadata-resolved .roundel span {
	display:none;
}

.tasklist .task-approval .task-content {
	color:#848cc9;
	background:#edeff7;
	padding:0.3em 0.5em;
	margin-top:-0.3em;
}


/*
.tasklist .task-actions li {
	position:absolute;
	padding:0.2em 0;
	background:rgba(193 196 210 / 23%);
	border-radius:2em;
	text-align:center;
	font-size:0.9em;
	cursor:pointer;
	user-select:none;
}
.tasklist .task-actions li:hover {
	background:rgba(193 196 210 / 31%);
}
.tasklist .task-actions li.button-resolve {
	top:1em; left:1em;
	width:calc(100% - 2em);
	color:#fff;
	background:var(--barbie);
}
.tasklist .task-actions li.button-resolve:after {
	content:'Resolve';
}
.tasklist .task-metadata-resolved li.button-resolve:after {
	content:'Unresolve';
}


.tasklist .task-actions li.button-accept {
	width:4.8em; top:1em; left:1em;
	color:#fff;
	background:var(--barbie);
}
.tasklist .task-actions li.button-ignore {
	width:4.8em; top:1em; left:calc(50% - 2.4em);
}
.tasklist .task-actions li.button-clear {
	width:4.8em; top:1em; right:1em;
}


.tasklist .task-actions li.button-delete {
	width:4.8em; bottom:1em; left:1em;
}
.tasklist .task-actions li.button-duplicate {
	width:4.8em; bottom:1em; left:calc(50% - 2.4em);
}
.tasklist .task-actions li.button-reply {
	width:4.8em; bottom:1em; right:1em;
}

*/

.tasklist .task-actions {
	visibility:hidden;
	opacity:0;
	position:absolute;
	top:0; left:3em;
	z-index:1;
	width:16em;
	border:1px solid #e2e2e2;
	box-shadow:0 0.1em 0.3em rgba(0,0,0,0.2);
	background:#fff;
	border-radius:0.5em;
	padding:0.5em 0;
	user-select:none;
	transition:all 100ms;
}
.tasklist .task-heading-actions {
	top:3.4em;
	left:auto; right:0;
	width:14em;
}
.tasklist .actions-visible .task-actions,
.tasklist .task-heading-actions-trigger-active + .task-actions {
	visibility:visible;
	opacity:1;
}
.tasklist .task-heading-actions-trigger {
	position:absolute;
	top:2em; right:0;
	width:2em;
	text-align:center;
	cursor:pointer;
	color:#666;
}
.tasklist .task-heading-actions-trigger:after {
	content:'\f078';
	font-family:fa-solid;
	font-size:0.9em;
	transition:transform linear 200ms;
	display:inline-block;
}
.tasklist .task-heading-actions-trigger-active:after {
	transform:rotate(180deg);
}
.task-actions li {
	padding:0.2em 1em;
	cursor:pointer;
}
.task-actions li:hover {
	background:rgba(193 196 210 / 17%);
}
.task-actions li:active {
	background:rgba(193 196 210 / 23%);
}
.task-actions li.icon:before {
	content:'\f013';
	display:inline-block;
	font-family:fa-light;
	width:1em;
	text-align:center;
	margin-right:0.8em;
}
.task-actions li.button-accept:before    { content:'\f00c' }
.task-actions li.button-ignore:before    { content:'\f00d' }
.task-actions li.button-clear:before     { content:' ' }
.task-actions li.button-clock:before     { content:'\f017' }
.task-actions li.button-carousel:before  { content:'\e256' }
.task-actions li.button-delete:before    { content:'\f2ed' }
.task-actions li.button-attach:before    { content:'\f0c6' }
.task-actions li.button-duplicate:before { content:'\f0c5' }
.task-actions li.button-import:before    { content:'\f56f' }
.task-actions li.button-reply:before     { content:'\f3e5' }
.task-actions li.button-list:before      { content:'\f0ae' }
.task-actions li.button-new:before       { content:'\2b' }

.task-actions li.section-top {
	padding-top:0.4em;
	margin-top:0.4em;
	border-top:1px solid #ddd;
}



.tasklist .task-actions .log-text {
	font-size:0.8em;
	color:#888;
	width:100%;
	padding:0.7em 1em 0.4em 1em;
	margin-top:0.7em;
	border-top:1px solid #ddd;
}
.tasklist .task-actions .log-text:first-child {
	margin-top:0;
	padding-top:0.4em;
	border-top:0;
}
.tasklist .task-actions .log-text p {
	margin:0;
}
.tasklist p.resolved-by,
.tasklist .task-metadata-resolved span.created-by-date {
	display:none;
}
.tasklist .task-metadata-resolved p.resolved-by {
	display:block;
}


.tasklist .task-header {
	margin-bottom:0.1em;
}
.tasklist .task-author {
	font-weight:bold;
	line-height:1;
	margin-right:0.4em;
	display:inline-block;
	vertical-align:top;
}

.tasklist .task-content {
	padding:0.2em 0.5em;
	margin:-0.2em -0.5em;
	border-radius:0.3em;
	word-break:break-word;
	outline:0;
	transition:background-color 150ms;
}

.tasklist .new-task:before,
.tasklist .task-heading .task-content:before {
	display:none;
}

.tasklist .task-heading + .top-level-task:not(.task-heading) {
	padding-top:1em;
	border-top:0;
}
.tasklist .task-heading + .top-level-task .task-metadata {
	top:0.65em;
}
.tasklist .task-content:hover {
	background:#f4f4f7;
}
.tasklist .task-content:focus {
	background:#fffddd;
}
.tasklist .replies {
	margin:0.8em -0.5em -1.2em 0;
}
.tasklist .reply {
	border-top:1px solid #ddd;
	padding:0.8em 0.5em 0 2.8em;
	margin-bottom:0.8em;
	position:relative;
}
.tasklist .reply .roundel {
	top:0.8em; left:0;
}
.tasklist .task-images {
	float:left;
}
.tasklist .task-images li {
	display:inline-block;
	margin:0.3em 0.6em 0 0;
	position:relative;
}
.tasklist .task-images a {
	display:block;
	overflow:hidden;
	border-radius:0.3em;
	background:#000;
}
.tasklist .task-images img {
	display:block;
	width:4em;
	height:4em;
	object-fit:cover;
}
.tasklist .task-images a:hover img {
	opacity:0.97;
}

.task-extras {
	margin-top:0.6em;
	display:none;
}
.task-extras-visible {
	display:block;
}
.task-extras .delete {
	position:absolute;
	top:-0.3em; right:-0.3em;
	width:1.2em;
	height:1.2em;
	border-radius:50%;
	cursor:pointer;
	background:#fff;
	box-shadow:0 0 0.4em rgba(0,0,0,0.15);
	color:#999;
}
.task-extras .delete:after {
	display:block;
	font-family:fa-light;
	content:'\f00d';
	font-size:0.8em;
	line-height:1.5;
	text-align:center;
}





.task-attachments {
	float:left;
}
.task-attachments li {
	display:inline-block;
	margin:0.2em 0.6em 0.2em 0;
	position:relative;
	vertical-align:top;
}
.task-attachments a {
	display:block;
	overflow:hidden;
	border-radius:0.3em;
	width:4em;
	height:4em;
	text-align:center;
	background:#fff;
	color:rgba(193 196 210);
	border:2px solid rgba(193 196 210);
}
.task .comment-attachments .delete {
	display:none;
}
.task-attachments a span {
	display:none;
}
.task-attachments a:before {
	content:'\f15b';
	font-family:fa-solid;
	font-size:1.5em;
	line-height:calc(2.667em - 4px);
}
.task-attachments a.doc,
.task-attachments a.docx {
	color:#2b579a;
	border-color:#2b579a;
}
.task-attachments a.doc:before,
.task-attachments a.docx:before {
	content:'\f1c2';
}
.task-attachments a.xls,
.task-attachments a.xlsx {
	color:#217346;
	border-color:#217346;
}
.task-attachments a.xls:before,
.task-attachments a.xlsx:before {
	content:'\f1c3';
}
.task-attachments a.pdf {
	color:#d00;
	border-color:#d00;
}
.task-attachments a.pdf:before {
	content:'\f1c1';
}
.task-attachments a.png:before,
.task-attachments a.jpg:before,
.task-attachments a.jpeg:before,
.task-attachments a.gif:before,
.task-attachments a.tif:before {
	content:'\f1c5';
}


.add-attachment {
	display:none;
	background:#f1f1f4;
	padding:0.6em;
	border-radius:0.5em;
	height:2.9em;
	margin-top:1em;
}
.add-attachment input {
	float:left;
	border:0;
	outline:0;
	border-radius:0.3em;
	height:1.7em;
	line-height:1.3em;
	padding:0.2em;
	width:calc(100% - 5em);
}
.add-attachment span {
	float:right;
	width:2em;
	background:#dadce4;
	text-align:center;
	line-height:1.7em;
	border-radius:0.3em;
	cursor:pointer;
	margin-left:0.4em;
}
.add-attachment .button-add-attachment:after {
	font-family:fa-light;
	content:'\f00c';
}
.add-attachment .button-cancel-attachment:after {
	font-family:fa-light;
	content:'\f00d';
}













.task-timestamp {
	display:inline-block;
	vertical-align:top;
	cursor:pointer;
	line-height:1;
	border-radius:0.2em;
	font-size:0.9em;
	overflow:hidden;
	padding:0.15em 0.4em;
	color:#4db881;
	background:#61c39122;
	margin-top:-0.1em;
}
.task-timestamp:after {
	content:'s';
}

.task-carousel-panel {
	display:inline-block;
	vertical-align:top;
	cursor:pointer;
	color:#fff;
	background:var(--leela);
	line-height:1;
    border-radius:0.3em;
    margin-top:-0.1em;
    padding:0.15em 0.4em;
	font-weight:500;
	font-size:0.9em;
}
.task-carousel-panel:before {
	content:'Panel ';
}



.include-timestamp label,
.include-panel label {
	white-space:nowrap;
	padding-left:0.3em;
}

#task-tools {
	height:1.9em;
	text-align:center;
	font-size:0.95em;
}
#task-tools .button {
	height:1.9em;
	line-height:1.9em;
	color:inherit;
	background:#fff;
	font-weight:normal;
	margin:0 0.1em;
	user-select:none;
	text-transform:none;
	min-width:7em;
}
#task-tools .button:hover {
	box-shadow:0 0.2em 0.5em rgba(0,0,0,0.05);
}
#task-tools .button-active {
	color:#fff;
	background:var(--marge);
}


.tasklist.sorting-visible .top-level-task {
	background:#f1f1f4;
	border:0;
	margin-bottom:0.4em;
	border-radius:0.5em;
	user-select:none;
	cursor:move;
	min-height:0;
}
.tasklist.sorting-visible .top-level-task * {
	pointer-events:none;
}


.tasklist.sorting-visible .task-heading + .top-level-task .task-metadata {
	top:0.45em;
}
.tasklist.sorting-visible .task-heading + .top-level-task {
	padding-top:0.8em;
}

.tasklist.sorting-visible .top-level-task {
	padding-left:3.3em;
}
.tasklist.sorting-visible .task-heading {
	background:#dadce4;
	padding:0.8em;
}
.tasklist.sorting-visible .task-heading-actions-trigger {
	display:none;
}
.tasklist.sorting-visible .task-metadata {
	left:0.5em;
}
.tasklist.sorting-visible .task-content {
	padding:0;
	margin:0;
}
.tasklist.sorting-visible .replies {
	margin-bottom:-0.8em;
	padding-right:0.8em;
}
.tasklist.sorting-visible .reply {
	border-top-color:#ccc;
}
.tasklist.sorting-visible .reply .task-metadata {
	left:0;
}
.tasklist.sorting-visible .new-task-wrapper {
	display:none;
}




.tasklist .placeholder {
	border-radius:0.5em;
	background:rgba(193 196 210 / 8%);
	padding:calc(0.8em - 2px);
	margin-bottom:0.4em;
	border:2px dashed rgba(193 196 210 / 70%);
}







#comments {
	position:absolute;
	top:3em; left:4em;
	z-index:2;
	width:33em;
	height:calc(100vh - 6em);
	padding:1.5em;
	background:#dadce4;
	border-radius:0 1em 1em 0;
	transition:left 300ms ease-in-out;
}
#close-comments {
	position:absolute;
	top:0.5em; right:0.5em;
	color:#fff;
	width:2em;
	height:2em;
	cursor:pointer;
	text-align:center;
	line-height:2;
}
#close-comments:after {
	content:'\f00d';
	font-family:fa-solid;
}


#comments.visible {
	left:37em;
}
#comments-content {
	background:#fff;
	border-radius:0 0.6em 0.6em 0.6em;
	box-shadow:0 0 0.5em rgb(0 0 0 / 3%);
	padding:1.5em;
	overflow-y:auto;
	height:calc(100% - 1.7em);
}
#comments-content div {
	font-size:14px;
}
#comment-tabs, #task-tabs {
	height:1.7em;
}
#comment-tabs li, #task-tabs li {
	float:left;
	margin-right:0.4em;
	border-radius:0.4em 0.4em 0 0;
	width:3.4em;
	height:1.7em;
	line-height:1.7em;
	background:linear-gradient(to bottom, #f1f1f4 60%, #dadce4);
	text-align:center;
	cursor:pointer;
	user-select:none;
}
#task-tabs li:first-child {
	width:4em;
}
#task-tabs {
	background:#dadce4;
	padding:1em 1em 0 1em;
	margin-top:1em;
	border-radius:0.6em 0.6em 0 0;
	height:2.7em;

}
#comment-tabs li.active,
#task-tabs li.active {
	background:#fff;
}
#comment-tabs li.first-approved,
#task-tabs li.first-approved {
	color:#fff;
	background:#61c391;
}
#comment-tabs li.active.first-approved,
#task-tabs li.active.first-approved {
	color:#61c391;
	background:#fff;
	font-weight:500;
}


.comment-actions {
	position:absolute;
	z-index:1;
	top:-0.1em;
	right:0.4em;
}
.comment-actions span {
	display:inline-block;
	width:1.2em;
	text-align:center;
	cursor:pointer;
	font-size:1.1em;
}
.comment-actions .comment-resolve:after {
	content:'\f058';
	font-family:fa-light;
}
.comment-actions .comment-new-task:after {
	content:'\2b';
	font-family:fa-light;
}

.round-comments .comment-resolved .comment-user,
.round-comments .comment-resolved .task-carousel-panel,
.round-comments .comment-resolved .comment-bubble {
	opacity:0.4;
	filter:grayscale(1);
}
.round-comments .comment-resolved .comment-resolve:after {
	font-family:fa-solid;
	color:#dadce4;
}
.round-comments .comment-resolved .task-timestamp,
.round-comments .comment-resolved .comment-new-task {
	display:none;
}





.round-tasks {
	display:none;
}
.round-tasks-active {
	display:block;
}



.round-comments {
	display:none;
}
.round-comments-active {
	display:block;
}
.round-comments .comment-wrapper {
	margin-bottom:1.2em;
	position:relative;
}
.round-comments .comment-header {
	position:relative;
}
.round-comments .comment-user {
	display:inline-block;
	font-weight:500;
	font-size:0.95em;
	line-height:1;
	vertical-align:top;
	margin-right:0.4em;
}
.round-comments .comment-bubble {
	background:#f1f1f4;
	padding:0.6em 0.8em;
	border-radius:0.8em;
	word-wrap:break-word;
}
.round-comments .comment-approval .comment-bubble {
	color:#fff;
	background:#61c391;
}
.round-comments .comment-approval  p:first-child:before {
	font-family:fa-solid;
	content:'\f00c';
	margin-right:0.3em;
	font-size:1.3em;
	line-height:1;
	color:#61c391;
}
.round-comments .comment-bubble p {
	margin-bottom:0.6em;
	line-height:1.3;
}
.round-comments .comment-bubble p:last-child {
	margin-bottom:0;
}
.designer-view .comments .metadata .like,
.designer-view .comments .metadata .reply,
.designer-view .comments .comment-context-menu {
	display:none;
}



.concept-readonly {
	font-size:0.9em;
}
.concept-readonly h3 {
	border-top:1px solid #ddd;
	padding-top:1em;
	margin:1em 0 0.7em 0;
}
.concept-readonly a {
	word-break:break-word;
}



/*
—————————————————
Approval Request
—————————————————
*/
.approval-requests {
	margin-top:2em;
}
.approval-request {
	background:#f1f1f4;
	height:2.8em;
	padding:0.4em 1.5em 0.4em 3em;
	border-radius:5em;
	line-height:2em;
	position:relative;
	background:#7e84ad1c;
	color:#7b83b9;
	margin-bottom:0.7em;
}
.approval-request .approval-metadata {
	position:absolute;
	top:0.4em; left:0.4em;
}
.approval-request .roundel {
	display:block;
	width:2em;
	height:2em;
	line-height:2em;
	border-radius:50%;
	cursor:pointer;
	overflow:hidden;
	text-align:center;
}
.approval-request .roundel img {
	display:block;
	width:100%;
	height:100%;
	transition:filter 150ms;
}
.approval-request .roundel img:hover {
	filter:brightness(90%);
}
.approval-request .approval-responses {
	float:right;
}
.approval-request .approval-responses span {
	display:inline-block;
	background:#fff;
	border:1px solid #7e84ad77;
	border-radius:0.3em;
	width:3.5em;
	padding:0.25em;
	margin-left:0.3em;
	line-height:1.2;
	text-align:center;
	cursor:pointer;
}

.approval-request .approval-responses span.selected {
	color:#fff;
	background:#7b83b9;
	border-color:#7b83b9;
}




@media only screen and (max-width:1500px) {
	html {
		font-size:14px;
	}
}


@media only screen and (max-width:1250px) {
	html {
		font-size:1.1vw;
	}
}


@media only screen and (max-width:1430px) {
	.product-icons {
		font-size:0.95vw;
	}
}


@media only screen and (max-width:900px) {
	html.task-view {
		font-size:13px;
	}
	html.task-view #artwork-panel {
		display:none;
	}
	html.task-view #info-panel {
		position:static;
		width:auto;
		height:100vh;
		border-radius:0;
	}
	html.task-view #info-panel .artwork-nav {
		display:block;
	}
	html.task-view #comments,
	html.task-view #showComments {
		display:none;
	}
	html.task-view #task-content {
	    height: calc(100vh - 10.8em);
	}
	html.task-view #info-panel.approved:after {
		top:0; right:0;
		width:1.6em;
		height:1.6em;
		line-height:1.6em;
		border-radius:0 0 0 0.6em;
	}
	html.task-view .close-button {
		display:none;
	}
	html.task-view .artwork-wrapper-top {
		display:block;
	}
}






























































/*
—————————————————————
Board Columns
—————————————————————
*/
.board-columns {
	display:table;
	width:100%;
	min-height:300px;
	table-layout:fixed;
}
.board-columns .column {
	display:table-cell;
	padding:0.2em 0;
}
.board-columns .column:first-child {
	border:0;
}
.board-columns .column-scroller {
	height:calc(100vh - 20.5em);
	overflow-y:scroll;
	scrollbar-width:thin;
	padding:0 0.8em;
}
.board-columns h3 {
	border-bottom:1px solid #ddd;
	line-height:1;
	padding-bottom:0.3em;
	margin:0 0.8rem 1.5em 0.8rem;
}
.board-columns h3 strong {
	display:inline-block;
	font-weight:inherit;
	cursor:pointer;
}
.board-columns h3 span {
	color:#aaa;
	font-size:0.8em;
}
.board-columns h3:before {
	content:'\f111';
	font-family:fa-solid;
	width:1.1em;
	display:inline-block;
	transform:scale(60%);
}

.board-columns .status1 h3:before { color:var(--elsa) }
.board-columns .status2 h3:before { color:#0f81c2 }
.board-columns .status3 h3:before { color:var(--maleficent) }
.board-columns .status4 h3:before { color:var(--barbie) }
.board-columns .status5 h3:before { color:var(--leela) }

.studio-view h3:before {
	font-family:fa-light;
	color:#8cb68e !important;
	transform:none;
	margin-right:0.3em;
}
.studio-view .status5 h3:before {
	color:#848cc9 !important;
}




.studio-view h3.studio1:before { content:'\f007' }
.studio-view h3.studio2:before { content:'\f46d' }
.studio-view h3.studio3:before { content:'\f304' }
.studio-view h3.studio4:before { content:'\f01c' }
.studio-view h3.studio5:before { content:'\f00c' }


.board-columns .tile {
	position:relative;
	margin-bottom:0.7em;
}
.board-columns .tile-inactive {
	display:none;
}
.board-columns .project {
	display:block;
	background:#fff;
	border-radius:0.3em;
	padding:0.7em 0.8em;
	line-height:1.2;
	height:7.3em;
	position:relative;
	border-bottom:3px solid #eee;
	xbox-shadow:0 1px 3px #ececec;
	transition:border-color 150ms, height 250ms ease-in-out, margin-bottom 250ms ease-in-out;
}

/* Tile border hovers */
.board-columns .status1 a.project:hover,
.board-columns .status1 .show-date-picker a.project {
	border-color:#a5d5e7;
}
.board-columns .status2 a.project:hover,
.board-columns .status2 .show-date-picker a.project,
.board-columns .status2 .show-koc a.project {
	border-color:#3f9ace
}
.board-columns .status3 a.project:hover,
.board-columns .status3 .show-date-picker a.project,
.board-columns .status3 .show-assignees a.project,
.board-columns .status3 .show-request-details a.project {
	border-color:#a3d1ab;
}
.board-columns .status4 a.project:hover,
.board-columns .status4 .show-date-picker a.project {
	border-color:#f085ae;
}
.board-columns .status5 a.project:hover {
	border-color:#848cc9;
}



.board-columns .project h4 {
	font-size:1em;
	font-weight:bold;
	padding-right:3.5em;
	margin-bottom:0.1em;
	text-transform:none;
}
.board-columns .project h4 span {
	font-size:0.85em;
	font-weight:500;
}
.board-columns .project h5 {
	font-size:0.85em;
	color:#aaa;
	margin-bottom:1em;
	height:2.4em;
	word-break:break-word;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.board-columns .author {
	font-size:0.95em;
	position:absolute;
	bottom:0.9em; left:0.8em;
	overflow:hidden;
	border-radius:50%;
}
.board-columns .round-number {
	position:absolute;
	font-size:0.85em;
	bottom:1.3em; left:3.3em;
}
.board-columns .author img {
	display:block;
	width:1.6em;
	height:1.6em;
	border-radius:50%;
	background:#eee;
}


.board-columns .assignee-tags {
	font-size: 0.866em;
}
.board-columns .assignee-tags li {
	display:inline-block;
	border-radius:2em;
	margin:0 1.3em 0.4em 0;
	line-height:1;
	color:#ddd;
}
.board-columns .assignee-tags li.approved-tag {
	background:#fff;
	color:inherit;
}
.board-columns .assignee-tags li:before {
	content:'\f017';
	font-family:fa-light;
	width:1.25em;
	display:inline-block;
}
.board-columns .assignee-tags li.approved-tag:before {
	content:'\f058';
	font-family:fa-solid;
	color:#848cc9;
}




.board-columns .concept-tag {
	display:inline-block;
	color:#a7942e;
	background:var(--belle);
	padding:0.3em 0.6em;
	border-radius:1em;
	font-weight:500;
}
.board-columns .awaiting-tag {
	color:#ac796c;
	background:#eedfd9;
}
.board-columns .approval-status {
	font-size:0.85em;
	position:absolute;
	bottom:1em; right:0.8em;
	max-width:calc(100% - 1.6em);
	text-align:right;
	padding:0.3em 2.3em 0.3em 0.8em;
	border-radius:2em;
	margin:0;
}
.board-columns .approval-status:after {
	font-family:fa-solid;
	font-size:0.9em;
	content:'\f078';
	transition:transform linear 200ms;
	position:absolute;
	top:0.4em; right:1em;
	width:1em;
}
.board-columns .show-koc .approval-status:after,
.board-columns .show-assignees .approval-status:after,
.board-columns .show-request-details .approval-status:after {
	transform:rotate(180deg);
}
.board-columns .status1 .approval-status,
.board-columns .status4 .approval-status {
	pointer-events:none;
	padding-right:0.9em;
}
.board-columns .status1 .approval-status:after,
.board-columns .status4 .approval-status:after {
	display:none;
}
.board-columns .approval-status:before {
	font-family:fa-solid;
	width:1.5em;
	display:inline-block;
	text-align:left;
}
.board-columns .approval-status-waiting:before {
	content:'\f017';
}
.board-columns .approval-status-approved:before {
	content:'\f00c';
}
.board-columns .status5 .approval-status-waiting:before,
.board-columns .approval-status-assignees:before {
	content:'\f007';
}
.board-columns .approval-status-unassigned {
	background:#f6f6f6 !important;
	color:#b0b0b0 !important;
}
.board-columns .approval-status-unassigned:hover {
	background:#f0f0f0 !important;
}

.board-columns .status1 .project h4 span {
	color:var(--elsa);
}
.board-columns .status1 .approval-status {
	color:var(--elsa);
	background:#8fcbe11a;
}
.board-columns .status1 .approval-status-approved {
	background:var(--elsa) !important;
}
.board-columns .status1 .project-waiting-me {
	border-color:#8fcbe1cc !important;
}
.board-columns .status1 .date-overdue {
	background:#a5d5e7 !important;
}



.board-columns .status2 .project h4 span {
	color:#0f81c2;
}
.board-columns .status2 .approval-status {
	color:#0f81c2;
	background:#0f81c21a;
}
.board-columns .status2 .show-assignees .approval-status,
.board-columns .status2 .approval-status:hover {
	background:#0f81c22a;
}
.board-columns .status2 .approval-status-approved {
	background:#0f81c2 !important;
}
.board-columns .status2 .project-waiting-me {
	border-color:#0f81c2cc !important;
}
.board-columns .status2 .date-overdue {
	background:#3f9ace !important;
}

/*
.board-columns .status3 .approval-status {
	color:#f6914e;
	background:#f6914e1a;
}
.board-columns .status3 .show-assignees .approval-status,
.board-columns .status3 .approval-status:hover {
	background:#f6914e2a;
}
.board-columns .status3 .approval-status-approved {
	background:#f6914e !important;
}
.board-columns .status3 .project-waiting-me {
	border-color:#f6914ecc !important;
}
.board-columns .status3 .date-overdue {
	background:#f6914ecc !important;
}
*/

.board-columns .status3 .project h4 span {
	color:#72ba7e;
}
.board-columns .status3 .approval-status {
	color:#72ba7e;
	background:#8cc6961a;
}
.board-columns .status3 .show-assignees .approval-status,
.board-columns .status3 .approval-status:hover {
	background:#8cc6962a;
}
.board-columns .status3 .approval-status-approved {
	background:var(--maleficent) !important;
}
.board-columns .status3 .project-waiting-me {
	border-color:#8cc696cc !important;
}
.board-columns .status3 .date-overdue {
	background:#a3d1ab !important;
}


.board-columns .status4 .project h4 span {
	color:var(--barbie);
}
.board-columns .status4 .approval-status {
	color:var(--barbie);
	background:#e6347818;
}


.board-columns .status5 .project h4 span {
	color:#848cc9;
}
.board-columns .status5 .approval-status {
	color:#848cc9;
	background:#edeff7;
}
.board-columns .status5 .project {
	height:7em;
	border-left:0.5em solid #9fa4d2;
	border-bottom:0;
}
.board-columns .status5 .assignee-tags {
	display:block !important;
	position:absolute;
	bottom:0.8em; left:0.8em;
}
.board-columns .assignee-tags li {
	color:inherit;
}
.board-columns .assignee-tags li:before {
	color:#848cc9;
}
.board-columns .status5 .date {
	pointer-events:none;
	background:none;
	color:#848cc9;
	font-weight:normal;
}
.board-columns .status5 .tile:hover .no-date {
	opacity:0;
}




.board-columns .approval-status-approved {
	color:#fff !important;
}
.board-columns .approval-status-waiting-me {
	color:#fff !important;
	background:var(--barbie) !important;
}

.board-columns .round {
	position:absolute;
	bottom:3.6em; left:1em;
	font-size:0.8125rem;
}
.board-columns .progress {
	xposition:absolute;
	bottom:3.5em; left:0.8em;
	width:calc(100% - 1.6em);
}
.board-columns .progress-bar {
	height:3px;
	border-radius:0.2em;
	position:absolute;
	top:100%; left:0;
	width:100%;
}
.board-columns .progress-bar span {
	display:block;
	height:100%;
	background:var(--maleficent);
	background:#a3d1ab;
}
.board-columns .status5 .progress-bar span {
	background:var(--barbie);
}

.board-columns .progress-bar-completed span {
	background:var(--maleficent);
}


.board-columns .progress-bars {
	display:table;
	table-layout:fixed;
	height:0.2em;
	width:calc(100% + 6px);
	border-spacing:3px;
	margin:0 -3px;
}
.board-columns .progress-bars span {
	display:table-cell;
	border-radius:0.1em;
	height:0.2em;
	background:#eee;
}
.board-columns .progress-bars span.approved {
	background:var(--barbie);
}
.board-columns .status6 .progress-bars span.approved {
	background:var(--leela);
}


.board-columns .progress-score {
	font-size:0.8125rem;
	margin-top:0.3em;
	xcolor:#aaa;
	xtext-align:center;
	xopacity:0;
	transition:opacity 150ms;
}
.board-columns a:hover .progress-score {
	xopacity:1;
}
.board-columns .date {
	position:absolute;
	top:-2px; right:-2px;
	font-size:0.8em;
	padding:0.4em 0.75em;
	border-radius:0 0.3em 0 0.5em;
	transition:background-color 150ms;
	cursor:pointer;
	background:rgba(193 196 203 / 17%);
}
.board-columns .project-waiting-me .date {
	top:0; right:0;
	border-radius:0 0.2em 0 0.5em;
}
.board-columns .no-date {
	opacity:0;
	transition:opacity 150ms;
	background:none;
}
.board-columns .no-date:after {
	font-family:fa-light;
	content:'\f073';
	color:#999;
}
.board-columns .tile:hover .no-date {
	opacity:1;
}
.board-columns .date-overdue {
	color:#fff;
	font-weight:500;
}
.board-columns .date:hover {
	background:rgba(193 196 203 / 17%);
}
.board-columns .due-date-picker {
	display:none;
	position:absolute;
	background:#fff;
	z-index:1;
	box-shadow:0 0 1em #00000033;
	border-radius:0.4em;
	top:2em; right:1em;
	font-size:0.875em;
}
.board-columns .due-date-picker div {
	padding:1em;
	max-width:14em;
}
.board-columns .due-date-picker div + div {
	border-top:1px solid #ddd;
	padding:0.6em 0 0.8em 0;
}
.board-columns .show-date-picker .due-date-picker,
.board-columns .show-koc .koc-picker {
	display:block;
}
.board-columns .due-date-picker input,
.board-columns .due-date-picker select,
.board-columns .koc-picker input,
.board-columns .koc-picker select {
	border:0;
	border-radius:0.3em;
	padding:0.2em 0.3em;
	outline:0;
	margin-bottom:0.4em;
	border:1px solid #ccc;
	width:100%;
}
.board-columns .koc-picker input.text {
	padding:0.3em 0.4em;
}
.board-columns .koc-picker input.error {
	border-color:var(--barbie);
}
.board-columns .due-date-picker .button,
.board-columns .koc-picker .button {
	margin-top:0.6em;
}
.board-columns .koc-picker .button-url {
	float:right;
}
.board-columns .koc-picker {
	display:none;
	position:absolute;
	top:calc(100% - 0.5em); left:1em;
	width:calc(100% - 2em);
	color:#333;
	background:#fff;
	box-shadow:0 0 1.8em rgba(0,0,0,0.25);
	border-radius:0.4em;
	padding:0.4em 0;
	font-size:0.875em;
	z-index:1;
	padding:1em;
}


.board-columns .koc {
	margin:0;
	font-size:0.85em;
}

.board-columns .milestones {
	margin:0;
	text-align:center;
}
.board-columns .milestones span {
	font-size:0.85em;
	display:inline-block;
	margin-right:1.6em;
	color:#ddd;
}
.board-columns .milestones span:last-child {
	margin-right:0;
}
.board-columns .milestones span:before {
	font-family:fa-solid;
	content:'\f00c';
	display:inline-block;
	width:1.3em;
}
.board-columns .milestones span.complete {
	color:#333;
}
.board-columns .milestones span.complete:before {
	color:var(--elsa);
	content:'\f00c';
}


.board-columns .comments {
	position:absolute;
	bottom:0; right:0;
	font-size:0.8125rem;
}
.board-columns .comments:before {
	font-family:fa-light;
	content:'\f075';
	margin-right:0.3em;
}
.board-columns .comments-recent:before {
	font-family:fa-solid;
}


.board-columns .info-tile {
	position:absolute;
	top:50%; left:50%;
	padding:10px;
	background:#fff;
	box-shadow:0 0 10px rgba(0,0,0,0.2);
	z-index:1;
	border-radius:0.3em;
	display:none;
}
.board-columns .info-tile img {
	display:block;
	width:100px;
}

@media only screen and (max-width:2100px) {
	.board-columns .hideable {
		display:none;
	}
}

@media only screen and (max-width:1900px) {
	.board-columns .milestones span {
		margin-right:1em;
	}
}







/* NEW stuff */
.dropdown-wrapper {
	height:2.2em;
	margin-bottom:2em;
}
.dropdown-wrapper .dropdown {
	float:left;
	margin-right:1em;
}
.dropdown {
	position:relative;
}
.dropdown-label {
	cursor:pointer;
	height:2.2em;
	font-weight:500;
	font-size:0.9em;
	user-select:none;
}
.dropdown-ursula .dropdown-selected-text,
.dropdown-ursula .dropdown-trigger {
	background:var(--ursula);
}
.dropdown-elsa .dropdown-selected-text,
.dropdown-elsa .dropdown-trigger {
	background:var(--elsa);
}
.dropdown-selected-text,
.dropdown-trigger {
	float:left;
	color:#fff;
	height:2.2em;
	line-height:2.2em;
}
.dropdown-selected-text {
	padding:0 1em;
	border-radius:1.1em 0 0 1.1em;
}
.dropdown-trigger {
	width:2.6em;
	text-align:center;
	box-shadow:0 0 0 100vmax inset rgb(0, 0, 0, 0.07);
	padding:0;
	border-radius:0 1.1em 1.1em 0;
}
.dropdown-trigger:after {
	content:'\f107';
	font-family:fa-solid;
	transition:transform linear 200ms;
	display:inline-block;
}
.dropdown-options {
	display:none;
	position:absolute;
	z-index:2;
	top:2.5em; left:0;
	border:1px solid #e2e2e2;
	box-shadow:0 0.1em 0.3em rgba(0,0,0,0.2);
	background:#fff;
	border-radius:0.5em;
	padding:0.5em 0;
	user-select:none;
	min-width:16em;
	max-height:50vh;
	overflow-y:auto;
	scrollbar-width:thin;
}
.dropdown-options a {
	display:block;
	padding:0.2em 2em 0.2em 1em;
	white-space:nowrap;
}
.dropdown-options a:hover {
	background:rgba(193 196 210 / 17%);
}
.dropdown-options a:active {
	background:rgba(193 196 210 / 23%);
}
.dropdown-options li.section-end {
	padding-bottom:0.4em;
	margin-bottom:0.4em;
	border-bottom:1px solid #ddd;
}
.dropdown-options li.section-end:last-child {
	padding-bottom:0;
	margin-bottom:0;
	border-bottom:none;
}
.dropdown-options li.section-start {
	padding-top:0.4em;
	margin-top:0.4em;
	border-top:1px solid #ddd;
}
.dropdown-options li.section-start:first-child {
	padding-top:0;
	margin-top:0;
	border-top:none;
}
.dropdown-active .dropdown-options {
	display:block;
}
.dropdown-active .dropdown-trigger:after {
	transform:rotate(180deg);
}




.project-header {
	position:relative;
	text-align:center;
	margin-bottom:2em;
	padding-top:1em;
}
.project-header h1 {
	font-size:2em;
	padding-left:2em;
	padding-right:2em;
	font-weight:normal;
	margin-bottom:0.3em;
}
.project-nav a {
	position:absolute;
	top:2.4em; left:0;
	width:4em;
	height:5em;
	text-align:center;
	opacity:0.5;
	color:var(--elsa);
}
.portfolio .project-nav a {
	top:-0.6em;
}
.project-nav a:hover {
	opacity:0.8;
}
.project-nav a:active {
	opacity:1;
}
.project-nav a:last-child {
	left:auto; right:0;
}
.project-nav a:after {
	content:'\f053';
	font-family:fa-light;
	font-size:2.5em;
	line-height:2;
}
.project-nav a:last-child:after {
	content:'\f054';
}
.project-nav span {
	display:none;
}





.brand-summary {
	float:left;
	border:1px solid #dadbdd;
	border-radius:0.5em;
	margin-bottom:4em;
}
.brand-summary .brand-logo-wrapper {
	float:left;
	width:11em;
	height:8em;
	padding:1em;
	border-right:1px solid #dadbdd;
	background:rgb(193 196 203 / 17%);
}
.brand-summary .brand-logo-wrapper span {
	display:flex;
	width:9em;
	height:6em;
	justify-content:center;
	align-items:center;
}
.brand-summary img {
	display:block;
	max-width:8em;
	max-height:5em;
}
.brand-summary-text {
	float:left;
	height:8em;
	padding:1em 1.5em;
}
.brand-summary-text h3 {
	line-height:1.1;
	margin-bottom:0.4em;
}
.brand-summary-text p {
	margin-bottom:0.7em;
}
.brand-summary-text .button {
	font-size:0.9em;
}


.company-summaries {
	margin-bottom:3em;
}
.company-summaries .brand-summary {
	width:24em;
	margin:0 1em 1em 0;
}
.company-summaries .brand-summary .brand-logo-wrapper {
	width:10em;
}
.company-summaries .brand-summary .brand-logo-wrapper span {
	width:8em;
}
.company-summaries .brand-summary img {
	max-width:7em;
	mix-blend-mode:multiply;
}
.company-summaries .brand-summary-text {
	width:13.6em;
}
.company-summaries .brand-summary:hover .brand-logo-wrapper {
	background:rgb(193 196 203 / 27%);
}





.previous-brief-selector {
	position:relative;
	height:1.8em;
	margin-bottom:2.2em;
}
.previous-brief-selector .trigger {
	display:inline-block;
	font-weight:500;
	font-size:1.1em;
	cursor:pointer;
	text-transform:lowercase;
	user-select:none;
	line-height:1.8em;
	xbackground:#fff;
	xpadding:0 0.8em;
	xborder-radius:2em;
}
.previous-brief-selector .trigger:after {
	font-family:fa-light;
	font-size:0.9em;
	content:'\f078';
	margin-left:0.5em;
	margin-right:-1em;
	color:#999;
	display:inline-block;
	width:1em;
	text-align:center;
	transition:transform linear 200ms;
}
.previous-brief-selector.active .trigger:after {
	transform:rotate(180deg);
}
.previous-brief-selector ul {
	top:2.5em; left:0;
	width:auto;
}
.previous-brief-selector.active ul {
	display:block;
}




.briefing-form .divider {
	margin:3em -3em;
	border-top:1px solid #ccc;
}
.offer-tile-readonly {
	background:#fff;
	padding:1.4em 1.6em;
	margin-bottom:1.2em;
	border-radius:0.6em;
	border-bottom:1px solid #d2d2d2;
	box-shadow:0 0.1em 0.2em rgba(0, 0, 0, 0.04);
	position:relative;
}
.offer-tile-readonly .button {
	position:absolute;
	top:1em; right:1em;
}
#form .offer-tile-readonly h3 {
	padding-right:8em;
	font-weight:normal;
}
#form .offer-tile-readonly h3 b {
	font-weight:bold;
	color:var(--barbie);
}
#form .offer-tile-readonly p {
	margin:0;
}
#form .offer-tile-readonly p + p {
	margin-top:0.5em;
}
.product-images-readonly li {
	float:left;
	width:9em;
	height:9em;
	margin:0 1em 2em 0;
	padding:0.5em;
	background:#fff;
	border:1px solid #d2d2d2;
	border-radius:5px;
	box-shadow:0 0.1em 0.2em rgba(0, 0, 0, 0.04);
	position:relative;
}
.product-images-readonly .has-hero li:first-child:after {
	content:'hero';
	position:absolute;
	bottom:-0.6em;
	left:calc(50% - 2em);
	pointer-events:none;
	width:4em;
	color:#fff;
	background:var(--marge);
	height:1.6em;
	line-height:1.6em;
	text-align:center;
	font-size:0.9em;
	font-weight:500;
	border-radius:5px;
}
.product-images-readonly a {
	display:flex;
	align-items:center;
	justify-content:center;
	width:8em;
	height:8em;
}
.product-images-readonly img {
	max-width:8em;
	max-height:8em;
	user-select:none;
}
.product-images-readonly .extension {
	position:absolute;
	top:calc(50% - 1rem); left:0;
	width:100%;
	text-transform:uppercase;
	pointer-events:none;
	text-align:center;
	font-size:1.2em;
	color:#999;
	background:#ddd;
	font-weight:500;
	height:2rem;
	line-height:2rem;
	display:none;
}
.product-images-readonly .cannot-render-thumb .extension {
	display:block;
}








/*
—————————————————
Tables
—————————————————
*/
.grid {
	width:100%;
	line-height:1.3;
	margin-bottom:1em;
	background:#fff;
}
.grid-wrapper {
	margin-bottom:3.2em;
}
.grid th {
	font-weight:500;
	padding:0.8rem 0.7rem;
	color:var(--marge);
	background:rgba(193 196 203 / 17%);
	border-top:1px solid rgba(193 196 203 / 25%);
	border-bottom:2px solid rgba(193 196 203 / 50%);
	text-transform:lowercase;
}
.grid th a {
	display:inline-block;
	line-height:1;
}
.grid a.hover-link:hover {
	text-decoration:underline;
}
.grid th a:after {
	font-family:fa-solid;
	margin-left:0.3em;
}
.grid th a.asc:after {
	content:'\f0d8';
}
.grid th a.desc:after {
	content:'\f0d7';
}
.grid td.group-header,
.grid td.section-header {
	padding:2em 0 0 0;
	position:relative;
	border-bottom:2px solid #e2e2e2;
	margin-bottom:-1px;
}
.grid .group-details {
	padding:0.5em 0;
	position:relative;
}
.grid td h3 {
	font-size:1.1em;
	margin:0.3em 0 0 0;
}
.grid td.group-header h3,
.grid td.section-header h3 {
	color:var(--marge);
	display:inline;
}
.grid td.group-header a:hover {
	text-decoration:underline;
}
.grid td.group-header h3 a:hover {
	text-decoration:none;
}
.grid td.section-header {
	padding:2em 0 0 0;
}
.grid td.section-header h3 {
	padding:0.5em 0;
	display:inline-block;
	margin:0 0.4em 0 0;
}
.grid span.nested {
	float:left;
	width:2em;
	height:1.2em;
	margin:-0.6em 0.4em 0 0.5em;
	overflow:hidden;
	position:relative;
}
.grid span.nested:before {
	content:'';
	width:100%;
	height:150%;
	border:2px solid #f02e75;
	border-radius:5px;
	position:absolute;
	bottom:0; left:25%;
}
.grid-tight span.nested {
	margin-top:-0.4em;
}
.grid td {
	padding:0.6em 0.7em;
	border-bottom:0.05em solid #e2e2e2;
	transition:background-color 150ms linear;
	vertical-align:top;
}

.grid .status-lozenge {
	color:#fff;
	padding:0 0.85em;
	line-height:2;
	border-radius:2em;
	font-size:0.9em;
	font-weight:500;
	text-transform:lowercase;
	position:absolute;
	bottom:3.6rem;
	left:2rem;
}
.grid .status-light-blue {
	background:var(--elsa);
}
.grid .status-blue {
	background:var(--marge);
}
.grid .status-green {
	background:var(--maleficent);
}
.grid .status-pink {
	background:var(--barbie);
}
.grid .status-purple {
	background:var(--leela);
}



/*
—————————————————
New Indicator
—————————————————
*/
.grid .dot {
	display:block;
	padding-left:1.3em;
	position:relative;
	margin-left:0.5em;
	text-transform:lowercase;
}
.grid .dot:before {
	content:'';
	width:0.7em;
	height:0.7em;
	border-radius:50%;
	position:absolute;
	top:0.33em; left:0;
}
.grid .dot-lightblue:before {
	background:var(--elsa);
}
.grid .dot-blue:before {
	background:var(--marge);
}
.grid .dot-green:before {
	background:var(--maleficent);
}
.grid .dot-pink:before {
	background:var(--barbie);
}
.grid .dot-purple:before {
	background:var(--leela);
}
.grid .dot-hidden:before {
	display:none;
}



/*
———————————————————
Fetch Briefing Form
———————————————————
*/
#form .fetch-package-selector {
	width:calc(100% + 1.2em);
	margin-right:-1.2em;
}
#form .fetch-package-selector li {
	float:left;
	width:calc(25% - 1.2em);
	height:6em;
	margin:0 1.2em 1.2em 0;
}
#form .fetch-package-selector li label {
	display:block;
	width:100%;
	height:100%;
	padding:1em;
	border-radius:0.6em;
	cursor:pointer;
	background:#fff;
	border:2px solid #fff;
    box-shadow:0 0 1em rgba(0, 0, 0, 0.03);
	transition:none;
}
#form .fetch-package-selector input + label:hover {
	border-color:#d5e6f3;
}
#form .fetch-package-selector li input {
	display:none;
}
#form .fetch-package-selector li input:checked + label {
	color:#fff;
	background:#4987c3;
	border-color:#4987c3;
}


.library-images li {
	float:left;
	width:7em;
	height:7em;
	margin:0 0.6em 0.6em 0;
	border-radius:5px;
	box-shadow:0 0.1em 0.2em rgba(0, 0, 0, 0.04);
	position:relative;
	overflow:hidden;
	background:#555;
}
.library-images a.thumb {
	display:flex;
	align-items:center;
	justify-content:center;
	width:7em;
	height:7em;
}
.library-images .extension {
	position:absolute;
	top:calc(50% - 1rem); left:0;
	width:100%;
	text-transform:uppercase;
	pointer-events:none;
	text-align:center;
	font-size:1.2em;
	color:#999;
	background:#ddd;
	font-weight:500;
	height:2rem;
	line-height:2rem;
	display:none;
}
.library-images .cannot-render-thumb .extension {
	display:block;
}
.library-images img {
	max-width:7em;
	max-height:7em;
	user-select:none;
	cursor:pointer;
}
.library-images .remove {
	position:absolute;
	width:1.2em;
	height:1.2em;
	line-height:1.2em;
	text-align:center;
	border-radius:0.2em;
	top:0.2em; right:0.2em;
	z-index:1;
	cursor:pointer;
	color:#fff;
	background:rgba(255,255,255,0.2);
}
.library-images .remove:after {
	content:'\f00d';
	font-family:fa-light;
}