/* ========== HERO SIZE (small) ========== */
#hero.module-hero{
  height: 360px;
  max-height: 360px;
  min-height: 220px;
  padding: 0 !important;
  margin: 0 !important;
  background: #fff;     /* letterbox color */
}

/* Wrapper for the video */
#hero .video-hero{
  position: relative;
  height: 100%;
  overflow: hidden;
  background: #fff;
}

/* Video: NO CROP EVER */
#hero .video-hero .bg-video{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;

  display: block;
  z-index: 1;
}

/* Overlay (off) */
#hero .video-hero .video-overlay{
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  z-index: 2;
}

/* Hide sidebar ONLY on homepage */
body.home .sidebar,
body.home #sidebar,
body.home .side-wrapper,
body.home .sidebar-wrapper {
  display: none !important;
}


/* Make the portfolio container centered and not weirdly stretched */
#portfolio .container-fluid{
  padding-left: 15px !important;
  padding-right: 15px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 1400px; /* optional: keeps it from being ultra-wide */
}

@media (min-width: 1200px){
  #portfolio .work-item{
    width: 33.333% !important;   /* 3 per row */
  }
}

/* Make portfolio truly full width */
#portfolio .container,
#portfolio .container-fluid{
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
  margin: 0 !important;
}

/* =========================
   SIDEBAR ANIMATED LOGO
   ========================= */

.sidebar,
.sidebar .navbar,
.sidebar .navbar-header{
  overflow: hidden;
}

.sidebar .navbar-header{
  height: px;              /* header bar height */
}

.sidebar .sidebar-mark{
  display: block;
  float: left;               /* like .navbar-brand */
  height: 800px;
  padding: 10px 10px;
  line-height: 0;
  box-sizing: border-box;
}

.sidebar .sidebar-anim{
  display: block;
  height: 800px;              /* <-- animation size */
  width: auto;
  max-width: 100%;
  object-fit: contain;
}

.home .sidebar { display: none !important; }

/* Hide sidebar ONLY on homepage */
body.home .sidebar,
body.home #sidebar {
  display: none !important;
}

/* Homepage: reclaim space that sidebar normally takes */
body.home .wrapper {
  margin-left: 0 !important;
  padding-left: 0 !important;
}