@import url("https://fonts.googleapis.com/css?family=Open+Sans");
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap');
@import url("https://use.typekit.net/hki4mzk.css");

body.open {
    overflow-y: hidden
}

.Navigation__page {
    margin-top: 72px
}

.Navigation--transparent {
    margin-top: 0
}

.Header {
    background-color: #fff;
    box-shadow: 0 2px 14px rgba(0, 0, 0, .06);
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 5000
}

.Header .LogoText {
    fill: #000
}

.Header .LogoText--orange {
    fill: #f75a10
}

.Header--advertising:not(.Header--scrolled) {
    box-shadow: 0 2px 14px transparent;
    background-color: transparent;
    margin-top: 20px;
    padding-top: 10px
}

.Header--advertising .NavigationSecondary__item,
.Header--advertising .Navigation__heading {
    font-family: Open Sans, sans-serif;
    font-weight: 300
}

.Header--advertising .Button,
.Header--advertising .NavTabsHorizontal li a.Button,
.NavTabsHorizontal li .Header--advertising a.Button {
    font-family: Open Sans, sans-serif;
    line-height: 32px
}

.Header--advertising.Header--scrolled {
    margin-top: 0;
    background-color: #fff;
    box-shadow: 0 2px 14px rgba(0, 0, 0, .06)
}

.Header--advertising.Header--scrolled .ad-text {
    fill: #000 !important
}

.Header--advertising.Header--scrolled .ad-text--orange {
    fill: #ff5a00 !important
}

.Header--advertising.open .ad-text {
    fill: #000 !important
}

.Header--advertising.open .ad-text--orange {
    fill: #ff5a00 !important
}

.Header--advertising .Navigation__List-link {
    color: #090d35
}

.Header--advertising .Navigation__Main {
    margin-left: auto
}

.Header--advertising .Navigation__Links>span a {
    color: #090d35;
    font-weight: 700
}

@media screen and (max-width: 992px) {
    .Header--advertising.Header--dark.open {
        background-color: #fff
    }
}

@media screen and (min-width: 992px) {

    .Header--advertising.Header--dark:not(.Header--scrolled) .Navigation__Links a,
    .Header--advertising.Header--dark:not(.Header--scrolled) .Navigation__List-link,
    .Header--advertising.Header--dark:not(.Header--scrolled) .Navigation__List-link .Icon,
    .Header--advertising.Header--dark:not(.Header--scrolled) .Navigation__List-link--icon,
    .Header--advertising.Header--dark:not(.Header--scrolled) .Navigation__List-link--icon .Icon {
        color: #fff
    }

    .Header--advertising.Header--dark:not(.Header--scrolled) .LogoText {
        fill: #000
    }
}

.Header--transparent {
    background-color: transparent;
    box-shadow: none
}

.Header--transparent.open {
    background-color: #fff
}

.Header--transparent.open .Navigation__Links a,
.Header--transparent.open .Navigation__List-link,
.Header--transparent.open .Navigation__List-link .Icon,
.Header--transparent.open .Navigation__List-link--icon,
.Header--transparent.open .Navigation__List-link--icon .Icon {
    color: #0057be
}

@media(min-width: 992px) {

    .Header--transparent .Navigation__List li:active .Navigation__List-link--icon>span,
    .Header--transparent .Navigation__List li:active .Navigation__List-link>span,
    .Header--transparent .Navigation__List li:focus .Navigation__List-link--icon>span,
    .Header--transparent .Navigation__List li:focus .Navigation__List-link>span,
    .Header--transparent .Navigation__List li:focus-within .Navigation__List-link--icon>span,
    .Header--transparent .Navigation__List li:focus-within .Navigation__List-link>span,
    .Header--transparent .Navigation__List li:hover .Navigation__List-link--icon>span,
    .Header--transparent .Navigation__List li:hover .Navigation__List-link>span {
        border-color: currentColor
    }
}

.Header--transparent .Navigation__List-link,
.Header--transparent .Navigation__List-link--icon {
    color: #fff
}

.Header--transparent .Navigation__List-link--icon>span,
.Header--transparent .Navigation__List-link>span {
    border-bottom: 3px solid transparent;
    transition: all .15s ease;
    padding-bottom: 5px
}

.Header--transparent .Navigation__List-link .Icon,
.Header--transparent .Navigation__List-link--icon .Icon {
    color: #fff
}

@media(min-width: 992px) {

    .Header--transparent .Navigation__List-link--icon.active>span,
    .Header--transparent .Navigation__List-link--icon:focus>span,
    .Header--transparent .Navigation__List-link--icon:hover>span,
    .Header--transparent .Navigation__List-link.active>span,
    .Header--transparent .Navigation__List-link:focus>span,
    .Header--transparent .Navigation__List-link:hover>span {
        border-color: #fff
    }
}

.Header--transparent .Navigation__Links a {
    color: #fff
}

.Header--transparent .LogoText,
.Header--transparent .LogoText--orange {
    transition: all .1s ease-in;
    fill: #fff
}

.Header--transparent.Header--dark .Navigation__List-link,
.Header--transparent.Header--dark .Navigation__List-link .Icon,
.Header--transparent.Header--dark .Navigation__List-link--icon,
.Header--transparent.Header--dark .Navigation__List-link--icon .Icon {
    color: #0057be
}

@media(min-width: 992px) {

    .Header--transparent.Header--dark .Navigation__List-link--icon.active,
    .Header--transparent.Header--dark .Navigation__List-link--icon.active .Icon,
    .Header--transparent.Header--dark .Navigation__List-link.active,
    .Header--transparent.Header--dark .Navigation__List-link.active .Icon {
        color: #fff
    }
}

.Header--transparent.Header--dark .Navigation__Links a {
    color: #0057be
}

.Header--transparent.Header--dark .LogoText {
    fill: #000
}

.Navigation__Container {
    display: flex;
    flex-wrap: wrap;
    align-items: center
}

.Header {
    padding: 20px 0;
    transition: all .1s ease-in
}

.Navigation__Logo {
    width: 80px
}

.Navigation__Logo svg {
    stroke: transparent
}

.Navigation__Main {
    order: 3;
    width: 100%;
    height: 0;
    transition: all .1s ease-in;
    overflow: hidden
}

.Navigation__Main.open {
    height: 100vh
}

.Navigation__List {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin-top: 32px;
    padding: 0
}

.Navigation__List.Navigation__ListRemove {
    opacity: 0;
    pointer-events: none
}

.Navigation__List li {
    list-style-type: none;
    width: 100%;
    padding-bottom: 0;
    position: relative;
    cursor: pointer
}

.Navigation__List li:active [data-secondary-nav],
.Navigation__List li:focus [data-secondary-nav],
.Navigation__List li:focus-within [data-secondary-nav],
.Navigation__List li:hover [data-secondary-nav] {
    height: auto;
    transform: scale(1) translateZ(0)
}

.Navigation__List li ul {
    padding: 0
}

.Navigation__List li:last-child .Navigation__List-link {
    border-bottom: 2px solid rgba(0, 0, 0, .1)
}

.Navigation__List-link {
    display: block;
    padding: 10px 20px;
    text-decoration: none;
    transition: .1s ease-in;
    z-index: 500;
    font-size: 14px;
    position: relative;
    color: #0057be;
    border-top: 2px solid rgba(0, 0, 0, .1)
}

.Navigation__List-link .Icon {
    max-width: 10px;
    margin-left: 4px;
    transition: .1s ease-in
}

.Navigation__List-link.open,
.Navigation__List-link:focus,
.Navigation__List-link:hover {
    opacity: 1
}

.Navigation__List-link.open .Icon--down,
.Navigation__List-link:focus .Icon--down,
.Navigation__List-link:hover .Icon--down {
    transform: rotate(180deg)
}

[data-secondary-nav] {
    height: 0;
    transform: scale(0) translateZ(0)
}

[data-secondary-nav] .NavigationSecondary__contentList {
    transition: .12s ease-in
}

[data-secondary-nav] .NavigationSecondary__contentList li {
    list-style-type: none
}

.NavigationSecondary__item {
    padding-top: 10px;
    padding-bottom: 10px;
    transition: .1s ease-in;
    list-style-type: none;
    font-family: museo-slab, serif
}

.NavigationSecondary__item:first-child {
    padding-top: 10px
}

.NavigationSecondary__item:last-child {
    padding-bottom: 10px
}

.NavigationSecondary__item.active .Navigation__heading {
    text-decoration: underline
}

.NavigationSecondary__branding {
    max-width: 20px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 4px 0 0
}

.Navigation__heading {
    font-size: 14px;
    transition: all .15s ease;
    font-family: museo-slab, serif;
    font-weight: 700;
    color: black !important;
}

.text--green {
    color: #1fc164 !important
}

.Navigation__heading.larger {
    font-size: 20px
}

@media screen and (max-width: 992px) {
    .Navigation__heading.larger {
        font-size: 14px
    }
}

.Navigation__heading .Icon {
    color: #000 !important
}

.Navigation__heading:focus,
.Navigation__heading:hover {
    text-decoration: underline;
    transform: scale(.95)
}

.Navigation__heading.noHover {
    text-decoration: none;
    transform: scale(1)
}

.Navigation__paragraph {
    font-size: 14px;
    letter-spacing: -.02em;
    display: none;
    font-weight: 400
}

.NavigationSecondary__contentList {
    margin: 0;
    padding: 0;
    display: flex
}

.NavigationSecondary__contentList li {
    width: 50%;
    list-style-type: none;
    margin-top: 6px;
    font-size: 14px
}

.NavigationSecondary__contentList li a {
    display: inline-block;
    color: #000;
    transition: all .15s ease
}

.NavigationSecondary__contentList li a .Icon {
    color: #0057be !important
}

.NavigationSecondary__contentList li a.active,
.NavigationSecondary__contentList li a:focus,
.NavigationSecondary__contentList li a:hover {
    transform: scale(.95)
}

@media screen and (max-width: 992px) {
    .NavigationSecondary__contentList {
        display: block
    }

    .NavigationSecondary__contentList li {
        width: 100%
    }
}

.NavigationSecondary__item-content {
    display: flex;
    transition: .1s ease-in;
    border-radius: 8px;
    gap: 10px
}

.NavigationSecondary__item-content a {
    color: #000 !important;
}

@media screen and (max-width: 992px) {
    .NavigationSecondary__item-content {
        display: block
    }

    .NavigationSecondary__item-content.bg--light-grey {
        background-color: #fff
    }
}

.NavigationSecondary__item-content__hoverList {
    flex-grow: 0;
    flex-shrink: 0;
    width: 25%
}

@media screen and (max-width: 992px) {
    .NavigationSecondary__item-content__hoverList {
        width: 100%;
        display: flex;
        gap: 10px;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 20px
    }
}

.NavigationSecondary__item-content__hoverListItem {
    padding: 10px;
    background-color: transparent;
    transition: all .1s ease-in;
    border-radius: 8px
}

.NavigationSecondary__item-content__hoverListItem.active {
    background-color: #d8eaff
}

@media screen and (max-width: 992px) {
    .NavigationSecondary__item-content__hoverListItem {
        padding: 0 10px 4px;
        flex-grow: 1
    }
}

.NavigationSecondary__item-content__linkList {
    flex-grow: 1;
    background-color: #f4f5f8;
    border-radius: 8px;
    padding: 10px
}

.NavigationSecondary__item-content__linkList .NavigationSecondary__contentList {
    display: grid;
    grid-gap: 10px;
    gap: 10px;
    grid-template-columns: repeat(2, 1fr)
}

.NavigationSecondary__item-content__linkList .NavigationSecondary__contentList.singleColumn {
    grid-template-columns: repeat(1, 1fr)
}

.NavigationSecondary__item-content__linkList .NavigationSecondary__contentList a {
    text-decoration: none;
    color: #000
}

@media screen and (max-width: 992px) {
    .NavigationSecondary__item-content__linkList .NavigationSecondary__contentList {
        gap: 12px
    }

    .NavigationSecondary__item-content__linkList .NavigationSecondary__contentList.singleColumn {
        display: block
    }

    .NavigationSecondary__item-content__linkList {
        background-color: #fff;
        padding: 0
    }
}

.NavigationSecondary__item-content__grid {
    display: grid;
    grid-auto-columns: auto;
    grid-template-rows: auto;
    grid-template-columns: repeat(2, 1fr)
}

@media screen and (max-width: 992px) {
    .NavigationSecondary__item-content__grid {
        display: block
    }
}

.NavigationSecondary__item-content__grid--3 {
    display: grid;
    grid-gap: 24px;
    gap: 24px;
    grid-template-columns: repeat(3, 1fr)
}

@media screen and (max-width: 992px) {
    .NavigationSecondary__item-content__grid--3 {
        display: block
    }
}

.NavigationSecondary__contentDescription,
.NavigationSecondary__contentHeading {
    display: block
}

.NavigationSecondary__contentHeading {
    font-size: 18px;
    font-weight: 700
}

@media screen and (max-width: 992px) {
    .NavigationSecondary__contentHeading {
        font-size: 14px;
        font-weight: 400
    }
}

.NavigationSecondary__contentDescription {
    display: block;
    font-weight: 400
}

.NavigationSecondary__promoImage {
    width: 100%;
    height: auto;
    border-radius: 8px
}

.qr-code {
    max-width: 200px;
    margin: 0 auto;
    text-align: center;
    display: block
}

.appStoreCallout {
    margin-top: 20px;
    display: flex;
    justify-content: space-around
}

.appStoreCallout img {
    max-height: 40px
}

.Navigation__ButtonGroup {
    display: none
}

.Navigation__ButtonGroup.ButtonGroupMobile {
    display: flex
}

.SignUp,
.hiddenMobile {
    display: none
}

.SignUpBlock {
    width: 100%;
    text-align: center;
    margin-top: 32px
}

.NavTabsHorizontal li .SignUpBlock a.Button,
.SignUpBlock .Button,
.SignUpBlock .NavTabsHorizontal li a.Button {
    width: 50%
}

.Navigation__Buttons {
    margin-left: auto;
    display: flex;
    font-size: 14px
}

.Navigation__Search {
    margin-left: auto
}

@media only screen and (min-width: 992px) {
    body.open {
        overflow-y: scroll
    }

    .Navigation__page {
        margin-top: 83px
    }

    .Navigation--transparent {
        margin-top: 0
    }

    .Header {
        padding: 0
    }

    .Navigation__Main {
        height: auto;
        width: auto;
        order: 1
    }

    .Navigation__Main.open {
        height: auto
    }

    .Navigation__Logo {
        width: 151px
    }

    .ButtonGroup {
        display: flex
    }

    .ButtonGroup.ButtonGroupMobile,
    .hiddenDesktop {
        display: none
    }

    .SignUp,
    .hiddenMobile {
        display: block
    }

    .Navigation__Buttons {
        display: flex;
        align-items: center;
        margin-left: auto;
        order: 2
    }

    .Navigation__List {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0 0 0 44px
    }

    .Navigation__List li {
        position: relative;
        width: auto;
        max-width: 100%
    }

    .Navigation__List li:last-child .Navigation__List-link {
        border-bottom: none
    }

    .Navigation__List li:active [data-secondary-nav],
    .Navigation__List li:focus [data-secondary-nav],
    .Navigation__List li:focus-within [data-secondary-nav],
    .Navigation__List li:hover [data-secondary-nav] {
        transform: scale(1) translateZ(0)
    }

    .Navigation__List-link {
        display: block;
        padding: 30px 13px;
        text-decoration: none;
        transition: .1s ease-in;
        z-index: 500;
        font-size: 14px;
        color: #0057be;
        border: none;
        position: relative;
        font-family: museo-slab, serif;
        font-weight: 700
    }

    .Navigation__List-link>span {
        border-bottom: 3px solid transparent;
        transition: all .15s ease;
        padding-bottom: 5px
    }

    .Navigation__List-link .Icon {
        font-size: 10px;
        color: #0057be;
        transition: .1s ease-in
    }

    .Navigation__List-link.open>span,
    .Navigation__List-link:focus>span,
    .Navigation__List-link:hover>span {
        border-color: currentColor
    }

    .Navigation__List-link.open .Icon--down,
    .Navigation__List-link:focus .Icon--down,
    .Navigation__List-link:hover .Icon--down {
        transform: rotate(180deg)
    }

    .Navigation__List-link.open [data-secondary-nav],
    .Navigation__List-link:focus [data-secondary-nav],
    .Navigation__List-link:hover [data-secondary-nav] {
        transform: scale(1) translateZ(0)
    }

    .Navigation__List-link.active>span {
        border-color: currentColor
    }

    .Navigation__heading {
        font-size: 14px
    }

    .Navigation__paragraph {
        margin-top: 0;
        display: block;
        font-size: 13px
    }

    [data-secondary-nav] {
        transform-origin: top left;
        transform: scale(0) translate3d(0, -100px, 0);
        transition: .1s ease-in;
        overflow: hidden;
        height: auto;
        position: fixed;
        margin-left: -13px;
        margin-top: 30px;
        border-radius: 8px;
        border-top-left-radius: 0;
        box-shadow: 0 5px 19px -2px rgba(0, 0, 25, .16)
    }

    .NavigationSecondary__list {
        display: flex;
        flex-direction: column;
        list-style-type: none;
        max-width: 900px;
        margin-right: auto;
        border-top: 2px solid #0057be;
        padding-left: 0;
        background-color: #fff;
        flex: 1 1 auto;
        overflow-y: auto;
        margin-left: 0px;
    }

    .NavigationSecondary__list#for-brandsNavigation {
        max-width: 600px
    }

    .NavigationSecondary__list--full {
        max-width: 300px;
        flex-wrap: wrap;
        width: 100%
    }

    .NavigationSecondary__list--full .NavigationSecondary__item-content {
        align-items: flex-start;
        padding: 6px 6px 6px 25px
    }

    .NavigationSecondary__list--full .NavigationSecondary__item {
        width: 100%;
        padding: 0
    }

    .NavigationSecondary__list--full .NavigationSecondary__item.active,
    .NavigationSecondary__list--full .NavigationSecondary__item:first-child,
    .NavigationSecondary__list--full .NavigationSecondary__item:last-child {
        padding: 0
    }

    .NavigationSecondary__item {
        padding: 16px;
        transition: .1s ease-in;
        border-top: 4px solid transparent;
        list-style-type: none
    }

    .NavigationSecondary__item-content {
        transition: .1s ease-in
    }

    .NavigationSecondary__contentList {
        display: block
    }

    .NavigationSecondary__contentList li {
        width: auto;
        font-size: 13px
    }

    .Navigation__Links {
        vertical-align: middle;
        margin-top: 7px;
        margin-right: 20px
    }

    .Navigation__Links a {
        font-size: 12px;
        color: #0057be;
        text-align: center;
        transition: all .1s ease-in;
        display: inline-block
    }

    .Navigation__Links a:focus,
    .Navigation__Links a:hover {
        color: #004ba5;
        transform: scale(.95)
    }
}

@media(max-width: 767px) {
    .hidden-xs {
        display: none !important
    }
}

@media(min-width: 768px)and (max-width:991px) {
    .hidden-sm {
        display: none !important
    }
}

@media(min-width: 992px)and (max-width:1199px) {
    .hidden-md {
        display: none !important
    }
}

@media(min-width: 1200px) {
    .hidden-lg {
        display: none !important
    }
}

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px
}

.container:after,
.container:before {
    content: " ";
    display: table
}

.container:after {
    clear: both
}

@media(min-width: 768px) {
    .container {
        width: auto
    }
}

@media(min-width: 992px) {
    .container {
        width: auto
    }
}

@media(min-width: 1200px) {
    .container {
        width: 1170px
    }
}

.hidden {
    display: none !important;
    visibility: hidden !important
}

#contentArea {
    margin-top: 90px;
}

.container-fluid {
    max-width: inherit;
    margin: 0;
}

@media (min-width: 769px) {
    .navbar .container {
        max-width: 90%;
        margin: 0 auto;
    }

    .navbar .nav {
        position: relative;
    }

    .brand img {
        display: none;
    }

    .navbar .container-fluid {
        max-width: 90%;
        margin: 0 auto;
    }

    .navbar .navbar-inner {
        margin-top: 80px;
        background-color: white;
    }

    .navbar .nav li a:hover {}

    @media (max-width: 769px) {
        .navbar .navbar-inner {
            margin-top: 0px !important;
        }
    }

    .navbar .nav li {
        display: inherit;
        float: left;
    }

    .navbar .nav li a {
        text-align: center;
        line-height: 20px;
        margin: 10px;
        font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
        transition: all .15s;
    }

    .navbar .nav li a:hover {
        border-color: #1A6BAF;
        color: #1A6BAF;
    }

    .navbar .nav li.active a {
        border-color: #1A6BAF;
        background-color: #F3F7FA;
        color: #1A6BAF;
    }

    .navbar .nav li.active a:hover {
        color: #1A6BAF;
    }

    .navbar .nav>li>a {
        padding: 10px 6px 6px 6px;
    }

    #home {
        display: inherit;
    }

    .brand span {
        display: inherit;
        color: #1A6BAF;
        font-family: museo-slab, serif;
    }

    @media (max-width: 768px) {
        .navbar .nav li {
            float: none;
        }

        .navbar .nav li a:hover {
            border-bottom: none;
            background-color: #317AB7;
            color: white;
        }

        .navbar .nav li.active a {
            border-bottom: none;
            background-color: #317AB7;
            color: white;
        }
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .h6 {
        color: #1A6BAF;
        line-height: 1.35;
        font-family: museo-slab, serif;
    }

    h1 *,
    h2 *,
    h3 *,
    h4 *,
    h5 *,
    h6 *,
    .h1 *,
    .h2 *,
    .h3 *,
    .h4 *,
    .h5 *,
    .h6 * {
        line-height: 1.35;
    }

    h1,
    .h1,
    h2,
    .h2,
    h3,
    .h3 {
        margin-top: 10px;
    }

    h1 small,
    h1 .small,
    .h1 small,
    .h1 .small,
    h2 small,
    h2 .small,
    .h2 small,
    .h2 .small,
    h3 small,
    h3 .small,
    .h3 small,
    .h3 .small {
        font-size: 65%;
    }

    h4,
    .h4,
    h5,
    .h5,
    h6,
    .h6 {
        margin-top: 11px;
        margin-bottom: 11px;
    }

    h4 small,
    h4 .small,
    .h4 small,
    .h4 .small,
    h5 small,
    h5 .small,
    .h5 small,
    .h5 .small,
    h6 small,
    h6 .small,
    .h6 small,
    .h6 .small {
        font-size: 75%;
    }

    h1,
    .h1 {
        font-size: 2.027em;
        font-family: museo-slab, serif;
        margin-bottom: 5px;
    }

    h2,
    .h2 {
        font-size: 1.602em;
        font-family: museo-slab, serif;
        margin-bottom: 5px;
    }

    h3,
    .h3 {
        font-size: 1.125em;
        font-family: museo-slab, serif;
        color: #1A6BAF;
        margin-bottom: 5px;
    }

    h4,
    .h4 {
        font-size: 0.889em;
        font-family: museo-slab, serif;
    }

    h5,
    .h5 {
        font-size: 1.802em;
        font-family: museo-slab, serif;
    }

    h6,
    .h6 {
        font-size: 2.027em;
        font-family: museo-slab, serif;
    }

    p {
        font-family: "Open Sans" !important;
    }

    a {
        color: #317ab7;
    }

    a:hover {
        color: #21527b;
    }

    #mainNav .navbar-inner {
        display: none;
    }

    #mainNav .navbar-inner a.brand span {
        display: none;
    }

    #docsSearch {
        margin-top: 80px;
        min-height: 275px;
        width: 100%;
        background-color: #196BAE;
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/87YrUrtlgQ7zJkdfAm0gF/87YrUrtlgQ7zJkdfAm0gF-1x.png');
        border-bottom: 1px solid #DFDFDF;
        background-size: cover;
        background-repeat: no-repeat;
        padding: 90px 0px;
        margin: 0px !important;
    }

    #docsSearch h1 {
        color: white;
    }

    #docsSearch h1:before {
        content: '';
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/RgDgjbkc1Npx12OlZrNM1/RgDgjbkc1Npx12OlZrNM1-1x.png');
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        margin: 0 auto;
        width: 326px;
        height: 130px;
        display: block;
    }

    #searchBar {
        margin-top: 5px;
    }

    #searchBar button {
        background: #0057BE;
        border-color: transparent;
        color: #fff;
    }

    .article-count {
        display: none;
    }

    #contentArea {
        margin-left: 8%;
        margin-right: 8%;
    }



    #main-content {
        background: none;
    }

    .contentWrapper {
        color: #383838;
        margin-bottom: 16px;
        border: 1px solid #d6d6d6;
        border-radius: 8px;
    }




    #categoryHead h1 {
        font-weight: 700;
    }

    #contentArea h2 {
        font-weight: 700;
    }

    #fullArticle h1 {
        color: #1A6BAF;
        font-weight: 700;
    }

    #fullArticle p,
    #fullArticle ul,
    #fullArticle ol,
    #fullArticle li,
    #fullArticle div,
    #fullArticle blockquote,
    #fullArticle dd,
    #fullArticle table {
        font-size: 16px;
    }

    figcaption {
        font-style: normal;
    }

    /* IN THIS ARTICLE SECTION */

    #fullArticle .index-list {
        background: #FAFAFA;
        border-left: .5rem solid #A0B3C5;
        margin: 1.5rem auto;
        padding: 1rem 0px;
        width: 75%;
    }

    #fullArticle .index-list h4 {
        margin: 0;
        padding: 8px 26px 0;
        display: block;
    }

    #fullArticle .index-list ul {
        list-style: none;
        margin: .5rem 0;
    }

    #fullArticle .index-list li {
        padding-left: 2.5rem;
        font-size: 1rem;
    }

    #fullArticle .index-list ul li a:hover {
        text-decoration: none;
    }

    #fullArticle .index-list:before,
    #fullArticle .index-list:after {
        display: table;
        content: "";
        line-height: 0;
    }

    #fullArticle .index-list::after {
        clear: both;
    }

    /* END IN THIS ARTICLE SECTION */

    /*CUSTOM CALLOUTS*/

    /* BLUE OUTLINE CALLOUT */

    .outline-callout {
        background-color: #FFF;
        border-style: solid;
        border-width: 4px;
        border-color: #A3C3DF;
        border-radius: 25px;
        padding: 20px;

    }

    /* SPECIAL NOTE CALLOUTS */

    .note,
    .tip,
    .info,
    .attention,
    .warning {
        font-size: 1rem;
        border-radius: 6px;
        border: 2px solid;
        position: relative;
        display: block;
        margin: auto;
        width: fit-content;
        padding: 1rem 1.5rem 1rem 3rem;
        text-indent: -1.5rem;
    }

    .note::before,
    .tip::before,
    .info::before,
    .attention::before,
    .warning::before {
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        font-size: 1.5rem;
        vertical-align: top;
        display: inline;
        padding-right: 2px;
    }

    .info {
        background-color: #F2F2F2;
        border-color: #646464;
    }

    .info::before {
        content: "\f05a";
        color: #646464;

    }

    .note {
        background-color: #E1EFFB;
        border-color: #1a6baf;
    }

    .note::before {
        content: "\f303";
        color: #1a6baf;
    }

    .tip {
        background-color: #D8ECC6;
        border-color: #7FC243;
    }

    .tip::before {
        content: "\f0d0";
        color: #7FC243;
    }

    .attention {
        background-color: #FFF8D8;
        border-color: #FFE500;
    }

    .attention::before {
        content: "\f0e7";
        color: #FFE500;
    }

    .warning {
        background-color: #f6D0D0;
        border-color: #E26362;
    }

    .warning::before {
        content: "\f071";
        color: #E26362;
    }

    /* ISSUE ARTICLE SOLUTION */

    .solution {
        background-color: #FFF;
        border-left: 4px solid #A5D47B;
        padding: .5rem 2rem;
        margin-left: 1rem;

    }

    /* END CUSTOM CALLOUTS */

    .video {
        margin: 0 auto;
    }

    /* Back To Top Button */
    #fullArticle .btt-btn {
        color: #FFFFFF;
        background-color: #1a6baf;
        border: 1px solid #14558C;
        border-bottom-width: 2px;
        border-radius: 6px;
        cursor: pointer;
        text-align: center;
        font-size: .9rem;
        font-weight: 700;
        padding: .25rem .5rem;
        display: inline-block;
        margin: .05rem 0.05rem .05rem .75rem;
        text-transform: uppercase;
        vertical-align: middle;
        white-space: nowrap;
        float: right;
        clear: both;
        transition: all 250ms ease-in-out;
    }

    #fullArticle .btt-btn:hover {
        text-decoration: none;
        color: #FFF;
        background-color: #13426E;
    }

    #fullArticle .btt-btn::before {
        font-family: "Font Awesome 5 Free";
        content: "\f0aa \0020";
        font-weight: 900;
        font-size: 1.5rem;
        vertical-align: middle;
    }


    /* End Back To Top Button */

    /* TEAMSNAPPY BUTTON */

    .ts-btn {
        color: #FFF;
        background: #006FF5;
        border: none;
        border-radius: 5px;
        text-align: center;
        font-size: 1rem;
        font-weight: 600;
        padding: 16px 24px 16px 16px;
        display: inline-block;
        margin: .05rem;
        transition: all 250ms ease-in-out;
        float: none;
        clear: both;
    }

    a.ts-btn {
        color: #FFF;
    }

    .ts-btn:hover {
        background-color: #0057BE;
        color: #FFF;
        text-decoration: none;
    }

    /* END TEAMSNAPPY BUTTON */



    /* GUIDE INDEX BOX */
    #fullArticle .guide-index {
        background-color: #FFF;
        border-style: solid;
        border-width: 4px;
        border-color: #FF8F00;
        border-radius: 25px;
        width: 65%;
        padding: 0 2%;
        margin: 2% auto;
    }

    #fullArticle .guidemenu {
        list-style: none;
    }

    #fullArticle .guidemenu h5 {
        font-size: 1rem;
        font-weight: 500;
        font-family: museo-slab, serif;
    }

    #fullArticle .menu-item {
        box-shadow: 0 5px 5px -5px #909090;
        font-size: .9rem;
        color: #FFF;
        padding: 2px 10px;
        margin: 1%;
    }

    .menu-item.active {
        background-color: #13426E;
        font-weight: 600;
        font-size: 1rem;
        color: #FFF;
    }

    .menu-item.active a {
        color: #FFF;
    }

    .menu-item.active a:hover {
        color: #FFF;
    }

    .menu-item.active:before {
        color: #F75B02;
        font-size: 1rem;
        font-weight: 700;
        content: "\276F \0020";
    }

    .menu-item.inactive {
        background-color: #FAFAFA;
    }

    .menu-item a:hover {
        color: #1a6baf;
    }

    .menu-item a {
        text-decoration: none;
        color: #909090;
    }

    /* Jump to list */


    a.jump-to {
        text-decoration: none;
        font-size: 1rem;
        line-height: normal;
        color: #606060;
        align-items: center;
        border: 2px solid #ededed;
        border-radius: 0.8rem;
        flex-basis: 100%;
        font-weight: 500;
        justify-content: space-between;
        margin-bottom: 1rem;
        padding: 1rem;
        text-align: left;
        display: flex;
        position: relative;
        transform: perspective(1px) translateZ(0);
        transition: .5s ease-in-out;
    }

    .jump-to:hover,
    .jump-to:focus,
    .jump-to:active {
        color: #1a6baf;
        border: 2px solid #1A6BAF;
        border-radius: 0.8rem;
        background-color: #f3f7fb;
    }

    .jump-to:hover:before {
        transform: translate(8px, 0) !important;
    }

    .jump-to:before {
        content: "\f054";
        position: absolute;
        right: 1.5em;
        padding: 0 1px;
        font-family: "FontAwesome";
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-transition: transform .2s ease-in-out;
        transition: transform .2s ease-in-out;
    }

    .jump-to .jump-to-icon {
        content: "\f054";
        position: absolute;
        right: 1.5em;
        padding: 0 1px;
        font-family: "FontAwesome";
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-transition: transform .5s ease-in-out;
        transition: transform .5s ease-in-out;
    }

    /* Font Awesome Styling */
    .fas {
        -webkit-font-smoothing: antialiased;
        font-weight: 900;
        font-family: "FontAwesome";
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        line-height: 1;
    }


    /* End Font Awesome Styling */


    /* Applicability bar */
    #fullArticle .applicability {
        width: 100%;
        display: inline-flex;
        justify-content: space-around;
        align-items: center;
        flex-basis: 100%;
        list-style: none;
        margin: 0 0 0.75rem 0;
        padding: 0;
        position: relative;
    }

    #fullArticle .applicability ul {
        border-radius: .8rem;
        padding: .5rem;
        margin: 0 .05rem;
        background-color: #F3F7FA;
        position: relative;
    }

    #fullArticle .applicability ul li ul {
        background-color: #1a6baf;
        white-space: nowrap;
    }

    #fullArticle .applicability ul li ul li {
        color: #FFF;
        font-size: .75rem;
        font-weight: 400;
        line-height: 1.5;
        margin: 0 auto;
    }

    ul.product {
        max-width: 10rem;
    }

    ul.plan {
        max-width: 6.5rem;
    }

    #fullArticle .applicability li {
        padding: 0;
        display: inline-flex;
        vertical-align: middle;
        float: left;
        font-weight: 400;
        color: #17609D;
        margin: auto .2rem;
    }

    .applicability i {
        padding-right: .5rem;
        position: relative;
        top: .25rem;
    }

    .applicability .web:before {
        content: "\f390";
        position: absolute;
        font-family: "FontAwesome";
    }

    .applicability .mobile:before {
        content: "\f3ce";
        position: absolute;
        font-family: "FontAwesome";
    }

    .applicability .webadmin:before {
        content: "\f4fe";
        position: relative;
        font-family: "FontAwesome";
    }

    .applicability .geo:before {
        content: "\f0ac";
        position: absolute;
        font-family: "FontAwesome";
    }

    .applicability .applicabilitytooltip {
        visibility: hidden;
        position: absolute;
        z-index: 2;
        width: fit-content;
        color: #FFF;
        font-size: .75rem;
        font-weight: 400;
        background-color: #1a6baf;
        border-radius: .8rem;
        padding: .5rem .75rem;
        opacity: 0;
        transition: all .5s ease-in-out;
        line-height: 1.5;
        margin: 0 auto;
    }

    .applicability .applicabilitytooltip:before {
        content: " ";
        position: absolute;
        transform: rotate(45deg);
        background-color: #1A6BAF;
        padding: .5rem;
        z-index: -1;
    }

    .applicability .admin:hover .applicabilitytooltip,
    .plan:hover .applicabilitytooltip {
        visibility: visible;
        opacity: 1;
    }

    .tipbottom {
        top: 130%;
        left: -50%;
    }

    .tipbottom:before {
        top: -5%;
        left: 45%;
    }

    .plan .tipbottom {
        top: 100%;
        left: -45%;
        min-width: 9rem;
    }


    .admin,
    .plan li {
        position: relative;
        display: inline-block;
        margin: 1rem;
        border-bottom: 1px dashed #17609D;
    }

    .applicability ul.access li:not(:only-child, :last-child)::after {
        content: "|";
        padding: 0 .25rem;
    }

    /* FAQ ACCORDIAN */
    details {
        width: 90%;
        margin: auto;
        box-shadow: 0 .2rem .75rem -.2rem rgba(0, 0, 0, 0.1);
    }

    summary {
        font-weight: 400;
        font-size: 1.15rem;
        padding: .75rem 4rem .5rem 1rem;
        margin: .5rem 0;
        color: #1a6baf;
        background: #fff;
        list-style: none;
        position: relative;
    }


    summary:hover {
        color: #13426E;
        cursor: pointer;
    }

    details>summary::after {
        position: absolute;
        content: "\002B";
        right: 3%;
        top: .75rem;
        font-size: 2rem;
        transition: transform .4s ease-in-out;
    }

    #fullArticle details p {
        padding: 1rem 2rem;
        margin-bottom: 0;
    }

    details[open] {
        background: #FAFAFA;
        border-radius: 0.8rem;
        padding-bottom: .1rem;
    }

    details[open]>summary::after {
        position: absolute;
        content: "\2212";
        transform: rotate(-180deg);
        transform-origin: 55% 60%;
        transition: ease .5s;
    }

    details summary::details-marker {
        display: none;
    }

    details[open] summary~* {
        animation: sweep .4s ease-in-out;
    }

    @keyframes sweep {
        0% {
            opacity: 0;
            transform: translateY(-10px)
        }

        100% {
            opacity: 1;
            transform: translateY(0)
        }
    }

    /* BOX LIST PAGE STYLING -used for faux sub-categorization*/

    .box-list {
        text-align: center;
        margin: 5 auto 0;
    }

    .box-list .box-item h3 {
        color: #747a7a;
        font-size: 24px;
        font-weight: 700;
        padding: 0px;
    }

    .box-list.box-item p {
        color: #d6d6d6;
        font-size: 18px;
        font-weight: 300;
        margin: 0px;
        padding: 0px;
        text-align: center;

    }

    .box-list .box-item button {
        color: #FFF;
        font-weight: 400;
        font-size: 18px;
        letter-spacing: 0.25px;
        background-color: #1a6baf;
        border: none;
        border-radius: 10px;
        margin: auto 0px;
        padding: 10px 25px;

    }

    .box-list .box-item {
        text-align: center;
        border: 1px solid #d6d6d6;
        border-radius: 8px;
        background-color: #fff;
        box-shadow: 0 7px 4px -5px rgba(0, 0, 0, 0.05);
        box-sizing: border-box;
        padding: 10px 15px 2% 15px;
        position: relative;
        width: 31.5%;
        min-width: 200px;
        transition: all 0.2s;
        min-height: 200px;
        margin: 0px .5%;
        float: left;
    }


    .box-list .clear-row:after {
        content: "";
        visibility: hidden;
        display: block;
        height: 0;
        clear: both;
    }

    .box-list .box-item a:hover {
        text-decoration: none;
    }

    .box-list .box-item:hover:nth-child(3n+1) {
        border: 1px solid #FF8F00;
        background: none;
        transition: all .15s;
    }

    .box-list .box-item:hover:nth-child(3n+1) h3 {
        color: #FF8F00 !important;
    }

    .box-list .box-item:hover:nth-child(3n+1) p {
        color: #747a7a !important;
    }

    .box-list .box-item:hover:nth-child(3n+2) {
        border: 1px solid #1A6BAF;
        background: none;
    }

    .box-list .box-item:hover:nth-child(3n+2) h3 {
        color: #1A6BAF !important;
    }

    .box-list .box-item:hover:nth-child(3n+2) p {
        color: #747a7a !important;
    }

    .box-list .box-item:hover:nth-child(3n+3) {
        border: 1px solid #7FC243;
        background: none;
    }

    .box-list .box-item:hover:nth-child(3n+3) h3 {
        color: #7FC243 !important;
    }

    .box-list .box-item:hover:nth-child(3n+3) p {
        color: #747a7a !important;
    }


    @media (max-width: 769px) {
        .box-list .box-item {
            width: 100%;
        }
    }


    .box-list2 {
        text-align: left;
        margin: 0 auto;
        position: relative;
        width: 100%;
    }

    .box-list2 .box-item2 h3 {
        color: #747a7a;
        font-size: 24px;
        font-weight: 700;
        padding: 0px;
        text-align: center;
    }

    .box-list2 ul {
        color: #d6d6d6;
        font-size: 18px;
        margin: 0px 0px 0px 5px;
        padding: 0px;
        list-style-type: none;
    }

    .box-list2 .box-item2 {
        text-align: left;
        border: 3px solid #d6d6d6;
        border-radius: 8px;
        background-color: #fff;
        box-shadow: 0 7px 4px -5px rgba(0, 0, 0, 0.05);
        box-sizing: border-box;
        padding: 10px 15px 2% 15px;
        position: relative;
        width: 45%;
        min-width: 200px;
        transition: all 0.2s;
        min-height: 300px;
        margin: 0px 2%;
        float: left;
    }


    .box-list2 .clear-row:after {
        content: "";
        visibility: hidden;
        display: block;
        height: 0;
        clear: both;
    }

    .box-list2 .box-item2 a:hover {
        text-decoration: none;
    }


    @media (max-width: 769px) {
        .box-list2 .box-item2 {
            width: 100%;
        }
    }

    /* END BOX LIST STYLING */
    /* In Article Tabs */
    * {
        box-sizing: border-box;
    }

    *:focus,
    input:focus+label {
        outline: none;

    }

    body {
        padding: 30px 20px;
        background: #fff;
        color: #333;
    }

    main {
        max-width: 801px;
        margin: auto;
    }

    .tabs {
        display: flex;
        flex-wrap: wrap;
        margin: 0 auto 20px;
        border-radius: 10px 10px 0 0;
    }

    .radiotab {
        position: absolute;
        opacity: 0;
    }

    .tablabel {
        width: 100%;
        padding: 22px 20px;
        background: #e6e6e6;
        cursor: pointer;
        font-weight: bold;
        font-size: 1rem;
        color: #000;
        transition: background .3s, color .3s;
        border: none;
        border-radius: 0;
        text-align: center;
        margin-bottom: 0px;
    }

    .tablabel:hover {
        background: #B2D5ff;
    }

    .tablabel:active {
        background: #fff;
    }

    .radiotab:checked+.tablabel {
        background: #fff;
        color: #000;
        border: none;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    }

    .panel {
        display: none;
        padding: 20px 30px 30px;
        background: #fff;
        width: 100%;
        border: none;
        box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    }

    .radiotab:checked+.tablabel+.panel {
        display: block;
    }

    @media (min-width: 600px) {
        .panel {
            order: 99;
        }

        .tablabel {
            width: 25%;
            border-radius: 10px 10px 0 0;
            border-bottom: none;
        }

    }

    /*End article tabs */

    /* ALERT MESSAGE BOX */
    .alert {
        padding: 15px 20px 25px 20px;
        background-color: #F75B02;
        border-color: #F75B02;
        color: white;
        font-size: 18px;
        font-weight: 600;
        text-align: center;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 100;
        opacity: 1;
        transition: opacity 0.6s;
    }

    .alert a {
        text-decoration: none;
    }

    .alert-btn {
        color: #FFF;
        background-color: #1a6baf;
        border: 1px solid #14558C;
        border-bottom-width: 2px;
        border-radius: 6px;
        cursor: pointer;
        text-align: center;
        font-size: 1rem;
        font-weight: 600;
        padding: .25rem .5rem;
        display: inline-block;
        margin: .05rem .05rem 1rem .75rem;
        text-transform: uppercase;
        vertical-align: middle;
        white-space: nowrap;
        transition: all 250ms ease-in-out;
    }

    /* The alert close button */
    .closebtn {
        margin-left: 15px;
        color: white;
        font-weight: bold;
        float: right;
        font-size: 22px;
        line-height: 20px;
        cursor: pointer;
        transition: 0.3s;
    }

    /* When mouse hovers the close button */
    .closebtn:hover {
        color: #1a6baf;
    }

    /* END ALERT MESSAGE BANNER */


    /* PLAYBOOK CATEGORY STYLING */
    .Icon {
        position: relative;
        margin: 0;
        display: inline-block;
        width: 1em;
        height: 1em;
        font-size: 1em;
        vertical-align: middle;
        top: -1px;
        fill: currentColor;
    }

    .ButtonGroup>.Button:first-child {
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
    }

    .ButtonGroup>.Button:last-child {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }

    .ButtonGroup>.Button {
        border-radius: 0;
    }

    .ButtonGroup>.Button+.Button {
        margin-left: -1px;
    }

    .Button {
        background-color: #ffffff;
        border: #d6d6d6 solid 1px;
        border-bottom-width: 2px;
        border-radius: 4px;
        color: #383838;
        cursor: pointer;
        display: inline-block;
        font-family: "Open Sans", Helvetica, sans-serif;
        font-size: 13px;
        font-weight: 600;
        height: 32px;
        line-height: 29px;
        margin: 0;
        padding: 0 16px;
        text-decoration: none;
        -webkit-transition: all 250ms ease-in-out;
        transition: all 250ms ease-in-out;
        vertical-align: middle;
        white-space: nowrap;
    }

    .Button--primary {
        background-color: #7fc243;
        border-color: #669b36;
        color: #ffffff;
    }

    .Button--primary:hover,
    .Button--primary:active,
    .Button--primary:focus {
        background-color: #72af3c;
        border-color: #5c8c31;
        color: #ffffff;
    }

    .Button:hover,
    .Button:active,
    .Button:focus {
        background-color: #e6e6e6;
        border-color: #c1c1c1;
        color: #383838;
        outline: none;
    }

    @media only screen and (min-width: 992px) {

        .Navigation__Links a:hover,
        .Navigation__Links a:focus {
            color: #175d99;
            -webkit-transform: scale(0.95);
            transform: scale(0.95);
        }
    }


    /* Category Styles */

    .category-list .category {
        color: #383838;
        margin-bottom: 16px;
        border: 1px solid #d6d6d6;
        border-radius: 8px;
    }

    .category-list .category:hover:nth-child(3n+1) {
        border: 1px solid #FF8F00;
        background: none;
        transition: all .15s;
    }

    .category-list .category:hover:nth-child(3n+1) h3 {
        color: #FF8F00 !important;
    }

    .category-list .category:hover:nth-child(3n+2) {
        border: 1px solid #1A6BAF;
        background: none;
    }

    .category-list .category:hover:nth-child(3n+2) h3 {
        color: #1A6BAF !important;
    }

    .category-list .category:hover:nth-child(3n+3) {
        border: 1px solid #7FC243;
        background: none;
    }

    .category-list .category:hover:nth-child(3n+3) h3 {
        color: #7FC243 !important;
    }

    .category-list .category h3 {
        color: #F75B02;
        font-size: 20px;
        font-weight: 400;
        line-height: 1.3em;
        font-family: museo-slab, serif;
    }

    .category .h3 {
        color: #333;
    }

    .collection-category h2 a {
        color: #13426E;
        font-size: 1.424em;
    }


    .category-list .category p {
        color: #747a7a;
        font-family: museo-slab, serif;
        font-weight: 100;
        font-size: 15px;
        letter-spacing: 0.25px;
    }

    .category-list .category {
        background-color: #fff;
        background-position: top 20px center !important;
        background-repeat: no-repeat !important;
        background-size: 125px auto !important;
        box-shadow: 0 7px 4px -5px rgba(0, 0, 0, 0.05);
        box-sizing: border-box;
        min-height: 183px;
        padding: 150px 20px 15px;
        position: relative;
        width: 31.5%;
        transition: all 0.2s;
    }

    .category-list .category:hover {
        text-decoration: none;
        background: #f7f7f9;
    }

    @media (max-width: 769px) {
        .category-list .category {
            width: 100%;
        }
    }

    #category-1824.category {
        padding: 20px 15px;
        min-height: auto;
    }

    #category-1824 h3 {
        font-size: 1.5rem;
        font-weight: bold;
        vertical-align: middle;

    }

    #category-1825.category {
        padding: 20px 15px;
        min-height: auto;

    }

    #category-1825 h3 {
        font-size: 1.5rem;
        vertical-align: middle;
        font-weight: bold;
    }

    #category-1844.category {
        padding: 20px 15px;
        min-height: auto;

    }

    #category-1844 h3 {
        font-size: 1.5rem;
        vertical-align: middle;
        font-weight: bold;

    }

    #category-1210.category {
        padding: 20px 15px;
        min-height: auto;

    }

    #category-1210 h3 {
        font-size: 1.5rem;
        vertical-align: middle;
        font-weight: bold;

    }

    #category-1209.category {
        padding: 20px 15px;
        min-height: auto;

    }

    #category-1209 h3 {
        font-size: 1.5rem;
        vertical-align: middle;
        font-weight: bold;

    }


    #category-1208.category {
        width: 90%;
        margin: inherit auto;
    }

    /* FEATURES ASSIST COLLECTION*/
    #category-1809 {
        display: none;
    }

    /* Getting Started */
    #category-1208 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/H_pH9MDjwdO8oT2QUJ_vd/H_pH9MDjwdO8oT2QUJ_vd-1x.png');
    }

    #category-1784 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/H_pH9MDjwdO8oT2QUJ_vd/H_pH9MDjwdO8oT2QUJ_vd-1x.png')
    }

    /* Account Management */
    #category-1207 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/KCc70vS5BzuZraUQglpEI/KCc70vS5BzuZraUQglpEI-1x.png');
    }

    /* Settings */
    #category-1190 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/K0T9O-Qp51rE1l7lyyUnA/K0T9O-Qp51rE1l7lyyUnA-1x.png');
    }

    /* Division and Team Structure */
    #category-1259 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/z9YnnSgVUpryDyite5yqg/z9YnnSgVUpryDyite5yqg-1x.png');
    }

    /* Roster Profile and Member Management */
    #category-1219 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/sP7JsOBhK3-YX_myBbr0B/sP7JsOBhK3-YX_myBbr0B-1x.png');
    }

    /* Scheduling */
    #category-1188 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/z9Eo6CGXQstrDtOiTUwod/z9Eo6CGXQstrDtOiTUwod-1x.png');
    }

    /* Communication */
    #category-1187 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/fPdu_t90BDHauKxCOxYgg/fPdu_t90BDHauKxCOxYgg-1x.png');
    }

    /* Payments and Registration */
    #category-1220 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/Ra0FFIseiZbqpM5vYTOU-/Ra0FFIseiZbqpM5vYTOU--1x.png');
    }

    /* Reporting */
    #category-1191 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/SHxosQ_WF6bOFlmKW-nk_/SHxosQ_WF6bOFlmKW-nk_-1x.png');
    }

    /* Statistics */
    #category-1260 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/Hrsx3pK7ahpg61-6RO3EK/Hrsx3pK7ahpg61-6RO3EK-1x.png');
    }

    /* Photos, Videos, & Files */
    #category-1221 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/KjgCpxHBFKCXMoRfEFGjf/KjgCpxHBFKCXMoRfEFGjf-1x.png');
    }

    /* Partner Integrations */
    #category-1189 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/ikPnq378RBEfDuYTvCz06/ikPnq378RBEfDuYTvCz06-1x.png');
    }

    /* Security and Privacy */
    #category-1243 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/qFhhfqPOlBNgShp3n3pQS/qFhhfqPOlBNgShp3n3pQS-1x.png');
    }

    /* Troubleshooting */
    #category-1484 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/v4OnEwN9V7_Sp5uzFiNwf/v4OnEwN9V7_Sp5uzFiNwf-1x.png');
    }

    /* FAQs */
    #category-1218 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/MOqjabM2hDQwF3F4E6U_4/MOqjabM2hDQwF3F4E6U_4-1x.png');
    }

    /* TRAINING GROUND COLLECTION*/

    /* TeamSnap Academy */
    #category-1461 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/69cDy5mDKC3IALn1oTXYF/69cDy5mDKC3IALn1oTXYF-1x.png');
    }

    /* Videos */
    #category-1216 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/gaSqNFSvtuyDuntkxjulP/gaSqNFSvtuyDuntkxjulP-1x.png');
    }

    /* Onboarding */
    #category-1214 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/hs0P8VSXkkzbYcsb1skH0/hs0P8VSXkkzbYcsb1skH0-1x.png');
    }

    /* Webinars */
    #category-1215 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/TARu5-BJDjCygT22uncd_/TARu5-BJDjCygT22uncd_-1x.png');
    }

    /* DRAFT PICKS COLLECTION*/

    /* New Features and Improvements */
    #category-1421 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/tWZAlaRL9dPB5gSpWKjI9/tWZAlaRL9dPB5gSpWKjI9-1x.png');
    }

    #category-1788 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/1TdOKf8zto9n4wXX7F-m9/1TdOKf8zto9n4wXX7F-m9-1x.png');
    }

    #category-1787 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/Yot5oD3mTseBV6rmVx9sK/Yot5oD3mTseBV6rmVx9sK-1x.png');
    }

    #category-1786 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/9ymLPJe5URZVsoCeXkhIk/9ymLPJe5URZVsoCeXkhIk-1x.png');
    }

    /* Feature Requests */
    #category-1203 {
        background-image: url('https://storage.googleapis.com/ts-public-assets.teamsnap.com/support/v1/8jXEbaACc3uO366yvAq6B/8jXEbaACc3uO366yvAq6B-1x.png');
    }

    /* END PLAYBOOK CATEGORY STYLING */

    /* END CSS ADDED BY BRIA*/
    @media screen and (min-width: 0) {
        .mb0 {
            margin-bottom: 0 !important
        }

        .mb5 {
            margin-bottom: 5px !important
        }

        .mb10 {
            margin-bottom: 10px !important
        }

        .mb15 {
            margin-bottom: 15px !important
        }

        .mb20 {
            margin-bottom: 20px !important
        }

        .mb25 {
            margin-bottom: 25px !important
        }

        .mb30 {
            margin-bottom: 30px !important
        }

        .mb45 {
            margin-bottom: 45px !important
        }

        .mb60 {
            margin-bottom: 60px !important
        }

        .mb90 {
            margin-bottom: 90px !important
        }

        .mt0 {
            margin-top: 0 !important
        }

        .mt5 {
            margin-top: 5px !important
        }

        .mt10 {
            margin-top: 10px !important
        }

        .mt15 {
            margin-top: 15px !important
        }

        .mt20 {
            margin-top: 20px !important
        }

        .mt25 {
            margin-top: 25px !important
        }

        .mt30 {
            margin-top: 30px !important
        }

        .mt45 {
            margin-top: 45px !important
        }

        .mt60 {
            margin-top: 60px !important
        }

        .mt90 {
            margin-top: 90px !important
        }

        .ml0 {
            margin-left: 0 !important
        }

        .ml5 {
            margin-left: 5px !important
        }

        .ml10 {
            margin-left: 10px !important
        }

        .ml15 {
            margin-left: 15px !important
        }

        .ml20 {
            margin-left: 20px !important
        }

        .ml25 {
            margin-left: 25px !important
        }

        .ml30 {
            margin-left: 30px !important
        }

        .ml40 {
            margin-left: 40px !important
        }

        .ml50 {
            margin-left: 50px !important
        }

        .ml55 {
            margin-left: 55px !important
        }

        .ml60 {
            margin-left: 60px !important
        }

        .ml90 {
            margin-left: 90px !important
        }

        .mr0 {
            margin-right: 0 !important
        }

        .mr5 {
            margin-right: 5px !important
        }

        .mr10 {
            margin-right: 10px !important
        }

        .mr15 {
            margin-right: 15px !important
        }

        .mr20 {
            margin-right: 20px !important
        }

        .mr25 {
            margin-right: 25px !important
        }

        .mr30 {
            margin-right: 30px !important
        }

        .mr45 {
            margin-right: 45px !important
        }

        .pb0 {
            padding-bottom: 0 !important
        }

        .pb5 {
            padding-bottom: 5px !important
        }

        .pb10 {
            padding-bottom: 10px !important
        }

        .pb15 {
            padding-bottom: 15px !important
        }

        .pb20 {
            padding-bottom: 20px !important
        }

        .pb25 {
            padding-bottom: 25px !important
        }

        .pb30 {
            padding-bottom: 30px !important
        }

        .pb45 {
            padding-bottom: 45px !important
        }

        .pb60 {
            padding-bottom: 60px !important
        }

        .pb80 {
            padding-bottom: 80px !important
        }

        .pb90 {
            padding-bottom: 90px !important
        }

        .pt0 {
            padding-top: 0 !important
        }

        .pt5 {
            padding-top: 5px !important
        }

        .pt10 {
            padding-top: 10px !important
        }

        .pt15 {
            padding-top: 15px !important
        }

        .pt20 {
            padding-top: 20px !important
        }

        .pt25 {
            padding-top: 25px !important
        }

        .pt30 {
            padding-top: 30px !important
        }

        .pt45 {
            padding-top: 45px !important
        }

        .pt60 {
            padding-top: 60px !important
        }

        .pt80 {
            padding-top: 80px !important
        }

        .pt90 {
            padding-top: 90px !important
        }

        .pl0 {
            padding-left: 0 !important
        }

        .pl5 {
            padding-left: 5px !important
        }

        .pl10 {
            padding-left: 10px !important
        }

        .pl15 {
            padding-left: 15px !important
        }

        .pl20 {
            padding-left: 20px !important
        }

        .pl25 {
            padding-left: 25px !important
        }

        .pl30 {
            padding-left: 30px !important
        }

        .pl40 {
            padding-left: 40px !important
        }

        .pl45 {
            padding-left: 45px !important
        }

        .pl50 {
            padding-left: 50px !important
        }

        .pl60 {
            padding-left: 60px !important
        }

        .pl70 {
            padding-left: 70px !important
        }

        .pl80 {
            padding-left: 80px !important
        }

        .pl90 {
            padding-left: 90px !important
        }

        .pr0 {
            padding-right: 0 !important
        }

        .pr5 {
            padding-right: 5px !important
        }

        .pr10 {
            padding-right: 10px !important
        }

        .pr15 {
            padding-right: 15px !important
        }

        .pr20 {
            padding-right: 20px !important
        }

        .pr25 {
            padding-right: 25px !important
        }

        .pr30 {
            padding-right: 30px !important
        }

        .pr40 {
            padding-right: 40px !important
        }

        .pr45 {
            padding-right: 45px !important
        }

        .pr50 {
            padding-right: 50px !important
        }

        .pr60 {
            padding-right: 60px !important
        }

        .pr70 {
            padding-right: 70px !important
        }

        .pr80 {
            padding-right: 80px !important
        }

        .pr90 {
            padding-right: 90px !important
        }
    }

    @media screen and (min-width: 480px) {
        .mb0-xs {
            margin-bottom: 0 !important
        }

        .mb5-xs {
            margin-bottom: 5px !important
        }

        .mb10-xs {
            margin-bottom: 10px !important
        }

        .mb15-xs {
            margin-bottom: 15px !important
        }

        .mb20-xs {
            margin-bottom: 20px !important
        }

        .mb25-xs {
            margin-bottom: 25px !important
        }

        .mb30-xs {
            margin-bottom: 30px !important
        }

        .mb45-xs {
            margin-bottom: 45px !important
        }

        .mb60-xs {
            margin-bottom: 60px !important
        }

        .mb90-xs {
            margin-bottom: 90px !important
        }

        .mt0-xs {
            margin-top: 0 !important
        }

        .mt5-xs {
            margin-top: 5px !important
        }

        .mt10-xs {
            margin-top: 10px !important
        }

        .mt15-xs {
            margin-top: 15px !important
        }

        .mt20-xs {
            margin-top: 20px !important
        }

        .mt25-xs {
            margin-top: 25px !important
        }

        .mt30-xs {
            margin-top: 30px !important
        }

        .mt45-xs {
            margin-top: 45px !important
        }

        .mt60-xs {
            margin-top: 60px !important
        }

        .mt90-xs {
            margin-top: 90px !important
        }

        .ml0-xs {
            margin-left: 0 !important
        }

        .ml5-xs {
            margin-left: 5px !important
        }

        .ml10-xs {
            margin-left: 10px !important
        }

        .ml15-xs {
            margin-left: 15px !important
        }

        .ml20-xs {
            margin-left: 20px !important
        }

        .ml25-xs {
            margin-left: 25px !important
        }

        .ml30-xs {
            margin-left: 30px !important
        }

        .ml40-xs {
            margin-left: 40px !important
        }

        .ml50-xs {
            margin-left: 50px !important
        }

        .ml55-xs {
            margin-left: 55px !important
        }

        .ml60-xs {
            margin-left: 60px !important
        }

        .ml90-xs {
            margin-left: 90px !important
        }

        .mr0-xs {
            margin-right: 0 !important
        }

        .mr5-xs {
            margin-right: 5px !important
        }

        .mr10-xs {
            margin-right: 10px !important
        }

        .mr15-xs {
            margin-right: 15px !important
        }

        .mr20-xs {
            margin-right: 20px !important
        }

        .mr25-xs {
            margin-right: 25px !important
        }

        .mr30-xs {
            margin-right: 30px !important
        }

        .mr45-xs {
            margin-right: 45px !important
        }

        .pb0-xs {
            padding-bottom: 0 !important
        }

        .pb5-xs {
            padding-bottom: 5px !important
        }

        .pb10-xs {
            padding-bottom: 10px !important
        }

        .pb15-xs {
            padding-bottom: 15px !important
        }

        .pb20-xs {
            padding-bottom: 20px !important
        }

        .pb25-xs {
            padding-bottom: 25px !important
        }

        .pb30-xs {
            padding-bottom: 30px !important
        }

        .pb45-xs {
            padding-bottom: 45px !important
        }

        .pb60-xs {
            padding-bottom: 60px !important
        }

        .pb80-xs {
            padding-bottom: 80px !important
        }

        .pb90-xs {
            padding-bottom: 90px !important
        }

        .pt0-xs {
            padding-top: 0 !important
        }

        .pt5-xs {
            padding-top: 5px !important
        }

        .pt10-xs {
            padding-top: 10px !important
        }

        .pt15-xs {
            padding-top: 15px !important
        }

        .pt20-xs {
            padding-top: 20px !important
        }

        .pt25-xs {
            padding-top: 25px !important
        }

        .pt30-xs {
            padding-top: 30px !important
        }

        .pt45-xs {
            padding-top: 45px !important
        }

        .pt60-xs {
            padding-top: 60px !important
        }

        .pt80-xs {
            padding-top: 80px !important
        }

        .pt90-xs {
            padding-top: 90px !important
        }

        .pl0-xs {
            padding-left: 0 !important
        }

        .pl5-xs {
            padding-left: 5px !important
        }

        .pl10-xs {
            padding-left: 10px !important
        }

        .pl15-xs {
            padding-left: 15px !important
        }

        .pl20-xs {
            padding-left: 20px !important
        }

        .pl25-xs {
            padding-left: 25px !important
        }

        .pl30-xs {
            padding-left: 30px !important
        }

        .pl40-xs {
            padding-left: 40px !important
        }

        .pl45-xs {
            padding-left: 45px !important
        }

        .pl50-xs {
            padding-left: 50px !important
        }

        .pl60-xs {
            padding-left: 60px !important
        }

        .pl70-xs {
            padding-left: 70px !important
        }

        .pl80-xs {
            padding-left: 80px !important
        }

        .pl90-xs {
            padding-left: 90px !important
        }

        .pr0-xs {
            padding-right: 0 !important
        }

        .pr5-xs {
            padding-right: 5px !important
        }

        .pr10-xs {
            padding-right: 10px !important
        }

        .pr15-xs {
            padding-right: 15px !important
        }

        .pr20-xs {
            padding-right: 20px !important
        }

        .pr25-xs {
            padding-right: 25px !important
        }

        .pr30-xs {
            padding-right: 30px !important
        }

        .pr40-xs {
            padding-right: 40px !important
        }

        .pr45-xs {
            padding-right: 45px !important
        }

        .pr50-xs {
            padding-right: 50px !important
        }

        .pr60-xs {
            padding-right: 60px !important
        }

        .pr70-xs {
            padding-right: 70px !important
        }

        .pr80-xs {
            padding-right: 80px !important
        }

        .pr90-xs {
            padding-right: 90px !important
        }
    }

    @media screen and (min-width: 768px) {
        .mb0-sm {
            margin-bottom: 0 !important
        }

        .mb5-sm {
            margin-bottom: 5px !important
        }

        .mb10-sm {
            margin-bottom: 10px !important
        }

        .mb15-sm {
            margin-bottom: 15px !important
        }

        .mb20-sm {
            margin-bottom: 20px !important
        }

        .mb25-sm {
            margin-bottom: 25px !important
        }

        .mb30-sm {
            margin-bottom: 30px !important
        }

        .mb45-sm {
            margin-bottom: 45px !important
        }

        .mb60-sm {
            margin-bottom: 60px !important
        }

        .mb90-sm {
            margin-bottom: 90px !important
        }

        .mt0-sm {
            margin-top: 0 !important
        }

        .mt5-sm {
            margin-top: 5px !important
        }

        .mt10-sm {
            margin-top: 10px !important
        }

        .mt15-sm {
            margin-top: 15px !important
        }

        .mt20-sm {
            margin-top: 20px !important
        }

        .mt25-sm {
            margin-top: 25px !important
        }

        .mt30-sm {
            margin-top: 30px !important
        }

        .mt45-sm {
            margin-top: 45px !important
        }

        .mt60-sm {
            margin-top: 60px !important
        }

        .mt90-sm {
            margin-top: 90px !important
        }

        .ml0-sm {
            margin-left: 0 !important
        }

        .ml5-sm {
            margin-left: 5px !important
        }

        .ml10-sm {
            margin-left: 10px !important
        }

        .ml15-sm {
            margin-left: 15px !important
        }

        .ml20-sm {
            margin-left: 20px !important
        }

        .ml25-sm {
            margin-left: 25px !important
        }

        .ml30-sm {
            margin-left: 30px !important
        }

        .ml40-sm {
            margin-left: 40px !important
        }

        .ml50-sm {
            margin-left: 50px !important
        }

        .ml55-sm {
            margin-left: 55px !important
        }

        .ml60-sm {
            margin-left: 60px !important
        }

        .ml90-sm {
            margin-left: 90px !important
        }

        .mr0-sm {
            margin-right: 0 !important
        }

        .mr5-sm {
            margin-right: 5px !important
        }

        .mr10-sm {
            margin-right: 10px !important
        }

        .mr15-sm {
            margin-right: 15px !important
        }

        .mr20-sm {
            margin-right: 20px !important
        }

        .mr25-sm {
            margin-right: 25px !important
        }

        .mr30-sm {
            margin-right: 30px !important
        }

        .mr45-sm {
            margin-right: 45px !important
        }

        .pb0-sm {
            padding-bottom: 0 !important
        }

        .pb5-sm {
            padding-bottom: 5px !important
        }

        .pb10-sm {
            padding-bottom: 10px !important
        }

        .pb15-sm {
            padding-bottom: 15px !important
        }

        .pb20-sm {
            padding-bottom: 20px !important
        }

        .pb25-sm {
            padding-bottom: 25px !important
        }

        .pb30-sm {
            padding-bottom: 30px !important
        }

        .pb45-sm {
            padding-bottom: 45px !important
        }

        .pb60-sm {
            padding-bottom: 60px !important
        }

        .pb80-sm {
            padding-bottom: 80px !important
        }

        .pb90-sm {
            padding-bottom: 90px !important
        }

        .pt0-sm {
            padding-top: 0 !important
        }

        .pt5-sm {
            padding-top: 5px !important
        }

        .pt10-sm {
            padding-top: 10px !important
        }

        .pt15-sm {
            padding-top: 15px !important
        }

        .pt20-sm {
            padding-top: 20px !important
        }

        .pt25-sm {
            padding-top: 25px !important
        }

        .pt30-sm {
            padding-top: 30px !important
        }

        .pt45-sm {
            padding-top: 45px !important
        }

        .pt60-sm {
            padding-top: 60px !important
        }

        .pt80-sm {
            padding-top: 80px !important
        }

        .pt90-sm {
            padding-top: 90px !important
        }

        .pl0-sm {
            padding-left: 0 !important
        }

        .pl5-sm {
            padding-left: 5px !important
        }

        .pl10-sm {
            padding-left: 10px !important
        }

        .pl15-sm {
            padding-left: 15px !important
        }

        .pl20-sm {
            padding-left: 20px !important
        }

        .pl25-sm {
            padding-left: 25px !important
        }

        .pl30-sm {
            padding-left: 30px !important
        }

        .pl40-sm {
            padding-left: 40px !important
        }

        .pl45-sm {
            padding-left: 45px !important
        }

        .pl50-sm {
            padding-left: 50px !important
        }

        .pl60-sm {
            padding-left: 60px !important
        }

        .pl70-sm {
            padding-left: 70px !important
        }

        .pl80-sm {
            padding-left: 80px !important
        }

        .pl90-sm {
            padding-left: 90px !important
        }

        .pr0-sm {
            padding-right: 0 !important
        }

        .pr5-sm {
            padding-right: 5px !important
        }

        .pr10-sm {
            padding-right: 10px !important
        }

        .pr15-sm {
            padding-right: 15px !important
        }

        .pr20-sm {
            padding-right: 20px !important
        }

        .pr25-sm {
            padding-right: 25px !important
        }

        .pr30-sm {
            padding-right: 30px !important
        }

        .pr40-sm {
            padding-right: 40px !important
        }

        .pr45-sm {
            padding-right: 45px !important
        }

        .pr50-sm {
            padding-right: 50px !important
        }

        .pr60-sm {
            padding-right: 60px !important
        }

        .pr70-sm {
            padding-right: 70px !important
        }

        .pr80-sm {
            padding-right: 80px !important
        }

        .pr90-sm {
            padding-right: 90px !important
        }
    }

    @media screen and (min-width: 992px) {
        .mb0-md {
            margin-bottom: 0 !important
        }

        .mb5-md {
            margin-bottom: 5px !important
        }

        .mb10-md {
            margin-bottom: 10px !important
        }

        .mb15-md {
            margin-bottom: 15px !important
        }

        .mb20-md {
            margin-bottom: 20px !important
        }

        .mb25-md {
            margin-bottom: 25px !important
        }

        .mb30-md {
            margin-bottom: 30px !important
        }

        .mb45-md {
            margin-bottom: 45px !important
        }

        .mb60-md {
            margin-bottom: 60px !important
        }

        .mb90-md {
            margin-bottom: 90px !important
        }

        .mt0-md {
            margin-top: 0 !important
        }

        .mt5-md {
            margin-top: 5px !important
        }

        .mt10-md {
            margin-top: 10px !important
        }

        .mt15-md {
            margin-top: 15px !important
        }

        .mt20-md {
            margin-top: 20px !important
        }

        .mt25-md {
            margin-top: 25px !important
        }

        .mt30-md {
            margin-top: 30px !important
        }

        .mt45-md {
            margin-top: 45px !important
        }

        .mt60-md {
            margin-top: 60px !important
        }

        .mt90-md {
            margin-top: 90px !important
        }

        .ml0-md {
            margin-left: 0 !important
        }

        .ml5-md {
            margin-left: 5px !important
        }

        .ml10-md {
            margin-left: 10px !important
        }

        .ml15-md {
            margin-left: 15px !important
        }

        .ml20-md {
            margin-left: 20px !important
        }

        .ml25-md {
            margin-left: 25px !important
        }

        .ml30-md {
            margin-left: 30px !important
        }

        .ml40-md {
            margin-left: 40px !important
        }

        .ml50-md {
            margin-left: 50px !important
        }

        .ml55-md {
            margin-left: 55px !important
        }

        .ml60-md {
            margin-left: 60px !important
        }

        .ml90-md {
            margin-left: 90px !important
        }

        .mr0-md {
            margin-right: 0 !important
        }

        .mr5-md {
            margin-right: 5px !important
        }

        .mr10-md {
            margin-right: 10px !important
        }

        .mr15-md {
            margin-right: 15px !important
        }

        .mr20-md {
            margin-right: 20px !important
        }

        .mr25-md {
            margin-right: 25px !important
        }

        .mr30-md {
            margin-right: 30px !important
        }

        .mr45-md {
            margin-right: 45px !important
        }

        .pb0-md {
            padding-bottom: 0 !important
        }

        .pb5-md {
            padding-bottom: 5px !important
        }

        .pb10-md {
            padding-bottom: 10px !important
        }

        .pb15-md {
            padding-bottom: 15px !important
        }

        .pb20-md {
            padding-bottom: 20px !important
        }

        .pb25-md {
            padding-bottom: 25px !important
        }

        .pb30-md {
            padding-bottom: 30px !important
        }

        .pb45-md {
            padding-bottom: 45px !important
        }

        .pb60-md {
            padding-bottom: 60px !important
        }

        .pb80-md {
            padding-bottom: 80px !important
        }

        .pb90-md {
            padding-bottom: 90px !important
        }

        .pt0-md {
            padding-top: 0 !important
        }

        .pt5-md {
            padding-top: 5px !important
        }

        .pt10-md {
            padding-top: 10px !important
        }

        .pt15-md {
            padding-top: 15px !important
        }

        .pt20-md {
            padding-top: 20px !important
        }

        .pt25-md {
            padding-top: 25px !important
        }

        .pt30-md {
            padding-top: 30px !important
        }

        .pt45-md {
            padding-top: 45px !important
        }

        .pt60-md {
            padding-top: 60px !important
        }

        .pt80-md {
            padding-top: 80px !important
        }

        .pt90-md {
            padding-top: 90px !important
        }

        .pl0-md {
            padding-left: 0 !important
        }

        .pl5-md {
            padding-left: 5px !important
        }

        .pl10-md {
            padding-left: 10px !important
        }

        .pl15-md {
            padding-left: 15px !important
        }

        .pl20-md {
            padding-left: 20px !important
        }

        .pl25-md {
            padding-left: 25px !important
        }

        .pl30-md {
            padding-left: 30px !important
        }

        .pl40-md {
            padding-left: 40px !important
        }

        .pl45-md {
            padding-left: 45px !important
        }

        .pl50-md {
            padding-left: 50px !important
        }

        .pl60-md {
            padding-left: 60px !important
        }

        .pl70-md {
            padding-left: 70px !important
        }

        .pl80-md {
            padding-left: 80px !important
        }

        .pl90-md {
            padding-left: 90px !important
        }

        .pr0-md {
            padding-right: 0 !important
        }

        .pr5-md {
            padding-right: 5px !important
        }

        .pr10-md {
            padding-right: 10px !important
        }

        .pr15-md {
            padding-right: 15px !important
        }

        .pr20-md {
            padding-right: 20px !important
        }

        .pr25-md {
            padding-right: 25px !important
        }

        .pr30-md {
            padding-right: 30px !important
        }

        .pr40-md {
            padding-right: 40px !important
        }

        .pr45-md {
            padding-right: 45px !important
        }

        .pr50-md {
            padding-right: 50px !important
        }

        .pr60-md {
            padding-right: 60px !important
        }

        .pr70-md {
            padding-right: 70px !important
        }

        .pr80-md {
            padding-right: 80px !important
        }

        .pr90-md {
            padding-right: 90px !important
        }
    }

    @media screen and (min-width: 1200px) {
        .mb0-lg {
            margin-bottom: 0 !important
        }

        .mb5-lg {
            margin-bottom: 5px !important
        }

        .mb10-lg {
            margin-bottom: 10px !important
        }

        .mb15-lg {
            margin-bottom: 15px !important
        }

        .mb20-lg {
            margin-bottom: 20px !important
        }

        .mb25-lg {
            margin-bottom: 25px !important
        }

        .mb30-lg {
            margin-bottom: 30px !important
        }

        .mb45-lg {
            margin-bottom: 45px !important
        }

        .mb60-lg {
            margin-bottom: 60px !important
        }

        .mb90-lg {
            margin-bottom: 90px !important
        }

        .mt0-lg {
            margin-top: 0 !important
        }

        .mt5-lg {
            margin-top: 5px !important
        }

        .mt10-lg {
            margin-top: 10px !important
        }

        .mt15-lg {
            margin-top: 15px !important
        }

        .mt20-lg {
            margin-top: 20px !important
        }

        .mt25-lg {
            margin-top: 25px !important
        }

        .mt30-lg {
            margin-top: 30px !important
        }

        .mt45-lg {
            margin-top: 45px !important
        }

        .mt60-lg {
            margin-top: 60px !important
        }

        .mt90-lg {
            margin-top: 90px !important
        }

        .ml0-lg {
            margin-left: 0 !important
        }

        .ml5-lg {
            margin-left: 5px !important
        }

        .ml10-lg {
            margin-left: 10px !important
        }

        .ml15-lg {
            margin-left: 15px !important
        }

        .ml20-lg {
            margin-left: 20px !important
        }

        .ml25-lg {
            margin-left: 25px !important
        }

        .ml30-lg {
            margin-left: 30px !important
        }

        .ml40-lg {
            margin-left: 40px !important
        }

        .ml50-lg {
            margin-left: 50px !important
        }

        .ml55-lg {
            margin-left: 55px !important
        }

        .ml60-lg {
            margin-left: 60px !important
        }

        .ml90-lg {
            margin-left: 90px !important
        }

        .mr0-lg {
            margin-right: 0 !important
        }

        .mr5-lg {
            margin-right: 5px !important
        }

        .mr10-lg {
            margin-right: 10px !important
        }

        .mr15-lg {
            margin-right: 15px !important
        }

        .mr20-lg {
            margin-right: 20px !important
        }

        .mr25-lg {
            margin-right: 25px !important
        }

        .mr30-lg {
            margin-right: 30px !important
        }

        .mr45-lg {
            margin-right: 45px !important
        }

        .pb0-lg {
            padding-bottom: 0 !important
        }

        .pb5-lg {
            padding-bottom: 5px !important
        }

        .pb10-lg {
            padding-bottom: 10px !important
        }

        .pb15-lg {
            padding-bottom: 15px !important
        }

        .pb20-lg {
            padding-bottom: 20px !important
        }

        .pb25-lg {
            padding-bottom: 25px !important
        }

        .pb30-lg {
            padding-bottom: 30px !important
        }

        .pb45-lg {
            padding-bottom: 45px !important
        }

        .pb60-lg {
            padding-bottom: 60px !important
        }

        .pb80-lg {
            padding-bottom: 80px !important
        }

        .pb90-lg {
            padding-bottom: 90px !important
        }

        .pt0-lg {
            padding-top: 0 !important
        }

        .pt5-lg {
            padding-top: 5px !important
        }

        .pt10-lg {
            padding-top: 10px !important
        }

        .pt15-lg {
            padding-top: 15px !important
        }

        .pt20-lg {
            padding-top: 20px !important
        }

        .pt25-lg {
            padding-top: 25px !important
        }

        .pt30-lg {
            padding-top: 30px !important
        }

        .pt45-lg {
            padding-top: 45px !important
        }

        .pt60-lg {
            padding-top: 60px !important
        }

        .pt80-lg {
            padding-top: 80px !important
        }

        .pt90-lg {
            padding-top: 90px !important
        }

        .pl0-lg {
            padding-left: 0 !important
        }

        .pl5-lg {
            padding-left: 5px !important
        }

        .pl10-lg {
            padding-left: 10px !important
        }

        .pl15-lg {
            padding-left: 15px !important
        }

        .pl20-lg {
            padding-left: 20px !important
        }

        .pl25-lg {
            padding-left: 25px !important
        }

        .pl30-lg {
            padding-left: 30px !important
        }

        .pl40-lg {
            padding-left: 40px !important
        }

        .pl45-lg {
            padding-left: 45px !important
        }

        .pl50-lg {
            padding-left: 50px !important
        }

        .pl60-lg {
            padding-left: 60px !important
        }

        .pl70-lg {
            padding-left: 70px !important
        }

        .pl80-lg {
            padding-left: 80px !important
        }

        .pl90-lg {
            padding-left: 90px !important
        }

        .pr0-lg {
            padding-right: 0 !important
        }

        .pr5-lg {
            padding-right: 5px !important
        }

        .pr10-lg {
            padding-right: 10px !important
        }

        .pr15-lg {
            padding-right: 15px !important
        }

        .pr20-lg {
            padding-right: 20px !important
        }

        .pr25-lg {
            padding-right: 25px !important
        }

        .pr30-lg {
            padding-right: 30px !important
        }

        .pr40-lg {
            padding-right: 40px !important
        }

        .pr45-lg {
            padding-right: 45px !important
        }

        .pr50-lg {
            padding-right: 50px !important
        }

        .pr60-lg {
            padding-right: 60px !important
        }

        .pr70-lg {
            padding-right: 70px !important
        }

        .pr80-lg {
            padding-right: 80px !important
        }

        .pr90-lg {
            padding-right: 90px !important
        }
    }
}

.banner {
    width: 100%;
    background-color: #022251;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    margin-top: -1px;
}

.logo {
    max-width: 118px;
    height: auto;
    margin-bottom: 16px;
}

.cta {
    color: #fff;
    font-size: 14px;
    line-height: 125%;
    text-align: center;
    margin-bottom: 16px;
}

.button {
    background-color: #F56B15;
    color: #fff;
    border-radius: 25px;
    padding: 12px 24px;
    font-size: 16px;
    cursor: pointer;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    outline: none;
    margin-bottom: 16px;
}

.button:hover {
    background-color: #d64d0d;
    text-decoration: none;
}

.arrow-right {
    display: inline-block;
    width: 12px;
    height: 8px;
    position: relative;
    margin-left: 8px;
    vertical-align: middle;
    display: inline-block;
}

.arrow-right::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 2px;
    background-color: white;
}

.arrow-right::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    width: 6px;
    height: 6px;
    border-top: 2px solid white;
    border-right: 2px solid white;
}

.link {
    color: inherit;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.link:hover {
    text-decoration: none;
    color: #fff;
}

.footer {
    color: #FA6700;
    margin-bottom: 14px;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
}