@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&family=Source+Serif+Pro:wght@400;600;700&display=swap');

body {
    font-family: 'Source Sans Pro', sans-serif;
    min-height: 100vh;
    margin: 0;
    font-size: 16px;
    color: #333;
    -webkit-font-smoothing: antialiased;
}

.tip,
.warning,
.please-note {
    display: block;
    padding: 10px 10px 10px 10px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid;
    line-height: 1.5rem;
    margin-top: 18px;
    margin-bottom: 18px;
    position: relative;
    word-break: break-word;
}

.tip {
    border-color: #767aaf;
    background-color: #F2F3F7;
}

.warning {
    border-color: #d4646f;
    background-color: #fcecec;
}

.please-note {
    border-color: #93d8a5;
    background-color: #effaf1;
}

.btn.cta {
    background: #2886B2;
    border: 1px solid #17739D;
    color: #ffffff !important;
    font-weight: bold;
    font-family: inherit;
    border-radius: 3px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
    padding: 0 8px;
    height: 36px;
    line-height: 34px !important;
    cursor: pointer;
    text-align: left;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-shadow: none !important;
}

/* Style the button that is used to open and close the collapsible content */
.collapsible {
    background-color: #767aaf;
    color: white;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.collapsible-active,
.collapsible:hover {
    background-color: #8B8FBB;
    color: white;
}

/* Style the collapsible content. Note: hidden by default */
.content {
    padding: 10px 18px;
    display: none;
    overflow: hidden;
    background-color: #F2F3F7;
}

.collapsible:after {
    content: '\02795';
    /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: white;
    float: right;
    margin-left: 5px;
}

.collapsible-active:after {
    content: "\2796";
    /* Unicode character for "minus" sign (-) */
}

/* Pure CSS collapsible section */

/* collapsible-toggle = input tag */
.collapsible-toggle {
    display: none;
}

/* lbl-toggle = label (i.e. text to click on to expand section) */
.lbl-toggle {
    display: block;
    padding: 1rem;
    cursor: pointer;
    margin-bottom: 0;
    transition: all 0.25s ease-out;
    font-size: 1rem;
    font-weight: bold;
    background-color: #767aaf;
    color: white;
}

.lbl-toggle:hover {
    color: #B6B9D3;
}

.lbl-toggle::before {
    content: '+ ';
    display: inline-block;
    vertical-align: middle;
    margin-right: .7rem;
    transform: translateY(-2px);

}

.collapsible-toggle:checked+.lbl-toggle::before {
    content: '–';
    transition: transform .2s ease-out;
}

/* collapsible-content = content to display inside collapsible section */
.collapsible-content {
    max-height: 0px;
    overflow: hidden;
    transition: max-height .0s ease-out;
    background-color: #F2F3F7;
}

.collapsible-toggle:checked+.lbl-toggle+.collapsible-content {
    max-height: 150vh;
    padding: 1rem;
}

.collapsible-toggle:checked+.lbl-toggle {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

/* Style for the buttons on the non-linear navigation stories */
.nonlinear-button-style{
    background-color: rgba(51, 51, 51, 0.1);
    border-radius: 4px;
    border-width: 0;
    color: #333333;
    cursor: pointer;
    display: inline-block;
    font-family: Lato, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 10px;
    list-style: none;
    margin: 2px;
    padding: 10px 12px;
    text-align: center;
    transition: all 200ms;
    vertical-align: baseline;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    }

.nonlinear-button-style:hover {
    background-color: #000000;
    color: white;
    }

/* ------- */

/* Remove 'last updated' from help docs */
.articleFoot time.lu {
    display:none;
}


.tip:before {
    content: "💡";
}

.warning:before {
    content: "❗"
}

.please-note:before {
    content: "✏️"
}

#fullArticle p {
    font-size: 16px;
}

#fullArticle img {
    border: none;
    box-shadow: 0 0 6px rgb(0 0 0 / 20%);
    border-radius: 0;
    padding: 0;
}

.noshadow {
    border: none;
    box-shadow: none !important;
    border-radius: 0;
    padding: 0;
}

/* Add inline images like Flourish buttons or icons. Apply inline height style to override this height and adjust it */
.inline-img {
    display: inline !important;
    margin: 0 0.125rem !important;
    padding: 0;
    height: 1.5rem;
    vertical-align: middle;
    border: none;
    box-shadow: none !important;
    border-radius: 0;
    padding: 0;
  }

#fullArticle li {
    font-size: 16px;
}

#fullArticle dd,
#fullArticle dt {
    font-size: 16px;
}

.related h3 {
    font-size: 16px;
    text-transform: none;
}

#sidebar h3 {
    font-size: 17.6px;
    text-transform: none;
}

p.help {
    font-family: 'Source Sans Pro', sans-serif;
    font-style: normal;
}

time.lu {
    font-family: 'Source Sans Pro', sans-serif;
    font-style: normal;
}

input,
button,
select,
textarea {
    font-family: 'Source Sans Pro', sans-serif;
}

#fullArticle a:link,
a:visited {
    color: inherit;
    text-decoration: underline;
}

a:hover,
a:active {
    opacity: 0.75;
}

#docsSearch {
    background-image: url("https://public.flourish.studio/uploads/654906/aecab05d-ddcb-4920-9513-16c5bf852211.png");
    border-bottom: 1px solid #DFDFDF;
    margin-bottom: 3em;
    padding: 1.5em 0;
}

#docsSearch h1 {
    font-family: 'Source Sans Pro', sans-serif;
    color: #FFFFFF;
    font-size: 45px;
    font-weight: bold;
    line-height: 1em;
}

.contentWrapper h1 {
    font-weight: 800;
}

#searchBar button {
    top: inherit;
    color: black;
    border-color: transparent;
    background: white;
    text-shadow: none;
    font-weight: 300;
}

#searchBar .search-query {
    font-weight: 300;
}

#searchBar button:hover {
    top: inherit;
    color: black;
    background: white;
}

.category-list .category {
    background-color: #FFFFFF;
}

.category-list p {
    font-weight: 300;
}

#serp-dd .result {
    font-weight: 400;
}

#mainNav .brand span {
    display: inline-block;
    text-indent: -9000px;
    width: 120px;
    height: 36px;
    background: url(https://flourish.studio/images/logo_white.png) no-repeat 0 0;
    background-size: 100%;
}

.navbar .navbar-inner {
    background-image: url("https://public.flourish.studio/uploads/654906/42948741-0dae-46a9-b12b-0a0e13592761.png");
    font-weight: 300;
}

.navbar::after {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    content: '';
    display: block;
    position: absolute;
    left: 20px;
    right: 20px;
}

.navbar .nav .active .caret {
    border-bottom: 5px solid #FFFFFF;
}

.navbar .brand,
.navbar .nav li a:hover,
.navbar .nav li a:focus,
.navbar .nav .active a,
.navbar .nav .active a:hover,
.navbar .nav .active a:focus,
.navbar .nav li a,
.navbar .icon-private-w {
    color: #FFFFFF;
}

.contentWrapper {
    border: none;
}

#fullArticle dt {
    background: linear-gradient(to right, rgba(67, 40, 231, 1), rgba(67, 40, 231, 0.58), rgba(255, 98, 131, 0.5));
}

.icon-article-doc:before {
    display: none;
}

.articleList:before {
    content: "";
    position: absolute;
    top: 0;
    width: 50px;
    height: 4px;
    left: 0;
    background: linear-gradient(to right, rgba(67, 40, 231, 1), rgba(67, 40, 231, 0.58), rgba(255, 98, 131, 0.5));
}

.articleList {
    margin-top: 34px;
    padding-top: 25px;
    position: relative;
}

.contentWrapper p {
    color: #000000;
    margin-top: 0px;
    font-size: 1.3em;
}

.collection-category h2 {
    font-weight: 300 !important;
}

.contentWrapper p.descrip {
    color: #000000;
    margin-top: 0px;
    font-size: 1.3em;
}

.collection-category .category-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start;
}

.category-list .category {
    flex: 0 0 100%;
    margin: 0 0 20px;
    padding: 0 0 15px;
    width: unset;
    border: 1px solid #EDEDED;
    border-radius: 3px;
    box-shadow: none;
    background: #fff;
}

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

    .category-list .category {
        flex: 0 0 48%;
        box-sizing: border-box;
    }
}

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

    .category-list .category {
        flex: 0 0 32%;
    }
}

.category-list .category h3:before {
    content: " ";
    display: block;
    height: 180px;
    margin: 0 0 20px;
    background: #EDEDED;
    border-radius: 3px 3px 0 0;
}

.category-list h3 {
    font-weight: 300 !important;
}

#fullArticle .index-list {
    background: #F9FAFA;
    border-left: 5px solid #767aaf;
    margin: 3em 0;
    padding: 15px 0px;
}

#fullArticle .index-list a {
    color: #0077CC;
    text-decoration: none;
}

#fullArticle .index-list li {
    padding: 8px 26px 0;
    font-weight: 500;
    line-height: 1.55;
    list-style: none;
    padding-left: 0;
}


#fullArticle .index-list h4 {
    text-transform: uppercase;
    margin: 0;
    padding: 8px 26px 0;
    font-weight: 500;
}


@media screen and (min-width: 768px) #fullArticle h4 {
    line-height: 24px;
}

/* Template category images */

/* Bar chart race */

#category-43 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/8996e9e9-44dc-440d-a201-ff39bc658a30.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Bubble chart */

#category-453 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/419fdc2a-5087-4aef-b05f-7220a4890699.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Projection map */

#category-65 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/668a63b3-a9c4-4a87-a23d-8e48fa0a430b.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Line bar pie */

#category-42 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/21d05611-2347-40e0-bf0a-8a7f94ff5f27.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Line chart race */

#category-74 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/db17578f-47e2-4f06-a3d6-97ff22455685.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Sankey */

#category-78 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/054a9f44-fcb0-467f-87aa-1edd659cdc81.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Scatter */

#category-92 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/6266ab01-704d-48ba-96bb-30d9ff6fc2a2.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Hierarchy */

#category-59 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/9e0ade8b-e573-4407-9272-7396f86cdf21.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Network graph */

#category-50 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/cccbc646-5e37-4664-83aa-26e4f4e42e52.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Survey */

#category-98 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/f4056e53-2a92-4c4f-8e97-6d83f9d55f8e.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Table */

#category-93 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/2c96cab9-76d7-425b-8e83-0b7f4fb4e7c7.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Cards */

#category-109 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/2080ad45-bc4b-4a47-82e9-84744f5c191d.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Marker map */

#category-103 h3:before {
    background: url(https://public.flourish.studio/uploads/02c44f16-1007-44cf-bc70-24e9ed86e721.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Point map */

#category-140 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/f56dc9a5-a773-4d53-9329-6de0729fae1c.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Connections  globe */

#category-184 h3:before {
    background: url(https://public.flourish.studio/uploads/8d493f12-f8a2-4883-b6c5-d8dd7a4c42fd.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Quiz */

#category-245 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/0ab9b4df-20a3-4a3c-8a4c-557e03b43df2.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Radar */

#category-254 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/c410fc74-2164-4e8a-b082-0175b1cecf2c.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Photo slider */

#category-307 h3:before {
    background: url(https://public.flourish.studio/uploads/32797d39-eebf-4570-98b3-40e853618e47.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Number ticker */

#category-323 h3:before {
    background: url(https://public.flourish.studio/uploads/534ce11f-f0ed-4c5f-9394-a25176a382c2.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Countdown */

#category-276 h3:before {
    background: url(https://public.flourish.studio/uploads/8deed16c-c7db-416c-87b8-7df009776f91.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Sports */

#category-337 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/21ec68d4-7c0e-4a74-b67c-5c3100b24012.png);
    background-size: cover;
    background-position: 50% 50%;
}


/* Pictogram */


#category-315 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/f7f12189-43dc-470a-a30e-92d6ee052950.png);
    background-size: cover;
    background-position: 50% 50%;
}


/* Sports race */


#category-352 h3:before {
    background: url(https://public.flourish.studio/uploads/e5b92985-c615-4847-83f9-9d57467dc900.png);
    background-size: cover;
    background-position: 50% 50%;
}


/* Slope chart */


#category-371 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/9f877a9c-5d8f-47ff-a775-4e9f40f1e491.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Gantt chart */


#category-335 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/68cd0d36-5a85-478b-a86b-c0aadf54f854.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Parliament chart */


#category-480 h3:before {
    background: url(https://public.flourish.studio/uploads/64721/3365462a-98b6-4564-bcc7-c0c709c967f3.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Word cloud */


#category-324 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/91d346db-f836-44c1-9596-9143deb40362.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Chord diagram  */

#category-358 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/2b4499ce-cf89-48df-aad1-74214ed518c3.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Arc map  */

#category-526 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/fb8a18c8-47dd-44e1-9a44-291bb4de831f.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Account */

#category-11 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/7eac120e-b94d-44f7-953b-b40414699465.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Flourish basics */

#category-10 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/91eee5d0-4be8-45ca-a421-1c6f4d7cff88.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Editing data */

#category-48 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/46daafd5-b8ac-41b6-8e9f-bc7c79c82aab.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Heatmap */

#category-274 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/8f9adaac-f6c5-49f1-84d2-93bd458f17ef.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Flourish SDK */

#category-19 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/8a33d449-2170-4e90-997b-de566ca31154.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Flourish stories */

#category-14 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/478dc12f-6e39-4539-8133-4268b1258204.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Data Explorer */

#category-427 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/9d378656-454c-4d1d-8a58-2756fab8afd4.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Draw the line */

#category-150 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/4dde1d22-3d0c-489c-b988-2b79498a287a.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Text annotator */

#category-290 h3:before {
    background: url(https://public.flourish.studio/uploads/170117/88465641-fa05-44c1-87e0-f70e805a0a41.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Premium features */

#category-164 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/1cf2a89c-2bda-49bc-8535-7e2e806c800c.png);
    background-size: cover;
    background-position: 50% 50%;
}

    {
    "mode": "full", "isActive":false
}

/* SVG annotator */

#category-257 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/09a3f345-7f9a-4f37-81d8-51d0bad3191c.png);
    background-size: cover;
    background-position: 50% 50%;
}

    {
    "mode": "full", "isActive":false
}

/* 3D Model Viewer */

#category-160 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/6c1455c8-fb5d-4be6-bc58-3d3a11122673.png);
    background-size: cover;
    background-position: 50% 50%;
}

/* Timeline */

#category-432 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/0477fc84-5da0-4ffe-be90-b38806f3ca53.png);
    background-size: cover;
    background-position: 50% 50%;
}

    {
    "mode": "full", "isActive":false
}

/* Election results chart */
#category-523 h3:before {
    background: url(https://public.flourish.studio/uploads/724315/4c5bafac-52b4-4faa-9262-f3585870dc2a.png);
    background-size: cover;
    background-position: 50% 50%;
}

    {
    "mode": "full", "isActive":false
}

/* Gauge */
#category-535 h3:before {
    background: url(https://public.flourish.studio/uploads/70747/b32d3239-735b-4a95-9675-3c1268d2ccf7.png);
    background-size: cover;
    background-position: 50% 50%;
}

    {
    "mode": "full", "isActive":false
}

/* Tournament chart */
#category-545 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/dfb82145-0435-4a98-8524-4fa3acc0fa30.png);
    background-size: cover;
    background-position: 50% 50%;
}

    {
    "mode": "full", "isActive":false
}

/* Marimekko */
#category-537 h3:before {
    background: url(https://public.flourish.studio/uploads/654906/0a1b7981-5bb8-4247-b673-7640361ceb00.png);
    background-size: cover;
    background-position: 50% 50%;
}

    {
    "mode": "full", "isActive":false
}