/* http://meyerweb.com/eric/tools/css/reset/ */

/* Poppins Google Font */
@import url(https://fonts.googleapis.com/css2?family=Poppins);

html, body, div, span, button, textarea, hr, input, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

input {
	vertical-align: bottom;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote::before, blockquote:after, q::before, q:after {
	content: '';
	content: none;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}
*, *:after, *::before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body, input, button {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}


/*============================================================
 GENERAL ELEMENTS
 guru - 2d57d6
 documents - 2d57d6
 people - f8b065
 assets - 6091b3 / 507a97
============================================================*/

body {
	border-top: 10px solid #2d57d6;
	font-family: "source-sans-pro", sans-serif;
	font-style: normal;
	color: #333;
}
a {
	text-decoration: none !important;
	color: #2d57d6;
	cursor: pointer;
}
a:hover {
	color: #254BBB;
}
i {
	font-style: italic;
}
b {
	font-weight: 600;
}
.wrapper {
	/* width: 1000px; */ /* Changed by Jason J 2020-03-11 removed for bootstrap to be able to work its responsive magic */
	width: 1000px; /* Jason Workman: put back in until we can figure out all ramifications of taking this out.*/
	margin: 0 auto;
}
.wrapper-wide {
	/* this contains the "three-quarter", and "one-quarter" elements, specified below*/
	width: 1150px;
	margin: 0 auto;
}
.fontzero {
	font-size: 0;
}
header {
	position: relative;
	width: 100%;
	height: 70px;
}
header .logo {
	display: block;
	width: 300px;
	height: 80px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	background: url(/ss/images/script-logo.svg) 50% 40% no-repeat;
	background-size: auto 36px;
	position: absolute;
	text-indent: -3000px;
}

@media all and (max-width: 1000px) and (min-width: 300px) {
	header .logo  {
		margin-left: 0px;
		left: 20px;
	}
}

.cursorPointer {
	cursor: pointer;
}

.main-body {
	background: url(/ss/images/bkd.png);
	width: 100%;
	min-height: 400px;
	padding: 70px 0;
}
.admin-header {
	border-top: 1px solid #ccc;
    background: url(/ss/images/bkd.png);
    width: 100%;
    padding: 20px 0 0 0;
}

.display-inline-block {
	display: inline-block;
	vertical-align: top;
}
.display-inline-block-XXX {
	/*radios & labels use*/
	display: inline-block;
}
.mainsection {
	position: relative;
}
.center {
	text-align: center;
}
.float-right {
	float: right;
}
.float-left {
	float: left;
}
.one-quarter {
	width: 175px;
}
.three-quarter {
	/*.75*960 = 800 - used to be */
	width: 975px;
	font-size:16px; /*change the font size to whatever you want*/
}
hr {
	height: 1px;
	margin: 25px 0;
	background-color: #666;
}

.bg-red {
    color: red;
}

.bg-green {
    color: green;
}

input[type='radio']:after {
	width: 18px;
	height: 18px;
	border-radius: 18px;
	top: -2px;
	left: -1px;
	position: relative;
	background-color: #ffffff;
	content: '';
	display: inline-block;
	visibility: visible;
	border: 1px solid #d1d3d1;
}

input[type='radio']:checked:after {
	width: 18px;
	height: 18px;
	border-radius: 18px;
	top: -2px;
	left: -1px;
	position: relative;
	background-color: #2d57d6;
	content: '';
	display: inline-block;
	visibility: visible;
	border: 1px solid white;
}

.documentLink {
	color: #2d57d6;
}

/*============================================================
 Z-Index
============================================================*/

.md-modal::before {
	z-index: 550;
}
#side-nav  {
	z-index: 900;
}

/*============================================================
 TYPOGRAPHY
============================================================*/

h1 {
	font-weight: 600;	font-size: 28px;
	color: #fff;
	padding-bottom: 20px;
	display: table;
	/* width: 960px; */ /* Changed by Jason J 2020-03-11 removed for bootstrap to be able to work its responsive magic */
	margin: 0 auto;
	color: #333;
	white-space: nowrap;
}
h1.documents {
	color: #45494D;
	font-family: "Poppins";
}
h1.people {
	color: #45494D;
	font-family: "Poppins";
}
h1.admin {
	color: #45494D;
	width: 1260px;
	font-family: "Poppins";
}
h1 span {
	display: table-cell;
	padding: 0 40px;
	position: relative;
	top: 10px;
}
h1 em {
	font-size: 50px;
	display: inline-block;
	vertical-align: top;
	position: relative;
	top: -14px;
	margin-right: 10px;
}
h1:before,
h1:after {
	content: "";
	display: table-cell;
	width: 50%;
	padding: 0 40px;
	background-image: webkit-linear-gradient(transparent 45%, #ccc 45%, #ccc calc(45% + 1px), transparent calc(45% + 1px));
	background-image:    moz-linear-gradient(transparent 45%, #ccc 45%, #ccc calc(45% + 1px), transparent calc(45% + 1px));
	background-image:        linear-gradient(transparent 45%, #ccc 45%, #ccc calc(45% + 1px), transparent calc(45% + 1px));
}
h2 {
	font-family: "Poppins";
	font-size: 25px;
	font-weight: 400;
	margin-bottom: 20px;
}
h3 {
	font-family: "Poppins";
}
h4 {
	font-family: "Poppins";
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 13px;
	line-height: 25px;
}
form > h4 {
	/*margin-top: 12px;*/
}
/*document tile titles TODO move with other tiles*/
.documents-tile h4 {
	font-size: 22px;
	font-weight: 400;
}

.assets-tile h4 {
	font-size: 22px;
	font-weight: 400;
}

#questionnaireContent h4 {
	margin-top: 25px;
	margin-bottom: 24px;
	line-height: 36px;
}

#manageDocumentContent h4 {
	line-height: 36px;
}

h5 {
	font-family: "Poppins";
}

.questionRow {
	/*use to vertically separate questionnaire rows like <div class="form-inline row questionRow"> .. Yes/No*/
	margin: 8px 0px;
}
.beneTarget {
	margin-top:10px;
	margin-bottom:10px;
}
#personsRegion {
	margin-top: 21px;
}

#progressDialogTitle {
	font-family: "Poppins";
}

.top-section {
	font-family: "Poppins";
}

/*.md-content div > h4 span {*/
	/*display: inline-block;*/
	/*font-size: 28px;*/
	/*margin-right: 10px;*/
	/*color: #777;*/
	/*position: relative;*/
	/*top: 4px;*/
/*}*/
h5 {
	font-size: 22px;
	font-weight: 600;
	padding: 0 0 18px 0;
}
h5 dfn {
	display: block;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 400;
	padding-top: 10px;
	letter-spacing: 1px;
}
small {
	display: inline-block;
	font-style: italic;
	font-size: 15px;
	line-height: 20px;
	font-weight: 400;
}
small a {
	font-weight: 600;
	color: #000;
	border-bottom: 1px solid #999;
}
small a:hover {
	color: #79bd8f;
	color: #5bcb87;
	border-bottom: none;
}

/*============================================================
 Icon Fonts
============================================================*/

@font-face {
	font-family: 'icomoon';
	src:url('/api/fonts/icomoon.eot?wu2xef');
	/*src:url('/api/fonts/icomoon.eot?#iefixwu2xef') format('embedded-opentype'),*/
	src:url('/api/fonts/icomoon.eot?wu2xef#iefix') format('embedded-opentype'),
	url('/api/fonts/icomoon.woff?wu2xef') format('woff'),
	url('/api/fonts/icomoon.ttf?wu2xef') format('truetype'),
	url('/api/fonts/icomoon.svg?wu2xef#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
}

.icon-search::before {
	content: "\f002";
}
.icon-pencil::before {
	content: "\f040";
}
.icon-question {
	/*prevents popover flicker*/
	display:inline-block;
}
.icon-question::before {
	content: "\f059";
	color: #2d57d6;
	/*font-size: 17px;*/
	font-size: 100%;
	vertical-align: baseline;
	/*margin-bottom:-10px;*/
}
.icon-gears::before {
	content: "\f085";
}

.icon-caret-down::before { content: "\f0d7"; }
.icon-caret-up::before { content: "\f0d8"; }
.icon-caret-down, .icon-caret-up {
	color: #bbbbbb;
	font-size: 22px;
	margin-right: 10px;
	margin-left: 10px;
}

.showDocumentsContainer {
	display: flex;
	align-items: center;
}

.showDocuments:hover {
	cursor: pointer;
	color: #2d57d6;
}

.showDocuments > span {
	color: #333;
}
.showDocuments > span:hover {
	color: #2d57d6;
}

.printIcon {
	margin-left: 54px;
}

.icon-caret-left::before {
	content: "\f0d9";
}
.icon-caret-right::before {
	content: "\f0da";
}
.icon-check::before {
	content: "\f14a";
}
.icon-email::before {
	content: "\e002";
}
.icon-video::before {
	content: "\e018";
}
.icon-plus::before {
	content: "\e040";
}
.icon-download::before {
	content: "\e067";
}
.icon-upload::before {
	content: "\e067";
}

.icon-cross::before { content: "\e117"; }
.icon-cross {
	color: #bbbbbb;
	font-weight: bold;
	margin-right: 10px;
	margin-left: 10px;
}

.icon-cross:hover, .icon-caret-down:hover, .icon-caret-up:hover {
	color: #f33;
}

.icon-menu::before {
	content: "\e120";
}
.icon-people::before {
	content: "\e600";
}
.icon-documents::before {
	content: "\e601";
}
.icon-assets::before {
	content: "\e603";
}
.icon-airplane::before {
	content: "\e604";
}
.icon-enter::before {
	content: "\e606";
}
.icon-printer::before {
	content: "\e607";
}
.icon-lock::before {
	content: "\e602";
}

/*============================================================
 UI
============================================================*/

.btn-small {
    display: inline-block;
    padding: 4px 10px;
    background-color: #2d57d6;
    border-radius: 4px;
    font-size: 16px;
    color: #fff;
    font-weight: 600;
    margin-right: 20px;
    line-height: 20px;
    transition: background-color 0.2s ease-in-out;
}

.main-buttons-container {
	display: flex;
}

.btn {
    display: inline-block;
    padding: 10px 20px;
    background-color: #2d57d6;
    border-radius: 4px;
    font-size: 20px;
    color: #fff;
    font-weight: 600;
    margin-right: 20px;
    line-height: 20px;
    transition: background-color 0.2s ease-in-out;
	border: 1px solid #2d57d6;
}
.btn + p.upload-link {
	display: inline-block;
}
.btn:last-of-type {
	margin-right: 0;
}
.btn:hover, .btn-primary:hover {
	background-color: #1e398a;
	color: #fff;
}
.btn:focus, .btn-primary:focus {
	background-color: #1e398a;
	color: #fff;
}
.btn-wht {
	display: inline-block;
	padding: 10px 20px;
	background-color: #fff;
	border-radius: 4px;
	font-size: 20px;
	color: #7d4f6d;
	font-weight: 600;
	margin-right: 20px;
	transition: background-color 0.2s ease-in-out;
}
.btn-wht:last-of-type {
	margin-right: 0;
}
.btn-wht:hover {
	background-color: #eee;
}
.btn-gray {
	display: inline-block;
	padding: 10px 20px;
	background-color: #ffffff;
	border-radius: 4px;
	font-size: 20px;
	color: #2d57d6;
	font-weight: 600;
	border: 1px solid #2d57d6;
	margin-right: 20px;
	transition: background-color 0.2s ease-in-out;
}
.btn-secondary-green {
	display: inline-block;
	padding: 10px 20px;
	background-color: #ffffff;
	border-radius: 4px;
	font-size: 20px;
	color: green;
	font-weight: 600;
	border: 1px solid green;
	margin-right: 20px;
	transition: background-color 0.2s ease-in-out;
}
.btn-gray:last-of-type {
	margin-right: 0;
}
.btn-gray:hover {
	background-color: #d3d3d3;
}
.btn-secondary-green:hover {
	background-color: #d3d3d3;
}
.btn-light-gray {
	display: inline-block;
	padding: 10px 20px;
	background-color: #ccc;
	border-radius: 4px;
	font-size: 20px;
	color: #fff;
	font-weight: 600;
	border: none;
	margin-right: 20px;
	cursor: progress;
	transition: background-color 0.2s ease-in-out;
}
.btn-light-gray:last-of-type {
	margin-right: 0;
}
.btn-light-gray:hover {
	background-color: #999;
}

button {
	display: inline-block;
	padding: 10px 20px;
	background-color: #2d57d6;
	border-radius: 4px;
	font-size: 20px;
	color: #fff;
	font-weight: 600;
	border: none;
	cursor: pointer;
	margin-right: 20px;
	transition: background-color 0.2s ease-in-out;
}
button:last-of-type {
	margin-right: 0;
}
button:hover {
	background-color: #1e398a;
}
button.btn-gray {
	background-color: #666;
}
button.btn-gray:hover {
	background-color: #999;
}

.btn-file {
	position: relative;
	overflow: hidden;
}
.btn-file input[type=file] {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 100%;
	min-height: 100%;
	font-size: 999px;
	text-align: right;
	filter: alpha(opacity=0);
	opacity: 0;
	outline: none;
	background: white;
	cursor: inherit;
	display: block;
}

/*============================================================
 NAVIGATION - top level
============================================================*/

header > nav ul {
	position: absolute;
	right: 30px;
	top: 20px;
}
header > nav li {
	display: inline-block;
	vertical-align: top;
	color: #666;
	margin-left: 30px;
}
header > nav li a {
	color: #666;
	transition: color 0.2s ease-in-out;
}
header > nav li a:hover {
	color: #2d57d6;
}
header > nav .icon-menu {
	font-size: 28px;
}
header > nav .airplane {
	position: relative;
	top: 5px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	font-family: "source-sans-pro", sans-serif;	font-style: normal;
}
header > nav .icon-enter,
header > nav .icon-airplane {
	padding-right: 10px;
	font-size: 15px;
	position: relative;
	top: 2px;
}

header .estatePlanChooser {
    display: none;
}

/*============================================================
 NAVIGATION - hor nav
============================================================*/

.hornav {
	width: 100%;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.hornav li {
	display: inline-block;
	text-align: center;
	width: 192px;
	border-right: 1px solid #ccc;
	font-size: 18px;
	font-weight: 400;
}
.hornav li:first-of-type {
	border-left: 1px solid #ccc;
}
.hornav li a {
	height: 66px;
	display: block;
	padding-top: 10px;
	color: #333;
	text-transform: uppercase;
	border-top: 4px solid transparent;
	transition: all 0.2s ease-in-out;
}
.hornav li[data-hornav="documents"] a:hover,
.hornav li[data-hornav="documents"] a.selected{
	border-top: 4px solid #2d57d6;
	color: #2d57d6;
}
.hornav li[data-hornav="documents"] a:hover > span,
.hornav li[data-hornav="documents"] a.selected > span{
	color: #2d57d6;
}
.hornav li[data-hornav="people"] a:hover,
.hornav li[data-hornav="people"] a.selected{
	border-top: 4px solid #2D57D6;
	color: #2D57D6;
}
.hornav li[data-hornav="people"] a:hover > span,
.hornav li[data-hornav="people"] a.selected > span{
	color: #2D57D6;
}
.hornav li[data-hornav="assets"] a:hover,
.hornav li[data-hornav="assets"] a.selected{
	border-top: 4px solid #6091b3;
	color: #6091b3;
}
.hornav li[data-hornav="assets"] a:hover > span,
.hornav li[data-hornav="assets"] a.selected > span{
	color: #6091b3;
}
/*TODO these are TBD */
.hornav li[data-hornav="other"] a:hover,
.hornav li[data-hornav="other"] a.selected{
	border-top: 4px solid #666;
	color: #666;
}
.hornav li[data-hornav="other"] a:hover > span,
.hornav li[data-hornav="other"] a.selected > span{
	color: #666;
}

.hornav li a > span {
	position: relative;
	top: 4px;
	margin-right: 6px;
	font-size: 28px;
	color: #999;
}

/*============================================================
 NAVIGATION - hor nav sub
============================================================*/

.hornav-sub {
	width: 100%;
	margin: 40px 0 60px 0;
}
.hornav-sub li {
	display: table-cell;
	text-align: center;
	font-size: 18px;
	font-weight: 400;
}
.hornav-sub li a {
	height: 50px;
	display: table-cell;
	padding: 15px 20px 0 20px;
	color: #333;
	border: 1px solid #333;
	transition: all 0.2s ease-in-out;
	white-space: nowrap;
}
.hornav-sub[data-hornav-sub="documents"] li[data-hornav-sub="off"] a {
	color: #758699;
	border-left: 1px solid rgba(117, 134, 153,0.6);
	border-top: 1px solid rgba(117, 134, 153,0.6);
	border-right: 1px solid rgba(117, 134, 153,0.6);
	border-bottom: 1px solid #758699;
	background-color: rgba(117, 134, 153,0.1);
}
.hornav-sub[data-hornav-sub="documents"] li[data-hornav-sub="off"] a:hover {
	background-color: rgba(117, 134, 153,0.2);
}
.hornav-sub[data-hornav-sub="documents"] li[data-hornav-sub="on"] a {
	color: #758699;
	background-color: transparent;
	border: 1px solid #758699;
	border-bottom: none;
}
.hornav-sub[data-hornav-sub="documents"] li:last-of-type {
	width: 100%;
	border-bottom: 1px solid #758699;
}

.hornav-sub[data-hornav-sub="admin"] li[data-hornav-sub="off"] a {
	color: #333;
	border-left: 1px solid rgba(0,0,0,0.6);
	border-top: 1px solid rgba(0,0,0,0.6);
	border-right: 1px solid rgba(0,0,0,0.6);
	border-bottom: 1px solid #333;
	background-color: rgba(0,0,0,0.1);
}
.hornav-sub[data-hornav-sub="admin"] li[data-hornav-sub="off"] a:hover {
	background-color: rgba(0,0,0,0.2);
}
.hornav-sub[data-hornav-sub="admin"] li[data-hornav-sub="on"] a {
	color: #333;
	background-color: transparent;
	border: 1px solid #333;
	border-bottom: none;
}
.hornav-sub[data-hornav-sub="admin"] li:last-of-type {
	width: 100%;
	border-bottom: 1px solid #333;
}


/*============================================================
 Navigation - Side Bar
============================================================*/

#side-nav {
	width: 370px;
	height: 100%;
	position: fixed;
	top: 0;
	right: -370px; /* start it hidden set to 0 to show*/
	overflow: scroll;
	background-color: #333;
	padding: 36px 50px;
	transition: right 0.2s ease-in-out;
}
#side-nav .btn-close {
	position: absolute;
	top: 20px;
	right: 20px;
	font-size: 24px;
	color: #666;
	transition: color 0.2s ease-in-out;
}
#side-nav .btn-close:hover {
	color: #ccc;
}
#side-nav > h3 {
	color: #999;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 1px;
}
#side-nav a {
	color: #999;
}
#side-nav > ul {
	margin-left: 40px;
}
#side-nav > ul li {
	font-size: 18px;
	font-family: "Poppins";
	letter-spacing: 1px;
	position: relative;
}
#side-nav > ul li a {
	display: block;
	padding: 15px 0;
	transition: color 0.2s ease-in-out;
}
#side-nav > ul li a span {
	color: #777;
	display: inline-block;
	font-size: 28px;
	position: absolute;
	top: 7px;
	left: -40px;
	transition: color 0.2s ease-in-out;
}
#side-nav > ul li a span.icon-gears,
#side-nav > ul li a span.icon-enter {
	font-size: 24px;
	top: 10px;
}
#side-nav > ul li a:hover,
#side-nav > ul li a:hover span {
	color: #ccc;
}

/*============================================================
 Navigation - Side Bar - Dropdown
============================================================*/

#side-nav > ul li > ul {
	margin-bottom: 20px;
}

#side-nav > ul li > ul li {
	font-size: 12px;
	font-weight: 600;
	position: relative;
	font-family: "source-sans-pro",sans-serif;
}
#side-nav > ul li > ul li a {
	text-transform: uppercase;
	display: block;
	padding: 8px 0;
	transition: color 0.2s ease-in-out;
}
#side-nav > ul li > ul li a:hover {
	color: #ccc;
}
#side-nav > ul li > ul li aside {
	position: relative;
	top: -3px;
	display: inline-block;
	padding-bottom: 5px;
	margin-top: 0;
	width: 40px;
}
#side-nav > ul li > ul li aside span {
	position: relative;
	top: 0;
	left: 0;
	font-size: 18px;
	color: rgba(255,255,255,0.5);
	transition: all 0.2s ease-in-out;
}
#side-nav > ul li > ul li aside span.icon-printer {
	font-size: 16px;
}
#side-nav > ul li > ul li aside span.icon-download {
	font-size: 20px;
	top: 2px;
}

/*============================================================
 Navigation - Admin Vertical
============================================================*/

ul.admin-vertnav {
	width: 220px;
	padding: 0 0 0 20px;
	border-left: 2px solid #eee;
}
ul.admin-vertnav li {
	display: block;
	font-size: 16px;
}
ul.admin-vertnav li a {
	display: block;
	padding: 10px 0;
	color: #333;
	transition: color 0.2s ease-in-out;
}
ul.admin-vertnav li a:hover {
	color: #1141a3;
}


/*============================================================
 Chart - Legend
============================================================*/
/*hides the dashboard for now*/
#dashboard {
	display:none;
}
#dashboard {
	height: 500px;
	width: 960px;
	margin: 0 auto;
	position: relative;
}
.score-legend {
	width: 220px;
	display: inline-block;
	vertical-align: top;
	padding: 90px 0 0 18px;
}
.score-legend li {
	font-size: 21px;
	font-weight: 600;
	text-transform: uppercase;
	margin: 8px 0;
	color: #ccc;
	height: 60px;
	transition: all 0.2s ease-in-out;
}
.score-legend li span {
	font-size: 42px;
	position: relative;
	top: 9px;
	width: 55px;
	display: inline-block;
}
.score-legend li[data-score-legend-composite="off"] span.icon-composite {
	background: url(/ss/images/composite-ccc.svg) 0 0 no-repeat;
	background-size: auto 40px;
	height: 40px;
	top: 12px;
	left: 2px;
}
.score-legend li[data-score-legend-composite="on"] span.icon-composite {
	background: url(/ss/images/composite-color.svg) 0 0 no-repeat;
	background-size: auto 40px;
	height: 40px;
	top: 12px;
	left: 2px;
}
.score-legend li:hover {
	cursor: pointer;
}
.score-legend li[data-score-legend-documents="on"] {
	color: #2d57d6;
}
.score-legend li[data-score-legend-people="on"] {
	color: #f8b065;
}
.score-legend li[data-score-legend-assets="on"] {
	color: #6091b3;
}
.score-legend li[data-score-legend-composite="on"] {
	color: #5bcb87;
}
/*.score-legend li[data-score-legend-documents="on"]:hover {
	color: #663f59;
}
.score-legend li[data-score-legend-people="on"]:hover {
	color: #b55e34;
}
.score-legend li[data-score-legend-assets="on"]:hover {
	color: #507a97;
}
.score-legend li[data-score-legend-composite="on"]:hover {
	color: #2c7752;
}*/
.score-legend li[data-score-legend-documents="off"]:hover,
.score-legend li[data-score-legend-people="off"]:hover,
.score-legend li[data-score-legend-assets="off"]:hover,
.score-legend li[data-score-legend-composite="off"]:hover {
	color: #999;
}

/*============================================================
 Chart - Graphic
============================================================*/

.score-chart {
	position: relative;
	top: 75px;
	width: 320px;
	height: 320px;
	display: inline-block;
	vertical-align: top;
	text-align: center;
}
.score-chart > p {
	font-size: 18px;
	font-weight: 400;
	text-transform: uppercase;
	padding-top: 20px;
}
.score-chart > h2.score-txt {
	position: absolute;
	top: 105px;
	width: 320px;
	font-size: 100px;
}
.score-chart > h2[data-score-txt="documents"] {
	color: #2d57d6;
}
.score-chart > h2[data-score-txt="people"] {
	color: #f8b065;
}
.score-chart > h2[data-score-txt="assets"] {
	color: #6091b3;
}
.score-chart > h2[data-score-txt="composite"] {
	color: #5bcb87;
}

/*============================================================
 Chart - Graphic (from Gib)
*/

.score-chart svg {
	width: 300px;
	height: 300px;
}
.circle-guage-guide {
	fill: none;
	stroke: #eee;
	stroke-width: 3;
	stroke-linecap: round;
}
.circle-guage {
	fill: none;
	stroke-width: 10;
	stroke-linecap: round;
	-webkit-transform: scaleX(-1);
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-ms-transform: scaleX(-1);
	transform: scaleX(-1);
	-webkit-transform-origin: 150px 150px;
	-moz-transform-origin: 150px 150px;
	-o-transform-origin: 150px 150px;
	-ms-transform-origin: 150px 150px;
	transform-origin: 150px 150px;
	-webkit-transition: stroke-dashoffset 2s ease-in-out;
	-moz-transition: stroke-dashoffset 2s ease-in-out;
	-o-transition: stroke-dashoffset 2s ease-in-out;
	-ms-transition: stroke-dashoffset 2s ease-in-out;
	transition: stroke-dashoffset 2s ease-in-out;
}
.guage-assets path {
	stroke: #6091b3;
	stroke-dasharray: 912;
	stroke-dashoffset: 912;
}
.guage-people path {
	stroke: #f8b065;
	stroke-dasharray: 754;
	stroke-dashoffset: 754;
}
.guage-documents path {
	stroke: #2d57d6;
	stroke-dasharray: 597;
	stroke-dashoffset: 597;
}
#output {
	font-family: monospace;
	background-color: #eee;
	margin: 20px;
	padding: 20px;
}
.no-transition {
	-webkit-transition-duration: 0s !important;
	-moz-transition-duration: 0s !important;
	-o-transition-duration: 0s !important;
	-ms-transition-duration: 0s !important;
	transition-duration: 0s !important;
}

/*============================================================
 What's Next
============================================================*/

.whats-next {
	position: absolute;
	top: 20px;
	right: 0;
	width: 320px;
	height: 450px;
	background-color: #fff;
	display: block;
	padding: 60px 0 0 25px;
}
.whats-next::before {
	content: "";
	position: absolute;
	top: 0;
	width: 30px;
	height: 100%;
	background-image: radial-gradient(rgba(150,150,150,0.3), #fff 70%);
	z-index: -1;
	margin-left: -40px;
}
.whats-next > h2 {
	font-size: 21px;
	font-weight: 600;
	text-transform: uppercase;
	color: #5bcb87;
}
.whats-next > h2::before {
	content: "";
	position: relative;
	top: -22px;
	margin-right: 10px;
	background: url(/ss/images/lawyer-icon.png) 0 0 no-repeat;
	background-size: 64px;
	width: 64px;
	height: 64px;
	border-radius: 32px;
	border: 2px solid #ccc;
	display: inline-block;
	vertical-align: top;
}
.whats-next p {
	font-size: 16px;
	line-height: 22px;
}
.whats-next > ul {
	padding: 10px 0 0 0;
}
.whats-next > ul li {
	font-size: 16px;
	border-bottom: 1px solid #ccc;
	transition: all 0.2s ease-in-out;
}
.whats-next > ul li a {
	padding: 10px 0;
	display: block;
}
.whats-next > ul li[data-whats-next="documents"] a {
	color: #2d57d6;
}
.whats-next > ul li[data-whats-next="people"] a {
	color: #f8b065;
}
.whats-next > ul li[data-whats-next="assets"] a {
	color: #6091b3;
}
.whats-next > ul li a::before {
	content: "\f14a";
	font-family: 'icomoon';
	position: relative;
	top: 2px;
	margin-right: 5px;
}
.whats-next > ul li[data-whats-next="documents"]:hover {
	background-color: #2d57d6;
	text-indent: 10px;
}
.whats-next > ul li[data-whats-next="people"]:hover {
	background-color: #f8b065;
	text-indent: 10px;
}
.whats-next > ul li[data-whats-next="assets"]:hover {
	background-color: #6091b3;
	text-indent: 10px;
}
.whats-next > ul li:hover a {
	color: #fff;
}

/*============================================================
 Tiles
============================================================*/
article.documents-tile {
	margin: 0px 20px;
	text-align: center; /* Changed by Jason J 2020-03-11 Added to center the packages on the page for bootstrap responsiveness */
}
.documents-tile > div {
	position: relative;
	display: inline-block;
	vertical-align: top;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 20px;
	padding: 25px 20px 0 20px;
	width: 300px;
	height: 275px;
	border-radius: 4px;
	border: 2px solid #ccc;
	background-color: #fff;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
	text-align: center;
}
.documents-tile > div:nth-of-type(3n) {
	/*margin-right: 0;*/
}
.documents-tile > div:hover {
	border: 2px solid #999;
}
.documents-tile > div .icon-video {
	font-size: 20px;
	position: absolute;
	top: 20px;
	left: 20px;
	color: #999;
}
.documents-tile > div .icon-video:hover {
	color: #7d4f6d;
}
.documents-tile > div::before {
	content: attr(data-price);
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	position: absolute;
	top: 20px;
	right: 20px;
	color: #7d4f6d;
}
/*.documents-tile ol {*/
/*display: table;*/
/*border-collapse: separate;*/
/*border-spacing: 2px;*/
/*width: 100%;*/
/*height: 6px;*/
/*padding-bottom: 25px;*/
/*}*/
/*.documents-tile li {*/
/*display: table-cell;*/
/*height: 6px;*/
/*background-color: #5bcb87;*/
/*font-size: 10px;*/
/*}*/
/*.documents-tile li:first-of-type {*/
/*border-top-left-radius: 3px;*/
/*border-bottom-left-radius: 3px;*/
/*}*/
/*.documents-tile li:last-of-type {*/
/*border-top-right-radius: 3px;*/
/*border-bottom-right-radius: 3px;*/
/*}*/
/*.documents-tile li.marker {*/
/*background-color: #2c7752;*/
/*}*/
/*.documents-tile li.marker ~ li {*/
/*background-color: #ccc;*/
/*}*/

/*============================================================
 Done Tiles
*/

.documents-tile div.tilebtn {
	/*This div is absolutely positioned to hold the tile button just above the bottom edge*/
	position: absolute;
	width: 260px;
	text-align: center;
	/* bottom: 57px; */
	bottom: 15px; /* Change by Jason J 2020-03-11 - adjustment for bootstrap responsiveness */
}
/* Done state */
.documents-tile div.documents-tile-done {
	background-color: #ffffff;
}

/* Ready to Sign state */
.documents-tile div.documents-tile-sig {
	background: #ffffff;
}

.documents-tile-sig div.tilebtn, .documents-tile-done div.tilebtn {
	bottom: 17px;
}


.documents-tile .icon-documents {
	color: #1141a3;
	display: block;
	font-size: 48px;
	padding-bottom: 18px;
}
.documents-tile-done .icon-documents {
	color: #1141a3;
}

.documents-tile-banner-wht {
	width: 296px;
	/*margin: -9px 0 17px -20px;*/
	margin: 0px 0px 0px -20px;
	background-color: #298D10;
	display: block;
	padding: 5px 0;
	position: absolute;
	top: 150px;
	height: 50px;
	text-align: center;
}
.documents-tile-banner-wht p {
	color: #ffffff;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 700;
	margin: 4px;
}


.documents-tile-banner-drk {
	width: 296px;
	margin: 0px 0px 0px -20px;
	background-color: #69ACEF;
	color: #ffffff;
	display: block;
	padding: 5px 0;
	position: absolute;
	top: 150px;
	height: 50px;
	text-align: center;
}
.documents-tile-banner-drk p {
	color: #fff;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 700;
	margin: 4px;
	vertical-align: middle;
}


.documents-tile div.documents-tile-done aside, .documents-tile div.documents-tile-sig aside {
	display: inline-block;
	padding: 6px 0 0 0;
	width: 55px;
    font-size: 22px;
    top: -2px;
}

.documents-tile div.documents-tile-done aside span {
	position: relative;
	top: 19px;
	font-size: 24px;
	transition: all 0.2s ease-in-out;
}
.documents-tile div.documents-tile-sig aside span {
	position: relative;
	top: 19px;
	font-size: 24px;
	color: #1141a3;
	transition: all 0.2s ease-in-out;
}

/* For "personal" tile pencil icons */
.documents-tile div.documents-tile-sig p span {
	color: #ffffff;
	transition: all 0.2s ease-in-out;
}
.documents-tile div.documents-tile-sig p span:hover {
	font-weight: 700;
}

.documents-tile aside span::after {
	content: attr(data-action-item);
	position: relative;
	top: 15px;
	font-size: 12px;
	opacity: 0;
	display: block;
	transition: all 0.2s ease-in-out;
}
.documents-tile div.documents-tile-done aside span::after {
	color: black;
}
.documents-tile div.documents-tile-sig aside span::after {
	color: #633653;
}

.documents-tile div.documents-tile-done aside span:hover {
	color: #2d57d6;
}
.documents-tile div.documents-tile-sig aside span:hover {
	color: #2d57d6;
}

/* for the text that appears when hovering the 'aside' icon. */
.documents-tile div.documents-tile-done aside span:hover::after, .documents-tile div.documents-tile-sig aside span:hover::after {
	opacity: 1;
	top: 6px;
}

article.assets-tile {
	margin: 0px 20px;
}
.assets-tile > div {
	position: relative;
	display: inline-block;
	vertical-align: top;
	margin-left: auto;
	margin-right: auto;
	margin-right: 30px;
	margin-bottom: 30px;
	padding: 25px 20px 0 20px;
	width: 300px;
	height: 275px;
	border-radius: 4px;
	border: 2px solid #ccc;
	background-color: #fff;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
	text-align: center;
}
.assets-tile > div:nth-of-type(3n) {
	margin-right: 0;
}
.assets-tile > div:hover {
	border: 2px solid #999;
}
.assets-tile > div .icon-video {
	font-size: 20px;
	position: absolute;
	top: 20px;
	left: 20px;
	color: #999;
}
.assets-tile > div .icon-video:hover {
	color: #6091b3;
}
.assets-tile > div::before {
	content: attr(data-price);
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	position: absolute;
	top: 20px;
	right: 20px;
	color: #6091b3;
}
/*.assets-tile ol {*/
	/*display: table;*/
	/*border-collapse: separate;*/
	/*border-spacing: 2px;*/
	/*width: 100%;*/
	/*height: 6px;*/
	/*padding-bottom: 25px;*/
/*}*/
/*.assets-tile li {*/
	/*display: table-cell;*/
	/*height: 6px;*/
	/*background-color: #5bcb87;*/
	/*font-size: 10px;*/
/*}*/
/*.assets-tile li:first-of-type {*/
	/*border-top-left-radius: 3px;*/
	/*border-bottom-left-radius: 3px;*/
/*}*/
/*.assets-tile li:last-of-type {*/
	/*border-top-right-radius: 3px;*/
	/*border-bottom-right-radius: 3px;*/
/*}*/
/*.assets-tile li.marker {*/
	/*background-color: #2c7752;*/
/*}*/
/*.assets-tile li.marker ~ li {*/
	/*background-color: #ccc;*/
/*}*/

/*============================================================
 Done Tiles
*/

.assets-tile div.tilebtn {
	/*This div is absolutely positioned to hold the tile button just above the bottom edge*/
	position: absolute;
	width: 260px;
	text-align: center;
	bottom: 57px;
}

.assets-tile div.assets-tile-done {
	background-image: radial-gradient(#7aabcd, #6091b3 70%);
}
.assets-tile div.assets-tile-done h4 {
	color: #fff;
}

.assets-tile div.assets-tile-sig {
	background: rgba(75,79,109,0.2);
	border: 2px solid #6091b3;
}
.assets-tile div.assets-tile-sig:hover {
	border: 2px solid #507a97;
}
.assets-tile div.assets-tile-sig h4 {
	color: #6091b3;
}

.assets-tile-sig div.tilebtn, .assets-tile-done div.tilebtn {
	bottom: 17px;
}


.assets-tile .icon-assets {
	color: #6091b3;
	display: block;
	font-size: 48px;
	padding-bottom: 18px;
}
.assets-tile-done .icon-assets {
	color: rgba(255,255,255,0.5);
}

.assets-tile-banner-wht {
	width: 296px;
	/*margin: -9px 0 17px -20px;*/
	margin: 0px 0px 0px -20px;
	background-color: #fff;
	display: block;
	padding: 5px 0;
	position: absolute;
	top: 150px;
	height: 50px;
	text-align: center;
}
.assets-tile-banner-wht p {
	color: #6091b3;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 700;
	margin: 4px;
}


.assets-tile-banner-drk {
	width: 296px;
	margin: 0px 0px 0px -20px;
	background-color: #6091b3;
	display: block;
	padding: 5px 0;
	position: absolute;
	top: 150px;
	height: 50px;
	text-align: center;
}
.assets-tile-banner-drk p {
	color: #fff;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 700;
	margin: 4px;
	vertical-align: middle;
}


.assets-tile div.assets-tile-done aside {
	display: inline-block;
	padding: 6px 0 0 0;
	width: 55px;
}
.assets-tile div.assets-tile-done aside span {
	position: relative;
	top: 0;
	font-size: 24px;
	color: rgba(255,255,255,0.5);
	transition: all 0.2s ease-in-out;
}
.assets-tile div.assets-tile-done aside span.icon-printer {
	font-size: 22px;
	top: -2px;
}
.assets-tile div.assets-tile-done aside span.icon-download {
	font-size: 26px;
	top: 2px;
}
.assets-tile div.assets-tile-done aside span::after {
	content: attr(data-action-item);
	position: relative;
	top: 15px;
	font-size: 12px;
	color: #fff;
	opacity: 0;
	display: block;
	transition: all 0.2s ease-in-out;
}
.assets-tile div.assets-tile-done aside span:hover {
	color: #fff;
}
.assets-tile div.assets-tile-done aside span:hover::after {
	opacity: 1;
	top: 8px;
}

/*============================================================
 Images
============================================================*/

.cir-64 {
	border-radius: 32px;
	border: 2px solid #ccc;
	width: 64px;
	height: 64px;
}
.cir-222 {
	/*border-radius: 111px;*/
	border: 6px solid #ccc;
	width: 222px;
	height: 222px;
	margin-bottom: 20px;
}
.cir-244 {
	border-radius: 122px;
	border: 6px solid #ccc;
	width: 244px;
	height: 244px;
	margin-bottom: 20px;
}

/*============================================================
 Modals
============================================================*/
/*
.md-modal {
	width: 830px !important;
	height: auto;
	position: relative;
  top: 50%;
  left: 65px;
  width: 50%;
  z-index: 2000;
	#visibility: hidden;
	backface-visibility: hidden;
	transform: translateX(-50%) translateY(-50%);
}
*/

.bootbox-alert .modal-dialog, .bootbox-confirm .modal-dialog{
	width: 400px;
	margin: 30px auto;
}

/* override the bootstrap styles */
.modal-dialog {
	width: 840px;
	margin: 30px auto;
}

.has-success .form-control {
	border-color: #a1aab3;
}

.form-control:focus {
	border-color: #2d57d6;
}

/* Changed by Jason J 2020-03-11 disabled for bootstrap responsiveness */
@media screen and (max-width: 992px) {
	.modal-dialog {
		width: 90%;
		margin: 30px auto;
	}
}
.large-modal {
	width: 950px !important;
}

.md-modal {
	/* width: 830px; */ /* Changed by Jason J 2020-03-11 disabled for bootstrap responsiveness */
	height: auto;
	position: relative;
	/*visibility: hidden;*/
	backface-visibility: hidden;
	/*transform: translateX(-50%) translateY(-50%);*/
}

.md-modal::before {
	content: url(/ss/images/egcombo-color.svg);
	display: block;
	width: 126px;
	position: absolute;
	right: 40px;
	top: 44px;
	opacity: 0;
	transition: opacity 0.3s ease-in-out 0.75s;
}
.md-modal > .btn-close {
	font-size: 24px;
	position: relative;
	top: 40px;
	left: calc(100% - 40px);
	cursor: pointer;
	color: #ccc;
	transition: color 0.2s ease-in-out;
    z-index: 1100;
}
.md-modal > .btn-close:hover {
	color: #333;
}
.md-content {
	background: #fff;
	position: relative;
	border-radius: 8px;
	margin: 0 auto;
	border: 5px solid rgba(0,0,0,0.3);
}
.md-content h3 {
	/* Dialog heading background & border*/
	margin: 0;
	padding: 40px 0 0 40px;
	height: 120px; /* increase height to support wrap of title text on mobile */
	font-size: 30px;
	font-weight: 400;
	background: url(/ss/images/bkd.png);
	border-radius: 8px 8px 0 0;
	border-bottom: 1px solid #ccc; /*#6091b3;*/
}
.md-content > div {
	font-weight: 300;
	font-size: 1.15em;
	padding: 0px 40px;
	/*using a margin at top/bottom assures content of varying top/bottom margins will start/end at the same points since margins overlap*/
	margin: 40px 0px;
}
.md-content > div p {
	margin: 0;
	padding: 5px 0;
	line-height: 23px;
	font-size: 18px;
}
.md-show {
	visibility: visible;
}
.md-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	visibility: hidden;
	top: 0;
	left: 0;
	z-index: 1000;
	opacity: 0;
	background: rgba(0,0,0,0.5);
	transition: all 0.3s;
}
.md-show ~ .md-overlay {
	opacity: 1;
	visibility: visible;
}
.md-show.md-modal::before {
	opacity: 1;
}


/* Effect 13: 3D slit */
.md-effect-13.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-13 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(-3000px) rotateY(90deg);
	-moz-transform: translateZ(-3000px) rotateY(90deg);
	-ms-transform: translateZ(-3000px) rotateY(90deg);
	transform: translateZ(-3000px) rotateY(90deg);
	opacity: 0;
}

.md-show.md-effect-13 .md-content {
	-webkit-animation: slit .7s forwards ease-out;
	-moz-animation: slit .7s forwards ease-out;
	animation: slit .7s forwards ease-out;
}

@-webkit-keyframes slit {
	50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;}
	100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

@-moz-keyframes slit {
	50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;}
	100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

@keyframes slit {
	50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;}
	100% { transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

/*============================================================
 Progress bar
*/
/*Changed By Jason J - decorate the table to look like a progress bar with no dividers and have it fit properly when in mobile mode */
.md-modal > div > ol {
	display: table;
	border-collapse: separate;
	/*border-spacing: 2px;*/
	width: 100%;
	height: 6px;
	padding-bottom: 0;
	margin: -5px 0 0 10px;
	padding-right: 20px;
}

.md-modal > div > ol li {
	display: table-cell;
	height: 6px;
	background-color: #57c421;
	font-size: 10px;
}
.md-modal > div > ol li:first-of-type {
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
.md-modal > div > ol li:last-of-type {
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}
.md-modal > div > ol h4 span {
	color: #7d4f6d;
}
.md-modal > div > ol li.marker {
	background-color: #57c421;
}
.md-modal > div > ol li.marker ~ li {
	background-color: #ccc;
}

/*============================================================
 Forms
============================================================*/

input[type=submit] {
	cursor: pointer;
}

/*select, input:not([type=button]):not([type=checkbox]):not([type=radio]):not([type=submit]) {*/
/*height: 39px;*/
/*/!*margin-bottom: 10px;*!/*/
/*font-size: 18px;*/
/*font-weight: 400;*/
/*border-radius: 4px;*/
/*border: 1px solid #999;*/
/*padding: 0 8px;*/
/*}*/
/*dale's attempt, unfinished*/
.moneyinput input {
    width: 25px;
    margin-left: 15px;
    margin-right: 15px;
}
input + p {
	font-size: 16px;
	font-style: italic;
	font-weight: 400;
	position: relative;
	top: -15px;
	color: #333;
}
input + p.form-question {
	font-size: 16px;
	font-style: italic;
	font-weight: 400;
	position: relative;
	top: -15px;
	color: #333;
	margin-left: 20px;
}
input + p.form-question::before {
	content: "\f059";
	position: absolute;
	left: -20px;
	top: 8px;
	color: #5bcb87;
	font-family: 'icomoon';
	font-style: normal;
}
input + p.form-success {
	font-size: 16px;
	font-style: italic;
	font-weight: 600;
	color: #2c7752;
	position: relative;
	top: -15px;
    padding: 9px 0;
}
input + p.form-error {
	font-size: 16px;
	font-style: italic;
	font-weight: 600;
	position: relative;
	top: -15px;
    padding: 9px 0;
	color: red;
}
input + p.form-helpful-hint {
	font-size: 16px;
	font-style: italic;
	font-weight: 400;
	position: relative;
	top: -15px;
	color: #333;
}

input:not([type=button]):not([type=radio]):not([type=checkbox]):not([type=submit]) {
	/*In other words: text, textarea, file, hidden, image, password, plus all the new html5 types. Seems stupid, but our dialog fields (eg person name form fields) rely on this! */
	width: 100%;
}
input[type='search'] {
	width: auto !important;
}
input:not([type=submit]):not([type=radio]).input-33 {
	width: 33%;
}
select.input-33 {
	width: 33%;
}
input:not([type=submit]):not([type=radio]).input-50 {
	width: 50%;
}
/*select.input-50 {*/
	/*width: 50%;*/
/*}*/
textarea {
	width: 100%;
	margin-bottom: 20px;
	font-size: 18px;
	display: block;
	border-radius: 4px;
	border: 1px solid #999;
	padding: 8px;
}
::-webkit-input-placeholder {
	/*padding-top: 4px;*/
	color: #999;
}
::-moz-placeholder {
	/*padding-top: 4px;*/
	color: #999;
}
:-ms-input-placeholder {
	/*padding-top: 4px;*/
	color: #999;
}
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-year-field {
	color: #999;
	text-transform: uppercase;
}
.endcap-right-gray,
.endcap-right-color {
	width: 100%;
	position: relative;
}
.endcap-right-gray > aside {
	position: absolute;
	right: 0px;
	height: 39px;
	padding: 7px 20px;
	background-color: #dadada;
	border: 1px solid #999;
	border-bottom-right-radius: 4px;
	border-top-right-radius: 4px;
}
.endcap-right-color > aside {
	position: absolute;
	right: 0px;
	height: 44px;
	width: 50px;
	text-align: center;
	background-color: #5bcb87;
	border: 1px solid #999;
	border-bottom-right-radius: 4px;
	border-top-right-radius: 4px;
	transition: background-color 0.2s ease-in-out;
}
.endcap-right-color > aside:hover {
	cursor: pointer;
	background-color: #2c7752;
}

/*dale commented out:
input[type=checkbox] {
    width: inherit !important;
    margin: 0px;
}*/

/*input[type=radio] {*/
    /*width: inherit !important;*/
    /*margin: 2px;*/
/*}*/
/*.endcap-right-color > aside span {*/
	/*position: relative;*/
	/*top: 10px;*/
	/*color: #fff;*/
/*}*/
/*.endcap-right-color > aside span.icon-caret-down {*/
	/*position: relative;*/
	/*top: 13px;*/
	/*color: #fff;*/
/*}*/
/*.endcap-right-color > ol {*/
	/*position: absolute;*/
	/*top: 44px;*/
	/*width: calc(100% - 49px);*/
	/*max-height: 238px;*/
	/*overflow-x: auto;*/
	/*overflow-y: scroll;*/
	/*margin: 0px;*/
	/*padding: 0px;*/
	/*border-radius: 0px 0px 4px 4px;*/
	/*border-bottom-right-radius: 4px;*/
	/*border-bottom-left-radius: 4px;*/
	/*border-left: 1px solid #999;*/
	/*border-right: 1px solid #999;*/
	/*border-bottom: 1px solid #999;*/
/*}*/
/*.endcap-right-color > ol li {*/
	/*display: block;*/
	/*font-size: 16px;*/
	/*font-weight: 400;*/
	/*background-color: #f0f0f0;*/
	/*border-bottom: 1px solid #999;*/
	/*transition: background-color 0.2s ease-in-out;*/
    /*margin: 0 0 0 0;*/
/*}*/
/*.endcap-right-color > ol li:last-of-type {*/
	/*border-bottom: none;*/
/*}*/
/*.endcap-right-color > ol li a {*/
	/*display: block;*/
	/*padding: 11px 10px 9px 10px;*/
	/*color: #333;*/
/*}*/
/*.endcap-right-color > ol li:hover {*/
	/*background-color: #dadada;*/
/*}*/

/*/!* open style for the dropdown *!/*/
/*.endcap-right-color.open > input[type=text] {*/
	/*border-bottom-left-radius: 0px !important;*/
/*}*/
/*
.endcap-right-color > ol {
	position: absolute;
	top: 44px;
	width: calc(100% - 49px);
}
.endcap-right-color > ol li {
	display: block;
	font-size: 16px;
	font-weight: 400;
	background-color: #f0f0f0;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	transition: background-color 0.2s ease-in-out;
}
.endcap-right-color > ol li:last-of-type {
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}
.endcap-right-color > ol li a {
	display: block;
	padding: 10px;
	color: #333;
}
*/
label {
	/*position: relative;*/
	top: 16px;
	/*display: inline-block;*/
	/*vertical-align: top;*/
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 400;
    padding-left: 2px;
    padding-right: 10px;
}
.upload-progress {
	width: 600px;
	display: inline-block;
	height: 20px;
	vertical-align: middle;
	margin-right: 20px;
	border-radius: 5px;
	background-color: #f5f5f5;
}
.upload-progress::before {
	content: "";
	width: 70%;
	height: 20px;
	background-color: #5bcb87;
	display: block;
	border-bottom-left-radius: 5px;
	border-top-left-radius: 5px;
}
/* instead of the upload-progress above (which is hard to manipulate the :before), use the bootstrap styles instead */
.progress {
	width: 100%;
	border-radius: 5px;
	margin-bottom: 20px;
	margin-top: 10px;
}

.progress-bar {
	background-color: #5bcb87;
}

.width-15 { width: 15%; }
.width-20 { width: 20%; }
.width-25 { width: 25%; }
.width-30 { width: 30%; }
.width-33 { width: 33%; }
.width-40 { width: 40%; }
.width-50 { width: 50%; }
.width-60 { width: 60%; }
.width-66 { width: 66%; }
.width-75 { width: 75%; }
.width-90 { width: 90%; }
.width-100{ width:100%; }



.form-stub {
	display:none;
}

/*============================================================
 Itemized List
============================================================*/

.itemized-list {
	padding: 15px 0;
}
.itemized-list > div {
	border-top: 1px solid #ccc;
	height: 40px;
}
.itemized-list > div:hover {
	background-color: #fcfcfc;
}
.itemized-list > div.double-space {
	height: 60px;
}
.itemized-list > div.triple-space {
	height: 80px;
}

.itemized-list > div.double-space p {
	line-height: 20px;
	position: relative;
	top: 3px;
}
.itemized-list > div label {
	line-height: 20px;
	position: relative;
	top: 9px;
	font-style: italic;
}
.itemized-list > div:last-of-type {
	border-bottom: 1px solid #ccc;
}
.itemized-list div > button {
	display: inline-block;
	padding: 7px 12px 6px 12px;
	background-color: #5bcb87;
	border-radius: 4px;
	font-size: 14px;
	color: #fff;
	font-weight: 700;
	border: none;
	text-transform: uppercase;
	text-align: center;
	min-width: 60px;
	margin: 6px 15px 0 0;
	cursor: auto;
	transition: background-color 0.2s ease-in-out;
}
.itemized-list div > p {
	display: inline-block;
	font-size: 16px;
	font-weight: 400;
	line-height: 40px;
	padding: 0;
	margin: 0;
}
.itemized-list div > p.showDocuments {
	display: flex;
	align-items: center;
}
.itemized-list div > input[type=checkbox] {
	margin-right: 20px;
	position: relative;
	top: -1px;
}
.itemized-list div > div {
	width: 50%;
	display: inline-block;
	float: right;
}

.itemized-list div > div.popover-content {
	width: initial;
}

.itemized-list div > a,
.itemized-list div > span {
	width: 40px;
	display: inline-block;
	text-align: center;
	position: relative;
	top: 3px;
	color: #777;
	text-decoration: none;
}
.itemized-list div > a:hover {
	color: #2d57d6;
	transition: color 0.2s ease-in-out;
}

.itemized-list > div .hiddenUntilHovered {
    visibility: visible;
}

.itemized-list > div:hover .hiddenUntilHovered {
    visibility: visible;
}

.singleDownload a {
	height: 40px;
	display: inline-block;
	text-align: center;
	position: relative;
	top: 3px;
	color: #777777;
	text-decoration-line: none;
	text-decoration-style: solid;
}

.singleDownload a:hover {
	color: #5bcb87;
	transition-property: color;
	transition-duration: 0.2s;
	transition-timing-function: ease-in-out;
	transition-delay: 0s;
}

/*============================================================
 DOCUMENT RESPONSE SUMMARY
============================================================*/
.document-response table {
	background: url(/ss/images/bkd.png);
}

.document-response td {
	border-bottom: 1px solid #ccc;
}

.document-response .top-section {
	margin: 0;
	padding: 10px 10px;
	font-size: 22px;
	font-weight: 400;
}
.document-response .section {
	margin: 0;
	padding: 10px 20px;
	font-size: 18px;
	font-weight: 400;
}

.document-response .item {
	margin: 0;
	padding: 5px 30px;
	font-size: 14px;
	font-weight: 400;
	cursor: pointer;
}

.document-response .nocursor {
	cursor: auto;
}

/* For triage, prevent the 'hand' icon on hover for now. */
.document-response .tr_item {
	margin: 0;
	padding: 5px 30px;
	font-size: 14px;
	font-weight: 400;
	cursor: pointer;
}
/*============================================================
 FOOTER
============================================================*/

/*============================================================
 Tables
============================================================*/

.table td {
    margin-bottom: 5px;
	margin-left: 1px;
	margin-right: 1px;
	vertical-align: middle;
    padding: 1px;
}
.table tbody {
    border-top: none;
}
.table strong {
	font-weight: 600;
}
.table span {
	font-weight: 300;
	font-size: 16px;
	display: block;
}
/*.table tr td:last-of-type {*/
	/*padding-left: 20px;*/
/*}*/
.table h4 {
	text-transform: uppercase;
	padding-left: 10px;
}
.table thead {
	background-color: rgba(0,0,0,.04);
	border-bottom: 10px solid transparent;
	border-top: 10px solid transparent;
}


.compactTable td {
	padding-bottom: 6px;
	vertical-align: middle;
}


span.attorneyTrigger,
tr.attorneyTrigger td,
td.attorneyTrigger {
    background-color: #ffff00;
}
table thead tr th {
	font-weight: bold;
}

.formTable td {
	vertical-align: middle;
}

/*============================================================
 Drag-N-Drop ===*/


.questionnaire-addnew {
	padding-top: 5px;
	padding-bottom: 5px;
	position: relative;
}
.questionnaire-addnew a {
	/*display: inline-block;*/
	/*width: 40px;*/
	/*height: 40px;*/
	/*padding: 0;*/
	/*border-radius: 4px;*/
	/*margin-right: 20px;*/
	/*text-align: center;*/
	/*text-decoration: none;*/
	font-family: 'icomoon';
	font-weight: normal;
	font-style: normal;
	font-size: 30px;
	color: #666;
}
.questionnaire-addnew a:hover {
    /*was #9c6*/
    color: #1141A3;
    -webkit-transition-duration: 100ms; /* Safari */
    transition-duration: 100ms;
}
.questionnaire-addnew p {
	display: inline-block;
	vertical-align: top;
	padding-top: 10px;
	font-family: "source-sans-pro",sans-serif;
	font-style: italic;
	font-weight: 400;
	font-size: 15px;
	color: #666;
}
.panel-title {margin: 0px; padding: 0px; font-weight: bold}

iframe {
    margin: 0;
    padding: 0;
    border: 1px grey solid;
}
/*select {*/
    /*height: 39px;*/
    /*/!*margin-bottom: 10px;*!/*/
    /*font-size: 18px;*/
    /*font-weight: 400;*/
    /*border-radius: 4px;*/
    /*border: 1px solid #999;*/
    /*padding: 0 8px;*/
/*}*/
/*Dale*/
.shortname
.longname {
	width: 90px;
}
.len-50 { width: 50px; }
.len-70 { width: 70px; }
.len-90 { width: 90px; }
.len-100 { width:100px; }
.len-110 { width:110px; }
.len-120 { width:120px; }
.len-130 { width: 130px; }
.len-160 { width: 160px; }
.len-200 { width: 200px; }
.len-250 { width: 250px; }
.len-300 { width: 300px; }
.len-400 { width: 400px; }
.len-auto { width: auto; }

.selectperson {
	max-width: 400px;
}

.personTable {
	margin: 0px auto;
	padding: 0px auto;
}


.personChooserStatic, .mainPerson, .entity {
    width: 500px;
	font-weight: bold;
    transition-property: opacity;
	cursor: pointer;
	/*margin-top: 15px;*/
	/*margin-bottom: 5px;*/
}

.percent, .contingentPercent {
	/*width: 100px;*/
	/*margin-top: 15px;*/
	/*margin-bottom: 5px;*/
	/*margin-left: 5px;*/
	/*margin-right: 5px;*/
}
/*.contingentTypeDropdown, .contingentNotApplicable {*/
	/*width: 180px;*/
	/*margin-top: 15px;*/
	/*margin-bottom: 5px;*/
	/*margin-left: 5px;*/
	/*margin-right: 5px;*/
/*}*/
.citychooser {
	width: 205px;
}
.statechooser {
	width: 140px;
}

.box {
    display: inline-block;
}

input.datepicker {
	/*width:180px !important;*/
}
.personChooserDiv {
	display: inline-block;
	margin-left: 15px;
	/*margin-top: 10px;*/
	/*margin-bottom: 6px;*/
}
.beneRow {
	margin-top: 22px;
	margin-bottom: 8px;
}

.margin-bottom-10 {margin-bottom: 10px;}
.margin-bottom-20 {margin-bottom: 20px;}

.editPersonWarning, .possibleDuplicate {
	width: 600px;
}
.bullets {
	list-style-type: disc;
	padding-left: 30px;
	margin: 5px 0px;
 }
.bullets li {
	margin-bottom: 5px;
}
/*This is where Dale started doing it the right way, with minor tweaks to Bootstrap styles:*/
/* separates bene rows (good), but overwrites form-group's 15px bottom margin, crowding Prior Trust fields (bad)*/
/* So I addressed bene spacing w/beneRow margin-bottom */
.form-inline {
	/*margin: 2px 0px;*/
}

.form-group.personChooserContainer {
	/*margin-top: 12px;  commented out to align beneficiary dropdowns with the percent field to their left*/
	/*margin-bottom: 8px;  !* Added to create space between designees in PersonChooserList e.g., Disinherits. *!*/

}

/* form-validation can cause misalignment, so aligning to the top will cause the elements to stay aligned */
.form-group {
	vertical-align: top !important;
}

.manual-error {
	font-size: 80%;
	color: #a94442;
	font-style: italic;
	font-size: 15px;
	line-height: 20px;
	font-weight: 400;
	margin-top: 10px;
}
.div-hide {
	display:none;
}
.hidden {
	visibility: hidden;
}

.center    { text-align: center; }
.bold      { font-weight: bold }
.italic    { font-style: italic; }
.underline { text-decoration: underline; }
.small 	   { font-size: 88%;}
.nowrap    { white-space: nowrap; }
.uppercase { text-transform: uppercase; }

/*Modifications to Bootstrap Styles*/
.container-fluid {
	vertical-align: middle;
}
.input-lg {
	height: 40px;
	padding: 7px 12px;
	font-size: 17px;
	font-weight: 500;
	/*line-height: 1.33333;*/
	border-radius: 5px;
}
select.input-lg {
	height: 40px;
	/*line-height: 46px;*/
}
.input-group-addon {
	padding: 6px 6px;
}
/* Misc dropdowns */
#whiteLabelId, #asAdvisorId, #asAttorneyId, #bulkSource, #bulkDestination, #statusFilter, #uploadStatusFilter {
	width: 400px;
}
/* Acounting dropdowns */
#period, #advisorId, #attorneyId, #alias, #status {
	width: 250px;
}

/* hide the HTML5 number input's spin box */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	/* display: none; <- Crashes Chrome on hover */
	-webkit-appearance: none;
	margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
.radio-outdent {
	text-indent: -22px;
	padding-left: 22px ;
}
.radio-sub-indent {
	padding: 5px 20px ;
}

.detailText {
	font-size: 10px;
	font-style: italic;
}

/* format a <div> to space blocks like a <p>. */
.para {
	margin: 16px 0px;
}

/* stop Webkit spinners in number fields: */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
/* For Firefox */
input[type=number] {
	-moz-appearance: textfield;
}

/*Login Page*/

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);
.loginContainer {
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	height: 70vh;
	width: 510px;
}
.loginHeader {
	width: 500px;
	color: #ffffff;
	height: 140px;
	background-color: #ffffff;
	background-image: url("/ss/images/script-logo.svg");
	background-size: 140px;
	background-position: center;
	background-repeat: no-repeat;
	/*padding: 20px;*/
	/*margin-left: 40px;*/
}
.loginPointer {
	width: 500px;
	height: 40px;
	color: #26bf63; /* logo green */
	color: #202020;
	background-color: #ffffff;
}
.loginBody {
	width: 500px;
	height: 348px;
	height: auto;
	color: #26bf63; /* logo green */
	color: #202020;
	background-color: #ffffff;
}
.loginButton {
	width:100%;
	height:62px;
	font-family: 'Open Sans', sans-serif;
	font-size:16px;
	text-shadow: rgba(0, 0, 0, 0.74902) 0px 1px 2px;
	margin-top: 10px;
	margin-bottom: 10px;
}
.loginSubtitle {
	font-family: 'Poppins';
	font-size: 27px;
	font-weight: 700;
	margin-bottom: 15px;
	letter-spacing: -1px;
	color: #45494D;
}
.loginSmall {
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	margin-top: 15px;
	margin-bottom: 15px;
	letter-spacing: -1px;
}
.centerContainer {
	margin: 0 auto;
}
.centeredDiv {
	/* this will center any text and blocks with 'display: inline-block;' , and should center included divs. */
	margin: auto;
	width: auto;
	text-align: center;
}
.errorColor {
	color: #ee393d;
}

/* Useful for Embedded WLs: */
#horNavRegion, #footer-region {
	/*display: none;*/
}
header {
	/*display: none;*/
}
#admin-region {
	/*display: none;*/
}

.btn-upgrade {
    display: inline-block;
    font-size: 15px;
    color: #fff;
    font-weight: 600;
    border: none;
    line-height: 18px;
	background-color: transparent;
	font-style: italic;
	position:absolute;
	top:8px;
	right:8px;
}

/*
.header-position-fixed {
	position: fixed;
	background-color: white;
	border-bottom: 1px solid #CCCCCC;
	border-top: 10px solid #5BCB87;
	z-index: 999;
	height: 80px;
	margin-top: -10px;
}
*/

.header-class {
	position: absolute;
	top: 0px;
	height: 80px;
	border-bottom: 1px solid #CCCCCC;
}

.scroll-body {
	position: absolute;
	top: 80px;
	left: 0px;
	bottom: 50px;
	overflow-y: auto;
	margin: auto;
	width: 100%;
}

.footer-class {
	position: absolute;
	bottom: 0px;
	left: 0px;
	height: 50px;
	overflow: hidden;
	width: 100%;
}

.grecaptcha-badge{
	z-index: 999;
}

.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
	background-color: #2d57d6;
	border-color: #2d57d6;
}

.mr-25 {
	margin-right: 25px;
}

.custom-table-label-left {
	font-size: medium;
}
.custom-table-label-right {
	padding-left: 100px !important;
	font-size: medium;
}

.loading-spinner {
  border: 8px solid #f3f3f3;
  border-top: 8px solid #2d57d6;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 2s linear infinite;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Google recaptcha location */
.grecaptcha-badge {
	width: 70px !important;
	overflow: hidden !important;
	transition: all 0.3s ease !important;
	left: 4px !important;
}
.grecaptcha-badge:hover {
	width: 256px !important;
}

.disabled {
	opacity: 0.5;
	pointer-events: none;
}