/* COLORS */
/* TYPOGRAPHY */
/* COMMON SPACING */
/* COLORS */
/* TYPOGRAPHY */
/* COMMON SPACING */
.navigation {
  overflow: hidden;
}

.navigation .icon {
  display: none;
}

.logo-img.mobile {
  display: none;
}

@media screen and (max-width: 768px) {
  #header-bar {
    padding: 0;
  }

  #header-bar #header-bar-wrapper ul.navigation {
    display: flex;
    justify-content: space-between;
    min-width: 100%;
    width: 100%;
  }
  #header-bar #header-bar-wrapper ul.navigation li.nav-item {
    min-width: 100%;
    padding: 0;
    width: 100%;
  }
  #header-bar #header-bar-wrapper ul.navigation li.nav-item.selected {
    background-size: 11.85rem;
  }
  #header-bar #header-bar-wrapper ul.navigation li.nav-item a {
    height: inherit;
    min-width: 100%;
    padding: 1rem 0;
    width: 100%;
  }

  .logo-img {
    display: none;
  }

  .navigation li {
    display: none;
  }

  div.logo-img.mobile {
    display: block;
    height: 3.25rem;
    padding: 0.8125rem 0 0.8125rem 3.125rem;
  }
  div.logo-img.mobile img {
    display: flex;
    height: 3.25rem;
    margin-left: 1.625rem;
    width: auto;
  }

  .navigation .icon {
    color: #3a3434;
    display: flex;
    font-size: 2rem;
    padding: 1.4rem 1rem 1.4rem 1rem;
    position: absolute;
    right: 26px;
    text-decoration: none;
    top: 0;
  }

  .navigation .icon:hover {
    color: #105f81;
  }

  .navigation.responsive {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
  }

  .navigation.responsive .icon {
    position: absolute;
    right: 26px;
    top: 0;
  }

  #header-bar ul.navigation.responsive li.nav-item {
    background-position-x: center;
    background-position-y: bottom;
    background-size: 10.8rem;
    border-top: 0.0625rem solid #bbbbbb;
    display: flex;
    float: none;
    padding: 0;
    text-align: center;
    width: 100%;
  }
  #header-bar ul.navigation.responsive li.nav-item a {
    padding-top: 0.9rem;
    padding-bottom: 0.8rem;
    width: 100%;
  }

  #toolbar {
    padding: 0 1.625rem;
  }

  .main-content.responsive {
    height: calc(100% - 11.422rem);
  }

  .main-content.portfolio.responsive {
    height: calc(100% - 14.2344rem);
  }
}
@media screen and (max-width: 590px) {
  #about .split {
    display: flex;
    flex-direction: column;
  }
  #about .split .left {
    margin-right: 0;
    margin: 0 auto;
    margin-bottom: 1rem;
  }
  #about .split .left img {
    height: 15.625rem;
    width: auto;
  }
  #about .split .right {
    border-bottom: 0.0625rem solid #bbbbbb;
    border-top: 0.0625rem solid #bbbbbb;
    margin: 0 auto;
    padding: 1rem 2rem;
  }
}
/* 
TABLE OF CONTENTS
    - FILTER STYLES
    - ISOTOPE STYLES : CLEARFIX 
    - GRID
    - GRID ITEM
      - SPECIFIC PER PROJECT IMG
    - GRID ITEM HOVER STYLES
    - RESPONSIVE STYLES
      - ISOTOPE RELATED QUERIES
*/
/* ===== FILTER STYLES ===== */
label[for=categories] {
  color: #262021;
  font-size: 0.875rem;
  font-family: "Nunito", sans-serif;
  font-weight: 800;
  letter-spacing: 0.025rem;
  padding-right: 0.25rem;
  text-transform: uppercase;
}

select, select:visited {
  border: none;
  border-radius: 0.25rem;
  color: #262021;
  cursor: pointer;
  font-size: 0.875rem;
  font-family: "Nunito", sans-serif;
  font-weight: 600;
  height: 1.75rem;
  outline: 0.0625rem solid #999999;
  padding: 0 0.25rem;
  width: 12rem;
  border-right: 0.25rem solid transparent;
}

select:hover {
  outline: 0.0625rem solid #2188b4;
}

select:active, select:focus {
  outline: 0.0625rem solid #105f81;
}

/* ========== */
/* ===== ISOTOPE STYLES : CLEARFIX ===== */
.isotope:after {
  content: "";
  display: block;
  clear: both;
}

/* ========== */
/* ===== GRID ===== */
#grid-container {
  background-color: #f0f0f0;
}

#grid-wrapper {
  margin: auto;
  max-width: 1310px;
  padding: 0.5rem 1.5rem;
}

.grid {
  margin: 0 auto;
  width: 100%;
}

/* ========== */
/* ===== GRID ITEM ===== */
.grid-item {
  float: left;
  height: 12.5rem;
  margin: 1.5rem;
  width: calc(33.333333% - 3rem);
  /* ===== SPECIFIC PER PROJECT IMG ===== */
}
.grid-item a.proj-item-link {
  text-decoration: none;
}
.grid-item a.proj-item-link .proj-title {
  align-items: center;
  border-bottom: 0.2rem solid #105f81;
  color: #105f81;
  display: flex;
  justify-content: space-between;
  padding: 0 0.25rem 0.1rem 0.25rem;
}
.grid-item a.proj-item-link .proj-title p.link-title {
  font-size: 0.875rem;
  font-weight: 900;
  letter-spacing: 0.05rem;
  margin: 0;
  text-transform: uppercase;
}
.grid-item a.proj-item-link .proj-title i {
  font-size: 1.1rem;
}
.grid-item .proj-img-container {
  border: 0.0625rem solid #bbbbbb;
  border-top: none;
  height: calc(100% - 1.486875rem);
}
.grid-item .proj-img-container.tcdesignsystem {
  background: url(../../images/proj-tcdesignsystem.png),#ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.tqlgenerator {
  background: url(../../images/proj-tqlgenerator.png),#ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.sharingtqlqueries {
  background: url(../../images/proj-sharedsavedqueries.png),#ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.adminredesignia {
  background: url(../../images/proj-adminredesignia.png),#ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.intelreq {
  background: url(../../images/proj-intelligencerequirements.png),#ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.tablecol {
  background: url(../../images/proj-tablecolumnresizereorder.png),#ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.threatgraph {
  background: url(../../images/proj-threatgraph.png),#ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.customdetails {
  background: url(../../images/proj-customdetails.png), #ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.agenticchat {
  background: url(../../images/proj-agenticchat.png), #ffffff;
  background-position-x: left;
  background-position-y: bottom;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.dashboardredesign {
  background: url(../../images/proj-dashboardredesign.png), #ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.timelineanalysis {
  background: url(../../images/proj-timeline.png), #ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.uxstyleguide {
  background: url(../../images/proj-uxstyleguide.png), #ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.sota {
  background: url(../../images/proj-sota.png), #ffffff;
  background-position-x: center;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.onesky {
  background: url(../../images/proj-onesky.png), #ffffff;
  background-position-x: center;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.helpdocs {
  background: url(../../images/proj-unifyhelp.png), #ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.teamplanning {
  background: url(../../images/proj-teamplanning.png), #ffffff;
  background-position-x: center;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.edp {
  background: url(../../images/proj-edp.png), #ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.bco {
  background: url(../../images/proj-bcopersonas.png), #ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.uf {
  background: url(../../images/proj-uf.png), #ffffff;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.grid-item .proj-img-container.i70watch {
  background: url(../../images/proj-i70watch.png), #ffffff;
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.grid-item .proj-img-container.i70widget {
  background: url(../../images/proj-i70today.png), #ffffff;
  background-position-x: center;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.fra {
  background: url(../../images/proj-frontrowagile.png), #ffffff;
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.grid-item .proj-img-container.pacingguide {
  background: url(../../images/proj-pacingguide.png), #ffffff;
  background-position-x: center;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.deepsee {
  background: url(../../images/proj-deepsee.png), #ffffff;
  background-position-x: center;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.wud {
  background: url(../../images/proj-wud.svg), #ffffff;
  background-position-x: left;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.tapdatx {
  background: url(../../images/proj-tapdatx.png), #ffffff;
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.grid-item .proj-img-container.clinic {
  background: url(../../images/proj-clinic.jpg), #ffffff;
  background-position-x: top;
  background-position-y: left;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.cadbury {
  background: url(../../images/proj-cadbury.jpg), #ffffff;
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.playfair {
  background: url(../../images/proj-playfair.jpg), #ffffff;
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.nietzsche {
  background: url(../../images/proj-nietzsche.jpg), #ffffff;
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.kinetic {
  background: url(../../images/proj-kinetic.jpg), #ffffff;
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.grid-item .proj-img-container.gnome {
  background: url(../../images/proj-friendlygnome.jpg), #ffffff;
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* ========== */
/* ===== GRID ITEM HOVER STYLES ===== */
a.proj-item-link:hover {
  text-decoration: none;
}
a.proj-item-link:hover .proj-title {
  border-bottom: 0.2rem solid;
  border-color: #2188b4;
  color: #2188b4;
}
a.proj-item-link:hover .proj-img-container {
  border: 0.0625rem solid #2188b4;
  border-top: none;
  opacity: 0.8;
}

/* ========== */
/* RESPONSIVE STYLES */
@media only screen and (max-width: 1152px) {
  /* ISOTOPE RELATED QUERIES */
  .grid-item {
    height: 12.5rem;
    width: calc(50% - 3rem);
  }
}
@media screen and (max-width: 768px) {
  #grid-wrapper {
    padding: 0.5rem 0rem;
  }

  .grid-item {
    height: 12.5rem;
    margin: 1.625rem;
    width: calc(50% - 3.25rem);
  }
}
@media only screen and (max-width: 720px) {
  /* ISOTOPE RELATED QUERIES */
  #grid-wrapper {
    padding: 0.5rem 0rem;
  }

  .grid-item {
    height: 13.5rem;
    margin: 1.625rem;
    width: calc(100% - 3.25rem);
  }
}

/*# sourceMappingURL=isotope.css.map */
