UNPKG

synapse-react-client

Version:

[![Build Status](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client.svg?branch=main)](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [![npm version](https://badge.fury.io/js/synapse-react-client.svg)](https://badge.fury.io/js/synaps

1,863 lines 617 kB
@charset "UTF-8"; @import url("https://fonts.googleapis.com/css?family=Lato:300,400,700,900"); /* @param $color string e.g. #eee or red @param $width unit e.g. 15% */ .bootstrap-4-backport { /*! * Bootstrap v4.6.1 (https://getbootstrap.com/) * Copyright 2011-2021 The Bootstrap Authors * Copyright 2011-2021 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) */ /** * For our expanded primary color palette, create regular and light * button variants for each color. * For button mixins, see node_modules/bootstrap/scss/mixins/_buttons.scss */ } .bootstrap-4-backport :root { --blue: #007bff; --indigo: #6610f2; --purple: #6f42c1; --pink: #e83e8c; --red: #dc3545; --orange: #fd7e14; --yellow: #ffc107; --green: #28a745; --teal: #20c997; --cyan: #17a2b8; --white: #fff; --gray: #6c757d; --gray-dark: #343a40; --primary: #407ba0; --secondary: #469285; --success: #28a745; --info: #17a2b8; --warning: #ffc107; --danger: #dc3545; --light: #f8f9fa; --dark: #343a40; --breakpoint-xs: 0; --breakpoint-sm: 576px; --breakpoint-md: 768px; --breakpoint-lg: 992px; --breakpoint-xl: 1200px; --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; } .bootstrap-4-backport *, .bootstrap-4-backport *::before, .bootstrap-4-backport *::after { box-sizing: border-box; } .bootstrap-4-backport html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .bootstrap-4-backport article, .bootstrap-4-backport aside, .bootstrap-4-backport figcaption, .bootstrap-4-backport figure, .bootstrap-4-backport footer, .bootstrap-4-backport header, .bootstrap-4-backport hgroup, .bootstrap-4-backport main, .bootstrap-4-backport nav, .bootstrap-4-backport section { display: block; } .bootstrap-4-backport body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; text-align: left; background-color: #fff; } .bootstrap-4-backport [tabindex="-1"]:focus:not(:focus-visible) { outline: 0 !important; } .bootstrap-4-backport hr { box-sizing: content-box; height: 0; overflow: visible; } .bootstrap-4-backport h1, .bootstrap-4-backport h2, .bootstrap-4-backport h3, .bootstrap-4-backport h4, .bootstrap-4-backport h5, .bootstrap-4-backport h6 { margin-top: 0; margin-bottom: 0.5rem; } .bootstrap-4-backport p { margin-top: 0; margin-bottom: 1rem; } .bootstrap-4-backport abbr[title], .bootstrap-4-backport abbr[data-original-title] { text-decoration: underline; text-decoration: underline dotted; cursor: help; border-bottom: 0; text-decoration-skip-ink: none; } .bootstrap-4-backport address { margin-bottom: 1rem; font-style: normal; line-height: inherit; } .bootstrap-4-backport ol, .bootstrap-4-backport ul, .bootstrap-4-backport dl { margin-top: 0; margin-bottom: 1rem; } .bootstrap-4-backport ol ol, .bootstrap-4-backport ul ul, .bootstrap-4-backport ol ul, .bootstrap-4-backport ul ol { margin-bottom: 0; } .bootstrap-4-backport dt { font-weight: 700; } .bootstrap-4-backport dd { margin-bottom: 0.5rem; margin-left: 0; } .bootstrap-4-backport blockquote { margin: 0 0 1rem; } .bootstrap-4-backport b, .bootstrap-4-backport strong { font-weight: bolder; } .bootstrap-4-backport small { font-size: 80%; } .bootstrap-4-backport sub, .bootstrap-4-backport sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } .bootstrap-4-backport sub { bottom: -0.25em; } .bootstrap-4-backport sup { top: -0.5em; } .bootstrap-4-backport a { color: #407ba0; text-decoration: none; background-color: transparent; } .bootstrap-4-backport a:hover { color: #2a5169; text-decoration: underline; } .bootstrap-4-backport a:not([href]):not([class]) { color: inherit; text-decoration: none; } .bootstrap-4-backport a:not([href]):not([class]):hover { color: inherit; text-decoration: none; } .bootstrap-4-backport pre, .bootstrap-4-backport code, .bootstrap-4-backport kbd, .bootstrap-4-backport samp { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 1em; } .bootstrap-4-backport pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; -ms-overflow-style: scrollbar; } .bootstrap-4-backport figure { margin: 0 0 1rem; } .bootstrap-4-backport img { vertical-align: middle; border-style: none; } .bootstrap-4-backport svg { overflow: hidden; vertical-align: middle; } .bootstrap-4-backport table { border-collapse: collapse; } .bootstrap-4-backport caption { padding-top: 0.75rem; padding-bottom: 0.75rem; color: #6c757d; text-align: left; caption-side: bottom; } .bootstrap-4-backport th { text-align: inherit; text-align: -webkit-match-parent; } .bootstrap-4-backport label { display: inline-block; margin-bottom: 0.5rem; } .bootstrap-4-backport button { border-radius: 0; } .bootstrap-4-backport button:focus:not(:focus-visible) { outline: 0; } .bootstrap-4-backport input, .bootstrap-4-backport button, .bootstrap-4-backport select, .bootstrap-4-backport optgroup, .bootstrap-4-backport textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } .bootstrap-4-backport button, .bootstrap-4-backport input { overflow: visible; } .bootstrap-4-backport button, .bootstrap-4-backport select { text-transform: none; } .bootstrap-4-backport [role=button] { cursor: pointer; } .bootstrap-4-backport select { word-wrap: normal; } .bootstrap-4-backport button, .bootstrap-4-backport [type=button], .bootstrap-4-backport [type=reset], .bootstrap-4-backport [type=submit] { -webkit-appearance: button; } .bootstrap-4-backport button:not(:disabled), .bootstrap-4-backport [type=button]:not(:disabled), .bootstrap-4-backport [type=reset]:not(:disabled), .bootstrap-4-backport [type=submit]:not(:disabled) { cursor: pointer; } .bootstrap-4-backport button::-moz-focus-inner, .bootstrap-4-backport [type=button]::-moz-focus-inner, .bootstrap-4-backport [type=reset]::-moz-focus-inner, .bootstrap-4-backport [type=submit]::-moz-focus-inner { padding: 0; border-style: none; } .bootstrap-4-backport input[type=radio], .bootstrap-4-backport input[type=checkbox] { box-sizing: border-box; padding: 0; } .bootstrap-4-backport textarea { overflow: auto; resize: vertical; } .bootstrap-4-backport fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } .bootstrap-4-backport legend { display: block; width: 100%; max-width: 100%; padding: 0; margin-bottom: 0.5rem; font-size: 1.5rem; line-height: inherit; color: inherit; white-space: normal; } .bootstrap-4-backport progress { vertical-align: baseline; } .bootstrap-4-backport [type=number]::-webkit-inner-spin-button, .bootstrap-4-backport [type=number]::-webkit-outer-spin-button { height: auto; } .bootstrap-4-backport [type=search] { outline-offset: -2px; -webkit-appearance: none; } .bootstrap-4-backport [type=search]::-webkit-search-decoration { -webkit-appearance: none; } .bootstrap-4-backport ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; } .bootstrap-4-backport output { display: inline-block; } .bootstrap-4-backport summary { display: list-item; cursor: pointer; } .bootstrap-4-backport template { display: none; } .bootstrap-4-backport [hidden] { display: none !important; } .bootstrap-4-backport h1, .bootstrap-4-backport h2, .bootstrap-4-backport h3, .bootstrap-4-backport h4, .bootstrap-4-backport h5, .bootstrap-4-backport h6, .bootstrap-4-backport .h1, .bootstrap-4-backport .h2, .bootstrap-4-backport .h3, .bootstrap-4-backport .h4, .bootstrap-4-backport .h5, .bootstrap-4-backport .h6 { margin-bottom: 0.5rem; font-weight: 500; line-height: 1.2; } .bootstrap-4-backport h1, .bootstrap-4-backport .h1 { font-size: 2.5rem; } .bootstrap-4-backport h2, .bootstrap-4-backport .h2 { font-size: 2rem; } .bootstrap-4-backport h3, .bootstrap-4-backport .h3 { font-size: 1.75rem; } .bootstrap-4-backport h4, .bootstrap-4-backport .h4 { font-size: 1.5rem; } .bootstrap-4-backport h5, .bootstrap-4-backport .h5 { font-size: 1.25rem; } .bootstrap-4-backport h6, .bootstrap-4-backport .h6 { font-size: 1rem; } .bootstrap-4-backport .lead { font-size: 1.25rem; font-weight: 300; } .bootstrap-4-backport .display-1 { font-size: 6rem; font-weight: 300; line-height: 1.2; } .bootstrap-4-backport .display-2 { font-size: 5.5rem; font-weight: 300; line-height: 1.2; } .bootstrap-4-backport .display-3 { font-size: 4.5rem; font-weight: 300; line-height: 1.2; } .bootstrap-4-backport .display-4 { font-size: 3.5rem; font-weight: 300; line-height: 1.2; } .bootstrap-4-backport hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); } .bootstrap-4-backport small, .bootstrap-4-backport .small { font-size: 80%; font-weight: 400; } .bootstrap-4-backport mark, .bootstrap-4-backport .mark { padding: 0.2em; background-color: #fcf8e3; } .bootstrap-4-backport .list-unstyled { padding-left: 0; list-style: none; } .bootstrap-4-backport .list-inline { padding-left: 0; list-style: none; } .bootstrap-4-backport .list-inline-item { display: inline-block; } .bootstrap-4-backport .list-inline-item:not(:last-child) { margin-right: 0.5rem; } .bootstrap-4-backport .initialism { font-size: 90%; text-transform: uppercase; } .bootstrap-4-backport .blockquote { margin-bottom: 1rem; font-size: 1.25rem; } .bootstrap-4-backport .blockquote-footer { display: block; font-size: 80%; color: #6c757d; } .bootstrap-4-backport .blockquote-footer::before { content: "— "; } .bootstrap-4-backport .img-fluid { max-width: 100%; height: auto; } .bootstrap-4-backport .img-thumbnail { padding: 0.25rem; background-color: #fff; border: 1px solid #dee2e6; border-radius: 0.2rem; max-width: 100%; height: auto; } .bootstrap-4-backport .figure { display: inline-block; } .bootstrap-4-backport .figure-img { margin-bottom: 0.5rem; line-height: 1; } .bootstrap-4-backport .figure-caption { font-size: 90%; color: #6c757d; } .bootstrap-4-backport code { font-size: 87.5%; color: #e83e8c; word-wrap: break-word; } a > .bootstrap-4-backport code { color: inherit; } .bootstrap-4-backport kbd { padding: 0.2rem 0.4rem; font-size: 87.5%; color: #fff; background-color: #212529; border-radius: 0.2rem; } .bootstrap-4-backport kbd kbd { padding: 0; font-size: 100%; font-weight: 700; } .bootstrap-4-backport pre { display: block; font-size: 87.5%; color: #212529; } .bootstrap-4-backport pre code { font-size: inherit; color: inherit; word-break: normal; } .bootstrap-4-backport .pre-scrollable { max-height: 340px; overflow-y: scroll; } .bootstrap-4-backport .container, .bootstrap-4-backport .container-fluid, .bootstrap-4-backport .container-xl, .bootstrap-4-backport .container-lg, .bootstrap-4-backport .container-md, .bootstrap-4-backport .container-sm { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } @media (min-width: 576px) { .bootstrap-4-backport .container-sm, .bootstrap-4-backport .container { max-width: 540px; } } @media (min-width: 768px) { .bootstrap-4-backport .container-md, .bootstrap-4-backport .container-sm, .bootstrap-4-backport .container { max-width: 720px; } } @media (min-width: 992px) { .bootstrap-4-backport .container-lg, .bootstrap-4-backport .container-md, .bootstrap-4-backport .container-sm, .bootstrap-4-backport .container { max-width: 960px; } } @media (min-width: 1200px) { .bootstrap-4-backport .container-xl, .bootstrap-4-backport .container-lg, .bootstrap-4-backport .container-md, .bootstrap-4-backport .container-sm, .bootstrap-4-backport .container { max-width: 1140px; } } .bootstrap-4-backport .row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .bootstrap-4-backport .no-gutters { margin-right: 0; margin-left: 0; } .bootstrap-4-backport .no-gutters > .col, .bootstrap-4-backport .no-gutters > [class*=col-] { padding-right: 0; padding-left: 0; } .bootstrap-4-backport .col-xl, .bootstrap-4-backport .col-xl-auto, .bootstrap-4-backport .col-xl-12, .bootstrap-4-backport .col-xl-11, .bootstrap-4-backport .col-xl-10, .bootstrap-4-backport .col-xl-9, .bootstrap-4-backport .col-xl-8, .bootstrap-4-backport .col-xl-7, .bootstrap-4-backport .col-xl-6, .bootstrap-4-backport .col-xl-5, .bootstrap-4-backport .col-xl-4, .bootstrap-4-backport .col-xl-3, .bootstrap-4-backport .col-xl-2, .bootstrap-4-backport .col-xl-1, .bootstrap-4-backport .col-lg, .bootstrap-4-backport .col-lg-auto, .bootstrap-4-backport .col-lg-12, .bootstrap-4-backport .col-lg-11, .bootstrap-4-backport .col-lg-10, .bootstrap-4-backport .col-lg-9, .bootstrap-4-backport .col-lg-8, .bootstrap-4-backport .col-lg-7, .bootstrap-4-backport .col-lg-6, .bootstrap-4-backport .col-lg-5, .bootstrap-4-backport .col-lg-4, .bootstrap-4-backport .col-lg-3, .bootstrap-4-backport .col-lg-2, .bootstrap-4-backport .col-lg-1, .bootstrap-4-backport .col-md, .bootstrap-4-backport .col-md-auto, .bootstrap-4-backport .col-md-12, .bootstrap-4-backport .col-md-11, .bootstrap-4-backport .col-md-10, .bootstrap-4-backport .col-md-9, .bootstrap-4-backport .col-md-8, .bootstrap-4-backport .col-md-7, .bootstrap-4-backport .col-md-6, .bootstrap-4-backport .col-md-5, .bootstrap-4-backport .col-md-4, .bootstrap-4-backport .col-md-3, .bootstrap-4-backport .col-md-2, .bootstrap-4-backport .col-md-1, .bootstrap-4-backport .col-sm, .bootstrap-4-backport .col-sm-auto, .bootstrap-4-backport .col-sm-12, .bootstrap-4-backport .col-sm-11, .bootstrap-4-backport .col-sm-10, .bootstrap-4-backport .col-sm-9, .bootstrap-4-backport .col-sm-8, .bootstrap-4-backport .col-sm-7, .bootstrap-4-backport .col-sm-6, .bootstrap-4-backport .col-sm-5, .bootstrap-4-backport .col-sm-4, .bootstrap-4-backport .col-sm-3, .bootstrap-4-backport .col-sm-2, .bootstrap-4-backport .col-sm-1, .bootstrap-4-backport .col, .bootstrap-4-backport .col-auto, .bootstrap-4-backport .col-12, .bootstrap-4-backport .col-11, .bootstrap-4-backport .col-10, .bootstrap-4-backport .col-9, .bootstrap-4-backport .col-8, .bootstrap-4-backport .col-7, .bootstrap-4-backport .col-6, .bootstrap-4-backport .col-5, .bootstrap-4-backport .col-4, .bootstrap-4-backport .col-3, .bootstrap-4-backport .col-2, .bootstrap-4-backport .col-1 { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } .bootstrap-4-backport .col { flex-basis: 0; flex-grow: 1; max-width: 100%; } .bootstrap-4-backport .row-cols-1 > * { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .row-cols-2 > * { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .row-cols-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-4-backport .row-cols-4 > * { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .row-cols-5 > * { flex: 0 0 20%; max-width: 20%; } .bootstrap-4-backport .row-cols-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-4-backport .col-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-4-backport .col-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .bootstrap-4-backport .col-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .bootstrap-4-backport .col-3 { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .col-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .bootstrap-4-backport .col-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .bootstrap-4-backport .col-6 { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .col-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .bootstrap-4-backport .col-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .bootstrap-4-backport .col-9 { flex: 0 0 75%; max-width: 75%; } .bootstrap-4-backport .col-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .bootstrap-4-backport .col-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .bootstrap-4-backport .col-12 { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .order-first { order: -1; } .bootstrap-4-backport .order-last { order: 13; } .bootstrap-4-backport .order-0 { order: 0; } .bootstrap-4-backport .order-1 { order: 1; } .bootstrap-4-backport .order-2 { order: 2; } .bootstrap-4-backport .order-3 { order: 3; } .bootstrap-4-backport .order-4 { order: 4; } .bootstrap-4-backport .order-5 { order: 5; } .bootstrap-4-backport .order-6 { order: 6; } .bootstrap-4-backport .order-7 { order: 7; } .bootstrap-4-backport .order-8 { order: 8; } .bootstrap-4-backport .order-9 { order: 9; } .bootstrap-4-backport .order-10 { order: 10; } .bootstrap-4-backport .order-11 { order: 11; } .bootstrap-4-backport .order-12 { order: 12; } .bootstrap-4-backport .offset-1 { margin-left: 8.33333333%; } .bootstrap-4-backport .offset-2 { margin-left: 16.66666667%; } .bootstrap-4-backport .offset-3 { margin-left: 25%; } .bootstrap-4-backport .offset-4 { margin-left: 33.33333333%; } .bootstrap-4-backport .offset-5 { margin-left: 41.66666667%; } .bootstrap-4-backport .offset-6 { margin-left: 50%; } .bootstrap-4-backport .offset-7 { margin-left: 58.33333333%; } .bootstrap-4-backport .offset-8 { margin-left: 66.66666667%; } .bootstrap-4-backport .offset-9 { margin-left: 75%; } .bootstrap-4-backport .offset-10 { margin-left: 83.33333333%; } .bootstrap-4-backport .offset-11 { margin-left: 91.66666667%; } @media (min-width: 576px) { .bootstrap-4-backport .col-sm { flex-basis: 0; flex-grow: 1; max-width: 100%; } .bootstrap-4-backport .row-cols-sm-1 > * { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .row-cols-sm-2 > * { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .row-cols-sm-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-4-backport .row-cols-sm-4 > * { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .row-cols-sm-5 > * { flex: 0 0 20%; max-width: 20%; } .bootstrap-4-backport .row-cols-sm-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-4-backport .col-sm-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-4-backport .col-sm-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .bootstrap-4-backport .col-sm-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .bootstrap-4-backport .col-sm-3 { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .col-sm-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .bootstrap-4-backport .col-sm-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .bootstrap-4-backport .col-sm-6 { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .col-sm-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .bootstrap-4-backport .col-sm-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .bootstrap-4-backport .col-sm-9 { flex: 0 0 75%; max-width: 75%; } .bootstrap-4-backport .col-sm-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .bootstrap-4-backport .col-sm-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .bootstrap-4-backport .col-sm-12 { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .order-sm-first { order: -1; } .bootstrap-4-backport .order-sm-last { order: 13; } .bootstrap-4-backport .order-sm-0 { order: 0; } .bootstrap-4-backport .order-sm-1 { order: 1; } .bootstrap-4-backport .order-sm-2 { order: 2; } .bootstrap-4-backport .order-sm-3 { order: 3; } .bootstrap-4-backport .order-sm-4 { order: 4; } .bootstrap-4-backport .order-sm-5 { order: 5; } .bootstrap-4-backport .order-sm-6 { order: 6; } .bootstrap-4-backport .order-sm-7 { order: 7; } .bootstrap-4-backport .order-sm-8 { order: 8; } .bootstrap-4-backport .order-sm-9 { order: 9; } .bootstrap-4-backport .order-sm-10 { order: 10; } .bootstrap-4-backport .order-sm-11 { order: 11; } .bootstrap-4-backport .order-sm-12 { order: 12; } .bootstrap-4-backport .offset-sm-0 { margin-left: 0; } .bootstrap-4-backport .offset-sm-1 { margin-left: 8.33333333%; } .bootstrap-4-backport .offset-sm-2 { margin-left: 16.66666667%; } .bootstrap-4-backport .offset-sm-3 { margin-left: 25%; } .bootstrap-4-backport .offset-sm-4 { margin-left: 33.33333333%; } .bootstrap-4-backport .offset-sm-5 { margin-left: 41.66666667%; } .bootstrap-4-backport .offset-sm-6 { margin-left: 50%; } .bootstrap-4-backport .offset-sm-7 { margin-left: 58.33333333%; } .bootstrap-4-backport .offset-sm-8 { margin-left: 66.66666667%; } .bootstrap-4-backport .offset-sm-9 { margin-left: 75%; } .bootstrap-4-backport .offset-sm-10 { margin-left: 83.33333333%; } .bootstrap-4-backport .offset-sm-11 { margin-left: 91.66666667%; } } @media (min-width: 768px) { .bootstrap-4-backport .col-md { flex-basis: 0; flex-grow: 1; max-width: 100%; } .bootstrap-4-backport .row-cols-md-1 > * { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .row-cols-md-2 > * { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .row-cols-md-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-4-backport .row-cols-md-4 > * { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .row-cols-md-5 > * { flex: 0 0 20%; max-width: 20%; } .bootstrap-4-backport .row-cols-md-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-4-backport .col-md-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-4-backport .col-md-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .bootstrap-4-backport .col-md-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .bootstrap-4-backport .col-md-3 { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .col-md-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .bootstrap-4-backport .col-md-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .bootstrap-4-backport .col-md-6 { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .col-md-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .bootstrap-4-backport .col-md-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .bootstrap-4-backport .col-md-9 { flex: 0 0 75%; max-width: 75%; } .bootstrap-4-backport .col-md-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .bootstrap-4-backport .col-md-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .bootstrap-4-backport .col-md-12 { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .order-md-first { order: -1; } .bootstrap-4-backport .order-md-last { order: 13; } .bootstrap-4-backport .order-md-0 { order: 0; } .bootstrap-4-backport .order-md-1 { order: 1; } .bootstrap-4-backport .order-md-2 { order: 2; } .bootstrap-4-backport .order-md-3 { order: 3; } .bootstrap-4-backport .order-md-4 { order: 4; } .bootstrap-4-backport .order-md-5 { order: 5; } .bootstrap-4-backport .order-md-6 { order: 6; } .bootstrap-4-backport .order-md-7 { order: 7; } .bootstrap-4-backport .order-md-8 { order: 8; } .bootstrap-4-backport .order-md-9 { order: 9; } .bootstrap-4-backport .order-md-10 { order: 10; } .bootstrap-4-backport .order-md-11 { order: 11; } .bootstrap-4-backport .order-md-12 { order: 12; } .bootstrap-4-backport .offset-md-0 { margin-left: 0; } .bootstrap-4-backport .offset-md-1 { margin-left: 8.33333333%; } .bootstrap-4-backport .offset-md-2 { margin-left: 16.66666667%; } .bootstrap-4-backport .offset-md-3 { margin-left: 25%; } .bootstrap-4-backport .offset-md-4 { margin-left: 33.33333333%; } .bootstrap-4-backport .offset-md-5 { margin-left: 41.66666667%; } .bootstrap-4-backport .offset-md-6 { margin-left: 50%; } .bootstrap-4-backport .offset-md-7 { margin-left: 58.33333333%; } .bootstrap-4-backport .offset-md-8 { margin-left: 66.66666667%; } .bootstrap-4-backport .offset-md-9 { margin-left: 75%; } .bootstrap-4-backport .offset-md-10 { margin-left: 83.33333333%; } .bootstrap-4-backport .offset-md-11 { margin-left: 91.66666667%; } } @media (min-width: 992px) { .bootstrap-4-backport .col-lg { flex-basis: 0; flex-grow: 1; max-width: 100%; } .bootstrap-4-backport .row-cols-lg-1 > * { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .row-cols-lg-2 > * { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .row-cols-lg-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-4-backport .row-cols-lg-4 > * { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .row-cols-lg-5 > * { flex: 0 0 20%; max-width: 20%; } .bootstrap-4-backport .row-cols-lg-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-4-backport .col-lg-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-4-backport .col-lg-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .bootstrap-4-backport .col-lg-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .bootstrap-4-backport .col-lg-3 { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .col-lg-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .bootstrap-4-backport .col-lg-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .bootstrap-4-backport .col-lg-6 { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .col-lg-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .bootstrap-4-backport .col-lg-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .bootstrap-4-backport .col-lg-9 { flex: 0 0 75%; max-width: 75%; } .bootstrap-4-backport .col-lg-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .bootstrap-4-backport .col-lg-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .bootstrap-4-backport .col-lg-12 { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .order-lg-first { order: -1; } .bootstrap-4-backport .order-lg-last { order: 13; } .bootstrap-4-backport .order-lg-0 { order: 0; } .bootstrap-4-backport .order-lg-1 { order: 1; } .bootstrap-4-backport .order-lg-2 { order: 2; } .bootstrap-4-backport .order-lg-3 { order: 3; } .bootstrap-4-backport .order-lg-4 { order: 4; } .bootstrap-4-backport .order-lg-5 { order: 5; } .bootstrap-4-backport .order-lg-6 { order: 6; } .bootstrap-4-backport .order-lg-7 { order: 7; } .bootstrap-4-backport .order-lg-8 { order: 8; } .bootstrap-4-backport .order-lg-9 { order: 9; } .bootstrap-4-backport .order-lg-10 { order: 10; } .bootstrap-4-backport .order-lg-11 { order: 11; } .bootstrap-4-backport .order-lg-12 { order: 12; } .bootstrap-4-backport .offset-lg-0 { margin-left: 0; } .bootstrap-4-backport .offset-lg-1 { margin-left: 8.33333333%; } .bootstrap-4-backport .offset-lg-2 { margin-left: 16.66666667%; } .bootstrap-4-backport .offset-lg-3 { margin-left: 25%; } .bootstrap-4-backport .offset-lg-4 { margin-left: 33.33333333%; } .bootstrap-4-backport .offset-lg-5 { margin-left: 41.66666667%; } .bootstrap-4-backport .offset-lg-6 { margin-left: 50%; } .bootstrap-4-backport .offset-lg-7 { margin-left: 58.33333333%; } .bootstrap-4-backport .offset-lg-8 { margin-left: 66.66666667%; } .bootstrap-4-backport .offset-lg-9 { margin-left: 75%; } .bootstrap-4-backport .offset-lg-10 { margin-left: 83.33333333%; } .bootstrap-4-backport .offset-lg-11 { margin-left: 91.66666667%; } } @media (min-width: 1200px) { .bootstrap-4-backport .col-xl { flex-basis: 0; flex-grow: 1; max-width: 100%; } .bootstrap-4-backport .row-cols-xl-1 > * { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .row-cols-xl-2 > * { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .row-cols-xl-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-4-backport .row-cols-xl-4 > * { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .row-cols-xl-5 > * { flex: 0 0 20%; max-width: 20%; } .bootstrap-4-backport .row-cols-xl-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-4-backport .col-xl-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-4-backport .col-xl-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .bootstrap-4-backport .col-xl-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .bootstrap-4-backport .col-xl-3 { flex: 0 0 25%; max-width: 25%; } .bootstrap-4-backport .col-xl-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .bootstrap-4-backport .col-xl-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .bootstrap-4-backport .col-xl-6 { flex: 0 0 50%; max-width: 50%; } .bootstrap-4-backport .col-xl-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .bootstrap-4-backport .col-xl-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .bootstrap-4-backport .col-xl-9 { flex: 0 0 75%; max-width: 75%; } .bootstrap-4-backport .col-xl-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .bootstrap-4-backport .col-xl-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .bootstrap-4-backport .col-xl-12 { flex: 0 0 100%; max-width: 100%; } .bootstrap-4-backport .order-xl-first { order: -1; } .bootstrap-4-backport .order-xl-last { order: 13; } .bootstrap-4-backport .order-xl-0 { order: 0; } .bootstrap-4-backport .order-xl-1 { order: 1; } .bootstrap-4-backport .order-xl-2 { order: 2; } .bootstrap-4-backport .order-xl-3 { order: 3; } .bootstrap-4-backport .order-xl-4 { order: 4; } .bootstrap-4-backport .order-xl-5 { order: 5; } .bootstrap-4-backport .order-xl-6 { order: 6; } .bootstrap-4-backport .order-xl-7 { order: 7; } .bootstrap-4-backport .order-xl-8 { order: 8; } .bootstrap-4-backport .order-xl-9 { order: 9; } .bootstrap-4-backport .order-xl-10 { order: 10; } .bootstrap-4-backport .order-xl-11 { order: 11; } .bootstrap-4-backport .order-xl-12 { order: 12; } .bootstrap-4-backport .offset-xl-0 { margin-left: 0; } .bootstrap-4-backport .offset-xl-1 { margin-left: 8.33333333%; } .bootstrap-4-backport .offset-xl-2 { margin-left: 16.66666667%; } .bootstrap-4-backport .offset-xl-3 { margin-left: 25%; } .bootstrap-4-backport .offset-xl-4 { margin-left: 33.33333333%; } .bootstrap-4-backport .offset-xl-5 { margin-left: 41.66666667%; } .bootstrap-4-backport .offset-xl-6 { margin-left: 50%; } .bootstrap-4-backport .offset-xl-7 { margin-left: 58.33333333%; } .bootstrap-4-backport .offset-xl-8 { margin-left: 66.66666667%; } .bootstrap-4-backport .offset-xl-9 { margin-left: 75%; } .bootstrap-4-backport .offset-xl-10 { margin-left: 83.33333333%; } .bootstrap-4-backport .offset-xl-11 { margin-left: 91.66666667%; } } .bootstrap-4-backport .table { width: 100%; margin-bottom: 1rem; color: #212529; } .bootstrap-4-backport .table th, .bootstrap-4-backport .table td { padding: 0.75rem; vertical-align: top; border-top: 1px solid #dee2e6; } .bootstrap-4-backport .table thead th { vertical-align: bottom; border-bottom: 2px solid #dee2e6; } .bootstrap-4-backport .table tbody + tbody { border-top: 2px solid #dee2e6; } .bootstrap-4-backport .table-sm th, .bootstrap-4-backport .table-sm td { padding: 0.3rem; } .bootstrap-4-backport .table-bordered { border: 1px solid #dee2e6; } .bootstrap-4-backport .table-bordered th, .bootstrap-4-backport .table-bordered td { border: 1px solid #dee2e6; } .bootstrap-4-backport .table-bordered thead th, .bootstrap-4-backport .table-bordered thead td { border-bottom-width: 2px; } .bootstrap-4-backport .table-borderless th, .bootstrap-4-backport .table-borderless td, .bootstrap-4-backport .table-borderless thead th, .bootstrap-4-backport .table-borderless tbody + tbody { border: 0; } .bootstrap-4-backport .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0, 0, 0, 0.05); } .bootstrap-4-backport .table-hover tbody tr:hover { color: #212529; background-color: rgba(0, 0, 0, 0.075); } .bootstrap-4-backport .table-primary, .bootstrap-4-backport .table-primary > th, .bootstrap-4-backport .table-primary > td { background-color: #cadae4; } .bootstrap-4-backport .table-primary th, .bootstrap-4-backport .table-primary td, .bootstrap-4-backport .table-primary thead th, .bootstrap-4-backport .table-primary tbody + tbody { border-color: #9cbace; } .bootstrap-4-backport .table-hover .table-primary:hover { background-color: #b9cedb; } .bootstrap-4-backport .table-hover .table-primary:hover > td, .bootstrap-4-backport .table-hover .table-primary:hover > th { background-color: #b9cedb; } .bootstrap-4-backport .table-secondary, .bootstrap-4-backport .table-secondary > th, .bootstrap-4-backport .table-secondary > td { background-color: #cbe0dd; } .bootstrap-4-backport .table-secondary th, .bootstrap-4-backport .table-secondary td, .bootstrap-4-backport .table-secondary thead th, .bootstrap-4-backport .table-secondary tbody + tbody { border-color: #9fc6c0; } .bootstrap-4-backport .table-hover .table-secondary:hover { background-color: #bbd6d3; } .bootstrap-4-backport .table-hover .table-secondary:hover > td, .bootstrap-4-backport .table-hover .table-secondary:hover > th { background-color: #bbd6d3; } .bootstrap-4-backport .table-success, .bootstrap-4-backport .table-success > th, .bootstrap-4-backport .table-success > td { background-color: #c3e6cb; } .bootstrap-4-backport .table-success th, .bootstrap-4-backport .table-success td, .bootstrap-4-backport .table-success thead th, .bootstrap-4-backport .table-success tbody + tbody { border-color: #8fd19e; } .bootstrap-4-backport .table-hover .table-success:hover { background-color: #b1dfbb; } .bootstrap-4-backport .table-hover .table-success:hover > td, .bootstrap-4-backport .table-hover .table-success:hover > th { background-color: #b1dfbb; } .bootstrap-4-backport .table-info, .bootstrap-4-backport .table-info > th, .bootstrap-4-backport .table-info > td { background-color: #bee5eb; } .bootstrap-4-backport .table-info th, .bootstrap-4-backport .table-info td, .bootstrap-4-backport .table-info thead th, .bootstrap-4-backport .table-info tbody + tbody { border-color: #86cfda; } .bootstrap-4-backport .table-hover .table-info:hover { background-color: #abdde5; } .bootstrap-4-backport .table-hover .table-info:hover > td, .bootstrap-4-backport .table-hover .table-info:hover > th { background-color: #abdde5; } .bootstrap-4-backport .table-warning, .bootstrap-4-backport .table-warning > th, .bootstrap-4-backport .table-warning > td { background-color: #ffeeba; } .bootstrap-4-backport .table-warning th, .bootstrap-4-backport .table-warning td, .bootstrap-4-backport .table-warning thead th, .bootstrap-4-backport .table-warning tbody + tbody { border-color: #ffdf7e; } .bootstrap-4-backport .table-hover .table-warning:hover { background-color: #ffe8a1; } .bootstrap-4-backport .table-hover .table-warning:hover > td, .bootstrap-4-backport .table-hover .table-warning:hover > th { background-color: #ffe8a1; } .bootstrap-4-backport .table-danger, .bootstrap-4-backport .table-danger > th, .bootstrap-4-backport .table-danger > td { background-color: #f5c6cb; } .bootstrap-4-backport .table-danger th, .bootstrap-4-backport .table-danger td, .bootstrap-4-backport .table-danger thead th, .bootstrap-4-backport .table-danger tbody + tbody { border-color: #ed969e; } .bootstrap-4-backport .table-hover .table-danger:hover { background-color: #f1b0b7; } .bootstrap-4-backport .table-hover .table-danger:hover > td, .bootstrap-4-backport .table-hover .table-danger:hover > th { background-color: #f1b0b7; } .bootstrap-4-backport .table-light, .bootstrap-4-backport .table-light > th, .bootstrap-4-backport .table-light > td { background-color: #fdfdfe; } .bootstrap-4-backport .table-light th, .bootstrap-4-backport .table-light td, .bootstrap-4-backport .table-light thead th, .bootstrap-4-backport .table-light tbody + tbody { border-color: #fbfcfc; } .bootstrap-4-backport .table-hover .table-light:hover { background-color: #ececf6; } .bootstrap-4-backport .table-hover .table-light:hover > td, .bootstrap-4-backport .table-hover .table-light:hover > th { background-color: #ececf6; } .bootstrap-4-backport .table-dark, .bootstrap-4-backport .table-dark > th, .bootstrap-4-backport .table-dark > td { background-color: #c6c8ca; } .bootstrap-4-backport .table-dark th, .bootstrap-4-backport .table-dark td, .bootstrap-4-backport .table-dark thead th, .bootstrap-4-backport .table-dark tbody + tbody { border-color: #95999c; } .bootstrap-4-backport .table-hover .table-dark:hover { background-color: #b9bbbe; } .bootstrap-4-backport .table-hover .table-dark:hover > td, .bootstrap-4-backport .table-hover .table-dark:hover > th { background-color: #b9bbbe; } .bootstrap-4-backport .table-active, .bootstrap-4-backport .table-active > th, .bootstrap-4-backport .table-active > td { background-color: rgba(0, 0, 0, 0.075); } .bootstrap-4-backport .table-hover .table-active:hover { background-color: rgba(0, 0, 0, 0.075); } .bootstrap-4-backport .table-hover .table-active:hover > td, .bootstrap-4-backport .table-hover .table-active:hover > th { background-color: rgba(0, 0, 0, 0.075); } .bootstrap-4-backport .table .thead-dark th { color: #fff; background-color: #343a40; border-color: #454d55; } .bootstrap-4-backport .table .thead-light th { color: #495057; background-color: #e9ecef; border-color: #dee2e6; } .bootstrap-4-backport .table-dark { color: #fff; background-color: #343a40; } .bootstrap-4-backport .table-dark th, .bootstrap-4-backport .table-dark td, .bootstrap-4-backport .table-dark thead th { border-color: #454d55; } .bootstrap-4-backport .table-dark.table-bordered { border: 0; } .bootstrap-4-backport .table-dark.table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, 0.05); } .bootstrap-4-backport .table-dark.table-hover tbody tr:hover { color: #fff; background-color: rgba(255, 255, 255, 0.075); } @media (max-width: 575.98px) { .bootstrap-4-backport .table-responsive-sm { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .bootstrap-4-backport .table-responsive-sm > .table-bordered { border: 0; } } @media (max-width: 767.98px) { .bootstrap-4-backport .table-responsive-md { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .bootstrap-4-backport .table-responsive-md > .table-bordered { border: 0; } } @media (max-width: 991.98px) { .bootstrap-4-backport .table-responsive-lg { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .bootstrap-4-backport .table-responsive-lg > .table-bordered { border: 0; } } @media (max-width: 1199.98px) { .bootstrap-4-backport .table-responsive-xl { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .bootstrap-4-backport .table-responsive-xl > .table-bordered { border: 0; } } .bootstrap-4-backport .table-responsive { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .bootstrap-4-backport .table-responsive > .table-bordered { border: 0; } .bootstrap-4-backport .form-control { display: block; width: 100%; height: 50px; padding: 0.5rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #dcdcdc; border-radius: 2px; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } @media (prefers-reduced-motion: reduce) { .bootstrap-4-backport .form-control { transition: none; } } .bootstrap-4-backport .form-control::-ms-expand { background-color: transparent; border: 0; } .bootstrap-4-backport .form-control:focus { color: #495057; background-color: #fff; border-color: #8eb8d2; outline: 0; box-shadow: 0 0 0 0.2rem rgba(64, 123, 160, 0.25); } .bootstrap-4-backport .form-control::placeholder { color: #6c757d; opacity: 1; } .bootstrap-4-backport .form-control:disabled, .bootstrap-4-backport .form-control[readonly] { background-color: #e9ecef; opacity: 1; } .bootstrap-4-backport input[type=date].form-control, .bootstrap-4-backport input[type=time].form-control, .bootstrap-4-backport input[type=datetime-local].form-control, .bootstrap-4-backport input[type=month].form-control { appearance: none; } .bootstrap-4-backport select.form-control:-moz-focusring { color: transparent; text-shadow: 0 0 0 #495057; } .bootstrap-4-backport select.form-control:focus::-ms-value { color: #495057; background-color: #fff; } .bootstrap-4-backport .form-control-file, .bootstrap-4-backport .form-control-range { display: block; width: 100%; } .bootstrap-4-backport .col-form-label { padding-top: calc(0.5rem + 1px); padding-bottom: calc(0.5rem + 1px); margin-bottom: 0; font-size: inherit; line-height: 1.5; } .bootstrap-4-backport .col-form-label-lg { padding-top: calc(0.5rem + 1px); padding-bottom: calc(0.5rem + 1px); font-size: 1.25rem; line-height: 1.5; } .bootstrap-4-backport .col-form-label-sm { padding-top: calc(0.25rem + 1px); padding-bottom: calc(0.25rem + 1px); font-size: 0.875rem; line-height: 1.5; } .bootstrap-4-backport .form-control-plaintext { display: block; width: 100%; padding: 0.5rem 0; margin-bottom: 0; font-size: 1rem; line-height: 1.5; color: #212529; background-color: transparent; border: solid transparent; border-width: 1px 0; } .bootstrap-4-backport .form-control-plaintext.form-control-sm, .bootstrap-4-backport .form-control-plaintext.form-control-lg { padding-right: 0; padding-left: 0; } .bootstrap-4-backport .form-control-sm { height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 0.2rem; } .bootstrap-4-backport .form-control-lg { height: calc(1.5em + 1rem + 2px); padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.3rem; } .bootstrap-4-backport select.form-control[size], .bootstrap-4-backport select.form-control[multiple] { height: auto; } .bootstrap-4-backport textarea.form-control { height: auto; } .bootstrap-4-backport .form-group { margin-bottom: 1rem; } .bootstrap-4-backport .form-text { display: block; margin-top: 0.25rem; } .bootstrap-4-backport .form-row { display: flex; flex-wrap: wrap; margin-right: -5px; margin-left: -5px; } .bootstrap-4-backport .form-row > .col, .bootstrap-4-backport .form-row > [class*=col-] { padding-right: 5px; padding-left: 5px; } .bootstrap-4-backport .form-check { position: relative; display: block; padding-left: 1.25rem; } .bootstrap-4-backport .form-check-input { position: absolute; margin-top: 0.3rem; margin-left: -1.25rem; } .bootstrap-4-backport .form-check-input[disabled] ~ .form-check-label, .bootstrap-4-backport .form-check-input:disabled ~ .form-check-label { color: #6c757d; } .bootstrap-4-backport .form-check-label { margin-bottom: 0; } .bootstrap-4-backport .form-check-inline { display: inline-flex; align-items: center; padding-left: 0; margin-right: 0.75rem; } .bootstrap-4-backport .form-check-inline .form-check-input { position: static; margin-top: 0; margin-right: 0.3125rem; margin-left: 0; } .bootstrap-4-backport .valid-feedback { display: none; width: 100%; margin-top: 0.25rem; font-size: 80%; color: #28a745; } .bootstrap-4-backport .valid-tooltip { position: absolute; top: 100%; left: 0; z-index: 5; display: none; max-width: 100%; padding: 0.25rem 0.5rem; margin-top: 0.1rem; font-size: 0.875rem; line-height: 1.5; color: #fff; background-color: rgba(40, 167, 69, 0.9); border-radius: 0.2rem; } .form-row > .col > .bootstrap-4-backport .valid-tooltip, .form-row > [class*=col-] > .bootstrap-4-backport .valid-tooltip { left: 5px; } .was-validated .bootstrap-4-backport:valid ~ .valid-feedback, .was-validated .bootstrap-4-backport:valid ~ .valid-tooltip, .bootstrap-4-backport.is-valid ~ .valid-feedback, .bootstrap-4-backport.is-valid ~ .valid-tooltip { display: block; } .was-validated .bootstrap-4-backport .form-control:valid, .bootstrap-4-backport .form-control.is-valid { border-color: #28a745; padding-right: calc(1.5em + 1rem) !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.25rem) center; background-size: calc(0.75em + 0.5rem) calc(0.75em + 0.5rem); } .was-validated .bootstrap-4-backport .form-control:valid:focus, .bootstrap-4-backport .form-control.is-valid:focus { border-color: #28a745; box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25); } .was-validated .bootstrap-4-backport select.form-control:valid, .bootstrap-4-backport select.form-control.is-valid { padding-right: 3rem !important; background-position: right 1.5rem center; } .was-validated .bootstrap-4-backport textarea.form-control:valid, .bootstrap-4-backport textarea.form-control.is-valid { padding-right: calc(1.5em + 1rem); background-position: top calc(0.375em + 0.25rem) right calc(0.375em + 0.25rem); } .was-validated .bootstrap-4-backport .custom-select:valid, .bootstrap-4-backport .custom-select.is-valid { border-color: #28a745; padding-right: calc(0.75em + 2.5rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") right 0.75rem center/8px 10px no-repeat, #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") center right 1.75rem/calc(0.75em + 0.5rem) calc(0.75em + 0.5rem) no-repeat; } .was-validated .bootstrap-4-backport .custom-select:valid:focus, .bootstrap-4-backport .custom-select.is-valid:focus { border-color: #28a745; box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25); } .was-validated .bootstrap-4-backport .form-check-input:valid ~ .form-check-label, .bootstrap-4-backport .form-check-input.is-valid ~ .form-check-label { color: #28a745; } .was-validated .bootstrap-4-backport .form-check-input:valid ~ .valid-feedback, .was-validated .bootstrap-4-backport .form-check-input:valid ~ .valid-tooltip, .bootstrap-4-backport .form-check-input.is-valid ~ .valid-feedback, .bootstrap-4-backport .form-check-input.is-valid ~ .valid-tooltip { display: block; } .was-validated .bootstrap-4-backport .custom-control-input:valid ~ .custom-control-label, .bootstrap-4-backport .custom-control-input.is-valid ~ .custom-control-label { color: #28a745; } .was-validated .bootstrap-4-backport .custom-control-input:valid ~ .custom-control-label::before, .bootstrap-4-backport .custom-control-input.is-valid ~ .custom-control-label::before { border-color: #28a745; } .was-validated .bootstrap-4-backport .custom-control-input:valid:checked ~ .custom-control-label::before, .bootstrap-4-backport .custom-control-input.is-valid:checked ~ .custom-control-label::before { border-color: #34ce57; background-color: #34ce57; } .was-validated .bootstrap-4-backport .custom-control-input:valid:focus ~ .custom-control-label::before, .bootstrap-4-backport .custom-control-input.is-valid:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25); } .was-validated .bootstrap-4-backport .custom-control-input:valid:focus:not(:checked) ~ .custom-control-label::before, .bootstrap-4-backport .custom-control-input.is-valid:focus:not(:checked) ~ .custom-control-label::before { border-colo