You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@systemml.apache.org by lr...@apache.org on 2016/10/20 21:59:52 UTC
[2/4] incubator-systemml-website git commit:
[SYSTEMML-973][SYSTEMML-974][SYSTEMML-977] Refactor community members page
http://git-wip-us.apache.org/repos/asf/incubator-systemml-website/blob/90f46caf/_src/assets/css/main.css
----------------------------------------------------------------------
diff --git a/_src/assets/css/main.css b/_src/assets/css/main.css
index 409d3e8..ad0c8ae 100644
--- a/_src/assets/css/main.css
+++ b/_src/assets/css/main.css
@@ -2,11 +2,11 @@
/*! nouislider - 8.3.0 - 2016-02-14 17:37:20 */
.noUi-target, .noUi-target * {
-webkit-touch-callout: none;
+ -webkit-user-select: none;
-ms-touch-action: none;
touch-action: none;
-ms-user-select: none;
-moz-user-select: none;
- -webkit-user-select: none;
user-select: none;
box-sizing: border-box; }
@@ -457,100 +457,104 @@ table {
td, th {
padding: 0; }
-.ap-container {
+html {
+ font-size: 16px; }
+
+body {
color: #1d3649;
- font-size: 16px;
line-height: 1.68;
- font-family: Helvetica Neue for IBM,Helvetica Neue,Helvetica,Arial,Roboto,sans-serif;
+ font-family: Helvetica Neue for IBM,Helvetica Neue,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,sans-serif;
font-weight: 300; }
-.ap-container *, .ap-container :after, .ap-container :before {
+*, :after, :before {
box-sizing: border-box; }
-.ap-container .hyperlink, .ap-container a, .ap-container a:hover {
+.hyperlink, a, a:hover {
color: #a6266e;
text-decoration: none; }
-.ap-container .hyperlink strong {
+.hyperlink strong {
font-weight: 700; }
-.ap-container .hyperlink:hover {
+.hyperlink:hover {
color: #a6266e;
text-decoration: underline; }
-.ap-container .hyperlink:active {
+.hyperlink:active {
color: #db2780; }
-.ap-container .dark {
+.dark {
color: #f9f9fb; }
-.ap-container .dark a, .ap-container .dark a.hyperlink:hover {
+.dark a, .dark a.hyperlink:hover {
color: #41d6c3; }
-.ap-container h1, .ap-container h2, .ap-container h3, .ap-container h4, .ap-container h5, .ap-container h6 {
+h1, h2, h3, h4, h5, h6 {
margin: 0;
font-weight: inherit; }
-.ap-container h1 {
- font-size: 2.441em; }
+h1 {
+ font-size: 2.441rem; }
-.ap-container h2 {
- font-size: 1.563em; }
+h2 {
+ font-size: 1.563rem; }
-.ap-container h3 {
- font-size: 1.25em; }
+h3 {
+ font-size: 1.25rem; }
-.ap-container h4, .ap-container h5, .ap-container h6 {
- font-size: 1em; }
+h4, h5, h6 {
+ font-size: 1rem; }
-@media (min-width: 48.063em) {
- .ap-container h1 {
- font-size: 4.236em; }
- .ap-container h2 {
- font-size: 2.618em; }
- .ap-container h3 {
- font-size: 1.618em; } }
+@media (min-width: 51.44em) {
+ h1 {
+ font-size: 4.236rem; }
+ h2 {
+ font-size: 2.618rem; }
+ h3 {
+ font-size: 1.563rem; } }
-.ap-container p {
- font-weight: 1em; }
+p {
+ font-size: 1rem; }
-.ap-container small {
- font-size: .875em; }
+small {
+ font-size: .875rem; }
-.ap-container strong {
+strong {
font-weight: 700; }
-.ap-container em {
+em {
font-style: italic; }
-.ap-container ol, .ap-container ul {
+ol, ul {
padding-left: 1em; }
-.ap-container ul {
+ul {
list-style: disc; }
-.ap-container ol {
+ol {
list-style: decimal; }
-.ap-container ol ul, .ap-container ul ul {
+ol ul, ul ul {
list-style-type: circle;
margin-bottom: 0; }
-.ap-container img {
+img {
max-width: 100%; }
-.ap-container fieldset {
+fieldset {
border: 0;
padding: 0;
margin: 0; }
-.ap-container .alert {
+.alert {
padding: 15px 62px;
min-height: 55px;
display: block;
clear: both;
position: absolute;
left: 0;
+ -webkit-transition: all .2s ease-in-out;
+ transition: all .2s ease-in-out;
border-left: 4px solid;
background: #f9f9fb;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
@@ -558,14 +562,46 @@ td, th {
margin-top: 0;
width: 100%; }
-.ap-container .alert, .ap-container .alert__fadeOut {
+.alert .icon--error, .alert .icon--info, .alert .icon--success, .alert .icon--warning {
+ position: absolute;
+ top: 15px;
+ left: 24px; }
+
+.alert__fadeOut {
+ opacity: 0;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
-.ap-container .alert__fadeOut {
- opacity: 0; }
+.alert__close {
+ position: absolute;
+ top: 15px;
+ right: 20px;
+ background: transparent;
+ border: 0;
+ padding: 0;
+ display: block; }
+
+.alert__title {
+ font-size: 1rem;
+ font-weight: 700;
+ display: inline; }
+
+.alert__title:after {
+ content: ' \u2014 '; }
+
+.alert--success {
+ border-color: #4b8400; }
+
+.alert--warning {
+ border-color: #fdd600; }
+
+.alert--error {
+ border-color: #e71d32; }
+
+.alert--info {
+ border-color: #4178be; }
-.ap-container .alert__close {
+.alert__close {
position: absolute;
top: 15px;
right: 20px;
@@ -576,142 +612,124 @@ td, th {
width: 24px;
height: 24px; }
-.ap-container .alert__close svg {
+.alert__close svg {
width: 24px;
height: 24px;
fill: #a6266e; }
-.ap-container .alert__close:active svg {
+.alert__close:active svg {
fill: #db2780; }
-.ap-container .alert__title {
- font-size: 1em;
- font-weight: 700;
- display: inline; }
-
-.ap-container .alert__title:after {
- content: ' \u2014 '; }
-
-.ap-container .alert__icon {
+.alert__icon {
width: 24px;
height: 24px;
position: absolute;
top: 15px;
left: 24px; }
-.ap-container .alert--success {
- border-color: #4b8400; }
-
-.ap-container .alert--success .alert__icon {
+.alert--success .alert__icon {
fill: #4b8400; }
-.ap-container .alert--warning {
- border-color: #fdd600; }
-
-.ap-container .alert--warning .alert__icon {
+.alert--warning .alert__icon {
fill: #fdd600; }
-.ap-container #icon-warning_filled_24 .text {
+.alert--warning .text {
fill: #1d3649; }
-.ap-container .alert--error {
- border-color: #e71d32; }
-
-.ap-container .alert--error .alert__icon {
+.alert--error .alert__icon {
fill: #e71d32; }
-.ap-container .alert--info {
- border-color: #4178be; }
-
-.ap-container .alert--info .alert__icon {
+.alert--info .alert__icon {
fill: #4178be; }
-.ap-container .breadcrumb, .ap-container .breadcrumb--condensed {
+.breadcrumb, .breadcrumb--condensed {
display: block;
clear: both;
margin: 0 auto;
- font-size: .875em;
+ font-size: .875rem;
position: relative; }
-.ap-container .breadcrumb__container {
+.breadcrumb__container {
padding: 0; }
-.ap-container .breadcrumb__item, .ap-container .breadcrumb__item--condensed {
+.breadcrumb__item, .breadcrumb__item--condensed {
font-weight: 400;
display: inline-block;
list-style: none;
margin: 0 16px 0 0;
position: relative; }
-.ap-container .breadcrumb__item--condensed:first-child, .ap-container .breadcrumb__item:first-child {
+.breadcrumb__item--condensed:first-child, .breadcrumb__item:first-child {
padding-left: 0; }
-.ap-container .breadcrumb__divider {
+.breadcrumb__divider {
fill: #aeaeae;
margin-left: 16px; }
-.breadcrumb--dark .ap-container .breadcrumb__divider {
+.breadcrumb--dark .breadcrumb__divider {
fill: #777677; }
-.ap-container .breadcrumb__item--current {
+.breadcrumb__item--current {
font-weight: 400;
display: inline-block;
list-style: none;
margin: 0 16px 0 0;
position: relative; }
-.ap-container .breadcrumb__link, .ap-container .breadcrumb__link--condensed {
+.breadcrumb__link, .breadcrumb__link--condensed {
display: inline-block;
font-weight: 400;
cursor: pointer;
padding: 0;
border-bottom: 1px solid transparent; }
-.ap-container .breadcrumb__link--condensed svg, .ap-container .breadcrumb__link svg {
+.breadcrumb__link--condensed svg, .breadcrumb__link svg {
display: inline-block;
width: 16px;
position: relative;
top: 2px;
margin-right: 10px; }
-.ap-container .breadcrumb__link--condensed:hover, .ap-container .breadcrumb__link:hover {
+.breadcrumb__link--condensed:hover, .breadcrumb__link:hover {
text-decoration: none;
border-bottom: 1px solid #a6266e; }
-.ap-container .breadcrumb__link--condensed:active, .ap-container .breadcrumb__link:active {
+.breadcrumb__link--condensed:active, .breadcrumb__link:active {
-webkit-transition: all .1s ease-in-out;
transition: all .1s ease-in-out;
color: #db2780; }
-.ap-container .breadcrumb__link--condensed:active svg path, .ap-container .breadcrumb__link:active svg path {
+.breadcrumb__link--condensed:active svg path, .breadcrumb__link:active svg path {
fill: #db2780; }
-.ap-container .breadcrumb--dark .breadcrumb__link, .ap-container .breadcrumb--dark .breadcrumb__link--condensed {
+.breadcrumb--dark .breadcrumb__link, .breadcrumb--dark .breadcrumb__link--condensed {
color: #41d6c3; }
-.ap-container .breadcrumb--dark .breadcrumb__link--condensed:hover, .ap-container .breadcrumb--dark .breadcrumb__link:hover {
+.breadcrumb--dark .breadcrumb__link--condensed:hover, .breadcrumb--dark .breadcrumb__link:hover {
border-color: #41d6c3; }
-.ap-container .breadcrumb--dark .breadcrumb__link--condensed:active, .ap-container .breadcrumb--dark .breadcrumb__link:active {
+.breadcrumb--dark .breadcrumb__link--condensed:active, .breadcrumb--dark .breadcrumb__link:active {
color: #6eedd8;
border-color: #6eedd8; }
-.ap-container .breadcrumb--dark .breadcrumb__link--condensed svg path, .ap-container .breadcrumb--dark .breadcrumb__link svg path {
+.breadcrumb--dark .breadcrumb__link--condensed svg path, .breadcrumb--dark .breadcrumb__link svg path {
fill: #41d6c3; }
-.ap-container .breadcrumb--dark .breadcrumb__link--condensed:active svg path, .ap-container .breadcrumb--dark .breadcrumb__link:active svg path {
+.breadcrumb--dark .breadcrumb__link--condensed:active svg path, .breadcrumb--dark .breadcrumb__link:active svg path {
fill: #6eedd8; }
-.ap-container .breadcrumb--dark .breadcrumb__current {
+.breadcrumb--dark .breadcrumb__current {
color: #f9f9fb; }
-.ap-container .breadcrumb__current {
+.breadcrumb__current {
color: #1d3649; }
-.ap-container .breadcrumb__condensed--container {
+.breadcrumb__condensed--container {
position: absolute;
-webkit-transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
+ transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
+ transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24), -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
margin-top: 10px;
padding: 0;
width: auto;
@@ -722,10 +740,10 @@ td, th {
transform: translate3d(0, 12px, 0);
z-index: 6000; }
-.ap-container .breadcrumb__condensed--container .breadcrumb__divider {
+.breadcrumb__condensed--container .breadcrumb__divider {
display: none; }
-.ap-container .breadcrumb__condensed--container:after {
+.breadcrumb__condensed--container:after {
bottom: 100%;
left: 50%;
border: solid transparent;
@@ -739,16 +757,16 @@ td, th {
border-width: 10px;
margin-left: -8px; }
-.ap-container .breadcrumb__condensed--container .breadcrumb__item, .ap-container .breadcrumb__condensed--container .breadcrumb__item--condensed {
+.breadcrumb__condensed--container .breadcrumb__item, .breadcrumb__condensed--container .breadcrumb__item--condensed {
display: block;
float: none;
margin: 0;
white-space: nowrap; }
-.ap-container .breadcrumb__condensed--container .breadcrumb__item--condensed:before, .ap-container .breadcrumb__condensed--container .breadcrumb__item:before {
+.breadcrumb__condensed--container .breadcrumb__item--condensed:before, .breadcrumb__condensed--container .breadcrumb__item:before {
display: none; }
-.ap-container .breadcrumb__condensed--container .breadcrumb__link, .ap-container .breadcrumb__condensed--container .breadcrumb__link--condensed {
+.breadcrumb__condensed--container .breadcrumb__link, .breadcrumb__condensed--container .breadcrumb__link--condensed {
padding: 10px 20px;
display: block;
font-size: .75rem;
@@ -756,33 +774,33 @@ td, th {
cursor: pointer;
border: none; }
-.ap-container .breadcrumb__condensed--container .breadcrumb__link--condensed:hover, .ap-container .breadcrumb__condensed--container .breadcrumb__link:hover {
+.breadcrumb__condensed--container .breadcrumb__link--condensed:hover, .breadcrumb__condensed--container .breadcrumb__link:hover {
color: #a6266e;
background: #fff; }
-.ap-container .breadcrumb__condensed--container .breadcrumb__link--condensed:after, .ap-container .breadcrumb__condensed--container .breadcrumb__link:after {
+.breadcrumb__condensed--container .breadcrumb__link--condensed:after, .breadcrumb__condensed--container .breadcrumb__link:after {
border: 0; }
-.ap-container .breadcrumb--dark .breadcrumb__condensed--container {
+.breadcrumb--dark .breadcrumb__condensed--container {
background: #264a60; }
-.ap-container .breadcrumb--dark .breadcrumb__condensed--container:after {
+.breadcrumb--dark .breadcrumb__condensed--container:after {
border-bottom-color: #264a60; }
-.ap-container .breadcrumb--dark .breadcrumb__condensed--container .breadcrumb__link, .ap-container .breadcrumb--dark .breadcrumb__condensed--container .breadcrumb__link--condensed {
+.breadcrumb--dark .breadcrumb__condensed--container .breadcrumb__link, .breadcrumb--dark .breadcrumb__condensed--container .breadcrumb__link--condensed {
color: #f9f9fb; }
-.ap-container .breadcrumb--dark .breadcrumb__condensed--container .breadcrumb__link--condensed:hover, .ap-container .breadcrumb--dark .breadcrumb__condensed--container .breadcrumb__link:hover {
+.breadcrumb--dark .breadcrumb__condensed--container .breadcrumb__link--condensed:hover, .breadcrumb--dark .breadcrumb__condensed--container .breadcrumb__link:hover {
color: #00b4a0;
background: #152935; }
-.ap-container .breadcrumb__link--condensed.active .breadcrumb__condensed--container, .ap-container .breadcrumb__link--condensed:active .breadcrumb__condensed--container, .ap-container .breadcrumb__link--condensed:focus .breadcrumb__condensed--container, .ap-container .breadcrumb__link--condensed:hover .breadcrumb__condensed--container {
+.breadcrumb__link--condensed.active .breadcrumb__condensed--container, .breadcrumb__link--condensed:active .breadcrumb__condensed--container, .breadcrumb__link--condensed:focus .breadcrumb__condensed--container, .breadcrumb__link--condensed:hover .breadcrumb__condensed--container {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
z-index: 8000; }
-.ap-container .breadcrumb__link--condensed {
+.breadcrumb__link--condensed {
display: inline;
border: 0;
background: transparent;
@@ -793,13 +811,13 @@ td, th {
margin-left: -30px;
margin-right: -30px; }
-.ap-container .breadcrumb__link--condensed:hover {
+.breadcrumb__link--condensed:hover {
border: 0; }
-.ap-container :active, .ap-container :focus {
+:active, :focus {
outline: default; }
-.ap-container .button {
+.button {
display: inline-block;
text-decoration: none;
background-color: transparent;
@@ -811,235 +829,414 @@ td, th {
cursor: pointer;
font-weight: 500; }
-.ap-container .button .button__text {
+.button .button__text {
padding-bottom: 6px; }
-.ap-container .button:focus, .ap-container .button:hover {
+.button:focus, .button:hover {
background-color: #a6266e;
color: #f9f9fb;
cursor: pointer;
text-decoration: none; }
-.ap-container .button:focus .icon, .ap-container .button:hover .icon {
+.button:focus .icon, .button:focus .icon--16, .button:focus .icon--24, .button:hover .icon, .button:hover .icon--16, .button:hover .icon--24 {
fill: #fff; }
-.ap-container .button:active {
+.button:active {
-webkit-transition: all .1s ease-in-out;
transition: all .1s ease-in-out;
- background: #db2780;
- border-color: #db2780;
+ background: #7c1c58;
+ border-color: #7c1c58;
color: #f9f9fb; }
-.ap-container .button:active .icon {
+.button:active .icon, .button:active .icon--24 {
fill: #fff; }
-.ap-container .button .icon {
+.button .icon, .button .icon--16, .button .icon--24 {
fill: #a6266e;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
- margin: 0 .875em 0 -.25em;
+ margin: -.175em .875em -.125em -.25em;
-webkit-transform: translateY(4px);
transform: translateY(4px); }
-.ap-container .button a {
+.button a {
padding: 0;
margin: 0; }
-.ap-container .button--large {
- font-size: 1em;
- border-width: 3px;
- font-weight: 700;
- padding: .625em 1.75em;
- height: auto; }
-
-@media (min-width: 48.063em) {
- .ap-container .button--large {
- font-size: 1.1em;
- border-width: 4px; } }
-
-.ap-container .button--large .icon {
- width: 24px;
- height: 24px; }
-
-.ap-container .button--dark {
+.button--dark {
border-color: #41d6c3;
color: #41d6c3; }
-.ap-container .button--dark:focus, .ap-container .button--dark:hover {
+.button--dark:focus, .button--dark:hover {
background-color: #41d6c3;
color: #152935; }
-.ap-container .button--dark:focus .icon, .ap-container .button--dark:hover .icon {
+.button--dark:focus .icon, .button--dark:focus .icon--16, .button--dark:focus .icon--24, .button--dark:hover .icon, .button--dark:hover .icon--16, .button--dark:hover .icon--24 {
fill: #152935; }
-.ap-container .button--dark:active {
- background-color: #6eedd8;
- border-color: #6eedd8;
+.button--dark:active {
+ background-color: #00b4a0;
+ border-color: #00b4a0;
color: #152935; }
-.ap-container .button--dark:active .icon {
+.button--dark:active .icon, .button--dark:active .icon--16, .button--dark:active .icon--24 {
fill: #152935; }
-.ap-container .button--dark .icon {
+.button--dark .icon, .button--dark .icon--16, .button--dark .icon--24 {
+ fill: #41d6c3; }
+
+.button--focus, .button--focus.button--dark {
+ background: #4178be;
+ border-color: #4178be;
+ color: #fff; }
+
+.button--focus.button--dark .icon, .button--focus.button--dark .icon--16, .button--focus.button--dark .icon--24, .button--focus .icon, .button--focus .icon--16, .button--focus .icon--24 {
+ fill: #fff; }
+
+.button--focus.button--dark:focus, .button--focus.button--dark:hover, .button--focus:focus, .button--focus:hover {
+ background: #5596e6;
+ border-color: #5596e6; }
+
+.button--focus.button--dark:active, .button--focus:active {
+ background: #4178be;
+ border-color: #4178be;
+ color: #fff; }
+
+.button--focus.button--disabled {
+ background: #aeaeae;
+ color: #fff; }
+
+.button--focus.button--dark.button--disabled {
+ background: #777677;
+ color: #fff; }
+
+.button--compact {
+ font-size: .875rem;
+ padding: .175em 1em; }
+
+.button--compact .icon, .button--compact .icon--16 {
+ margin: 0 .875em .1em -.125em; }
+
+.button--icon, .button--secondary {
+ border-color: transparent;
+ background: transparent;
+ color: #a6266e; }
+
+.button--icon:active .icon, .button--icon:active .icon--16, .button--icon:active .icon--24, .button--icon:focus .icon, .button--icon:focus .icon--16, .button--icon:focus .icon--24, .button--icon:hover .icon, .button--icon:hover .icon--16, .button--icon:hover .icon--24, .button--secondary:active .icon, .button--secondary:active .icon--16, .button--secondary:active .icon--24, .button--secondary:focus .icon, .button--secondary:focus .icon--16, .button--secondary:focus .icon--24, .button--secondary:hover .icon, .button--secondary:hover .icon--16, .button--secondary:hover .icon--24 {
+ fill: #a6266e; }
+
+.button--icon:focus, .button--icon:hover, .button--secondary:focus, .button--secondary:hover {
+ border-color: transparent;
+ background: rgba(224, 224, 224, 0.2);
+ color: #a6266e; }
+
+.button--icon:active, .button--secondary:active {
+ border-color: transparent;
+ background: rgba(224, 224, 224, 0.5);
+ color: #a6266e; }
+
+.button--icon.button--disabled, .button--secondary.button--disabled {
+ border-color: transparent;
+ background: transparent; }
+
+.button--icon.button--disabled:active .icon, .button--icon.button--disabled:active .icon--16, .button--icon.button--disabled:active .icon--24, .button--icon.button--disabled:focus .icon, .button--icon.button--disabled:focus .icon--16, .button--icon.button--disabled:focus .icon--24, .button--icon.button--disabled:hover .icon, .button--icon.button--disabled:hover .icon--16, .button--icon.button--disabled:hover .icon--24, .button--secondary.button--disabled:active .icon, .button--secondary.button--disabled:active .icon--16, .button--secondary.button--disabled:active .icon--24, .button--secondary.button--disabled:focus .icon, .button--secondary.button--disabled:focus .icon--16, .button--secondary.button--disabled:focus .icon--24, .button--secondary.button--disabled:hover .icon, .button--secondary.button--disabled:hover .icon--16, .button--secondary.button--disabled:hover .icon--24 {
+ fill: #a6266e; }
+
+.button--icon.button--dark, .button--secondary.button--dark {
+ color: #41d6c3; }
+
+.button--icon.button--dark:active .icon, .button--icon.button--dark:active .icon--16, .button--icon.button--dark:active .icon--24, .button--icon.button--dark:focus .icon, .button--icon.button--dark:focus .icon--16, .button--icon.button--dark:focus .icon--24, .button--icon.button--dark:hover .icon, .button--icon.button--dark:hover .icon--16, .button--icon.button--dark:hover .icon--24, .button--secondary.button--dark:active .icon, .button--secondary.button--dark:active .icon--16, .button--secondary.button--dark:active .icon--24, .button--secondary.button--dark:focus .icon, .button--secondary.button--dark:focus .icon--16, .button--secondary.button--dark:focus .icon--24, .button--secondary.button--dark:hover .icon, .button--secondary.button--dark:hover .icon--16, .button--secondary.button--dark:hover .icon--24 {
fill: #41d6c3; }
-.ap-container .button--disabled {
+.button--icon.button--dark:focus, .button--icon.button--dark:hover, .button--secondary.button--dark:focus, .button--secondary.button--dark:hover {
+ background: rgba(21, 41, 53, 0.4); }
+
+.button--icon.button--dark:active, .button--secondary.button--dark:active {
+ background: rgba(21, 41, 53, 0.7); }
+
+.button--icon {
+ padding-right: 12px;
+ padding-left: 12px; }
+
+.button--icon .icon, .button--icon .icon--16, .button--icon .icon--24 {
+ margin-left: 0;
+ margin-right: 0; }
+
+.button--icon.button--compact {
+ padding-right: 6px;
+ padding-left: 6px; }
+
+.button--disabled {
color: #aeaeae;
border: 2px solid #aeaeae;
- cursor: initial;
+ cursor: auto;
pointer-events: none; }
-.ap-container .button--disabled:active, .ap-container .button--disabled:focus, .ap-container .button--disabled:hover {
+.button--disabled:active, .button--disabled:focus, .button--disabled:hover {
border: 2px solid #aeaeae;
background-color: transparent;
color: #aeaeae; }
-.ap-container .button--disabled:active .button__text, .ap-container .button--disabled:focus .button__text, .ap-container .button--disabled:hover .button__text {
+.button--disabled:active .button__text, .button--disabled:focus .button__text, .button--disabled:hover .button__text {
text-decoration: none; }
-.ap-container .button--disabled .icon, .ap-container .button--disabled:hover .icon {
+.button--disabled .icon, .button--disabled .icon--16, .button--disabled .icon--24, .button--disabled:hover .icon, .button--disabled:hover .icon--16, .button--disabled:hover .icon--24 {
fill: #aeaeae; }
-.ap-container .button--dark.button--disabled {
+.button--dark.button--disabled {
border-color: #777677;
color: #777677; }
-.ap-container .button--dark.button--disabled .icon {
+.button--dark.button--disabled .icon, .button--dark.button--disabled .icon--16, .button--dark.button--disabled .icon--24 {
fill: #777677; }
-.ap-container .button--hyperlink {
+.button--dark:hover .icon--plus polygon {
+ fill: #1d3649; }
+
+.button--dark:hover .icon--plus circle {
+ fill: #41d6c3; }
+
+.button--dark:active .icon--plus polygon {
+ fill: #1d3649; }
+
+.button--dark:active .icon--plus circle {
+ fill: #00b4a0; }
+
+.button--large {
+ font-size: 1rem;
+ border-width: 3px;
+ font-weight: 700;
+ padding: .625em 1.75em;
+ height: auto; }
+
+@media (min-width: 51.44em) {
+ .button--large {
+ font-size: 1.125rem;
+ border-width: 4px; } }
+
+.button--large .icon {
+ width: 24px;
+ height: 24px; }
+
+.button--hyperlink {
border: none; }
-.ap-container .button--hyperlink:focus, .ap-container .button--hyperlink:hover {
+.button--hyperlink:focus, .button--hyperlink:hover {
background: transparent;
color: #a6266e; }
-.ap-container .button--hyperlink:focus .button__text, .ap-container .button--hyperlink:hover .button__text {
+.button--hyperlink:focus .button__text, .button--hyperlink:hover .button__text {
border-bottom: 1px solid #a6266e; }
-.ap-container .button--hyperlink:focus .icon, .ap-container .button--hyperlink:hover .icon {
+.button--hyperlink:focus .icon, .button--hyperlink:focus .icon--24, .button--hyperlink:hover .icon, .button--hyperlink:hover .icon--24 {
fill: #a6266e; }
-.ap-container .button--hyperlink:active {
- color: #db2780;
+.button--hyperlink:active {
+ color: #7c1c58;
background: transparent; }
-.ap-container .button--hyperlink:active .button__text {
- border-color: #db2780; }
+.button--hyperlink:active .button__text {
+ border-color: #7c1c58; }
-.ap-container .button--hyperlink:active .icon {
- fill: #db2780; }
+.button--hyperlink:active .icon, .button--hyperlink:active .icon--24 {
+ fill: #7c1c58; }
-.ap-container .button--hyperlink .icon {
+.button--hyperlink .icon, .button--hyperlink .icon--24 {
margin-right: .688em; }
-.ap-container .button--hyperlink.button--disabled:focus {
+.button--hyperlink .icon--plus circle {
+ fill: transparent;
+ -webkit-transition: all .2s ease-in-out;
+ transition: all .2s ease-in-out; }
+
+.button--hyperlink:hover .icon--plus polygon {
+ fill: #f9f9fb;
+ -webkit-transition: all .1s ease-in-out;
+ transition: all .1s ease-in-out; }
+
+.button--hyperlink:hover .icon--plus circle {
+ fill: #a6266e;
+ -webkit-transition: all .2s ease-in-out;
+ transition: all .2s ease-in-out; }
+
+.button--hyperlink:active .icon--plus polygon {
+ fill: #f9f9fb;
+ -webkit-transition: all .1s ease-in-out;
+ transition: all .1s ease-in-out; }
+
+.button--hyperlink:active .icon--plus circle {
+ fill: #7c1c58;
+ -webkit-transition: all .2s ease-in-out;
+ transition: all .2s ease-in-out; }
+
+.button--hyperlink.button--disabled:focus {
color: #aeaeae;
border: 0; }
-.ap-container .button--hyperlink.button--dark:focus, .ap-container .button--hyperlink.button--dark:hover {
+.button--hyperlink.button--dark:focus, .button--hyperlink.button--dark:hover {
color: #41d6c3; }
-.ap-container .button--hyperlink.button--dark:focus .button__text, .ap-container .button--hyperlink.button--dark:hover .button__text {
+.button--hyperlink.button--dark:focus .button__text, .button--hyperlink.button--dark:hover .button__text {
border-bottom: 1px solid #41d6c3; }
-.ap-container .button--hyperlink.button--dark:focus .icon, .ap-container .button--hyperlink.button--dark:hover .icon {
+.button--hyperlink.button--dark:focus .icon, .button--hyperlink.button--dark:focus .icon--24, .button--hyperlink.button--dark:hover .icon, .button--hyperlink.button--dark:hover .icon--24 {
fill: #41d6c3; }
-.ap-container .button--hyperlink.button--dark:active {
- color: #6eedd8; }
+.button--hyperlink.button--dark:active {
+ color: #00b4a0; }
-.ap-container .button--hyperlink.button--dark:active .button__text {
- border-color: #6eedd8; }
+.button--hyperlink.button--dark:active .button__text {
+ border-color: #00b4a0; }
-.ap-container .button--hyperlink.button--dark:active .icon {
- fill: #6eedd8; }
+.button--hyperlink.button--dark:active .icon, .button--hyperlink.button--dark:active .icon--24 {
+ fill: #00b4a0; }
-.ap-container .button--hyperlink.button--disabled.button--dark:focus {
+.button--hyperlink.button--disabled.button--dark:focus {
color: #777677; }
-.ap-container .button--back {
+.button--hyperlink.button--dark:hover .icon--plus polygon {
+ fill: #1d3649;
+ -webkit-transition: all .1s ease-in-out;
+ transition: all .1s ease-in-out; }
+
+.button--hyperlink.button--dark:hover .icon--plus circle {
+ fill: #41d6c3; }
+
+.button--hyperlink.button--dark:active .icon--plus polygon {
+ fill: #1d3649; }
+
+.button--hyperlink.button--dark:active .icon--plus circle {
+ fill: #00b4a0;
+ -webkit-transition: all .2s ease-in-out;
+ transition: all .2s ease-in-out; }
+
+.button--hyperlink .plus__icon circle {
+ fill: transparent;
+ -webkit-transition: all .2s ease-in-out;
+ transition: all .2s ease-in-out; }
+
+.button--hyperlink:hover .plus__icon polygon {
+ fill: #f9f9fb;
+ -webkit-transition: all .1s ease-in-out;
+ transition: all .1s ease-in-out; }
+
+.button--hyperlink:hover .plus__icon circle {
+ fill: #a6266e;
+ -webkit-transition: all .2s ease-in-out;
+ transition: all .2s ease-in-out; }
+
+.button--hyperlink:active .plus__icon polygon {
+ fill: #f9f9fb;
+ -webkit-transition: all .1s ease-in-out;
+ transition: all .1s ease-in-out; }
+
+.button--hyperlink:active .plus__icon circle {
+ fill: #7c1c58;
+ -webkit-transition: all .2s ease-in-out;
+ transition: all .2s ease-in-out; }
+
+.button--dark:hover .plus__icon polygon {
+ fill: #1d3649; }
+
+.button--dark:hover .plus__icon circle {
+ fill: #41d6c3; }
+
+.button--dark:active .plus__icon polygon {
+ fill: #1d3649; }
+
+.button--dark:active .plus__icon circle {
+ fill: #00b4a0; }
+
+.button--back {
color: #1d3649;
font-weight: 400;
padding: 0; }
-.ap-container .button--back:focus, .ap-container .button--back:hover {
+.button--back:focus, .button--back:hover {
background: transparent;
color: #a6266e; }
-.ap-container .button--back:focus .icon circle, .ap-container .button--back:focus .icon path, .ap-container .button--back:hover .icon circle, .ap-container .button--back:hover .icon path {
+.button--back:focus .icon--back circle, .button--back:focus .icon--back path, .button--back:focus .icon circle, .button--back:focus .icon path, .button--back:hover .icon--back circle, .button--back:hover .icon--back path, .button--back:hover .icon circle, .button--back:hover .icon path {
fill: #a6266e;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
-.ap-container .button--back:focus .icon polygon, .ap-container .button--back:hover .icon polygon {
+.button--back:focus .icon--back polygon, .button--back:focus .icon polygon, .button--back:hover .icon--back polygon, .button--back:hover .icon polygon {
fill: #fff;
-webkit-transition: all .1s ease-in-out;
transition: all .1s ease-in-out; }
-.ap-container .button--back:active {
- color: #db2780;
+.button--back:active {
+ color: #7c1c58;
background: transparent; }
-.ap-container .button--back:active .icon circle, .ap-container .button--back:active .icon path {
- fill: #db2780;
+.button--back:active .icon--back circle, .button--back:active .icon--back path, .button--back:active .icon circle, .button--back:active .icon path {
+ fill: #7c1c58;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
-.ap-container .button--back:active .icon polygon {
+.button--back:active .icon--back polygon, .button--back:active .icon polygon {
fill: #fff;
-webkit-transition: all .1s ease-in-out;
transition: all .1s ease-in-out; }
-.ap-container .button--back .icon {
- margin-right: 6px;
- top: 3px; }
+.button--back .icon, .button--back .icon--back {
+ margin-right: 9px;
+ margin-left: 0; }
+
+.button--back .icon--back path, .button--back .icon--back polygon {
+ fill: #a6266e; }
-.ap-container .button--back.button--large {
- font-size: 1.563em;
+.button--back.button--large {
+ font-size: 1.563rem;
font-weight: 300; }
-.ap-container .button--back.button--dark {
+.button--back.button--large .icon--back {
+ margin-right: 6px;
+ position: relative;
+ top: 6px; }
+
+.button--back.button--dark {
color: #f9f9fb; }
-.ap-container .button--back.button--dark .icon {
+.button--back.button--dark .icon, .button--back.button--dark .icon--back, .button--back.button--dark .icon--back path, .button--back.button--dark .icon--back polygon, .button--back.button--dark .icon path, .button--back.button--dark .icon polygon {
fill: #41d6c3; }
-.ap-container .button--back.button--dark:focus, .ap-container .button--back.button--dark:focus .icon, .ap-container .button--back.button--dark:hover, .ap-container .button--back.button--dark:hover .icon {
+.button--back.button--dark:focus, .button--back.button--dark:focus .icon, .button--back.button--dark:focus .icon--back, .button--back.button--dark:hover, .button--back.button--dark:hover .icon, .button--back.button--dark:hover .icon--back {
color: #41d6c3; }
-.ap-container .button--back.button--dark:focus .icon circle, .ap-container .button--back.button--dark:focus .icon path, .ap-container .button--back.button--dark:hover .icon circle, .ap-container .button--back.button--dark:hover .icon path {
+.button--back.button--dark:focus .icon--back circle, .button--back.button--dark:focus .icon--back path, .button--back.button--dark:focus .icon circle, .button--back.button--dark:focus .icon path, .button--back.button--dark:hover .icon--back circle, .button--back.button--dark:hover .icon--back path, .button--back.button--dark:hover .icon circle, .button--back.button--dark:hover .icon path {
fill: #41d6c3; }
-.ap-container .button--back.button--dark:focus .icon polygon, .ap-container .button--back.button--dark:hover .icon polygon {
+.button--back.button--dark:focus .icon--back polygon, .button--back.button--dark:focus .icon polygon, .button--back.button--dark:hover .icon--back polygon, .button--back.button--dark:hover .icon polygon {
fill: #1d3649; }
-.ap-container .button--back.button--dark:active, .ap-container .button--back.button--dark:active .icon {
- color: #6eedd8; }
+.button--back.button--dark:active, .button--back.button--dark:active .icon, .button--back.button--dark:active .icon--back {
+ color: #00b4a0; }
-.ap-container .button--back.button--dark:active .icon circle, .ap-container .button--back.button--dark:active .icon path {
- fill: #6eedd8;
+.button--back.button--dark:active .icon--back circle, .button--back.button--dark:active .icon--back path, .button--back.button--dark:active .icon circle, .button--back.button--dark:active .icon path {
+ fill: #00b4a0;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
-.ap-container .button--back.button--dark:active .icon polygon {
+.button--back.button--dark:active .icon--back polygon, .button--back.button--dark:active .icon polygon {
fill: #1d3649;
-webkit-transition: all .1s ease-in-out;
transition: all .1s ease-in-out; }
-.ap-container .checkbox--base, .ap-container .checkbox--dark, .ap-container .checkbox--dark--indeterminate, .ap-container .checkbox--dark[type=checkbox][disabled], .ap-container .checkbox--light, .ap-container .checkbox--light--indeterminate, .ap-container .checkbox--light[type=checkbox][disabled] {
+.checkbox--base, .checkbox--dark, .checkbox--dark--indeterminate, .checkbox--dark[type=checkbox][disabled], .checkbox--light, .checkbox--light--indeterminate, .checkbox--light[type=checkbox][disabled] {
position: absolute;
opacity: 0;
background: transparent; }
-.ap-container .checkbox--base + label, .ap-container .checkbox--dark + label, .ap-container .checkbox--dark--indeterminate + label, .ap-container .checkbox--dark[type=checkbox][disabled] + label, .ap-container .checkbox--light + label, .ap-container .checkbox--light--indeterminate + label, .ap-container .checkbox--light[type=checkbox][disabled] + label {
+.checkbox--base + label, .checkbox--dark + label, .checkbox--dark--indeterminate + label, .checkbox--dark[type=checkbox][disabled] + label, .checkbox--light + label, .checkbox--light--indeterminate + label, .checkbox--light[type=checkbox][disabled] + label {
position: relative;
padding-left: 31px;
cursor: pointer;
color: #152935;
display: inline-block; }
-.ap-container .checkbox--base + label:before, .ap-container .checkbox--dark + label:before, .ap-container .checkbox--dark--indeterminate + label:before, .ap-container .checkbox--dark[type=checkbox][disabled] + label:before, .ap-container .checkbox--light + label:before, .ap-container .checkbox--light--indeterminate + label:before, .ap-container .checkbox--light[type=checkbox][disabled] + label:before {
+.checkbox--base + label:before, .checkbox--dark + label:before, .checkbox--dark--indeterminate + label:before, .checkbox--dark[type=checkbox][disabled] + label:before, .checkbox--light + label:before, .checkbox--light--indeterminate + label:before, .checkbox--light[type=checkbox][disabled] + label:before {
content: '';
position: absolute;
left: 0;
@@ -1050,19 +1247,19 @@ td, th {
background: transparent;
border-radius: 0; }
-.ap-container .checkbox--base + label:hover:before, .ap-container .checkbox--dark + label:hover:before, .ap-container .checkbox--dark--indeterminate + label:hover:before, .ap-container .checkbox--dark[type=checkbox][disabled] + label:hover:before, .ap-container .checkbox--light + label:hover:before, .ap-container .checkbox--light--indeterminate + label:hover:before, .ap-container .checkbox--light[type=checkbox][disabled] + label:hover:before {
+.checkbox--base + label:hover:before, .checkbox--dark + label:hover:before, .checkbox--dark--indeterminate + label:hover:before, .checkbox--dark[type=checkbox][disabled] + label:hover:before, .checkbox--light + label:hover:before, .checkbox--light--indeterminate + label:hover:before, .checkbox--light[type=checkbox][disabled] + label:hover:before {
background: #e0e0e0; }
-.ap-container .checkbox--base:checked + label:b:efore, .ap-container .checkbox--dark--indeterminate:checked + label:b:efore, .ap-container .checkbox--dark:checked + label:b:efore, .ap-container .checkbox--light--indeterminate:checked + label:b:efore, .ap-container .checkbox--light:checked + label:b:efore {
+.checkbox--base:checked + label:before, .checkbox--dark--indeterminate:checked + label:before, .checkbox--dark:checked + label:before, .checkbox--dark[type=checkbox][disabled]:checked + label:before, .checkbox--light--indeterminate:checked + label:before, .checkbox--light:checked + label:before, .checkbox--light[type=checkbox][disabled]:checked + label:before {
background: #a6266e;
border: 0 solid #1d3649;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
-.ap-container .checkbox--base:checked + label:hover:before, .ap-container .checkbox--dark--indeterminate:checked + label:hover:before, .ap-container .checkbox--dark:checked + label:hover:before, .ap-container .checkbox--light--indeterminate:checked + label:hover:before, .ap-container .checkbox--light:checked + label:hover:before {
+.checkbox--base:checked + label:hover:before, .checkbox--dark--indeterminate:checked + label:hover:before, .checkbox--dark:checked + label:hover:before, .checkbox--light--indeterminate:checked + label:hover:before, .checkbox--light:checked + label:hover:before {
background: #db2780; }
-.ap-container .checkbox--base + label:after, .ap-container .checkbox--dark + label:after, .ap-container .checkbox--dark--indeterminate + label:after, .ap-container .checkbox--dark[type=checkbox][disabled] + label:after, .ap-container .checkbox--light + label:after, .ap-container .checkbox--light--indeterminate + label:after, .ap-container .checkbox--light[type=checkbox][disabled] + label:after {
+.checkbox--base + label:after, .checkbox--dark + label:after, .checkbox--dark--indeterminate + label:after, .checkbox--dark[type=checkbox][disabled] + label:after, .checkbox--light + label:after, .checkbox--light--indeterminate + label:after, .checkbox--light[type=checkbox][disabled] + label:after {
content: '';
width: 8px;
height: 5px;
@@ -1077,138 +1274,154 @@ td, th {
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
-.ap-container .checkbox--base:checked + label:after, .ap-container .checkbox--dark--indeterminate:checked + label:after, .ap-container .checkbox--dark:checked + label:after, .ap-container .checkbox--dark[type=checkbox][disabled]:checked + label:after, .ap-container .checkbox--light--indeterminate:checked + label:after, .ap-container .checkbox--light:checked + label:after, .ap-container .checkbox--light[type=checkbox][disabled]:checked + label:after {
+.checkbox--base:checked + label:after, .checkbox--dark--indeterminate:checked + label:after, .checkbox--dark:checked + label:after, .checkbox--dark[type=checkbox][disabled]:checked + label:after, .checkbox--light--indeterminate:checked + label:after, .checkbox--light:checked + label:after, .checkbox--light[type=checkbox][disabled]:checked + label:after {
opacity: 1;
-webkit-transform: scale(1) rotate(-45deg);
transform: scale(1) rotate(-45deg); }
-.ap-container .checkbox--base:not(:checked) + label:after, .ap-container .checkbox--dark--indeterminate:not(:checked) + label:after, .ap-container .checkbox--dark:not(:checked) + label:after, .ap-container .checkbox--dark[type=checkbox][disabled]:not(:checked) + label:after, .ap-container .checkbox--light--indeterminate:not(:checked) + label:after, .ap-container .checkbox--light:not(:checked) + label:after, .ap-container .checkbox--light[type=checkbox][disabled]:not(:checked) + label:after {
+.checkbox--base:not(:checked) + label:after, .checkbox--dark--indeterminate:not(:checked) + label:after, .checkbox--dark:not(:checked) + label:after, .checkbox--dark[type=checkbox][disabled]:not(:checked) + label:after, .checkbox--light--indeterminate:not(:checked) + label:after, .checkbox--light:not(:checked) + label:after, .checkbox--light[type=checkbox][disabled]:not(:checked) + label:after {
opacity: 0;
-webkit-transform: scale(0) rotate(-45deg);
transform: scale(0) rotate(-45deg); }
-.ap-container .checkbox--base:focus + label:before, .ap-container .checkbox--dark--indeterminate:focus + label:before, .ap-container .checkbox--dark:focus + label:before, .ap-container .checkbox--dark[type=checkbox][disabled]:focus + label:before, .ap-container .checkbox--light--indeterminate:focus + label:before, .ap-container .checkbox--light:focus + label:before, .ap-container .checkbox--light[type=checkbox][disabled]:focus + label:before {
+.checkbox--base:focus + label:before, .checkbox--dark--indeterminate:focus + label:before, .checkbox--dark:focus + label:before, .checkbox--dark[type=checkbox][disabled]:focus + label:before, .checkbox--light--indeterminate:focus + label:before, .checkbox--light:focus + label:before, .checkbox--light[type=checkbox][disabled]:focus + label:before {
outline-color: rgba(77, 144, 254, 0.5);
outline-offset: -2px;
outline-style: auto;
outline-width: 5px; }
-.ap-container _::-moz-range-track, .ap-container body:last-child .checkbox--base:focus + label:before, .ap-container body:last-child .checkbox--dark--indeterminate:focus + label:before, .ap-container body:last-child .checkbox--dark:focus + label:before, .ap-container body:last-child .checkbox--light--indeterminate:focus + label:before, .ap-container body:last-child .checkbox--light:focus + label:before {
+_::-moz-range-track, body:last-child .checkbox--base:focus + label:before, body:last-child .checkbox--dark--indeterminate:focus + label:before, body:last-child .checkbox--dark:focus + label:before, body:last-child .checkbox--light--indeterminate:focus + label:before, body:last-child .checkbox--light:focus + label:before {
outline-style: solid;
-moz-outline-radius: 2px;
outline-width: 4px;
outline-color: rgba(77, 144, 254, 0.5); }
-.ap-container .checkbox--light--indeterminate + label:after {
+.checkbox--light--indeterminate + label:after {
border-left: 0 solid #f9f9fb;
border-bottom: 2px solid #f9f9fb; }
-.ap-container .checkbox--light--indeterminate:checked + label:after {
+.checkbox--light--indeterminate:checked + label:after {
-webkit-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg); }
-.ap-container .checkbox--light--indeterminate:not(:checked) + label:after {
+.checkbox--light--indeterminate:not(:checked) + label:after {
-webkit-transform: scale(0) rotate(0deg);
transform: scale(0) rotate(0deg); }
-.ap-container [type=checkbox][disabled].checkbox--light + label {
+[type=checkbox][disabled].checkbox--light + label {
color: #aeaeae; }
-.ap-container [type=checkbox][disabled].checkbox--light + label:before {
+[type=checkbox][disabled].checkbox--light + label:before {
border: 1px solid #aeaeae; }
-.ap-container [type=checkbox][disabled].checkbox--light:checked + label:before {
+[type=checkbox][disabled].checkbox--light:checked + label:before {
background: #aeaeae; }
-.ap-container .checkbox--dark + label, .ap-container .checkbox--dark[type=checkbox][disabled] + label {
+.checkbox--dark + label, .checkbox--dark[type=checkbox][disabled] + label {
color: #fff; }
-.ap-container .checkbox--dark + label:before, .ap-container .checkbox--dark[type=checkbox][disabled] + label:before {
+.checkbox--dark + label:before, .checkbox--dark[type=checkbox][disabled] + label:before {
border: 1px solid #f9f9fb; }
-.ap-container .checkbox--dark + label:hover:before, .ap-container .checkbox--dark[type=checkbox][disabled] + label:hover:before {
+.checkbox--dark + label:hover:before, .checkbox--dark[type=checkbox][disabled] + label:hover:before {
background: rgba(255, 255, 255, 0.25); }
-.ap-container .checkbox--dark:checked + label:before, .ap-container .checkbox--dark[type=checkbox][disabled]:checked + label:before {
+.checkbox--dark:checked + label:before, .checkbox--dark[type=checkbox][disabled]:checked + label:before {
background: #41d6c3; }
-.ap-container .checkbox--dark:checked + label:hover:before {
+.checkbox--dark:checked + label:hover:before {
background-color: #6eedd8; }
-.ap-container .checkbox--dark + label:after, .ap-container .checkbox--dark[type=checkbox][disabled] + label:after {
+.checkbox--dark + label:after, .checkbox--dark[type=checkbox][disabled] + label:after {
border-color: #152935; }
-.ap-container .checkbox--dark--indeterminate + label {
+.checkbox--dark--indeterminate + label {
color: #fff; }
-.ap-container .checkbox--dark--indeterminate + label:before {
+.checkbox--dark--indeterminate + label:before {
border: 1px solid #f9f9fb; }
-.ap-container .checkbox--dark--indeterminate + label:hover:before {
+.checkbox--dark--indeterminate + label:hover:before {
background: rgba(255, 255, 255, 0.25); }
-.ap-container .checkbox--dark--indeterminate:checked + label:before {
+.checkbox--dark--indeterminate:checked + label:before {
background: #41d6c3; }
-.ap-container .checkbox--dark--indeterminate:checked + label:hover:before {
+.checkbox--dark--indeterminate:checked + label:hover:before {
background-color: #6eedd8; }
-.ap-container .checkbox--dark--indeterminate + label:after {
+.checkbox--dark--indeterminate + label:after {
border-left: 0 solid #152935;
border-bottom: 2px solid #152935; }
-.ap-container .checkbox--dark--indeterminate:checked + label:after {
+.checkbox--dark--indeterminate:checked + label:after {
-webkit-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg); }
-.ap-container .checkbox--dark--indeterminate:not(:checked) + label:after {
+.checkbox--dark--indeterminate:not(:checked) + label:after {
-webkit-transform: scale(0) rotate(0deg);
transform: scale(0) rotate(0deg); }
-.ap-container [type=checkbox][disabled].checkbox--dark + label {
+[type=checkbox][disabled].checkbox--dark + label {
color: #777677; }
-.ap-container [type=checkbox][disabled].checkbox--dark + label:before {
+[type=checkbox][disabled].checkbox--dark + label:before {
border: 1px solid #777677; }
-.ap-container [type=checkbox][disabled].checkbox--dark:checked + label:before {
+[type=checkbox][disabled].checkbox--dark:checked + label:before {
background: #777677; }
-.ap-container .icon {
- width: 20px;
- height: 20px; }
+.icon--16 {
+ width: 16px;
+ height: 16px; }
+
+.icon--24 {
+ width: 24px;
+ height: 24px; }
+
+.icon--32 {
+ width: 32px;
+ height: 32px; }
+
+.icon--64 {
+ width: 24px;
+ height: 24px; }
+
+.icon--128 {
+ width: 128px;
+ height: 128px; }
-.ap-container .icon__close {
+.icon--close {
cursor: pointer;
border: none;
background-color: transparent;
padding: 0; }
-.ap-container .icon__close circle, .ap-container .icon__close path {
+.icon--close circle, .icon--close path {
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
-.ap-container .icon__close polygon {
+.icon--close .icon--close-x {
-webkit-transition: all .1s ease-in-out;
transition: all .1s ease-in-out;
fill: #a6266e; }
-.ap-container .icon__close path {
+.icon--close path {
fill: #a6266e; }
-.ap-container .icon__close:hover polygon {
+.icon--close:hover .icon--close-x {
fill: #fff; }
-.ap-container .icon__close:hover circle {
+.icon--close:hover circle {
fill: #a6266e; }
-.ap-container .icon__close:active circle, .ap-container .icon__close:active path {
+.icon--close:active circle, .icon--close:active path {
fill: #db2780; }
-.ap-container .icon__close:active polygon {
+.icon--close:active .icon--close-x {
fill: #fff; }
-.ap-container .label__text--dark, .ap-container .label__text--light {
+.label__text--dark, .label__text--light {
display: block;
padding: 16px 0 0;
position: absolute;
@@ -1216,37 +1429,37 @@ td, th {
font-weight: 500;
margin-top: 9px; }
-.ap-container .label__text--dark.active-label, .ap-container .label__text--light.active-label {
+.label__text--dark.active-label, .label__text--light.active-label {
visibility: visible;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
margin-top: -11px; }
-.form-boxed .ap-container .label__text--dark, .form-boxed .ap-container .label__text--light {
+.form-boxed .label__text--dark, .form-boxed .label__text--light {
visibility: visible; }
-.ap-container .label__text--light {
+.label__text--light {
color: #1d3649; }
-.ap-container .label__text--light.inactive-label {
+.label__text--light.inactive-label {
color: #5a5a5a; }
-.ap-container .label__text--dark {
+.label__text--dark {
color: #f9f9fb; }
-.ap-container .label__text--dark.inactive-label {
+.label__text--dark.inactive-label {
color: #c7c7c7; }
-.ap-container .label__checkbox--dark, .ap-container .label__checkbox--light, .ap-container .label__radio--dark, .ap-container .label__radio--light {
+.label__checkbox--dark, .label__checkbox--light, .label__radio--dark, .label__radio--light {
margin-right: 30px; }
-.ap-container .label__form--dark, .ap-container .label__form--light {
+.label__form--dark, .label__form--light {
display: block;
font-weight: 500;
padding-bottom: .3em;
color: #1d3649; }
-.ap-container .label__form--dark {
+.label__form--dark {
color: #f9f9fb; }
@-webkit-keyframes a {
@@ -1287,15 +1500,15 @@ td, th {
-webkit-transform: rotate(2100deg);
transform: rotate(2100deg); } }
-.ap-container .large {
+.large {
width: 90px;
height: 90px; }
-.ap-container .small {
+.small {
width: 45px;
height: 45px; }
-.ap-container .loader {
+.loader {
height: 100%;
width: 100%;
-webkit-transform: translateZ(0) rotate(300deg);
@@ -1305,7 +1518,7 @@ td, th {
-webkit-animation: b 4s ease-out infinite;
animation: b 4s ease-out infinite; }
-.ap-container .loader .loader__path {
+.loader .loader__path {
stroke-dasharray: 125px;
stroke-dashoffset: 9.7px;
r: 20px;
@@ -1320,416 +1533,416 @@ td, th {
-webkit-animation: a 4s ease-out infinite;
animation: a 4s ease-out infinite; }
-.ap-container .determinate {
+.determinate {
-webkit-transform: translateZ(0) rotate(-90deg);
transform: translateZ(0) rotate(-90deg);
-webkit-animation: none;
animation: none; }
-.ap-container .determinate .loader__path {
+.determinate .loader__path {
stroke-dasharray: 126;
stroke-dashoffset: 126;
-webkit-animation: none;
animation: none; }
-.ap-container .loader--dark .loader__path {
+.loader--dark .loader__path {
stroke: #41d6c3; }
-.ap-container .ibm-spinner-determinate[data-percent='100'] .loader__path {
+.ibm-spinner-determinate[data-percent='100'] .loader__path {
stroke-dashoffset: 0; }
-.ap-container .ibm-spinner-determinate[data-percent='99'] .loader__path {
+.ibm-spinner-determinate[data-percent='99'] .loader__path {
stroke-dashoffset: 1.26; }
-.ap-container .ibm-spinner-determinate[data-percent='98'] .loader__path {
+.ibm-spinner-determinate[data-percent='98'] .loader__path {
stroke-dashoffset: 2.52; }
-.ap-container .ibm-spinner-determinate[data-percent='97'] .loader__path {
+.ibm-spinner-determinate[data-percent='97'] .loader__path {
stroke-dashoffset: 3.78; }
-.ap-container .ibm-spinner-determinate[data-percent='96'] .loader__path {
+.ibm-spinner-determinate[data-percent='96'] .loader__path {
stroke-dashoffset: 5.04; }
-.ap-container .ibm-spinner-determinate[data-percent='95'] .loader__path {
+.ibm-spinner-determinate[data-percent='95'] .loader__path {
stroke-dashoffset: 6.3; }
-.ap-container .ibm-spinner-determinate[data-percent='94'] .loader__path {
+.ibm-spinner-determinate[data-percent='94'] .loader__path {
stroke-dashoffset: 7.56; }
-.ap-container .ibm-spinner-determinate[data-percent='93'] .loader__path {
+.ibm-spinner-determinate[data-percent='93'] .loader__path {
stroke-dashoffset: 8.82; }
-.ap-container .ibm-spinner-determinate[data-percent='92'] .loader__path {
+.ibm-spinner-determinate[data-percent='92'] .loader__path {
stroke-dashoffset: 10.08; }
-.ap-container .ibm-spinner-determinate[data-percent='91'] .loader__path {
+.ibm-spinner-determinate[data-percent='91'] .loader__path {
stroke-dashoffset: 11.34; }
-.ap-container .ibm-spinner-determinate[data-percent='90'] .loader__path {
+.ibm-spinner-determinate[data-percent='90'] .loader__path {
stroke-dashoffset: 12.6; }
-.ap-container .ibm-spinner-determinate[data-percent='89'] .loader__path {
+.ibm-spinner-determinate[data-percent='89'] .loader__path {
stroke-dashoffset: 13.86; }
-.ap-container .ibm-spinner-determinate[data-percent='88'] .loader__path {
+.ibm-spinner-determinate[data-percent='88'] .loader__path {
stroke-dashoffset: 15.12; }
-.ap-container .ibm-spinner-determinate[data-percent='87'] .loader__path {
+.ibm-spinner-determinate[data-percent='87'] .loader__path {
stroke-dashoffset: 16.38; }
-.ap-container .ibm-spinner-determinate[data-percent='86'] .loader__path {
+.ibm-spinner-determinate[data-percent='86'] .loader__path {
stroke-dashoffset: 17.64; }
-.ap-container .ibm-spinner-determinate[data-percent='85'] .loader__path {
+.ibm-spinner-determinate[data-percent='85'] .loader__path {
stroke-dashoffset: 18.9; }
-.ap-container .ibm-spinner-determinate[data-percent='84'] .loader__path {
+.ibm-spinner-determinate[data-percent='84'] .loader__path {
stroke-dashoffset: 20.16; }
-.ap-container .ibm-spinner-determinate[data-percent='83'] .loader__path {
+.ibm-spinner-determinate[data-percent='83'] .loader__path {
stroke-dashoffset: 21.42; }
-.ap-container .ibm-spinner-determinate[data-percent='82'] .loader__path {
+.ibm-spinner-determinate[data-percent='82'] .loader__path {
stroke-dashoffset: 22.68; }
-.ap-container .ibm-spinner-determinate[data-percent='81'] .loader__path {
+.ibm-spinner-determinate[data-percent='81'] .loader__path {
stroke-dashoffset: 23.94; }
-.ap-container .ibm-spinner-determinate[data-percent='80'] .loader__path {
+.ibm-spinner-determinate[data-percent='80'] .loader__path {
stroke-dashoffset: 25.2; }
-.ap-container .ibm-spinner-determinate[data-percent='79'] .loader__path {
+.ibm-spinner-determinate[data-percent='79'] .loader__path {
stroke-dashoffset: 26.46; }
-.ap-container .ibm-spinner-determinate[data-percent='78'] .loader__path {
+.ibm-spinner-determinate[data-percent='78'] .loader__path {
stroke-dashoffset: 27.72; }
-.ap-container .ibm-spinner-determinate[data-percent='77'] .loader__path {
+.ibm-spinner-determinate[data-percent='77'] .loader__path {
stroke-dashoffset: 28.98; }
-.ap-container .ibm-spinner-determinate[data-percent='76'] .loader__path {
+.ibm-spinner-determinate[data-percent='76'] .loader__path {
stroke-dashoffset: 30.24; }
-.ap-container .ibm-spinner-determinate[data-percent='75'] .loader__path {
+.ibm-spinner-determinate[data-percent='75'] .loader__path {
stroke-dashoffset: 31.5; }
-.ap-container .ibm-spinner-determinate[data-percent='74'] .loader__path {
+.ibm-spinner-determinate[data-percent='74'] .loader__path {
stroke-dashoffset: 32.76; }
-.ap-container .ibm-spinner-determinate[data-percent='73'] .loader__path {
+.ibm-spinner-determinate[data-percent='73'] .loader__path {
stroke-dashoffset: 34.02; }
-.ap-container .ibm-spinner-determinate[data-percent='72'] .loader__path {
+.ibm-spinner-determinate[data-percent='72'] .loader__path {
stroke-dashoffset: 35.28; }
-.ap-container .ibm-spinner-determinate[data-percent='71'] .loader__path {
+.ibm-spinner-determinate[data-percent='71'] .loader__path {
stroke-dashoffset: 36.54; }
-.ap-container .ibm-spinner-determinate[data-percent='70'] .loader__path {
+.ibm-spinner-determinate[data-percent='70'] .loader__path {
stroke-dashoffset: 37.8; }
-.ap-container .ibm-spinner-determinate[data-percent='69'] .loader__path {
+.ibm-spinner-determinate[data-percent='69'] .loader__path {
stroke-dashoffset: 39.06; }
-.ap-container .ibm-spinner-determinate[data-percent='68'] .loader__path {
+.ibm-spinner-determinate[data-percent='68'] .loader__path {
stroke-dashoffset: 40.32; }
-.ap-container .ibm-spinner-determinate[data-percent='67'] .loader__path {
+.ibm-spinner-determinate[data-percent='67'] .loader__path {
stroke-dashoffset: 41.58; }
-.ap-container .ibm-spinner-determinate[data-percent='66'] .loader__path {
+.ibm-spinner-determinate[data-percent='66'] .loader__path {
stroke-dashoffset: 42.84; }
-.ap-container .ibm-spinner-determinate[data-percent='65'] .loader__path {
+.ibm-spinner-determinate[data-percent='65'] .loader__path {
stroke-dashoffset: 44.1; }
-.ap-container .ibm-spinner-determinate[data-percent='64'] .loader__path {
+.ibm-spinner-determinate[data-percent='64'] .loader__path {
stroke-dashoffset: 45.36; }
-.ap-container .ibm-spinner-determinate[data-percent='63'] .loader__path {
+.ibm-spinner-determinate[data-percent='63'] .loader__path {
stroke-dashoffset: 46.62; }
-.ap-container .ibm-spinner-determinate[data-percent='62'] .loader__path {
+.ibm-spinner-determinate[data-percent='62'] .loader__path {
stroke-dashoffset: 47.88; }
-.ap-container .ibm-spinner-determinate[data-percent='61'] .loader__path {
+.ibm-spinner-determinate[data-percent='61'] .loader__path {
stroke-dashoffset: 49.14; }
-.ap-container .ibm-spinner-determinate[data-percent='60'] .loader__path {
+.ibm-spinner-determinate[data-percent='60'] .loader__path {
stroke-dashoffset: 50.4; }
-.ap-container .ibm-spinner-determinate[data-percent='59'] .loader__path {
+.ibm-spinner-determinate[data-percent='59'] .loader__path {
stroke-dashoffset: 51.66; }
-.ap-container .ibm-spinner-determinate[data-percent='58'] .loader__path {
+.ibm-spinner-determinate[data-percent='58'] .loader__path {
stroke-dashoffset: 52.92; }
-.ap-container .ibm-spinner-determinate[data-percent='57'] .loader__path {
+.ibm-spinner-determinate[data-percent='57'] .loader__path {
stroke-dashoffset: 54.18; }
-.ap-container .ibm-spinner-determinate[data-percent='56'] .loader__path {
+.ibm-spinner-determinate[data-percent='56'] .loader__path {
stroke-dashoffset: 55.44; }
-.ap-container .ibm-spinner-determinate[data-percent='55'] .loader__path {
+.ibm-spinner-determinate[data-percent='55'] .loader__path {
stroke-dashoffset: 56.7; }
-.ap-container .ibm-spinner-determinate[data-percent='54'] .loader__path {
+.ibm-spinner-determinate[data-percent='54'] .loader__path {
stroke-dashoffset: 57.96; }
-.ap-container .ibm-spinner-determinate[data-percent='53'] .loader__path {
+.ibm-spinner-determinate[data-percent='53'] .loader__path {
stroke-dashoffset: 59.22; }
-.ap-container .ibm-spinner-determinate[data-percent='52'] .loader__path {
+.ibm-spinner-determinate[data-percent='52'] .loader__path {
stroke-dashoffset: 60.48; }
-.ap-container .ibm-spinner-determinate[data-percent='51'] .loader__path {
+.ibm-spinner-determinate[data-percent='51'] .loader__path {
stroke-dashoffset: 61.74; }
-.ap-container .ibm-spinner-determinate[data-percent='50'] .loader__path {
+.ibm-spinner-determinate[data-percent='50'] .loader__path {
stroke-dashoffset: 63; }
-.ap-container .ibm-spinner-determinate[data-percent='49'] .loader__path {
+.ibm-spinner-determinate[data-percent='49'] .loader__path {
stroke-dashoffset: 64.26; }
-.ap-container .ibm-spinner-determinate[data-percent='48'] .loader__path {
+.ibm-spinner-determinate[data-percent='48'] .loader__path {
stroke-dashoffset: 65.52; }
-.ap-container .ibm-spinner-determinate[data-percent='47'] .loader__path {
+.ibm-spinner-determinate[data-percent='47'] .loader__path {
stroke-dashoffset: 66.78; }
-.ap-container .ibm-spinner-determinate[data-percent='46'] .loader__path {
+.ibm-spinner-determinate[data-percent='46'] .loader__path {
stroke-dashoffset: 68.04; }
-.ap-container .ibm-spinner-determinate[data-percent='45'] .loader__path {
+.ibm-spinner-determinate[data-percent='45'] .loader__path {
stroke-dashoffset: 69.3; }
-.ap-container .ibm-spinner-determinate[data-percent='44'] .loader__path {
+.ibm-spinner-determinate[data-percent='44'] .loader__path {
stroke-dashoffset: 70.56; }
-.ap-container .ibm-spinner-determinate[data-percent='43'] .loader__path {
+.ibm-spinner-determinate[data-percent='43'] .loader__path {
stroke-dashoffset: 71.82; }
-.ap-container .ibm-spinner-determinate[data-percent='42'] .loader__path {
+.ibm-spinner-determinate[data-percent='42'] .loader__path {
stroke-dashoffset: 73.08; }
-.ap-container .ibm-spinner-determinate[data-percent='41'] .loader__path {
+.ibm-spinner-determinate[data-percent='41'] .loader__path {
stroke-dashoffset: 74.34; }
-.ap-container .ibm-spinner-determinate[data-percent='40'] .loader__path {
+.ibm-spinner-determinate[data-percent='40'] .loader__path {
stroke-dashoffset: 75.6; }
-.ap-container .ibm-spinner-determinate[data-percent='39'] .loader__path {
+.ibm-spinner-determinate[data-percent='39'] .loader__path {
stroke-dashoffset: 76.86; }
-.ap-container .ibm-spinner-determinate[data-percent='38'] .loader__path {
+.ibm-spinner-determinate[data-percent='38'] .loader__path {
stroke-dashoffset: 78.12; }
-.ap-container .ibm-spinner-determinate[data-percent='37'] .loader__path {
+.ibm-spinner-determinate[data-percent='37'] .loader__path {
stroke-dashoffset: 79.38; }
-.ap-container .ibm-spinner-determinate[data-percent='36'] .loader__path {
+.ibm-spinner-determinate[data-percent='36'] .loader__path {
stroke-dashoffset: 80.64; }
-.ap-container .ibm-spinner-determinate[data-percent='35'] .loader__path {
+.ibm-spinner-determinate[data-percent='35'] .loader__path {
stroke-dashoffset: 81.9; }
-.ap-container .ibm-spinner-determinate[data-percent='34'] .loader__path {
+.ibm-spinner-determinate[data-percent='34'] .loader__path {
stroke-dashoffset: 83.16; }
-.ap-container .ibm-spinner-determinate[data-percent='33'] .loader__path {
+.ibm-spinner-determinate[data-percent='33'] .loader__path {
stroke-dashoffset: 84.42; }
-.ap-container .ibm-spinner-determinate[data-percent='32'] .loader__path {
+.ibm-spinner-determinate[data-percent='32'] .loader__path {
stroke-dashoffset: 85.68; }
-.ap-container .ibm-spinner-determinate[data-percent='31'] .loader__path {
+.ibm-spinner-determinate[data-percent='31'] .loader__path {
stroke-dashoffset: 86.94; }
-.ap-container .ibm-spinner-determinate[data-percent='30'] .loader__path {
+.ibm-spinner-determinate[data-percent='30'] .loader__path {
stroke-dashoffset: 88.2; }
-.ap-container .ibm-spinner-determinate[data-percent='29'] .loader__path {
+.ibm-spinner-determinate[data-percent='29'] .loader__path {
stroke-dashoffset: 89.46; }
-.ap-container .ibm-spinner-determinate[data-percent='28'] .loader__path {
+.ibm-spinner-determinate[data-percent='28'] .loader__path {
stroke-dashoffset: 90.72; }
-.ap-container .ibm-spinner-determinate[data-percent='27'] .loader__path {
+.ibm-spinner-determinate[data-percent='27'] .loader__path {
stroke-dashoffset: 91.98; }
-.ap-container .ibm-spinner-determinate[data-percent='26'] .loader__path {
+.ibm-spinner-determinate[data-percent='26'] .loader__path {
stroke-dashoffset: 93.24; }
-.ap-container .ibm-spinner-determinate[data-percent='25'] .loader__path {
+.ibm-spinner-determinate[data-percent='25'] .loader__path {
stroke-dashoffset: 94.5; }
-.ap-container .ibm-spinner-determinate[data-percent='24'] .loader__path {
+.ibm-spinner-determinate[data-percent='24'] .loader__path {
stroke-dashoffset: 95.76; }
-.ap-container .ibm-spinner-determinate[data-percent='23'] .loader__path {
+.ibm-spinner-determinate[data-percent='23'] .loader__path {
stroke-dashoffset: 97.02; }
-.ap-container .ibm-spinner-determinate[data-percent='22'] .loader__path {
+.ibm-spinner-determinate[data-percent='22'] .loader__path {
stroke-dashoffset: 98.28; }
-.ap-container .ibm-spinner-determinate[data-percent='21'] .loader__path {
+.ibm-spinner-determinate[data-percent='21'] .loader__path {
stroke-dashoffset: 99.54; }
-.ap-container .ibm-spinner-determinate[data-percent='20'] .loader__path {
+.ibm-spinner-determinate[data-percent='20'] .loader__path {
stroke-dashoffset: 100.8; }
-.ap-container .ibm-spinner-determinate[data-percent='19'] .loader__path {
+.ibm-spinner-determinate[data-percent='19'] .loader__path {
stroke-dashoffset: 102.06; }
-.ap-container .ibm-spinner-determinate[data-percent='18'] .loader__path {
+.ibm-spinner-determinate[data-percent='18'] .loader__path {
stroke-dashoffset: 103.32; }
-.ap-container .ibm-spinner-determinate[data-percent='17'] .loader__path {
+.ibm-spinner-determinate[data-percent='17'] .loader__path {
stroke-dashoffset: 104.58; }
-.ap-container .ibm-spinner-determinate[data-percent='16'] .loader__path {
+.ibm-spinner-determinate[data-percent='16'] .loader__path {
stroke-dashoffset: 105.84; }
-.ap-container .ibm-spinner-determinate[data-percent='15'] .loader__path {
+.ibm-spinner-determinate[data-percent='15'] .loader__path {
stroke-dashoffset: 107.1; }
-.ap-container .ibm-spinner-determinate[data-percent='14'] .loader__path {
+.ibm-spinner-determinate[data-percent='14'] .loader__path {
stroke-dashoffset: 108.36; }
-.ap-container .ibm-spinner-determinate[data-percent='13'] .loader__path {
+.ibm-spinner-determinate[data-percent='13'] .loader__path {
stroke-dashoffset: 109.62; }
-.ap-container .ibm-spinner-determinate[data-percent='12'] .loader__path {
+.ibm-spinner-determinate[data-percent='12'] .loader__path {
stroke-dashoffset: 110.88; }
-.ap-container .ibm-spinner-determinate[data-percent='11'] .loader__path {
+.ibm-spinner-determinate[data-percent='11'] .loader__path {
stroke-dashoffset: 112.14; }
-.ap-container .ibm-spinner-determinate[data-percent='10'] .loader__path {
+.ibm-spinner-determinate[data-percent='10'] .loader__path {
stroke-dashoffset: 113.4; }
-.ap-container .ibm-spinner-determinate[data-percent='9'] .loader__path {
+.ibm-spinner-determinate[data-percent='9'] .loader__path {
stroke-dashoffset: 114.66; }
-.ap-container .ibm-spinner-determinate[data-percent='8'] .loader__path {
+.ibm-spinner-determinate[data-percent='8'] .loader__path {
stroke-dashoffset: 115.92; }
-.ap-container .ibm-spinner-determinate[data-percent='7'] .loader__path {
+.ibm-spinner-determinate[data-percent='7'] .loader__path {
stroke-dashoffset: 117.18; }
-.ap-container .ibm-spinner-determinate[data-percent='6'] .loader__path {
+.ibm-spinner-determinate[data-percent='6'] .loader__path {
stroke-dashoffset: 118.44; }
-.ap-container .ibm-spinner-determinate[data-percent='5'] .loader__path {
+.ibm-spinner-determinate[data-percent='5'] .loader__path {
stroke-dashoffset: 119.7; }
-.ap-container .ibm-spinner-determinate[data-percent='4'] .loader__path {
+.ibm-spinner-determinate[data-percent='4'] .loader__path {
stroke-dashoffset: 120.96; }
-.ap-container .ibm-spinner-determinate[data-percent='3'] .loader__path {
+.ibm-spinner-determinate[data-percent='3'] .loader__path {
stroke-dashoffset: 122.22; }
-.ap-container .ibm-spinner-determinate[data-percent='2'] .loader__path {
+.ibm-spinner-determinate[data-percent='2'] .loader__path {
stroke-dashoffset: 123.48; }
-.ap-container .ibm-spinner-determinate[data-percent='1'] .loader__path {
+.ibm-spinner-determinate[data-percent='1'] .loader__path {
stroke-dashoffset: 124.74; }
-.ap-container .ibm-spinner-determinate[data-percent='0'] .loader__path {
+.ibm-spinner-determinate[data-percent='0'] .loader__path {
stroke-dashoffset: 126; }
-.ap-container .ibm-spinner-determinate[data-percent='-1'] .loader__path {
+.ibm-spinner-determinate[data-percent='-1'] .loader__path {
stroke-dashoffset: 127.26; }
-.ap-container .ibm-spinner-determinate[data-percent='-2'] .loader__path {
+.ibm-spinner-determinate[data-percent='-2'] .loader__path {
stroke-dashoffset: 128.52; }
-.ap-container .ibm-spinner-determinate[data-percent='-3'] .loader__path {
+.ibm-spinner-determinate[data-percent='-3'] .loader__path {
stroke-dashoffset: 129.78; }
-.ap-container .ibm-spinner-determinate[data-percent='-4'] .loader__path {
+.ibm-spinner-determinate[data-percent='-4'] .loader__path {
stroke-dashoffset: 131.04; }
-.ap-container .ibm-spinner-determinate[data-percent='-5'] .loader__path {
+.ibm-spinner-determinate[data-percent='-5'] .loader__path {
stroke-dashoffset: 132.3; }
-.ap-container .ibm-spinner-determinate[data-percent='-6'] .loader__path {
+.ibm-spinner-determinate[data-percent='-6'] .loader__path {
stroke-dashoffset: 133.56; }
-.ap-container .ibm-spinner-determinate[data-percent='-7'] .loader__path {
+.ibm-spinner-determinate[data-percent='-7'] .loader__path {
stroke-dashoffset: 134.82; }
-.ap-container .ibm-spinner-determinate[data-percent='-8'] .loader__path {
+.ibm-spinner-determinate[data-percent='-8'] .loader__path {
stroke-dashoffset: 136.08; }
-.ap-container .ibm-spinner-determinate[data-percent='-9'] .loader__path {
+.ibm-spinner-determinate[data-percent='-9'] .loader__path {
stroke-dashoffset: 137.34; }
-.ap-container .ibm-spinner-determinate[data-percent='-10'] .loader__path {
+.ibm-spinner-determinate[data-percent='-10'] .loader__path {
stroke-dashoffset: 138.6; }
-.ap-container .ibm-spinner-determinate[data-percent='-11'] .loader__path {
+.ibm-spinner-determinate[data-percent='-11'] .loader__path {
stroke-dashoffset: 139.86; }
-.ap-container .ibm-spinner-determinate[data-percent='-12'] .loader__path {
+.ibm-spinner-determinate[data-percent='-12'] .loader__path {
stroke-dashoffset: 141.12; }
-.ap-container .ibm-spinner-determinate[data-percent='-13'] .loader__path {
+.ibm-spinner-determinate[data-percent='-13'] .loader__path {
stroke-dashoffset: 142.38; }
-.ap-container .ibm-spinner-determinate[data-percent='-14'] .loader__path {
+.ibm-spinner-determinate[data-percent='-14'] .loader__path {
stroke-dashoffset: 143.64; }
-.ap-container .ibm-spinner-determinate[data-percent='-15'] .loader__path {
+.ibm-spinner-determinate[data-percent='-15'] .loader__path {
stroke-dashoffset: 144.9; }
-.ap-container .ibm-spinner-determinate[data-percent='-16'] .loader__path {
+.ibm-spinner-determinate[data-percent='-16'] .loader__path {
stroke-dashoffset: 146.16; }
-.ap-container .ibm-spinner-determinate[data-percent='-17'] .loader__path {
+.ibm-spinner-determinate[data-percent='-17'] .loader__path {
stroke-dashoffset: 147.42; }
-.ap-container .ibm-spinner-determinate[data-percent='-18'] .loader__path {
+.ibm-spinner-determinate[data-percent='-18'] .loader__path {
stroke-dashoffset: 148.68; }
-.ap-container .ibm-spinner-determinate[data-percent='-19'] .loader__path {
+.ibm-spinner-determinate[data-percent='-19'] .loader__path {
stroke-dashoffset: 149.94; }
-.ap-container .ibm-spinner-determinate[data-percent='-20'] .loader__path {
+.ibm-spinner-determinate[data-percent='-20'] .loader__path {
stroke-dashoffset: 151.2; }
-.ap-container .ibm-spinner-determinate[data-percent='-21'] .loader__path {
+.ibm-spinner-determinate[data-percent='-21'] .loader__path {
stroke-dashoffset: 152.46; }
-.ap-container .ibm-spinner-determinate[data-percent='-22'] .loader__path {
+.ibm-spinner-determinate[data-percent='-22'] .loader__path {
stroke-dashoffset: 153.72; }
-.ap-container .ibm-spinner-determinate[data-percent='-23'] .loader__path {
+.ibm-spinner-determinate[data-percent='-23'] .loader__path {
stroke-dashoffset: 154.98; }
-.ap-container .ibm-spinner-determinate[data-percent='-24'] .loader__path {
+.ibm-spinner-determinate[data-percent='-24'] .loader__path {
stroke-dashoffset: 156.24; }
-.ap-container .ibm-spinner-determinate[data-percent='-25'] .loader__path {
+.ibm-spinner-determinate[data-percent='-25'] .loader__path {
stroke-dashoffset: 157.5; }
-.ap-container .ibm-spinner-determinate[data-percent='-26'] .loader__path {
+.ibm-spinner-determinate[data-percent='-26'] .loader__path {
stroke-dashoffset: 158.76; }
-.ap-container .modal {
+.modal {
display: none; }
-.ap-container .modal-content {
+.modal-content {
height: 100%; }
-@media (min-width: 48.063em) {
- .ap-container .modal-content {
+@media (min-width: 51.44em) {
+ .modal-content {
height: auto; } }
-.ap-container .modal-content:focus {
+.modal-content:focus {
outline: none; }
-.ap-container .modal-inner {
+.modal-inner {
position: relative;
overflow: hidden;
width: 100%;
@@ -1740,21 +1953,21 @@ td, th {
background: #fff;
z-index: -1;
opacity: 0;
- font-size: 16px;
-webkit-transition: all .2s ease-in-out;
- transition: all .2s ease-in-out; }
+ transition: all .2s ease-in-out;
+ font-size: 1rem; }
-@media (min-width: 48.063em) {
- .ap-container .modal-inner {
+@media (min-width: 51.44em) {
+ .modal-inner {
width: 50%;
height: auto;
max-height: 90%; } }
-.modal-visible .ap-container .modal-inner {
+.modal-visible .modal-inner {
z-index: 100;
opacity: 1; }
-.ap-container .modal__container {
+.modal__container {
position: relative;
padding: 24px 4.99469%;
background: #fff;
@@ -1763,15 +1976,15 @@ td, th {
color: #777677; }
@media (min-width: 31.25em) {
- .ap-container .modal__container {
+ .modal__container {
padding: 24px 3.27526%; } }
-@media (min-width: 48.063em) {
- .ap-container .modal__container {
+@media (min-width: 51.44em) {
+ .modal__container {
height: auto;
padding: 50px; } }
-.ap-container .modal__close {
+.modal__close {
position: absolute;
top: 10px;
right: 10px;
@@ -1783,27 +1996,27 @@ td, th {
background-color: transparent;
padding: 0; }
-.ap-container .modal__close circle, .ap-container .modal__close path {
+.modal__close circle, .modal__close path {
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; }
-.ap-container .modal__close polygon {
+.modal__close polygon {
-webkit-transition: all .1s ease-in-out;
transition: all .1s ease-in-out; }
-.ap-container .modal__close:hover polygon {
+.modal__close:hover polygon {
fill: #fff; }
-.ap-container .modal__close:hover circle {
+.modal__close:hover circle {
fill: #a6266e; }
-.ap-container .modal__close:active circle, .ap-container .modal__close:active path {
+.modal__close:active circle, .modal__close:active path {
fill: #db2780; }
-.ap-container .modal__close:active polygon {
+.modal__close:active polygon {
fill: #fff; }
-.ap-container .modal__buttons {
+.modal__buttons {
background: #f9f9fb;
padding: 4.99469%;
text-align: right;
@@ -1813,143 +2026,193 @@ td, th {
width: 100%; }
@media (min-width: 31.25em) {
- .ap-container .modal__buttons {
+ .modal__buttons {
padding: 3.27526%; } }
-@media (min-width: 48.063em) {
- .ap-container .modal__buttons {
+@media (min-width: 51.44em) {
+ .modal__buttons {
position: static;
width: auto;
padding: 24px 50px;
margin: 24px -50px -50px; } }
-.ap-container .modal__header {
+.modal__header {
background: #f9f9fb;
padding: 4.99469% 4.99469% 24px;
margin: -4.99469% -4.99469% 24px; }
@media (min-width: 31.25em) {
- .ap-container .modal__header {
+ .modal__header {
padding: 3.27526% 3.27526% 24px;
margin-left: -3.27526%;
margin-right: -3.27526%;
margin-top: -3.27526%; } }
-@media (min-width: 48.063em) {
- .ap-container .modal__header {
+@media (min-width: 51.44em) {
+ .modal__header {
padding: 50px 50px 24px;
margin: -50px -50px 24px; } }
-.ap-container .modal h1, .ap-container .modal h2, .ap-container .modal h3 {
+.modal h1, .modal h2, .modal h3 {
line-height: 1;
color: #1d3649; }
-.ap-container .modal--error, .ap-container .modal--warning {
+.modal--error, .modal--warning {
padding-left: 70px; }
-@media (min-width: 48.063em) {
- .ap-container .modal--error, .ap-container .modal--warning {
+@media (min-width: 51.44em) {
+ .modal--error, .modal--warning {
padding-left: 100px; }
- .ap-container .modal--error .modal__buttons, .ap-container .modal--warning .modal__buttons {
+ .modal--error .modal__buttons, .modal--warning .modal__buttons {
margin-left: -100px; } }
-.ap-container .modal--error .icon, .ap-container .modal--warning .icon {
- width: 32px;
- height: 32px;
+.modal--error .icon--error, .modal--error .icon--warning, .modal--warning .icon--error, .modal--warning .icon--warning {
position: absolute;
top: 20px;
left: 20px; }
-@media (min-width: 48.063em) {
- .ap-container .modal--error .icon, .ap-container .modal--warning .icon {
+@media (min-width: 51.44em) {
+ .modal--error .icon--error, .modal--error .icon--warning, .modal--warning .icon--error, .modal--warning .icon--warning {
top: 58px;
left: 50px; } }
-.ap-container .modal--error {
+.modal--error {
border-color: #e71d32; }
-.ap-container .modal--error circle {
- fill: #e71d32; }
-
-.ap-container .modal--error path {
- fill: #fff; }
-
-.ap-container .modal--warning {
+.modal--warning {
border-color: #fdd600; }
-.ap-container .modal--warning path:first-child {
- fill: #fdd600; }
-
-.ap-container .modal--warning path {
- fill: #1d3649; }
-
-.ap-container .error__info {
+.error__info {
clear: both;
padding-top: 1em; }
-.ap-container .error__details dt {
+.error__details dt {
clear: both;
width: 150px;
display: inline-block; }
-.ap-container .error__details dt:after {
+.error__details dt:after {
content: ': '; }
-.ap-container .error__details dd {
+.error__details dd {
display: inline-block;
color: #1d3649;
margin: 0;
padding: 0 0 0 10px;
width: calc(100% - 170px); }
-.ap-container .modal .shorten {
+.modal .shorten {
margin-bottom: 20px;
max-height: 900px; }
-.ap-container _::-moz-range-track, .ap-container body:last-child .radio--base, .ap-container body:last-child .radio--dark, .ap-container body:last-child .radio--dark[type=radio][disabled], .ap-container body:last-child .radio--light, .ap-container body:last-child .radio--light[type=radio][disabled] {
- margin-left: -1px;
- margin-top: 4px; }
-
-.ap-container .radio--base, .ap-container .radio--dark, .ap-container .radio--dark[type=radio][disabled], .ap-container .radio--light, .ap-container .radio--light[type=radio][disabled] {
- cursor: pointer;
+.modal--error .icon, .modal--warning .icon {
+ width: 32px;
+ height: 32px;
position: absolute;
- margin-top: 5px;
- margin-left: 1px;
- width: 17px;
- height: 17px;
- opacity: 0; }
+ top: 20px;
+ left: 20px; }
-.ap-container .radio--base + label, .ap-container .radio--dark + label, .ap-container .radio--dark[type=radio][disabled] + label, .ap-container .radio--light + label, .ap-container .radio--light[type=radio][disabled] + label {
- cursor: pointer;
- color: #152935;
- display: inline-block;
- position: relative;
- padding-left: 30px; }
+@media (min-width: 51.44em) {
+ .modal--error .icon, .modal--warning .icon {
+ top: 58px;
+ left: 50px; } }
-.ap-container .radio--base + label div, .ap-container .radio--dark + label div, .ap-container .radio--dark[type=radio][disabled] + label div, .ap-container .radio--light + label div, .ap-container .radio--light[type=radio][disabled] + label div {
- color: #152935;
- display: inline-block;
- position: absolute;
- left: 0; }
+.modal--error circle {
+ fill: #e71d32; }
-.ap-container .radio--base + label:after, .ap-container .radio--base + label:before, .ap-container .radio--base + label div:after, .ap-container .radio--base + label div:before, .ap-container .radio--dark + label:after, .ap-container .radio--dark + label:before, .ap-container .radio--dark + label div:after, .ap-container .radio--dark + label div:before, .ap-container .radio--dark[type=radio][disabled] + label:after, .ap-container .radio--dark[type=radio][disabled] + label:before, .ap-container .radio--dark[type=radio][disabled] + label div:after, .ap-container .radio--dark[type=radio][disabled] + label div:before, .ap-container .radio--light + label:after, .ap-container .radio--light + label:before, .ap-container .radio--light + label div:after, .ap-container .radio--light + label div:before, .ap-container .radio--light[type=radio][disabled] + label:after, .ap-container .radio--light[type=radio][disabled] + label:before, .ap-container .radio--light[type=radio][disabled] + label div:
after, .ap-container .radio--light[type=radio][disabled] + label div:before {
- content: '';
- display: inline-block;
- width: 16px;
- height: 16px;
- top: 5px;
- left: 0;
- bottom: 0;
- text-align: center;
- position: absolute; }
+.modal--error path {
+ fill: #fff; }
-.ap-container .radio--base + label:before, .ap-container .radio--dark + label:before, .ap-container .radio--dark[type=radio][disabled] + label:before, .ap-container .radio--light + label:before, .ap-container .radio--light[type=radio][disabled] + label:before {
+.modal--warning path:first-child {
+ fill: #fdd600; }
+
+.modal--warning path {
+ fill: #1d3649; }
+
+body.vanilla-modal .modal {
+ display: block;
+ position: fixed;
+ content: '';
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: rgba(21, 41, 53, 0.9);
+ z-index: -1;
+ opacity: 0;
+ font-size: 0;
+ -webkit-transition: opacity .2s,z-index 0s .2s;
+ transition: opacity .2s,z-index 0s .2s;
+ text-align: center;
+ overflow: hidden;
+ overflow-y: auto;
+ white-space: nowrap;
+ -webkit-overflow-scrolling: touch; }
+
+body.vanilla-modal .modal > * {
+ display: inline-block;
+ white-space: normal;
+ vertical-align: middle;
+ text-align: left; }
+
+body.vanilla-modal .modal:before {
+ display: inline-block;
+ overflow: hidden;
+ width: 0;
+ height: 100%;
+ vertical-align: middle;
+ content: ''; }
+
+body.vanilla-modal.modal-visible .modal {
+ z-index: 9000;
+ opacity: 1;
+ -webkit-transition: opacity .2s;
+ transition: opacity .2s; }
+
+_::-moz-range-track, body:last-child .radio--base, body:last-child .radio--dark, body:last-child .radio--dark[type=radio][disabled], body:last-child .radio--light, body:last-child .radio--light[type=radio][disabled] {
+ margin-left: -1px;
+ margin-top: 4px; }
+
+.radio--base, .radio--dark, .radio--dark[type=radio][disabled], .radio--light, .radio--light[type=radio][disabled] {
+ cursor: pointer;
+ position: absolute;
+ margin-top: 5px;
+ margin-left: 1px;
+ width: 17px;
+ height: 17px;
+ opacity: 0; }
+
+.radio--base + label, .radio--dark + label, .radio--dark[type=radio][disabled] + label, .radio--light + label, .radio--light[type=radio][disabled] + label {
+ cursor: pointer;
+ color: #152935;
+ display: inline-block;
+ position: relative;
+ padding-left: 30px; }
+
+.radio--base + label div, .radio--dark + label div, .radio--dark[type=radio][disabled] + label div, .radio--light + label div, .radio--light[type=radio][disabled] + label div {
+ color: #152935;
+ display: inline-block;
+ position: absolute;
+ left: 0; }
+
+.radio--base + label:after, .radio--base + label:before, .radio--base + label div:after, .radio--base + label div:before, .radio--dark + label:after, .radio--dark + label:before, .radio--dark + label div:after, .radio--dark + label div:before, .radio--dark[type=radio][disabled] + label:after, .radio--dark[type=radio][disabled] + label:before, .radio--dark[type=radio][disabled] + label div:after, .radio--dark[type=radio][disabled] + label div:before, .radio--light + label:after, .radio--light + label:before, .radio--light + label div:after, .radio--light + label div:before, .radio--light[type=radio][disabled] + label:after, .radio--light[type=radio][disabled] + label:before, .radio--light[type=radio][disabled] + label div:after, .radio--light[type=radio][disabled] + label div:before {
+ content: '';
+ display: inline-block;
+ width: 16px;
+ height: 16px;
+ top: 5px;
+ left: 0;
+ bottom: 0;
+ text-align: center;
+ position: absolute; }
+
+.radio--base + label:before, .radio--dark + label:before, .radio--dark[type=radio][disabled] + label:before, .radio--light + label:before, .radio--light[type=radio][disabled] + label:before {
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
border: 1px solid #1d3649;
border-radius: 50%; }
-.ap-container .radio--base + label div:before, .ap-container .radio--dark + label div:before, .ap-container .radio--dark[type=radio][disabled] + label div:before, .ap-container .radio--light + label div:before, .ap-container .radio--light[type=radio][disabled] + label div:before {
+.radio--base + label div:before, .radio--dark + label div:before, .radio--dark[type=radio][disabled] + label div:before, .radio--light + label div:before, .radio--light[type=radio][disabled] + label div:before {
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
border-radius: 50%;
@@ -1957,150 +2220,151 @@ td, th {
-webkit-transform: scale(0);
transform: scale(0); }
-.ap-container .radio--base:focus.non-keyboard-outline + label:before, .ap-container .radio--dark:focus.non-keyboard-outline + label:before, .ap-container .radio--light:focus.non-keyboard-outline + label:before {
+.radio--base:focus.non-keyboard-outline + label:before, .radio--dark:focus.non-keyboard-outline + label:before, .radio--light:focus.non-keyboard-outline + label:before {
box-shadow: 0 0 0 6px rgba(124, 199, 255, 0.75), inset 0 0 0 0 #a6266e; }
-.ap-container .radio--base:not(:checked) + label:hover div:before, .ap-container .radio--dark:not(:checked) + label:hover div:before, .ap-container .radio--light:not(:checked) + label:hover div:before {
+.radio--base:not(:checked) + label:hover div:before, .radio--dark:not(:checked) + label:hover div:before, .radio--light:not(:checked) + label:hover div:before {
box-shadow: 0 0 0 0 rgba(124, 199, 255, 0.75), inset 0 0 0 10px #a6266e;
-webkit-transform: scale(0.4);
transform: scale(0.4); }
-.ap-container .radio--base:checked + label div:before, .ap-container .radio--dark:checked + label div:before, .ap-container .radio--dark[type=radio][disabled]:checked + label div:before, .ap-container .radio--light:checked + label div:before, .ap-container .radio--light[type=radio][disabled]:checked + label div:before {
+.radio--base:checked + label div:before, .radio--dark:checked + label div:before, .radio--dark[type=radio][disabled]:checked + label div:before, .radio--light:checked + label div:before, .radio--light[type=radio][disabled]:checked + label div:before {
box-shadow: 0 0 0 0 rgba(124, 199, 255, 0.75), inset 0 0 0 10px #a6266e;
-webkit-transform: scale(1);
transform: scale(1); }
-.ap-container .radio--base:checked + label:before, .ap-container .radio--dark:checked + label:before, .ap-container .radio--dark[type=radio][disabled]:checked + label:before, .ap-container .radio--light:checked + label:before, .ap-container .radio--light[type=radio][disabled]:checked + label:before {
+.radio--base:checked + label:before, .radio--dark:checked + label:before, .radio--dark[type=radio][disabled]:checked + label:before, .radio--light:checked + label:before, .radio--light[type=radio][disabled]:checked + label:before {
border: 1px solid #a6266e; }
-.ap-container .radio--dark + label {
+.radio--dark + label {
color: #f9f9fb; }
-.ap-container .radio--dark +
<TRUNCATED>