.new-style label.checkbox {
    padding: 0;
    display: inline-block;
    position: relative;
    vertical-align: top;
    min-height: 20px
}

.new-style label.checkbox input[type=checkbox] {
    position: absolute;
    clip: rect(0, 0, 0, 0)
}

.new-style label.checkbox input[type=checkbox]~span {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -2px;
    padding: 2px;
    margin: 0 5px 0 0;
    height: 10px;
    width: 10px;
    font-weight: 300;
    line-height: .8;
    font-size: 1.3rem;
    text-align: center;
    border: 1px solid hsla(0, 0%, 0%, .6);
    border-radius: 4px;
    filter: brightness(.8);
    cursor: pointer
}

.new-style label.checkbox input[type=checkbox]:checked~span {
    background-image: url("files/checkbox.5cc8e6c419aa3d443e73.svg");
    background-size: 85%;
    background-position: 50% 50%;
    background-repeat: no-repeat
}

.new-style label.checkbox input[type=checkbox]:disabled~span {
    opacity: .5;
    cursor: not-allowed
}

.new-style a.no-style {
    color: inherit
}

a.no-underline,
a.no-underline:hover {
    -webkit-text-decoration: none;
    text-decoration: none
}

.half-opacity {
    opacity: .5
}

.italic {
    font-style: italic
}

.simplebar-track .simplebar-scrollbar::before {
    background-color: #000;
    box-shadow: 0 0 0 1px hsla(0, 0%, 100%, .33)
}

.simplebar-track.simplebar-vertical {
    transition: width .2s ease 1s
}

.simplebar-track.simplebar-vertical.simplebar-hover {
    width: 15px;
    transition: width .2s ease
}

.simplebar-track.simplebar-horizontal {
    transition: height .2s ease 1s
}

.simplebar-track.simplebar-horizontal.simplebar-hover {
    height: 15px;
    transition: height .2s ease
}

i.zulip-icon.zulip-icon-bot {
    color: var(--color-icon-bot);
    vertical-align: top;
    padding: 0 2px
}

.tippy-content {
    font-size: 12px
}

input::-ms-reveal {
    display: none
}

.password-div {
    position: relative
}

.password-div .password_visibility_toggle {
    position: absolute;
    right: 10px;
    top: 42px;
    opacity: .6
}

.password-div .password_visibility_toggle:hover {
    opacity: 1
}

button.dropdown-toggle:focus,
select.bootstrap-focus-style:focus {
    outline: 1px dotted hsl(0, 0%, 20%);
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
    transition: none
}

body {
    background-color: #f9f9f9;
    font-family: "Source Sans 3", sans-serif;
    line-height: 150%;
    height: 100%;
    font-weight: 300;
    font-size: 17px
}

html {
    height: 100%
}

.noscroll {
    overflow: hidden;
    position: fixed
}

.digest-address-link {
    margin-top: 10px;
    color: #999;
    font-size: 12px;
    text-align: center
}

.normal {
    font-weight: 400
}

.navbar {
    margin-bottom: 0
}

.header {
    position: relative;
    padding: 15px 0;
    height: 29px;
    background-color: #fff;
    box-shadow: 0 0 4px hsla(0, 0%, 0%, .1);
    z-index: 100
}

.navbar.footer .nav>li {
    line-height: 56px
}

.navbar.footer .nav>li>a {
    padding-top: 0;
    padding-bottom: 0
}

.push {
    height: 56px
}

.api-center .code-section .blocks {
    background-color: #f9f9f9
}

.api-center .code-section ul.nav li.active {
    background-color: #f9f9f9;
    border-bottom: 1px solid #f9f9f9
}

.digest-container {
    padding-top: 100px
}

.digest-email-container {
    margin: 0 auto !important
}

.digest-email-container {
    display: block;
    max-width: 700px;
    padding-bottom: 30px
}

.digest-email-html {
    padding: 20px;
    background-color: #fff;
    border-radius: 5px
}

.app.help {
    display: inline-flex;
    box-shadow: 0 -20px 50px hsla(0, 0%, 0%, .04);
    overflow: auto;
    color: #444
}

.app.help .hamburger {
    display: none
}

.help .app-main {
    padding: 0;
    margin-top: 59px
}

.help p:empty {
    margin: 0
}

.help .sidebar {
    width: 300px;
    z-index: 1;
    height: calc(100vh - 59px);
    border-right: 1px solid #f6f7f8;
    overflow: auto;
    background-color: #67b08f;
    color: #fff;
    -webkit-overflow-scrolling: touch;
    --help-sidebar-padding: 20px;
    --help-sidebar-indent: 12px
}

.help .sidebar .content {
    padding: 10px var(--help-sidebar-padding)
}

.help .sidebar h1 {
    font-weight: 400;
    font-size: 1.25em;
    line-height: 1.5;
    margin-bottom: 0
}

.help .sidebar h1.home-link {
    font-size: 1em;
    margin-top: 20px;
    margin-bottom: 17px
}

.help .sidebar h1.home-link a::before {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    content: "\f0d9";
    margin-right: 10px
}

.help .sidebar h1:not(:first-of-type),
.help .sidebar h2:not(:first-of-type),
.help .sidebar h3:not(:first-of-type) {
    margin-top: 0
}

.help .sidebar h1 a,
.help .sidebar h2 a,
.help .sidebar h3 a {
    color: inherit;
    display: block;
    margin-left: calc(0px - var(--help-sidebar-padding));
    margin-right: calc(0px - var(--help-sidebar-padding));
    padding-left: calc(var(--help-sidebar-padding));
    padding-right: calc(var(--help-sidebar-padding))
}

.help .sidebar h2 {
    font-weight: 400;
    font-size: 1.1em;
    line-height: 1.05;
    margin-bottom: 5px
}

.help .sidebar.slide h2 {
    cursor: pointer
}

.help .sidebar.slide h2::before {
    display: block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    content: "\f107";
    margin-right: 5px;
    float: right;
    opacity: .5
}

.help .sidebar ul {
    margin: 5px 0 10px var(--help-sidebar-indent)
}

.help .sidebar.slide ul {
    margin-left: 19px;
    display: none
}

.help .sidebar li {
    list-style-type: none;
    font-size: .95em;
    font-weight: 400;
    line-height: 1.7;
    cursor: pointer
}

.help .sidebar li a {
    color: inherit;
    display: block;
    margin-left: calc(0px - var(--help-sidebar-padding) - var(--help-sidebar-indent));
    margin-right: calc(0px - var(--help-sidebar-padding));
    padding-left: calc(var(--help-sidebar-padding) + var(--help-sidebar-indent));
    padding-right: calc(var(--help-sidebar-padding))
}

.help .sidebar a.highlighted {
    background-color: #40956d;
    outline: 0
}

.help .markdown {
    background-color: #fff;
    width: calc(100vw - 300px);
    height: calc(100vh - 59px)
}

.help .markdown .scroll-target,
.help .markdown :target {
    scroll-margin-top: 20px
}

.help .markdown div.scroll-target>:first-child,
.help .markdown h1.scroll-target,
.help .markdown h2.scroll-target,
.help .markdown h3.scroll-target,
.help .markdown h4.scroll-target,
.help .markdown h5.scroll-target,
.help .markdown h6.scroll-target {
    padding: 6px 8px;
    border-radius: 7px 7px 0 0;
    margin: 20px -8px 10px;
    background-color: hsla(152, 70%, 50%, .25)
}

.help-center ol,
.portico-landing.integrations ol {
    margin-left: 0
}

.title {
    font-family: Helvetica, sans-serif;
    font-size: 100px;
    font-weight: 700;
    margin-top: 50px;
    margin-bottom: 60px
}

.digest-page-title {
    text-align: center;
    font-weight: 400
}

.thanks-page div {
    text-align: center
}

.lead {
    font-weight: 700
}

.pitch {
    width: 600px;
    max-width: 100%
}

.help-inline {
    font-weight: 400;
    font-size: .9rem
}

.help-inline.text-error {
    color: hsl(1.1, 44.7%, 50.4%)
}

a.title {
    color: #000
}

a.title:hover {
    color: #7f7f7f;
    -webkit-text-decoration: none;
    text-decoration: none
}

.fakecontrol {
    padding-top: 5px;
    font-weight: 700
}

img.screenshot {
    max-width: 100%
}

#pw_strength {
    width: 220px;
    height: 8px
}

#registration #pw_strength {
    width: 325px;
    margin: 7px auto 0
}

.def::before {
    content: " - "
}

.landing-page {
    padding: 2em 0
}

.landing-page h2,
.landing-page h4 {
    font-weight: lighter
}

.landing-page p {
    font-size: 120%
}

.platform-icon {
    width: 33%
}

.portico-page h1 {
    font-weight: 300
}

label.text-error {
    display: inline;
    padding-left: 5px
}

input.text-error {
    border-color: red;
    outline-color: red
}

.portico-container {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%
}

.portico-container .portico-wrap {
    flex: 1 0 auto
}

.portico-container .if-zulip-electron {
    display: none
}

.portico-container[data-platform=ZulipElectron] .if-zulip-electron {
    display: block
}

.header-main .logo {
    display: block;
    -webkit-text-decoration: none;
    text-decoration: none;
    position: relative;
    line-height: .8
}

.header-main .logo svg {
    vertical-align: -5px
}

.header-main .logo a,
.header-main .logo a:focus,
.header-main .logo a:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    color: #333
}

.header-main .logo .light {
    font-size: 1.2rem;
    font-weight: 400;
    color: #333;
    opacity: .7
}

.header-main .portico-logo {
    height: 28px;
    width: auto;
    padding: 6px 0
}

.portico-header .dropdown {
    position: relative;
    display: inline-block
}

.portico-header .dropdown ul {
    display: none;
    position: absolute;
    right: 0;
    margin: 10px 0 0;
    list-style-type: none;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    background-color: #fff;
    padding: 5px 0;
    border-radius: 4px;
    border: 1px solid #ddd;
    box-shadow: 0 2px 5px hsla(0, 0%, 0%, .1)
}

.portico-header .dropdown ul::before {
    content: "\25B2";
    position: absolute;
    top: -4px;
    right: 9px;
    font-size: .5em;
    color: #ddd;
    line-height: 0;
    transform: scale(1.8, 1)
}

.portico-header .dropdown ul li {
    display: list-item;
    margin: 0;
    padding: 3px 10px;
    text-align: left;
    opacity: 1;
    cursor: pointer
}

.portico-header .dropdown ul li:hover {
    background-color: #e2e7e8;
    transition: none
}

.portico-header .dropdown ul li a {
    display: block;
    margin: 2px 0;
    padding: 0;
    transition: none;
    font-size: .9em;
    font-weight: 400;
    color: #444
}

.portico-header .dropdown ul li:hover a {
    background-color: transparent
}

.portico-header .dropdown ul li a i {
    margin-right: 5px
}

.portico-header .dropdown ul li.nav-header {
    background-color: transparent;
    cursor: default;
    font-size: 14px
}

.portico-header .dropdown ul.dropdown-list {
    margin-top: 3px;
    margin-right: 3px
}

.portico-header .dropdown.show ul {
    display: block
}

.portico-header .dropdown-pill {
    border: 1px solid hsla(0, 0%, 0%, .2);
    border-radius: 4px;
    margin-left: 10px;
    font-weight: 400;
    cursor: pointer
}

.portico-header .dropdown-pill .realm-name {
    display: inline-block;
    vertical-align: top;
    margin: 0 5px 0 -4px;
    padding: 1px 0 1px 5px;
    font-size: .9em;
    font-weight: 600;
    line-height: 1.6
}

.portico-header .dropdown-pill .realm-name i.fa {
    position: relative;
    top: -2px;
    font-size: .6em;
    margin-left: 5px;
    opacity: .5;
    transition: all .2s ease
}

.portico-header .dropdown-pill:hover .realm-name i.fa {
    opacity: 1
}

.portico-header .dropdown-pill .header-realm-icon {
    width: 26px;
    height: 26px;
    vertical-align: top;
    border-radius: 4px
}

.portico-page-container .portico-header .dropdown-pill .realm-name {
    margin-left: -3px
}

.app {
    width: 100%;
    z-index: 99
}

.devlogin_subheader {
    margin-top: 10px;
    margin-bottom: 20px;
    padding-top: 0;
    text-align: center;
    font-size: 16px
}

.table.table-striped {
    background-color: #fff;
    box-shadow: 0 0 4px hsla(0, 0%, 0%, .1)
}

.team-profiles {
    margin: -10px;
    margin-bottom: 3px
}

.team .profile .profile-name {
    font-weight: 600
}

.team .profile .profile-role {
    opacity: .5;
    text-transform: uppercase;
    font-size: .8em;
    font-weight: 400
}

.team .bdfl {
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

.team .bdfl .profile-picture {
    flex: 0 auto;
    width: 200px;
    margin: 10px
}

.team .bdfl .profile-picture>img {
    height: auto;
    border-radius: 5px
}

.team .bdfl .profile-information {
    flex: 1;
    min-width: 300px;
    font-size: 1.4em;
    margin: 10px 10px 0
}

.team .bdfl .profile-description {
    margin-top: 5px;
    font-weight: 400;
    font-size: .8em;
    opacity: .8
}

.team .bdfl .profile-description p {
    font-size: 1em
}

.team input {
    display: none
}

.team input:checked+label {
    border: 1px solid #ededed;
    border-top: 2px solid #99cd31;
    border-bottom-color: #fff
}

.team label {
    font-size: medium;
    font-size: initial;
    display: inline-block;
    padding: 10px;
    border: 1px solid transparent;
    margin: 0 0 -1px
}

.team label:hover {
    cursor: pointer
}

.contributors-list {
    margin-left: -40px;
    width: calc(100% + 80px)
}

.contributors {
    display: none
}

.contributors .person {
    box-sizing: border-box;
    padding: 10px;
    border: 1px solid #ededed;
    border-radius: 4px;
    transition: all .3s ease
}

.contributors .person a {
    color: inherit
}

.contributors .person:hover {
    border: 1px solid #bababa
}

.contributors .person .avatar {
    width: 60px;
    text-align: center;
    display: inline-block;
    vertical-align: top
}

.contributors .person .info {
    width: 50%;
    text-align: left;
    display: inline-block;
    vertical-align: top;
    margin-left: 10px
}

input#desktop:checked~#tab-desktop,
input#mobile:checked~#tab-mobile,
input#python-zulip-api:checked~#tab-python-zulip-api,
input#server:checked~#tab-server,
input#terminal:checked~#tab-terminal,
input#total:checked~#tab-total,
input#zulip-js:checked~#tab-zulip-js,
input#zulipbot:checked~#tab-zulipbot {
    display: block
}

input#desktop:checked~#tab-desktop .contributors-grid,
input#mobile:checked~#tab-mobile .contributors-grid,
input#python-zulip-api:checked~#tab-python-zulip-api .contributors-grid,
input#server:checked~#tab-server .contributors-grid,
input#terminal:checked~#tab-terminal .contributors-grid,
input#total:checked~#tab-total .contributors-grid,
input#zulip-js:checked~#tab-zulip-js .contributors-grid,
input#zulipbot:checked~#tab-zulipbot .contributors-grid {
    padding-top: 5px;
    display: grid;
    grid-gap: 5px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr))
}

.avatar_img {
    width: auto;
    height: auto;
    max-width: 80%;
    max-height: 80%;
    border-radius: 20%
}

.last-updated,
.tab-loading {
    font-size: .9em !important
}

.last-updated,
.tab-loading {
    color: #aaa;
    padding-top: 30px;
    text-align: center
}

.history .sponsors {
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

.history .sponsors .sponsor-picture img {
    height: 170px;
    margin: 0 20px;
    pointer-events: none
}

.login-page-header {
    width: 100%
}

.login-page {
    text-align: center
}

.login-page .alert {
    width: 320px;
    margin: auto;
    margin-top: -30px;
    margin-bottom: 15px;
    text-align: center
}

.register-form {
    display: inline-block;
    text-align: center
}

.register-button {
    margin-left: 10px
}

.new-organization-button {
    margin-top: 10px
}

input.new-organization-button {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.login-form {
    margin: auto;
    width: calc(300px - -28px);
    margin-bottom: 10px
}

.login-form .controls,
.register-form .controls {
    margin-right: 10px
}

.login-social {
    max-width: 100%;
    min-width: 300px;
    margin: auto;
    text-align: center;
    margin-top: 10px
}

.app-main,
.header-main {
    height: 100%;
    min-width: 350px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative
}

.hello-main {
    padding: 0 !important
}

.hello-main {
    max-width: none;
    min-width: 0
}

.top-links {
    text-align: right
}

.top-links a {
    display: inline-block;
    color: #fff;
    padding: 2px 7px 1px 8px;
    font-weight: 600;
    font-size: 16px;
    transition: all .2s ease-in;
    border-radius: 4px
}

.top-links a:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    background-color: #fff;
    color: #329988
}

.centered-button {
    text-align: center
}

.password-reset {
    display: inline-block;
    text-align: left;
    width: 328px
}

.password-reset form {
    margin: 0
}

.password-reset #pw_strength {
    width: 328px;
    margin-top: 20px
}

.password-reset .pitch {
    width: auto
}

.password-reset .input-group {
    margin: 15px 0
}

.password-reset .input-group input[type=password],
.password-reset .input-group input[type=text] {
    width: calc(100% - 14px)
}

.password-reset .input-group #pw_strength {
    width: 100%
}

.password-reset .input-group.m-t-30 {
    margin-top: 30px
}

.password-reset p {
    margin: 0
}

.password-reset .progress {
    margin: 0
}

.password-reset #email-section .fakecontrol {
    display: inline-block;
    margin: 0
}

.input-group.margin {
    margin: 10px 0
}

.input-group .progress {
    margin: 0;
    margin-top: 5px;
    display: inline-block
}

.input-group input[type=checkbox],
.input-group input[type=radio] {
    margin: 0 10px 0 0
}

.input-group input[type=radio] {
    position: relative;
    top: 8px
}

.input-group label {
    margin: 0;
    padding: 5px 0
}

.input-group label.inline-block {
    margin-top: 1px
}

.input-group.radio {
    margin-left: 25px
}

.input-group.grid {
    padding: 10px 0;
    border-bottom: 1px solid #ddd
}

.input-group.grid label.inline-block {
    width: 200px
}

.center-container {
    min-height: calc(100vh - 94px);
    min-height: 700px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

#registration-email {
    margin-bottom: 18px
}

#registration-email label {
    float: left;
    width: 100%;
    display: block;
    margin-left: 2px;
    margin-bottom: 0;
    text-align: left;
    font-weight: 600;
    font-size: 1rem
}

#registration-email .controls {
    padding-top: 25px;
    margin: 2px
}

.center-block {
    text-align: left;
    display: inline-block
}

.center-block .pitch {
    width: 100%;
    margin-bottom: 20px
}

.center-block .controls {
    margin: 0;
    text-align: left
}

.center-block #send_confirm input[type=text] {
    margin-top: 20px
}

.center-block .button {
    margin-top: 20px;
    padding: 5px 10px;
    border-radius: 2px;
    font-size: 16px;
    font-weight: 300
}

.error_page {
    min-height: calc(100vh - 290px);
    height: 100%;
    background-color: #c8e8df;
    font-family: "Source Sans 3", sans-serif
}

.error_page .container {
    padding: 20px 0
}

.error_page .row-fluid {
    margin-top: 60px
}

.error_page img {
    display: block;
    clear: right;
    margin: 0 auto;
    max-width: 500px;
    width: 100%
}

.error_page .errorbox {
    margin: auto;
    border: 2px solid #42a78b;
    max-width: 500px;
    background-color: #fff;
    box-shadow: 0 0 4px #42a78b;
    font-size: 18px
}

.error_page .errorbox.config-error {
    max-width: 750px
}

.error_page p {
    color: #333
}

.error_page .errorcontent {
    text-align: left;
    padding: 40px 40px 30px
}

.error_page .lead {
    color: #39a788;
    font-size: 35px;
    margin-bottom: 20px;
    line-height: normal
}

.hourglass-img {
    width: auto !important;
    width: initial !important;
    margin-bottom: 25px !important
}

@media (max-width:800px) {
    .app.help .markdown {
        width: 100vw
    }

    .app.help .markdown .content {
        max-width: none;
        margin-left: 50px
    }

    .app.help .hamburger {
        display: block;
        position: fixed;
        top: 70px;
        left: 9px;
        fill: hsl(0, 0%, 100%);
        z-index: 2;
        transition: all .3s ease;
        cursor: pointer
    }

    .app.help .sidebar {
        position: fixed;
        top: 59px;
        right: calc(100vw - 50px);
        width: 100%;
        min-width: 0;
        min-width: initial;
        height: calc(100vh - 59px);
        pointer-events: none;
        overflow: hidden;
        transform: translateX(0);
        transition: all .3s ease
    }

    .app.help .sidebar.show {
        pointer-events: initial;
        transform: translateX(calc(100% - 50px));
        overflow: auto
    }

    .app.help .sidebar.show .content {
        visibility: visible
    }

    .app.help .sidebar.show+.hamburger {
        transform: translateX(calc(100vw - 50px))
    }

    .app.help .sidebar.show~.markdown {
        filter: brightness(.7)
    }

    .app-main,
    .header-main {
        min-width: auto
    }

    .app-main {
        padding: 0
    }

    .help .sidebar .content:not(.show) {
        visibility: hidden
    }

    .help .sidebar:not(.show) a.highlighted {
        background-color: transparent
    }
}

@media (max-width:767px) {
    body {
        padding: 0 !important
    }

    .input-large {
        display: block !important;
        width: 100% !important;
        min-height: 30px !important;
        margin: 0 !important;
        padding: 4px 6px !important;
        line-height: 20px !important;
        box-sizing: border-box !important;
        margin-top: 10px !important;
        margin-bottom: 10px !important
    }

    .line-break-desktop {
        display: none
    }

    .contributors-list {
        width: 100%;
        margin-left: 0
    }
}

@media (max-height:600px) {
    .password-container {
        margin-top: 10px
    }
}

@media (max-width:558px) {

    .team .bdfl .profile-name,
    .team .bdfl .profile-role {
        text-align: center
    }
}

@media (max-width:500px) {
    .app.help .sidebar {
        top: 39px;
        height: calc(100vh - 39px)
    }

    .app.help .hamburger {
        top: 50px
    }

    .help .app-main {
        margin-top: 39px
    }

    .help .markdown {
        height: calc(100vh - 39px)
    }

    .error_page .lead {
        font-size: 1.5em;
        margin-bottom: 10px
    }

    .brand.logo .light {
        display: none
    }

    .center-container {
        display: block
    }

    .header {
        padding: 4px 0 6px
    }

    .header-main {
        max-width: 100vw;
        padding: 0 10px
    }
}

.emoji {
    height: 25px;
    width: 25px;
    vertical-align: text-bottom
}

label.label-title {
    font-weight: 600
}

.inline-block {
    display: inline-block;
    vertical-align: top
}

.float-left {
    float: left
}

.float-right {
    float: right
}

.documentation-footer {
    font-size: .85rem;
    opacity: .8
}

#devtools-wrapper {
    text-align: right
}

#devtools-registration {
    float: left
}

#devtools-registration form {
    display: inline
}

#devtools-page {
    max-width: 800px;
    margin: 0 auto
}

.portico-page.error {
    padding-bottom: 0
}

.portico-page.error .portico-page-container {
    padding: 0
}

#third-party-apps {
    margin-top: 20px;
    padding-right: 10px
}

.api-argument .api-argument-name {
    font-family: "Source Code Pro", monospace
}

.api-argument .api-argument-name .api-argument-hover-link i.fa {
    opacity: 0;
    font-size: .9em
}

.api-argument .api-argument-name:hover .api-argument-hover-link i.fa {
    opacity: 1;
    color: #000;
    cursor: pointer
}

.api-argument .api-field-type {
    text-transform: lowercase;
    font-weight: 600;
    font-size: 14px
}

.api-argument .api-argument-example-label {
    font-style: italic
}

.api-argument .api-argument-required {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 12px;
    color: #e5704c
}

.api-argument .api-argument-optional {
    text-transform: uppercase;
    font-weight: 400;
    font-size: 12px;
    color: #777
}

.api-argument .api-argument-deprecated {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 12px;
    color: #cc6565
}

.api-field-type {
    color: hsl(176, 46.4%, 41%)
}

.desktop-redirect-box {
    text-align: center
}

.desktop-redirect-box .copy-token-info {
    font-weight: 400
}

.desktop-redirect-box #desktop-data {
    padding: 13px 12px 12px;
    font-family: "Source Code Pro", monospace
}

.desktop-redirect-image {
    margin-bottom: 20px
}

.unsupported_browser_page {
    padding-bottom: 80px
}

#navbar-custom-message {
    font-size: 1rem;
    background: linear-gradient(145deg, #4bb4cc, #25b097);
    color: #fff;
    font-weight: 600;
    text-align: center;
    position: relative;
    top: 0;
    padding: 10px;
    border-bottom: 1px solid #50c7c1;
    z-index: 5
}

#navbar-custom-message a {
    color: #fff;
    -webkit-text-decoration: underline;
    text-decoration: underline
}

html {
    min-height: 500px
}

.flex {
    display: flex;
    padding: 80px 0;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 402px)
}

.m-10 {
    margin: 10px
}

.semi-bold {
    font-weight: 600
}

.white-box {
    position: relative;
    padding: 30px;
    min-width: 0;
    background-color: #fff;
    box-shadow: 0 0 4px hsla(0, 0%, 0%, .1);
    border: 1px solid #ddd;
    border-radius: 4px
}

.bottom-text {
    text-align: center;
    margin-top: 20px;
    font-weight: 500;
    font-size: .9em
}

.bottom-text a {
    color: #007556
}

.bottom-text a:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    color: #5dd9a7
}

#new-realm-creation .get-started {
    font-size: 2rem
}

.bottom-text-large {
    text-align: center;
    margin-top: 20px;
    font-weight: 500;
    font-size: 1.2em
}

.bottom-text-large a {
    color: #007556
}

.bottom-text-large a:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    color: #5dd9a7
}

.grey {
    color: #aaa
}

.find-account-page-container #find_account i {
    font-size: .8em
}

.app-main .login-page-header {
    font-size: 1.5em;
    font-weight: 300;
    margin: 0;
    height: 0;
    transform: translateX(-15px) translateY(-60px);
    text-align: left
}

.app-main .login-page-container.dev-login .login-page-header {
    height: auto;
    margin-top: 20px;
    transform: none;
    text-align: center
}

.app-main .login-page-container.dev-login h2 {
    font-size: 1em;
    font-weight: 400
}

.app-main .login-page-container.dev-login .group {
    display: inline-block;
    vertical-align: top;
    margin: 0 20px
}

.app-main .login-page-container.dev-login select {
    height: 30px;
    padding: 0 6px;
    width: 220px;
    font-size: 14px;
    color: #545454;
    border-radius: 4px;
    border: 1px solid #ccc;
    margin-bottom: 10px;
    cursor: pointer;
    background-color: #fff;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
}

.app-main.forgot-password-container {
    font-weight: 400
}

.app-main.find-account-page-container {
    width: 500px;
    font-weight: 400
}

.app-main.goto-account-page-container {
    width: 500px;
    font-weight: 400
}

.app-main.goto-account-page-container .realm-redirect-form {
    text-align: center
}

.app-main.goto-account-page-container .realm-redirect-form .inline-block {
    text-align: center
}

.app-main.confirm-continue-page-container {
    width: 400px;
    font-weight: 400
}

.app-main.confirm-continue-page-container .white-box {
    min-width: 365px
}

.app-main.confirm-continue-page-container .form-inline {
    display: inline-block
}

.app-main.confirm-continue-page-container .form-inline .outline {
    border: 2px inset #313e4e;
    background-color: #fff;
    color: #313e4e;
    padding: 13px 20px 11px
}

.app-main.confirm-continue-page-container .form-inline .outline:hover {
    background-color: #f2f6fc
}

.app-main.confirm-continue-page-container p {
    font-size: 19px
}

.login-page-container.dev-login {
    margin-top: 20px;
    border: none
}

.login-page-container.dev-login .login-form {
    width: auto
}

.login-page-container .group {
    margin: 0 20px;
    display: inline-block
}

.login-page-container .dev-button {
    color: #52b6a6;
    border: 1px solid #52b6a6;
    border-radius: 4px;
    background-color: transparent;
    font-family: inherit;
    font-weight: 400;
    line-height: 20px;
    vertical-align: middle;
    margin: 0;
    width: auto;
    transition: color .3s ease, border .3s ease
}

.login-page-container .dev-button:hover {
    color: #5dd9a7;
    border-color: #5dd9a7
}

.login-page-container .dev-button.dev-login-button {
    padding: 8px;
    font-size: 19px;
    min-width: 300px;
    cursor: pointer
}

.login-page-container .dev-button.dev-create-button {
    padding: 6px 12px;
    margin-bottom: 4px;
    font-size: 15px;
    cursor: pointer
}

.new-style .login-page-container .alert,
.register-page-container .new-style .alert {
    margin: 0;
    text-align: left;
    font-size: .7em;
    font-weight: 600
}

.register-page-container.closed-realm .right-side {
    display: none
}

.register-page-container.closed-realm .left-side {
    border-right: none
}

.register-page-container.closed-realm .invite-required {
    display: block;
    color: #aaa;
    font-weight: 400
}

.register-page-container .invite-required {
    display: none;
    line-height: 1
}

.register-page-container .invite-required i {
    margin-right: 5px
}

.find-account-page-container h3,
.forgot-password-container h3 {
    margin-top: 0;
    font-weight: 300;
    font-size: 2em
}

.forgot-password-container {
    width: 503px
}

.forgot-password-container form,
.forgot-password-container h3 {
    margin-bottom: 0
}

.deactivated-realm-container {
    width: 503px
}

.header {
    color: #444;
    background-color: #fff;
    position: fixed;
    width: 100%;
    top: 0
}

.header .header-main .logo span,
.header .top-links a {
    color: #444
}

.register-form.new-style {
    text-align: left;
    color: #727272
}

.register-form #errors {
    font-size: .8em;
    font-weight: 400;
    margin-bottom: 20px;
    margin-top: 10px
}

.register-form #errors:empty {
    margin-top: 0
}

.register-form button {
    margin-top: 22px
}

.register-form .new-organization-button {
    margin-top: 25px
}

.account-accept-terms-page #accept_tos_button,
.account-accept-terms-page #registration {
    margin: 0
}

.account-accept-terms-page .fakecontrol {
    font-weight: 400
}

.account-accept-terms-page .description {
    margin-bottom: 20px;
    font-size: 16px;
    font-weight: 400;
    max-width: 400px
}

.account-accept-terms-page #new-user-email-address-visibility {
    max-width: 400px
}

.account-accept-terms-page .center-block {
    max-width: 800px
}

.account-accept-terms-page .center-block .controls {
    margin-bottom: 5px
}

.account-accept-terms-page #accept_tos_button {
    margin-top: 20px
}

.register-account .default-stream-groups .input-group,
.register-account .default-stream-groups p,
.register-account .terms-of-service .input-group {
    width: 330px;
    margin: 0 auto 10px
}

.register-account .terms-of-service .text-error {
    position: relative;
    display: block;
    top: -5px;
    padding: 0;
    height: 0;
    font-size: .7em;
    font-weight: 600
}

.account-creation {
    font-weight: 400
}

.account-creation .pitch {
    margin-bottom: 0
}

.account-creation .alert.alert-info {
    padding: 8px 14px;
    text-align: left;
    font-size: 1em;
    line-height: 1.3
}

.account-creation .white-box p:last-of-type {
    margin-bottom: 0
}

.relative {
    position: relative
}

.new-style button {
    display: inline-block;
    vertical-align: top;
    padding: 13px 22px;
    font-family: "Source Sans 3", sans-serif;
    font-size: 1.2rem;
    font-weight: 400;
    box-sizing: border-box;
    outline: 0;
    color: #fff;
    background-color: #313e4e;
    margin: 25px 0 5px;
    height: 50px;
    border: none;
    border-radius: 4px;
    transition: all .3s ease
}

.new-style button:hover {
    background-color: #344c69
}

.new-style button:active {
    background-color: #1d2734
}

.new-style button:focus {
    outline: 3px solid hsl(213, 81%, 79%)
}

.new-style button.full-width {
    width: 100%
}

.new-style .alert-info {
    font-weight: 400
}

.new-style .demo-organization-warning {
    position: relative;
    display: block;
    background-color: #ffdbdb;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 10px;
    margin: 10px 0;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    color: #444
}

.new-style .demo-organization-warning a {
    -webkit-text-decoration: none;
    text-decoration: none
}

.new-style .demo-organization-warning::before {
    display: inline;
    margin-right: 8px;
    font-family: FontAwesome;
    font-weight: 600;
    content: "\f071"
}

.new-style .alert:not(.alert-info) {
    padding: 0;
    margin-bottom: 5px;
    font-weight: 600;
    font-size: .7em;
    line-height: 1.2;
    background-color: transparent;
    border: none;
    color: #bd5656
}

.new-style .alert.alert-error {
    text-align: left
}

.new-style .form-inline {
    margin: 0
}

.new-style .get-started {
    font-size: 2.5rem;
    text-align: center;
    color: #666;
    margin-bottom: 20px
}

.new-style .right-side .alert {
    max-width: 328px
}

.new-style .input-box {
    position: relative;
    display: inline-block;
    vertical-align: top
}

.new-style .input-box input[type=email],
.new-style .input-box input[type=password],
.new-style .input-box input[type=text],
.new-style .input-box select,
.new-style .input-box textarea {
    padding: 10px 32px 10px 12px;
    margin: 25px 0 5px;
    font-family: "Source Sans 3", sans-serif;
    font-size: 1.2rem;
    line-height: normal;
    height: auto;
    width: 280px;
    border: 1px solid #ddd;
    box-shadow: none;
    border-radius: 4px;
    background-color: #fff;
    color: #545454;
    transition: border .3s ease
}

.new-style .input-box input[type=email]:focus:invalid,
.new-style .input-box input[type=password]:focus:invalid,
.new-style .input-box input[type=text]:focus:invalid,
.new-style .input-box select:focus:invalid,
.new-style .input-box textarea:focus:invalid {
    box-shadow: none;
    color: #444
}

.new-style .input-box input[type=email]:focus,
.new-style .input-box input[type=password]:focus,
.new-style .input-box input[type=text]:focus,
.new-style .input-box select:focus,
.new-style .input-box textarea:focus {
    border: 1px solid #878787
}

.new-style .input-box input[type=email] {
    margin-bottom: 10px
}

.new-style .input-box label {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 1px;
    transition: all .3s ease
}

.new-style .input-box.moving-label input[type=email]:invalid+label,
.new-style .input-box.moving-label input[type=password]:invalid+label,
.new-style .input-box.moving-label input[type=text]:invalid+label {
    transform: translateY(39px) translateX(14px);
    font-size: 1.2rem;
    font-weight: 400;
    color: #aaa;
    pointer-events: none
}

.new-style .input-box input[type=email]:focus+label,
.new-style .input-box input[type=email]:valid+label,
.new-style .input-box input[type=password]:focus+label,
.new-style .input-box input[type=password]:valid+label,
.new-style .input-box input[type=text]:focus+label,
.new-style .input-box input[type=text]:valid+label,
.new-style .input-box label,
.new-style .input-box select:focus+label,
.new-style .input-box select:valid+label {
    left: 0;
    transform: translateY(0) translateX(0);
    pointer-events: auto;
    font-size: 1rem;
    font-weight: 600;
    color: #444
}

.new-style .input-box select {
    width: 326px;
    cursor: pointer
}

.new-style .input-box p.text-error {
    display: block;
    padding: 0;
    color: hsl(1.1, 44.7%, 50.4%);
    font-size: .7em;
    font-weight: 600;
    text-align: left;
    line-height: 1.2;
    position: relative;
    left: 1px
}

.new-style .input-box label.text-error {
    display: block;
    top: 0;
    right: 0;
    text-align: right;
    color: hsl(1.1, 44.7%, 50.4%);
    font-size: .7em;
    font-weight: 600;
    padding-left: 0
}

.new-style .lead {
    margin: 0
}

.new-style .inline-block {
    text-align: left
}

.new-style .contact-admin p.invite-hint {
    font-size: 1.3rem;
    margin-top: .8rem;
    text-align: center
}

#login_form .input-box {
    display: block
}

#login_form .loader {
    display: none;
    vertical-align: top;
    position: relative;
    height: 30px;
    margin-top: -10px;
    top: 5px
}

#new-user-email-address-visibility {
    text-align: left;
    font-size: .8em;
    line-height: normal;
    margin-left: 2px
}

#new-user-email-address-visibility .change_email_address_visibility {
    cursor: pointer
}

#change-email-address-visibility-modal {
    font-weight: 400
}

#change-email-address-visibility-modal label {
    font-size: inherit
}

#change-email-address-visibility-modal h1 {
    font-weight: 600;
    font-family: inherit
}

#change-email-address-visibility-modal select {
    margin-bottom: 10px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    font-size: 16px;
    font-family: inherit
}

.portico-page .pitch h1 {
    margin-bottom: 5px
}

.portico-page .pitch p {
    font-weight: 400;
    color: #aaa
}

.portico-page .or {
    width: 100%;
    display: block;
    margin: 10px auto;
    color: #565656;
    font-weight: 600;
    text-align: center;
    position: relative;
    z-index: 1
}

.portico-page .or::before {
    content: " ";
    display: inline-block;
    position: absolute;
    width: calc(100% - 5px);
    top: calc(50% - 2px);
    left: 0;
    z-index: -1;
    border-bottom: 2px solid #ddd
}

.portico-page .or span {
    background-color: #fff;
    padding: 0 5px
}

.account-accept-terms-page .pitch,
.register-account .pitch {
    margin-bottom: 5px;
    text-align: center
}

.split-view .org-header {
    text-align: center
}

.split-view .org-header .info-box {
    display: inline-block;
    position: relative;
    margin: 20px 0 0 20px;
    width: calc(100% - 125px);
    text-align: left
}

.split-view .left-side {
    width: 500px;
    border-right: 1px solid #ededed;
    position: relative;
    left: -1px;
    padding-top: 6%;
}

.split-view .left-side .description {
    text-align: center;
    font-weight: 600;
    margin-top: 20px;
    margin-right: 10px;
    font-size: 2rem
}

.split-view .left-side+.right-side {
    border-left: 1px solid #ededed;
    padding-left: 15px;
    margin-left: -5px
}

.split-view .right-side .form-inline {
    width: 328px
}

.split-view .left-side,
.split-view .right-side {
    display: inline-block;
    vertical-align: top
}

.register-page-container .org-header .avatar,
.split-view .org-header .avatar {
    display: inline-block;
    vertical-align: top;
    width: 120px;
    height: 120px
}

.info-box .organization-name,
.info-box .organization-path {
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.info-box .organization-name {
    font-size: 1.5em;
    font-weight: 300;
    line-height: 1.2
}

.info-box .organization-path {
    font-weight: 400;
    color: #777;
    margin-top: 5px
}

.confirm-email-change-page .white-box {
    max-width: 500px;
    word-break: break-word
}

.anonymous_access_form button {
    margin-top: 0
}

button.login-social-button {
    width: 328px;
    height: auto;
    padding-left: 44px;
    line-height: 1;
    background-size: auto 60%;
    background-repeat: no-repeat;
    background-position: 13px 50%;
    background-color: #fff;
    box-shadow: 0 1px 3px hsla(0, 0%, 0%, .3), 0 0 5px hsla(0, 0%, 0%, .1);
    margin-left: 0;
    margin-top: 0;
    color: #565656
}

button.login-social-button:hover {
    background-color: #f9f9f9;
    box-shadow: 1px 2px 5px hsla(0, 0%, 0%, .2)
}

button.login-social-button:active {
    background-color: #ededed;
    box-shadow: 0 1px 1px hsla(0, 0%, 0%, .3)
}

button#login_auth_button_gitlab,
button#register_auth_button_gitlab {
    background-size: auto 90%;
    background-position-x: 3px
}

.back-to-login-wrapper,
.login-page-container .right-side .actions {
    margin: 20px 0 0;
    text-align: left
}

.back-to-login-wrapper .back-to-login {
    display: flex;
    gap: 5px;
    align-items: center
}

.back-to-login-wrapper .back-to-login i {
    position: relative;
    top: -1px;
    font-size: .8em
}

.back-to-login,
.split-view .actions a {
    color: #007556;
    -webkit-text-decoration: none;
    text-decoration: none;
    font-weight: 600;
    font-size: .8em;
    line-height: 1.5;
    vertical-align: top;
    transition: color .2s ease
}

.back-to-login:hover,
.split-view .actions a:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    color: #5dd9a7
}

#new-realm-creation,
#registration {
    width: auto;
    padding: 0;
    margin: 30px
}

#new-realm-creation fieldset,
#registration fieldset {
    margin: 30px
}

#new-realm-creation fieldset .input-box:last-child,
#registration fieldset .input-box:last-child {
    margin-bottom: 0
}

#new-realm-creation .info-box,
#registration .info-box {
    margin: 10px 0 0 20px
}

#new-realm-creation .info-box .organization-name,
#registration .info-box .organization-name {
    max-width: 228px
}

#new-realm-creation .input-box,
#registration .input-box {
    display: block;
    text-align: center;
    width: 330px;
    margin: 25px auto 10px;
    position: relative
}

#new-realm-creation .input-box.full-width,
#registration .input-box.full-width {
    width: calc(100% - 20px)
}

#new-realm-creation .input-box label,
#registration .input-box label {
    position: absolute;
    margin: 0;
    top: 0;
    left: 2px
}

#new-realm-creation .input-box label.static,
#registration .input-box label.static {
    position: static !important
}

#new-realm-creation .input-box label.static,
#registration .input-box label.static {
    width: 100%;
    text-align: left;
    margin-left: 2px
}

#new-realm-creation .input-box.support-form-field,
#registration .input-box.support-form-field {
    width: 450px
}

#new-realm-creation .input-box.support-form-field input,
#new-realm-creation .input-box.support-form-field textarea,
#registration .input-box.support-form-field input,
#registration .input-box.support-form-field textarea {
    width: 400px;
    font-size: 1rem
}

#new-realm-creation .input-box.support-form-field textarea,
#registration .input-box.support-form-field textarea {
    color: #545454;
    vertical-align: middle;
    background-color: #fff
}

#new-realm-creation .input-box.support-form-field textarea:focus,
#registration .input-box.support-form-field textarea:focus {
    outline: 0
}

#new-realm-creation [for=realm_in_root_domain],
#registration [for=realm_in_root_domain] {
    font-weight: 400 !important
}

#new-realm-creation .register-button-box,
#registration .register-button-box {
    text-align: center
}

#new-realm-creation .register-button,
#registration .register-button {
    margin: 25px auto 30px;
    width: 330px;
    border-radius: 4px
}

#new-realm-creation .support-submit-button,
#registration .support-submit-button {
    margin-top: 20px;
    margin-bottom: 5px;
    width: 450px
}

#new-realm-creation .register-button .loader,
#registration .register-button .loader {
    display: none;
    vertical-align: top;
    position: relative;
    height: 30px;
    margin-top: -10px;
    top: 5px
}

#new-realm-creation #id_team_subdomain.subdomain,
#registration #id_team_subdomain.subdomain {
    margin-top: 0;
    text-align: right;
    position: relative;
    padding-right: 10px;
    width: 150px
}

#new-realm-creation #id_team_subdomain.subdomain+.realm_subdomain_label,
#registration #id_team_subdomain.subdomain+.realm_subdomain_label {
    top: 15px;
    margin-left: 180px;
    display: inline-block;
    font-weight: 400;
    font-size: inherit
}

#new-realm-creation #subdomain_section .inline-block,
#registration #subdomain_section .inline-block {
    width: 100%
}

#new-realm-creation #subdomain_section .or,
#registration #subdomain_section .or {
    margin-top: 0
}

#new-realm-creation #id_email,
#new-realm-creation #support_from,
#new-realm-creation #support_realm,
#new-realm-creation .not-editable-realm-field,
#registration #id_email,
#registration #support_from,
#registration #support_realm,
#registration .not-editable-realm-field {
    font-weight: 400;
    margin: 2px;
    padding-top: 25px;
    text-align: left;
    word-wrap: break-word
}

#new-realm-creation .help-text,
#registration .help-text {
    width: 100%;
    max-width: none;
    margin: 2px 0;
    text-align: left;
    color: #777;
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.2
}

#new-realm-creation .help-inline,
#registration .help-inline {
    display: block
}

#new-realm-creation legend,
#registration legend {
    display: block;
    width: 100%;
    padding: 0;
    margin-bottom: 0;
    font-size: 21px;
    line-height: 40px;
    color: hsla(0, 0%, 0%, .5);
    border: 0;
    border-bottom: 1px solid #e5e5e5
}

#new-realm-creation legend+.input-box,
#registration legend+.input-box {
    margin-top: 20px
}

#new-realm-creation legend .edit-realm-details,
#registration legend .edit-realm-details {
    float: right;
    cursor: pointer
}

#new-realm-creation .center-block .pitch,
#registration .center-block .pitch {
    margin-bottom: 0
}

#new-realm-creation .input-group label,
#registration .input-group label {
    font-size: 1rem
}

#new-realm-creation .input-group label.inline-block,
#registration .input-group label.inline-block {
    margin-top: -1px
}

#new-realm-creation .input-group label.marketing_emails_checkbox,
#registration .input-group label.marketing_emails_checkbox {
    text-indent: -24px;
    margin-left: 24px
}

#new-realm-creation .input-group.radio,
#registration .input-group.radio {
    margin: 0;
    padding: 0
}

#new-realm-creation .org-url,
#registration .org-url {
    margin-bottom: 5px !important
}

.static.org-url+#subdomain_section {
    margin-top: 0 !important
}

.static.org-url+#subdomain_section .or {
    display: none
}

#profile_info_section #profile_avatar {
    border: 1px solid #ccc;
    border-radius: 8px;
    width: 120px;
    height: 120px;
    margin: 0 auto 10px
}

#profile_info_section #profile_full_name {
    font-size: 1.2rem;
    font-weight: 400
}

#source_realm_select_section {
    position: relative;
    top: 15px;
    margin-bottom: 20px;
    font-size: 22px
}

.goto-account-page #realm_redirect_subdomain {
    text-align: right;
    position: relative;
    padding-right: 10px
}

.goto-account-page #realm_redirect_external_host {
    font-size: 20px;
    top: 13px;
    left: 5px;
    position: relative
}

.goto-account-page #realm_redirect_description {
    top: 15px;
    position: relative
}

.goto-account-page #enter-realm-button {
    margin-top: 14px
}

#choose_email {
    flex-direction: column
}

#choose_email .white-box {
    min-width: 450px;
    padding: 30px 0 50px
}

#choose_email form {
    padding: 0;
    margin: 0
}

#choose_email form.select-email-form:hover {
    background-color: #dbebf4;
    cursor: pointer
}

#choose_email form.select-email-form:hover i.fa {
    color: #9bcae8
}

#choose_email .choose-email-box {
    padding: 13px 0;
    margin: 0 30px;
    border-bottom: 1px solid #f2f2f2;
    display: flex;
    align-items: center
}

#choose_email .choose-email-box p {
    margin: 0;
    font-size: .8em
}

#choose_email .choose-email-box p:last-child {
    line-height: 1.2em
}

#choose_email .choose-email-box .email {
    font-size: .95em;
    font-weight: 500
}

#choose_email .choose-email-box i,
#choose_email .choose-email-box img {
    width: 35px;
    height: 35px;
    margin-right: 10px;
    border-radius: 3px
}

#choose_email .choose-email-box i.fa {
    color: #aaa;
    text-align: center;
    line-height: 38px
}

#choose_email .choose-email-box i.fa::before {
    font-size: 30px
}

@media (max-width:950px) {
    .split-view .left-side {
        width: 400px
    }
}

@media (max-width:850px) {
    .split-view .left-side {
        width: 350px
    }
}

@media (max-width:815px) {
    .flex {
        min-height: calc(100vh - 530px)
    }
}

@media (max-width:795px) {
    .register-account #registration {
        padding: 10px
    }

    .login-page-container,
    .register-page-container {
        width: 400px;
        text-align: center
    }

    .split-view .org-header .avatar {
        width: 50px;
        height: 50px
    }

    .split-view .org-header .info-box {
        margin-top: 0
    }

    .split-view .org-header .info-box .organization-path {
        margin-top: 0
    }

    .split-view .left-side,
    .split-view .right-side {
        margin: 0 auto !important
    }

    .split-view .left-side,
    .split-view .right-side {
        display: block;
        max-width: 100%
    }

    .split-view .left-side+.right-side {
        border-left: none;
        padding: 0;
        margin: 0 auto
    }

    .split-view .left-side {
        border: none;
        margin-right: 0;
        min-height: 0;
        margin-bottom: 20px;
        width: 324px
    }

    .split-view .left-side .description {
        margin: 20px 0
    }

    .split-view .left-side .description a {
        color: #007ab7
    }

    .split-view .right-side {
        width: 324px
    }
}

@media (max-width:500px) {
    .new-style .get-started {
        font-size: 1.6em
    }

    .app-main.find-account-page-container,
    .app-main.forgot-password-container,
    .app-main.goto-account-page-container,
    .app-main.login-page-container,
    .app-main.register-page-container {
        display: inline-block;
        padding: 20px;
        width: calc(100% - 40px)
    }

    .forgot-password-container form .input-box {
        text-align: center
    }

    .forgot-password-container form button {
        width: 328px
    }

    .white-box {
        box-shadow: none
    }

    .account-creation {
        font-weight: 400
    }

    .flex {
        min-height: calc(100vh - 505px)
    }
}

@media (max-width:400px) {
    .flex {
        min-height: calc(100vh - 560px)
    }
}

.account-creation .white-box .user_email {
    word-break: break-all
}

@media (min-width:800px) {
    .account-creation .white-box {
        max-width: 800px
    }
}

.markdown {
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5;
    overflow: auto
}

.markdown h1[id]::before,
.markdown h2[id]::before,
.markdown h3[id]::before,
.markdown h4[id]::before {
    display: block;
    content: " ";
    visibility: hidden
}

.markdown h2[id]::before,
.markdown h3[id]::before,
.markdown h4[id]::before {
    margin-top: -10px;
    height: 10px
}

.markdown h1 {
    border-bottom: 1px solid #ededed;
    padding-bottom: 10px;
    margin-bottom: 15px
}

.markdown h1[id]::before {
    margin-top: -30px;
    height: 30px
}

.markdown h1#zulip-administration {
    font-size: 1.75em;
    padding: 10px 0;
    margin-bottom: 0;
    line-height: 100%
}

.markdown h2 {
    font-size: 1.5em;
    line-height: 1.25;
    margin: 20px 0 5px
}

.markdown h3 {
    font-size: 1.25em;
    line-height: 1.25;
    opacity: 1;
    margin: 20px 0 5px
}

.markdown h1,
.markdown h2,
.markdown h3 {
    font-weight: 700;
    -webkit-user-select: none;
    user-select: none
}

.markdown h1:hover,
.markdown h2:hover,
.markdown h3:hover {
    cursor: pointer
}

.markdown h1:hover::after,
.markdown h2:hover::after,
.markdown h3:hover::after {
    display: inline-block;
    font: normal normal normal 16px/1 FontAwesome;
    cursor: pointer;
    content: "\f0c1";
    margin-left: 5px;
    vertical-align: middle
}

.markdown h5,
.markdown h6 {
    margin: 10px 0;
    line-height: 20px
}

.markdown div.centered_table+table td:not(:first-child),
.markdown div.centered_table+table th {
    text-align: center
}

.markdown .legend_symbol {
    position: absolute;
    left: calc(40px);
    transform: translateX(-50%)
}

@media (max-width:800px) {
    .markdown .legend_symbol {
        left: calc(5% + 50px)
    }
}

.markdown .legend_label {
    position: relative;
    left: calc(30px)
}

.markdown li {
    line-height: 150%
}

.markdown ol {
    counter-reset: item;
    list-style: none
}

.markdown ol>li {
    position: relative;
    vertical-align: top;
    padding-left: 33px;
    top: -2px;
    counter-increment: item
}

.markdown ol>li::before {
    position: absolute;
    top: 0;
    left: 0;
    content: counter(item);
    display: inline-block;
    vertical-align: top;
    padding: 3px 6.5px 3px 7.5px;
    margin-right: 5px;
    background-color: #51c2af;
    color: #fff;
    border-radius: 100%;
    font-size: .9em;
    line-height: 1.1;
    text-align: center
}

.markdown ol>li .codehilite {
    background-color: #fff
}

.markdown ol>li .codehilite pre {
    white-space: pre;
    overflow-x: auto
}

.markdown ol>li>ul {
    margin-bottom: 5px
}

.markdown ol>li .keyboard_tip,
.markdown ol>li .tip,
.markdown ol>li .warn {
    margin: 5px 25px
}

@media (max-width:500px) {
    .markdown ol {
        margin-left: 0
    }
}

.markdown ul {
    margin: 0 10px 15px 25px
}

.markdown ul ul {
    margin: 0 20px
}

.markdown ul>li {
    margin: 5px 0 10px
}

.markdown ul>li>p {
    margin: 0 0 5px
}

.markdown ul>li>p:first-child {
    margin: 0
}

.markdown .content {
    padding: 30px;
    max-width: 700px;
    background-color: #fff
}

.markdown .content ol li p:not(:first-child) {
    display: block
}

.markdown .content>ol {
    margin: 15px 10px
}

.markdown .content>ol>li {
    margin: 2.5px 0
}

.markdown .content i.zulip-icon {
    margin: 0 2px 2px;
    vertical-align: middle
}

@media (max-width:500px) {
    .markdown .content {
        padding: 10px
    }
}

.markdown a {
    color: #389892;
    font-weight: 600
}

.markdown a code {
    color: #389892
}

.markdown strong {
    font-weight: 600
}

.markdown img {
    vertical-align: top;
    box-shadow: 0 0 4px hsla(0, 0%, 0%, .05);
    border: 1px solid #ddd;
    border-radius: 4px
}

.markdown img.inline {
    height: 1.4em;
    box-shadow: none
}

.markdown img.emoji-small {
    width: 20px;
    box-shadow: none;
    border: none;
    vertical-align: sub
}

.markdown img.emoji-big {
    width: 25px;
    box-shadow: none;
    border: none
}

.markdown img.mobile-icon {
    width: 24px;
    box-shadow: none;
    border: none
}

.markdown .keyboard_tip,
.markdown .tip,
.markdown .warn {
    position: relative;
    display: block;
    background-color: #f2f4f7;
    border: 1px solid #dfe5eb;
    border-radius: 4px;
    padding: 10px;
    margin: 5px 0
}

.markdown .keyboard_tip p,
.markdown .tip p,
.markdown .warn p {
    margin-bottom: 0
}

.markdown .keyboard_tip p:first-of-type,
.markdown .tip p:first-of-type,
.markdown .warn p:first-of-type {
    display: inline
}

.markdown .keyboard_tip,
.markdown .tip {
    background-color: #faf6ea;
    border: 1px solid #efe3bc
}

.markdown .tip::before {
    display: inline;
    content: "\f0eb   Tip:  ";
    font-family: FontAwesome, "Source Sans 3", sans-serif;
    font-weight: 600
}

.markdown .keyboard_tip::before {
    display: inline;
    content: "\f11c   Keyboard shortcut:  ";
    font-family: FontAwesome, "Source Sans 3", sans-serif;
    font-weight: 600
}

.markdown .indicator {
    position: relative;
    display: inline-block;
    top: 1px;
    padding: 5px;
    border-radius: 6px
}

.markdown .indicator.grey {
    border: 1px solid #ccc
}

.markdown .indicator.grey-line {
    border: 1px solid #ccc;
    top: 2px
}

.markdown .indicator.grey-line::after {
    content: "";
    background: #ccc;
    height: 1.5px;
    width: 6px;
    display: block;
    margin: .5px -2px
}

.markdown .indicator.orange {
    border: 1px solid #eb7e19;
    background: linear-gradient(to bottom, hsla(0, 0%, 100%, 0) 50%, #eb7e19 50%)
}

.markdown .indicator.green {
    border: 1px solid #43c31d;
    background-color: hsla(106, 74%, 44%, .3)
}

.markdown .indicator.green.solid {
    background-color: #43c31d
}

.markdown kbd {
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-weight: 600;
    white-space: nowrap;
    background-color: #f9f9f9;
    color: #333;
    text-shadow: 0 1px 0 #fff;
    font-size: .85em;
    padding: 0 .4em
}

.markdown kbd.arrow-key {
    line-height: 1;
    padding: 0 .2em .2em;
    font-size: 1.2em
}

.markdown code {
    font-family: "Source Code Pro", monospace;
    font-size: .825em;
    unicode-bidi: embed;
    direction: ltr;
    color: #000;
    border-radius: 3px;
    white-space: normal;
    white-space: initial;
    padding: 0 4px;
    background-color: #ededed
}

.markdown pre code {
    font-size: 14px;
    white-space: pre-wrap;
    padding: 0;
    color: inherit;
    background-color: transparent;
    border: 0
}

.markdown .code-section ol {
    margin-left: 15px;
    margin-top: 10px
}

.markdown .code-section ul.nav {
    margin: 0
}

.markdown .code-section ul.nav li {
    display: inline-block;
    padding: 5px 14px;
    margin: 0;
    cursor: pointer
}

.markdown .code-section ul.nav li.active {
    color: #389892;
    margin-bottom: -1px;
    border: 1px solid #ddd;
    border-bottom: 1px solid #fff;
    border-radius: 4px 4px 0 0
}

.markdown .code-section.no-tabs ul.nav {
    display: none
}

.markdown .code-section .blocks {
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid #ddd
}

.markdown .code-section .blocks>div {
    display: none
}

.markdown .code-section.has-tabs .blocks {
    border-radius: 0 6px 6px
}

.markdown .code-section.no-tabs .blocks {
    border-radius: 6px
}

.markdown .code-section.has-tabs .blocks>.active,
.markdown .code-section.no-tabs .blocks>div {
    display: block
}

.nav-zulip-logo {
    background-image: url("data:image/svg+xml,%3Csvg width=%27108%27 height=%2728%27 viewBox=%270 0 108 28%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cg clip-path=%27url%28%23clip0_555_12341234%29%27%3E%3Cpath d=%27M25.0534 4.18667C25.0534 5.59714 24.4217 6.85034 23.4589 7.6106L14.1128 15.9802C13.9392 16.1294 13.7136 15.8888 13.8388 15.688L17.267 8.80536C17.3631 8.61266 17.2385 8.37582 17.0414 8.37582H3.7444C1.68498 8.37582 0 6.49104 0 4.18791C0 1.88416 1.68498 6.14715e-07 3.7444 6.14715e-07H21.309C23.3684 -0.00124264 25.0534 1.88353 25.0534 4.18667ZM3.7444 28H21.309C23.3684 28 25.0534 26.1152 25.0534 23.8121C25.0534 21.5083 23.3684 19.6242 21.309 19.6242H8.01203C7.81489 19.6242 7.69029 19.3873 7.78638 19.1946L11.2146 12.312C11.3398 12.1112 11.1142 11.8706 10.9406 12.0198L1.59447 20.3882C0.631713 21.1478 0 22.4016 0 23.8121C0 26.1152 1.68498 28 3.7444 28ZM36.136 20.2825L43.8715 9.11804V9.02107H36.8588V5.97633H48.6431V8.10292L41.0762 19.1225V19.2195H48.764V22.2642H36.136V20.2825V20.2825ZM57.1505 5.97633V15.353C57.1505 18.1559 58.2106 19.5819 60.0909 19.5819C62.0189 19.5819 63.0789 18.2286 63.0789 15.353V5.97633H66.7421V15.1105C66.7421 20.137 64.2116 22.5291 59.97 22.5291C55.8728 22.5291 53.4631 20.2576 53.4631 15.0621V5.97633H57.1505V5.97633ZM72.3333 5.97633H76.0207V19.1704H82.4792V22.2636H72.3333V5.97633ZM90.7454 5.97633V22.2636H87.058V5.97633H90.7454ZM96.3359 6.1939C97.4686 6.00058 99.0593 5.85574 101.3 5.85574C103.566 5.85574 105.181 6.29088 106.265 7.16054C107.301 7.98233 108 9.33561 108 10.9301C108 12.5252 107.47 13.8785 106.506 14.7966C105.253 15.9808 103.397 16.5123 101.228 16.5123C100.747 16.5123 100.313 16.4881 99.9756 16.4396V22.2636H96.3366V6.1939H96.3359ZM99.975 13.5888C100.288 13.6615 100.674 13.6851 101.204 13.6851C103.156 13.6851 104.361 12.6943 104.361 11.0271C104.361 9.52894 103.324 8.63442 101.493 8.63442C100.746 8.63442 100.24 8.70715 99.975 8.77926V13.5888V13.5888Z%27 fill=%27white%27%3E%3C/path%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%27clip0_555_12341234%27%3E%3Crect width=%27108%27 height=%2728%27 fill=%27white%27%3E%3C/rect%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-repeat: no-repeat;
    width: 108px
}

.top-menu {
    position: fixed;
    width: 100%;
    background: hsla(240, 100%, 10%, .6);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    color: #fff;
    z-index: 10;
    overflow: hidden
}

.top-menu-container {
    max-width: 1312px;
    margin: 0 auto;
    display: flex;
    align-items: center
}

.top-menu-logo {
    overflow: hidden;
    opacity: .85;
    padding: 14px;
    margin: 0 16px;
    flex-shrink: 0
}

.top-menu-items-group-1,
.top-menu-items-group-2 {
    display: flex
}

.top-menu-items-group-1 {
    margin-right: 32px
}

.top-menu-item,
.top-menu-item:focus,
.top-menu-item:hover,
.top-menu-item:visited,
.top-menu-mobile a,
.top-menu-mobile a:focus,
.top-menu-mobile a:hover,
.top-menu-mobile a:visited {
    color: hsla(0, 0%, 100%, .8)
}

.top-menu-item {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 28px;
    padding: 14px;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    transition-property: background, color;
    transition-duration: 50ms;
    transition-timing-function: ease-out;
    color: hsla(0, 0%, 100%, .8)
}

.top-menu-item:hover {
    color: #fff;
    background: hsla(240, 100%, 10%, .1);
    transition-duration: 50ms
}

.top-menu-item:active {
    color: #fff;
    background: hsla(240, 100%, 10%, .2)
}

.top-menu-item.top-menu-tab,
.top-menu-item.top-menu-tab:active,
.top-menu-item.top-menu-tab:hover {
    opacity: 1;
    background: 0 0
}

.top-menu-item-spacer {
    flex-shrink: 1;
    flex-grow: 1
}

.top-menu-item input[type=radio],
.top-menu-tab-input-unselect {
    display: none
}

.top-menu-item.top-menu-tab {
    padding: 0;
    position: relative;
    cursor: auto
}

.top-menu-tab-unselect {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
    cursor: pointer
}

.top-menu-tab-input:checked+label {
    transition: background, color .2s;
    background: hsla(240, 100%, 10%, .6);
    color: #fff;
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none
}

.top-menu-tab label {
    padding: 16px;
    cursor: pointer;
    transition-property: background, color;
    transition-duration: .1s;
    transition-timing-function: ease-out;
    z-index: 5;
    color: hsla(0, 0%, 100%, .8);
    margin-bottom: 0;
    font-size: inherit;
    line-height: inherit
}

.top-menu-tab label::after {
    pointer-events: none;
    content: " ";
    display: inline-block;
    vertical-align: middle;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27rgba%28255%2c255%2c255%2c0.8%29%27 stroke-width=%273%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 class=%27feather feather-chevron-down%27%3e%3cpolyline points=%276 9 12 15 18 9%27%3e%3c/polyline%3e%3c/svg%3e");
    background-size: 16px;
    margin-left: 2px;
    margin-right: -8px;
    background-repeat: no-repeat
}

.top-menu-tab .top-menu-tab-input:checked+label::after {
    transform: rotate(-180deg)
}

.top-menu-tab .top-menu-tab-input:not(:checked)+label:hover {
    background: hsla(240, 100%, 10%, .1);
    color: #fff;
    transition-duration: .1s
}

.top-menu-tab .top-menu-tab-input:not(:checked)+label:active {
    background: hsla(240, 100%, 10%, .2);
    color: #fff
}

.top-menu-tab label.top-menu-tab-user-label::after {
    display: block;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-45%)
}

.top-menu-tab .top-menu-tab-input:checked+label.top-menu-tab-user-label::after {
    transform: translateY(-45%) rotate(-180deg)
}

.top-menu-submenu-backdrop {
    background: #003;
    opacity: 0;
    height: 0;
    width: 100%;
    transition: all 50ms
}

.top-menu-tab-input-unselect:not(:checked)+.top-menu-submenu-backdrop {
    height: 334px;
    opacity: 1
}

.top-menu-tab-label-unselect {
    position: absolute;
    display: none;
    right: 15px;
    top: 60px;
    width: 44px;
    height: 44px;
    background-size: 32px;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27rgba%28255,255,255,1%29%27 stroke-width=%271.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3e%3cline x1=%2718%27 y1=%276%27 x2=%276%27 y2=%2718%27%3e%3c/line%3e%3cline x1=%276%27 y1=%276%27 x2=%2718%27 y2=%2718%27%3e%3c/line%3e%3c/svg%3e");
    background-position: center;
    cursor: pointer;
    opacity: .5
}

.top-menu-tab-label-unselect:hover {
    opacity: .8
}

.top-menu-tab-label-unselect:active {
    opacity: 1
}

.top-menu-tab-input-unselect:not(:checked)~.top-menu-tab-label-unselect {
    display: block
}

.top-menu-submenu {
    position: absolute;
    top: 60px;
    display: flex;
    gap: 16px;
    opacity: 0;
    visibility: hidden;
    transition: all .2s
}

.top-menu-tab .top-menu-tab-user-label {
    max-width: 140px;
    padding-right: 28px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.top-menu-tab-user-img {
    width: 24px;
    height: 24px;
    display: inline;
    vertical-align: middle;
    border-radius: 3px;
    margin-right: 4px
}

.top-menu-mobile-user-img {
    width: 28px;
    height: 28px;
    display: inline;
    vertical-align: text-top;
    border-radius: 3px;
    margin-right: 4px
}

@media (max-width:1400px) {
    .top-menu-submenu.singup-column {
        justify-content: flex-end;
        right: 55px
    }
}

@media (max-width:1170px) {
    .top-menu-tab .top-menu-tab-user-label {
        max-width: 84px
    }
}

@media (max-width:1024px) {
    .top-menu-tab .top-menu-tab-user-label {
        max-width: 40px
    }

    .top-menu-tab .top-menu-tab-user-label span {
        display: none
    }
}

.top-menu-tab-input:checked~.top-menu-submenu {
    opacity: 1;
    visibility: visible
}

.top-menu-submenu-column {
    display: flex;
    flex-direction: column;
    padding-top: 16px;
    flex-shrink: 0;
    max-width: 420px
}

.top-menu-submenu-column .top-menu-submenu-list {
    margin: 0;
    list-style: none
}

.top-menu-submenu-column .top-menu-submenu-list .top-menu-submenu-list-item {
    font-size: 17px;
    font-weight: 400;
    color: hsla(0, 0%, 100%, .9);
    border-radius: 2px;
    cursor: pointer
}

.top-menu-submenu-column .top-menu-submenu-list .top-menu-submenu-list-item:hover {
    background: hsla(0, 0%, 100%, .1)
}

.top-menu-submenu-column .top-menu-submenu-list .top-menu-submenu-list-item:active {
    background: hsla(0, 0%, 100%, .2)
}

.top-menu-submenu-column .top-menu-submenu-list .top-menu-submenu-list-item a {
    display: block;
    padding: 6px 16px;
    -webkit-text-decoration: none;
    text-decoration: none;
    line-height: 125%;
    color: hsla(0, 0%, 100%, .9)
}

.top-menu-mobile .top-menu-mobile-item a {
    padding: 10px 10px 10px 53px;
    border-radius: 2px;
    cursor: pointer;
    -webkit-text-decoration: none;
    text-decoration: none;
    display: block
}

.top-menu-mobile .top-menu-mobile-item a:hover {
    background: hsla(0, 0%, 100%, .1)
}

.top-menu-mobile .top-menu-mobile-item a:active {
    background: hsla(0, 0%, 100%, .2)
}

.top-menu-submenu-section {
    padding-left: 16px;
    font-size: 17px;
    opacity: .6;
    margin-bottom: 4px;
    letter-spacing: 2px
}

.top-menu-mobile {
    display: none;
    background: hsla(240, 100%, 10%, .4);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 20;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 60px;
    overflow: auto;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: .02em;
    font-feature-settings: "pnum" on, "lnum" on;
    color: hsla(0, 0%, 100%, .8);
    transition: all .2;
    overscroll-behavior: contain
}

.top-menu-mobile[open] {
    bottom: 0;
    height: 100%;
    background: hsla(240, 100%, 5.9%, .8);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px)
}

.top-menu-mobile-items-group-1,
.top-menu-mobile-items-group-2 {
    display: flex;
    flex-direction: column;
    margin-bottom: 24px
}

.top-menu-mobile-items-group-1 a,
.top-menu-mobile-items-group-1 summary,
.top-menu-mobile-items-group-2 a,
.top-menu-mobile-items-group-2 summary {
    cursor: pointer;
    transition: background .4s ease-out
}

.top-menu-mobile-items-group-1 summary,
.top-menu-mobile-items-group-2 summary {
    padding: 10px 10px 10px 23px;
    -webkit-user-select: none;
    user-select: none
}

.top-menu-mobile-items-group-1 a,
.top-menu-mobile-items-group-2 a {
    padding-left: 53px
}

@media (hover:hover) and (pointer:fine) {

    .top-menu-mobile-items-group-1 summary:hover,
    .top-menu-mobile-items-group-2 summary:hover {
        background: hsla(0, 0%, 100%, .1);
        transition: none
    }
}

.top-menu-mobile-items-group-1 summary:active,
.top-menu-mobile-items-group-2 summary:active {
    background: hsla(0, 0%, 100%, .1)
}

.top-menu-mobile-item-summary::marker {
    content: ""
}

.top-menu-mobile-item-summary::before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin-top: -4px;
    margin-right: 4px;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27rgba%28255%2c255%2c255%2c0.7%29%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 class=%27feather feather-chevron-down%27%3e%3cpolyline points=%276 9 12 15 18 9%27%3e%3c/polyline%3e%3c/svg%3e");
    transition: transform .12s ease-out;
    transform: rotate(-90deg)
}

.top-menu-mobile details[open]>summary::before {
    transform: rotate(0)
}

.top-menu-mobile-submenu {
    display: flex;
    flex-direction: column;
    font-size: 18px;
    margin-bottom: 18px
}

.top-menu-mobile-submenu .top-menu-submenu-list {
    margin: 0;
    list-style: none
}

.top-menu-mobile-submenu .top-menu-submenu-list .top-menu-submenu-list-item {
    font-size: 17px;
    font-weight: 400;
    line-height: 26px;
    color: hsla(0, 0%, 100%, .9);
    border-radius: 2px;
    cursor: pointer
}

.top-menu-mobile-submenu .top-menu-submenu-list .top-menu-submenu-list-item:hover {
    background: hsla(0, 0%, 100%, .1)
}

.top-menu-mobile-submenu .top-menu-submenu-list .top-menu-submenu-list-item:active {
    background: hsla(0, 0%, 100%, .2)
}

.top-menu-mobile-submenu .top-menu-submenu-list .top-menu-submenu-list-item a {
    -webkit-text-decoration: none;
    text-decoration: none;
    padding: 5px 0 5px 53px;
    display: block
}

.top-menu-mobile-submenu-section {
    letter-spacing: .1em;
    color: hsla(0, 0%, 100%, .4);
    opacity: .8;
    text-transform: uppercase;
    margin-top: 8px;
    font-size: 17px;
    padding-left: 53px;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none
}

.top-menu-mobile-summary {
    cursor: pointer;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1;
    transition: all .3s;
    height: 60px;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.top-menu-mobile-summary:active {
    background: hsla(229, 47%, 17%, .8);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

.top-menu-mobile[open]>.top-menu-mobile-summary {
    background: hsla(229, 47%, 17%, .8);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

@supports not (((-webkit-backdrop-filter:blur(10px)) or (backdrop-filter:blur(10px))) or (-webkit-backdrop-filter:blur(10px))) {
    .top-menu {
        background: hsla(240, 100%, 10%, .8)
    }

    .top-menu-mobile {
        background: hsla(240, 100%, 10%, .8)
    }

    .top-menu-mobile[open] {
        background: hsla(240, 100%, 5.9%, 1)
    }

    .top-menu-mobile-summary:active {
        background: hsla(229, 47%, 17%, .95)
    }

    .top-menu-mobile[open]>.top-menu-mobile-summary {
        background: hsla(229, 47%, 17%, .95)
    }
}

.top-menu-mobile[open]>.top-menu-mobile-summary:active {
    background: #1b234a
}

.top-menu-mobile-summary::marker {
    content: "";
    display: none
}

.top-menu-mobile-summary::after {
    display: block;
    height: 32px;
    float: right;
    content: "MENU";
    line-height: 32px;
    color: hsla(0, 0%, 100%, .8);
    padding-right: 38px;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 2px;
    margin-right: 16px;
    background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27rgba%28255,255,255,0.9%29%27 stroke-width=%271.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3e%3cline x1=%273%27 y1=%2712%27 x2=%2721%27 y2=%2712%27%3e%3c/line%3e%3cline x1=%273%27 y1=%276%27 x2=%2721%27 y2=%276%27%3e%3c/line%3e%3cline x1=%273%27 y1=%2718%27 x2=%2721%27 y2=%2718%27%3e%3c/line%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: 32px;
    background-position: right;
    transition: background, letter-spacing .2s
}

.top-menu-mobile-summary:active::after {
    letter-spacing: 2px
}

.top-menu-mobile[open]>summary::after {
    content: "Close";
    background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27rgba%28255,255,255,0.9%29%27 stroke-width=%271.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3e%3cline x1=%2718%27 y1=%276%27 x2=%276%27 y2=%2718%27%3e%3c/line%3e%3cline x1=%276%27 y1=%276%27 x2=%2718%27 y2=%2718%27%3e%3c/line%3e%3c/svg%3e")
}

@media (hover:hover) and (pointer:fine) {
    .top-menu-mobile-summary:hover {
        background: #182043
    }

    .top-menu-mobile[open]>.top-menu-mobile-summary:hover {
        background: #182043
    }

    .top-menu-mobile-summary:hover::after {
        letter-spacing: 4px
    }
}

@media (max-width:1311px) {
    .top-menu {
        background: hsla(240, 100%, 10%, .5)
    }

    .top-menu-logo {
        margin-right: 0
    }

    .top-menu-item {
        padding: 16px 12px;
        font-size: 18px;
        font-weight: 500
    }
}

@media (max-width:940px) {
    .top-menu {
        display: none
    }

    .top-menu-logo {
        margin-right: 0;
        margin-right: initial;
        display: inline-block
    }

    .top-menu-mobile {
        display: block
    }
}

:root {
    --color-footer-background: hsl(238, 28%, 27%);
    --color-links: hsl(238, 100%, 82%)
}

@media (prefers-color-scheme:dark) {
    :root {
        --color-footer-background: hsl(238, 28%, 21%)
    }
}

#footer {
    background: #313258;
    background: var(--color-footer-background);
    box-sizing: border-box
}

#footer ul {
    list-style: none;
    margin: 0
}

#footer .footer__container {
    max-width: 1132px;
    padding: 52px 52px 0;
    display: flex;
    justify-content: space-between;
    gap: 40px;
    flex-flow: row wrap;
    margin: 0 auto
}

#footer .footer__section {
    flex-shrink: 0
}

#footer .footer__section-title {
    display: block;
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 133%;
    letter-spacing: .1em;
    color: #fff;
    opacity: .8;
    text-transform: uppercase;
    border-bottom: 0;
    margin-bottom: 0
}

#footer .footer__section ul {
    margin: 28px 0 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

#footer .footer__section ul li {
    margin-bottom: 10px
}

#footer li {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #a3a6fe;
    color: var(--color-links);
    border-bottom: 1px solid #313258;
    border-bottom: 1px solid var(--color-footer-background);
    transition: border .4s ease-out
}

#footer a,
#footer a:visited {
    font-weight: 400;
    font-size: 16px;
    color: #a3a6fe;
    color: var(--color-links)
}

#footer a:focus,
#footer a:hover {
    color: #a3a6fe;
    color: var(--color-links);
    border-bottom: 1px solid #a3a6fe;
    border-bottom: 1px solid var(--color-links);
    transition: none;
    -webkit-text-decoration: none;
    text-decoration: none;
    outline: 0
}

#footer .footer__legal {
    margin: 24px 0 5px;
    padding: 0 52px;
    border-top: 1px solid hsla(0, 0%, 100%, .1)
}

#footer .footer__legal a {
    margin-bottom: 10px;
    border-bottom: 1px solid #313258;
    border-bottom: 1px solid var(--color-footer-background)
}

#footer .footer__legal a:hover {
    border-bottom: 1px solid #a3a6fe;
    border-bottom: 1px solid var(--color-links)
}

#footer .footer__legal.footer__legal_not_corporate {
    margin-top: 0
}

#footer .footer__legal-container {
    max-width: 1132px;
    padding-top: 15px;
    display: flex;
    justify-content: space-between;
    flex-flow: row wrap;
    margin: 0 auto;
    box-sizing: border-box;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px
}

#footer .footer__legal-spacer {
    flex-grow: 1
}

#footer .footer__legal-container .copyright {
    color: hsla(0, 0%, 100%, .5);
    margin-bottom: 8px
}

#footer .footer__legal-container a {
    font-size: 14px;
    line-height: 18px
}

#footer .footer__legal-container a:not(:last-child) {
    margin-right: 2em
}

#footer .footer__section .extra_margin {
    margin-bottom: 40px
}

@media (max-width:940px) {
    #footer .footer__container {
        justify-content: flex-start;
        row-gap: 0
    }

    #footer .footer__legal-container {
        justify-content: flex-end
    }
}

@media (max-width:600px) {
    #footer .footer__legal {
        padding: 0 10px
    }

    #footer .footer__legal-spacer {
        width: 100%
    }

    #footer .footer__legal-container {
        -moz-column-gap: 20px;
        column-gap: 20px;
        justify-content: center
    }

    #footer .footer__legal-container a:not(:last-child) {
        margin-right: 0
    }
}

@media (max-width:400px) {
    #footer .footer__container {
        gap: 0;
        flex-direction: column
    }

    #footer .footer__section .extra_margin {
        margin-bottom: 36px
    }
}

/*# sourceMappingURL=977.58526d8316d44dc8b7ed.css.map */