@-webkit-keyframes bounce {     70% {         -webkit-transform: scale(1);         transform: scale(1)     }     85% {         -webkit-transform: scale(0.95) translateY(1px);         transform: scale(0.95) translateY(1px)     }     100% {         -webkit-transform: scale(1);         transform: scale(1)     } }  @keyframes bounce {     70% {         -webkit-transform: scale(1);         transform: scale(1)     }     85% {         -webkit-transform: scale(0.95) translateY(1px);         transform: scale(0.95) translateY(1px)     }     100% {         -webkit-transform: scale(1);         transform: scale(1)     } }  html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {     margin: 0;     padding: 0;     border: 0;     outline: 0;     font-size: 100%;     vertical-align: baseline;     background: transparent }  body {     line-height: 1 }  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {     display: block }  nav ul {     list-style: none }  blockquote, q {     quotes: none }  blockquote:before, blockquote:after, q:before, q:after {     content: '';     content: none }  a {     margin: 0;     padding: 0;     font-size: 100%;     vertical-align: baseline;     background: transparent }  ins {     background-color: #ff9;     color: #000;     text-decoration: none }  mark {     background-color: #ff9;     color: #000;     font-style: italic;     font-weight: bold }  del {     text-decoration: line-through }  abbr[title], dfn[title] {     border-bottom: 1px dotted;     cursor: help }  table {     border-collapse: collapse;     border-spacing: 0 }  hr {     display: block;     height: 1px;     border: 0;     border-top: 1px solid #cccccc;     margin: 1em 0;     padding: 0 }  input, select {     vertical-align: middle }  button {     margin: 0;     padding: 0;     text-transform: none;     -webkit-appearance: button;     cursor: pointer;     overflow: visible;     background-color: transparent;     background-image: none;     border: 1px solid transparent;     outline: none }  @font-face {     font-family: 'Arial Black';     src: url("fonts/hinted-subset-Arial-Black.woff2") format("woff2"), url("fonts/hinted-subset-Arial-Black.woff") format("woff"), url("fonts/hinted-subset-Arial-Black.ttf") format("truetype");     font-weight: 900;     font-style: normal }  @font-face {     font-family: 'Arial Black';     src: url("fonts/hinted-subset-Arial-BlackItalic.woff2") format("woff2"), url("fonts/hinted-subset-Arial-BlackItalic.woff") format("woff"), url("fonts/hinted-subset-Arial-BlackItalic.ttf") format("truetype");     font-weight: 900;     font-style: italic }  body {     font-size: 14px;     font-family: 'Arial', 'sans-serif';     color: #fff }  @media (min-width: 1024px) {     body {         font-size: 16px     } }  strong {     font-weight: 700 }  a {     color: inherit;     text-decoration: none }  html {     -webkit-box-sizing: border-box;     box-sizing: border-box;     background: #003F72 center top fixed no-repeat;     background-size: cover }  @media (max-width: 767px) {     html {         background-image: url(images/bg-pattern-mobile.jpg)     } }  @media (min-width: 768px) {     html {         background-image: url(images/bg-pattern.jpg)     } }  *, *:before, *:after {     -webkit-box-sizing: inherit;     box-sizing: inherit }  .page-wrapper {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-orient: vertical;     -webkit-box-direction: normal;     -ms-flex-direction: column;     flex-direction: column;     min-height: 100vh;     -webkit-transition: .3s;     -o-transition: .3s;     transition: .3s;     position: relative;     -webkit-font-smoothing: subpixel-antialiased }  .page-content {     position: relative;     -webkit-box-flex: 1;     -ms-flex: 1 0 auto;     flex: 1 0 auto;     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-orient: vertical;     -webkit-box-direction: normal;     -ms-flex-direction: column;     flex-direction: column }  @media (min-width: 1024px) {     .page-content {         min-height: calc(100vh - 80px)     } }  .page-content__main {     -webkit-box-flex: 1;     -ms-flex: 1 0 auto;     flex: 1 0 auto;     text-align: center;     padding: 25px 0 25px }  @media (min-width: 1024px) {     .page-content__main {         padding: 40px 0 35px     } }  .page-content__main--centered {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center;     -webkit-box-orient: horizontal;     -webkit-box-direction: normal;     -ms-flex-direction: row;     flex-direction: row }  .page-content__main--landing {     margin: -30px 0;     background: top center no-repeat;     background-size: auto 100% }  @media (max-width: 767px) {     .page-content__main--landing {         background-image: url(images/landing-foreground.png)     } }  @media (min-width: 768px) {     .page-content__main--landing {         background-image: url(images/landing-foreground.png)     } }  @media (min-width: 1024px) {     .page-content__main--landing {         margin: -40px 0     } }  .page-content__video {     -webkit-box-flex: 1;     -ms-flex: 1 0 auto;     flex: 1 0 auto }  .page-content__inner {     max-width: 100%;     margin: 0 auto }  .page-content__tray {     margin: 0 auto;     text-align: center;     -webkit-box-flex: 0;     -ms-flex: none;     flex: none }  .page-content__tray .btn {     min-width: 260px }  .page-content__tray-link {     margin-top: 15px;     font-size: 12px;     font-weight: bold }  .page-content__tray-link a {     display: inline-block;     padding: 5px 10px;     color: #003F72 }  .page-content--tour .page-content__tray, .page-content--stadium-landing .page-content__tray {     width: 100%;     background: #fff;     padding: 15px 0 }  @media (min-width: 1024px) {     .page-content--tour .page-content__tray, .page-content--stadium-landing .page-content__tray {         padding: 20px 0     } }  .page-content--course-module {     min-height: 100vh;     padding: 0 }  .page-content--course-module .page-content__main {     position: relative;     padding: 0 }  .page-content--course-module .page-content__tray {     background: #fff;     width: 100%;     padding: 15px 0 }  @media (min-width: 1024px) {     .page-content--course-module .page-content__tray {         padding: 20px 0     } }  @media (min-width: 1024px) {     .page-content--course {         min-height: calc(100vh - 130px)     } }  .page-content--stadium:not(.type-551), .page-content--stadium-goal {     background: center bottom no-repeat;     background-size: 100% auto }  @media (max-width: 767px) {     .page-content--stadium:not(.type-551), .page-content--stadium-goal {         background-image: url(images/stadium-mobile.png)     } }  @media (min-width: 768px) {     .page-content--stadium:not(.type-551), .page-content--stadium-goal {         background-image: url(images/stadium.png);         background-position: center bottom -3vh     } }  .page-content--stadium::before, .page-content--stadium-goal::before {     content: "";     position: absolute;     z-index: -1;     left: 0;     top: 0;     right: 0;     bottom: 0;     background: -webkit-gradient(linear, left top, left bottom, from(#0178c2), to(#98c8e6));     background: -o-linear-gradient(top, #183e6e, #98c8e6);     background: linear-gradient(to bottom, #183e6e, #98c8e6) }  @media (max-width: 767px) {     .page-content--stadium-goal {         background-image: url(images/stadium-goal-mobile.png)     } }  @media (min-width: 768px) {     .page-content--stadium-goal {         background-image: url(images/stadium-goal.png)     } }  .page-content--stadium-landing {     background: center 20vh no-repeat;     background-size: cover }  @media (max-width: 767px) {     .page-content--stadium-landing {         background-image: url(images/mobile-landing-stadium.png)     } }  @media (min-width: 768px) {     .page-content--stadium-landing {         background-position: center 15vh;         background-image: url(images/desktop-landing-stadium.png);         background-position: center bottom     } }  .page-content--quiz .page-content__tray {     width: 75%;     max-width: 300px }  @media (min-width: 768px) {     .page-content--quiz .page-content__tray {         max-width: 500px     } }  .page-content--results .page-content__inner {     max-width: 500px }  .btn {     display: inline-block;     text-align: center;     vertical-align: middle;     cursor: pointer;     background: none;     border: 1px solid transparent;     border-radius: 9px;     white-space: normal;     padding: 0 10px;     padding: 7px 15px;     min-width: 180px;     line-height: 23px;     -ms-touch-action: manipulation;     touch-action: manipulation;     -webkit-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 15px;     letter-spacing: 1px;     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);     -webkit-transition: all 0.2s ease-in-out;     -o-transition: all 0.2s ease-in-out;     transition: all 0.2s ease-in-out;     outline: none }  .btn strong {     font-weight: 900 }  @media (min-width: 1024px) {     .btn {         font-size: 24px;         line-height: 33px;         padding: 7px 15px     } }  .btn--sm {     padding: 5px 15px }  .btn--md {     font-size: 14px;     padding: 2px 7px }  .btn--lg {     font-size: 24px;     line-height: 33px;     padding: 7px 25px }  @media (min-width: 1024px) {     .btn--sm {         font-size: 16px;         line-height: 23px;         padding: 5px 15px     }      .btn--md {         font-size: 18px;         line-height: 26px;         padding: 5px 10px     } }  .btn--block {     display: block;     width: 100% }  .btn--bounce {     -webkit-animation: bounce 2s infinite;     animation: bounce 2s infinite }  .btn--primary {     color: #fff;     background-color: #14c086;     border-color: #38e2a9;     -webkit-box-shadow: 0 4px 0 0 #1a946b, inset 0 2px 0 0 rgba(255, 255, 255, 0.5);     box-shadow: 0 4px 0 0 #1a946b, inset 0 2px 0 0 rgba(255, 255, 255, 0.5) }  .btn--primary:hover {     color: #fff;     background-color: #15ce90 }  .btn--primary.btn--sm, .btn--primary.btn--md {     -webkit-box-shadow: 0 3px 0 0 #1a946b, inset 0 1px 0 0 rgba(255, 255, 255, 0.5);     box-shadow: 0 3px 0 0 #1a946b, inset 0 1px 0 0 rgba(255, 255, 255, 0.5) }  .btn--secondary {     color: #fff;     background-color: #f55058;     border-color: #ff9095;     -webkit-box-shadow: 0 4px 0 0 #df252e, inset 0 2px 0 0 rgba(255, 255, 255, 0.5);     box-shadow: 0 4px 0 0 #df252e, inset 0 2px 0 0 rgba(255, 255, 255, 0.5) }  .btn--secondary:hover {     color: #fff;     background-color: #f65e66 }  .btn--trans {     color: #fff;     background-color: transparent;     border-color: #fff;     -webkit-box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.25);     box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.25) }  .btn--trans:hover {     color: #fff;     background-color: rgba(255, 255, 255, 0.15) }  .btn--disabled, .btn[disabled] {     cursor: not-allowed;     opacity: .5 }  .btn--disabled:hover, .btn--disabled:focus, .btn[disabled]:hover, .btn[disabled]:focus {     color: inherit;     background-color: inherit }  .form-control {     display: block;     position: relative;     width: 100%;     height: 36px;     padding: 8px 15px 5px;     font-size: 14px;     font-weight: normal;     font-family: 'Arial', 'sans-serif';     line-height: 1.428;     color: #353535;     background-color: #fff;     border: none;     border-radius: 9px;     -webkit-box-shadow: inset 0 2px 0 0 rgba(0, 0, 0, 0.25);     box-shadow: inset 0 2px 0 0 rgba(0, 0, 0, 0.25);     outline: 0 }  @media (min-width: 1366px) {     .form-control {         font-size: 16px;         height: 46px;         padding: 13px 20px 10px     } }  .form-control[type="email"] {     text-transform: none }  textarea.form-control {     height: auto !important;     text-transform: none }  .form-control::-webkit-input-placeholder {     color: #bec0c2;     font-weight: normal;     opacity: 1 }  .form-control::-moz-placeholder {     color: #bec0c2;     font-weight: normal }  .form-control:-ms-input-placeholder {     color: #bec0c2;     font-weight: normal;     opacity: 1 }  .form-control:-moz-placeholder {     color: #bec0c2;     font-weight: normal;     opacity: 1 }  .form-group {     position: relative;     margin-bottom: 14px }  .form-group label {     display: block;     margin-bottom: 10px }  .form-group--btn {     margin: 20px 0;     text-align: center }  .icon {     vertical-align: middle;     display: inline-block;     position: relative;     fill: currentColor;     -webkit-transition: color .2s ease-out;     -o-transition: color .2s ease-out;     transition: color .2s ease-out;     width: 30px;     height: 30px;     line-height: 1 }  .container, .container-outer {     margin-right: auto;     margin-left: auto;     padding-left: 10px;     padding-right: 10px;     min-width: 320px }  .container-fluid, .container-fluid-outer {     margin-right: auto;     margin-left: auto;     padding-left: 10px;     padding-right: 10px }  @media (max-width: 767px) {     .container, .container-outer {         max-width: 360px     } }  @media (min-width: 768px) {     .container {         width: 640px     }      .container-outer {         width: 700px;         padding-left: 40px;         padding-right: 40px     }      .container-fluid-outer {         padding-left: 40px;         padding-right: 40px     } }  @media (min-width: 1024px) {     .container {         width: 960px     }      .container-outer {         width: 1020px     } }  @media (min-width: 1366px) {     .container {         width: 1280px     }      .container-outer {         width: 1340px     } }  @media (min-width: 1600px) {     .container {         width: 1360px     }      .container-outer {         width: 1420px     } }  .row {     margin-left: -10px;     margin-right: -10px }  .col {     position: relative;     min-height: 1px;     padding-left: 10px;     padding-right: 10px }  .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {     position: relative;     min-height: 1px;     padding-left: 10px;     padding-right: 10px }  .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {     float: left }  .col-xs-12 {     width: 100% }  .col-xs-11 {     width: 91.66666667% }  .col-xs-10 {     width: 83.33333333% }  .col-xs-9 {     width: 75% }  .col-xs-8 {     width: 66.66666667% }  .col-xs-7 {     width: 58.33333333% }  .col-xs-6 {     width: 50% }  .col-xs-5 {     width: 41.66666667% }  .col-xs-4 {     width: 33.33333333% }  .col-xs-3 {     width: 25% }  .col-xs-2 {     width: 16.66666667% }  .col-xs-1 {     width: 8.33333333% }  @media (min-width: 768px) {     .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {         float: left     }      .col-sm-12 {         width: 100%     }      .col-sm-11 {         width: 91.66666667%     }      .col-sm-10 {         width: 83.33333333%     }      .col-sm-9 {         width: 75%     }      .col-sm-8 {         width: 66.66666667%     }      .col-sm-7 {         width: 58.33333333%     }      .col-sm-6 {         width: 50%     }      .col-sm-5 {         width: 41.66666667%     }      .col-sm-4 {         width: 33.33333333%     }      .col-sm-3 {         width: 25%     }      .col-sm-2 {         width: 16.66666667%     }      .col-sm-1 {         width: 8.33333333%     } }  @media (min-width: 1024px) {     .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {         float: left     }      .col-md-12 {         width: 100%     }      .col-md-11 {         width: 91.66666667%     }      .col-md-10 {         width: 83.33333333%     }      .col-md-9 {         width: 75%     }      .col-md-8 {         width: 66.66666667%     }      .col-md-7 {         width: 58.33333333%     }      .col-md-6 {         width: 50%     }      .col-md-5 {         width: 41.66666667%     }      .col-md-4 {         width: 33.33333333%     }      .col-md-3 {         width: 25%     }      .col-md-2 {         width: 16.66666667%     }      .col-md-1 {         width: 8.33333333%     } }  @media (min-width: 1366px) {     .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {         float: left     }      .col-lg-12 {         width: 100%     }      .col-lg-11 {         width: 91.66666667%     }      .col-lg-10 {         width: 83.33333333%     }      .col-lg-9 {         width: 75%     }      .col-lg-8 {         width: 66.66666667%     }      .col-lg-7 {         width: 58.33333333%     }      .col-lg-6 {         width: 50%     }      .col-lg-5 {         width: 41.66666667%     }      .col-lg-4 {         width: 33.33333333%     }      .col-lg-3 {         width: 25%     }      .col-lg-2 {         width: 16.66666667%     }      .col-lg-1 {         width: 8.33333333%     } }  .clearfix:before, .clearfix:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after {     content: " ";     display: table }  .clearfix:after, .container:after, .container-fluid:after, .row:after {     clear: both }  @media (min-width: 768px) {     .row--flex {         display: -webkit-box;         display: -ms-flexbox;         display: flex;         -ms-flex-wrap: wrap;         flex-wrap: wrap     }      .row--flex:after, .row--flex:before {         display: -webkit-box;         display: -ms-flexbox;         display: flex     }      .row--flex > [class^='col-'] {         display: -webkit-box;         display: -ms-flexbox;         display: flex;         -webkit-box-orient: vertical;         -webkit-box-direction: normal;         -ms-flex-direction: column;         flex-direction: column;         -webkit-box-pack: center;         -ms-flex-pack: center;         justify-content: center     }      .row--flex > [class^='col-'] > img {         -ms-flex-negative: 0;         flex-shrink: 0     } }  .col-fixed-300 {     float: left;     width: 320px }  .row--article .col-1 {     margin: 0 auto }  .row--profile .col-1 {     margin: 0 auto }  @media (min-width: 768px) {     .row--article .col-1 {         max-width: 640px     }      .row--profile .col-1 {         max-width: 640px     } }  @media (min-width: 1024px) {     .row--article .col-1 {         max-width: 820px     }      .row--profile .col-1 {         max-width: 720px     }      .row--course {         margin-left: -25px;         margin-right: -25px     }      .row--course .col-1, .row--course .col-2 {         float: left;         padding-left: 25px;         padding-right: 25px     }      .row--course .col-2 {         width: 62%;         right: 38%     }      .row--course .col-1 {         width: 38%;         left: 62%     }      .row--blog {         margin-left: -25px;         margin-right: -25px     }      .row--blog .col-1, .row--blog .col-2 {         float: left;         padding-left: 25px;         padding-right: 25px     }      .row--blog .col-1 {         width: 58.33333333%     }      .row--blog .col-1 .col-inner {         max-width: 600px;         margin: 0 auto     }      .row--blog .col-2 {         width: 41.66666667%     }      .row--blog .col-2 .col-inner {         max-width: 300px;         margin-left: auto     } }  @media (min-width: 1366px) {     .row--course .col-2 {         width: 66.66666667%;         right: 33.333333333%     }      .row--course .col-1 {         width: 33.33333333%;         left: 66.66666667%     }      .row--blog .col-1 {         width: 66.66666667%     }      .row--blog .col-2 {         width: 33.33333333%     } }  h1, .h1 {     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 24px;     line-height: 1.25;     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) }  h1 strong, .h1 strong {     font-weight: 900 }  h2, .h2 {     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 24px;     line-height: 1.42;     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) }  h2 strong, .h2 strong {     font-weight: 900 }  h3, .h3 {     font-size: 18px;     font-weight: 700;     line-height: 1.42;     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) }  h4, .h4 {     font-size: 16px;     font-weight: normal }  h5, .h5 {     font-size: 14px;     font-weight: 600 }  h6, .h6 {     font-size: 12px;     font-weight: normal }  p {     line-height: 1.33 }  p.intro {     font-size: 18px;     font-weight: 300;     line-height: 1.416 }  small {     font-size: 12px }  .font-light {     font-weight: 300 }  .font-normal {     font-weight: normal }  .font-semibold {     font-weight: 600 }  .font-bold {     font-weight: 700 }  .lowercase {     text-transform: none }  @media (min-width: 1024px) {     h1, .h1 {         font-size: 48px;         text-shadow: 0 -2px 0 rgba(0, 0, 0, 0.25)     }      h2, .h2 {         font-size: 30px;         line-height: 1.13;         text-shadow: 0 -2px 0 rgba(0, 0, 0, 0.25)     }      h3, .h3 {         font-size: 24px     }      h4, .h4 {         font-size: 16px     }      h5, .h5 {         font-size: 14px     }      h6, .h6 {         font-size: 12px     }      p.intro {         font-size: 24px     } }  .rte {     line-height: 1.38 }  .rte > *:first-child {     margin-top: 0 }  .rte h2 {     margin: 1em 0 .75em }  .rte h3 {     margin: 1.5em 0 1em }  .rte p {     margin: 1.5em 0;     line-height: 1.625 }  .rte p.intro {     line-height: 1.416 }  .rte a {     color: #fff;     font-weight: bold }  .rte ul, .rte ol {     margin: 1.5em 0;     margin-left: 20px }  .rte ul li, .rte ol li {     padding-left: .5em;     margin-bottom: .5em }  .rte img {     margin: 1.5em 0 }  .video {     position: relative }  .video video {     background: #000 }  .video video::-webkit-media-controls-start-playback-button {     display: none !important;     -webkit-appearance: none }  .video__play-btn {     cursor: pointer;     position: absolute;     top: 50%;     left: 50%;     margin-left: -20px;     margin-top: -20px;     opacity: 0;     -webkit-transition: opacity .2s ease-out;     -o-transition: opacity .2s ease-out;     transition: opacity .2s ease-out }  @media (min-width: 1024px) {     .video__play-btn {         margin-left: -40px;         margin-top: -40px     }      .video__play-btn .icon svg {         width: 80px;         height: 80px     } }  .video__play-btn.is-active {     opacity: 1 }  .video-iframe {     position: relative;     padding-bottom: 56.25% }  .video-iframe iframe {     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100% }  .notification-bar {     position: relative;     padding: 9px 35px 9px 10px;     color: #353535;     text-align: left;     background-color: #fff;     border-radius: 10px;     margin-bottom: 15px }  @media (min-width: 1024px) {     .notification-bar {         padding: 13px 35px 13px 10px     } }  .notification-bar--success {     border: solid 1px #14c086;     -webkit-box-shadow: 0 4px 0 0 #14c086;     box-shadow: 0 4px 0 0 #14c086 }  .notification-bar--warning {     border: solid 1px #ffaa0f;     -webkit-box-shadow: 0 4px 0 0 #ffaa0f;     box-shadow: 0 4px 0 0 #ffaa0f }  .notification-bar--error {     border: solid 1px #df252e;     -webkit-box-shadow: 0 4px 0 0 #df252e;     box-shadow: 0 4px 0 0 #df252e }  .notification-bar__icon {     float: left;     margin-right: 10px }  .notification-bar__icon .icon {     width: 20px;     height: 20px }  .notification-bar p {     font-size: 12px;     line-height: 16px;     padding: 2px 0;     margin-left: 30px }  .notification-bar__close {     cursor: pointer;     position: absolute;     right: 5px;     top: 6px;     padding: 5px 10px;     color: #bec0c2 }  @media (min-width: 1024px) {     .notification-bar__close {         top: 10px     } }  .notification-bar__close .icon {     width: 10px;     height: 10px }  .custom-select {     position: relative;     margin-bottom: 21px }  .custom-select select {     cursor: pointer;     width: 100%;     height: 100%;     position: absolute;     z-index: 1;     left: 0;     top: 0;     opacity: 0;     font-size: 14px;     font-weight: 300;     color: #353535;     padding: 5px 15px }  .custom-select__value {     -webkit-transition: .2s;     -o-transition: .2s;     transition: .2s;     background-color: #fff;     padding: 12px 60px 12px 20px;     color: #353535;     text-align: left;     font-size: 16px;     line-height: 1.38;     border-radius: 10px;     -webkit-box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.12);     box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.12) }  .custom-select__arrow {     display: block;     height: 100%;     width: 60px;     position: absolute;     right: 0;     top: 0;     text-align: center;     color: #4d4d4f }  .custom-select__arrow .icon {     width: 20px;     height: 20px;     top: 14px }  .multiselect-parent {     position: relative }  .multiselect-parent .multiselect__btn {     display: block;     position: relative;     width: 100%;     border: none;     -webkit-transition: .2s;     -o-transition: .2s;     transition: .2s;     background-color: #fff;     padding: 12px 60px 12px 20px;     color: #353535;     text-align: left;     font-size: 16px;     line-height: 1.38;     border-radius: 10px;     -webkit-box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.12);     box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.12) }  .multiselect-parent .multiselect__btn .caret {     position: absolute;     right: 20px;     top: 14px;     border: none;     width: 20px;     height: 20px;     background: url(images/chevron-down.svg) no-repeat }  .multiselect-parent.open .dropdown-menu {     display: block }  .multiselect-parent .dropdown-menu {     display: none;     position: absolute;     top: 100%;     width: 100%;     z-index: 1000;     list-style-type: none;     margin: 4px 0 0;     padding: 7px 0;     border-radius: 0 0 10px 10px;     background: #fff;     -webkit-box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.12);     box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.12) }  .multiselect-parent .dropdown-menu li {     margin: 0;     color: #353535;     padding: 7px 20px }  .multiselect-parent .dropdown-menu li.divider {     padding: 0;     margin: 5px 0;     height: 1px;     background: #e0e2e4 }  .multiselect-parent .option {     outline: none }  .multiselect-parent .option label {     display: block;     clear: both;     position: relative;     padding: 0;     cursor: pointer;     text-align: left }  .multiselect-parent .option label:before, .multiselect-parent .option label:after {     content: '';     display: table;     clear: both }  .multiselect-parent .option label input[type=checkbox] {     visibility: hidden;     position: absolute;     left: 0 }  .multiselect-parent .option label > span {     display: block;     position: relative;     margin: 0;     padding-right: 34px;     line-height: 20px }  .multiselect-parent .option label > span::before {     content: "";     position: absolute;     right: 0;     height: 20px;     width: 20px;     vertical-align: middle;     cursor: pointer;     background: url(images/tickbox_off.svg) 0 0 no-repeat;     background-size: cover;     border-radius: 4px }  .multiselect-parent .option label > input[type=checkbox]:checked + span::before {     background-image: url(images/tickbox_on.svg) }  #multiBranch .dropdown-menu li:first-child label span {     font-weight: bold }  [data-tooltip], .tooltip {     position: relative;     cursor: pointer }  [data-tooltip]:before, [data-tooltip]:after, .tooltip:before, .tooltip:after {     position: absolute;     visibility: hidden;     filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);     opacity: 0;     -webkit-transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);     transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);     -o-transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);     transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);     transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24), -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);     -webkit-transform: translate3d(0, 0, 0);     transform: translate3d(0, 0, 0);     pointer-events: none }  [data-tooltip]:hover:before, [data-tooltip]:hover:after, [data-tooltip]:focus:before, [data-tooltip]:focus:after, .tooltip:hover:before, .tooltip:hover:after, .tooltip:focus:before, .tooltip:focus:after {     visibility: visible;     filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);     opacity: 1 }  .tooltip:before, [data-tooltip]:before {     z-index: 1001;     border: 12px solid transparent;     background: transparent;     content: "" }  .tooltip:after, [data-tooltip]:after {     z-index: 1000;     padding: 6px;     width: 160px;     background-color: #02548c;     color: #fff;     content: attr(data-tooltip);     font-size: 16px;     line-height: 1.38;     text-align: center;     border-radius: 10px }  [data-tooltip]:before, [data-tooltip]:after, .tooltip:before, .tooltip:after, .tooltip--top:before, .tooltip--top:after {     bottom: 130%;     left: 50% }  [data-tooltip]:before, .tooltip:before, .tooltip--top:before {     margin-left: -12px;     margin-bottom: -24px;     border-top-color: #02548c }  [data-tooltip]:after, .tooltip:after, .tooltip--top:after {     margin-left: -80px }  [data-tooltip]:hover:before, [data-tooltip]:hover:after, [data-tooltip]:focus:before, [data-tooltip]:focus:after, .tooltip:hover:before, .tooltip:hover:after, .tooltip:focus:before, .tooltip:focus:after, .tooltip--top:hover:before, .tooltip--top:hover:after, .tooltip--top:focus:before, .tooltip--top:focus:after {     -webkit-transform: translateY(-12px);     -ms-transform: translateY(-12px);     transform: translateY(-12px) }  .tooltip--bottom:before, .tooltip--bottom:after {     top: 75%;     bottom: auto;     left: 50% }  .tooltip--bottom:before {     margin-top: -11.5px;     margin-bottom: 0;     border-top-color: transparent;     border-bottom-color: #157261 }  .tooltip--bottom:hover:before, .tooltip--bottom:hover:after, .tooltip--bottom:focus:before, .tooltip--bottom:focus:after {     -webkit-transform: translateY(12px);     -ms-transform: translateY(12px);     transform: translateY(12px) }  .header {     display: none;     padding: 18px 15px;     background: #4d4d4f;     position: relative;     z-index: 10 }  .header:before, .header:after {     content: '';     display: table;     clear: both }  .header__logo {     float: left;     width: auto;     height: 24px }  .header__user {     display: none;     float: right;     cursor: pointer;     position: relative }  @media (min-width: 768px) {     .header {         display: block;         padding: 20px 20px     }      .header__logo {         height: 37px;         margin: 2px 0 1px     }      .header__user {         display: block     }      .header__user:before, .header__user:after {         content: '';         display: table;         clear: both     }      .header__user-name {         float: left;         padding: 10px 0;         line-height: 20px     }      .header__user-pic {         float: left;         margin-left: 20px;         height: 40px;         width: 40px;         border-radius: 50%     }      .header__user-pic img {         width: 100%;         height: auto     }      .header__user-logout {         display: none;         position: absolute;         padding: 14px 20px;         right: 0;         top: calc(100% + 8px);         width: 200px;         background: #fff;         -webkit-box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.12);         box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.12);         border-radius: 10px     }      .header__user-logout::before {         content: "";         position: absolute;         top: -6px;         right: 15px;         width: 0;         height: 0;         border-style: solid;         border-width: 0 5px 6px 5px;         border-color: transparent transparent #fff transparent     }      .header__user-logout a {         display: block;         font-weight: bold;         color: #353535;         line-height: 1.38     } }  .course-nav {     position: relative;     z-index: 110;     padding: 12px 0;     background: #003F72;     text-align: center;     -webkit-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);     box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);     border-bottom: 1px solid rgba(0, 0, 0, 0.1) }  .course-nav__back {     margin: 0 auto;     max-width: 600px;     text-align: left }  .course-nav__back a {     display: inline-block;     text-transform: uppercase;     font-size: 11px;     font-weight: bold;     line-height: 24px;     padding-right: 10px }  .course-nav__back a .icon {     position: relative;     top: -1px;     width: 20px;     height: 20px;     margin-right: 5px;     -webkit-transform: rotate(-180deg);     -ms-transform: rotate(-180deg);     transform: rotate(-180deg) }  @media (min-width: 1024px) {     .course-nav__back a {         font-size: 14px;         line-height: 26px     } }  .course-nav ul {     margin: -12px auto;     max-width: 600px;     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-pack: justify;     -ms-flex-pack: justify;     justify-content: space-between }  .course-nav ul li {     margin: 0;     display: inline-block;     font-size: 11px;     font-weight: 700;     text-transform: uppercase;     line-height: 12px }  .course-nav ul li:first-child {     margin-left: 0 }  .course-nav ul li:last-child {     margin-right: 0 }  .course-nav ul li a {     display: inline-block;     position: relative;     padding: 18px 10px;     color: #fff;     border-radius: 6px;     -webkit-transition: .3s ease;     -o-transition: .3s ease;     transition: .3s ease }  @media (min-width: 1024px) {     .course-nav ul li a {         padding: 15px 10px     } }  .course-nav ul li a::after {     content: "";     position: absolute;     bottom: 0;     left: 0;     width: 0;     height: 2px;     background: #fff;     -webkit-transition: width .25s ease;     -o-transition: width .25s ease;     transition: width .25s ease }  .course-nav ul li a.new::before {     content: "";     position: absolute;     right: 0;     top: 13px;     width: 7px;     height: 7px;     border-radius: 50%;     background: #ffaa0f }  .course-nav ul li.is-active a::after, .course-nav ul li:hover a::after, .course-nav ul li:focus a::after {     width: 100% }  @media (min-width: 1024px) {     .course-nav ul li {         font-size: 14px;         line-height: 20px     }      .course-nav ul li:nth-child(3) {         margin-right: 5px     }      .course-nav ul li:last-child {         display: inline-block     } }  .login__head {     display: block;     display: block;     height: auto;     max-width: 100%;     max-height: 180px;     margin: 0 auto;     margin-top: -20px }  @media (min-width: 1024px) {     .login__head {         margin-bottom: 40px     } }  .login h1 {     margin-bottom: 28px }  .login__form {     max-width: 360px;     margin: 0 auto 35px;     text-align: left }  .tour {     padding-top: 10px }  @media (min-width: 1024px) {     .tour {         padding-top: 50px     } }  .tour__img {     min-height: 30vh;     margin: 0 auto 20px;     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-orient: vertical;     -webkit-box-direction: normal;     -ms-flex-direction: column;     flex-direction: column;     -webkit-box-pack: center;     -ms-flex-pack: center;     justify-content: center }  .tour__img > * {     -webkit-box-flex: 0;     -ms-flex: none;     flex: none }  .tour__img > img {     display: block;     max-width: 100%;     height: auto;     margin-left: auto;     margin-right: auto }  @media (min-width: 768px) {     .tour__img {         max-width: 520px;         height: 310px     } }  .tour__img--small {     max-width: 165px }  @media (min-width: 1024px) {     .tour__img--small {         max-width: 330px     } }  .tour h1 {     margin: 0 auto 15px;     margin-bottom: 15px }  @media (min-width: 1024px) {     .tour h1 {         margin-bottom: 30px;         max-width: 680px     } }  .course-intro__head {     display: block;     height: auto;     max-width: 100%;     max-height: 180px;     margin: 0 auto;     display: none }  @media (min-width: 1024px) {     .course-intro__head {         margin-bottom: 40px     } }  @media (min-width: 768px) {     .course-intro__head {         display: block     } }  @media (min-width: 1024px) {     .course-intro h1 {         margin-bottom: 20px     } }  .course-overview h1 {     margin-bottom: 8px }  .course-overview__img {     margin: 20px auto 15px }  @media (min-width: 768px) {     .course-overview__img {         max-width: none;         margin: 30px auto 20px     } }  .course-progress h1 {     margin: 0 0 25px }  @media (min-width: 1024px) {     .course-progress h1 {         margin: 25px 0 50px     } }  .course-leaderboard h1 {     margin: 0 0 25px }  @media (min-width: 1024px) {     .course-leaderboard h1 {         margin: 0 0 50px     } }  .course-leaderboard__switch {     position: relative;     padding: 2px 2px 5px;     margin: 0 -0 21px;     background: #fff;     border-radius: 10px;     border: 1px solid #e0e2e4 }  .course-leaderboard__switch:before, .course-leaderboard__switch:after {     content: '';     display: table;     clear: both }  .course-leaderboard__switch-col {     float: left;     width: 50% }  .course-leaderboard__switch-btn {     position: relative;     display: block;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 14px;     color: #003F72;     line-height: 19px;     text-align: center;     padding: 11px 10px;     height: 40px }  .course-leaderboard__switch-btn strong {     font-weight: 900 }  .course-leaderboard__switch-btn.is-active {     color: #fff;     border-radius: 6px;     background-color: #003F72;     -webkit-box-shadow: 0 3px 0 0 #003F72, inset 0 2px 0 0 rgba(255, 255, 255, 0.5);     box-shadow: 0 3px 0 0 #003F72, inset 0 2px 0 0 rgba(255, 255, 255, 0.5);     border: solid 1px #7ad6f8 }  .tile {     display: block;     background: #fff;     outline: none }  .tile__body {     position: relative }  .tile__img {     position: relative;     height: 180px }  .tile__img--point img {     position: relative;     top: 50%;     -webkit-transform: translateY(-50%);     -ms-transform: translateY(-50%);     transform: translateY(-50%) }  .tile__tray {     padding: 14px 22px }  .tile--locked {     cursor: default }  .tile--course {     position: relative;     border-radius: 10px;     overflow: hidden }  .tile--course .tile__status {     position: absolute;     top: 10px;     right: 2px }  .tile--course .tile__status .icon {     width: 78px;     height: 78px;     -webkit-filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.4));     filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.4)) }  .tile--course .tile__notify {     padding: 8px 13px;     text-align: center;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-style: normal;     font-size: 12px;     line-height: 1.17;     color: #fff;     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);     position: absolute;     width: 200px;     -webkit-transform: rotate(-45deg);     -ms-transform: rotate(-45deg);     transform: rotate(-45deg);     -webkit-transform-origin: left top;     -ms-transform-origin: left top;     transform-origin: left top;     top: 95px;     left: -46px;     background: #f55058;     -webkit-box-shadow: inset 0 -2px 0 0 rgba(255, 255, 255, 0.5);     box-shadow: inset 0 -2px 0 0 rgba(255, 255, 255, 0.5) }  .tile--course .tile__notify strong {     font-weight: 900 }  .tile--course .tile__locked {     position: absolute;     left: 0;     right: 0;     bottom: 0;     top: 0;     background-color: rgba(25, 120, 189, 0.75) }  .tile--course .tile__locked::before {     content: "";     position: absolute;     top: 50%;     left: 50%;     width: 72px;     height: 72px;     margin-left: -36px;     margin-top: -36px;     border-radius: 50%;     background-color: rgba(0, 0, 0, 0.4) }  .tile--course .tile__locked .icon {     position: absolute;     left: 50%;     top: 50%;     margin-left: -20px;     margin-top: -20px;     width: 40px;     height: 40px }  .tile--course .tile__tray {     position: relative;     padding: 13px 13px 15px;     border-radius: 0 0 10px 10px;     -webkit-box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     background: #fff }  .tile--course .tile__tray .btn {     font-size: 18px;     line-height: 26px;     padding: 5px 10px 4px;     letter-spacing: -0.025em }  @media (min-width: 768px) {     .tile--course .tile__tray .btn {         font-size: 16px     } }  .tile--course .tile__tray p {     text-align: center;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 16px;     line-height: 1.5;     color: #353535 }  .tile--course .tile__tray p strong {     font-weight: 900 }  @media (min-width: 768px) {     .tile--course .tile__tray p {         line-height: 37px     } }  .tile--course .tile__tray .course-levels {     float: right }  .module-tile {     display: block;     background: #fff;     padding: 10px;     margin-bottom: 20px }  .module-tile__body {     position: relative;     text-align: center;     min-height: 180px }  .module-tile__icon {     padding: 25px 0 30px }  .module-tile__title {     font-size: 16px;     line-height: 1.33 }  .module-tile__fav {     position: absolute;     top: 0;     right: 0 }  .module-tile__fav a:hover .icon svg:last-child {     position: relative;     top: 2.5px;     right: 2.5px }  .module-bar {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -ms-flex-wrap: wrap;     flex-wrap: wrap;     text-align: left;     background: #fff;     padding: 13px 10px;     margin-top: 15px;     margin-bottom: 15px;     border-radius: 10px;     -webkit-box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74) }  @media (min-width: 768px) {     .module-bar {         padding: 13px 15px     } }  .module-bar > a {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -ms-flex-wrap: wrap;     flex-wrap: wrap;     width: 100%;     cursor: pointer }  .module-bar > a[disabled] {     cursor: default;     cursor: not-allowed }  .module-bar__notify {     -webkit-box-flex: 0;     -ms-flex: none;     flex: none;     width: calc(100% + 20px);     margin: -13px -10px 13px;     border-radius: 10px 10px 0 0;     text-align: center;     color: #fff;     text-transform: uppercase;     font-size: 12px;     line-height: 20px;     font-weight: bold;     background: #f55058 }  @media (min-width: 768px) {     .module-bar__notify {         width: calc(100% + 30px);         margin: -13px -15px 13px;         font-size: 16px;         line-height: 25px     } }  .module-bar__icon, .module-bar__text, .module-bar__tray, .module-bar__btn {     -ms-flex-item-align: center;     align-self: center }  .module-bar__icon {     margin-right: 10px }  .module-bar__icon .icon {     width: 30px;     height: 30px }  @media (min-width: 768px) {     .module-bar__icon {         margin-right: 15px     }      .module-bar__icon .icon {         width: 50px;         height: 50px     } }  .module-bar__text {     -webkit-box-flex: 1;     -ms-flex: 1;     flex: 1;     margin-right: 10px;     color: #353535 }  @media (min-width: 768px) {     .module-bar__text {         margin-right: 10px;         display: -webkit-box;         display: -ms-flexbox;         display: flex     } }  .module-bar__title {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     font-size: 16px;     line-height: 1.15;     margin: 2px 0 }  @media (min-width: 768px) {     .module-bar__title {         -webkit-box-flex: 1;         -ms-flex: 1;         flex: 1;         -ms-flex-item-align: center;         align-self: center;         font-size: 20px     } }  .module-bar__title strong {     font-weight: 900 }  .module-bar__time {     font-size: 12px;     color: #6c6d6d;     margin: 2px 0 }  @media (min-width: 768px) {     .module-bar__time {         -ms-flex-item-align: center;         align-self: center     } }  .module-bar__tray {     white-space: nowrap;     text-align: center;     min-width: 45px }  @media (min-width: 768px) {     .module-bar__tray {         min-width: 60px     } }  .module-bar__tray .progress {     display: inline-block;     vertical-align: middle;     width: 70px;     font-size: 16px;     font-weight: 300;     text-align: right }  @media (min-width: 768px) {     .module-bar__tray .progress {         width: 95px;         font-size: 24px;         margin-left: 20px     } }  .module-bar__tray .icon {     width: 30px;     height: 30px }  @media (min-width: 768px) {     .survey-done {         width: 40px;         height: 40px;     }      .module-bar__tray .icon {         width: 40px;         height: 40px     } }  .module-bar__tray .btn, .module-bar__btn .btn {     margin-top: -2px;     min-width: 48px }  @media (min-width: 768px) {     .module-bar__tray .btn, .module-bar__btn .btn {         min-width: 60px;         margin-left: 20px     } }  .module-bar--challenge {     padding-top: 8px;     padding-bottom: 8px }  .module-bar--challenge + .module-bar {     margin-top: 25px }  .module-bar--challenge .module-bar__icon {     margin-right: 10px }  .module-bar--challenge .module-bar__icon .icon {     width: 40px;     height: 40px }  .module-bar--challenge .module-bar__icon .icon-fans {     height: 40px;     width: 40px;     padding: 1px 0;     text-align: center;     background-color: #003F72;     border-radius: 6px;     -webkit-box-shadow: 0 1px 0 0 #02548c;     box-shadow: 0 1px 0 0 #02548c }  .module-bar--challenge .module-bar__icon .icon-fans .icon {     width: 20px;     height: 20px }  .module-bar--challenge .module-bar__icon .icon-fans__num {     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-style: normal;     font-size: 16px;     display: block }  .module-bar--challenge .module-bar__icon .icon-fans__num strong {     font-weight: 900 }  .module-bar--challenge .module-bar__title {     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 14px }  .module-bar--challenge .module-bar__title strong {     font-weight: 900 }  @media (min-width: 768px) {     .module-bar--challenge .module-bar__title {         font-size: 24px     } }  .module-bar--challenge .module-bar__tray .icon {     width: 30px;     height: 30px }  .module-bar--achievement .module-bar__icon .icon {     width: 40px;     height: 40px }  @media (min-width: 768px) {     .module-bar--achievement .module-bar__icon .icon {         width: 50px;         height: 50px     } }  .module-bar--achievement .module-bar__text {     -ms-flex-wrap: wrap;     flex-wrap: wrap }  .module-bar--achievement .module-bar__title {     -ms-flex-preferred-size: 100%;     flex-basis: 100%;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 14px }  .module-bar--achievement .module-bar__title strong {     font-weight: 900 }  @media (min-width: 768px) {     .module-bar--achievement .module-bar__title {         font-size: 24px     } }  @media (max-width: 767px) {     .module-bar--achievement .module-bar__text {         position: relative;         padding-top: 20px     }      .module-bar--achievement .module-bar__title {         position: absolute;         top: 0;         left: 0;         white-space: nowrap;         max-width: 230px     } }  .module-bar--achievement .module-bar__tray {     -ms-flex-item-align: end;     align-self: flex-end;     text-align: right }  .module-bar--achievement .module-bar__tray .icon-fans .icon {     width: 20px;     height: 20px }  .module-bar--achievement .module-bar__tray .icon-fans__num {     display: inline-block;     vertical-align: bottom;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 14px;     line-height: 20px;     color: #003F72;     text-align: right;     margin-right: 5px }  .module-bar--achievement .module-bar__tray .icon-fans__num strong {     font-weight: 900 }  @media (min-width: 768px) {     .module-bar--achievement .module-bar__tray {         -ms-flex-item-align: start;         align-self: flex-start;         margin-top: 2px     }      .module-bar--achievement .module-bar__tray .icon-fans .icon {         width: 30px;         height: 30px     }      .module-bar--achievement .module-bar__tray .icon-fans__num {         font-size: 24px;         line-height: 30px     } }  .module-bar--leaderboard {     padding-top: 8px;     padding-bottom: 8px;     padding-left: 8px;     margin-top: 10px;     margin-bottom: 10px }  .module-bar--leaderboard .module-bar__icon {     position: relative;     margin-right: 4px;     width: 27px }  .module-bar--leaderboard .module-bar__icon .icon {     width: 27px;     height: 27px }  .module-bar--leaderboard .module-bar__text {     -ms-flex-wrap: wrap;     flex-wrap: wrap }  .module-bar--leaderboard .module-bar__title {     -ms-flex-preferred-size: 100%;     flex-basis: 100%;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 14px }  .module-bar--leaderboard .module-bar__title strong {     font-weight: 900 }  .module-bar--leaderboard .module-bar__tray {     -ms-flex-item-align: end;     align-self: flex-end }  .module-bar--leaderboard .module-bar__tray .icon-fans .icon {     width: 20px;     height: 20px }  .module-bar--leaderboard .module-bar__tray .icon-fans__num {     margin-left: 5px;     display: inline-block;     vertical-align: middle;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 24px;     line-height: 34px;     color: #003F72 }  .module-bar--leaderboard .module-bar__tray .icon-fans__num strong {     font-weight: 900 }  .module-bar--leaderboard.is-active {     background-color: #ffaa0f;     -webkit-box-shadow: 0 4px 0 0 #e68f00;     box-shadow: 0 4px 0 0 #e68f00 }  .module-bar--leaderboard.is-active .module-bar__title, .module-bar--leaderboard.is-active .module-bar__tray .icon-fans__num {     color: #fff }  .module-bar--disabled {     background: rgba(255, 255, 255, 0.75) }  .module-progress {     text-align: left;     padding: 35px 0 5px;     margin-bottom: 15px }  @media (min-width: 768px) {     .module-progress {         padding: 45px 0 15px;         margin-bottom: 35px     } }  .module-progress__icon, .module-progress__text, .module-progress__tray {     -ms-flex-item-align: center;     align-self: center }  .module-progress__icon {     margin-right: 5px }  .module-progress__icon .icon {     width: 40px;     height: 40px }  @media (min-width: 768px) {     .module-progress__icon {         margin-right: 10px     }      .module-progress__icon .icon {         width: 60px;         height: 60px     } }  .module-progress__graph {     position: relative;     height: 45px }  .module-progress__graph-track {     z-index: 20;     position: relative;     height: 20px;     background-color: rgba(0, 0, 0, 0.15);     -webkit-box-shadow: 0 3px 0 0 #0c324b;     box-shadow: 0 3px 0 0 #0c324b;     border-radius: 10px;     overflow: hidden }  @media (min-width: 768px) {     .module-progress__graph-track {         height: 30px;         border-radius: 15px     } }  .module-progress__graph-fill-target {     position: absolute;     left: 0;     height: 100%;     background-color: rgba(0, 0, 0, 0.2);     -webkit-transition: width .2s ease-out;     -o-transition: width .2s ease-out;     transition: width .2s ease-out }  .module-progress__graph-fill-actual {     position: absolute;     left: 0;     height: 100%;     background-color: #14c086;     -webkit-box-shadow: 0 3px 0 0 #0c324b;     box-shadow: 0 3px 0 0 #0c324b;     border-radius: 10px 0 0 10px }  @media (min-width: 768px) {     .module-progress__graph-fill-actual {         border-radius: 15px 0 0 15px     } }  .module-progress__graph-fill-actual.is-fail {     background-color: #f55058 }  .module-progress__graph-score, .module-progress__graph-target, .module-progress__graph-max {     z-index: 30;     position: absolute;     top: 30px;     left: 0;     font-size: 12px;     text-transform: uppercase;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     letter-spacing: normal }  .module-progress__graph-score strong, .module-progress__graph-target strong, .module-progress__graph-max strong {     font-weight: 900 }  .module-progress__graph-score strong, .module-progress__graph-target strong, .module-progress__graph-max strong {     position: absolute;     left: 0;     top: -30px;     font-style: normal;     font-size: 16px;     line-height: 20px }  @media (min-width: 768px) {     .module-progress__graph-score, .module-progress__graph-target, .module-progress__graph-max {         top: 40px;         font-size: 14px     }      .module-progress__graph-score strong, .module-progress__graph-target strong, .module-progress__graph-max strong {         top: -35px;         font-size: 18px     } }  .module-progress__graph-score {     left: 10px }  @media (min-width: 768px) {     .module-progress__graph-score {         left: 15px     } }  .module-progress__graph-target {     z-index: 10;     padding-right: 5px }  .module-progress__graph-target::after {     content: "";     position: absolute;     bottom: 25px;     left: 0;     height: 20px;     width: 1px;     background: rgba(255, 255, 255, 0.28) }  @media (min-width: 768px) {     .module-progress__graph-target::after {         bottom: 28px;         height: 30px     } }  .module-progress__graph-target__text {     -webkit-transform: translateX(-50%);     -ms-transform: translateX(-50%);     transform: translateX(-50%) }  .module-progress__graph-target__bubble {     position: absolute;     -webkit-transform: translateX(-50%);     -ms-transform: translateX(-50%);     transform: translateX(-50%);     bottom: 55px;     padding: 0 5px 1px 25px;     font-style: normal;     font-size: 16px;     line-height: 21px;     white-space: nowrap;     background-color: #003F72;     -webkit-box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.3);     box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.3);     border-radius: 11px }  .module-progress__graph-target__bubble::after {     content: "";     position: absolute;     top: 100%;     left: 50%;     margin-left: -5px;     width: 0;     height: 0;     border-style: solid;     border-width: 5px 5px 0 5px;     border-color: #003F72 transparent transparent transparent }  .module-progress__graph-target__bubble .icon {     position: absolute;     left: 0;     top: 2px;     width: 25px;     height: 25px }  @media (min-width: 768px) {     .module-progress__graph-target__bubble {         bottom: 70px;         padding: 3px 10px 3px 30px;         font-size: 18px;         border-radius: 16px     }      .module-progress__graph-target__bubble .icon {         width: 30px;         height: 30px     } }  .module-progress__graph-max {     left: auto;     right: 10px }  @media (min-width: 768px) {     .module-progress__graph-max {         right: 15px     } }  .module-progress--failed {     padding-top: 45px;     background: url(images/train-harder.png) 27px top no-repeat;     background-size: auto 45px }  @media (min-width: 768px) {     .module-progress--failed {         padding-top: 78px;         background-size: auto 78px;         background-position: 40px top     } }  .carousel {     overflow: hidden;     padding: 25px 0 }  @media (min-width: 1024px) {     .carousel {         padding: 40px 0     } }  .carousel__wrap {     position: relative }  @media (max-width: 767px) {     .carousel__wrap {         max-width: 300px;         margin: 0 auto     } }  .carousel__slick {     margin-left: -8px;     margin-right: -8px }  .carousel__item {     padding: 0px 8px }  @media (max-width: 767px) {     .carousel__item {         margin-bottom: 15px     } }  .carousel__nav-control {     position: absolute;     top: 42%;     cursor: pointer;     padding: 1px;     margin-top: -16px;     z-index: 30;     -webkit-transition: .3s ease;     -o-transition: .3s ease;     transition: .3s ease }  .carousel__nav-control--prev {     left: -30px }  .carousel__nav-control--prev .icon {     -webkit-transform: rotate(-180deg);     -ms-transform: rotate(-180deg);     transform: rotate(-180deg) }  .carousel__nav-control--next {     right: -30px }  .carousel__nav-control.slick-disabled {     display: none !important }  .carousel__nav-control:hover {     opacity: 0.7 }  .carousel__nav-control .icon {     width: 30px;     height: 30px }  @media (max-width: 767px) {     .carousel__nav-control {         display: none !important     } }  .carousel--fixed {     padding-bottom: 35px }  .carousel--fixed .carousel__slick {     margin-left: -10px;     margin-right: -10px }  .carousel--fixed .carousel__slick .slick-list {     padding-bottom: 10px }  .carousel--fixed .carousel__item {     width: 300px;     padding: 0px 10px }  @media (max-width: 767px) {     .carousel--fixed .carousel__item {         width: 320px     } }  .carousel--fixed .carousel__nav-control {     top: 47% }  .slick-slider {     position: relative;     display: block;     -webkit-box-sizing: border-box;     box-sizing: border-box;     -webkit-touch-callout: none;     -webkit-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;     -ms-touch-action: pan-y;     touch-action: pan-y;     -webkit-tap-highlight-color: transparent }  .slick-list {     position: relative;     overflow: hidden;     display: block;     margin: 0;     padding: 0;     z-index: 20 }  @media (max-width: 767px) {     .slick-list {         overflow: visible     } }  .slick-list:focus {     outline: none }  .slick-list.dragging {     cursor: pointer;     cursor: hand }  .slick-slider .slick-track, .slick-slider .slick-list {     -webkit-transform: translate3d(0, 0, 0);     transform: translate3d(0, 0, 0) }  .slick-track {     position: relative;     left: 0;     top: 0;     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-orient: horizontal;     -webkit-box-direction: normal;     -ms-flex-direction: row;     flex-direction: row }  .slick-track:before, .slick-track:after {     content: "";     display: table }  .slick-track:after {     clear: both }  .slick-loading .slick-track {     visibility: hidden }  .slick-slide {     float: left;     min-height: 1px;     display: none }  [dir="rtl"] .slick-slide {     float: right }  .slick-slide img {     display: block }  .slick-slide.slick-loading img {     display: none }  .slick-slide.dragging img {     pointer-events: none }  .slick-initialized .slick-slide {     display: block }  .slick-loading .slick-slide {     visibility: hidden }  .slick-vertical .slick-slide {     display: block;     height: auto;     border: 1px solid transparent }  @media (max-width: 767px) {     .slick-slide {         opacity: 0.5;         -webkit-transition: opacity .2s ease-out;         -o-transition: opacity .2s ease-out;         transition: opacity .2s ease-out     }      .slick-slide.slick-current, .slick-slide.slick-active {         opacity: 1     } }  .slick-arrow.slick-hidden {     display: none }  .modal-overflow {     overflow: hidden }  .modal-bg {     position: fixed;     top: 0;     left: 0;     width: 100%;     height: 100%;     z-index: 5000;     overflow: hidden;     opacity: 0;     background: #000;     -webkit-transition: opacity 0.3s ease-out;     -o-transition: opacity 0.3s ease-out;     transition: opacity 0.3s ease-out }  @media (min-width: 768px) {     .modal-bg {         top: 80px     } }  .modal-bg.is-active {     opacity: .5 }  .modal {     position: fixed;     top: 0;     left: 0;     width: 100%;     height: 100%;     z-index: 5010;     outline: none;     overflow-x: hidden;     overflow-y: auto }  @media (min-width: 768px) {     .modal {         top: 80px     } }  .modal__container {     position: absolute;     width: 100%;     height: 100%;     left: 0;     top: 0;     padding: 0 10px;     text-align: center }  .modal__container:before {     content: '';     display: inline-block;     height: 100%;     vertical-align: middle }  .modal__center {     position: relative;     display: inline-block;     vertical-align: middle;     margin: 0 auto;     text-align: left;     z-index: 5020;     width: 100% }  .modal__close {     z-index: 5050;     position: absolute;     right: 10px;     top: 10px;     color: #bec0c2;     padding: 10px }  .modal__close .icon {     width: 20px;     height: 20px }  @media (min-width: 1024px) {     .modal__close {         right: 20px;         top: 20px     } }  .modal-std {     background: #fff;     padding: 0;     text-align: center;     max-width: 576px;     margin: 40px auto;     position: relative;     -webkit-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.2);     box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.2);     opacity: 0;     border-radius: 15px;     -webkit-transition: all 0.2s ease-out;     -o-transition: all 0.2s ease-out;     transition: all 0.2s ease-out;     -webkit-transform: translateY(-20px) perspective(600px) rotateX(10deg);     transform: translateY(-20px) perspective(600px) rotateX(10deg) }  .modal-std__header {     padding: 16px 0 }  .modal-std__logo {     width: 150px;     height: 35.6px;     margin: 0 auto }  @media (min-width: 1024px) {     .modal-std__logo {         width: 198px;         height: 47px     } }  .modal-std__img {     margin-bottom: 20px }  .modal-std__content {     padding: 20px 20px 40px;     color: #353535 }  .modal-std__content h3 {     color: #003F72;     text-shadow: none;     margin: 35px 0 20px }  .modal-std__content p {     margin: 0 auto;     font-size: 16px }  @media (min-width: 1024px) {     .modal-std__content p {         font-size: 20px     } }  .modal-std__btn {     margin-top: 20px }  .modal-std__btn .btn {     min-width: 260px }  @media (min-width: 1024px) {     .modal-std__btn {         margin-top: 35px     }      .modal-std__btn .btn {         min-width: 300px     } }  .modal.is-active .modal-std {     opacity: 1;     -webkit-transform: translateY(0) perspective(600px) rotateX(0);     transform: translateY(0) perspective(600px) rotateX(0) }  .article {     padding: 40px 0 30px }  @media (min-width: 1024px) {     .article {         padding: 60px 0 50px     } }  .article h1 {     color: #157261 }  .article .intro {     color: #157261 }  .article__shares {     max-width: 220px }  @media (min-aspect-ratio: 8 / 5) {     .landing {         height: 150vh     } }  @media (min-width: 1024px) {     .landing {         height: auto     } }  .course-header {     position: fixed;     z-index: 100 }  .course-header__close {     position: relative;     position: absolute;     top: 3px;     left: 3px;     width: 50px;     height: 50px;     padding: 10px;     line-height: 29px;     text-align: center;     color: #fff }  @media (min-width: 768px) {     .course-header__close {         top: 10px;         left: 10px     } }  .course-header__close::before {     content: "";     position: absolute;     top: 10px;     left: 10px;     width: 30px;     height: 30px;     color: #fff;     border-radius: 50%;     background: #4d4d4d }  .course-header__close .icon {     width: 13px;     height: 13px }  .quiz-results h1 {     margin: 15px 0;     min-height: 2.5em }  @media (min-width: 1024px) {     .quiz-results h1 {         margin: 30px 0     } }  .quiz-results__img {     margin-top: -15px }  @media (max-width: 767px) {     .quiz-results__img {         max-width: 80%;         margin: -20px auto     } }  @media (min-width: 1024px) {     .quiz-results__img {         margin-top: -30px     } }  .quiz-results__btn {     margin-top: 30px }  @media (min-width: 1024px) {     .quiz-results__btn {         margin-top: 60px     } }  .quiz-results__btn .btn {     -webkit-animation: bounce 2s infinite;     animation: bounce 2s infinite;     min-width: 260px }  @media (min-width: 1024px) {     .quiz-results__btn .btn {         min-width: 300px     } }  .quiz-results__link {     margin-top: 25px;     font-weight: bold;     font-size: 12px;     text-transform: uppercase }  @media (min-width: 1024px) {     .quiz-results__link {         margin-top: 35px     } }  .quiz-results__link a {     color: #fff }  .course-wrap {     padding: 30px 0 40px }  @media (min-width: 1024px) {     .course-wrap {         padding: 50px 0 70px     } }  .course-certificate {     padding: 10px 0 20px;     color: #fff;     background: #78b928 center center no-repeat;     -webkit-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.2);     box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.2);     margin-bottom: 30px }  .course-certificate:before, .course-certificate:after {     content: '';     display: table;     clear: both }  .course-certificate--cumlaude {     background-color: #f0ad1f }  @media (min-width: 768px) {     .course-certificate {         background-image: url(./images/certificate-achieved-banner@2x.png);         background-size: cover     }      .course-certificate--cumlaude {         background-image: url(./images/certificate-cumlaude-achieved-banner@2x.png)     } }  @media (min-width: 1024px) {     .course-certificate {         display: -webkit-box;         display: -ms-flexbox;         display: flex;         -ms-flex-wrap: wrap;         flex-wrap: wrap;         padding: 10px 0;         margin-bottom: 50px     }      .course-certificate__icon, .course-certificate__text, .course-certificate__social {         -ms-flex-item-align: center;         align-self: center;         float: left;         width: 30%     } }  @media (min-width: 1366px) {     .course-certificate__icon, .course-certificate__text, .course-certificate__social {         width: 25%     } }  .course-certificate__icon {     padding: 0 40px;     text-align: center }  .course-certificate__icon .icon svg {     width: 80px;     height: 80px }  @media (min-width: 1024px) {     .course-certificate__icon .icon svg {         width: 100px;         height: 100px     } }  @media (min-width: 1366px) {     .course-certificate__icon {         text-align: right     }      .course-certificate__icon .icon svg {         width: 140px;         height: 140px     } }  .course-certificate__text {     padding: 10px 20px 20px;     text-align: center }  .course-certificate__text p {     max-width: 500px;     margin: 0 auto;     line-height: 1.5 }  .course-certificate__text p.h2 {     margin-bottom: 8px;     line-height: 1.25 }  @media (min-width: 1024px) {     .course-certificate__text {         padding: 15px 0;         width: 40%     } }  @media (min-width: 1366px) {     .course-certificate__text {         width: 50%     } }  .course-certificate__social {     text-align: center }  .course-certificate__social-inner {     max-width: 220px;     margin: 0 auto }  .course-sidebar {     background: #fff;     margin-bottom: 30px }  .course-sidebar__content {     padding: 0 40px 35px;     text-align: center }  .course-sidebar__title {     position: relative;     margin: 30px 0 35px }  .course-sidebar__title h3 {     position: relative;     display: inline-block;     padding: 0 18px;     background: #fff }  .course-sidebar__title:before {     content: "";     position: absolute;     top: 50%;     left: 0;     width: 100%;     height: 1px;     background: #e0e2e4 }  .course-sidebar__goals {     text-align: left;     list-style: none }  .course-sidebar__goals li {     margin-bottom: 20px }  .course-sidebar__goals li:before, .course-sidebar__goals li:after {     content: '';     display: table;     clear: both }  .course-sidebar__goals li .icon {     float: left;     margin-right: 15px }  .course-sidebar__goals li .icon svg {     width: 56px;     height: 56px }  .course-sidebar__goals-text {     margin-left: 71px;     padding-top: 7px }  .course-sidebar__goals-text p.title {     font-size: 14px;     font-weight: 600;     text-transform: uppercase;     letter-spacing: 0.5px }  .course-sidebar__goals-text p small {     color: #57595b;     font-size: 12px }  .course-sidebar__sep {     position: relative;     margin: 23px 0 20px }  .course-sidebar__sep .icon {     position: relative;     display: inline-block;     padding: 0 }  .course-sidebar__sep .icon svg {     width: 30px;     height: 30px }  .course-sidebar__sep:before {     content: "";     position: absolute;     top: 50%;     left: 0;     width: 100%;     height: 1px;     background: #e0e2e4 }  .course-sidebar__shares {     display: inline-block;     margin: 0 auto }  .courses-menu.dropdown__menu {     margin-top: 22px }  .courses-menu.mobile-nav__courses {     padding-left: 10px }  .courses-menu h5 {     text-transform: uppercase;     position: relative;     margin-left: -10px }  .courses-menu__section {     margin-top: 23px }  @media (min-width: 1366px) {     .courses-menu__section {         margin-top: 30px     } }  .courses-menu__section:first-child {     margin-top: 0 }  .courses-menu__title {     font-size: 14px;     font-weight: 600;     margin-bottom: 5px;     text-transform: uppercase;     line-height: 1.33;     letter-spacing: 0.6px }  .courses-menu__list > li {     margin: 10px 0;     font-size: 12px;     line-height: 1.667;     font-weight: normal;     text-transform: uppercase }  .courses-menu__list > li > a {     display: block }  .courses-menu__list > li .icon--course {     float: right }  .course-topics__intro {     text-align: center;     padding: 40px 0 30px;     max-width: 720px;     margin: 0 auto }  @media (min-width: 1024px) {     .course-topics__intro {         padding: 50px 0 45px     } }  .course-topics__intro h1 {     color: #157261 }  .course-article-hero {     position: relative;     background-color: #f3faf9 }  @media (min-width: 1460px) {     .course-article-hero > img, .course-article-hero > picture {         max-width: 1440px     } }  .course-article-hero__content {     position: absolute;     top: 50%;     left: 0;     width: 100% }  .course-article-hero__content .h2 {     color: #157261;     position: relative;     -webkit-transform: translateY(-50%);     -ms-transform: translateY(-50%);     transform: translateY(-50%) }  .course-article {     padding: 30px 0 40px }  @media (min-width: 1024px) {     .course-article {         padding: 80px 0 100px     } }  .course-article h2, .course-article h3 {     color: #157261 }  .course-infographic {     padding: 40px 0;     text-align: center }  .course-infographic__contents {     max-width: 747px;     margin: 0 auto;     padding-bottom: 40px }  .course-infographic h1 {     color: #157261;     margin-bottom: 40px }  .course-infographic__disclaimer {     color: #57595b;     font-size: 12px }  @media (min-width: 1024px) {     .course-infographic {         padding: 100px 0 60px     }      .course-infographic__contents {         padding-bottom: 60px     }      .course-infographic h1 {         margin-bottom: 70px     } }  .course-quiz__title h1 {     margin-bottom: 10px }  .course-quiz__title p {     margin-bottom: 17px }  @media (min-width: 1024px) {     .course-quiz__title h1 {         margin-bottom: 30px     }      .course-quiz__title p {         margin-bottom: 25px     } }  .course-quiz__img {     margin-bottom: 15px;     border-radius: 10px;     border: 5px solid #fff;     background: #fff }  .course-quiz__img img {     border-radius: 8px }  .course-quiz__img-btn {     padding: 12px }  .course-quiz__img-btn a {     font-size: 18px;     padding-top: 8px;     padding-bottom: 6px }  @media (min-width: 768px) {     .course-quiz__img {         border-radius: 0;         border: none;         background: none     }      .course-quiz__img img {         border-radius: 10px;         border: 5px solid #fff     }      .course-quiz__img-btn {         display: none     } }  .course-quiz__answers {     text-align: left;     list-style: none;     margin: 0 0 20px }  .course-quiz__answers > li {     padding: 8px 11px;     background: #fff;     border-radius: 10px;     -webkit-box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     margin-bottom: 10px;     cursor: pointer;     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center;     -webkit-transition: -webkit-box-shadow .25s ease;     transition: -webkit-box-shadow .25s ease;     -o-transition: box-shadow .25s ease;     transition: box-shadow .25s ease;     transition: box-shadow .25s ease, -webkit-box-shadow .25s ease }  .course-quiz__answers > li:hover {     -webkit-box-shadow: 0 5px 0 0 rgba(255, 255, 255, 0.74);     box-shadow: 0 5px 0 0 rgba(255, 255, 255, 0.74) }  .course-quiz__answers > li p {     color: #353535;     -webkit-box-flex: 1;     -ms-flex: 1;     flex: 1;     font-size: 16px }  @media (min-width: 1024px) {     .course-quiz__answers {         margin-bottom: 35px     }      .course-quiz__answers > li {         padding: 8px 20px;         margin-bottom: 15px     }      .course-quiz__answers > li p {         font-size: 20px     } }  .course-quiz__option {     float: left;     position: relative;     margin-right: 15px }  .course-quiz__option .icon {     width: 30px;     height: 30px }  .course-quiz__option span {     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100%;     line-height: 30px;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-style: normal;     font-size: 12px;     text-align: center }  .course-quiz__option span strong {     font-weight: 900 }  @media (min-width: 1024px) {     .course-quiz__option .icon {         width: 40px;         height: 40px     }      .course-quiz__option span {         font-size: 20px;         line-height: 38px     } }  .course-quiz__select {     width: 100%;     padding: 12px 16px;     background: #fff;     border: none;     border-radius: 10px;     box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     color: #353535;     font-size: 16px;     cursor: pointer;     -webkit-appearance: none;     -moz-appearance: none;     appearance: none;     background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23353535' d='M6 8L0 0h12z'/%3E%3C/svg%3E");     background-repeat: no-repeat;     background-position: right 16px center;     background-size: 12px 8px;     transition: box-shadow .25s ease }  .course-quiz__select:hover {     box-shadow: 0 5px 0 0 rgba(255, 255, 255, 0.74) }  .course-quiz__select:focus {     outline: none;     box-shadow: 0 5px 0 0 rgba(255, 255, 255, 0.74) }  .course-quiz__select:disabled {     opacity: 0.6;     cursor: not-allowed }  @media (min-width: 1024px) {     .course-quiz__select {         padding: 14px 20px;         font-size: 20px;         background-position: right 20px center     } }  .course-quiz--img .course-quiz__img {     display: none }  .course-quiz--img .course-quiz__img.is-active {     display: block }  .course-quiz--img .course-quiz__answers {     display: none }  .course-quiz--img .course-quiz__answers.is-active {     display: block }  @media (min-width: 768px) {     .course-quiz--img .course-quiz__img {         display: block     }      .course-quiz--img .course-quiz__answers {         display: block     } }  .course-quiz__result {     margin-bottom: 10px }  .course-quiz__result--incorrect .course-quiz__result-panel-title {     background-color: #df252e }  .course-quiz__result--incorrect .course-quiz__result-panel-msg {     text-align: left }  .course-quiz__result--incorrect .course-quiz__result-panel-msg > p {     margin-left: 40px;     margin-bottom: 5px;     font-size: 16px }  @media (min-width: 1024px) {     .course-quiz__result--incorrect .course-quiz__result-panel-msg > p {         margin-left: 50px     } }  .course-quiz__result--correct .course-quiz__result-panel-title {     background-color: #003F72 }  .course-quiz__result--correct .course-quiz__result-panel-content {     background: url(images/drill-question-correct-confette.png) center 8px no-repeat;     background-size: auto 83px }  @media (min-width: 768px) {     .course-quiz__result--correct .course-quiz__result-panel-content {         background-position: center 17px;         background-size: auto 128px     } }  .course-quiz__result-panel {     border-radius: 15px;     background: #fff;     -webkit-box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74) }  .course-quiz__result-panel-title {     padding: 8px;     border-radius: 15px 15px 0 0 }  @media (min-width: 1024px) {     .course-quiz__result-panel-title {         padding: 18px     } }  .course-quiz__result-panel-content {     padding: 12px 22px 20px;     color: #353535 }  @media (max-width: 767px) {     .course-quiz__result-panel-content .btn {         display: block     } }  @media (min-width: 1024px) {     .course-quiz__result-panel-content {         padding: 28px 40px 25px     } }  .course-quiz__result-panel-content .btn {     -webkit-animation: bounce 2s infinite;     animation: bounce 2s infinite }  .course-quiz__result-panel-msg {     padding: 0 0 13px }  @media (min-width: 1024px) {     .course-quiz__result-panel-msg {         padding: 0 0 20px     } }  .course-quiz__result-panel-fans {     display: inline-block;     position: relative;     line-height: 1;     padding: 30px 25px 0;     margin: -3px 0 16px;     background: url(images/drill-question-correct-star.png) center top no-repeat;     background-size: contain }  .course-quiz__result-panel-fans .stroke, .course-quiz__result-panel-fans .text {     position: relative;     top: 3px;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     color: #fff;     font-size: 50px }  .course-quiz__result-panel-fans .stroke strong, .course-quiz__result-panel-fans .text strong {     font-weight: 900 }  .course-quiz__result-panel-fans .stroke {     -webkit-text-stroke: 13px #003F72 }  .course-quiz__result-panel-fans .text {     position: absolute;     top: 31px;     left: 50%;     left: calc(50% - 1px);     -webkit-transform: translateX(-50%);     -ms-transform: translateX(-50%);     transform: translateX(-50%) }  @media (min-width: 768px) {     .course-quiz__result-panel-fans {         padding: 40px 25px 0;         margin-bottom: 21px     }      .course-quiz__result-panel-fans .stroke, .course-quiz__result-panel-fans .text {         font-size: 65px     }      .course-quiz__result-panel-fans .stroke {         -webkit-text-stroke: 17px #003F72     }      .course-quiz__result-panel-fans .text {         top: 40px;         left: calc(50% - 2px)     } }  .course-quiz__result-panel-answer {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center }  .course-quiz__result-panel-answer p {     -webkit-box-flex: 1;     -ms-flex: 1;     flex: 1;     text-align: left;     margin: 0 }  .course-quiz__result-panel-option {     float: left;     position: relative;     margin-right: 10px }  .course-quiz__result-panel-option .icon {     width: 30px;     height: 30px }  .course-quiz__result-panel-option span {     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100%;     line-height: 30px;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-style: normal;     font-size: 12px;     color: #fff;     text-align: center }  .course-quiz__result-panel-option span strong {     font-weight: 900 }  @media (min-width: 1024px) {     .course-quiz__result-panel-option {         margin-right: 15px     }      .course-quiz__result-panel-option .icon {         width: 40px;         height: 40px     }      .course-quiz__result-panel-option span {         line-height: 38px;         font-size: 20px     } }  .course-quiz__goal {     position: relative;     -webkit-box-flex: 0;     -ms-flex: none;     flex: none }  .course-quiz__goal-options {     list-style: none;     margin: 0 }  .course-quiz__goal-options > li {     position: absolute;     cursor: pointer }  .course-quiz__goal-options > li .icon {     width: 50px;     height: 50px }  .course-quiz__goal-options > li span {     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100%;     line-height: 48px;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-style: normal;     font-size: 20px;     text-align: center }  .course-quiz__goal-options > li span strong {     font-weight: 900 }  .course-quiz__goal-options > li:nth-child(1) {     top: 20px;     left: 35px }  .course-quiz__goal-options > li:nth-child(2) {     top: 20px;     right: 35px }  .course-quiz__goal-options > li:nth-child(3) {     bottom: 60px;     left: 35px }  .course-quiz__goal-options > li:nth-child(4) {     bottom: 60px;     right: 35px }  @media (min-width: 768px) {     .course-quiz__goal-options > li:nth-child(1) {         top: 50px;         left: 80px     }      .course-quiz__goal-options > li:nth-child(2) {         top: 50px;         right: 80px     }      .course-quiz__goal-options > li:nth-child(3) {         bottom: 140px;         left: 80px     }      .course-quiz__goal-options > li:nth-child(4) {         bottom: 140px;         right: 80px     } }  .course-quiz__goal-result {     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100% }  .course-quiz__goal-result img {     position: absolute;     height: auto }  .course-quiz__goal-result--incorrect img {     width: 72px;     top: 20%;     left: 65.5% }  @media (min-width: 768px) {     .course-quiz__goal-result--incorrect img {         width: 139px;         top: 28.5%;         left: 59%     } }  .course-quiz__goal-result--correct img:nth-child(1) {     width: 115px;     top: -3%;     left: -3% }  @media (min-width: 768px) {     .course-quiz__goal-result--correct img:nth-child(1) {         width: 191px;         top: 13px;         left: -30px     } }  .course-quiz__goal-result--correct img:nth-child(2) {     width: 81px;     top: -6%;     right: -3% }  @media (min-width: 768px) {     .course-quiz__goal-result--correct img:nth-child(2) {         width: 155px;         top: -30px;         right: -20px     } }  .course-quiz__goalie {     position: absolute;     left: 0;     top: 0;     width: 100%;     height: 100% }  .course-video {     position: absolute;     height: 100%;     width: 100%;     overflow: hidden;     max-width: 100% }  .course-video iframe {     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100% }  .course-video__complete {     position: absolute;     left: 0;     top: 0;     right: 0;     bottom: 0;     background: rgba(0, 0, 0, 0.5);     text-align: center }  .course-video__complete h1 {     position: absolute;     top: 50%;     left: 0;     width: 100%;     -webkit-transform: translateY(-50%);     -ms-transform: translateY(-50%);     transform: translateY(-50%) }  .course-video__btn {     position: absolute;     bottom: 25px;     left: 50%;     -webkit-transform: translateX(-50%);     -ms-transform: translateX(-50%);     transform: translateX(-50%) }  @media (min-width: 1024px) {     .course-video__btn {         bottom: 100px     } }  .course-video__btn .btn {     min-width: 260px }  .fan-bar {     text-align: center;     position: relative;     margin: -30px 0 30px }  @media (min-width: 1024px) {     .fan-bar {         margin: -40px 0 40px     } }  .fan-bar__pill {     display: inline-block;     margin-top: -4px;     height: 35px;     padding: 8px 20px 0;     border-radius: 0 0 35px 35px;     background-color: #003F72;     -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3), inset 0 -2px 0 0 rgba(255, 255, 255, 0.3);     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3), inset 0 -2px 0 0 rgba(255, 255, 255, 0.3) }  @media (min-width: 1024px) {     .fan-bar__pill {         height: 42px;         padding: 9px 25px 0;         border-radius: 0 0 42px 42px     } }  .fan-bar__pill li {     display: inline-block;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     min-width: 65px }  .fan-bar__pill li strong {     font-weight: 900 }  @media (min-width: 1024px) {     .fan-bar__pill li {         min-width: 80px     } }  .fan-bar__title {     font-size: 16px;     line-height: 17px;     border-right: 1px solid #003F72 }  @media (min-width: 1024px) {     .fan-bar__title {         font-size: 19px;         line-height: 20px     } }  .fan-bar__num {     position: relative;     top: 1px;     font-size: 20px;     line-height: 20px }  @media (min-width: 1024px) {     .fan-bar__num {         font-size: 24px;         line-height: 24px     } }  .loader img {     display: block;     margin-bottom: 50px;     max-height: 65vh }  .loader__text {     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     text-transform: none;     font-size: 16px;     letter-spacing: normal }  .loader__text strong {     font-weight: 900 }  @media (min-width: 1024px) {     .loader img {         margin-bottom: 60px     }      .loader__text {         font-size: 20px     } }  .dashboard {     padding-top: 20px }  .dashboard h1 {     margin: 0 0 65px }  .dashboard__filters {     margin-bottom: 1px }  .dashboard__filters:before, .dashboard__filters:after {     content: '';     display: table;     clear: both }  .dashboard__select {     float: left;     width: 300px;     margin-right: 20px }  .dashboard__switch {     float: right;     width: 300px;     position: relative;     padding: 2px 2px 5px;     margin: 0 0 21px;     background: #fff;     border-radius: 10px;     border: 1px solid #e0e2e4 }  .dashboard__switch:before, .dashboard__switch:after {     content: '';     display: table;     clear: both }  .dashboard__switch-col {     float: left;     width: 50% }  .dashboard__switch-btn {     position: relative;     display: block;     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 14px;     color: #003F72;     line-height: 19px;     text-align: center;     padding: 11px 10px;     height: 40px }  .dashboard__switch-btn strong {     font-weight: 900 }  .dashboard__switch-btn.is-active {     color: #fff;     border-radius: 6px;     background-color: #003F72;     -webkit-box-shadow: 0 3px 0 0 #003F72, inset 0 2px 0 0 rgba(255, 255, 255, 0.5);     box-shadow: 0 3px 0 0 #003F72, inset 0 2px 0 0 rgba(255, 255, 255, 0.5);     border: solid 1px #7ad6f8 }  .dashtable table {     width: 100%;     border-collapse: collapse;     border-radius: 10px;     -webkit-box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);     background: #fff;     color: #353535;     line-height: 1.38 }  .dashtable table thead th {     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     line-height: 1.5;     padding: 18px 30px 18px 15px;     text-align: left;     border-left: 1px solid #e0e2e4;     background: #f1f2f5;     position: relative }  .dashtable table thead th strong {     font-weight: 900 }  .dashtable table thead th p {     float: left }  .dashtable table thead tr th:first-child {     border-radius: 10px 0 0 0;     border-left: none }  .dashtable table thead tr th:last-child {     border-radius: 0 10px 0 0 }  .dashtable table tbody td {     background: #fff;     padding: 14px 15px;     text-align: left;     border-left: 1px solid #e0e2e4;     vertical-align: top }  .dashtable table tbody td .pie {     margin: 3px auto 9px }  .dashtable table tbody td .icon {     width: 40px;     height: 40px;     margin-top: -10px;     margin-bottom: -8px }  .dashtable table tbody td .icon-wrap {     display: inline-block;     margin-right: 5px }  .dashtable table tbody tr:nth-child(even) td {     background: #f1f2f5 }  .dashtable table tbody tr:last-child td:first-child {     border-radius: 0 0 0 10px;     border-left: none }  .dashtable table tbody tr:last-child td:last-child {     border-radius: 0 0 10px 0 }  .dashtable__sort {     position: absolute;     right: 7px;     top: 50%;     -webkit-transform: translateY(-50%);     -ms-transform: translateY(-50%);     transform: translateY(-50%);     width: 24px;     height: 24px;     color: #353535 }  .dashtable__sort .icon {     display: block;     margin: 0 auto;     width: 10px;     height: 10px;     line-height: 12px }  .dashtable__sort .icon:last-child {     margin-top: -2px }  .dashtable__sort--descending .icon:first-child {     opacity: 0.4 }  .dashtable__sort--ascending .icon:last-child {     opacity: 0.4 }  .dashtable__label {     font-family: "Arial Black", "Arial", sans-serif;     font-weight: 900;     text-transform: uppercase;     font-style: italic;     letter-spacing: -0.025em;     font-size: 14px;     line-height: 1.57;     min-width: 180px }  .dashtable__label strong {     font-weight: 900 }  @media (min-width: 1366px) {     .dashtable__label {         min-width: 220px     } }  .dashtable__tray {     margin: 20px 0;     text-align: left }  .dashtable__tray li {     display: inline-block;     margin-right: 15px }  .dashtable__tray li .icon {     top: -2px }  .pie {     position: relative;     width: 135px }  @media (min-width: 1366px) {     .pie {         width: 184px     } }  .modal-body {     -webkit-box-flex: 1;     -ms-flex: 1 0 auto;     flex: 1 0 auto;     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-orient: vertical;     -webkit-box-direction: normal;     -ms-flex-direction: column;     flex-direction: column }  .contentFrame {     width: 100%;     height: 100%;     text-align: center;     position: absolute;     left: 0;     opacity: 1 }  .is-hidden {     display: none !important }  .a11y {     position: absolute !important;     top: -9999px !important;     left: -9999px !important }  .cf:before, .cf:after {     content: " ";     display: table }  .cf:after {     clear: both }  .img-responsive {     display: block;     max-width: 100%;     height: auto;     margin-left: auto;     margin-right: auto }  .img-max {     display: block;     width: 100%;     height: auto;     margin-left: auto;     margin-right: auto }  .img-featured {     margin-bottom: 30px !important }  @media (min-width: 1024px) {     .img-featured {         margin-bottom: 50px !important     } }  .text-center {     text-align: center }  .center-block {     display: block;     margin-left: auto;     margin-right: auto }  .center-vert {     position: relative;     top: 50%;     -webkit-transform: translateY(-50%);     -ms-transform: translateY(-50%);     transform: translateY(-50%) }  .pull-right {     float: right !important }  .pull-left {     float: left !important }  .sep {     border-bottom: 1px solid #e0e2e4;     margin: 20px 0 25px }  .hide {     display: none !important }  .show {     display: block !important }  .invisible {     visibility: hidden }  .text-hide {     font: 0/0 a;     color: transparent;     text-shadow: none;     background-color: transparent;     border: 0 }  .hidden {     display: none !important }  .affix {     position: fixed }  @-ms-viewport {     width: device-width }  .visible-xs, .visible-sm, .visible-md, .visible-lg {     display: none !important }  @media (max-width: 767px) {     .visible-xs {         display: block !important     } }  @media (min-width: 768px) and (max-width: 1023px) {     .visible-sm {         display: block !important     } }  @media (min-width: 1024px) and (max-width: 1365px) {     .visible-md {         display: block !important     } }  @media (min-width: 1366px) {     .visible-lg {         display: block !important     } }  @media (max-width: 767px) {     .hidden-xs {         display: none !important     } }  @media (min-width: 768px) and (max-width: 1023px) {     .hidden-sm {         display: none !important     } }  @media (min-width: 1024px) and (max-width: 1365px) {     .hidden-md {         display: none !important     } }  @media (min-width: 1366px) {     .hidden-lg {         display: none !important     } }  .change-password {     margin-bottom: 15px }  .change-password-modal {     max-width: 750px }  .col-xs-6.col-xs-offset-3 {     margin-left: 25%; }  .info-bank-button {     box-shadow: 0 3px 0 0 #3d5362, inset 0 1px 0 0 rgba(255, 255, 255, 0.5) !important;     background: #003F72;     border-color: #3d5362 }  .info-bank-button:hover {     background: #43a0e2 }  .type-551 .course-quiz__goal {     display: none; }  .show-validation .ng-invalid {     border: 2px solid red; }  .feedback-button {     background: #f0a823 !important;     box-shadow: 0 3px 0 0 #3d5362, inset 0 1px 0 0 rgba(255, 255, 255, 0.5) !important;     background: #f0a823;     border-color: #3d5362; }  .change-password-modal input.form-control {     box-shadow: inset 0px 0px 3px 0 rgba(0, 0, 0, 0.25); }  .course-quiz.single-page-true .h3 {     margin-top: 20px; }  .question-notes {     text-align: left;     padding: 0 20px 20px 20px; }  .change-password-modal input.form-control.ng-invalid {     box-shadow: inset 0px 0px 3px 0 rgb(248 0 0 / 25%); }  .change-password-modal .change-password-form {     margin-top: 25px;     border-top: 1px dotted lightgrey;     padding: 15px; }  .password-error {     color: red;     font-weight: bold; }  .course-intro > .go-to-infobank {     margin-top: 15px;     height: 40px; }  span.more-content .slick-arrow {     position: absolute;     bottom: 2px;     right: 1px;     z-index: 110;     width: 50px;     height: 50px;     border-radius: 50%;     background: #1a946b;     color: white;     padding: 7px;     box-shadow: 0px 0px 2px grey; }  span.more-content:hover {     opacity: 1; }  span.more-content {     position: fixed;     bottom: 28px;     left: calc(50% + 23px);     cursor: pointer;     opacity: .5;     z-index: 120; }   @media (max-width: 767px) {     .course-intro > .go-to-infobank {         max-width: 300px;         width: calc(100% - 60px);     } }  /* Document upload - quiz UI style */ .doc-upload {     margin-top: 15px; }  .doc-upload__validation {     background: #222353;     color: #fff;     border-radius: 10px;     padding: 8px 15px;     margin-bottom: 10px;     text-align: center; }  .doc-upload__validation p {     margin: 0;     font-size: 14px; }  .doc-upload__dropzone {     background: #fff;     border: 2px dashed #bec0c2;     border-radius: 10px;     padding: 20px;     text-align: center;     cursor: pointer;     transition: all 0.2s ease;     color: #353535;     font-size: 16px; }  .doc-upload__dropzone:hover {     border-color: #14c086;     background: #f4f7f6; }  .doc-upload__dropzone--dragover {     border-color: #14c086;     background: #e8f8f2; }  .doc-upload__dropzone i {     font-size: 24px;     color: #14c086;     margin-right: 8px; }  .doc-upload__dropzone span {     vertical-align: middle; }  .doc-upload__progress {     margin-top: 10px; }  .doc-upload__progress .progress {     border-radius: 10px;     height: 24px;     background: #e0e2e4;     overflow: hidden;     margin: 0; }  .doc-upload__progress .progress-bar {     border-radius: 10px;     line-height: 24px;     font-size: 13px; }  .doc-upload__progress span {     color: #fff;     white-space: nowrap; }  .doc-upload__file {     margin-top: 10px;     display: flex;     gap: 10px;     align-items: center;     justify-content: center; }  .doc-upload__file .btn {     min-width: auto;     font-style: normal;     text-shadow: none;     letter-spacing: 0;     font-size: 14px; }
.type-551 .fan-bar{
    visibility: hidden;
}
.type-551{
    background-image: url(images/bg-pattern-mobile.jpg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed; /*background: ;*/
}
.course-quiz__input {
    width: 100%;
    padding: 12px 16px;
    background: #fff;
    border: none;
    border-radius: 10px;
    box-shadow: 0 4px 0 0 rgba(255, 255, 255, 0.74);
    color: #353535;
    font-size: 16px;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 12px 8px;
    transition: box-shadow .25s ease;
    /*opacity: .5;*/
    z-index: 120;
}


@media (max-width: 767px) {
    .course-intro > .go-to-infobank {
        max-width: 100%;
        width: 300px;
    }
}