/* -----------------------------------------
   GLOBAL STYLING
----------------------------------------- */

body.is-reveal-open { overflow: hidden; }
#eula input[type="submit"] { background-color: #1C8FA4; display: block; text-transform: none; padding: 10px 30px; color: white }
body { background: #f9fbfd }
.row { max-width: 90rem }
.column, .columns { padding-right: 1.5rem; padding-left: 1.5rem }
.row.navigation .column, .row.navigation .columns { padding-right: .9375rem; padding-left: .9375rem }
* { font-family: 'Poppins', sans-serif; font-weight: 400; color: #3A435F; outline: none }
.print-only { display: none }
label { font-weight: 500; color: #3A435F }
h1, h2, h3, h5, h1 a, h2 a, h3 a, h5 a { font-family: 'Poppins', sans-serif; font-weight: 600; color: #3A435F }
h1 { margin: 25px 10px 25px 0 }
h1, h1 a { font-size: 2.4rem; line-height: 1em; color: #3A435F }
h2, .content h1 { font-size: 1.6rem; border-bottom: 1px solid #e1e4eb; padding-bottom: 8px; margin-bottom: 21px; line-height: 1.1em; margin-top: 0; color: #354e6f }
h2 strong { color: #354e6f }
h5, h5 a { color: #354e6f }
.content h1 { font-size: 2em }
h3, h3 a { font-size: 1.2rem; font-weight: 500; margin-bottom: .25rem; color: #354e6f }
h3 a { font-weight: 600 }
h3.main { border-bottom: 1px solid #DDD; margin-bottom: 20px }
h4 { line-height: 1em; margin-bottom: 3px; font-size: 1.3em }
h4, h4 a { font-family: 'Poppins', sans-serif; font-weight: 400 }
li h3, li h3 a { font-family: 'Poppins', sans-serif; font-weight: 500 }
.button, [type='submit'], [type='button'] { border-radius: 6px; padding: 10px 14px 9px; font-weight: 600; font-size: .8em; text-transform: uppercase; letter-spacing: .03em; min-width: 120px; background-color: #0091A2; color: #FEFEFE; border: 0; cursor: pointer }
.button.outline { background: transparent; color: #0091A2; border: 1px solid #0091A2 }
.button.outline:hover { color: white; border: 1px solid #478e8d }
[type='button'].close-button { background: transparent; min-width: 0; margin-top: -10px }
.button:hover, .button:focus, .button.active { background: #0a1e39 }
a { color: #3A435F }
a:hover, a:focus, a.active { color: #0091A2 }
p, li, dd { font-size: 1.2em; line-height: 1.3 }
p a:hover { /* text-decoration: underline */color: #0091A2 }
a.active:hover { color: #0091A2 }
strong, b { font-weight: 500 }
i.fal { font-size: 2em; margin-right: 15px }
i.fal::before { color: #C5CCDC }
.icon { display: inline-flex; align-items: center }
.icon a { font-weight: 500; margin-bottom: 0 }

.fas.fa-check, .far.fa-clock, .far.fa-times-circle { color: #46ceaa;
    left: 16px;
    position: absolute;
    background: white;
    padding-bottom: 2px;
    padding-left: 4px; }
.button .fa-plus { margin-top: 0; margin-left: 5px; color: white }
.button .fa-plus:hover { color: white !important }
.far.fa-times-circle { color: #c83018 }
span.date { font-style: italic; font-size: .8em }
ul li a:hover, ul li a:hover strong { color: #0091A2 }
li { margin-bottom: 12px }
ul.tabs li { margin-bottom: 0 }
ul.tabs { margin-left: -25px; margin-right: -25px }
div.download { margin-bottom: 40px; margin-top: 55px }
div.download p { line-height: 1.2em; margin-top: 10px; display: inline-block }
div.download a { font-weight: 500 }
div.download span { display: block; margin-left: 40px; font-size: .8em; color: #98a3b9 }
div.download a:hover { text-decoration: none }
div.download .fa-file-chart-line { font-size: 2.5em; color: #ACB8C6; margin-right: 10px; float: left }
div.download.small { margin-bottom: 4px; margin-top: 0 }
div.download.small .fa-file-chart-line { font-size: 1.25em; color: #ACB8C6; margin-right: 10px; float: left }
div.download.small p { margin-top: 0 }
div.download.small .fa-file-chart-line { margin-top: 2px }

.modalUpload { margin-bottom: 30px }
.modalUpload input[type="file"] { font-weight: 500; display: block; padding: 30px; border: 3px dashed #dae1ed; border-radius: 15px; color: #9FAAC0 }
.modalUpload span { font-style: normal; font-weight: 600; margin-bottom: 10px; display: block; color: #a1aabe }
hr.spacer { margin: 40px 0 35px; border-bottom: 1px solid #C5CCDC }
hr.space { margin: 20px 0 15px; border-bottom: 0 }
.fa-arrow-circle-right { color: #ACB8C6 }

.footer { font-size: .9em }
.footer a { font-weight: 500 }
.footer a:hover { color: #895268 }
.footer .far.fa-question-circle { font-size: 1em; margin-right: 5px; position: relative; bottom: -1px }

/* TOOLTIPS */
.has-tip { border-bottom: 0; cursor: pointer }
.tooltip { background: #242938; border-radius: 3px; padding: 4px 12px; font-weight: 600; max-width: 15rem; padding: 20px; }
.tooltip::before, .tooltip.top::before, .tooltip.left::before, .tooltip.right::before { content:''; display: block; width: 0; height: 0; border: inset 0.75rem; position: absolute }
.tooltip::before, .tooltip.left::before, .tooltip.right::before { -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%) }
.tooltip.left::before, .tooltip.right::before { bottom: auto; top: 50%}
.tooltip::before { border-color: transparent transparent #242938; border-bottom-style: solid; border-top-width: 0; bottom: 100%; left: 50% }
.tooltip.top::before { border-color: #242938 transparent transparent; border-top-style:solid; border-bottom-width: 0; top: 100%; bottom: auto }
.tooltip.left::before { border-color:transparent transparent transparent #242938; border-left-style: solid; border-right-width: 0; left: 100%}
.tooltip.right::before { border-color: transparent #242938 transparent transparent; border-right-style: solid; border-left-width: 0; left:auto; right: 100% }
ul.strong li, ul.strong li a, ol.strong li, ol.strong li a { font-weight: 500 }
.strong.spaced li { margin-bottom: 30px }
.cancel { color: #A0AABE; font-weight: 600; margin-left: 15px; cursor: pointer }
.cancel:hover { color: #0091A2 }
.sidebar h3 { border-bottom: 1px solid #e1e4eb; padding-bottom: 4px; color: #0091A2; margin-bottom: 10px; font-size: 1.3em; font-weight: 400 }
.sidebar h4 { font-size: .8em; font-weight: 600; text-transform: uppercase; font-family: 'Poppins', sans-serif; color: #0091A2 }
.sidebar p { font-size: 1em }
a.more { float: right; font-size: .5em; text-transform: uppercase; font-weight: 600; line-height: 3em; color: /* #A0AABE */#3A425F }
a.more:hover { color: #0091A2 }
.discussion h3 { margin-bottom: 5px }
.who { float: left }
.who .inits.small { margin-top: 4px }
.what { margin-left: 50px; font-size: .85em }
.what h4 a { font-size: inherit }
.discussion li { margin-bottom: 30px }
.discussion li a.cont { font-weight: 600; margin-top: 8px }

/* WORKING NAV */
.navigation { margin-bottom: 20px }
.navigation .column .wrapper { border-bottom: 1px solid #C5CCDC; padding-bottom: 5px }
.navigation .column .wrapper.here { border-bottom: 2px solid #0091A2 }
.navigation > .column { margin-bottom: 15px }
.navigation p { font-weight: 500; margin-bottom: 0; height: 25px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.navigation a { font-weight: 500 }
.navigation a:hover { text-decoration: none }
.navigation p.navLabel { font-size: .7em; font-weight: 600; margin-bottom: 2px; border-bottom: 0px; float: none; height: auto }
.dropdown-trigger.navSwitcher { position: relative; top: 0 }
.dropdown-trigger.navSwitcher:focus { outline: none }
i.fal.fa-chevron-circle-down { font-size: 1.3em; margin-right: 5px }
.dropdown-content { background-color: #fff; margin: 0; display: none; min-width: 100px; overflow-y: auto; opacity: 0; position: absolute; left: 0; top: 0; z-index: 9999; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.14); box-shadow: 0 1px 1px 0 rgba(0,0,0,0.08); background: white; border-radius: 8px; max-width: 320px; padding-bottom: 10px }

.dropdown-content:focus{outline:0}
.dropdown-content li.title { font-weight: 500; font-size: .75em; padding: 5px 18px 4px; border-bottom: 0; color: #0091A2; border-bottom: 1px solid #C5CCDC; margin-bottom: 5px }
.dropdown-content li { clear:both; cursor: pointer; line-height: 1.5rem; width: 100%; text-align: left }
.dropdown-content li:last-of-type { border-bottom: 0 }
.dropdown-content li.active a { /* background-color:#eee */ color: #98a3b9 }
.dropdown-content li:focus { outline:none }
.dropdown-content li > a,.dropdown-content li > span { font-size: 1em; color: #3A435F; display: block; padding: 2px 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.dropdown-content li > span > label { top: 1px; left: 0; height: 18px }
.dropdown-content li > a > i { height: inherit; line-height: inherit; float: left; margin-right: 14px; font-size: 1.2em; color: #9FAAC0; width: 14px }


/* SIDEBAR NAV */
ul.sidebarNav { margin-top: 40px }
ul.sidebarNav li a { font-weight: 500; color: #818595 }
ul.sidebarNav li a:hover { color: #0091A2 }
ul.sidebarNav h3 { border-bottom: 1px solid #C5CCDC; padding-bottom: 4px; color: #0091A2; margin-bottom: 10px }
ul.sidebarNav .far { color: #818595; margin-right: 4px }
ul.sidebarNav li { line-height: 1.2em; margin-bottom: 8px }
ul.sidebarNav li:hover .far { color: #0091A2 }

ul.breadcrumbs { position: relative; top: -40px }
ul.breadcrumbs li { font-weight: 500; text-transform: inherit; color: #98a3b9 }
ul.breadcrumbs li a { font-weight: 500; color: #3A435F }
ul.breadcrumbs li a:hover { color: #0091A2; text-decoration: none }

ul.charts li { margin-bottom: 7px }
ul.charts li a { font-weight: 600 }
ul.charts .far { font-size: 30px; color: #ACB8C6; margin-right: 11px; position: relative; bottom: -3px }

.matrixblock.category input[type="text"] { width: 60%; display: inline }
.matrixblock.category span { display: inline }
.matrixblock.category span .fa { font-size: 22px; margin-left: 10px; color: #BBB }
.matrixblock.category span .fa:hover { color: #3A435F }
.bar-chart-options { margin-top: 30px }
.addChartCategory.button { margin-bottom: 30px }
.line-chart-options { margin-top: 20px }

/* ICONS */
.fas, .far { outline: none }
.fa-plus { float: right; font-size: .9em; margin-top: 8px; color: #A0AABE }
body.meta .fa-plus { font-size: 1.1em; color: #1b90a4; padding: 10px 12px; background: #e5f4f4; border-radius: 5px; margin-top: -5px; margin-left: -4px }
body.meta .fa-plus:hover { color: #e5f4f4 !important; background: #1b90a4; }
.fas.fa-edit, .fas.fa-pencil, .fad.fa-pencil-alt, .fa-copy, .fa-file-csv, .fa-file-pdf, .fa-print, .content h1 .fad.fa-pencil-alt { color: #ACB8C6; font-size: 16px; float: right; margin-left: 4px; position: relative }
.fad.fa-pencil-alt, .content h1 .fad.fa-pencil-alt { color: #3A425F; font-size: 20px }
h2 .fas.fa-pencil, h1 .fas.fa-pencil, h2 .fad.fa-pencil-alt, .content h1 .fad.fa-pencil-alt { bottom: -9px }
h2 .fas.fa-edit, h2 .fa-file-csv, h2 .fa-file-pdf, h2 .fa-print { bottom: -8px }
p .fas.fa-edit { bottom: -3px }
h1 .fa-cog, h1 .fa-copy, h1 .fa-file-csv, h1 .fa-file-pdf { color: #ACB8C6; font-size: 21px; float: right; margin-left: 10px; position: relative; bottom: -21px }
h1 .fad.fa-pencil-alt, h1.pdsa .fad.fa-pencil-alt { bottom: 3px; float: none; font-size: 23px; margin-left: 10px }

.actions { position: absolute; right: 50px; top: 50px }
.fa-file-csv, .fa-file-pdf, .fa-print { font-size: 26px; margin-left: 15px; top: 5px }
h1 .fa-copy { bottom: -22px }
a.close { margin-left: 30px }
a.close i.fal::before { color: #0091A2 }
.fa-plus:hover, .fas.fa-edit:hover, .fa-pencil:hover, .fad.fa-pencil-alt:hover, .fa-copy:hover, .fa-file-csv:hover, .fa-print:hover { color: #0091A2 !important }



/* -----------------------------------------
   GLOBAL LAYOUT
----------------------------------------- */
section { margin-bottom: 65px }
.sidebar section { margin-bottom: 30px }
#wrapper { padding: 100px 10px 30px }
.row.inner { background: white; padding: 90px 10px 40px; border-radius: 20px; border: 1px solid #ebf2f8 }
.entry { margin-bottom: 20px }



/* -----------------------------------------
   HEADER
----------------------------------------- */
header { background: white; height: 70px; padding: 0 15px; position: fixed; width: 100%; z-index: 999 }
header .row .column { height: auto }
header .column.logo { height: 70px; overflow: hidden }
header .column.logo span a, footer .column.logo span a { display: inline-block; text-indent: -9999px; width: 200px; height: 60px; background: url('/assets/img/qi-improve-logo-02.png') no-repeat 0 19px; background-size: contain }
header .team a { font-size: 1.2em; font-weight: 300; color: white; padding-right: 10px; opacity: .8 }
header .team a:hover { opacity: 1 }
header a.dropdown-trigger { top: 3px; position: relative }
header a:hover i.fal.fa-chevron-circle-down:before { color: white }
img.profile { border-radius: 50% }
div.inits.small.profile { display: inline-block; margin-left: 10px }
.userName { font-weight: 400; color: #7f8da0; opacity: .7; margin-right: 10px }
.profileImg { text-align: center }
.profileImg img.profile { display: block }
.profileImg a { font-weight: 500; font-size: .85em }
.profileImg a:hover { color: #0091A2 }
.profileLink { display: inline-block; position: relative; padding: 10px 0; cursor: pointer }
.profileLink:after { content:"\f107"; font: 15px/1 "Font Awesome\ 6 Pro"; opacity: .7; color: #7f8da0 }
.profileLink:hover span { opacity: 1 }
/* .profileLink:hover ul.profilePopup { display: block; z-index: 99 } */
ul.profilePopup { background: #3A435F; width: max-content; text-align: left; padding: 10px 0; margin-top: 30px; position: absolute; top: -55px; min-width: 200px }
ul.profilePopup li a { color: white; font-weight: 600; font-size: .85em; opacity: .7 }
ul.profilePopup li a:hover { opacity: 1 }
ul.breadcrumb { margin: 15px 0 0 }
ul.breadcrumb li { color: #3A435F; margin-right: 2px; line-height: 1em; margin-bottom: 6px }
ul.breadcrumb li:first-of-type a { padding-right: 7px }
ul.breadcrumb li:first-of-type:after { content:"\f061"; font: 15px/1 "Font Awesome\ 6 Pro"; opacity: .7; margin-right: 5px }
ul.breadcrumb.no-arrow li:first-of-type:after { content:"" }
ul.breadcrumb li a { color: #3A435F; font-weight: 500; font-size: 1em }
ul.breadcrumb li a:hover { opacity: 1 }



/* -----------------------------------------
   SECTIONS
----------------------------------------- */

ul.teamSelect { margin-top: 30px }
ul.teamSelect li { margin-bottom: 0; line-height: 1.2 }
ul.teamSelect li a { border-bottom: 1px solid #DDD; padding: 20px 0; display: block; font-weight: 500 }

/* TEAM DASHBOARD */
ul.team li { margin-right: 8px }
.team.menu a { padding: 0 }
div.inits { background: #A0AABE; height: 60px; width: 60px; border-radius: 50%; line-height: 60px; text-align: center; font-size: 1.6em; font-weight: 600; color: white }
div.inits.small { height: 40px; width: 40px; line-height: 40px; font-size: 1.1em }
div.inits.large { height: 160px; width: 160px; line-height: 160px; font-size: 2em; margin-bottom: 10px }
div.add { background: transparent; border: 2px solid #0091A2; height: 60px; width: 60px; border-radius: 50%; line-height: 53px; text-align: center; font-size: 1.6em; font-weight: 600; color: #0091A2 }
div.add .fa-plus { color: #0091A2; float: none }
div.add:hover .fa-plus, div.add .fa-plus:hover { color: white !important }
div.add:hover { border: 2px solid #0091A2; background: #0091A2 }

/* THEME DASHBOARD */
ul.themeOverview { list-style: none; margin-left: 0 }
ul.themeOverview li { width: 100%; color: white; font-size: .8em; font-weight: 600; padding: 6px 14px 5px; margin-bottom: 2px }
ul.themeOverview li:first-of-type { background: -moz-linear-gradient(-90deg, #A0AABE 0%, #717889 100%);
background: -webkit-linear-gradient(-90deg, #A0AABE 0%,#717889 100%);
background: linear-gradient(180deg, #A0AABE 0%,#717889 100%) }
ul.themeOverview li:nth-of-type(2) { background: -moz-linear-gradient(-90deg, #717889 0%, #4E5463 100%);
background: -webkit-linear-gradient(-90deg, #717889 0%,#4E5463 100%);
background: linear-gradient(180deg, #717889 0%,#4E5463 100%) }
ul.themeOverview li:nth-of-type(3) { background: -moz-linear-gradient(-90deg, #4E5463 0%, #242938 100%);
background: -webkit-linear-gradient(-90deg, #4E5463 0%,#242938 100%);
background: linear-gradient(180deg, #4E5463 0%,#242938 100%) }
.status { font-weight: 400 }
.status i { margin-right: 6px; color: #90CE7F }
.ga li { margin-bottom: 10px }
.ga li a { margin-bottom: 5px; display: inline-block }
.ga li span { color: #828595; font-weight: 400; font-size: .9em; position: relative; top: -5px }
p.ga { margin-bottom: 8px }

.item { display: table; margin-bottom: 30px; width: 100% }
.item.comment { background: #F0F2F6; padding: 16px; border-radius: 15px }
.user { font-size: .85em; font-weight: 500; margin-bottom: 10px; margin-top: 3px }
.date { color: #98a3b9; font-size: .75em }
.messageMain { font-size: 1.2em }

span.baText { max-width: 800px; display: block; margin-bottom: 20px }


/* PDSA */
.content h1.pdsa { border-bottom: 0; margin-bottom: 35px }
.pdsa.tabs { border: 0; margin-bottom: 80px; border-bottom: 1px solid #e1e4eb }
.pdsa.tabs .tabs-title { width: 25%; border-right: 1px solid #e1e4eb }
.pdsa.tabs .tabs-title:last-of-type { border-right: 0 }
.pdsa.tabs .tabs-title > a { font-size: 1em; padding: 1rem 1.5rem; color: #3A435F; font-weight: 500 }
.pdsa.tabs .tabs-title > a:hover, .pdsa.tabs .tabs-title > a:focus { background: #F0F2F6 }
.pdsa.tabs .tabs-title > a[aria-selected='true'] { background: #0091A2; color: white }
h4 a { font-size: .75em; color: #3A435F }
h4 a:hover { color: #0091A2 }
ul.measurements li p { margin-bottom: 8px; font-size: inherit }
ul.measurements li { margin-bottom: 40px; position: relative; padding-left: 32px }
ul.measurements li:before { content:"\f5ae"; font: 15px/1 "Font Awesome\ 6 Pro"; opacity: .7; position: absolute; top: 3px; left: 0; font-size: 1.4em; color: #ACB8C6 }
table { text-align: left }
table tbody { border: 0 }
table tbody th { font-weight: 500 }
table tbody tr.even { border-bottom: 0; background-color: #f1f1f1 }
table tbody tr .fad.fa-pencil-alt { bottom: -3px }
textarea.short { min-height: 100px }


/* DRIVER DIAGRAM */
.row.sa .column { padding: 0 4px }
#driver-diagram-container { width: 100%; overflow-x: scroll; margin-top: 20px }
#driver-diagram-container.column { padding: 0 }
.tree.row { margin: 0; padding: 0 }
#dd-labels { width: 100%; margin: 10px 0 15px; }
.dd-div { margin-bottom: 20px }
.dd-div div { height: 100%; min-height: 100px; padding: 10px }
.dd-global-aim { margin-bottom: 20px; padding: 0 }
.dd-global-aim div { background: #d1dfed; height: 100%; padding: 20px }
.dd-specific-aim div { background: #93ccC9 }
.dd-measure div { background: #abb9cf }
.dd-pdsa div { background: #cae7d5 }
.columns.saCols { padding:0 }
.columns.saCols .dd-div:first-of-type { padding-left:0 }
.columns.saCols .dd-div:last-of-type { padding-right:0 }

@media screen and (min-width: 64.0625em) {
	.row.sa .column { padding: 0 10px }
	.columns.saCols { padding-left: 10px }
	.columns.saCols .dd-div:first-of-type { padding-left: 10px }
	.dd-div div { padding: 20px }
}


/* DISABLED */
.row.inner.complete h1.pdsa { color: #828595 }
.row.inner.complete .pdsa.tabs .tabs-title > a[aria-selected='true'] { background: #828595; color: white }
.row.inner.complete *, .row.inner.complete .pdsa.tabs .tabs-title > a, .row.inner.complete ul.measurements li:before { color: #828595 }
.row.inner.complete p.status span { color: white }
.row.inner.complete p.status {  }
li.pdsa- .fa-question-circle, li.pdsa-inProcess .fa-question-circle { display: none }
li.pdsa-complete a, li.pdsa-complete .fa-question-circle { color: #ACB8C6 }
.row.inner.complete table tbody tr:nth-child(even) { background-color: #f0f2f6 }
.pdsaHeader { position: relative }
p.status { position: absolute; top: -35px; font-size: .8em; display: none }
p.status strong { color: #0091A2 !important }
p.status.complete { display: block }
p.status span { background: #0091A2; color: white; padding: 4px 8px; font-weight: 600; border-radius: 3px; margin-right: 5px }

.overview { position: absolute; top: -55px; right: 0; }
.overview a { display: inline-block; font-weight: 600; padding: 3px 10px; border: 1px solid #0091A2; color: #0091A2; font-size: .8em }
.overview a:hover { color: #3A435F; border: 1px solid #3A435F; cursor: pointer }

section.dataDisplay { margin-bottom: 125px }
section.dataDisplay.baseline { margin-bottom: 0; position: relative; padding-top: 40px }
section.dataDisplay canvas { margin-top: 70px }
section.dataDisplay h2 { color: #3A425F }
section.dataDisplay h2:before { content:"\f5ae"; font: 15px/1 "Font Awesome\ 6 Pro"; opacity: .7; margin-right: 10px; font-size: 1em; color: #ACB8C6; position: relative }
section.dataDisplay.baseline h2:before { content:"\f46d"; font: 15px/1 "Font Awesome\ 6 Pro"; opacity: .7; margin-right: 10px; font-size: 1em; color: #ACB8C6; position: relative }

dl.improvementDetails { margin-top: 12px; }
dl.improvementDetails dt, dl.improvementDetails dd {  font-size: .8em; color: #7c89a5 }
dl.improvementDetails dt { font-weight: 500; margin-bottom: 0; display: inline-block; }

.shadow .column { background: white; height: 32px; background-size: contain; -webkit-box-shadow: inset 0px -5px 24px -11px rgba(0,0,0,0.14); -moz-box-shadow: inset 0px -5px 24px -11px rgba(0,0,0,0.14); box-shadow: inset 0px -5px 24px -11px rgba(0,0,0,0.14); border-top-left-radius: 20px; border-top-right-radius: 20px; max-width: 96%; margin: 0 auto; border: 1px solid #ebf2f8; position: relative; bottom: -2px; }
.reveal h5 { margin-bottom: 30px; color: #3A425F }
.reveal-overlay { background-color: rgba(240,242,246,.85) }
.reveal { border: 0 }
.close-button { font-size: 3.8em; right: 1.5rem }
.close-button span { color: #0091A2 }


/* -----------------------------------------
   FORMS
----------------------------------------- */
.formContainer { padding: 30px; background: #F0F2F6; margin-bottom: 50px }
#login [type='text'], #login [type='password'] { border: 0; box-shadow: none; border-radius: 0; border-bottom: 1px solid #DDD; width: 100%; height: 40px; text-align: center; margin-bottom: 20px }
#login [type='password'] { margin-bottom: 5px }
#login [type='checkbox'] { margin-bottom: 0 }
#login h2 { font-size: 1.6em; margin-bottom: 20px; text-indent: -9999px; width: 200px; height: 60px; background: url('/assets/img/qi-improve-logo-teal-01.png') no-repeat 0 15px; background-size: contain; border-bottom: 0; margin: 0 auto; margin-bottom: 18px }
.button.login { margin-top: 15px; margin-bottom: 20px }
input:focus ~ .floating-label, input:not(:focus):valid ~ .floating-label { top: -7px; bottom: 10px; left: 0; font-size: 11px; opacity: .8 }
input#pdsa-activate-btn { color: white }
.floating-label { position: absolute; pointer-events: none; left: 0; top: 10px; transition: 0.2s ease all; text-align: center; width: 240px; color: #777 }
textarea { min-height: 200px }
[type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea, form.dataEntry input { color: #3A425F; border: 1px solid #C5CCDC }
form.dataEntry select { width: auto; top: 1px; position: relative; padding: 0 28px 0 15px }
[type='submit'] { cursor: pointer }
form.dataEntry input { height: 36px; padding-left: 10px }
form.dataEntry [type='submit'] { position: relative; top: -1px; margin-left: 20px; border: 0; color: #F0F2F6 }
#fieldNotes textarea { margin: 10px 0 }
#fieldNotes [type='submit'] { margin-left: 0 }
#act [type='radio'] { margin-bottom: 0; margin-right: 9px; margin-top: 3px; float: left }
#act [type='submit'] { margin-top: 20px }
#act ul li { margin-bottom: 10px }
#act ul li div { float: left; width: 90% }
#sa-edit [type='radio'] { margin-left: 9px }

.form-radio { display: inline-block; margin-right: 20px; font-size: 1em }
.form-radio input, input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; position: relative; background-color: white; color: white; top: 7px; height: 25px; width: 25px; border: 0; border-radius: 50px; cursor: pointer; outline: none; margin-bottom: 0; margin-right: 2px; border: 2px solid #0091A2 }
.form-radio input:checked::before, input[type="radio"]:checked::before { position: absolute; font: 15px/1 'Open Sans', sans-serif; left: 6px; top: 1px; content: '\02143'; transform: rotate(40deg); font-weight: 600 }
.form-radio input:hover, input[type="radio"]:hover { background-color: white }
.form-radio input:checked, input[type="radio"]:checked { background-color: #0091A2 }

form.qia input[type="radio"] { height: 20px; width: 20px; top: 4px; margin-right: 0 }
form.qia [type=checkbox]+label, form.qia [type=radio]+label { margin-left: 4px }
form.qia input[type="radio"]:checked::before { left: 4px; top: -1px; font: 14px/1 'Open Sans', sans-serif; }

p.spacer { height: 10px }
div.reveal label { font-size: 1em }

/* QIA FORM */
.menu .menu-text { border: 1px solid transparent; padding: .3rem .5rem; margin-right: 5px }
.menu .menu-text.is-active { border: 1px solid #3A435F }
ul.errors { list-style: none; background: #488f8e; display: block; width: 100%; margin-left: 0; margin-bottom: 0; border-radius: 10px }
ul.errors li { padding: 8px 12px; margin-top: 10px; color: white; font-weight: 600 }
ul.errors li:before { content: '↑'; margin-right: 6px; font-weight: 300 }

h3.icon.lookatme { display: inline-block; margin-bottom: 20px }
h3.icon.lookatme i.fal { font-size: 1.6em; position: relative; bottom: -3px }
h3.icon.lookatme a:hover { color: white }
h3.icon.lookatme a { padding: 9px 20px 10px 20px; border-radius: 30px; border: 1px solid #0091A2; width: 100% }
h3.icon.lookatme a:hover { background: #0091A2 }
h3.icon.lookatme i.fal:before { color: #0091A2 }
h3.icon.lookatme a:hover i.fal:before { color: white }
.qiaDescription { margin-left: 43px; margin-top: -9px; font-size: .9em; margin-bottom: 7px }

.results, .results a { display: inline-flex; font-weight: 500; font-size: 14px }
span.results { position: absolute; bottom:10px; right: 10px }
h3.icon.lookatme span.results a { border: 0; padding: 0 }
h3.icon.lookatme:hover span.results a { color: inherit; background: inherit }
h3.icon.lookatme span.results a:hover { color: #0091A2 }


/* -----------------------------------------
   HELP CENTER
----------------------------------------- */
a.formLaunch div { border: 1px solid #e1e4eb; border-radius: 10px; background: white; padding: 30px 25px; margin-bottom: 20px }
a.formLaunch div h3 { margin-top: 10px }
a.formLaunch:hover div { border: 1px solid #895268 }
a.formLaunch:hover div h3 { color: #895268 }
i.fal.fa-play-circle { font-size: 1.2em; margin-left: 5px; position: relative; bottom: -2px; }
a.videoLink li { font-weight: 500 }
a.videoLink:hover li { color: #895268 }


@media screen and (min-width: 40.0625em) {
	strong, b { font-weight: 500 }
	header { position: inherit }
	.row.inner { padding: 40px 10px }
	p, li, dd { font-size: inherit }
	li { margin-bottom: 7px }
	ul.tabs { margin-left: 0; margin-right: 0 }
	.dropdown-content { width: 640px }
	.dropdown-content li > a,.dropdown-content li > span { font-size: .85em }
	#wrapper { padding: 70px 30px 30px }
	.row.inner { padding: 80px 30px }
	.navigation .column { margin-bottom: 0 }
	.navigation .column .wrapper { padding-bottom: 0 }

	.sidebar { padding-left: 30px }
	.sidebar p { font-size: .9em }
	.reveal { padding: 40px }
	.reveal.large { width: 80% }
	ul.sidebarNav { margin-top: 150px }
	ul.breadcrumb { margin: 6px 0 0; flex-wrap: wrap; display: flex; justify-content: center }
	ul.breadcrumb li { color: #3A435F; margin-bottom: 0 }
	ul.breadcrumb li a { color: #3A435F; font-size: .9em; opacity: .7 }
	.button#new-baseline-btn { position: relative; top: -62px }

}
/* 769px */
@media screen and (min-width: 48.0625em) {
	.reveal.large { width: 65% }
	ul.themeOverview li { display: inline-block; width: 32.8% }
	ul.themeOverview li:first-of-type { background: -moz-linear-gradient(-45deg, #A0AABE 0%, #717889 100%);
	background: -webkit-linear-gradient(-45deg, #A0AABE 0%,#717889 100%);
	background: linear-gradient(135deg, #A0AABE 0%,#717889 100%) }
	ul.themeOverview li:nth-of-type(2) { background: -moz-linear-gradient(-45deg, #717889 0%, #4E5463 100%);
	background: -webkit-linear-gradient(-45deg, #717889 0%,#4E5463 100%);
	background: linear-gradient(135deg, #717889 0%,#4E5463 100%) }
	ul.themeOverview li:nth-of-type(3) { background: -moz-linear-gradient(-45deg, #4E5463 0%, #242938 100%);
	background: -webkit-linear-gradient(-45deg, #4E5463 0%,#242938 100%);
	background: linear-gradient(135deg, #4E5463 0%,#242938 100%) }
}
