@atlassian/aui
Version:
Atlassian User Interface Framework
1,982 lines • 214 kB
CSS
/**
* RESET
*/
html,
body,
p,
div,
h1,
h2,
h3,
h4,
h5,
h6,
img,
pre,
form,
fieldset {
margin: 0;
padding: 0;
}
ul,
ol,
dl {
margin: 0;
}
img,
fieldset {
border: 0;
}
@-moz-document url-prefix() {
img {
font-size: 0;
}
img:-moz-broken {
font-size: inherit;
}
}
/* https://github.com/necolas/normalize.css */
/* Customised to remove styles for unsupported browsers */
details,
main,
summary {
display: block;
}
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden],
template {
display: none;
}
input[type="button"],
input[type="submit"],
input[type="reset"] {
-webkit-appearance: button;
}
/**
* TYPOGRAPHY - 14px base font size, agnostic font stack
*/
body {
color: #172B4D;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 1.42857143;
letter-spacing: 0;
}
/* International Font Stacks*/
[lang|=en] {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}
[lang|=ja] {
font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Verdana, Arial, sans-serif;
}
/* Default margins */
p,
ul,
ol,
dl,
h1,
h2,
h3,
h4,
h5,
h6,
blockquote,
pre,
form.aui,
table.aui,
.aui-tabs,
.aui-panel,
.aui-group {
margin: 10px 0 0 0;
}
/* No top margin to interfere with box padding */
p:first-child,
ul:first-child,
ol:first-child,
dl:first-child,
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child,
blockquote:first-child,
pre:first-child,
form.aui:first-child,
table.aui:first-child,
.aui-tabs:first-child,
.aui-panel:first-child,
.aui-group:first-child {
margin-top: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: #172B4D;
}
/* Headings: desired line height in px / font size = unitless line height */
h1 {
font-size: 24px;
font-weight: 500;
line-height: 1.25;
letter-spacing: -0.01em;
text-transform: none;
margin: 30px 0 0 0;
}
h2 {
font-size: 20px;
font-weight: 500;
line-height: 1.5;
letter-spacing: -0.008em;
text-transform: none;
margin: 30px 0 0 0;
}
h3 {
font-size: 16px;
font-weight: 500;
line-height: 1.25;
letter-spacing: -0.006em;
text-transform: none;
margin: 30px 0 0 0;
}
h4 {
font-size: 14px;
font-weight: 600;
line-height: 1.42857143;
letter-spacing: -0.003em;
text-transform: none;
margin: 20px 0 0 0;
}
h5 {
font-size: 12px;
font-weight: 600;
line-height: 1.66666667;
letter-spacing: 0;
text-transform: none;
margin: 20px 0 0 0;
}
h6 {
color: #6B778C;
font-size: 12px;
font-weight: 600;
line-height: 1.66666667;
letter-spacing: 0;
text-transform: none;
margin: 20px 0 0 0;
}
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
margin-top: 0;
}
/* Nice styles for using subheadings */
h1 + h2,
h2 + h3,
h3 + h4,
h4 + h5,
h5 + h6 {
margin-top: 10px;
}
/* Increase the margins on all headings when used in the group/item pattern ... */
.aui-group > .aui-item > h1:first-child,
.aui-group > .aui-item > h2:first-child,
.aui-group > .aui-item > h3:first-child,
.aui-group > .aui-item > h4:first-child,
.aui-group > .aui-item > h5:first-child,
.aui-group > .aui-item > h6:first-child {
margin-top: 20px;
}
/* ... unless they're the first-child */
.aui-group:first-child > .aui-item > h1:first-child,
.aui-group:first-child > .aui-item > h2:first-child,
.aui-group:first-child > .aui-item > h3:first-child,
.aui-group:first-child > .aui-item > h4:first-child,
.aui-group:first-child > .aui-item > h5:first-child,
.aui-group:first-child > .aui-item > h6:first-child {
margin-top: 0;
}
/* Other typographical elements */
small {
color: #7A869A;
font-size: 12px;
line-height: 1.33333333;
}
code,
kbd {
font-family: "SFMono-Medium", "SF Mono", "Segoe UI Mono", "Roboto Mono", "Ubuntu Mono", Menlo, Courier, monospace;
}
var,
address,
dfn,
cite {
font-style: italic;
}
cite:before {
content: "\2014 \2009";
}
blockquote {
border-left: 1px solid #DFE1E6;
color: #7A869A;
margin-left: 19px;
padding: 10px 20px;
}
blockquote > cite {
display: block;
margin-top: 10px;
}
q {
color: #7A869A;
}
q:before {
content: open-quote;
}
q:after {
content: close-quote;
}
abbr {
border-bottom: 1px #7A869A dotted;
cursor: help;
}
/* Deprecated header styles; to be removed in AUI 8.0 */
.aui-page-header-hero .aui-page-header-main h1,
.aui-page-header-hero .aui-page-header-main h2,
.aui-page-header-marketing .aui-page-header-main h1,
.aui-page-header-marketing .aui-page-header-main h2 {
font-size: 29px;
font-weight: 600;
line-height: 1.37931034;
letter-spacing: -0.01em;
text-transform: none;
margin: 30px 0 0 0;
}
.aui-page-header-hero .aui-page-header-main p,
.aui-page-header-marketing .aui-page-header-main p {
font-size: 20px;
font-weight: 500;
line-height: 1.5;
letter-spacing: -0.008em;
text-transform: none;
margin: 30px 0 0 0;
}
@font-face {
font-family: "Atlassian Icons";
src: url('fonts/atlassian-icons.eot');
src: url('fonts/atlassian-icons.eot?#iefix') format('embedded-opentype'), url('fonts/atlassian-icons.woff') format('woff'), url('fonts/atlassian-icons.ttf') format('truetype'), url('fonts/atlassian-icons.svg#atlassian-icons') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Adgs Icons";
src: url('fonts/adgs-icons.eot');
src: url('fonts/adgs-icons.eot?#iefix') format('embedded-opentype'), url('fonts/adgs-icons.woff') format('woff'), url('fonts/adgs-icons.ttf') format('truetype'), url('fonts/adgs-icons.svg#adgs-icons') format('svg');
font-weight: normal;
font-style: normal;
}
.aui-avatar {
box-sizing: border-box;
display: inline-block;
position: relative;
vertical-align: text-bottom;
}
.aui-avatar-inner {
display: flex;
justify-content: center;
align-content: center;
border-radius: 100%;
overflow: hidden;
}
.aui-avatar img {
display: block;
height: 100%;
margin: auto;
width: 100%;
}
.aui-avatar.aui-avatar-xsmall,
.aui-avatar.aui-avatar-xsmall .aui-avatar-inner {
height: 16px;
max-width: 16px;
max-height: 16px;
width: 16px;
}
.aui-avatar.aui-avatar-small,
.aui-avatar.aui-avatar-small .aui-avatar-inner {
height: 24px;
max-width: 24px;
max-height: 24px;
width: 24px;
}
.aui-avatar.aui-avatar-medium,
.aui-avatar.aui-avatar-medium .aui-avatar-inner {
height: 32px;
max-width: 32px;
max-height: 32px;
width: 32px;
}
.aui-avatar.aui-avatar-large,
.aui-avatar.aui-avatar-large .aui-avatar-inner {
height: 48px;
max-width: 48px;
max-height: 48px;
width: 48px;
}
.aui-avatar.aui-avatar-xlarge,
.aui-avatar.aui-avatar-xlarge .aui-avatar-inner {
height: 64px;
max-width: 64px;
max-height: 64px;
width: 64px;
}
.aui-avatar.aui-avatar-xxlarge,
.aui-avatar.aui-avatar-xxlarge .aui-avatar-inner {
height: 96px;
max-width: 96px;
max-height: 96px;
width: 96px;
}
.aui-avatar.aui-avatar-xxxlarge,
.aui-avatar.aui-avatar-xxxlarge .aui-avatar-inner {
height: 128px;
max-width: 128px;
max-height: 128px;
width: 128px;
}
.aui-avatar-project.aui-avatar-xxxlarge {
border-radius: 12px;
}
.aui-avatar-project.aui-avatar-xxxlarge .aui-avatar-inner {
border-radius: 12px;
}
.aui-avatar-project.aui-avatar-xxlarge {
border-radius: 6px;
}
.aui-avatar-project.aui-avatar-xxlarge .aui-avatar-inner {
border-radius: 6px;
}
.aui-avatar-project.aui-avatar-xlarge {
border-radius: 6px;
}
.aui-avatar-project.aui-avatar-xlarge .aui-avatar-inner {
border-radius: 6px;
}
.aui-avatar-project.aui-avatar-large {
border-radius: 3px;
}
.aui-avatar-project.aui-avatar-large .aui-avatar-inner {
border-radius: 3px;
}
.aui-avatar-project.aui-avatar-medium {
border-radius: 3px;
}
.aui-avatar-project.aui-avatar-medium .aui-avatar-inner {
border-radius: 3px;
}
.aui-avatar-project.aui-avatar-small {
border-radius: 2px;
}
.aui-avatar-project.aui-avatar-small .aui-avatar-inner {
border-radius: 2px;
}
.aui-avatar-project.aui-avatar-xsmall {
border-radius: 2px;
}
.aui-avatar-project.aui-avatar-xsmall .aui-avatar-inner {
border-radius: 2px;
}
/*! AUI Badge */
aui-badge,
.aui-badge {
background: rgba(9, 30, 66, 0.08);
border-radius: 2em;
color: rgba(9, 30, 66, 0.95);
font-size: 12px;
font-weight: 400;
line-height: 1;
margin: 0;
min-height: 1em;
min-width: 1em;
/* want a capsule style even when single digit */
padding: 2px 6px;
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
justify-items: center;
align-content: center;
text-decoration: none;
text-shadow: none;
text-transform: uppercase;
}
aui-badge.aui-badge-primary,
.aui-badge.aui-badge-primary {
background-color: #B3D4FF;
color: #0052CC;
font-weight: 600;
}
.aui-header a > aui-badge,
.aui-header a > .aui-badge,
.aui-button-primary > aui-badge,
.aui-button-primary > .aui-badge,
.aui-dropdown2.aui-style-default .active > aui-badge,
.aui-dropdown2.aui-style-default .active > .aui-badge {
background: rgba(255, 255, 255, 0.25);
color: #FFFFFF;
}
.aui-button[disabled] > aui-badge,
.aui-button[disabled] > .aui-badge {
background: rgba(9, 30, 66, 0.08);
color: inherit;
}
.aui-button-primary[disabled] > aui-badge,
.aui-button-primary[disabled] > .aui-badge {
background: rgba(255, 255, 255, 0.25);
}
.aui-button > aui-badge,
.aui-button > .aui-badge,
.aui-tabs .menu-item aui-badge,
.aui-tabs .menu-item .aui-badge {
top: -1px;
/* slight tweak to position them in specific contexts */
}
.aui-button,
a.aui-button,
.aui-button:visited {
box-sizing: border-box;
transition: background-color 0.1s ease-out;
border-radius: 3.01px;
border-style: solid;
border-width: 1px;
cursor: pointer;
font-family: inherit;
font-size: 14px;
font-variant: normal;
font-weight: 400;
background-image: none;
background-color: rgba(9, 30, 66, 0.08);
border-color: transparent;
color: #344563;
text-decoration: none;
display: inline-block;
height: 2.14285714em;
line-height: 1.36363636em;
margin: 0;
padding: 4px 10px;
vertical-align: baseline;
white-space: nowrap;
}
.aui-button.aui-button-light,
a.aui-button.aui-button-light,
.aui-button:visited.aui-button-light {
background-color: #FFFFFF;
}
.aui-button ~ .aui-button {
margin-left: 10px;
}
a.aui-button:hover,
a.aui-button:active,
a.aui-button:focus {
text-decoration: none;
}
.aui-button:focus,
.aui-button:hover,
.aui-button-subtle.aui-button:focus,
.aui-button-subtle.aui-button:hover {
background-color: rgba(9, 30, 66, 0.13);
border-color: transparent;
color: #344563;
text-decoration: none;
}
.aui-button:active,
.aui-button.aui-button-subtle:active,
.aui-button.aui-button-subtle.active {
background-image: none;
background-color: #DEEBFF;
border-color: transparent;
color: #0052CC;
text-decoration: none;
}
.aui-button.active,
.aui-button-subtle.aui-button.active {
background-image: none;
background-color: #344563;
border-color: transparent;
color: #FFFFFF;
text-decoration: none;
}
.aui-button.aui-button-split-main + .aui-button-split-more {
margin-left: 2px;
}
.aui-button.aui-button-primary,
.aui-button.aui-button-primary:visited {
background-image: none;
background-color: #0052CC;
border-color: transparent;
color: #FFFFFF;
text-decoration: none;
font-weight: 600;
}
.aui-button.aui-button-primary:hover,
.aui-button.aui-button-primary:focus {
background-color: #0065FF;
border-color: transparent;
color: #FFFFFF;
text-decoration: none;
}
.aui-button.aui-button-primary.active {
background-image: none;
background-color: #344563;
border-color: transparent;
color: #FFFFFF;
text-decoration: none;
}
.aui-button.aui-button-primary:active {
background-image: none;
background-color: #0052CC;
border-color: transparent;
color: #FFFFFF;
text-decoration: none;
}
.aui-button.aui-button-link,
.aui-button.aui-button-link:visited,
.aui-button.aui-button-text,
.aui-button.aui-button-text:visited {
background-color: transparent;
border-color: transparent;
color: #0052CC;
cursor: pointer;
text-decoration: none;
padding: 4px 0;
}
.aui-button.aui-button-link:focus,
.aui-button.aui-button-link:hover,
.aui-button.aui-button-link:active,
.aui-buttons .aui-button.aui-button-link:focus,
.aui-buttons .aui-button.aui-button-link:hover,
.aui-buttons .aui-button.aui-button-link:active,
.aui-buttons .aui-button.aui-button-link[aria-pressed="true"],
.aui-button.aui-button-text:focus,
.aui-button.aui-button-text:hover,
.aui-button.aui-button-text:active,
.aui-buttons .aui-button.aui-button-text:focus,
.aui-buttons .aui-button.aui-button-text:hover,
.aui-buttons .aui-button.aui-button-text:active,
.aui-buttons .aui-button.aui-button-text[aria-pressed="true"] {
background-color: transparent;
border-color: transparent;
}
.aui-button.aui-button-link:hover,
.aui-button.aui-button-text:hover {
color: #0065FF;
text-decoration: underline;
}
.aui-button.aui-button-link:active,
.aui-button.aui-button-text:active {
color: #0747A6;
text-decoration: none;
}
.aui-button.aui-button-text,
.aui-button.aui-button-text:visited {
border: none;
font-size: inherit;
height: inherit;
line-height: normal;
padding: 0;
}
.aui-button.aui-button-subtle {
background-color: transparent;
border-color: transparent;
color: #344563;
}
.aui-buttons .aui-button.aui-button-subtle {
border-radius: 3.01px;
}
.aui-button > .aui-icon + .aui-button-label {
margin-left: 4px;
}
.aui-button.aui-button-compact {
font-size: 12px;
height: 2.16666666666667em;
padding: 2px 8px;
line-height: 1.66666666666667;
}
.aui-buttons {
display: inline-block;
font-size: 0;
}
.aui-buttons::after {
clear: both;
content: "";
display: table;
}
.aui-buttons .aui-button {
border-radius: 0;
margin: 0;
}
.aui-buttons .aui-button:first-child {
border-top-left-radius: 3.01px;
border-bottom-left-radius: 3.01px;
}
.aui-buttons .aui-button:last-child {
border-top-right-radius: 3.01px;
border-bottom-right-radius: 3.01px;
}
.aui-buttons + .aui-buttons {
margin-left: 10px;
}
.aui-buttons .aui-button:not(.aui-button-primary):not(.aui-button-link):focus,
.aui-buttons .aui-button:not(.aui-button-primary):not(.aui-button-link):hover,
.aui-buttons .aui-button:not(.aui-button-primary):not(.aui-button-link):active {
border-color: transparent;
}
.aui-buttons .aui-button[disabled],
.aui-buttons .aui-button[disabled]:hover,
.aui-buttons .aui-button[disabled]:focus,
.aui-buttons .aui-button[disabled]:active,
.aui-buttons .aui-button[aria-disabled="true"],
.aui-buttons .aui-button[aria-disabled="true"]:hover,
.aui-buttons .aui-button[aria-disabled="true"]:focus,
.aui-buttons .aui-button[aria-disabled="true"]:active {
border-color: transparent;
}
.aui-buttons .aui-button ~ .aui-button {
border-left-width: 0;
margin-left: 2px;
}
.aui-buttons .aui-button:hover,
.aui-buttons .aui-button:focus,
.aui-buttons .aui-button:active {
position: relative;
}
.aui-buttons .aui-button:focus {
z-index: 1;
}
.aui-button[aria-pressed="true"],
.aui-buttons .aui-button[aria-pressed="true"],
.aui-buttons .aui-button[aria-pressed="true"].aui-button-primary,
.aui-buttons .aui-button[aria-pressed="true"].aui-button-subtle {
color: #FFFFFF;
background-color: #344563;
}
.aui-buttons .aui-button[aria-pressed="true"]:active {
color: #344563;
background-color: #DEEBFF;
}
.aui-button[disabled],
.aui-button[disabled]:hover,
.aui-button[disabled]:focus,
.aui-button[disabled]:active,
.aui-button[aria-disabled="true"],
.aui-button[aria-disabled="true"]:hover,
.aui-button[aria-disabled="true"]:focus,
.aui-button[aria-disabled="true"]:active,
.aui-button[aria-disabled="true"][aria-pressed] {
background-color: #F4F5F7;
border-color: transparent;
color: #A5ADBA;
cursor: default;
}
.aui-button.aui-button-subtle[disabled],
.aui-button.aui-button-subtle[aria-disabled="true"] {
border: 0;
background: none;
}
.aui-button.aui-button-primary[disabled],
.aui-button.aui-button-primary[disabled]:hover,
.aui-button.aui-button-primary[disabled]:focus,
.aui-button.aui-button-primary[disabled]:active,
.aui-button.aui-button-primary[aria-disabled="true"],
.aui-button.aui-button-primary[aria-disabled="true"]:hover,
.aui-button.aui-button-primary[aria-disabled="true"]:focus,
.aui-button.aui-button-primary[aria-disabled="true"]:active {
background-color: #F4F5F7;
border-color: transparent;
color: #A5ADBA;
cursor: default;
}
.aui-button.aui-button-link[disabled],
.aui-button.aui-button-link[disabled]:hover,
.aui-button.aui-button-link[disabled]:focus,
.aui-button.aui-button-link[disabled]:active,
.aui-button.aui-button-link[aria-disabled="true"],
.aui-button.aui-button-link[aria-disabled="true"]:hover,
.aui-button.aui-button-link[aria-disabled="true"]:focus,
.aui-button.aui-button-link[aria-disabled="true"]:active,
.aui-button.aui-button-text[disabled],
.aui-button.aui-button-text[disabled]:hover,
.aui-button.aui-button-text[disabled]:focus,
.aui-button.aui-button-text[disabled]:active,
.aui-button.aui-button-text[aria-disabled="true"],
.aui-button.aui-button-text[aria-disabled="true"]:hover,
.aui-button.aui-button-text[aria-disabled="true"]:focus,
.aui-button.aui-button-text[aria-disabled="true"]:active {
background-color: transparent;
border-color: transparent;
color: #A5ADBA;
text-decoration: none;
}
.aui-button.aui-button-compact .aui-icon {
margin-top: -1px;
}
.aui-button .aui-icon {
color: #344563;
}
.aui-button:hover .aui-icon {
color: #344563;
}
.aui-button:active .aui-icon {
color: #0052CC;
}
.aui-button.active .aui-icon {
color: #FFFFFF;
}
.aui-button.aui-button-primary .aui-icon {
color: #FFFFFF;
}
.aui-button.aui-button-link .aui-icon {
color: #0052CC;
}
.aui-button.aui-button-link:hover .aui-icon {
color: #0065FF;
}
.aui-button.aui-button-link.active .aui-icon,
.aui-button.aui-button-link:active .aui-icon {
color: #0747A6;
}
.aui-button[aria-disabled="true"] .aui-icon,
.aui-button[disabled] .aui-icon,
.aui-button[aria-disabled="true"]:hover .aui-icon,
.aui-button[disabled]:hover .aui-icon,
.aui-button[aria-disabled="true"]:active .aui-icon,
.aui-button[disabled]:active .aui-icon {
color: #A5ADBA;
}
.aui-button[busy],
.aui-button.aui-button-primary[busy] {
color: rgba(0, 0, 0, 0) !important;
}
aui-header {
display: block;
}
.aui-header {
background: #0747A6;
border-bottom: 0 solid #0747A6;
box-sizing: border-box;
color: #DEEBFF;
padding: 0 10px;
}
.aui-header:after,
.aui-header .aui-header-logo a:after {
content: "";
display: table;
clear: both;
}
.aui-header .aui-header-logo,
.aui-header .aui-nav {
margin: 0;
padding: 0;
float: left;
}
.aui-header .aui-header-secondary .aui-nav {
float: right;
}
.aui-header .aui-nav > li {
float: left;
padding: 0;
}
.aui-header a {
color: #DEEBFF;
display: block;
line-height: 1;
padding: 13px 10px;
}
.aui-header a:visited,
.aui-header a:focus,
.aui-header a:hover,
.aui-header a:active {
text-decoration: none;
}
.aui-header .aui-header-logo a {
box-sizing: border-box;
float: left;
height: 40px;
padding: 0 10px;
}
.aui-header .aui-header-logo.aui-header-logo-textonly a {
font-size: 24px;
padding: 5px 10px;
}
.aui-header .aui-header-logo-textonly .aui-header-logo-device {
float: left;
padding-top: 4px;
text-indent: 0;
}
.aui-header .aui-header-logo-textonly .aui-header-logo-device + .aui-header-logo-text {
padding: 5px 0 5px 10px;
}
/* for extra visible text, eg. instance names. */
.aui-header .aui-header-logo .aui-header-logo-text {
display: block;
float: left;
font-size: 14px;
line-height: 1.4286;
margin: 0;
padding: 10px 0 10px 10px;
}
.aui-header .aui-header-logo-device {
background-repeat: no-repeat;
background-position: 0 50%;
background-size: 100%;
display: block;
float: left;
height: 24px;
padding: 8px 0;
text-indent: -9999px;
text-align: left;
}
/* Custom IMG elements can be set in most products */
.aui-header .aui-header-logo img {
border: 0;
float: left;
max-height: 30px;
padding: 5px 0;
}
/* Positioning icons in the header */
.aui-header .aui-icon {
margin: -1px 0;
vertical-align: top;
}
.aui-header a > .aui-avatar {
vertical-align: top;
}
.aui-header a > .aui-avatar-tiny {
margin: -1px 0;
/* (16px Tiny Avatar height - 14px font size (line-height 1 in the header)) / 2 */
}
.aui-header a > .aui-avatar-small {
margin: -5px 0;
/* (24px Small Avatar height - 14px font size (line-height 1 in the header)) / 2 */
}
/*! AUI Lozenge */
.aui-lozenge {
background: #DFE1E6;
border: 1px solid #DFE1E6;
border-radius: 3px;
color: #253858;
display: inline-block;
font-size: 11px;
font-weight: bold;
line-height: 99%;
/* cross-browser compromise to make the line-height match the font-size */
margin: 0;
padding: 2px 5px;
text-align: center;
text-decoration: none;
text-transform: uppercase;
}
.aui-lozenge.aui-lozenge-subtle {
background-color: #FFFFFF;
border-color: #C1C7D0;
color: #42526E;
}
.aui-lozenge-success {
background-color: #00875A;
border-color: #00875A;
color: #FFFFFF;
}
.aui-lozenge-success.aui-lozenge-subtle {
background-color: #FFFFFF;
border-color: #ABF5D1;
color: #00875A;
}
.aui-lozenge-error {
background-color: #DE350B;
border-color: #DE350B;
color: #FFFFFF;
}
.aui-lozenge-error.aui-lozenge-subtle {
background-color: #FFFFFF;
border-color: #FFBDAD;
color: #DE350B;
}
.aui-lozenge-current {
background-color: #B3D4FF;
border-color: #B3D4FF;
color: #0052CC;
}
.aui-lozenge-current.aui-lozenge-subtle {
background-color: #FFFFFF;
border-color: #B3D4FF;
color: #0052CC;
}
.aui-lozenge-complete,
.aui-lozenge-new {
background-color: #5243AA;
border-color: #5243AA;
color: #FFFFFF;
}
.aui-lozenge-complete.aui-lozenge-subtle,
.aui-lozenge-new.aui-lozenge-subtle {
background-color: #FFFFFF;
border-color: #C0B6F2;
color: #5243AA;
}
.aui-lozenge-moved {
background-color: #FFAB00;
border-color: #FFAB00;
color: #253858;
}
.aui-lozenge-moved.aui-lozenge-subtle {
background-color: #FFFFFF;
border-color: #FFF0B3;
color: #42526E;
}
/*! AUI Navigation */
/* Nav defaults - put very little here!
-------------------- */
.aui-nav,
.aui-nav > li {
list-style: none;
margin: 0;
padding: 0;
}
/* Horizontal, breadcrumbs and pagination are all horizontal */
.aui-nav-breadcrumbs:after,
.aui-nav-pagination:after,
.aui-nav-horizontal:after,
.aui-navgroup-horizontal .aui-nav:after,
.aui-navgroup-horizontal .aui-navgroup-inner:after {
clear: both;
content: " ";
display: table;
}
.aui-nav-breadcrumbs > li,
.aui-nav-pagination > li {
float: left;
}
/* Navigation headings
-------------------- */
.aui-nav-heading {
color: #6B778C;
font-size: 11px;
font-weight: 600;
line-height: 1.45454545;
letter-spacing: 0;
text-transform: uppercase;
line-height: 1.81818182;
padding: 0 10px;
}
.aui-nav-heading > strong {
font-size: inherit;
font-weight: inherit;
line-height: inherit;
}
/* Breadcrumb navigation
-------------------- */
.aui-nav-breadcrumbs > li {
padding: 0 10px 0 0;
}
.aui-nav-breadcrumbs > li + li:before {
content: "/";
padding-right: 10px;
}
/* Pagination
-------------------- */
.aui-nav-pagination {
margin: 10px 0 0 0;
}
.aui-nav-pagination > li {
padding: 0;
}
/* Need padding on the A elements for big click areas.
Set equal left/right to help align the inline dialog on truncation. */
.aui-nav-pagination > li > a {
padding: 10px 10px 0 10px;
}
/* Don't set top/bottom as that throws non-linked items out of whack. */
.aui-nav-pagination > li.aui-nav-selected,
.aui-nav-pagination > li.aui-nav-truncation {
padding-left: 10px;
padding-right: 10px;
}
.aui-nav-pagination .aui-nav-truncation > a {
padding-left: 0;
padding-right: 0;
}
/* Remove whitespace from first and last child */
.aui-nav-pagination > li:first-child > a,
.aui-nav-pagination > li.aui-nav-truncation:first-child,
.aui-nav-pagination > li.aui-nav-selected:first-child {
padding-left: 0;
}
.aui-nav-pagination > li:last-child > a,
.aui-nav-pagination > li.aui-nav-truncation:last-child,
.aui-nav-pagination > li.aui-nav-selected:last-child {
padding-right: 0;
}
.aui-nav-pagination a[aria-disabled="true"],
.aui-nav-pagination a[aria-disabled="true"]:link,
.aui-nav-pagination a[aria-disabled="true"]:visited,
.aui-nav-pagination a[aria-disabled="true"]:focus,
.aui-nav-pagination a[aria-disabled="true"]:hover,
.aui-nav-pagination a[aria-disabled="true"]:active {
color: #97A0AF;
text-decoration: none;
}
/* "current" is deprecated in 5.1 */
.aui-nav-pagination > li.aui-nav-current,
.aui-nav-pagination > li.aui-nav-selected {
color: #172B4D;
font-weight: 600;
}
/* Vertical Navigation
-------------------- */
.aui-navgroup-vertical .aui-nav > li > a,
.aui-nav-vertical > li > a {
border-radius: 3px;
box-sizing: content-box;
display: block;
line-height: 1.14285714;
padding: 7px 10px;
background-color: transparent;
color: #42526E;
text-decoration: none;
word-wrap: break-word;
}
.aui-navgroup-vertical .aui-nav > li > a:hover,
.aui-nav-vertical > li > a:hover {
background-color: rgba(9, 30, 66, 0.08);
text-decoration: none;
}
.aui-navgroup-vertical .aui-nav > li > a:active,
.aui-nav-vertical > li > a:active {
background-color: #DEEBFF;
color: #42526E;
text-decoration: none;
}
.aui-navgroup-vertical .aui-nav > li > a:focus,
.aui-nav-vertical > li > a:focus {
text-decoration: none;
}
.aui-navgroup-vertical .aui-nav .aui-nav-selected > a,
.aui-nav-vertical .aui-nav .aui-nav-selected > a {
background-color: rgba(9, 30, 66, 0.08);
color: #42526E;
font-weight: 500;
}
.aui-navgroup-vertical .aui-nav,
.aui-navgroup-vertical .aui-nav-heading {
margin: 0;
}
.aui-navgroup-vertical .aui-nav + .aui-nav {
margin-top: 10px;
padding-top: 10px;
border-top: 1px solid #DFE1E6;
}
.aui-navgroup-vertical .aui-nav + .aui-nav-heading {
margin-top: 20px;
}
.aui-navgroup-vertical .aui-nav:first-child,
.aui-navgroup-vertical .aui-navgroup-inner > .aui-nav-heading:first-child,
.aui-navgroup-vertical .aui-navgroup-primary > .aui-nav-heading:first-child {
margin-top: 0;
padding-top: 0;
}
/* nested vertical navigation menus
----------------------------------- */
.aui-navgroup-vertical .aui-nav .aui-nav {
margin-top: 0;
padding: 0 0 0 20px;
}
.aui-navgroup-vertical .aui-nav .aui-nav > li {
position: relative;
}
.aui-navgroup-vertical .aui-nav > li[aria-expanded] {
position: relative;
}
.aui-navgroup-vertical .aui-nav > li[aria-expanded] .aui-nav-heading {
padding-left: 0;
}
.aui-navgroup-vertical .aui-nav > li[aria-expanded] .aui-nav-subtree-toggle {
box-sizing: border-box;
color: #97A0AF;
left: 0;
margin: 0;
position: absolute;
padding: 2px;
top: 5px;
width: 20px;
z-index: 1;
}
.aui-navgroup-vertical .aui-nav > li[aria-expanded] .aui-nav-subtree-toggle > .aui-icon {
display: block;
margin: 0 auto;
}
.aui-navgroup-vertical .aui-nav > li[aria-expanded] .aui-nav-subtree-toggle + .aui-nav-item {
padding-left: 30px;
}
.aui-navgroup-vertical .aui-nav > li[aria-expanded] li {
position: relative;
}
.aui-navgroup-vertical .aui-nav > li[aria-expanded][aria-expanded="false"] > * {
display: none;
}
.aui-navgroup-vertical .aui-nav > li[aria-expanded][aria-expanded="false"] > .aui-nav-subtree-toggle,
.aui-navgroup-vertical .aui-nav > li[aria-expanded][aria-expanded="false"] > .aui-nav-item {
display: inherit;
}
/* RHS actions dropdown
------------------------ */
.aui-navgroup-vertical .aui-nav .aui-nav-item-actions {
background: transparent none;
border-color: transparent;
color: #344563;
text-decoration: none;
border-radius: 2px;
display: block;
height: 16px;
margin: 0;
overflow: hidden;
padding: 0;
position: absolute;
right: 5px;
text-indent: -999em;
top: 7px;
width: 16px;
}
.aui-navgroup-vertical .aui-nav .aui-nav-item-actions::after {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0;
font-family: "Adgs Icons";
font-weight: normal;
font-style: normal;
speak: none;
content: "\f15b";
font-size: 12px;
height: 12px;
line-height: 1;
margin-top: -6px;
position: absolute;
right: 2px;
top: 50%;
text-indent: 0;
width: 12px;
content: "\f17f";
}
.aui-navgroup-vertical .aui-nav .aui-nav-item-actions:hover,
.aui-navgroup-vertical .aui-nav .aui-nav-item-actions:focus {
background-color: rgba(9, 30, 66, 0.13);
border-color: transparent;
color: #344563;
text-decoration: none;
}
.aui-navgroup-vertical .aui-nav .aui-nav-item-actions:active {
background-image: none;
background-color: #DEEBFF;
border-color: transparent;
color: #0052CC;
text-decoration: none;
}
.aui-navgroup-vertical .aui-nav .aui-nav-item-actions:active:after {
border-top-color: #172B4D;
}
.aui-navgroup-vertical .aui-nav .aui-nav-item-actions.active {
background-image: none;
background-color: #344563;
border-color: transparent;
color: #FFFFFF;
text-decoration: none;
}
.aui-navgroup-vertical .aui-nav .aui-nav-item-actions ~ .aui-nav-item-label {
margin-right: 15px;
}
/* Horizontal Navigation
-------------------- */
.aui-nav-horizontal,
.aui-navgroup-horizontal .aui-nav {
display: flex;
flex-direction: row;
}
.aui-nav-horizontal > li a,
.aui-navgroup-horizontal .aui-nav > li a {
padding-right: 10px;
}
/* Horizontal Navgroup
-------------------- */
.aui-navgroup-horizontal {
position: relative;
margin: 0;
padding: 0 10px;
/* Nav in a Navbar */
/* Horizontal navgroup + Dropdown2 integration. Note: ADG prohibits dropdowns in vertical nav. */
/* Breadcrumbs in navbar */
/* Bulletproofing - headings shouldn't be here but will at least not look heinously broken. */
}
.aui-navgroup-horizontal::after {
background: #EBECF0;
bottom: 0;
content: "";
display: block;
height: 2px;
left: 0;
position: absolute;
right: 0;
width: initial;
z-index: auto;
}
.aui-navgroup-horizontal .aui-navgroup-inner,
.aui-navgroup-horizontal .aui-navgroup-primary,
.aui-navgroup-horizontal .aui-navgroup-secondary,
.aui-navgroup-horizontal .aui-nav {
display: flex;
flex-wrap: wrap;
}
.aui-navgroup-horizontal .aui-navgroup-inner {
justify-content: space-between;
}
.aui-navgroup-horizontal .aui-navgroup-primary {
flex-grow: 1;
order: 0;
}
.aui-navgroup-horizontal .aui-navgroup-secondary {
order: 1;
}
.aui-navgroup-horizontal .aui-nav > li a {
display: block;
margin: 0;
padding: 9px 10px;
position: relative;
}
.aui-navgroup-horizontal .aui-nav > li a,
.aui-navgroup-horizontal .aui-nav > li a:link,
.aui-navgroup-horizontal .aui-nav > li a:visited {
color: #42526E;
text-decoration: none;
}
.aui-navgroup-horizontal .aui-nav > li a:focus,
.aui-navgroup-horizontal .aui-nav > li a:hover {
color: #4C9AFF;
}
.aui-navgroup-horizontal .aui-nav > li a:focus {
z-index: 1;
}
.aui-navgroup-horizontal .aui-nav > .aui-nav-selected a {
position: relative;
font-weight: 500;
}
.aui-navgroup-horizontal .aui-nav > .aui-nav-selected a::after {
background: #0052CC;
bottom: 0;
content: "";
display: block;
height: 2px;
left: 10px;
position: absolute;
right: 10px;
width: initial;
z-index: 1;
}
.aui-navgroup-horizontal .aui-nav > .aui-nav-selected a,
.aui-navgroup-horizontal .aui-nav > .aui-nav-selected a:link,
.aui-navgroup-horizontal .aui-nav > .aui-nav-selected a:visited,
.aui-navgroup-horizontal .aui-nav > .aui-nav-selected a.active {
color: #0052CC;
}
.aui-navgroup-horizontal .aui-dropdown2-trigger .aui-icon-dropdown {
display: none;
}
.aui-navgroup-horizontal .aui-dropdown2-trigger::after {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0;
font-family: "Adgs Icons";
font-weight: normal;
font-style: normal;
speak: none;
content: "\f15b";
font-size: 16px;
height: 16px;
line-height: 1;
margin-top: -8px;
position: absolute;
right: 4px;
top: 50%;
text-indent: 0;
width: 16px;
}
.aui-navgroup-horizontal .aui-nav-breadcrumbs > li,
.aui-navgroup-horizontal .aui-nav-breadcrumbs > li:before {
padding: 0;
}
.aui-navgroup-horizontal .aui-nav-breadcrumbs > li a {
display: inline-block;
}
.aui-navgroup-horizontal .aui-nav-heading {
padding: 10px 10px 0 10px;
/* 0 bottom required to unfuck IE9 */
}
.aui-nav-actions-list {
font-size: 0;
list-style: none;
margin: 10px 0 0 0;
padding: 0;
}
.aui-nav-actions-list:first-child {
margin-top: 0;
}
.aui-nav-actions-list > li {
display: inline-block;
font-size: 14px;
margin-bottom: 5px;
}
.aui-nav-actions-list > li + li::before {
content: "";
border-radius: 2px;
width: 2px;
height: 2px;
background-color: #7A869A;
display: inline-block;
vertical-align: middle;
margin-left: 10px;
margin-right: 10px;
}
/**
* GROUP/ITEM
*/
.aui-group {
display: table;
box-sizing: border-box;
border-spacing: 0;
table-layout: fixed;
width: 100%;
}
.aui-group > .aui-item {
box-sizing: border-box;
display: table-cell;
margin: 0;
vertical-align: top;
}
.aui-group > .aui-item + .aui-item {
padding-left: 20px;
}
/* defensive header allowance */
.aui-layout .aui-group > header {
display: table-caption;
}
/* .aui-group-split: two items; alignment is left, then right (splits the layout). */
.aui-group.aui-group-split > .aui-item {
text-align: right;
}
.aui-group.aui-group-split > .aui-item:first-child {
text-align: left;
}
/* .aui-group-trio: three items; alignment is left, center, right */
.aui-group.aui-group-trio > .aui-item {
text-align: left;
}
.aui-group.aui-group-trio > .aui-item + .aui-item {
text-align: center;
}
.aui-group.aui-group-trio > .aui-item + .aui-item + .aui-item {
text-align: right;
}
@media screen and (max-width: 767px) {
html.aui-responsive .aui-group > .aui-item {
display: block;
width: auto;
}
html.aui-responsive .aui-group > .aui-item + .aui-item {
padding-left: 0;
padding-top: 10px;
}
html.aui-responsive .aui-group.aui-group-split > .aui-item,
html.aui-responsive .aui-group.aui-group-trio > .aui-item,
html.aui-responsive .aui-group.aui-group-split > .aui-item + .aui-item,
html.aui-responsive .aui-group.aui-group-trio > .aui-item + .aui-item,
html.aui-responsive .aui-group.aui-group-split > .aui-item + .aui-item + .aui-item,
html.aui-responsive .aui-group.aui-group-trio > .aui-item + .aui-item + .aui-item {
text-align: left;
}
}
/**
* LINK
*/
a {
color: #0052CC;
text-decoration: none;
}
a:hover {
color: #0065FF;
text-decoration: underline;
}
a:focus,
a:active {
text-decoration: none;
}
a:active {
color: #0747A6;
}
/**
* PAGE LAYOUT
*/
.aui-header,
#footer {
clear: both;
float: left;
width: 100%;
}
#content {
box-sizing: border-box;
clear: both;
position: relative;
}
#content:before {
content: "";
clear: both;
display: table;
}
#footer .footer-body a {
color: #7A869A;
}
#footer .footer-body > ul,
#footer .footer-body > p {
margin: 10px 0 0 0;
}
#footer .footer-body > ul:first-child,
#footer .footer-body > p:first-child {
margin: 0;
}
#footer .footer-body > ul {
display: block;
font-size: 0;
list-style: none;
padding: 0;
}
#footer .footer-body > ul > li {
display: inline-block;
font-size: 12px;
line-height: 1.66666667;
padding: 0;
white-space: nowrap;
}
#footer .footer-body > ul > li + li {
margin-left: 10px;
}
#footer .footer-body > ul > li:after {
content: "\b7";
/* mid dot */
margin-left: 10px;
speak: none;
}
#footer .footer-body > ul > li:last-child:after {
display: none;
}
/**
* DEFAULT THEME SPACING
*/
#content {
margin: 0;
padding: 0;
}
/**
* PAGE DESIGN
*/
body {
background: #F4F5F7;
color: #172B4D;
}
#footer .footer-body {
color: #7A869A;
font-size: 12px;
line-height: 1.66666667;
margin: 20px 0;
padding: 0 10px 21px 10px;
min-height: 44px;
/* margin + height of image, means footer is just as high if no footer link present */
text-align: center;
}
/**
* CONTENT PANEL
*/
#content > .aui-panel {
background: #FFFFFF;
margin: 20px 0 0 0;
padding: 20px;
border-color: #DFE1E6;
border-style: solid;
border-width: 1px 0;
}
#content > .aui-page-header {
padding: 20px;
}
#content > .aui-page-header + .aui-panel {
margin-top: 0;
}
#content > .aui-page-header:first-child {
margin-top: 0;
}
.aui-panel + .aui-panel {
margin-top: 20px;
}
/*! AUI Page Panel */
.aui-page-panel {
background: #FFFFFF;
border: 1px solid #DFE1E6;
border-left-width: 0;
border-right-width: 0;
box-sizing: border-box;
clear: both;
display: block;
margin: 20px 0 0 0;
padding: 0;
position: relative;
width: 100%;
}
.aui-page-panel-inner {
border-spacing: 0;
display: table;
table-layout: fixed;
width: 100%;
}
.aui-page-panel-nav,
.aui-page-panel-content,
.aui-page-panel-item,
.aui-page-panel-sidebar {
box-sizing: border-box;
display: table-cell;
padding: 20px;
vertical-align: top;
}
.aui-page-panel-nav {
border-right: 1px solid #DFE1E6;
width: 240px;
}
.aui-navgroup ~ .aui-page-panel .aui-page-panel-nav,
.aui-sidebar ~ .aui-page-panel .aui-page-panel-nav,
.aui-page-header ~ .aui-page-panel .aui-page-panel-nav {
background: #FFFFFF;
}
.aui-page-panel .aui-page-panel-nav {
background: #F4F5F7;
}
.aui-page-panel-sidebar {
width: 35%;
}
.aui-page-panel-item {
padding: 0;
}
.aui-page-panel-nav ~ .aui-page-panel-sidebar {
width: 30%;
}
/* Page Panel Interops */
.aui-page-header + .aui-page-panel,
.aui-navbar + .aui-page-panel {
margin-top: 0;
}
.aui-navbar + .aui-page-panel {
border-top: none;
}
.aui-page-panel-nav > .aui-nav-vertical,
.aui-page-panel-nav > .aui-navgroup-vertical {
margin-left: -10px;
margin-right: -10px;
/* tree indication for nested aui-nav's.
it is expected that these are always expanded and no icons are added to the nav items. */
}
.aui-page-panel-nav > .aui-nav-vertical .aui-nav .aui-nav,
.aui-page-panel-nav > .aui-navgroup-vertical .aui-nav .aui-nav {
margin-top: 0;
padding: 0 0 0 20px;
}
.aui-page-panel-nav > .aui-nav-vertical .aui-nav .aui-nav > li,
.aui-page-panel-nav > .aui-navgroup-vertical .aui-nav .aui-nav > li {
position: relative;
}
.aui-page-panel-nav > .aui-nav-vertical .aui-nav .aui-nav > li::before,
.aui-page-panel-nav > .aui-navgroup-vertical .aui-nav .aui-nav > li::before,
.aui-page-panel-nav > .aui-nav-vertical .aui-nav .aui-nav > li::after,
.aui-page-panel-nav > .aui-navgroup-vertical .aui-nav .aui-nav > li::after {
background-color: #DFE1E6;
content: "";
left: -5px;
position: absolute;
}
.aui-page-panel-nav > .aui-nav-vertical .aui-nav .aui-nav > li::before,
.aui-page-panel-nav > .aui-navgroup-vertical .aui-nav .aui-nav > li::before {
bottom: 0;
top: 0;
width: 1px;
}
.aui-page-panel-nav > .aui-nav-vertical .aui-nav .aui-nav > li::after,
.aui-page-panel-nav > .aui-navgroup-vertical .aui-nav .aui-nav > li::after {
height: 1px;
top: 14px;
width: 5px;
}
.aui-page-panel-nav > .aui-nav-vertical .aui-nav .aui-nav > li:last-child::before,
.aui-page-panel-nav > .aui-navgroup-vertical .aui-nav .aui-nav > li:last-child::before,
.aui-page-panel-nav > .aui-nav-vertical .aui-nav .aui-nav > li.aui-nav-more::before,
.aui-page-panel-nav > .aui-navgroup-vertical .aui-nav .aui-nav > li.aui-nav-more::before {
bottom: 50%;
}
.aui-page-panel-content > .aui-navgroup-horizontal {
margin-left: -20px;
margin-right: -20px;
}
.aui-navgroup-horizontal + .aui-page-panel {
border-top: 0;
margin-top: 0;
}
.aui-page-panel-content > .aui-navgroup-horizontal:first-child {
margin-top: -20px;
}
/**
* Page variations
*/
.aui-page-focused .aui-page-header,
.aui-page-focused .aui-page-panel,
.aui-page-focused #footer .footer-body,
.aui-page-notification .aui-page-header,
.aui-page-notification .aui-page-panel,
.aui-page-notification #footer .footer-body,
.aui-page-fixed .aui-header-inner,
.aui-page-fixed .aui-page-header-inner,
.aui-page-fixed .aui-navgroup-horizontal .aui-navgroup-inner,
.aui-page-fixed .aui-page-panel-inner,
.aui-page-fixed #footer .footer-body,
.aui-page-hybrid .aui-page-header,
.aui-page-hybrid .aui-navgroup-horizontal .aui-navgroup-inner,
.aui-page-hybrid .aui-page-panel-inner,
.aui-page-hybrid #footer .footer-body {
margin-left: auto;
margin-right: auto;
width: 980px;
}
/* extra width so left edge of hoverable content aligns with left edge of content while inactive. On hover, the hover affordance does extend outside the alignment but this looks better than the other way around. */
.aui-page-fixed .aui-header-inner,
.aui-page-fixed .aui-navgroup-horizontal .aui-navgroup-inner,
.aui-page-hybrid .aui-navgroup-horizontal .aui-navgroup-inner {
width: 1000px;
}
.aui-page-focused-small .aui-page-header,
.aui-page-size-small .aui-page-header,
.aui-page-focused-small .aui-page-panel,
.aui-page-size-small .aui-page-panel,
.aui-page-focused-small #footer .footer-body,
.aui-page-size-small #footer .footer-body {
width: 400px;
}
.aui-page-focused-medium .aui-page-header,
.aui-page-size-medium .aui-page-header,
.aui-page-focused-medium .aui-page-panel,
.aui-page-size-medium .aui-page-panel,
.aui-page-focused-medium #footer .footer-body,
.aui-page-size-medium #footer .footer-body {
width: 600px;
}
.aui-page-focused-large .aui-page-header,
.aui-page-size-large .aui-page-header,
.aui-page-focused-large .aui-page-panel,
.aui-page-size-large .aui-page-panel,
.aui-page-focused-large #footer .footer-body,
.aui-page-size-large #footer .footer-body {
width: 800px;
}
.aui-page-focused-xlarge .aui-page-header,
.aui-page-size-xlarge .aui-page-header,
.aui-page-focused-xlarge .aui-page-panel,
.aui-page-size-xlarge .aui-page-panel,
.aui-page-focused-xlarge #footer .footer-body,
.aui-page-size-xlarge #footer .footer-body {
width: 980px;
}
.aui-page-focused .aui-page-panel,
.aui-page-notification .aui-page-panel {
border-radius: 3px;
border-width: 1px;
}
.aui-page-fixed .aui-page-panel-inner,
.aui-page-fixed #content > .aui-page-header {
padding-left: 0;
padding-right: 0;
}
.aui-page-fixed .aui-page-panel-nav:first-child,
.aui-page-fixed .aui-page-panel-content:first-child,
.aui-page-fixed .aui-page-panel-item:first-child,
.aui-page-fixed .aui-page-panel-sidebar:first-child,
.aui-page-hybrid .aui-page-panel-nav:first-child,
.aui-page-hybrid .aui-page-panel-content:first-child,
.aui-page-hybrid .aui-page-panel-item:first-child,
.aui-page-hybrid .aui-page-panel-sidebar:first-child {
padding-left: 0;
}
.aui-page-fixed .aui-page-panel-nav:last-child,
.aui-page-fixed .aui-page-panel-content:last-child,
.aui-page-fixed .aui-page-panel-item:last-child,
.aui-page-fixed .aui-page-panel-sidebar:last-child,
.aui-page-hybrid .aui-page-panel-nav:last-child,
.aui-page-hybrid .aui-page-panel-content:last-child,
.aui-page-hybrid .aui-page-panel-item:last-child,
.aui-page-hybrid .aui-page-panel-sidebar:last-child {
padding-right: 0;
}
/* reset to 100% inside page panel */
.aui-page-panel .aui-page-header {
width: auto;
}
.aui-page-panel .aui-page-header-inner {
width: 100%;
}
/**
* TABS AS FIRST CHILD IN CONTENT
* Explicitly sets bg to white, changes horizontal hovers to work on grey.
* Remember these extend the standard component styles.
*/
#content > .aui-tabs {
margin: 20px;
}
#content > .aui-tabs > .tabs-pane {
padding-top: 20px;
padding-bottom: 20px;
}
/**
* AUI Forms inside of a focused page
*/
.aui-page-focused .aui-page-panel-content > h2:first-child,
.aui-page-notification .aui-page-panel-content > h1:first-child {
border-bottom: 1px solid #DFE1E6;
margin-bottom: 20px;
padding-bottom: 20px;
}
.aui-page-notification .aui-page-panel {
margin-top: 50px;
}
.aui-page-notification .aui-page-panel-content {
color: #7A869A;
padding: 40px;
text-align: center;
}
.aui-page-notification .aui-page-panel-content .aui-page-notification-description {
font-size: 20px;
}
.aui-page-notification .aui-page-panel-content form.aui .text {
margin-right: 10px;
}
.aui-page-notification-details {
margin: 0 auto;
max-width: 90%;
width: 980px;
}
.aui-page-notification-details-header {
color: #7A869A;
margin: 20px auto 0;
position: relative;
text-align: center;
}
.aui-page-notification-details-header-expander {
display: flex;
align-items: center;
align-content: center;
justify-content: center;
}
.aui-page-notification-details-header-expander::before,
.aui-page-notification-details-header-expander::after {
border-top: 1px solid #DFE1E6;
content: '';
display: block;
flex: 1;
}
.aui-page-notification-details-header-expander .aui-expander-trigger {
background-color: rgba(9, 30, 66, 0.08);
display: inline-block;
padding: 10px;
position: relative;
}
.aui-page-focused .aui-page-panel-content > form.aui .buttons-container {
border-top: 1px solid #DFE1E6;
margin-top: 20px;
padding-top: 20px;
}
@media screen and (max-width: 767px) {
html.aui-responsive .aui-page-fixed #content > .aui-page-header,
html.aui-responsive .aui-page-hybrid #content > .aui-page-header,
html.aui-responsive .aui-page-fixed .aui-page-panel-inner,
html.aui-responsive .aui-page-hybrid .aui-page-panel-inner,
html.aui-responsive .aui-page-fixed .aui-header-inner,
html.aui-responsive .aui-page-hybrid .aui-header-inner,
html.aui-responsive .aui-page-fixed .aui-navgroup-horizontal .aui-navgroup-inner,
html.aui-responsive .aui-page-hybrid .aui-navgroup-horizontal .aui-navgroup-inner,
html.aui-responsive .aui-page-fixed #footer .footer-body,
html.aui-responsive .aui-page-hybrid #footer .footer-body {
box-sizing: border-box;
width: 100%;
}
html.aui-responsive .aui-page-header-inner {
display: block;
width: 100%;
}
html.aui-responsive .aui-page-header-actions {
display: block;
width: auto;
text-align: left;
margin-top: 20px;
padding-left: 0;
padding-right: 20px;
}
}
@media screen and (max-width: 800px) {
html.aui-responsive .aui-page-hybrid .aui-page-header,
html.aui-responsive .aui-page-hybrid .aui-page-panel-inner,
html.aui-responsive .aui-page-hybrid .aui-page-fixed .aui-header-inner,
html.aui-responsive .aui-page-hybrid .aui-navgroup-horizontal .aui-navgroup-inner {
box-sizing: border-box;
width: 100%;
}
}
@media screen and (max-width: 1023px) {
html.aui-responsive .aui-page-fixed #content > .aui-page-header,
html.aui-responsive .aui-page-hybrid #content > .aui-page-header,
html.aui-responsive .aui-page-fixed .aui-page-panel-inner,
html.aui-responsive .aui-page-hybrid .aui-page-panel-inner {
padding-left: 20px;
padding-right: 20px;
}
html.aui-responsive .aui-page-panel-content,
html.aui-responsive .aui-page-panel-sidebar {
display: block;
padding-left: 0;
padding-right: 0;
width: auto;
}
html.aui-responsive .aui-page-fixed .aui-header-inner,
html.aui-responsive .aui-page-fixed .aui-page-header-inner,
html.aui-responsive .aui-page-fixed .aui-page-panel-inner,
html.aui-responsive .aui-page-fixed #footer .footer-body {
box-sizing: border-box;
width: 100%;
}
}
html.aui-responsive #footer .footer-body > ul > li {
white-space: normal;
}
@media screen and (max-width: 400px) {
html.aui-responsive .aui-page-focused-small .aui-page-header,
html.aui-responsive .aui-page-focused-small .aui-page-panel {
box-sizing: border-box;
width: 100%;
}
html.aui-responsive .aui-page-focused-small .aui-page-panel {
margin-top: 0;
}
html.aui-responsive .aui-page-focused-small .aui-page-panel {
border-radius: 0;
border-left: 0;
border-right: 0;
}
}
@media screen and (max-width: 600px) {
html.aui-responsive .aui-page-focused-medium .aui-page-header,
html.aui-responsive .aui-page-focused-medium .aui-page-panel {
box-sizing: border-box;
width: 100%;
}
html.aui-responsive .aui-page-focused-medium .aui-page-panel {
margin-top: 0;
}
html.aui-responsive .aui-page-focused-medium .aui-page-panel {
border-radius: 0;
border-left: 0;
border-right: 0;
}
}
@media screen and (max-width: 800px) {
html.aui-responsive .aui-page-focused-large .aui-page-header,
html.aui-responsive .aui-page-focused-large .aui-page-panel {
box-sizing: border-box;
width: 100%;
}
html.aui-responsive .aui-page-focused-large .aui-page-panel {
margin-top: 0;
}
html.aui-responsive .aui-page-focused-large .aui-page-panel {
border-radius: 0;
border-left: 0;
border-right: 0;
}
}
@media screen and (max-width: 980px) {
html.aui-responsive .aui-page-focused-xlarge .aui-page-header,
html.aui-responsive .aui-page-focused-xlarge .aui-page-panel {
box-sizing: border-box;
width: 100%;
}
html.aui-responsive .aui-page-focused-xlarge .aui-page-panel {
margin-top: 0;
}
html.aui-responsive .aui-page-focused-xlarge .aui-page-panel {
border-radius: 0;
border-left: 0;
border-right: 0;
}
}
/**
* AUI Page Header
*/
.aui-page-header-inner {
border-spacing: 0;
box-sizing: border-box;
display: table;
table-layout: auto;
width: 100%;
}
.aui-page-header-image,
.aui-page-header-main,
.aui-page-header-actions {
box-sizing: border-box;
display: table-cell;
margin: 0;
padding: 0;
text-align: left;
vertical-align: top;
}
/* collapse the cell to fit its content */
.aui-page-header-image {
width: 1px;
white-space: nowrap;
}
.aui-page-header-main {
vertical-align: middle;
}
.aui-page-header-image + .aui-page-header-main {
padding-left: 10px;
}
.aui-page-header-actions {
padding-left: 20px;
text-align: right;
vertical-align: middle;
}
.aui-page-header-main > h1,
.aui-page-header-main > h2,
.aui-page-header-main > h3,
.aui-page-header-main > h4,
.aui-page-header-main > h5,
.aui-page-header-main > h6 {
margin: 0;
}
.aui-page-header-actio