/*
  Training page styles
*/
/*
  Breakpoint mixins
*/
/*
  Vector Sprite
*/
.bg-training-sprite {
  background-image: url(https://d226aj4ao1t61q.cloudfront.net/ubcsu6pbq_training-spritesheet-160-tinified.png);
  background-repeat: no-repeat;
  background-size: 100%;
  margin: 0 auto;
  width: 80px;
  height: 80px; }
  .bg-training-sprite.automations {
    background-position: 0 0; }
  .bg-training-sprite.campaigns {
    background-position: 0 -100px; }
  .bg-training-sprite.contacts {
    background-position: 0 -200px; }
  .bg-training-sprite.deals-crm {
    background-position: 0 -300px; }
  .bg-training-sprite.event-tracking {
    background-position: 0 -400px; }

#training .sub-header-bar {
  z-index: 3;
  padding-left: 16px;
  padding-right: 16px; }
  #training .sub-header-bar ul {
    margin: 0;
    padding: 0;
    line-height: 1.8em;
    float: right; }
    #training .sub-header-bar ul li {
      list-style-type: none; }
    #training .sub-header-bar ul li.section-link {
      position: relative;
      float: left;
      margin-left: 24px; }
      #training .sub-header-bar ul li.section-link a {
        padding: 4px 10px;
        color: #fff;
        border-radius: 7px;
        background-clip: padding-box;
        cursor: pointer; }
      #training .sub-header-bar ul li.section-link::before {
        position: absolute;
        content: '';
        top: 0;
        bottom: 0;
        left: -10px;
        width: 1px;
        background-color: rgba(255, 255, 255, 0.2); }
      #training .sub-header-bar ul li.section-link:first-of-type::before {
        display: none !important; }
      #training .sub-header-bar ul li.section-link.active a {
        background-color: rgba(255, 255, 255, 0.1);
        cursor: text; }
  #training .sub-header-bar .mobile-dropdown {
    display: none;
    height: 0;
    visibility: hidden; }
#training .ac_container {
  background-color: #fff; }
  #training .ac_container.greybg {
    padding: 20px;
    background: #F2F2F2; }
#training .webinar-tabs {
  margin-top: 60px;
  margin-bottom: 30px; }
  #training .webinar-tabs .tab {
    padding: 12px 10px;
    box-shadow: 0 3px 13px 0 rgba(0, 0, 0, 0.16);
    opacity: 0.6;
    filter: alpha(opacity=60);
    cursor: pointer;
    font-weight: 600; }
    #training .webinar-tabs .tab.active, #training .webinar-tabs .tab:hover {
      opacity: 1;
      filter: alpha(opacity=100); }
#training .hide {
  display: none; }
#training .card {
  position: relative;
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.41); }
#training .webinar-cards {
  overflow: visible !important; }
  #training .webinar-cards .item {
    padding: 0;
    margin-bottom: 20px; }
  #training .webinar-cards .slick-list {
    height: auto; }
  #training .webinar-cards .card {
    padding: 0;
    padding-bottom: 60px;
    min-height: 446px;
    border-radius: 0;
    background-clip: padding-box; }
    #training .webinar-cards .card .ac_button {
      position: absolute;
      bottom: 20px;
      right: 20px;
      left: 20px;
      width: auto !important; }
      #training .webinar-cards .card .ac_button.register {
        background-color: #4DCBA9;
        border-color: #4DCBA9; }
        #training .webinar-cards .card .ac_button.register:hover {
          background-color: #37BE9A;
          border-color: #37BE9A; }
  #training .webinar-cards .slidesjs-pagination {
    left: initial;
    display: block;
    margin: 20px auto 0;
    transform: none; }
#training .video-cards .ac_container {
  box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.16);
  cursor: pointer;
  -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); }
  #training .video-cards .ac_container:hover {
    background-color: #fafafa;
    box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.16); }
#training .video-cards .category {
  color: #4073b5;
  text-transform: uppercase;
  font-weight: 600; }
#training .video-cards .wistia_embed {
  height: 100%; }
  #training .video-cards .wistia_embed > div {
    padding: 20px;
    height: 100% !important;
    width: 100% !important; }
#training .video-categories .ac_container {
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.16);
  cursor: pointer;
  -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); }
  #training .video-categories .ac_container:hover {
    background-color: #fafafa;
    box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.16); }
#training #training-one-one,
#training #training-office-hours {
  background-size: cover;
  background-repeat: no-repeat; }
  #training #training-one-one .container,
  #training #training-office-hours .container {
    position: relative;
    min-height: 340px;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    z-index: 2; }
    #training #training-one-one .container > .ac_flex-row,
    #training #training-office-hours .container > .ac_flex-row {
      position: absolute;
      top: 50%;
      transform: translateY(-50%); }
#training #training-one-one {
  background-color: #4073B5;
  background-image: url("https://d226aj4ao1t61q.cloudfront.net/1rxkjcvr8_swzupk0yn_training_2880.jpg");
  /* Laptop */
  /* Laptop */
  background-position: center top; }
  @media (max-width: 768px) {
    #training #training-one-one {
      background-image: url("https://d226aj4ao1t61q.cloudfront.net/s2ugazaz7_swzupk0yn_training_1538.jpg"); } }
  @media (max-width: 380px) {
    #training #training-one-one {
      background-image: url("https://d226aj4ao1t61q.cloudfront.net/cene4bjo_swzupk0yn_training_769.jpg"); } }
  #training #training-one-one .container > .ac_flex-row {
    right: 20px;
    width: 380px; }
  #training #training-one-one.add-margin {
    margin-top: 64px; }
#training #training-office-hours {
  background-image: url("https://d226aj4ao1t61q.cloudfront.net/mw33b035y_learn-standing-at-desk-2x-bq.jpg");
  background-position: center; }
#training .modal {
  background-color: rgba(0, 0, 0, 0.6); }
  #training .modal .modal-dialog {
    width: 680px; }
    #training .modal .modal-dialog .card {
      box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.18);
      border-radius: 0;
      background-clip: padding-box; }
  #training .modal#upcoming-webinars .card {
    border-radius: 9px;
    background-clip: padding-box; }
  #training .modal#upcoming-webinars .ac_flex-col:first-child {
    border-right: #cacaca 1px solid; }
#training .slick-dots {
  margin-bottom: 3px;
  margin-top: 10px;
  padding: 0; }
  #training .slick-dots li {
    display: inline-block;
    vertical-align: middle; }
    #training .slick-dots li button {
      background-color: rgba(255, 255, 255, 0.37);
      border-radius: 100%;
      border: 0 none;
      display: block;
      height: 16px;
      margin: 0 6px;
      overflow: hidden;
      text-indent: -999em;
      width: 16px; }
  #training .slick-dots .slick-active button {
    background-color: #fff;
    background: #fff;
    cursor: default; }
#training .show-mobile {
  display: none;
  width: 100%;
  height: 0; }

@media screen and (max-width: 980px) {
  main {
    margin-top: 25px; }

  .sub-header-bar {
    position: fixed !important;
    top: 75px;
    padding: 0 !important;
    width: 100% !important;
    height: 60px !important;
    cursor: pointer !important;
    left: 0;
    right: 0; }
    .sub-header-bar::after {
      font-family: 'ac-icons';
      content: 'm';
      position: absolute;
      top: 26px;
      right: 18px;
      font-size: 12px; }
    .sub-header-bar .container.nopadding {
      padding: 0 !important; }
    .sub-header-bar .ac_flex-col {
      display: block;
      width: 100% !important;
      margin: 0 !important;
      flex: initial;
      padding: 0 !important; }
      .sub-header-bar .ac_flex-col:first-child {
        display: none !important; }
    .sub-header-bar .text {
      display: block !important;
      position: relative;
      text-align: left !important;
      padding: 17px 0 !important;
      background-color: rgba(0, 0, 0, 0) !important;
      font-size: 18px !important;
      cursor: pointer !important;
      left: 32px; }
    .sub-header-bar .sub-header-ul {
      display: none !important;
      height: 0 !important; }
    .sub-header-bar .mobile-dropdown {
      position: relative;
      float: none !important;
      margin: 0 !important;
      text-align: left !important;
      background: #20395B;
      height: 100% !important;
      min-height: 100% !important;
      cursor: pointer;
      visibility: visible !important; }
      .sub-header-bar .mobile-dropdown .section-link {
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        cursor: pointer !important; }
        .sub-header-bar .mobile-dropdown .section-link::before {
          display: none !important; }
        .sub-header-bar .mobile-dropdown .section-link a {
          display: block !important;
          margin: 0 !important;
          padding: 20px 0 !important;
          background-color: transparent !important;
          font-size: 18px !important;
          border-top: 1px solid #2A4C79 !important;
          cursor: pointer !important;
          text-align: center !important; }

  #walkthrough-videos .ac_flex-col {
    margin-bottom: 20px !important; }
  #walkthrough-videos .video-cards .card img {
    width: 100% !important;
    max-width: 100% !important; } }
@media screen and (max-width: 736px) {
  .ac_flex-row {
    position: relative !important;
    width: 100% !important;
    top: initial !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important; }
    .ac_flex-row .ac_flex-col {
      margin: 0 !important;
      padding: 0 !important; }

  #training-one-one {
    margin-top: 110px !important;
    background-image: none !important; }
    #training-one-one .container {
      position: relative;
      width: 100% !important;
      padding: 0 !important; }
      #training-one-one .container .ac_flex-row {
        max-width: 100% !important;
        right: 0 !important; }
        #training-one-one .container .ac_flex-row .show-mobile {
          display: block !important;
          height: 160px !important;
          padding: 0 !important;
          background-image: url(https://d226aj4ao1t61q.cloudfront.net/s2ugazaz7_swzupk0yn_training_1538.jpg);
          background-position: center top !important;
          background-size: cover !important;
          background-repeat: no-repeat !important; }
        #training-one-one .container .ac_flex-row .ac_container.bigshadow {
          padding: 20px !important;
          border-radius: 0;
          background-clip: padding-box;
          box-shadow: none !important; }

  #join-webinar .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important; }
  #join-webinar .subheading {
    font-size: 13px !important; }
  #join-webinar .webinar-tabs .ac_flex-col {
    display: none !important;
    height: 0 !important; }
  #join-webinar .webinar-tabs .webinar-tabs-mobile {
    display: block !important;
    margin: 10px 0 !important;
    width: 100% !important; }
    #join-webinar .webinar-tabs .webinar-tabs-mobile .tab-dropdown-container {
      margin-bottom: 20px;
      background-color: #fff;
      width: 100%;
      border-radius: 4px;
      background-clip: padding-box; }
      #join-webinar .webinar-tabs .webinar-tabs-mobile .tab-dropdown-container li {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        border-top: #cacaca 1px solid !important;
        width: 100% !important;
        color: #4E4E4E !important;
        line-height: 50px !important; }
        #join-webinar .webinar-tabs .webinar-tabs-mobile .tab-dropdown-container li:first-child {
          border-top: 0 none !important; }
    #join-webinar .webinar-tabs .webinar-tabs-mobile .tab {
      display: inline-block !important;
      color: #fff !important;
      font-size: 16px !important;
      box-shadow: none !important;
      opacity: 1 !important; }
    #join-webinar .webinar-tabs .webinar-tabs-mobile svg {
      fill: #fff;
      transform: translateX(-50%) rotate(90deg); }
  #join-webinar .webinar-cards {
    overflow: hidden !important; }
    #join-webinar .webinar-cards .slider,
    #join-webinar .webinar-cards .item {
      position: relative !important;
      display: table !important;
      left: initial !important;
      height: 100% !important;
      width: 100% !important;
      max-width: 100% !important; }
    #join-webinar .webinar-cards .item {
      margin-bottom: 20px !important; }
    #join-webinar .webinar-cards .slidesjs-pagination {
      display: none !important; }
    #join-webinar .webinar-cards .card {
      min-height: 100% !important;
      text-align: left !important; }
      #join-webinar .webinar-cards .card .ac_button {
        position: absolute;
        bottom: 20px;
        right: 20px;
        left: 20px;
        width: auto !important; }
      #join-webinar .webinar-cards .card img {
        width: 100% !important;
        max-width: 100% !important; }
      #join-webinar .webinar-cards .card h4 {
        margin-bottom: 20px !important; }
      #join-webinar .webinar-cards .card p:not(.category) {
        display: none !important;
        font-size: 0 !important; }

  #training-office-hours {
    margin-bottom: 0 !important;
    background-image: none !important; }
    #training-office-hours .container {
      position: relative;
      width: 100% !important;
      padding: 0 !important; }
      #training-office-hours .container .show-mobile {
        display: block !important;
        height: 160px !important;
        padding: 0 !important;
        background-image: url(https://d226aj4ao1t61q.cloudfront.net/ctondjr8z_learn-standing-at-desk-bq.jpg);
        background-position: center !important;
        background-size: cover !important;
        background-repeat: no-repeat !important; }
      #training-office-hours .container .ac_container.bigshadow {
        padding: 20px !important;
        border-radius: 0;
        background-clip: padding-box;
        box-shadow: none !important; }
      #training-office-hours .container .select-go .ac_flex-col {
        margin-top: 20px !important;
        width: 100% !important;
        max-width: 100% !important; }

  [class*="-mobile"] .ac_dropdown-select {
    display: inline-block;
    vertical-align: baseline; }
    [class*="-mobile"] .ac_dropdown-select::after {
      width: 12px;
      height: 10px; }

  .modal .modal-dialog {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important; }
    .modal .modal-dialog .modal-content {
      width: 100% !important;
      max-width: 100% !important;
      border-radius: 0;
      background-clip: padding-box; }
      .modal .modal-dialog .modal-content .select-go .ac_flex-col {
        margin-top: 10px !important;
        margin-bottom: 10px !important;
        width: 100% !important;
        max-width: 100% !important; } }
