    /*-- Main Styles --*/
body {
    padding:0;
    margin:0;
    font-family:"freight-sans-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    color:var(--onyx-70);
    background: var(--white-00);
    line-height: 22px;
}

/* Replicated here for login page */
.clearfix {
  *zoom: 1;
  clear: both;
}

.clearfix:before,
.clearfix:after {
  display: table;
  line-height: 0;
  content: "";
  clear: both;
}

.clearfix:after {
  clear: both;
}
/* allows parent element to calculate height of floated children and enclose */
.clearfloat {
    height: auto;
    overflow: hidden;
}
.no-select, .content-tab {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/*use basic font for tables */
table, tr, th, td, td li, td div, td p {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
    line-height: 15px;
}

/*Language-specific*/
:lang(bg) {quotes:'\201E' '\201C' '\201A' '\2018';}
:lang(cs) {quotes:'\201E' '\201C' '\201A' '\2018';}
:lang(da) {quotes:'\00BB' '\00AB' '\203A' '\2039';}
:lang(de) {quotes:'\201E' '\201C' '\201A' '\2018';}
:lang(el), :lang(el-GR) {quotes:'\00AB' '\00BB' '\2039' '\203A';}
:lang(en-GB) {quotes:'\2018' '\2019' '\201C' '\201D';}
:lang(es) {quotes:'\00AB' '\00BB' '\2039' '\203A';}
:lang(fi) {quotes:'\201D' '\201D' '\2019' '\2019';}
:lang(fr) {quotes:'\ab\2005' '\2005\bb' '\2039\2005' '\2005\203a';}
:lang(hu) {quotes:'\201E' '\201D' '\201A' '\2019';}
:lang(lt) {quotes:'\201E' '\201C' '\201A' '\2018';}
:lang(nl) {quotes:'\201E' '\201D' '\201A' '\2019';}
:lang(pl) {quotes:'\201E' '\201D' '\201A' '\2019';}
:lang(ro) {quotes:'\201E' '\201C' '\201A' '\2018';}
:lang(sk) {quotes:'\201E' '\201C' '\201A' '\2018';}
:lang(sv) {quotes:'\201D' '\201D' '\2019' '\2019';}

/* force inheritance for input items */
input, select, textarea, button {font-family:inherit;}

img {
    border:none;
}

a, .fake-link {
    color:var(--agate-70);
    text-decoration:none;
    cursor: pointer;
}

a:hover, .fake-link:hover {
    color:var(--agate-60);
}

.fake-link {
    cursor: pointer;
}

.loading {
    cursor: wait !important;
}

p, label, input, ul, select, option {
	font-size: 14px;
	font-weight: 400;
	color:var(--onyx-70);
}
p, ul {
    line-height: 15px;
}
label, input {
	margin:0;
	padding:0;
}

h1, h2, h3, h4, legend {
    padding:0;
    margin:0;
}

h1, #h1_study_dropdown.study-dropdown {
    padding:7px 0 0 0;
    font-weight: bold;
    font-size: 26px;
    color:var(--agate-70);
    text-transform: uppercase;
    float: none;
}

h2 {
    color:var(--agate-70);
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
    clear: both;
    padding: 10px 0 5px;
}
h2 a {
	color:var(--agate-70);
}

h2.break {
    border-top: solid 2px var(--agate-60);
    margin-top: 20px;
}

h3, legend, .inline-fields label, a.h3-icon span {
    color:var(--onyx-70);
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
}

legend, .inline-fields label, a.h3-icon span {
    margin-top: 10px;
}

h3 {
    margin-top: 30px;
}

a.h3-icon span {
    color: var(--agate-70) !important;
}
h3+p {
    margin-top: 0;
    padding-top: 0;
}
h4 {
    color: var(--agate-70);
    font-size: 14px;
    font-weight: 400;
}
.table .label {
    font-size: 12px;
}
.floatrt {
    float:right !important;
}
.floatlf {
    float:left;
}
.float-none {
    float: none !important;
}
.no-margin-collapse {
    clear: both;
    overflow: auto;
}
.clearrt {
    clear: right;
}
.clearlf {
    clear: left;
}
.clearnone {
    clear: none;
}
.column {
    display: block;
    float:left;
    margin: 1% 1% 0 0;
}
.column > .column {
    margin-top: 0;
}
.half {
    width: 48%;
}
.third {
    width: 32%;
}
.two-thirds {
    width: 65%;
}
.quarter {
    width: 23.75%;
}
.three-quarters {
    width: 73.5%
}
/* need to accomodate for the extra column padding */
.full-width.column {
    width: 98.5%;
}
.full-width {
    width: 100%;
}
.errorlist h1, .errorlist h2, .errorlist h3, .errorlist h4 {
    color: #3f0000;
}
.errorlist {
    display: block;
    background: var(--ruby-10);
    border: 1px solid var(--ruby-ui-50);
    margin: 10px 0 0;
    padding: 10px;
    list-style: none;
    max-width: 490px;
}
.errorlist.dummy {
    background: none;
    border: none;
}
.errorlist.inline {
    clear: both;
    width: 490px;
    margin: 5px 0 !important;
    padding: 10px !important;
}
.list-style-none {
    list-style: none;
}
.indent {
    margin-left: 10px;
}
.centeralign {
    text-align: center;
}
.preserve-whitespace, .ss-form.preserve-whitespace input {
    white-space: pre;
}
.ss-form.preserve-whitespace {
    white-space: normal;
}
.break-spaces {
    white-space: break-spaces;
}
.no-wrap {
    white-space: nowrap;
}

.uppercase {
    text-transform: uppercase;
}

.bold {
    font-weight: 700;
}

.more-indicator {
    background: var(--white-00);
    background: linear-gradient(to right, transparent, var(--white-00), var(--white-00), var(--white-00));
    cursor: pointer;
    float: right;
    padding-left: 30px;
    position: relative;
    top: -18px;
    color: var(--agate-70);
}

.more-indicator:hover {
    color: var(--agate-ui-50);
}

.more-indicator:lang(en)::before {
    /*\00a0 forces a space character, wich would normally be stripped in "content"*/
    content: "...\00a0";
    color:var(--onyx-90);
}

.more-indicator:lang(en)::after {
    /*\00a0 forces a space character, which would normally be stripped in "content"*/
    /*\00a0 forces a right caret*/
    content: "\00a0\003e";
    color:var(--onyx-90);
}

.padding-left-1 {
    padding-left: 5px;
}

.margin-left-1 {
    margin-left: 5px;
}

.margin-bottom-1 {
    margin-bottom: 5px;
}

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

dl .fake-link, dl a, p .fake-link {
    text-decoration: underline;
}

dt {
    float: left;
    font-weight: bold;
    width: 45%;
    margin-right: 5%;
}

.panel-body dd div {
    padding: 0;
}
.panel-body .inline-editing dd {
    width: 68%;
}
.panel-body .inline-editing dt {
    width: 25%;
}

.panel-body dt {
    clear: both;
    font-weight: 700;
}

.panel-body dt, .panel-body dd {
    margin-bottom: 4px;
    line-height: 26px;
    float: left;
    word-break: normal;
    width: 45%;
    overflow: hidden;
    word-wrap: break-word;
}
.panel-body dt.heading {
    font-weight: bold;
    text-transform: uppercase;
}

.panel-body .profile dd {
    width: 50%;
}

.panel-body .profile {
    margin-bottom: 0;
}

.panel .panel-inset label,
.panel-body .panel-inset div {
    /*.panel-body .panel-inset div specificity to override .panel-body settings */
    padding-left: 0;
}

.panel .panel-inset label,
.panel-inset textarea,
.panel-body .panel-inset div {
    /*.panel-body .panel-inset div specificity to override .panel-body settings */
    float: none;
    display: block;
}

.panel-body a,
.panel-body .fake-link {
    text-decoration:none;
}

.panel-inset .button {
    margin-top: 10px;
}

.panel-inset .errorlist {
    margin-right: 4%;
}

.totals-box, .panel-body .totals-box, .panel-inset {
    background-color: var(--onyx-10);
    font-size: 16px;
    padding: 15px;
}

.panel-body .totals-box {
    width: 300px;
    float: right;
}

.half-panel .totals-box {
    width: 85%;
    margin-bottom: 15px;
    max-width: 300px;
}

.totals-box dt,
.totals-box dd {
    margin: 5px 0;
    width: auto;
}

.totals-box dd {
    text-align: right;
    float: right
}

/* creates bg for approver's emphasis */
.profile-summary-highlight {
    background-color: var(--onyx-30);
}
/* sets padding and offsets margin(s) */
dt.profile-summary-highlight {
    margin-left: -5px;
    padding-left: 5px;
    padding-right: 70px;
}
dd.profile-summary-highlight {
    margin-right: -5px;
    padding-right: 5px;
    margin-left: -5px;
    width: 75px;/* we set the width here because we can predict the amounts in this field */
}

.default-display {
    font-style: italic;
    color: var(--onyx-ui-50);
}

/* --------top nav---------- */
#top-nav, #top-nav-plain {
	background:url('../images/top-nav_bg.gif') repeat-x var(--white-00);
	width:100%;
	height:61px;
	padding-left:15px;
}
#top-nav {
    display: flex;
    gap: 45px;
	padding-left: 235px;
	*padding-left: 55px;
	z-index: 1000;
	position: fixed;
}
#top-nav.min {
    margin-left:49px;
    padding-left:30px;
}
#logo-nav {
    display: block;
    overflow: hidden;
    *position: relative;
    *float: left;
    *margin-left: 190px;
    padding-top: 10px;
    }
#logo-nav img {
    height: 30px;
    padding-left:6px;
}
#top-nav-inner {
    width:auto;
    display:inline-block;
    position:fixed;
    *position:relative;
    right:5px;
    *right:50px;
    *float:right;
}
#home-nav {
    background:url('../images/top-nav_bg.gif') repeat-x var(--white-00);
    height:61px;
    /* for scroll */
    position: fixed;
    z-index: 15000;
}
#home-nav a {
    width:216px;
    padding:20px 10px;
    height:21px;
    text-transform: uppercase;
    font-weight:bold;
    font-size:14px;
    display: block;
    margin-left:5px;
    color: var(--agate-60);
    /* for scroll */
    background:url('../images/top-nav_bg.gif') repeat-x var(--white-00);
    position: fixed;
    z-index: 16000;
    }

#home-nav a:hover, #home-nav a.selected {
    color: var(--agate-70);
    }

#home-nav img {
    float:right;
    margin-right:8px;
}
#support {
    padding: 19px;
    height: 17px;
    display:block;
}
.grey-box {
    float:right;
}
.grey-box, .study-dropdown {
    font-size:12px;
    margin: 0 3px;
    color: var(--lazuli-80);
    font-weight: normal;
    text-transform: uppercase;
    text-align: center;
}
.grey-box span, .study-dropdown li *, .user-dropdown li *  {
    color: var(--lazuli-80);
}
.grey-box span:hover, .study-dropdown li *:hover,
.user-dropdown li *:hover, #support:hover, div.study-dropdown.plus > span:hover {
	color: var(--agate-70);
}
div.grey-box span img, .welcome-area img {
    padding-left:10px;
    padding-bottom: 1px;
}
#h1_study_dropdown.study-dropdown {
    padding-right: 25px;
    cursor: pointer;
}

#h1_studies_dropdown_container {
    margin-top: 10px;
}
.study-dropdown {
    font-size: 1rem;
}

.product-launchpad {
    display: flex;
    gap: 8px;
    align-items: center;
    height: fit-content;
    margin: 14px 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.product-launchpad-link {
    display: flex;
    height: fit-content;
}

.product-launchpad-text {
    font-weight: 500;
    font-size: 14px;
    color: #00bce7;
    margin: 0;
}

.product-launchpad-icon {
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.sub_menu li input {
    border: none;
    height:25px;
    margin:5px;
    text-align:center;
    width:138px;
    padding: 0;
    display: inline-block;
}
.sub_menu li b {
    background: url("../images/select2.png") repeat scroll 18px 15px;
    display: inline-block;
    height: 15px;
    width: 20px;
    padding: 0;
}
li.default {
    font-weight:bold;
}
input.hint, textarea.hint, .empty-field, .ss-form .hint {
	color:var(--onyx-60);
	font-style: italic;
}
/* LEVEL ONE */
.plus, ul.plus {
	background-image: url(../images/pagination/drop-down.gif);
	background-position: 100% 50%;
	background-repeat: no-repeat;
}
div.study-dropdown, ul.user-dropdown {
	position: relative;
	margin:0 3px;
	padding:0;
	display:block;
	min-width: 169px;
}
div.study-dropdown {
	padding-right: 15px;
}
div.study-dropdown > span {
	padding: 15px 0px;
	min-width: 188px;
	display:block;
}
#studies_dropdown_container, #h1_studies_dropdown_container {
	position: absolute;
	z-index: 199;
	min-width: 234px;
	*width: 175px;
    display: none;
    text-align: center;
}
/* Style the study dropdown container inside the header */
#studies_dropdown_container li,
#studies_dropdown_container input,
#h1_studies_dropdown_container li,
#h1_studies_dropdown_container input {
    font-size: 1rem;
}
#studies_dropdown_container input,
#h1_studies_dropdown_container input {
    min-width: 184px;
    width: calc(100% - 45px);
}

ul.sub_menu {
	margin:0;
	padding:0;
}
.sub_menu li * {
	display: block;
}
.sub_menu .selected {
	background-image: url(../images/25x25-approve.png);
	background-repeat: no-repeat;
	background-position: 3px 50%;
}
ul.user-dropdown li, .sub_menu li {
	list-style: none;
	zoom: 1;
	font-size:12px;
	}
ul.user-dropdown li a, ul.user-dropdown li span {
	min-width: 141px;
	padding: 19px 19px 12px;
	display: block;
}
ul.user-dropdown li:last-child a {
	border-right: none;
} /* Doesn't work in IE */
.sub_menu li:hover,
ul.user-dropdown li.hover,
ul.user-dropdown li:hover,
ul.user-dropdown li a.hover,
ul.user-dropdown li span.hover {
	position: relative;
	color:var(--agate-60);
}
.sub_menu li:hover {
	background-color: var(--onyx-10);
}


/* LEVEL TWO */
ul.user-dropdown ul {
	visibility: hidden;
	position: absolute;
	top: 100%;
	right: 0;
	padding:0;
}
.sub_menu li *, ul.user-dropdown ul li a, ul.user-dropdown ul li span {
	padding: 10px 19px;
}
ul.user-dropdown ul li, .sub_menu li {
	background: var(--white-00);
	border-bottom: 1px solid var(--onyx-ui-50);
	padding:0;
	margin:0;
	float: none;
}
	/* IE 6 & 7 Needs Inline Block */
ul.user-dropdown ul li a {
	display: inline-block;
}

/* LEVEL THREE */
ul.dropdown ul ul {
    left: 100%; top: 0;
}
ul.dropdown li:hover > ul {
    visibility: visible;
}

/* --------left nav--------- */
#sidebar ul#leftnav {
    /*for no scroll*/
    padding-top:61px;
}
#sidebar {
    width: 228px;
    background-color: var(--white-00);
    padding-right: 5px;
    position:fixed;
    height:100%;
    z-index: 1200;
    margin-left:-5px;
}
#sidebar .b3-dropdown-menu {
    *float:none;
}
#sidebar.min {
    margin-left: -5px;
    width: 59px;
}
#min-left-nav {
    height:26px;
    padding:3px;
    width:100%;
}
#min-left-nav img {
    float:right;
    margin-left:4px;
}
#min-left-nav span {
    float:right;
    position:relative;
    top:4px;
    cursor:pointer;
    text-align:right;
}
#min-left-nav span:hover {
    text-decoration:underline;
}
#sidebar ul {
    margin:0;
    padding:0;
    list-style:none;
}
#sidebar ul li, #sidebar ul li a {
    color:var(--agate-60);
    cursor: pointer;
    margin-bottom:0;
    white-space: normal;
}

#sidebar>ul>li:hover>div, #sidebar>ul>li:hover>a,
#sidebar>ul>li>a.fake-selected,#sidebar>ul>li>div.fake-selected,
#sidebar>ul>li>a.selected {
    color: var(--white-00);
    background:var(--agate-60);

    > span  {
        filter: brightness(0) invert(1);
    }
}
#sidebar>ul>li>a.fake-selected,#sidebar>ul>li>div.fake-selected,
#sidebar>ul>li>a.selected {
    margin-bottom:0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
    -khtml-border-radius: 5px 5px 0 0;
}
#sidebar.min>ul>li:hover>div, #sidebar.min>ul>li:hover>a,
#sidebar.min>ul>li>div.fake-selected,#sidebar.min>ul>li>a.fake-selected,
#sidebar.min>ul>li>a.selected {
    width:31px;
    overflow: hidden;
}
#sidebar.min #home-nav a {
    width:43px;
    overflow: hidden;
}
#sidebar>ul>li>a, #sidebar>ul>li>div {
    width:206px;
    padding:20px 9px;
    height:15px;
    background-color:var(--white-00);
    text-transform: uppercase;
    font-weight:bold;
    font-size:14px;
    display: block;
    border:1px solid var(--agate-60);
    margin:3px 0 3px 10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -khtml-border-radius: 5px;
}
#sidebar.min>ul>li>a, #sidebar.min>ul>li>div {
    width:31px;
    overflow: hidden;
}
#sidebar ul li {
    margin:0;
    line-height:15px;
}
#sidebar ul li.break {
    padding:0;
    height:20px;
    background: none;
    border: none;
}

#sidebar ul li ul.left-inline  {
    display:block;
    *display:inline;
    z-index:3000;
}
#sidebar.min .dropdown-submenu {
    *width:50px;
}
#sidebar.min .leftwrap {
    /*added for ie7*/
    width:4px;
}
#sidebar ul li ul li a, #sidebar ul li ul li>span {
    width:196px;
    padding:14px 18px 14px 10px;
    margin:-3px 0 0 10px;
    min-height:15px;
    background:var(--white-00);
    text-transform: uppercase;
    font-weight:normal;
    font-size:12px;
    display: block;
    border:1px solid var(--agate-70);
    border-collapse: collapse;
    color:var(--onyx-80);
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    -khtml-border-radius: 0;
}
#sidebar ul li ul.b3-dropdown-menu li a, #sidebar ul li ul.b3-dropdown-menu li>span,
#sidebar ul li ul li ul.b3-dropdown-menu li a {
	margin:-3px 0 0 0;
}
#sidebar ul li ul li ul li a, #sidebar ul li ul li ul li a.selected, #sidebar ul li ul li ul li a:hover {
	padding-left:25px;
	width:181px;
}
#sidebar ul li ul li a:hover, #sidebar ul li ul li a.selected,
#sidebar ul li ul li>span:hover, #sidebar ul li ul li span.fake-selected {
    font-weight: bold;
	color: var(--agate-70);
	-moz-box-shadow:    0 0 0 0;
	-webkit-box-shadow: 0 0 0 0;
	box-shadow:         0 0 0 0;
	width: 196px;
	padding-right: 18px;
}
#sidebar>ul>li>ul.b3-dropdown-menu>li:first-of-type>a,
#sidebar ul li ul.b3-dropdown-menu li:first-of-type>span {
	border-left: 3px solid var(--agate-60);
	margin-left: -2px;
	margin-top: 12px;
}
#sidebar ul>li>ul.b3-dropdown-menu>li:first-of-type>a {
	margin-top: 12px;
}
#sidebar ul li ul li a:hover, #sidebar ul li ul li a.selected,
#sidebar ul li ul li>span:hover, #sidebar ul li ul li>span.selected {
    color:var(--agate-70);
}
#sidebar span.second-level span {
	border-top: 8px solid transparent;
	border-left: 8px solid var(--agate-70);
	border-bottom: 8px solid transparent;
	float:right;
    margin-right: -5px;
    margin-top: -5px;
}
#sidebar span.second-level.down span {
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid var(--agate-70);
    margin-top: 3px;
}
.leftwrap {
    left: 56px;
    top: 3px;
}
.lefttext {
    display: table-cell;
    *display:block;
    vertical-align: middle;
    height: 42px;
    padding-left:6px;
}
.min .lefttext {
    /*added for ie7*/
    display:none;
}

/* ------------Secondary navigation---------*/
.secondary-navigation a {
    border: 1px solid var(--onyx-30);
    border-bottom: none;
    float: left;
    padding: 10px;
    height: 38px;
    width: 170px;
    font-size: 16px;
    font-weight: bold;
    color: var(--agate-60);
    text-transform: uppercase;
    text-align: right;
}
.secondary-navigation a + a {
    border-left: none;
}
.secondary-navigation .selected {
    background-color: var(--agate-60);
    color: var(--white-00);
}
/* ------------Icons-------------*/

.b3-dropdown-menu .leftwrap, .b3-dropdown-menu .home {
    margin-left: -60px;
    margin-top: -15px;
    padding-left: 38px;
    position: relative;
    width: 170px;
}
.leftwrap, .h1-icon {
    width:38px;
    height:38px;
    display: inline-block;
    float:left;
    *float:none;
    margin-top:-10px;
    margin-right:10px;
    margin-bottom:10px;
}
.home {
    width:38px;
    height:38px;
    display: inline-block;
    *display: block;
    float:left;
    margin-top:-10px;
    margin-right:10px;
    margin-bottom:10px;
}
.home {
    background:url(../images/svg/home_p1.svg) no-repeat 8px center;
}
.portfolio-dashboard {
    background:url(../images/svg/dashboard_p1.svg) no-repeat 6px center;
}
.research-sites, .site {
    background:url(../images/svg/site_p1.svg) no-repeat 4px 6px;
    background-size: 30px 30px;
}
.reports {
    background:url(../images/svg/reports_p1.svg) no-repeat 6px center;
}
.credits {
    background:url(../images/svg/credits_p1.svg) no-repeat 6px center;
}
.invoices {
    background:url(../images/svg/invoices_p1.svg) no-repeat 6px center;
}
.payments {
    background:url(../images/svg/payments_p1.svg) no-repeat 6px center;
}
.management {
    background:url(../images/svg/serve_p1.svg) no-repeat 6px center;
}
.lock {
    background:url(../images/svg/lock_p1.svg) no-repeat 6px center;
}
.user {
    background:url(../images/svg/user_p1.svg) no-repeat 6px center;
}
.study {
    background:url(../images/svg/study_p1.svg) no-repeat 6px center;
}
.funding {
	background:url(../images/svg/finance_p1.svg) no-repeat 6px center;
}
.transfers {
    background:url(../images/svg/transfers_p1.svg) no-repeat 4px center;
}
.fake-selected .research-sites, .selected .research-sites, #sidebar ul li:hover .research-sites,
.fake-selected .site, .selected .site, #sidebar ul li:hover .site {
    background:url(../images/svg/site_p1.svg) no-repeat 4px center;
}
.fake-selected *, .selected *, #sidebar ul li:hover *  {
    background-repeat: no-repeat;
    /* background-position: 0 0; */
}
#sidebar div:hover .home, a:hover .home, a.selected .home  {
    background:url(../images/svg/home_p1.svg) no-repeat 6px center;
}
.min .min .fake-selected .leftwrap,
#sidebar.min ul li:hover .leftwrap {
    margin-right:15px;
    /*added for ie7*/
    width:4px;
}
.payment-attachment .fa-times {
    color: var(--agate-70);
    padding-left: 10px;
}

/* ---------------- PANELS & DASHBOARD ELEMENTS ------------------- */
.panel {
    border:1px solid var(--onyx-30);
    padding: 0 !important;
    float:left;
}
.panel-body div {
    padding: 5px 5px 5px 0;
}
.refresh {
    margin-top: -4px;
    float:right;
    height: 29px;
    width: 29px;
    background: url('../images/refresh-sprite.png') 0 0 repeat-x;
}
.panel h2 {
    font-size: 16px;
    color: var(--onyx-70);
}
.panel h3 {
    font-weight:bold;
    font-size:14px;
    color: var(--onyx-70);
    text-transform: uppercase;
    padding-top:3px;
    margin-top:0;
    margin-bottom: 0;
}
.panel h3 a, .panel h3 .fake-link {
    color:var(--agate-60);
}
.panel h3 .count {
    display: block;
    float: left;
    font-size: 16px;
    padding-right: 8px;
    width: 30px;
    height: 25px;
    text-align: right;
}
.panel h4 {
    font-weight:bold;
    color:var(--onyx-60);
    padding-left:5px;
}
.panel p {
    padding: 5px;
}
.panel p, .panel ul {
    line-height: 17px;
    margin: 0;
    padding-top: 5px;
    padding-bottom: 1px;
}
.panel.dash .panel-body div {
    padding-left: 40px;
    padding-top: 5px;
    background-position: 4px 7px;
    background-repeat: no-repeat;
}
.panel.dash .panel-body.iconless div {
    /* Overrides padding for icons in panels */
    padding-left: 0;
}
.panel.dash .panel-body div .amount{
    padding-left: 40px;
}
#funding-outlook .panel-body div {
    padding-left: 0;
}
.half-panel {
    width: 48%;
    display: inline-block;
    padding: 1% 4% 1% 0;
    vertical-align: top;
}
.half-panel div, .half-panel p {
    padding: 0 0 0 25px;
}
.half-panel-left {
    margin-left: -25px;
}

.panel label {
    display: inline;
    padding-left: 5px;
    padding-right: 15px;
    font-size: 16px;
    position: relative;
    top: 2px;
}
.panel-title {
    font-size: 16px;
}
.panel-title a {
    margin-left: 35px;
}
.panel-title a, .panel-title .fake-link, .inline-editing-tools .fake-link {
    font-size: 14px;
}
.panel-title .action,
.inline-editing-tools .action {
    padding-left: 22px;
    padding-right: 5px;
}
.panel .invoice_dash {
    background-image:url('../images/25x25-invoice.gif');
}
.panel .site-invoice {
    background-image:url('../images/25x25-site-invoice.gif');
}
.panel .pending-invoice-upload {
    background-image:url('../images/25x25-pending-site-upload.gif');
}
.panel .maintenance, .maintenance {
    background-image:url('../images/25x25-maintenance.gif');
}
.panel .features {
    background-image:url('../images/25x25-features.gif');
}
.panel .pending {
    background-image:url('../images/25x25-pending.gif');
}
.panel .approve, .icon.accept {
    background-image:url('../images/25x25-approve.png');
}
.panel .decline, .information {
    background-image:url('../images/25x25-decline.gif');
}
.panel .release, .transfer {
    background-image:url('../images/25x25-release.gif');
}
.transfer.disabled {
    background-image:url('../images/25x25-release-disabled.png');
}
.panel .requested {
    background-image:url('../images/25x25-requested.gif');
}
.panel .money-moved, .panel .claim {
    background-image:url('../images/25x25-money-moved.gif');
}
.panel .note-added {
    background-image:url('../images/25x25-note-added.gif');
}

.details-sheet-panel {
    margin-bottom: 27px;
    min-height: 320px;
}

.details-sheet-panel.recent-activity .panel-body {
    overflow-y: auto;
    margin-top: 15px;
    margin-right: 15px;
    padding-top: 0;
    max-height: calc(100% - 90px);
}

.panel-section .panel-description {
    margin-right: 5px;
    margin-left: 5px;
    display: inline-block;
}

.panel-section p {
    max-height: 3.20rem;
    padding-top: 0;
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

.panel-section p.recent-activity-text {
    white-space: normal;
    overflow: auto;
}

.panel-action-by, .panel-action-date {
    display: inline-block;
    margin-right: 6px;
}
.panel-action-note {
    display: block;
}
.schedule {
    background-image:url('../images/25x25-schedule.png');
}
.view {
	background-image:url('../images/25x25-view.png');
}
.download {
	background-image:url('../images/25x25-download.png');
}
.email {
	background: url('../images/25x25-email.png') no-repeat;
}
.trash {
    background-image:url('../images/25x25-trash.png');
}
#breadcrumbs .study {
    background-image:url('../images/25x25-study.png');
}
#breadcrumbs .site {
    background-image:url('../images/25x25-site.png');
}
#breadcrumbs .icon {
    background-position: 0 0;
    padding-right: 5px;
}

#breadcrumbs a,
.breadcrumbs a {
    line-height: 27px;
    padding-right: 10px;
}
.dash .panel-heading {
    color: var(--white-00);
    font-weight: bold;
    text-transform: uppercase;
}
.color-announcements.panel .panel-heading {
    background-color:var(--lazuli-ui-50);
}
.color-tasks.panel .panel-heading {
    background-color:var(--topaz-ui-50);
}
.color-activity.panel .panel-heading {
    background-color:var(--tanzanite-60);
}
.color-data.panel .panel-heading {
    background-color:var(--agate-60);
}
.panel .key {
    width:15px;
    height: 15px;
    display: block;
    float: left;
    border-style: solid;
    border-width: 3px;
    margin-right:4px;
}
.footnote {
    font-style: italic;
    font-size: 12px;
}
.panel .panel-body div.study-name {
    font-weight: bold;
    padding-left: 5px;
}
/* ---------------- GRID TABLE STYLES ------------------- */

/*-- details bar, error messaging --*/
.summary-box {
    background: var(--onyx-30);
    border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0;
    -khtml-border-radius: 10px 10px 0 0;
    bottom: 0;
    padding: 10px;
    position: fixed;
    z-index: 2500;
    -moz-box-shadow: 0 0 2px 3px var(--onyx-60);
    -webkit-box-shadow: 0 0 2px 3px var(--onyx-60);
    box-shadow: 0 0 2px 3px var(--onyx-60);
}
#static_summary {right: 35px;}
#live_summary {right: 440px;}

.summary-box span {
    display: block;
    float: left;
    padding: 2px 5px;
    font-weight: bold;
}

.ui-dialog .ui-dialog-title {
    font-size: 1.3em;
    text-transform: uppercase;
}

.ui-dialog-content span {
    display: block;
    float:right;
    text-align: right;
    clear: right;
}

#static_summary div div, #live_summary div div.info {
    clear:both;
    height: 18px;
}

.multi-cur div {
    padding: 0 0 0 10px;
}
.summary-box {
    width: 360px; /*ie7 requires a width with a float left/right combo*/
}
.summary-box dt {
    width: auto;
}
.summary-box h3 {
    text-align: center;
}

.summary-box dd, .ui-widget-content dd {
	text-align: right;
}
#static_summary #remaining_available_footer {
    background: var(--lazuli-inactive-00);
    border: 1px solid var(--lazuli-inactive-00);
    margin-top: 3px;
    margin-bottom: 3px;
}
#static_summary #remaining_available_footer.neg-amount {
    color: rgb(163, 54, 54);
    background: var(--ruby-10);
    border: 1px solid var(--ruby-ui-50);
}
.summary-box .footnote span {
    float:none;
    display:inline;
}
.summary-box .click-down,
.summary-box .click-up {
    background-image:url('../images/up-down-arrow.png');
    background-repeat: no-repeat;
    height: 5px;
    padding:0;
    margin:0 0 5px 0;
    width:250px;
    float:right;
}
.summary-box .click-down {
    background-position: bottom right;
}
.summary-box .click-up {
    background-position: top right;
}
.hover-tip {
    background: none repeat scroll 0 0 var(--onyx-10);
    border: 1px solid var(--white-00);
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    -moz-box-shadow: 0 0 2px 3px var(--onyx-ui-50);
    -webkit-box-shadow: 0 0 2px 3px var(--onyx-ui-50);
    box-shadow: 0 0 2px 3px var(--onyx-ui-50);
    font-weight: normal;
    left: 50px;
    padding: 10px;
    position: absolute;
    top: 0;
    width: 70%;
}
#live_summary .hover-tip {
    top: -30px;
}

.calc-line {
    border-top: 2px solid var(--onyx-ui-50);
    padding-top: 2px;
    margin-top: 2px;
}
#total_available_running_footer {
    padding-bottom: 12px;
}
.minimizable {
    clear:both;
}
/*-- forms --*/
.required label:after, label.required:after {
    content:"*";
}
label {
    padding-left:15px;
}
label input, #email_receipt_form label input {
	min-width: inherit;
	margin: 5px 14px;
}
label input[type='checkbox'], label input[type='radio'] {
    margin: 2px;
}

.has-success, .has-success:focus {
    outline: 1px solid var(--agate-70);
}
.has-error, .has-error:focus {
    outline: 1px solid var(--ruby-60);
}
.inline-editing-field input.has-error {
    background-color: var(--ruby-10);
}
.inline-editing-field {
    float: left;
    margin: 2px 10px 0px 0px;
}
.inline-editing-field .errorlist {
    /* This will eventually be promoted to the style for all fields, but that is another story for another time */
    color: var(--white-00);
    background-color: var(--ruby-60);
    outline: var(--ruby-60) solid 1px;
    padding: 0 5px;
    margin: 0;
    border: none;
    line-height: 22px;
}
.inline-editing-field input:disabled {
    background-color: var(--white-00) !important;
    border: none;
    color: var(--onyx-70);
    min-width: 5px;
    display: block;
}
.inline-editing-field input, .inline-editing-field select {
    background: var(--agate-10);
    border: none;
    vertical-align: text-bottom;
    padding: 0 5px;
    float: left;
}
.inline-editing-field select {
    padding: 0px 3px;
}
.inline-editing-field select {
    padding: 1px 3px;
}
.inline-editing-edit.neutral.messages {
    padding: 10px;
}
/*-- ss for Self Serve --*/
select:disabled, .ss-form select:disabled, input:disabled, input:disabled:hover,
.ss-form input:disabled , .login-content input[type="submit"]:disabled,
.ss-form input[readonly], .ss-form form input[readonly],
.button-minor.disabled, .fake-input.disabled, .ss-form .input.small-form-element-wrap.disabled {
    background-color: var(--onyx-30) !important;
    border-color: var(--onyx-30);
    cursor: not-allowed;
    color: var(--onyx-60);
}
.disabled { /* no border and no background */
    cursor: not-allowed;
    color: var(--onyx-60) !important;
}
.ss-form input[type='number'] {
    text-align: right;
}
/* why small-form-element-wrap */
/* you need small-form-element-wrap so that we can deal with both
<label>Direct label</label><input type="radio">
and
<label>Main concept</label><input type="radio">Option 1 <input type="radio">Option 2*/
.checkbox-no-width,
.ss-form input[type='radio'],
.ss-form input[type="checkbox"] {
    margin: 6px 10px;
    min-width: 0px!important;
    width: auto !important;
    vertical-align: middle;
}
.ss-form.ex-wide div {
    width: 407px;
}
.single-entry-form {
    max-width: 1174px;
}
.ss-form {
    float: left;
    margin: 10px 15px 0 0;
    font-size: 16px;
}
.ss-form.no-label {
    min-width: initial;
    padding-right: 15px;
}

.ss-form.no-label input {
    min-width: 217px;
}
.ss-form.ss-form-select-two .select2-container-disabled {
    background-color: var(--onyx-30) !important;
    cursor: not-allowed;
}
.ss-form > *,
.small-form-element-wrap,
.button-select .fake-link,
.button-select .search-option,
.button-select .disabled-search-option {
	float: left;
}
.ss-form > *,
.button-select .fake-link,
.small-form-element-wrap,
.ss-form-select-two div.select2-container,
.ss-form-select-two-multi div.select2-container,
.ss-form-chosen div.chosen-container,
.fake-input,
.button-select .search-option,
.button-select .disabled-search-option {
    margin: 5px 0 0;
	font-size: 16px;
}

.ss-form form label,
.ss-form form input,
.ss-form form select,
.ss-form > *,
.button-select .fake-link, .small-form-element-wrap,
.ss-form-select-two div.select2-container, .fake-input,
.ss-form-chosen div.chosen-container {
    padding: 10px;
    /*in ff, select line-height goes to 22px, this 2px taller is to
    compensate for border*/
    line-height: 24px;
}
.ss-form label,
.ss-form form label {
    clear: both;
    background: var(--onyx-10);
    border: solid 1px var(--onyx-10);
    width: 195px;
}

.ss-form-invoice-custom-field-wrapper {
    display: inline-block;
    width: 195px;
    overflow: hidden;
    word-wrap: break-word;
}

.invoice-custom-field-input-container {
    display: flex;
    flex-direction: column;
    padding: 0;
}

.ss-form-invoice-custom-field-input-value {
    height: 30px;
    display: block;
    width: 283px;
    padding: 7px;
    border: 0;
}

.ss-form-invoice-custom-field-user-prompt-helptext {
    line-height: 14px;
    font-size: 12px;
    display: block;
    width: 280px;
    overflow: hidden;
    word-wrap: break-word;
    float: none;
    padding: 5px;
}

.ss-small label,
.ss-small form label {
    clear: both;
    background: var(--onyx-10);
    border: solid 1px var(--onyx-10);
    width: 155px;
    position: static;
}

.half-panel div.ss-small {
    padding: 0;
}

.ss-form.ex-wide label {
    width: 350px;
}

.ss-form .input.small-form-element-wrap {
    background-color: var(--agate-10);
    border: solid 1px var(--agate-10);
    min-width: auto;
}

/* Inline fields */
.ss-form.inline-fields {
    min-width: 1270px;
}

.ss-form.inline-fields > * {
    margin-right: 10px;
    clear: none;
}
.ss-form.inline-fields input[type="text"], .ss-form.inline-fields input[type="number"] {
    min-width: 66px;
    width: 206px;
}
.ss-form.inline-label-wrapper label {
    background: none;
    padding: 8px 10px;
    width: 206px;
}
.inline-label-wrapper {
    height: 34px;
}
.ss-form.inline-label-wrapper .errorlist {
    clear: none;
    float: left;
    margin-right: 10px;
    width: 297px;
}
.ss-form.inline-fields .errorlist {
    clear: none;
    float: left;
    margin-right: 10px;
    width: 228px;
}
.ss-form.inline-fields .errorlist.full-width {
    width: 100%;
    float: none;
}
/* end inline-field */

.inline-error-wrapper .small-form-element-wrap {
    height: 0;
}
.ss-form label span {
	float:right;
	color:var(--onyx-ui-50);
}
.form-info-area {
    border: solid var(--onyx-30) 1px;
    min-width: 400px;
}
.ss-form > input {
	min-width: 277px;
}
.ss-small > input {
    min-width: 192px;
}
.ss-form input, .ss-form select, .ss-form form input,
.ss-form-select-two div.select2-container,
.ss-form-select-two-multi div.select2-container, .fake-input,
.ss-form input[type='number'], .ss-form input[type='file'],
input.filter-box {
    background: var(--agate-10);
    border: 1px solid var(--onyx-30);
}
.ss-form select {
    min-width: 298px !important;
}
.ss-form select.no-stretch {
    max-width: 298px !important;
}
.ss-form input[type="file"] {
    height: 30px;
    padding: 6px;
}
.ss-form .icon.cancel, .ss-form .icon.accept {
    margin-left: 15px;
    margin-top: 15px;
    min-width: auto;
}
.label-header {
	float: left;
	width: 227px;
}

.ss-form.equation {
    margin: 0;
}

.ss-form.equation *, .ss-form.equation span * {
    padding: 5px 10px;
}

.ss-form.equation label, .ss-form.equation input,
.ss-form.equation .fake-input {
    display: inline-block;
    min-width: 100px;
    text-align: right;
    width: 100px;
    font-size: 14px;
}

.ss-form.equation.display-only *:not(.dummy){
    background: none;
    border: var(--white-00);
    font-size: 16px;
    margin: 0;
    padding: 0 11px;
}

.ss-form.equation.display-only:not(.reference) .fake-input,
.ss-form.equation.display-only:not(.reference) .currency {
    font-weight: bold;
}

.ss-form.equation.reference * {
    color: var(--onyx-ui-50);
}

.ss-form.equation.display-only .divider {
    height: auto;
    margin-top: 10px;
    padding: 10px 0 0;
}

.ss-form.equation .divider:not(.dummy) {
    min-width: 170px;
    width: auto;
}

/* form select2 */

.select-two .select2-drop-active {
    border-color: var(--onyx-30);
}
.ss-form-select-two .select2-container a,
.ss-form-select-two .select2-container-multi .select2-choices,
.ss-form-select-two .select2-container-multi.select2-container-active .select2-choices,
.ss-form-select-two div.select2-container a,
.ss-form-select-two .select2-container-active.select2-dropdown-open a,
.ss-form-select-two .select2-choice, div.ss-form-select-two-multi .select2-choices {
    background:none;
    border:none;
}
.ss-form .select2-container-multi {
    min-width: 298px;
}
.ss-form input:focus,
.button-select .fake-link:hover, .button-select .search-option:hover {
    background: var(--onyx-30);
    border: 1px solid var(--agate-60);
}
.ss-form-select-two div.select2-container {
    padding: 8px;
}
.select-two .select2-search, .select-two .select2-results,
.select-two .select2-drop {
    background:var(--agate-10);
}
.ss-form-select-two-multi div.select2-container {
    padding: 7px 0;
}
.fake-multi-select {
    background: url("../images/select2.png") repeat scroll 3px 76px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 12px;
    width: 25px;
    cursor: pointer;
    float: right;
    margin-left: -25px;
    margin-top: 5px;
    position: relative;
}
.ss-form .fake-multi-select {
    margin-top: -25px;
}
.fake-multi-select.up {
    background-position:-16px 76px ;
}
.ss-form-select-two-multi > span {
    display: inline-block;
    float: right;
    padding: 0;
}
/* end form select2 */

input[type="file"].hidden-file-input {
    width: 0;
    min-width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    border: none;
    overflow: hidden;
}
.ss-form .errorlist {
    list-style: none;
    clear: both;
    margin: 0;
    padding: 0;
    float: none;
    max-width: 100%;
}
.ss-form-select-two .errorlist {
    margin-right: 0;
    padding-right: 30px;
}
.ss-form .helptext {
    padding-top: 0;
    margin-top: 0;
}
.ss-form span.helptext {
    margin-left: 210px;
    width: 284px;
    padding-top: 5px;
    overflow: hidden;
    word-wrap: break-word;
}
.ss-form.ss-small span.helptext{
    margin-left: auto;
    width: auto;
}
.ss-form.ss-small span.helptext.smallhelp {
    /* Restrict width to match narrow input fields */
    width: 192px;
    /* Use fixed margin to avoid browser incompatibility issues */
    margin-left: 5px;
}
.ss-form .errorlist li {
    padding: 7px 10px;
    margin: 0;
    font-size: 16px;
}
.ss-form .search {
   background: url("../images/select2.png") repeat scroll 18px 15px;
   display: inline-block;
   height: 15px;
   width: 20px;
   cursor: pointer;
}
/* this should be removed and moved to a float or clearfix class */
.ss-form#memo_line,
.ss-form#payee_name, .ss-form#iso_code, .ss-form#postal_code, .ss-form#city,
.ss-form#routing_number {
    clear: both;
}
.form-icon {
    margin-bottom: 10px;
    margin-top: 0;
    margin-right:10px;
    display: block;
    float: left;
}
.form-icon span {
    display: inline-block;
    float: left;
    height: 15px;
    margin: 0;
    min-width: 25px;
    padding: 10px 10px 10px 0;
}
/* should be removed payee phase 1.5 */
.ss-form>.form-icon {
    margin-right:10px;
    display: block;
    float: left;
}
/* should be removed payee phase 1.5 */
#initial_email #attachments, #bulk_email #attachments {
    width: 550px;
}
/* should be removed payee phase 1.5 */
#initial_email #attachments > span, #bulk_email #attachments > span {
    float: left;
    clear: left;
}

.ss-form #subject_input {
    width: 330px;
}
/* switch to label-context payee phase 1.5 */
.ss-form #add_sponsor, .ss-form .label-context {
    display: inline;
    float: right;
}
.ss-form .label-percentage {
    background: url(../images/percentage-input.png) no-repeat var(--agate-10) left center;
}

.ss-form select.ss-form-month_repeat_select {
    min-width: auto;
    width: auto;
    margin-right: 5px;
    margin-top: -10px;
}

.helptext {
    line-height: 14px;
    clear: both;
    font-size: 12px;
    padding: 5px 10px 0;
    width: 480px;
    display:block;
    margin: 10px 0 0;
}

.divider {
    margin-top: 15px;
    padding-top: 15px;
}

.divider.calc-wrapper {
    margin-top: 0;
    padding-top: 0;
}

.divider,
.ss-form.equation.display-only .divider {
    border-top: 1px var(--onyx-ui-50) solid;
}

.divider.dummy,
.ss-form.equation .divider.dummy {
    border-top: 1px var(--white-00) solid;
}

.vertical-divider {
    border-left: 1px var(--onyx-ui-50) solid;
    padding-left: 2%;
    width: 47%
}

.fieldset .legend {
    font-weight: bold;
}

.calc-wrapper .fieldset .legend {
    margin-top: 10px;
    margin-bottom: 10px;
}

.calc-wrapper .fieldset {
    margin-top: 0;
}

#id_archive_file,
#id_import_immediately {
    float: left;
}
#archive_file label,
#import_immediately label {
    padding-left: 20px;
}
#archive_file,
#import_immediately {
    padding-top: 10px;
}
.share-results .icon {
    padding: 0 5px 10px 5px;
}

/* tabs */
.content-tab {
	background-color: var(--onyx-10);
    cursor: pointer;
    margin: 2px;
    padding: 10px 25px;
    line-height: 22px;
    min-height: 25px;
}
.content-tab.selected {
	padding: 10px 25px 11px;
	margin: 0;
	background-color: var(--white-00);
    border-top:1px solid var(--agate-70);
    border-right:1px solid var(--agate-70);
    border-left:1px solid var(--agate-70);
    border-bottom:3px solid var(--white-00);
}
.content-tabs * {
    float: left;
    list-style: none outside none;
}
.content-tabs li .h3-icon {
    display: inline-block;
    margin-top: 5px !important;
}
.content-tabs li .icon {
    margin-left: 10px;
}

.content-tabs {
    margin: 0 0 5px;
	padding: 0;
	height: 47px;
	display: block;
	border-bottom: 1px solid var(--agate-70);
	float: none;
}
/* end tabs */

h2.icon.superscript {
    background-position: right top;
}

sup {
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    background-color: var(--agate-70);
    border-radius: 11px 11px 11px 11px;
    color: var(--white-00);
    font-weight: bold;
    height: 22px;
    left: 6px;
    line-height: 22px;
    text-align: center;
    width: 22px;
    position: relative;
    display: inline-block;
    cursor: default;
    vertical-align: baseline;
    top: -0.4em;
}

sup.info {
    background-color: var(--lazuli-80);
}

.fa-times-circle {
    color: var(--lazuli-80);
}

.sortable-handle {
	background: url(../images/sortable-handle.png) 0 3px no-repeat;
	display: inline-block;
	height: 24px;
	width: 11px;
	margin-right: -30px;
    margin-top: 3px;
}
.left {
    background-position: left center;
}
.right {
    background-position: right center;
}
.delete {
    background: url(../images/25x25-delete.png) no-repeat left center;
}
.cancel {
    background: url(../images/25x25-cancel.png) no-repeat left center;
}
.small-delete {
    background: url(../images/sb-close-icon.png) no-repeat left center;
}
.config-item .delete {
	background: url(../images/close-details-icon.png) no-repeat 0 0;
	height: 16px;
	width:25px;
	display:inline-block;
}
.help {
    background: url(../images/25x25-help.png) no-repeat left center;
}
.small-help {
    background: url(../images/help-icon.png) no-repeat left center;
}
label#note-label {
    color:var(--onyx-60);
    font-weight: bold;
    font-size:16px;
    background:none !important;
    border:none;
    margin: 0 !important;
    padding: 20px 0 10px !important;
    font-style: italic;
}
textarea {
    float:left;
    margin:5px 0 10px 0;
    width: calc(96% - 5px);
    min-height: 60px;
}

.button {
    border: none;
    border-radius: 3px;
    color: var(--white-00) !important;
    cursor: pointer;
    display: block;
    float: left;
    font-size: 16px !important;
    font-weight: bold;
    height: 30px !important;
    line-height: 29px;
    margin: 30px 10px 40px 0;
    min-width: 60px !important;
    padding: 0 20px 0 20px !important;
    text-align: center !important;
    text-transform: uppercase;
    width: auto !important;
}

.button-small {
    border: none;
    border-radius: 3px;
    color: var(--white-00);
    cursor: pointer;
    display: inline-block;
    font-size: 11px !important;
    font-weight: bold;
    height: 22px !important;
    line-height: 22px;
    min-width: 40px !important;
    padding: 0 10px 0 10px !important;
    text-align: center !important;
    text-transform: uppercase;
    width: auto !important;
}

.button-submit, .button-table {
    background-color: var(--agate-70);
}
.button-reject {
    background-color: var(--agate-ui-50) !important;
}
.button-delete, .button.button-delete {
    background-color: var(--topaz-70);
}
.button-undo {
    background-color: var(--topaz-70) !important;
}
.button-submit:hover, .button-table:hover {
	background-color: var(--agate-80);
}

button[disabled],
button.button[disabled],
button[disabled]:hover {
    background-color: var(--onyx-ui-50);
}
.button-reject:hover {
    background-color: var(--agate-60) !important;
}
.button-delete:hover, .button.button-delete {
    background-color: var(--topaz-80);
}
.button-undo:hover {
    background-color: var(--topaz-80) !important;
}

.button-table {
    margin-top: 18px !important;
    margin-bottom: 15px !important;
}

#hide-filter {
    float: right;
    padding: 6px 20px 0;
}
li .button-minor, .button-minor + .button-minor {
    margin-left:20px;
}
.button-minor, .popup .button-minor {
    background:var(--agate-60);
    border:4px solid var(--agate-60);
    border-radius:3px;
    color:var(--white-00);
    margin-right:4px;
    font-weight:bold;
    padding: 2px 5px;
    line-height: 24px;
    cursor: pointer;
	width:auto;
	min-width:inherit;
    vertical-align: text-top;
}
.button-minor:hover, .popup .button-minor:hover {
    background-color:var(--agate-ui-50);
    border:4px solid var(--agate-ui-50);
}
.button-minor:hover:disabled {
    border-color: var(--onyx-30);
}
.button-minor.button-delete:hover {
    background-color: var(--ruby-ui-50);
    border-color: var(--ruby-ui-50);
}
.button-select .fake-link, div.search, .button-select .search-option,
.button-select .disabled-search-option {
    width: 214px;
    background: var(--agate-10);
    border: 1px solid var(--onyx-30);
    cursor: pointer;
    color: var(--onyx-70);
    text-align: left;
    margin: 10px 10px 5px;
    padding: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
}
.button-select .disabled-search-option {
    cursor: default;
    color: var(--onyx-ui-50);
}
.button-select input {
    background: none;
    border: none;
    font-size: inherit;
    line-height: inherit;
    padding: 8px;
    width: 427px;
    display: inline-block;
}
.button-select div.search {
    background:none;
    padding:0;
    float: none;
    clear:both;
    width:477px;
	white-space:nowrap;
    height: 40px;
}
.button-select .search span {
    background: url('../images/select2.png') -42px -24px no-repeat;
    display: inline-block;
    height: 29px;
    vertical-align: bottom;
    width: 15px;
    margin-left:10px;
}
.last-updated {
    font-weight: normal;
    font-style: italic;
    font-size: 12px;
    display:block;
}
/*-- Containers --*/
#super-wrapper {
    margin-left: 228px;
    margin-right: 40px;
    }
#super-wrapper.min {
    margin-left: 64px;
    }
#wrapper {
    float:left;
    background:var(--white-00);
    margin:65px 10px 20px;
    padding:10px;
    width:100%;
    min-width: 886px;
    border:1px solid var(--onyx-30);
}
#content-wrapper {
    width:100%;
    min-height: 600px;
    border-bottom:2px solid var(--agate-60);
    }
#content-sub-wrapper {
    padding:10px;
}
#header {
    border-bottom:5px var(--agate-60) solid;
    margin-bottom:10px;
}

#header img {
    vertical-align: bottom;
    margin-right:20px;
}

#header h1 {
    margin:14px 0 0 0;
    line-height: 24px;
    display: inline-block;
}
.display-none {
    display:none;
}
#footer {
    font-size: 14px;
    font-weight: 400;
    color:var(--onyx-70);
    float: left;
    margin: 0;
    padding: 20px 10px 5px;
    list-style: none;
    color:var(--agate-60);
    width: 98%;
}
#powered-greenphire {
    float:right;
    color:var(--onyx-70);
}
#powered-greenphire img {
    vertical-align: middle;
    height: 15px;
}
.confirm-msg {
    background: var(--agate-10);
    border: 1px solid var(--agate-60);
    padding: 15px;
    font-size: 16px;
    color: var(--onyx-60);
    font-weight: bold;
    display: inline-block;
    margin: 10px 0;
}
/* ---------------- MODAL & LOGIN STYLES ------------------- */

#login-wrap {
    /*position:fixed;*/
    width:100%;
    z-index:1000;
    top:0;
    left:0;
    background-position: center top;
    background-repeat: no-repeat;
    background-color:var(--white-00);
    height:1200px;
}

.login_overlay {
    position:relative;
    top:0;
    width:100%;
    height: 900px;
}

.login_overlay>.popup_wrapper {
    width: 660px;
    padding:0;
    margin:0 auto;
}

.login-content {
    background-repeat: no-repeat;
    background-position: right top;
    top: 119px;
}

#login-logo-cont {
    padding-bottom: 20px;

    img {
        height: 35px;
    }
}

.login-content p,
.login-content h3,
.login-content .single-char-container,
.login-content .login-form-element-wrapper {
    margin-left: 15px;
    font-size: 16px;
    line-height: 20px;
}

.login-content h3 {
    margin-top: 0;
}

#login-area {
    width:300px;
    float:left;
    border-right: 1px var(--onyx-70) solid;
    padding-right: 30px;
}

.login-content label {
    color:var(--agate-70);
    font-weight: bold;
    font-size:16px;
    display:block;
}

.login-content .radio-indent label {
    padding-left: 0;
}

.login-content .radio-indent label,
.login-content .radio-indent [type="submit"] {
    margin-left: 31px;
}
.login-content .radio-indent [type="text"] {
    width: 210px;
}

.login-content .errorlist,
.login-content .messages {
    margin: 0 0 15px 15px;
}
.login-content .password {
    width: 270px;
}
.login-content .password ul {
    padding: 25px;
}

.login-content .login-form-element-wrapper {
    padding-top: 10px;
}

.login-content .disclaimer {
    font-size: 14px;
    line-height: 16px;
}

#login-side-bar {
    width: 240px;
    float: right;
    padding-top: 25px;
    min-height: 150px;
}
#login-side-bar.errors-exist {
    min-height: 225px;
}

.login-content input[type="text"],
.login-content input[type="password"],
.login-content input[type="email"] {
    width: 250px;
    background: var(--agate-10);
    border: 1px solid var(--onyx-30);
    margin: 15px 0 15px 15px;
    padding: 0 15px;
    line-height: 38px;
    height: 38px;
}

.login-content input[type="text"].single-char {
    width: 27px;
    line-height: 27px;
    padding: 5px;
    margin: 2px 4px 2px 0px;
    text-align: center;
    vertical-align: middle;
    font-size: 24px;
    font-family:Arial, Helvetica, sans-serif;
    height: 27px;
}

.login-content input[type="submit"] {
    width:auto;
    color:var(--agate-80);
    background: var(--agate-ui-50);
    border: 1px solid var(--onyx-30);
    height:40px;
    margin:15px;
    line-height: 33px;
    padding:0 25px;
}
.login-content input[type="checkbox"] {
    margin: 3px 5px 3px 0;
}
.login-content input[type="submit"]:hover {
    background: var(--onyx-30);
}

.login-content input:focus {
    background: var(--onyx-30);
    border: 1px solid var(--agate-ui-50);
}

#footer-wrap div a {
    padding:15px 5px;
    line-height:20px;
    border:none;
}
#footer-wrap div a img {
    vertical-align: bottom;
    border:none;
}
#footer-wrap {
    margin: 150px auto;
    width: 600px;
}


.popup {
    position:absolute;
    z-index:2999;
    top:0;
    left:0;
}

.popup_overlay {
    position:relative;
    top:0;
    background-image: url(../images/pattern_repeat.png);
    background-repeat: repeat;
}

.popup-content, .login-content  {
    position: relative;
    z-index: 99;
    min-width: 338px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px;
    background-color: var(--white-00);
    box-shadow: 0 0 4px 2px var(--onyx-ui-50);
    display: inline-block;
    border: solid var(--onyx-ui-50) 2px;
}

.popup-content.small {
    width: 338px;
}

.popup-content.medium {
    width: 538px;
}

.popup-content.large {
    width: 645px;
}

.popup-content .btn-group,
.panel-inset .btn-group {
    height: auto;
    overflow: hidden;
}

.popup-content .button {
    margin-bottom: 0;
}

.popup-content h2 {
    max-width: 800px;
    padding-bottom: 0;
    padding-top: 0;
    margin-bottom: 17px;
}

.popup-content h2 p {
    margin-top: 5px;
    text-transform: none;
}

.popup-content h3 {
    margin-top: 15px;
}

.popup-content h3,
.popup-content p {
    line-height: 20px;
}

.popup-content p, .popup-content ul {
    font-size: 16px;
    margin-bottom: 10px;
    max-width: 600px;
}

.popup-content p:last-of-type {
    margin-bottom: 0;
}

.popup-content .ss-form.top-element, .popup-content .ss-form.top-element * {
    margin-top: 0;
}

.popup-content .footer {
	clear:both;
	font-style: italic;
	padding-left: 20px;
	text-align: right;
	bottom: 80px;
	position: absolute;
	width: 85%;
}

.closebtn {
    position:absolute;
    top:10px;
    right:10px;
    width:19px;
    height:18px;
    background-image: url(../images/sb-close-icon.png);
    background-repeat: no-repeat;
}

.popup-content .btn-group .note {
    display: inline-block;
    margin-top: 1.75em;
    margin-left: 30px;
    vertical-align: middle;
}

.popup-content .totals-box {
    margin-top: 15px;
}

.popup-content .totals-box div {
    margin: auto;
    width: 300px;
}

.popup-content .totals-box label {
    display: inline;
    font-size: 16px;
    padding-right: 15px;
}

.popup-content .notes-content p {
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

/* Icon-lists */
.icon-list-item {
    margin-top: 5px;
    min-height: 4.5em;
    max-height: 6.5em;
    padding-left: 80px;
    position: relative;
    border-top: 1px solid var(--onyx-30);
 }

.icon-list-item:first-of-type {
    border-top: 1px solid var(--white-00);/* For consistent spacing */
}

.icon-list-item .brand-icon {
    color: var(--topaz-ui-50) ;
    font-size: 50px;
    position: absolute;
    top: 18px;
    left: 5px;
}

.icon-list-item:first-of-type .brand-icon {
    top: 8px;
}

.icon-list-item h3 {
    margin-top: 10px;
}

.icon-list-item:first-of-type h3 {
    margin-top: 0;
}

/*----- wizard ------*/

.wizard {
  list-style: none;
  font-size: 14px;
  font-weight: bold;
  padding: 0;
}
.wizard li {
    float:left;
    background: none repeat scroll 0 0 var(--agate-10);
    margin: 5px;
    padding: 0;
    white-space: nowrap;
}
.wizard .number {
    border-radius: 20px;
    background-color: var(--white-00);
    color: var(--onyx-70);
    width: 10px;
    height: 10px;
    padding: 10px;
    line-height: 10px;
    display: inline-block;
    margin: 5px 5px 5px -10px;
}
.wizard .first-step .number {
    margin-left: 10px;
}
.wizard .last-step {
    padding-right: 20px;
}
.wizard .current {
    background-color: var(--agate-60);
    color: var(--white-00);
}
.wizard li:after {
    content: "";
    position: absolute;
    margin-left:0px;
  	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
    border-left: 20px solid var(--agate-10);
}
.wizard li.current:after {
   border-left: 20px solid var(--agate-60);
}
.wizard li.current:before {
    border-color: var(--agate-60) var(--agate-60) var(--agate-60) var(--white-00);
}
.wizard li:before {
    content: "";
    border-width: 20px;
    display:inline-block;
    float: left;
	border-style: solid;
	border-color: var(--agate-10) var(--agate-10) var(--agate-10) var(--white-00);
}
.wizard li.first-step:before, .wizard li.last-step:after {
    border:none;
}
/*-------iframe--------*/
iframe#report_iframe {
    width:100%;
    border:none;
    margin-top:15px;
    height: 1500px;
}
/*---messages----*/
.background-alert {
    background: none repeat scroll 0 0 var(--topaz-30);
    border: 2px solid var(--topaz-ui-50);
    color: var(--topaz-80);
    font-size: 12px;
    padding: 8px;
}
.upload-message ul, .upload-message li {
    list-style: none;
}
.receipt-counter {
	margin: 0px 20px;
	padding: 0px;
}
.receipt-counter li {
	list-style: none;
	max-width: 490px;
    line-height: 20px;
}
.receipt-counter .warning {
    color: var(--onyx-70);
    padding: 2px 5px;
    margin: 3px 0px;
    background-color: var(--topaz-10);
    border: 1px solid var(--topaz-30);
}
.receipt-counter .warning span.warning {
    float: right;
    color: var(--topaz-70);
    margin:0;
    padding:0;
    background: none;
    border: none;
}
.receipt-counter .error {
	color: var(--onyx-70);
	padding: 2px 5px;
	margin: 3px 0px;
	background-color: var(--ruby-10);
	border: 1px solid var(--ruby-ui-50);
}
.receipt-counter .error span.error {
	float: right;
	color: var(--ruby-60);
	margin:0;
	padding:0;
	background: none;
	border: none;
}
.receipt-counter .warning {
	color: var(--onyx-70);
	padding: 2px 5px;
	margin: 3px 0px;
	background-color: var(--topaz-30);
	border: 1px solid var(--topaz-ui-50);
}
.receipt-counter .warning span.warning {
	float: right;
	color: var(--topaz-80);
	margin:0;
	padding:0;
	background: none;
	border: none;
}
.receipt-counter .unchanged {
	color:var(--agate-70);
}

.receipt-counter .updated {
	color:var(--lazuli-80);
}

.receipt-counter .added, .receipt-counter .success {
	color:#565624;
}

.messages {
    margin-top: 10px;
    padding: 10px;
}

.messages.ss-form {
    padding: 0;
}

.messages * {
    font-size: 16px;
    line-height: 20px;
    margin: 0;
}

.neutral *, .neutral {
    background-color: var(--topaz-10);
    color: var(--topaz-60);
}

.messages.neutral a {
    color: var(--topaz-60);
    text-decoration: underline;
}

.messages.neutral a:hover {
    color: var(--topaz-70);
    text-decoration: underline;
}

.danger *, .danger {
    background-color: var(--ruby-10);
    color: var(--ruby-60);
}

h2.danger-text {
    color: var(--ruby-60);
}

.messages h3 {
    font-weight: 700;
}

.messages .messages-dismiss {
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    line-height: 11px;
    cursor: pointer;
}

.messages.dismissible {
    display: flex;
    justify-content: space-between;
}

#breadcrumbs:not(:empty) {
    margin-bottom: 10px;
}

/* Session expiry */
.session_security_overlay {
    background-image: url(../images/pattern_repeat.png);
    background-repeat: repeat;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10001;
}
.session_security_modal {
    background: none repeat scroll 0 0 var(--white-00);
    left: 25%;
    overflow: auto;
    padding: 16px;
    position: fixed;
    text-align: center;
    top: 25%;
    width: 50%;
    z-index: 10002;
    -moz-box-shadow: 0 0 4px 2px var(--onyx-ui-50);
    -webkit-box-shadow: 0 0 4px 2px var(--onyx-ui-50);
    box-shadow: 0 0 4px 2px var(--onyx-ui-50);
    border: solid var(--onyx-ui-50) 2px;
}
.search-callout {
    font-style:italic;
    padding-bottom: 10px;
    padding-left: 10px;
}
.search-callout span {
    font-weight: bold;

}

/* EDC import page */
#edc_integrations_table form input {
    color:transparent;
    width:100px;
}

#edc_log {
    max-width: 880px;
}

#add_edit_sftp_form #study_contact,
#add_edit_sftp_form #name,
#add_edit_sftp_form #server,
#add_edit_sftp_form #sftp_login,
#add_edit_sftp_form #preprocessors,
#add_edit_sftp_form #file_name_convention {
    clear: both;
}
.filter {
    display:inline-block;
}
#active_filters>div + div {
    margin-top: 20px;
}
#active_filters h3 {
    display:inline-block;
    margin-right: 10px;
}
.disable-filter {
    opacity:.4;
}
/* bootstrap overrides */
.input-xs {
    border-radius: 0;
    margin: 2px 0;
}
.form-control, .panel, .panel-heading {
    border-radius: 0;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}
.row>div.floatlf {
    padding:0 20px;
}
.table-center-cells td {
    text-align:center;
}
.tooltip-wrapper {
    padding: 15px 0;
    display: inline;
}
/**************************
User Management/Permissions
**************************/
/* Edit permissions page */
#permission_changes {
    min-width: 650px;
}
.override-counter,
.change-counter {
    border-radius: 20px;
    font-size: 14px;
    padding: 3px 9px;
    position: relative;
    top: -2px;
    line-height: 1.5;
    color: var(--white-00);
}
.panel .counters .override-counter {
    background-color: var(--topaz-ui-50);
}
.panel .counters .change-counter,.change-made.active, .change-made.sample {
    background-color: var(--lazuli-80);
}
.change-made {
	width:10px;
	height:10px;
	position:relative;
	display: inline-block;
	top: 2px;
	border-radius: 5px;
	margin-right: 5px;
    background-color: none;
}
.role-override {
	position:relative;
	display: inline-block;
	top: 2px;
	margin-right: 5px;
    background-color: none;
    border: none;
    width: 10px;
}
.role-override.active, .role-override.sample {
    width: 0px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 10px solid var(--topaz-ui-50);
}
.toggle-panel {
    position: absolute;
}

#parent_language_preference .select2-container {
    margin:0px;
    padding:0px;
    width: 225px !important;
    font-size: 14px !important;
    height: 20px;
    border: None;
}

#parent_language_preference .select2-chosen, #parent_language_preference .select2-choice {
    height: 20px;
}

/**********
END Section
**********/
/******************
Contract amendments
******************/
.extra-schedule .icon {
    width: 25px;
}
/**************************
accordion
**************************/
.accordion-title {
    background-color: var(--onyx-10);
    margin-top: 12px;
    padding: 3px 10px;
    vertical-align: middle;
    width:675px;
    cursor: pointer;
    font-size: 16px;
}
.accordion-title .expand {
    float:right;
}
.accordion-sub-section {
    padding: 10px 10px 5px;
    clear: top;
}
.accordion-sub-section:nth-child(n+2) {
    border-top:1px dotted var(--onyx-ui-50);
}
.accordion-body {
    font-size: 14px;
    width: 675px;
}
.accordion-body .inline-editing-tools {
    padding:4px;
}
.inline-editing-field .number, input.number {
    width: 30px;
    min-width: 30px;
}
.inline-editing-field .amount {
    width: 60px;
    margin-right: 3px;
}
input.number, input.amount {
    text-align: right;
}

.inline-editing-field .text-box {
    width: 470px;
}

.fake-inline-input {
    background: none !important;
    cursor: text !important;
}
.fake-inline-editing-field {
    margin-top: 2px;
}

.div-border-top {
    border-top:1px dotted var(--onyx-ui-50);
    margin-top: 5px;
    padding-top: 5px;
}
dt.column, dd.column {
   margin-top: 0;
   margin-right: 0;
}
.div-92-percent {
    width: 92%;
}
/**********
END Section
**********/

/************
Summary table
************/
#summary_head th,
#summary_return_head th,
#summary_amounts th,
#summary_return_amounts th {
    font-family:"freight-sans-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: normal;
    text-align: left;
    padding: 10px;
    border: 1px solid var(--onyx-ui-50);
}
#summary_head th,
#summary_return_head th {
    background: var(--onyx-10);
    font-size: 14px;
    border-bottom: none;
}
#summary_amounts th,
#summary_return_amounts th {
    background: var(--onyx-10);
    font-size: 18px;
    padding: 15px 15px 15px 10px;
    line-height: 23px;
}
#summary_amounts th .separate,
#summary_return_amounts th .separate {
    padding-right: 10px;
    margin-right: 5px;
    border-right: 1px solid var(--onyx-70);
}

/**************************
popovers
**************************/
.popover-link {
    border-bottom: 1px dashed;
    cursor: pointer;
}

.popover {
    max-width: none;
    z-index: 2000;
}

.popover dl {
    padding-right: 6px;
    padding-bottom: 1px;
    cursor: default;
    width: 225px;
    float: left;
}

.sortable_table td .popover dt,
.sortable_table td .popover dd,
.popover dd,
.popover dt {
    width: auto;
    margin-right: 5px;
    display: block;
}

.sortable_table td .popover dt,
.popover dt {
    float: left;
}

.popover, .popover-title {
    line-height: 14px;
    font-size: 14px;
}

td.popover-error .popover {
    background: var(--ruby-10);
    border: 1px solid var(--ruby-60);
    color: var(--ruby-60);
    font-weight: 700;
}

td.popover-error .popover .arrow {
    border-left-color: rgba(241, 177, 177, 1);
}

td.popover-error .popover .arrow::after {
    border-left-color: var(--ruby-10);
}

td.popover-error .popover h3 {
    display: none;
}

h3.popover-title {
    font-weight: 400;
    text-transform: none;
    padding-top: 8px;
    padding-left: 10px;
}

.popover-content {
    padding: 10px;
}

.popover-content .button-group .button-small {
    margin-right: 10px;
}

.popover-content .button-group .button-small:last-of-type {
    margin-right: 0;
}

/**********
END Section
**********/
/***********
Filter Boxes
***********/
.filter-box {
    min-width: 0px !important;
    width: 93.5%;
    height: 30px;
    margin-bottom: 5px;
    margin-top: 10px;
    padding: 2% 2% 2% 4%;
    background: var(--agate-10);
    border: none;
}

/* container width initially set to 370px */
.ms-container-override {
  width: 515px !important;
}
/**********
END Section
**********/

/**************************
Google reCAPTCHA
**************************/

.g-recaptcha-container {
    margin-top: 40px;
    margin-bottom: 20px;
}

.login-content .g-recaptcha-container {
    padding-left: 15px;
}
/**********
END Section
**********/
/**************************
charts
**************************/
.donut-chart-blur {
    fill-opacity: 0.2;
}
.donut-center-label {
    text-anchor: middle;
}
.donut-center-label .main-number{
    font-family: "Arial";
    font-weight: bold;
}
.donut-center-label .sub-text{
    font-weight: normal;
}
.chart-legend li {
    list-style: none;
}
.chart-legend li span {
    display: block;
    position: relative;
    max-width: 0;
    max-height: 0;
    left: -16px;
    top: -1px;
    font-size: 38px;
}
.half-panel .chart {
    min-width: 200px;
    padding: 0;
}
.chart-legend, .half-panel .chart-legend {
    padding: 0;
}
.chart-legend ul {
    padding-top: 0;
}
.chart-help-text {
    position: absolute;
    max-width: 190px;
}
/**********
END Section
**********/
/**************************
File Upload
**************************/
.upload-file-section {
    width: 365px;
}
.upload-file-group {
    border: 1px solid var(--onyx-30);
    height: auto;
    overflow: hidden;
    padding: 5px;
}

.upload-file-group .form-control {
    min-width: 0.01px;
    width: 0.01px;
    height: 0.01px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
    padding: 0;
}
.upload-file-group .label-text {
    display: block;
    position: relative;
    float: right;
    overflow: hidden;
    padding: 2px 10px 2px 2px;
    margin: 10px;
    margin-right: 0;
    text-overflow: ellipsis;
    width: 205px;
    white-space: nowrap;
    font-size: 14px;
}
.upload-file-group .remove {
    color: var(--agate-70);
    font-size: 1rem;
    opacity: 1;
    position: absolute;
    top: 6px;
    right: 10px;
    line-height: .8;
    font-weight: 700;
    cursor: pointer;
}
.upload-file-group .btn {
    float: left;
    height: 25px;
    padding: 1px 10px;
    margin: 10px;
    font-size: 14px;
    background-color: var(--agate-10);
    border: 1px solid var(--onyx-30);
    border-radius: 0;
    color: var(--agate-70);
    width: inherit;
}
.upload-file-group .btn:hover {
    color: var(--agate-60);
    background-color: var(--agate-10);
    border: 1px solid var(--onyx-30);
}
/**********
END Section
**********/

/*******************************
Browser support and doc tabs
*******************************/

ul {
    list-style-type: disc;
}

/* Style the buttons inside the tab */
div.tab div {
  display: inline-block;
  margin: 0 0 -1px;
  padding: 10px 35px;
  font-size: 12pt;
  text-align: center;
  background-color: var(--agate-10);
  color: var(--agate-70);
  border: 1px solid var(--onyx-30);
}

div.tab div:hover{
  color: var(--agate-60);
  cursor: pointer;
}

/* Create an active/current tablink class */
div.tab div.active {
  background-color: white;
  color: var(--onyx-70);
  border: 1px solid var(--onyx-30);
  border-bottom: 1px solid var(--white-00);
  cursor: default;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 20px 0px 0px 25px;
  border-top: 1px solid var(--onyx-30);
  min-width: 700px;
  min-height:725px;
}

.tablinks:focus {
    outline: none;
}

/**********
END Section
**********/

/**************************
Upload Invoice - DON'T REUSE, pattern is exception not the rule
**************************/

#id_invoice_fx_rate {
    min-width: 262px;
    padding-right: 25px;
    text-align: right;
}

.ss-form.invoice-fx-rate sup {
    position: relative;
    top: 0px;
}

.ss-form.invoice-fx-rate .popover {
    max-width: 340px;
    box-sizing: border-box;
    padding: 0;
}

.ss-form.invoice-fx-rate .popover .popover-content p {
    margin-top: 0px;
}

th.requested-amount-in-payment-currency-head {
    position: relative;
}
th.requested-amount-in-payment-currency-head sup {
    position: absolute;
    left: 80px;
    top: 50px;
}

/**********
END Section
**********/

/**************************
Invoice History - DON'T REUSE, pattern is exception not the rule
**************************/

table tr.data-header th.invoice-amount-with-currency-detail-head {
    padding: 8px 24px 12px;
    white-space: nowrap;
}

/**********
END Section
**********/

/**************************
Release Invoices - DON'T REUSE, pattern is exception not the rule
**************************/

#submission_banner.messages {
    margin-bottom: 15px;
}

/**********
END Section
**********/

/*******************************
Study overview - DON'T REUSE, pattern is exception not the rule
*******************************/

#edit_study_contacts_attachments .inline-group {
    margin-bottom: 5px;
}
#edit_study_contacts_attachments div {
    padding: 0;
}

#parent_attachments > div {
    margin-bottom: 5px;
}

#parent_attachments button {
    margin-right: 5px;
}

#parent_it_coordinator,
#parent_program_manager {
    max-width: 100%;
    width: 100%;
}

#parent_it_coordinator .select2-container,
#parent_program_manager .select2-container {
    max-width: 100%;
    width: 100%;
}

/**********
END Section
**********/

/* If a single string or phrase is too log for its' container it will wrap*/
.word-wrap {
    word-break: break-all !important;
}

/* Preserve whitespaces, break long words if needed */
.pre-word-break {
    white-space: pre-wrap !important;
    overflow-wrap: break-word !important;
}

/*********************
Manual payment request - DON'T REUSE, pattern is exception not the rule
*********************/

#payment_request_form > .errorlist {
    margin: 15px 0;
}

#payment_request_form .totals-box dl dt {
    margin: 0 30px 10px 0;
}

#payment_request_form .totals-box dl dt:last-of-type {
    margin-bottom: 0;
}

#payment_request_form .totals-box dl dd {
    margin: 0;
}

#caps_and_limits .indent {
    font-weight: 400;
}

#caps_and_limits dl {
    margin-bottom: 0;
}

#caps_and_limits div {
    margin-bottom: 10px;
    width: auto;
}

#caps_and_limits div:last-of-type {
    margin-bottom: 0;
}

#payment_request_form .input-container {
    max-width: 531px;
}
/**********
END Section
**********/

/**************************
Payment Pending Approval - DON'T REUSE, pattern is exception not the rule
**************************/

#pending_approval_export_button {
    margin-top: 0;
}

/**********
END Section
**********/

/**********
flex utilities
**********/
.flex {
    display: flex;
}
/**********
END Section
**********/

/**********
text utilities
**********/
.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.text-decoration-underline {
    text-decoration: underline;
}
/**********
END Section
**********/

/**********
Withholding tax Modal
**********/
.withholding-tax-modal-content {
    text-size-adjust: 100%;
    font-size: 16px;
}

.withholding-tax-messages p {
    margin: 0;
}

.withholding-tax-modal-content .total-amount-wrapper {
    margin: 20px 0;
}

.withholding-tax-modal-content .total-amount-wrapper sup {
    top: 0;
}

.withholding-tax-modal-content .total-amount-wrapper .popover {
    margin-right: 10px;
}

.withholding-tax-modal-content .total-amount-wrapper .popover-title {
    margin: 0;
    line-height: 14px;
}

form.withholding-tax-applicability {
    font-size: 16px;
}

form.withholding-tax-applicability table th, td, label, input {
    font-family: "freight-sans-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
}

form.withholding-tax-applicability .form-table {
    width: 100%;
    border-collapse: collapse;
}

form.withholding-tax-applicability .form-table th, .form-table td {
    border: none;
    padding: 8px 0;
    text-align: left;
}

form.withholding-tax-applicability .form-table th {
    font-weight: bold;
    vertical-align: top;
}

form.withholding-tax-applicability .form-table tbody td.label-cell {
    vertical-align: top;
}

form.withholding-tax-applicability .form-table tbody td.label-cell label{
    width: 260px;
    padding: 0 10px 0 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

form.withholding-tax-applicability .form-table tbody td.amount-cell {
    white-space: nowrap;
}

form.withholding-tax-applicability .form-table tbody td.amount-cell input {
    padding: 0 4px;
    width: 140px;
    box-sizing: border-box;
}

form.withholding-tax-applicability .form-table tbody td.amount-cell .currency{
    margin-left: 5px;
    bottom: 0;
}

form.withholding-tax-applicability .form-table tbody td.amount-cell .amount-error-message {
    outline: none;
    color: var(--white-00);
    background-color: var(--ruby-60);
    white-space: wrap;
    padding: 4px;
    width: 140px;
    box-sizing: border-box;
}

form.withholding-tax-applicability .has-error {
    outline: none;
    border: 1px solid var(--ruby-60);
    border-bottom: none;
    background-color: var(--ruby-10);
}

.wht-modal-buttons button.wht-cancel:not([disabled]) {
    background-color: #8CC545;
}

.wht-modal-buttons button.wht-cancel:not([disabled]):hover {
    background-color: #72AF1E;
}

.wht-modal-buttons div.popover h3.popover-title {
    margin-top: 0px;
    padding: 8px 10px;
    display: flex;
    justify-content: space-between;
}

.wht-modal-buttons div.popover h3.popover-title .title {
    margin-top: 0px;
    font-size: 1rem;
    font-weight: bold;
}

.wht-modal-buttons div.popover-content div.button-group {
    margin-top: 10px;
}

.wht-modal-buttons span.white-space {
    white-space: pre;
}

.wht-modal-buttons span.wht-confirm-cancel {
    cursor: pointer;
}

.wht-modal-buttons .popover {
    pointer-events: all;
}

/**********
Bulk Add Funding
**********/
.bulk-funding-messages p {
    margin: 0;
}
.bulk-funding-file-upload-wrapper {
    width: 100%;
    font-size: 1rem;
    display: flex;
    margin-right: 0;
    float: none;
}
.bulk-funding-file-upload-wrapper label {
    align-self: flex-start;
}
.bulk-funding-file-upload-wrapper .file-upload {
    padding: 0;
    flex: 1;
    display: flex;
    overflow: hidden;
    flex-direction: column;
}
.bulk-funding-file-upload-wrapper input[type="file"] {
    padding: 7px;
    font-size: 1rem;
}
.bulk-funding-file-upload-wrapper .file-upload .help-text {
    font-size: 0.75rem;
}
.bulk-funding-resource-wrapper {
    margin-top: 20px;
}
.bulk-funding-cancel-button:disabled {
    background-color: var(--onyx-ui-50) !important;
}
/**********
END Section
**********/
/**********
MTT Section
**********/
.text-popover-indicator {
    border-bottom: none;
    text-decoration: underline;
    text-decoration-style: dashed;
    text-underline-position: under;
    -webkit-text-decoration-style: dashed;
    -webkit-text-underline-position: under;
}
/**********
END Section
**********/

/**********
Withholding tax block in Credit details
**********/
.half-panel .apply-withholding-tax-section.totals-box {
    max-width: 500px;
}
/**********
END Section
**********/
