@font-face {
  font-family: "CamptonBookBold";
  src: url("../webfonts/Campton-Book-Bold.otf"); }

@font-face {
  font-family: "CamptonLight";
  src: url("../webfonts/Campton-Light.otf"); }

body {
  font-family: 'CamptonLight',Arial,sans-serif;
  font-size: 14px; }

h1, h2, h3 {
  font-family: 'CamptonBookBold',Arial,sans-serif; }

.product-view {
  position: relative;
  max-width: 100vw;
  max-height: 100vh;
  overflow: hidden; }
  .product-view .backdrop {
    position: absolute;
    min-height: 110vh;
    min-width: 110vw;
    height: 100%;
    width: 100%;
    left: -5vw;
    top: -5vh;
    z-index: -1; }
  .product-view .gallery {
    max-width: 100vw;
    max-height: 100vh; }
    .product-view .gallery .image-container {
      position: relative;
      width: 100vw;
      height: 100vh; }
      .product-view .gallery .image-container .image {
        position: relative;
        max-height: 100%;
        max-width: 100%;
        margin: 0 auto 0; }
    .product-view .gallery .sub-gallery {
      position: absolute;
      top: 0;
      left: 0;
      max-width: 100vw;
      max-height: 100vh; }
      .product-view .gallery .sub-gallery .sub-image-container {
        max-width: 100vw;
        max-height: 100vh; }
      .product-view .gallery .sub-gallery .sub-image {
        -o-object-fit: contain;
        object-fit: contain;
        -o-object-position: center;
        object-position: center;
        height: 100%;
        width: 100%; }
  .product-view .ui-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9; }
    .product-view .ui-overlay .brand {
      position: absolute;
      top: 0;
      left: 0;
      padding: 1rem; }
    .product-view .ui-overlay .product-series {
      padding-bottom: 2rem; }
      .product-view .ui-overlay .product-series .nav-pills {
        margin-left: -5px;
        margin-right: -5px; }
        .product-view .ui-overlay .product-series .nav-pills .nav-item {
          padding-left: 5px;
          padding-right: 5px; }
          .product-view .ui-overlay .product-series .nav-pills .nav-item .nav-link {
            position: relative;
            background-color: #000;
            color: #FFF;
            border-radius: 0; }
            .product-view .ui-overlay .product-series .nav-pills .nav-item .nav-link.active {
              background-color: #FFF;
              color: #000; }
              .product-view .ui-overlay .product-series .nav-pills .nav-item .nav-link.active:before {
                background-color: #FFF; }
              .product-view .ui-overlay .product-series .nav-pills .nav-item .nav-link.active:hover:before {
                height: 1rem; }
            .product-view .ui-overlay .product-series .nav-pills .nav-item .nav-link:before {
              content: '';
              display: block;
              height: 0;
              left: 0;
              width: 100%;
              background-color: #000;
              top: 100%;
              position: absolute;
              -webkit-transition: .5s;
              -o-transition: .5s;
              transition: .5s; }
            .product-view .ui-overlay .product-series .nav-pills .nav-item .nav-link:hover:before {
              height: 1rem; }
    .product-view .ui-overlay .model {
      list-style: none;
      text-align: right;
      color: #000;
      font-family: 'CamptonBookBold',Arial,sans-serif;
      font-size: 250%;
      font-weight: bold;
      line-height: 1; }
      .product-view .ui-overlay .model .size {
        color: #FFF; }
    .product-view .ui-overlay .details {
      position: absolute;
      width: 100%;
      max-width: 800px;
      top: 0;
      right: 0;
      padding: 1rem;
      opacity: 1;
      -webkit-transition: 2s;
      -o-transition: 2s;
      transition: 2s; }
      .product-view .ui-overlay .details.hidden {
        right: -100%;
        opacity: 0; }
      .product-view .ui-overlay .details header {
        margin-bottom: 2rem;
        color: #FFF; }
        .product-view .ui-overlay .details header h1 {
          font-size: 1000%;
          line-height: 1;
          color: #000; }
      .product-view .ui-overlay .details .code {
        font-size: 1600%;
        line-height: .8; }
      .product-view .ui-overlay .details main {
        margin-bottom: 2rem; }
    .product-view .ui-overlay .options {
      position: absolute;
      width: 100%;
      max-width: 50%;
      bottom: 0;
      left: 0;
      padding: 1rem;
      -webkit-transition: 2s;
      -o-transition: 2s;
      transition: 2s;
      opacity: 1; }
      .product-view .ui-overlay .options.hidden {
        left: -100%;
        opacity: 0; }
      .product-view .ui-overlay .options .col-small .row {
        margin-left: -5px;
        margin-right: -5px; }
        .product-view .ui-overlay .options .col-small .row > * {
          padding-left: 5px;
          padding-right: 5px; }
      .product-view .ui-overlay .options h3 {
        margin-bottom: 0; }
      .product-view .ui-overlay .options .nav-pills {
        margin-left: -5px;
        margin-right: -5px;
        padding-top: 1rem;
        padding-bottom: 1rem; }
        .product-view .ui-overlay .options .nav-pills .nav-item {
          padding-left: 5px;
          padding-right: 5px; }
          .product-view .ui-overlay .options .nav-pills .nav-item .nav-link {
            background-color: #AAA;
            color: #666;
            border-radius: 0;
            font-family: 'CamptonBookBold',Arial,sans-serif;
            font-size: 150%; }
            .product-view .ui-overlay .options .nav-pills .nav-item .nav-link.active {
              background-color: #000;
              color: #FFF; }
      .product-view .ui-overlay .options .swatch-container {
        padding: 1rem 0; }
        .product-view .ui-overlay .options .swatch-container .swatch {
          position: relative;
          display: block;
          height: auto;
          width: 100%;
          margin: 0 auto 0;
          padding-top: 100%;
          border-radius: 12%;
          border: 3px solid rgba(255, 255, 255, 0);
          -webkit-box-sizing: content-box;
          box-sizing: content-box;
          background-position: center;
          background-size: contain !important;
          background-repeat: no-repeat !important; }
          .product-view .ui-overlay .options .swatch-container .swatch:before {
            font-family: "Font Awesome 5 Free";
            font-weight: 900;
            content: "\f078";
            display: block;
            position: absolute;
            bottom: 125%;
            left: 50%;
            -webkit-transform: translate(-50%, 0);
            -ms-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
            color: #FFF;
            -webkit-transition: .5s;
            -o-transition: .5s;
            transition: .5s;
            opacity: 0;
            line-height: 1; }
          .product-view .ui-overlay .options .swatch-container .swatch:after {
            font-family: "Font Awesome 5 Free";
            font-weight: 900;
            content: "\f077";
            display: block;
            position: absolute;
            top: 125%;
            left: 50%;
            -webkit-transform: translate(-50%, 0);
            -ms-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
            color: #FFF;
            -webkit-transition: .5s;
            -o-transition: .5s;
            transition: .5s;
            opacity: 0;
            line-height: 1; }
          .product-view .ui-overlay .options .swatch-container .swatch:hover {
            border-color: white; }
            .product-view .ui-overlay .options .swatch-container .swatch:hover:before {
              bottom: 100%;
              opacity: 1; }
            .product-view .ui-overlay .options .swatch-container .swatch:hover:after {
              top: 100%;
              opacity: 1; }
        .product-view .ui-overlay .options .swatch-container.active .swatch {
          border-color: white; }
          .product-view .ui-overlay .options .swatch-container.active .swatch:before {
            bottom: 100%;
            opacity: 1; }
          .product-view .ui-overlay .options .swatch-container.active .swatch:after {
            top: 100%;
            opacity: 1; }
    .product-view .ui-overlay .controls {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
      .product-view .ui-overlay .controls .button {
        padding: 1rem;
        opacity: .5;
        font-size: 2rem;
        color: #FFF;
        background: transparent;
        border: none;
        outline: none !important;
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s; }
    .product-view .ui-overlay .actions {
      font-family: 'CamptonBookBold',Arial,sans-serif; }
      .product-view .ui-overlay .actions .btn {
        margin-bottom: 10px;
        padding: .5rem 1rem;
        font-size: 150%;
        font-weight: bold;
        clear: both;
        color: #FFF;
        border-radius: 0;
        border: none; }
      .product-view .ui-overlay .actions .social a {
        margin-left: .5em;
        color: #FFF; }