/* 
 * The names of these colors are based on the below website.
 * Reference: http://chir.ag/projects/name-that-color
 */
/*
 * User/GP/SP color
 */
/*******************************
         Site Settings
*******************************/
/***********************************************************
  Central element variation compilation enablers
***********************************************************/
/* General */
/*******************************
           Elements
*******************************/
/* Button */
/* Container */
/* Divider */
/* Header */
/* Icon */
/* Image */
/* Input */
/* Label */
/* List */
/* Loader */
/* Placeholder */
/* Rail */
/* Reveal */
/* Segment */
/* Step */
/* Text */
/*******************************
           Collections
*******************************/
/* Breadcrumb */
/* Form */
/* Grid */
/* Menu */
/* Message */
/* Table */
/*******************************
             Views
*******************************/
/* Ad */
/* Card */
/* Comment */
/* Feed */
/* Item */
/* Statistic */
/*******************************
            Modules
*******************************/
/* Accordion */
/* Calendar */
/* Checkbox */
/* Dimmer */
/* Dropdown */
/* Embed */
/* Modal */
/* Popup */
/* Progress */
/* Rating */
/* Search */
/* Shape */
/* Sidebar */
/* Slider */
/* Tab */
/* Toast */
/* Loading */
/* Emojis */
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
    Border Radius
--------------------*/
/* See Power-user section below
   for explanation of @px variables
*/
/*-------------------
    Brand Colors
--------------------*/
/* Whenever a color needs to get calculated (screen()/multiply()) out of a base color */
/*--------------
  Page Heading
---------------*/
/*--------------
   Form Input
---------------*/
/* This adjusts the default form input across all elements */
/* Input Text Color */
/* Line Height Default For Inputs in Browser (Descenders are 17px at 14px base em) */
/*-------------------
    Focused Input
--------------------*/
/* Used on inputs, textarea etc */
/* Used on dropdowns, other larger blocks */
/*-------------------
        Sizes
--------------------*/
/*
  Sizes are all expressed in terms of 14px/em (default em)
  This ensures these "ratios" remain constant despite changes in EM
*/
/*-------------------
        Page
--------------------*/
/*-------------------
      Paragraph
--------------------*/
/*-------------------
       Links
--------------------*/
/*-------------------
    Scroll Bars
--------------------*/
/* Inverted */
/*-------------------
  Highlighted Text
--------------------*/
/*-------------------
       Loader
--------------------*/
/*-------------------
        Grid
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*---  Light Colors  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Headers ---*/
/*--- Colored Text ---*/
/*--- Light Colored Text ---*/
/*--- Hovered Colored Text ---*/
/*--- Colored Border ---*/
/*--- Shadows ---*/
/* Inverted */
/* Box Shadows */
/*-------------------
     Alpha Colors
--------------------*/
/*-------------------
       Accents
--------------------*/
/* Differentiating Neutrals */
/* Differentiating Layers */
/*******************************
           Power-User
*******************************/
/*-------------------
    Emotive Colors
--------------------*/
/* Positive */
/* Negative */
/* Info */
/* Warning */
/*-------------------
        Paths
--------------------*/
/* For source only. Modified in gulp for dist */
/*-------------------
       Em Sizes
--------------------*/
/*
  This rounds @size values to the closest pixel then expresses that value in (r)em.
  This ensures all size values round to exact pixels
*/
/* em */
/* rem */
/*-------------------
       Icons
--------------------*/
/* Maximum Glyph Width of Icon */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
    Derived Values
--------------------*/
/* Loaders Position Offset */
/* Rendered Scrollbar Width */
/* Maximum Single Character Glyph Width, aka Capital "W" */
/* Used to match floats with text */
/* Header Spacing */
/* Minimum Mobile Width */
/* Positive / Negative Dupes */
/* Responsive */
/*-------------------
  Exact Pixel Values
--------------------*/
/*
  These are used to specify exact pixel values in em
  for things like borders that remain constantly
  sized as emSize adjusts

  Since there are many more sizes than names for sizes,
  these are named by their original pixel values.

*/
/* Columns */
/*******************************
             States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Shadows  ---*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Focus
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Active
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*---  Tertiary  ---*/
/*---  Bright  ---*/
/*******************************
 States shared in Form-related components
 *******************************/
/* Form state*/
/* Input state */
/* AutoFill */
/* Dropdown state */
/* Focused state */
/* Placeholder state */
/*
 * ARW variables
 */
/*
 * User/GP/SP color
 */
/* Color variables for new UI enhancements Issue 9216 & 9212 */
/* Color variables for Calendar view when picking a session */
/* Font variables for new UI enhancements Issue 9216 & 9212*/
@font-face {
  font-family: 'jennasue';
  src: url('/assets/fonts/JennaSue.ttf');
}
@font-face {
  font-family: 'lato light';
  src: url('/assets/fonts/Lato-Light.ttf');
}
@font-face {
  font-family: 'lato heavy';
  src: url('/assets/fonts/Lato-Heavy.ttf');
}
@font-face {
  font-family: 'lato black';
  src: url('/assets/fonts/Lato-Black.ttf');
}
/* Font variables for new UI enhancements Issue 9216 & 9212*/
@font-face {
  font-family: 'montserrat bold';
  src: url('/assets/fonts/Montserrat-Bold.ttf');
}
@font-face {
  font-family: 'montserrat medium';
  src: url('/assets/fonts/Montserrat-Medium.ttf');
}
@font-face {
  font-family: 'montserrat regular';
  src: url('/assets/fonts/Montserrat-Regular.ttf');
}
/* The typing effect */
@keyframes typing {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
/* The typewriter cursor effect */
@keyframes blink-caret {
  from,
  to {
    border-color: transparent;
  }
  50% {
    border-color: orange;
  }
}
#md-18 {
  font-size: 18px;
}
/* sidebar compatibility - use this to retain desired background */
.ui.menu.arrow-sidebar {
  height: initial !important;
}
.ui.menu.arrow-sidebar > .item {
  font-size: 1.3rem !important;
  background-color: white !important;
  line-height: 4 !important;
}
@media (min-width: 1081px) {
  .container {
    width: 1136px;
    margin: 0 auto;
  }
  .grid {
    display: grid;
    grid-template-columns: 1fr repeat(3, 321.079px) 1fr;
    grid-template-rows: repeat(8, auto);
    grid-gap: 0 18.38px;
    margin: 0 auto;
  }
  .unauthenticated.menu {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 10;
    justify-content: space-between;
  }
  .unauthenticated.menu .nav-links {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .mast {
    grid-column: 1 / -1;
    grid-row: span 1;
    height: 530px;
    clip-path: circle(479% at 50% -702%);
    display: inherit;
    grid-template-columns: inherit;
    grid-template-rows: auto;
    grid-gap: inherit;
    /*
      * Parallax background
      */
    background-image: url("/assets/images/hands3.jpg");
    background-repeat: no-repeat;
    background-size: 1136px 800px;
    background-position: top center;
    background-attachment: fixed;
    padding: 10em 0 8em 0em;
  }
  .mast .hero {
    grid-column: 2 / -1;
    font-size: 35pt;
    font-family: 'lato light';
    padding-bottom: 0.5em;
    line-height: 1;
    width: 100%;
  }
  .mast .hero .user-types {
    display: flex;
  }
  .mast .hero .user-type {
    font-family: 'lato black';
    overflow: hidden;
    /* Ensures the content is not revealed until the animation */
    border-right: 0.15em solid orange;
    /* The typwriter cursor */
    white-space: nowrap;
    /* Keeps the content on a single line */
    margin: 0 auto;
    /* Gives that scrolling effect as the typing happens */
    letter-spacing: 0.15em;
    /* Adjust as needed */
    animation: typing 2.5s steps(30, end), blink-caret 0.5s step-end infinite;
  }
  .mast .hero .user-type.white {
    color: white;
  }
  .mast .hero a.ui.button {
    font-weight: bold;
    margin-top: 1.5em;
    color: black !important;
    background-color: white !important;
    box-shadow: 0px 0px 0px 3px black !important;
  }
  .mast .hero a.ui.button:hover {
    color: white !important;
    background-color: #198ccc !important;
  }
  .overlay {
    background-position: bottom left;
    background-repeat: no-repeat;
    display: flex;
    align-items: flex-end;
    width: 0;
    position: relative;
  }
  .overlay img {
    width: 330px;
    position: absolute;
  }
  .orange-navigator,
  .blue-navigator {
    position: relative;
    grid-column: 1 / -1;
  }
  .orange-navigator img,
  .blue-navigator img {
    position: absolute;
    top: -57px;
    margin-left: 518px;
    width: 100px;
  }
  .service-offering {
    margin: 2em 0 5rem 0;
    color: #5A5A5B;
  }
  .service-offering img {
    width: 250px;
    align-self: center;
  }
  .service-offering.col1 {
    grid-column: 2 / 3;
    display: flex;
    flex-direction: column;
  }
  .service-offering.col2 {
    grid-column: 3 / 4;
    display: flex;
    flex-direction: column;
  }
  .service-offering.col3 {
    grid-column: 4 / 5;
    display: flex;
    flex-direction: column;
  }
  .service-offering .content {
    text-align: center;
    font-size: 1.3rem;
    font-family: 'lato black';
    text-transform: uppercase;
    padding: 0px 30px;
    line-height: 1;
  }
  .service-offering .content .sub.header {
    font-family: 'lato light';
    text-transform: initial;
    color: #444;
    font-size: initial;
    font-weight: initial;
    margin-top: 0.5em;
  }
  .why-smarter-health {
    clip-path: circle(479% at 50% 802%);
    grid-column: 1 / -1;
    background-color: #bcd2ed;
    height: 530px;
    display: inherit;
    grid-template-columns: inherit;
    grid-template-rows: auto;
    grid-gap: inherit;
  }
  .why-smarter-health .header {
    grid-column: 1 / -1;
    font-size: 3em;
    font-weight: bold;
    justify-self: center;
    height: 2em;
    line-height: 1;
    font-family: 'lato black';
    margin-top: 2.4rem;
  }
  .why-smarter-health img {
    width: 250px;
    align-self: center;
  }
  .why-smarter-health .col1 {
    grid-column: 2 / 3;
    margin-bottom: 4rem;
    display: flex;
    flex-direction: column;
  }
  .why-smarter-health .col2 {
    grid-column: 3 / 4;
    display: flex;
    flex-direction: column;
  }
  .why-smarter-health .col3 {
    grid-column: 4 / 5;
    display: flex;
    flex-direction: column;
  }
  .why-smarter-health .content {
    text-align: center;
    font-size: 1.4em;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'lato black';
    color: #5A5A5B;
  }
  .why-smarter-health .content .sub.header {
    text-transform: initial;
    color: #444;
    font-size: initial;
    font-weight: initial;
    line-height: initial;
    font-family: 'lato light';
    margin-bottom: 2rem;
    margin-top: 0.5rem;
  }
  .worldclass-healthcare {
    grid-column: 1 / -1;
    height: 500px;
    background-image: url("/assets/images/heart-in-hand2.png");
    background-size: 654px 500px;
    background-repeat: no-repeat;
    background-color: #F3F2F2;
    display: inherit;
    grid-template-columns: inherit;
    grid-template-rows: auto;
    grid-gap: inherit;
    background-position-x: right;
  }
  .worldclass-healthcare .content {
    margin: auto 0;
    grid-column: 2 / -2;
    font-size: 3em;
    font-family: 'lato black';
    line-height: 1;
  }
  .worldclass-healthcare .content .sub.header {
    font-size: 0.5em;
    margin-top: 2rem;
    font-family: 'lato light';
    font-weight: initial;
    line-height: initial;
    color: #444;
  }
  .how-it-works {
    grid-column: 1 / -1;
    height: 715px;
    text-align: center;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 35%;
    display: flex;
    flex-direction: column;
  }
  .how-it-works .header {
    font-size: 3em;
    font-weight: bold;
    line-height: 4.5em;
    font-family: 'lato black';
  }
  .how-it-works .main-carousel {
    height: 400px !important;
  }
  .how-it-works .carousel-3d-slider,
  .how-it-works .carousel-3d-slide {
    height: 100% !important;
  }
  .how-it-works .carousel-3d-slide {
    border: 2px solid black !important;
    border-radius: 0.3em;
    background-color: white;
  }
  .how-it-works .content {
    height: 145.62px;
    background-color: white;
    text-align: center;
    padding: 0.5em;
    color: #444;
    font-family: 'lato light';
  }
  .how-it-works .content .emphasize {
    font-family: 'lato black';
  }
  .how-it-works .carousel-3d-controls a {
    width: unset !important;
    height: unset !important;
  }
  .how-it-works .carousel-3d-controls span {
    background-color: white;
    border-radius: 100%;
    height: 5rem;
    width: 5rem;
    display: inline-block;
    text-align: center;
    font-size: 5rem;
  }
  .how-it-works .side-navs {
    align-self: center;
    display: flex;
  }
  .how-it-works .side-navs .nav {
    width: 10px;
    height: 10px;
    margin-top: 2rem;
    margin-right: 10px;
    background-color: #ABACAF;
    border-radius: 50%;
  }
  .how-it-works .side-navs .nav.active {
    background-color: #f48025;
  }
  .about-our-company {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #F3F2F2;
  }
  .about-our-company > .header {
    font-size: 2.5em;
    line-height: 2.5;
    font-family: 'lato black';
    margin-top: 2rem;
  }
  .about-our-company .content {
    display: inherit;
    margin-bottom: 4rem;
  }
  .about-our-company .content img {
    width: 350px;
    height: 350px;
    margin-left: auto;
    border-radius: 100%;
    object-fit: cover;
    object-position: 0px -90px;
  }
  .about-our-company .content .quote {
    flex-basis: 50%;
    margin: auto;
  }
  .about-our-company .content .quote .ceo-name-section {
    display: flex;
  }
  .about-our-company .content .quote .ceo-name-section .ceo-name {
    color: #5A5A5B;
    flex-basis: calc(100%/2);
    font-family: 'lato black';
    font-size: 1.4rem;
  }
  .about-our-company .content .quote .ceo-name-section .ceo-section {
    border-bottom: 2px solid black;
    flex-basis: 70%;
    align-self: center;
  }
  .about-our-company .content .quote .ceo-message {
    font-family: jennasue;
    color: #FC7F38;
    margin-top: 1rem;
    font-size: 36px;
    line-height: normal;
  }
  .about-our-company .content .quote .ceo-section-2 {
    margin-top: 2rem;
    border-bottom: 2px solid black;
    margin-bottom: 2rem;
  }
  .about-our-company .content .quote .ceo-message2 {
    font-family: 'lato light';
  }
  .about-our-company .content .quote .vision,
  .about-our-company .content .quote .mission {
    font-family: 'lato light';
  }
  .about-our-company .content .quote .vision > b,
  .about-our-company .content .quote .mission > b {
    font-family: 'lato black';
    color: #5A5A5B;
  }
  .create-account {
    grid-column: 1/ -1;
    display: inherit;
    grid-template-columns: inherit;
    grid-template-rows: auto;
    grid-gap: inherit;
    height: 90px;
  }
  .create-account .content {
    grid-column: 2 / 4;
    font-size: 1.5em;
    color: #5A5A5B;
    align-self: center;
  }
  .create-account .ui.button {
    grid-column: -3;
    justify-self: end;
    align-self: center;
    font-weight: bold !important;
    color: black !important;
    background-color: white !important;
    box-shadow: 0px 0px 0px 2px black !important;
  }
  .create-account .ui.button:hover {
    color: white !important;
    background-color: #198ccc !important;
  }
  .footer {
    grid-column: 1 / -1;
  }
}
@media (max-width: 1080px) {
  :root {
    font-size: 2.6vw;
  }
  .container {
    max-width: 1080px !important;
  }
  .grid {
    display: grid;
    grid-template-columns: 1rem 1fr 1rem;
    grid-gap: 0;
    margin: 0 auto;
  }
  .unauthenticated.menu {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 10;
    padding: 0;
  }
  .unauthenticated.menu .arrow-banner-logo .logo img:first-child {
    display: none;
  }
  .unauthenticated.menu .arrow-banner-logo .logo img:last-child {
    max-width: 32vw;
    height: 2rem !important;
  }
  .unauthenticated.menu .login-signup-buttons {
    padding-right: 0;
    padding-left: 0;
  }
  .unauthenticated.menu .login-signup-buttons .ui.basic.button {
    font-size: 1rem;
  }
  .unauthenticated.menu .sidebar-toggle.item {
    padding-left: 0.5rem;
    padding-right: 0;
  }
  .mast {
    grid-column: 1 / -1;
    grid-row: span 1;
    height: calc(100vh - 5rem);
    display: inherit;
    grid-template-columns: inherit;
    grid-template-rows: auto;
    grid-gap: inherit;
    /*
     * Parallax background
     */
    background-image: url("/assets/images/hands3.jpg");
    background-position: top right;
    background-repeat: no-repeat;
    background-size: cover;
    align-items: center;
  }
  .mast .hero {
    grid-column: 2 / -1;
    font-family: 'lato light';
    font-size: 3rem;
    line-height: 1.2;
    padding-bottom: 0.5rem;
    width: 100%;
  }
  .mast .hero .user-types {
    display: flex;
    font-size: 2.5rem;
  }
  .mast .hero .user-type {
    font-family: 'lato black';
    overflow: hidden;
    /* Ensures the content is not revealed until the animation */
    border-right: 0.15em solid orange;
    /* The typwriter cursor */
    white-space: nowrap;
    /* Keeps the content on a single line */
    margin: 0 auto;
    /* Gives that scrolling effect as the typing happens */
    letter-spacing: 0.15em;
    /* Adjust as needed */
    animation: typing 2.5s steps(30, end), blink-caret 0.5s step-end infinite;
  }
  .mast .hero .user-type.white {
    color: white;
  }
  .mast .hero a.ui.button {
    font-size: 1.5rem;
    font-weight: bold;
    margin-top: 1.5rem;
    color: black !important;
    background-color: white !important;
    box-shadow: 0px 0px 0px 3px black !important;
  }
  .mast .hero a.ui.button:hover {
    color: white !important;
    background-color: #198ccc !important;
  }
  .overlay {
    grid-column: 1 / 1;
    grid-row: 6;
    background-position: bottom left;
    background-repeat: no-repeat;
    width: 1rem;
    display: flex;
    align-items: flex-end;
  }
  .overlay img {
    width: 70vw;
    max-width: 400px;
  }
  .orange-navigator,
  .blue-navigator {
    position: relative;
    grid-column: 2/2;
  }
  .orange-navigator img,
  .blue-navigator img {
    position: absolute;
    left: 0;
    right: 0;
    width: 14vw;
    margin: -7vw auto 0;
  }
  .service-offering {
    margin: 0;
    color: #5A5A5B;
    text-align: center;
    grid-column: 2 / 2;
    padding: 0 2rem;
  }
  .service-offering.col3 {
    margin-bottom: 80px;
  }
  .service-offering img {
    width: 18rem;
  }
  .service-offering .content {
    text-align: center;
    font-size: 1.8rem;
    font-family: 'lato black';
    text-transform: uppercase;
    padding: 0px;
    line-height: 1;
  }
  .service-offering .content .sub.header {
    font-family: 'lato light';
    font-size: 1.5rem;
    line-height: 1;
    font-weight: initial;
    text-transform: initial;
    color: #444;
    margin-top: 1rem;
  }
  .worldclass-healthcare {
    grid-column: 1 / -1;
    background-image: url("/assets/images/heart-in-hand2.png");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: top left;
    background-color: #F3F2F2;
    display: inherit;
    grid-template-columns: inherit;
    grid-template-rows: auto;
    grid-gap: inherit;
  }
  .worldclass-healthcare .content {
    margin: 90px 0;
    padding: 5px;
    grid-column: 2 / -2;
    font-size: 2.5rem;
    line-height: 1;
    font-family: 'lato black';
    background-color: rgba(255, 255, 255, 0.6);
  }
  .worldclass-healthcare .content .sub.header {
    font-size: 1.5rem;
    line-height: 1.4;
    margin-top: 1rem;
    font-family: 'lato light';
    font-weight: initial;
    color: #444;
  }
  .worldclass-healthcare .content .sub.header > br {
    display: none;
  }
  .how-it-works {
    grid-column: 1 / -1;
    margin-top: 3rem;
    margin-bottom: 3rem;
    padding-bottom: 4.5vw;
    font-size: 2rem;
    line-height: 2rem;
    text-align: center;
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 70%;
    display: flex;
    flex-direction: column;
  }
  .how-it-works .header {
    font-family: 'lato black';
    margin: 1rem 0;
  }
  .how-it-works .main-carousel {
    height: 380px !important;
  }
  .how-it-works .carousel-3d-slider,
  .how-it-works .carousel-3d-slide {
    height: 100% !important;
  }
  .how-it-works .carousel-3d-slide {
    border: 2px solid black !important;
    border-radius: 0.3em;
    background-color: white;
  }
  .how-it-works .content {
    height: 150px;
    background-color: white;
    text-align: center;
    padding: 0.5em;
    font-size: 16px;
    line-height: 1;
    color: #444;
    font-family: 'lato light';
  }
  .how-it-works .content .emphasize {
    font-family: 'lato black';
  }
  .how-it-works .side-navs {
    align-self: center;
    display: flex;
  }
  .how-it-works .side-navs .nav {
    width: 10px;
    height: 10px;
    margin-top: 2rem;
    margin-right: 10px;
    background-color: #ABACAF;
    border-radius: 50%;
  }
  .how-it-works .side-navs .nav.active {
    background-color: #f48025;
  }
  .why-smarter-health {
    grid-column: 1 / -1;
    background-color: #bcd2ed;
    display: inherit;
    grid-template-columns: inherit;
    grid-template-rows: auto;
    grid-gap: inherit;
  }
  .why-smarter-health .header {
    grid-column: 1 / -1;
    justify-self: center;
    font-size: 2rem;
    line-height: 2rem;
    font-weight: bold;
    font-family: 'lato black';
    margin-top: 2rem;
  }
  .why-smarter-health .col1,
  .why-smarter-health .col2,
  .why-smarter-health .col3 {
    grid-column: 2 / 2;
    text-align: center;
  }
  .why-smarter-health .col1 img,
  .why-smarter-health .col2 img,
  .why-smarter-health .col3 img {
    width: 18rem;
  }
  .why-smarter-health .col3 {
    margin-bottom: 45px;
  }
  .why-smarter-health .content {
    text-align: center;
    font-size: 1.8rem;
    line-height: 1;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'lato black';
    color: #5A5A5B;
  }
  .why-smarter-health .content .sub.header {
    text-transform: initial;
    color: #444;
    font-size: 1.5rem;
    line-height: 1;
    font-weight: initial;
    font-family: 'lato light';
    margin-bottom: 2rem;
    margin-top: 1rem;
  }
  .why-smarter-health .content .sub.header > br {
    display: none;
  }
  .about-our-company {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #F3F2F2;
  }
  .about-our-company > .header {
    font-size: 2rem;
    line-height: 2rem;
    font-family: 'lato black';
    margin-top: 2rem;
    margin-bottom: 1rem;
  }
  .about-our-company .content {
    font-size: 1.3rem;
    line-height: 1.3rem;
    display: inherit;
    flex-direction: column;
    align-items: center;
    margin-bottom: 3rem;
    padding: 2rem;
  }
  .about-our-company .content img {
    width: 55vw;
    height: 55vw;
    margin-bottom: 1rem;
    border-radius: 100%;
    object-fit: cover;
    object-position: center;
  }
  .about-our-company .content .quote {
    flex-basis: 100%;
    margin: auto 1rem;
    font-size: 1rem;
    line-height: 1;
    padding: 0 10px;
  }
  .about-our-company .content .quote .ceo-name-section {
    display: flex;
  }
  .about-our-company .content .quote .ceo-name-section .ceo-name {
    color: #5A5A5B;
    font-size: 1.5rem;
    font-family: 'lato black';
    margin-right: 10px;
  }
  .about-our-company .content .quote .ceo-name-section .ceo-section {
    flex: 1;
    border-bottom: 2px solid black;
    align-self: center;
  }
  .about-our-company .content .quote .ceo-message {
    font-family: jennasue;
    color: #FC7F38;
    margin-top: 0.8rem;
    font-size: 2.75rem;
    line-height: 1;
  }
  .about-our-company .content .quote .ceo-section-2 {
    margin-top: 2rem;
    border-bottom: 2px solid black;
    margin-bottom: 2rem;
  }
  .about-our-company .content .quote .ceo-message2 {
    font-family: 'lato light';
    font-size: 1.5rem;
  }
  .about-our-company .content .quote .vision,
  .about-our-company .content .quote .mission {
    font-family: 'lato light';
    line-height: 1.4285em;
    font-size: 1.5rem;
    margin-top: 1rem;
  }
  .about-our-company .content .quote .vision > b,
  .about-our-company .content .quote .mission > b {
    font-family: 'lato black';
    color: #5A5A5B;
  }
  .create-account {
    grid-column: 2 / 2;
    height: 20rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .create-account .content {
    font-size: 2rem;
    color: #5A5A5B;
    text-align: center;
    padding: 2rem;
    line-height: 1;
  }
  .create-account .ui.button {
    font-weight: bold !important;
    color: black !important;
    background-color: white !important;
    box-shadow: 0px 0px 0px 2px black !important;
    font-size: 1.3rem;
  }
  .create-account .ui.button:hover {
    color: white !important;
    background-color: #198ccc !important;
  }
  .footer {
    grid-template-columns: 1rem 1fr 1rem !important;
    grid-column: 1 / -1;
    font-size: 1rem;
  }
  .footer .ui.action.input input {
    border-radius: 0;
  }
}
@media (max-width: 1080px) and (min-width: 480px) {
  .unauthenticated.ui.menu {
    min-height: initial;
    padding: 0.5rem 0;
  }
  .unauthenticated.ui.menu .item {
    padding-top: 0;
    padding-bottom: 0;
  }
  .unauthenticated.ui.menu .login-signup-buttons.item .ui.basic.button {
    font-size: 14px;
  }
  .unauthenticated.ui.menu .sidebar-toggle .large.sidebar.icon {
    font-size: 1rem;
  }
  .unauthenticated.ui.menu .arrow-banner-logo {
    margin-top: 0;
    margin-bottom: 0;
  }
  .unauthenticated.ui.menu .arrow-banner-logo .logo img:last-child {
    height: 1rem !important;
  }
  .mast {
    height: calc(100vh - 3rem);
  }
  .mast .hero a.ui.button {
    font-size: 1rem;
  }
  .service-offering img {
    width: 14rem;
  }
  .service-offering .content {
    font-size: 1.3rem;
  }
  .service-offering .content .sub.header {
    font-size: 1rem;
  }
  .worldclass-healthcare .content {
    font-size: 2rem;
  }
  .worldclass-healthcare .content .sub.header {
    font-size: 1rem;
  }
  .why-smarter-health .header {
    font-size: 1.5rem;
  }
  .why-smarter-health .content {
    font-size: 1.3rem;
  }
  .why-smarter-health .content .sub.header {
    font-size: 1rem;
  }
  .why-smarter-health .col1 img,
  .why-smarter-health .col2 img,
  .why-smarter-health .col3 img {
    width: 14rem;
  }
  .about-our-company .header {
    font-size: 1.5rem;
  }
  .about-our-company .content img {
    width: 40vw;
    height: 40vw;
  }
  .about-our-company .content .quote .ceo-name-section .ceo-name {
    font-size: 1rem;
  }
  .about-our-company .content .quote .ceo-message {
    font-size: 2rem;
  }
  .about-our-company .content .quote .ceo-message2,
  .about-our-company .content .quote .vision,
  .about-our-company .content .quote .mission {
    font-size: 1rem;
  }
  .create-account .content {
    font-size: 1.5rem;
  }
  .create-account .ui.button {
    font-size: 0.8rem;
  }
  .footer .footer-content .ui.header {
    font-size: 1rem;
  }
  .footer .footer-content .ui.link.list {
    font-size: 0.8rem;
  }
}
ol {
  counter-reset: section;
  list-style-type: none;
}
li::before {
  counter-increment: section;
  content: counters(section, ".") " ";
  margin-left: -4em;
  font-weight: bold;
  position: absolute;
}
li.l1 {
  margin-top: 2em;
}
li.l1::before {
  margin-left: -3em;
  font-size: 1.2em;
}
.l1-header {
  font-size: 1.2rem;
  font-weight: bold;
  text-align: left !important;
  margin-top: 0.5rem;
}
.l2-content {
  margin-top: 0.5em;
}
.l2-content .interpretation {
  font-weight: bold;
  margin-right: 0.5em;
}
.l2-content.header {
  margin-left: -1em;
  margin-top: 1em;
  font-weight: bold;
}
.l2-content span.header {
  font-weight: bold;
}
.l2-content.emphasize {
  margin-left: -1em;
  margin-top: 1em;
  font-style: italic;
}
.l3-content {
  margin-top: 0.5em;
}
.l3-content .quoted {
  font-style: italic;
}
.l3-content .quoted:before {
  content: open-quote;
}
.l3-content .quoted:after {
  content: close-quote;
  margin-right: 0.5em;
}
.container {
  background-color: #F3F2F2;
  font-family: 'lato';
}
.grid {
  margin-bottom: 5em;
}
.grid .tnc {
  grid-column: 2 / -2;
}
.huge.header {
  margin-top: 50px;
  font-family: 'lato black';
  text-align: center;
}
.notes-wrapper {
  color: #5A5A5B;
}
.notes-wrapper p .emphasize {
  font-weight: bold;
}
.notes-wrapper .content {
  padding: 0 2.5em;
}
