// DO NOT EDIT! This is auto-generated from "yarn run generate:startup_css" // Please see the feedback issue for more details and help: // https://gitlab.com/gitlab-org/gitlab/-/issues/331812 @charset "UTF-8"; *, *::before, *::after { box-sizing: border-box; } html { font-family: sans-serif; line-height: 1.15; } header { display: block; } body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Ubuntu, Cantarell, "Helvetica Neue", 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: #303030; text-align: left; background-color: #fff; } hr { box-sizing: content-box; height: 0; overflow: visible; } h1, h3 { margin-top: 0; margin-bottom: 0.25rem; } p { margin-top: 0; margin-bottom: 1rem; } a { color: #1f75cb; text-decoration: none; background-color: transparent; } a:not([href]):not([class]) { color: inherit; text-decoration: none; } img { vertical-align: middle; border-style: none; } svg { overflow: hidden; vertical-align: middle; } label { display: inline-block; margin-bottom: 0.5rem; } button { border-radius: 0; } input, button { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } button, input { overflow: visible; } button { text-transform: none; } [role="button"] { cursor: pointer; } button:not(:disabled), [type="button"]:not(:disabled), [type="submit"]:not(:disabled) { cursor: pointer; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { padding: 0; border-style: none; } input[type="checkbox"] { box-sizing: border-box; padding: 0; } fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } [hidden] { display: none !important; } h1, h3 { margin-bottom: 0.25rem; font-weight: 600; line-height: 1.2; color: #303030; } h1 { font-size: 2.1875rem; } h3 { font-size: 1.53125rem; } hr { margin-top: 0.5rem; margin-bottom: 0.5rem; border: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); } .container { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } @media (min-width: 576px) { .container { max-width: 540px; } } @media (min-width: 768px) { .container { max-width: 720px; } } @media (min-width: 992px) { .container { max-width: 960px; } } @media (min-width: 1200px) { .container { max-width: 1140px; } } .row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .col-md-6, .col-sm-12 { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } .order-1 { order: 1; } .order-12 { order: 12; } @media (min-width: 576px) { .col-sm-12 { flex: 0 0 100%; max-width: 100%; } .order-sm-1 { order: 1; } .order-sm-12 { order: 12; } } @media (min-width: 768px) { .col-md-6 { flex: 0 0 50%; max-width: 50%; } } .form-control { display: block; width: 100%; height: 34px; padding: 0.375rem 0.75rem; font-size: 0.875rem; font-weight: 400; line-height: 1.5; color: #303030; background-color: #fff; background-clip: padding-box; border: 1px solid #868686; border-radius: 0.25rem; } @media (prefers-reduced-motion: reduce) { } .form-control:-moz-focusring { color: transparent; text-shadow: 0 0 0 #303030; } .form-control::placeholder { color: #5e5e5e; opacity: 1; } .form-control:disabled { background-color: #fafafa; opacity: 1; } .form-group { margin-bottom: 1rem; } .btn { display: inline-block; font-weight: 400; color: #303030; text-align: center; vertical-align: middle; user-select: none; background-color: transparent; border: 1px solid transparent; padding: 0.375rem 0.75rem; font-size: 1rem; line-height: 20px; border-radius: 0.25rem; } @media (prefers-reduced-motion: reduce) { } .btn:disabled { opacity: 0.65; } .btn:not(:disabled):not(.disabled) { cursor: pointer; } fieldset:disabled a.btn { pointer-events: none; } .btn-block { display: block; width: 100%; } .btn-block + .btn-block { margin-top: 0.5rem; } input.btn-block[type="submit"], input.btn-block[type="button"] { width: 100%; } .custom-control { position: relative; z-index: 1; display: block; min-height: 1.5rem; padding-left: 1.5rem; color-adjust: exact; } .custom-control-input { position: absolute; left: 0; z-index: -1; width: 1rem; height: 1.25rem; opacity: 0; } .custom-control-input:checked ~ .custom-control-label::before { color: #fff; border-color: #007bff; background-color: #007bff; } .custom-control-input:not(:disabled):active ~ .custom-control-label::before { color: #fff; background-color: #b3d7ff; border-color: #b3d7ff; } .custom-control-input:disabled ~ .custom-control-label { color: #5e5e5e; } .custom-control-input:disabled ~ .custom-control-label::before { background-color: #fafafa; } .custom-control-label { position: relative; margin-bottom: 0; vertical-align: top; } .custom-control-label::before { position: absolute; top: 0.25rem; left: -1.5rem; display: block; width: 1rem; height: 1rem; pointer-events: none; content: ""; background-color: #fff; border: #666 solid 1px; } .custom-control-label::after { position: absolute; top: 0.25rem; left: -1.5rem; display: block; width: 1rem; height: 1rem; content: ""; background: no-repeat 50% / 50% 50%; } .custom-checkbox .custom-control-label::before { border-radius: 0.25rem; } .custom-checkbox .custom-control-input:checked ~ .custom-control-label::after { 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='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e"); } .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before { border-color: #007bff; background-color: #007bff; } .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e"); } .custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before { background-color: rgba(0, 123, 255, 0.5); } .custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before { background-color: rgba(0, 123, 255, 0.5); } @media (prefers-reduced-motion: reduce) { } .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } .navbar { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 0.25rem 0.5rem; } .navbar .container { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } .clearfix::after { display: block; clear: both; content: ""; } .fixed-top { position: fixed; top: 0; right: 0; left: 0; z-index: 1030; } .mt-3 { margin-top: 1rem !important; } .mb-3 { margin-bottom: 1rem !important; } .text-nowrap { white-space: nowrap !important; } .font-weight-normal { font-weight: 400 !important; } .gl-form-input, .gl-form-input.form-control { background-color: #fff; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Ubuntu, Cantarell, "Helvetica Neue", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-size: 0.875rem; line-height: 1rem; padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.75rem; padding-right: 0.75rem; height: auto; color: #303030; box-shadow: inset 0 0 0 1px #868686; border-style: none; appearance: none; -moz-appearance: none; } .gl-form-input:disabled, .gl-form-input:not(.form-control-plaintext):not([type="color"]):read-only, .gl-form-input.form-control:disabled, .gl-form-input.form-control:not(.form-control-plaintext):not([type="color"]):read-only { background-color: #f5f5f5; box-shadow: inset 0 0 0 1px #dbdbdb; } .gl-form-input:disabled, .gl-form-input.form-control:disabled { cursor: not-allowed; color: #666; } .gl-form-input::placeholder, .gl-form-input.form-control::placeholder { color: #868686; } .gl-form-checkbox { font-size: 0.875rem; line-height: 1rem; color: #303030; } .gl-form-checkbox .custom-control-input:disabled, .gl-form-checkbox .custom-control-input:disabled ~ .custom-control-label { cursor: not-allowed; color: #868686; } .gl-form-checkbox.custom-control .custom-control-input ~ .custom-control-label { cursor: pointer; } .gl-form-checkbox.custom-control .custom-control-input ~ .custom-control-label::before, .gl-form-checkbox.custom-control .custom-control-input ~ .custom-control-label::after { top: 0; } .gl-form-checkbox.custom-control .custom-control-input ~ .custom-control-label::before { background-color: #fff; border-color: #868686; } .gl-form-checkbox.custom-control .custom-control-input:checked ~ .custom-control-label::before { background-color: #1f75cb; border-color: #1f75cb; } .gl-form-checkbox.custom-control .custom-control-input[type="checkbox"]:checked ~ .custom-control-label::after, .gl-form-checkbox.custom-control .custom-control-input[type="checkbox"]:indeterminate ~ .custom-control-label::after { background: none; background-color: #fff; mask-repeat: no-repeat; mask-position: center center; } .gl-form-checkbox.custom-control .custom-control-input[type="checkbox"]:checked ~ .custom-control-label::after { mask-image: url('data:image/svg+xml,%3Csvg width="8" height="7" viewBox="0 0 8 7" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M1 3.05299L2.99123 5L7 1" stroke="white" stroke-width="2"/%3E%3C/svg%3E%0A'); } .gl-form-checkbox.custom-control .custom-control-input[type="checkbox"]:indeterminate ~ .custom-control-label::after { mask-image: url('data:image/svg+xml,%3Csvg width="8" height="2" viewBox="0 0 8 2" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M0 1L8 1" stroke="white" stroke-width="2"/%3E%3C/svg%3E%0A'); } .gl-form-checkbox.custom-control.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before { background-color: #1f75cb; border-color: #1f75cb; } .gl-form-checkbox.custom-control .custom-control-input:disabled ~ .custom-control-label { cursor: not-allowed; } .gl-form-checkbox.custom-control .custom-control-input:disabled ~ .custom-control-label::before { background-color: #f0f0f0; border-color: #dbdbdb; pointer-events: auto; } .gl-form-checkbox.custom-control .custom-control-input:checked:disabled ~ .custom-control-label::before, .gl-form-checkbox.custom-control .custom-control-input[type="checkbox"]:indeterminate:disabled ~ .custom-control-label::before { background-color: #dbdbdb; border-color: #dbdbdb; } .gl-form-checkbox.custom-control .custom-control-input:checked:disabled ~ .custom-control-label::after, .gl-form-checkbox.custom-control .custom-control-input[type="checkbox"]:indeterminate:disabled ~ .custom-control-label::after { background-color: #5e5e5e; } .gl-button { display: inline-flex; } .gl-button:not(.btn-link):active { text-decoration: none; } .gl-button.gl-button, .gl-button.gl-button.btn-block { border-width: 0; padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 0.75rem; padding-right: 0.75rem; background-color: transparent; line-height: 1rem; color: #303030; fill: currentColor; box-shadow: inset 0 0 0 1px #bfbfbf; justify-content: center; align-items: center; font-size: 0.875rem; border-radius: 0.25rem; } .gl-button.gl-button .gl-button-text, .gl-button.gl-button.btn-block .gl-button-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-top: 1px; padding-bottom: 1px; margin-top: -1px; margin-bottom: -1px; } .gl-button.gl-button .gl-button-icon, .gl-button.gl-button.btn-block .gl-button-icon { height: 1rem; width: 1rem; flex-shrink: 0; margin-right: 0.25rem; top: auto; } .gl-button.gl-button.btn-default, .gl-button.gl-button.btn-block.btn-default { background-color: #fff; } .gl-button.gl-button.btn-default:active, .gl-button.gl-button.btn-default.active, .gl-button.gl-button.btn-block.btn-default:active, .gl-button.gl-button.btn-block.btn-default.active { box-shadow: inset 0 0 0 1px #5e5e5e, 0 0 0 1px #fff, 0 0 0 3px #428fdc; outline: none; background-color: #dbdbdb; } .gl-button.gl-button.btn-confirm, .gl-button.gl-button.btn-block.btn-confirm { color: #fff; } .gl-button.gl-button.btn-confirm, .gl-button.gl-button.btn-block.btn-confirm { background-color: #1f75cb; box-shadow: inset 0 0 0 1px #1068bf; } .gl-button.gl-button.btn-confirm:active, .gl-button.gl-button.btn-confirm.active, .gl-button.gl-button.btn-block.btn-confirm:active, .gl-button.gl-button.btn-block.btn-confirm.active { box-shadow: inset 0 0 0 1px #033464, 0 0 0 1px #fff, 0 0 0 3px #428fdc; outline: none; background-color: #0b5cad; } body { font-size: 0.875rem; } button, html [type="button"], [type="submit"], [role="button"] { cursor: pointer; } h1, h3 { margin-top: 20px; margin-bottom: 10px; } hr { overflow: hidden; } svg { vertical-align: baseline; } .form-control { font-size: 0.875rem; } .hidden { display: none !important; visibility: hidden !important; } html { overflow-y: scroll; } body.navless { background-color: #fff !important; } .container { padding-top: 0; z-index: 5; } .container .content { margin: 0; } @media (max-width: 575.98px) { .container .content { margin-top: 20px; } } .navless-container { margin-top: var(--header-height, 48px); padding-top: 32px; } .btn { border-radius: 4px; font-size: 0.875rem; font-weight: 400; padding: 6px 10px; background-color: #fff; border-color: #dbdbdb; color: #303030; color: #303030; white-space: nowrap; } .btn:active { background-color: #f0f0f0; box-shadow: none; } .btn:active, .btn.active { background-color: #eaeaea; border-color: #e3e3e3; color: #303030; } .btn svg { height: 15px; width: 15px; } .btn svg:not(:last-child) { margin-right: 5px; } .btn-block { width: 100%; margin: 0; margin-bottom: 1rem; } .btn-block.btn { padding: 6px 0; } .tab-content { overflow: visible; } @media (max-width: 767.98px) { .tab-content { isolation: isolate; } } hr { margin: 1.5rem 0; border-top: 1px solid #eee; } .footer-links { margin-bottom: 20px; } .footer-links a { margin-right: 15px; } .flash-container { margin: 0; margin-bottom: 16px; font-size: 14px; position: relative; z-index: 1; } .flash-container.sticky { position: sticky; top: 48px; z-index: 251; } .flash-container.flash-container-page { margin-bottom: 0; } .flash-container:empty { margin: 0; } input { border-radius: 0.25rem; color: #303030; background-color: #fff; } label { font-weight: 600; } label.custom-control-label { font-weight: 400; } label.label-bold { font-weight: 600; } .form-control { border-radius: 4px; padding: 6px 10px; } .form-control::placeholder { color: #868686; } .gl-show-field-errors .form-control:not(textarea) { height: 34px; } .navbar-empty { justify-content: center; height: var(--header-height, 48px); background: #fff; border-bottom: 1px solid #dbdbdb; } .navbar-empty .tanuki-logo, .navbar-empty .brand-header-logo { max-height: 100%; } .tanuki-logo .tanuki { fill: #e24329; } .tanuki-logo .left-cheek, .tanuki-logo .right-cheek { fill: #fc6d26; } .tanuki-logo .chin { fill: #fca326; } input::-moz-placeholder { color: #868686; opacity: 1; } input::-ms-input-placeholder { color: #868686; } input:-ms-input-placeholder { color: #868686; } svg { fill: currentColor; } .login-page .container { max-width: 960px; } .login-page .navbar-gitlab .container { max-width: none; } .login-page .flash-container { margin-bottom: 16px; position: relative; top: 8px; } .login-page .brand-holder { font-size: 18px; line-height: 1.5; } .login-page .brand-holder p { font-size: 16px; color: #888; } .login-page .brand-holder h3 { font-size: 22px; } .login-page .brand-holder img { max-width: 100%; margin-bottom: 30px; } .login-page .brand-holder a { font-weight: 600; } .login-page p { font-size: 13px; } .login-page .signin-text p { margin-bottom: 0; line-height: 1.5; } .login-page .borderless .login-box, .login-page .borderless .omniauth-container { box-shadow: none; } .login-page .borderless .g-recaptcha > div { margin-left: auto; margin-right: auto; } .login-page .login-box, .login-page .omniauth-container { box-shadow: 0 0 0 1px #dbdbdb; border-radius: 0.25rem; } .login-page .login-box .login-heading h3, .login-page .omniauth-container .login-heading h3 { font-weight: 400; line-height: 1.5; margin: 0 0 10px; } .login-page .login-box .login-footer, .login-page .omniauth-container .login-footer { margin-top: 10px; } .login-page .login-box .login-footer p:last-child, .login-page .omniauth-container .login-footer p:last-child { margin-bottom: 0; } .login-page .login-box a.forgot, .login-page .omniauth-container a.forgot { float: right; padding-top: 6px; } .login-page .login-box .nav .active a, .login-page .omniauth-container .nav .active a { background: transparent; } .login-page .login-box .login-body, .login-page .omniauth-container .login-body { font-size: 13px; } .login-page .login-box .login-body input + p, .login-page .login-box .login-body input ~ p.field-validation, .login-page .omniauth-container .login-body input + p, .login-page .omniauth-container .login-body input ~ p.field-validation { margin-top: 5px; } .login-page .login-box .login-body .username .validation-success, .login-page .omniauth-container .login-body .username .validation-success { color: #217645; } .login-page .login-box .login-body .username .validation-error, .login-page .omniauth-container .login-body .username .validation-error { color: #dd2b0e; } .login-page .omniauth-container { border-radius: 0.25rem; font-size: 13px; } .login-page .omniauth-container p { margin: 0; } .login-page .omniauth-container form { padding: 0; border: 0; background: none; } .login-page .new-session-tabs { display: flex; box-shadow: 0 0 0 1px #dbdbdb; border-top-right-radius: 4px; border-top-left-radius: 4px; } .login-page .new-session-tabs.nav-links-unboxed { border-color: transparent; box-shadow: none; } .login-page .new-session-tabs.nav-links-unboxed .nav-item { border-left: 0; border-right: 0; border-bottom: 1px solid #dbdbdb; background-color: transparent; } .login-page .new-session-tabs.custom-provider-tabs { flex-wrap: wrap; } .login-page .new-session-tabs.custom-provider-tabs li { min-width: 85px; flex-basis: auto; } .login-page .new-session-tabs.custom-provider-tabs li:nth-child(n + 5) { border-top: 1px solid #dbdbdb; } .login-page .new-session-tabs.custom-provider-tabs a { font-size: 16px; } .login-page .new-session-tabs li { flex: 1; text-align: center; border-left: 1px solid #dbdbdb; } .login-page .new-session-tabs li:first-of-type { border-left: 0; border-top-left-radius: 4px; } .login-page .new-session-tabs li:last-of-type { border-top-right-radius: 4px; } .login-page .new-session-tabs li:not(.active) { background-color: #fafafa; } .login-page .new-session-tabs li a { width: 100%; font-size: 18px; } .login-page .new-session-tabs li.active > a { cursor: default; } .login-page .form-control:active, .login-page .form-control:focus { background-color: #fff; } .login-page .submit-container { margin-top: 16px; } .login-page input[type="submit"] { margin-bottom: 0; display: block; width: 100%; } .login-page .devise-errors h2 { margin-top: 0; font-size: 14px; color: #ae1800; } @media (max-width: 575.98px) { .login-page .col-md-5.float-right { float: none !important; margin-bottom: 45px; } } .devise-layout-html { margin: 0; padding: 0; height: 100%; } .devise-layout-html body { height: calc(100% - 51px); margin: 0; padding: 0; } .devise-layout-html body.navless { height: calc(100% - 11px); } .devise-layout-html body .page-wrap { min-height: 100%; position: relative; } .devise-layout-html body .footer-container, .devise-layout-html body hr.footer-fixed { position: absolute; bottom: 0; left: 0; right: 0; height: 40px; background: #fff; } .devise-layout-html body .login-page-broadcast { margin-top: 40px; } .devise-layout-html body .navless-container { padding: 0 15px 65px; } .devise-layout-html body .flash-container { padding-bottom: 65px; } @media (max-width: 575.98px) { .devise-layout-html body .flash-container { padding-bottom: 0; } } .gl-display-flex { display: flex; } .gl-display-inline-block { display: inline-block; } .gl-flex-wrap { flex-wrap: wrap; } .gl-justify-content-center { justify-content: center; } .gl-float-right { float: right; } .gl-w-10 { width: 3.5rem; } .gl-w-half { width: 50%; } .gl-w-90p { width: 90%; } .gl-w-full { width: 100%; } @media (max-width: 575.98px) { .gl-xs-w-full { width: 100%; } } .gl-p-5 { padding: 1rem; } .gl-px-5 { padding-left: 1rem; padding-right: 1rem; } .gl-pt-5 { padding-top: 1rem; } .gl-mt-3 { margin-top: 0.5rem; } .gl-mt-5 { margin-top: 1rem; } .gl-mr-auto { margin-right: auto; } .gl-mr-2 { margin-right: 0.25rem; } .gl-mb-1 { margin-bottom: 0.125rem; } .gl-mb-2 { margin-bottom: 0.25rem; } .gl-mb-3 { margin-bottom: 0.5rem; } .gl-ml-auto { margin-left: auto; } .gl-ml-2 { margin-left: 0.25rem; } @media (min-width: 576px) { .gl-sm-mt-0 { margin-top: 0; } } .gl-text-center { text-align: center; } .gl-font-size-h2 { font-size: 1.1875rem; } .gl-font-weight-normal { font-weight: 400; } .gl-font-weight-bold { font-weight: 600; } @import "startup/cloaking"; @include cloak-startup-scss(none);