/* --------------------------------------------------------- WORK */
/* ========================================================= VARIABLES */
:root {
  --portfolio-dark: hsl(199,16%,35%);
  --portfolio-light: hsl(42,67%,93%);
  --portfolio-header: hsl(41,29%,89%);
  --portfolio-accent: hsl(25,78%,48%);
  --portfolio-accent-light: hsl(25, 78%, 65%);
  --portfolio-gray: hsl(25,20%,40%);
  --themeColor: #005B69;
  --themeColor-accent: #DB6B1A;
  --textDark: #4A5D66;
  --textLight: #FBF2EA; }

body.workTOC-2 {
  background: #EBE6DB;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr auto;
  height: 100vh;
  grid-template-areas: "main" "siteFooter"; }
  body.workTOC-2 main {
    grid-area: main;
    margin: 0; }
    @media (min-width: 720px) {
      body.workTOC-2 main {
        margin: 0; } }
    body.workTOC-2 main h1 {
      color: #005B69;
      font-size: 3em;
      line-height: 1.6; }
    body.workTOC-2 main ul {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      grid-gap: 10px; }
    body.workTOC-2 main li {
      display: flex;
      align-items: flex-end;
      justify-content: flex-start;
      border-radius: 6px;
      padding: 1em;
      min-height: 15vh; }
      body.workTOC-2 main li.digital {
        background: #007FAC; }
      body.workTOC-2 main li.traditional {
        background: #003446; }
      body.workTOC-2 main li:hover {
        background: #005B69; }
      body.workTOC-2 main li a {
        display: inline-block;
        width: 100%;
        height: 100%; }
      body.workTOC-2 main li a:link,
      body.workTOC-2 main li a:visited {
        color: #79dcff; }
      body.workTOC-2 main li a:hover,
      body.workTOC-2 main li a:active {
        color: #69ebff; }
      body.workTOC-2 main li h2 {
        line-height: 1.2; }
      body.workTOC-2 main li p {
        font-size: .8em;
        letter-spacing: .03em;
        line-height: 1.4;
        text-transform: uppercase; }
    body.workTOC-2 main h2 {
      font-family: HeadingNow34, "HelveticaNeue-Condensed", "Arial Narrow", sans-serif; }
    body.workTOC-2 main p {
      font-family: "Open Sans", Helvetica, Arial, sans-serif; }
  body.workTOC-2 header.workHeader {
    position: relative;
    display: flex;
    align-items: flex-end;
    background-image: url("../images/cogs-tilted-w.svg");
    background-repeat: no-repeat;
    background-size: 50%;
    min-height: 33vh; }
    @media (min-width: 960px) {
      body.workTOC-2 header.workHeader {
        min-height: 50vh; } }
    body.workTOC-2 header.workHeader > div {
      margin: 6em; }
    body.workTOC-2 header.workHeader p {
      color: var(--portfolio-gray);
      font-family: "PT Serif", Georgia, serif;
      font-size: 2em;
      font-style: italic;
      letter-spacing: 0;
      line-height: 1; }
    body.workTOC-2 header.workHeader h1 {
      color: var(--themeColor);
      font-family: HeadingNow34, "HelveticaNeue-Condensed", "Arial Narrow", sans-serif;
      font-size: 6.4em;
      font-weight: normal;
      line-height: 1; }

section.workTOC-section-large {
  margin: 0; }
  section.workTOC-section-large div.workCard-large {
    padding: 3em 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #faf6f4;
    min-height: 700px;
    font-size: 1rem; }
    section.workTOC-section-large div.workCard-large:nth-child(even) {
      background-color: #EBE6DB; }
    @media (min-width: 720px) {
      section.workTOC-section-large div.workCard-large {
        min-height: 1000px; } }
    @media (min-width: 960px) {
      section.workTOC-section-large div.workCard-large {
        min-height: 800px; } }
    section.workTOC-section-large div.workCard-large .workTOC-section-large-wrapper {
      display: flex;
      flex-direction: column;
      width: 80%; }
      @media (min-width: 960px) {
        section.workTOC-section-large div.workCard-large .workTOC-section-large-wrapper {
          flex-direction: row; } }
    section.workTOC-section-large div.workCard-large .workCard-large-img,
    section.workTOC-section-large div.workCard-large .workCard-large-txt {
      position: relative; }
    @media (min-width: 960px) {
      section.workTOC-section-large div.workCard-large .workCard-large-img {
        width: 50%; } }
    @media (min-width: 960px) {
      section.workTOC-section-large div.workCard-large .workCard-large-txt {
        width: 50%; } }
    section.workTOC-section-large div.workCard-large h2 {
      margin: 0 0 24px 0;
      padding: 0;
      color: var(--portfolio-dark);
      font-size: 6.4em;
      font-weight: normal;
      line-height: 1; }
    section.workTOC-section-large div.workCard-large h3 {
      margin: 0 0 16px 0;
      padding: 0;
      color: var(--portfolio-gray);
      font-size: 2.1em;
      line-height: 1;
      font-weight: 400;
      text-transform: uppercase;
      letter-spacing: .02em; }
    section.workTOC-section-large div.workCard-large p {
      margin: 0 0 48px 0;
      padding: 0;
      color: var(--portfolio-gray);
      font-style: italic;
      font-size: 1.8em;
      line-height: 1.5; }
    section.workTOC-section-large div.workCard-large a {
      margin: 0;
      border: 1px solid var(--portfolio-accent-light);
      border-radius: 6px;
      padding: .75em 3em;
      background-color: transparent;
      color: var(--portfolio-dark);
      font-size: 1.6em;
      font-weight: bold;
      letter-spacing: .02em;
      text-transform: uppercase; }
      section.workTOC-section-large div.workCard-large a:hover {
        color: white;
        background-color: var(--portfolio-accent); }
    @media (min-width: 720px) {
      section.workTOC-section-large div.workCard-large h2 {
        margin: 0 0 24px 0;
        font-size: 10em; }
      section.workTOC-section-large div.workCard-large h3 {
        margin: 0 0 18px 0; }
      section.workTOC-section-large div.workCard-large p {
        margin: 0 0 48px 0;
        font-size: 2.7em; } }
    @media (min-width: 960px) {
      section.workTOC-section-large div.workCard-large h2 {
        margin: 0 0 36px 0;
        font-size: 12.8em; }
      section.workTOC-section-large div.workCard-large p {
        margin: 0 0 64px 0;
        font-size: 2.7em; } }
    section.workTOC-section-large div.workCard-large img {
      margin: 0 0 3em 0;
      width: 60%;
      height: auto; }
      @media (min-width: 720px) {
        section.workTOC-section-large div.workCard-large img {
          width: 60%; } }
      @media (min-width: 960px) {
        section.workTOC-section-large div.workCard-large img {
          position: absolute;
          right: 12em;
          width: auto;
          height: 100%; } }
section.workTOC-section-small {
  margin: 0;
  padding: 0;
  background-color: var(--portfolio-dark);
  /*
	div a {
		padding: 1em;
		background-color: rgba($themeAccentColor,.7);
		&:hover {
			background-color: rgba($themeAccentColor,1);
		}
	}
	*/ }
  section.workTOC-section-small .workTOC-section-small-wrapper {
    margin: 0 auto;
    padding: 4em 0;
    width: 320px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px; }
    @media (min-width: 720px) {
      section.workTOC-section-small .workTOC-section-small-wrapper {
        grid-template-columns: repeat(2, 1fr);
        width: 670px;
        justify-content: center; } }
    @media (min-width: 1200px) {
      section.workTOC-section-small .workTOC-section-small-wrapper {
        grid-template-columns: repeat(3, 1fr);
        width: 1020px; } }
  section.workTOC-section-small .workCard-small-outer {
    padding: 2em;
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.15) inset;
    display: flex;
    flex: 0 1 auto;
    background-color: #005B69;
    width: 320px;
    height: 320px; }
    section.workTOC-section-small .workCard-small-outer a {
      width: 100%; }
  section.workTOC-section-small .workCard-small-middle {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.45);
    width: 100%;
    height: 100%; }
    section.workTOC-section-small .workCard-small-middle:hover {
      background-color: rgba(219, 107, 26, 0.9); }
  section.workTOC-section-small .workCard-small-inner {
    line-height: 1.5;
    text-align: center;
    width: 90%; }
    section.workTOC-section-small .workCard-small-inner h2 {
      font-size: 2.4em; }
    section.workTOC-section-small .workCard-small-inner p {
      margin-top: .25em;
      line-height: 1.2; }
  section.workTOC-section-small h2 {
    color: #f7eba2 !important;
    line-height: 1; }
  section.workTOC-section-small h2 span {
    padding: 0 0 2px 0;
    background-color: lightblue; }
  section.workTOC-section-small p {
    color: white;
    text-transform: uppercase; }

div.usaa-auto-loan {
  background-image: url("../images/cardBg/cardBg-RAW-usaa-auto-loan.png");
  background-size: cover; }

div.usaa-cbs {
  background-image: url("../images/cardBg/cardBg-RAW-usaa-cbs.png");
  background-size: cover; }

div.usaa-cbs-sunset {
  background-image: url("../images/cardBg/cardBg-RAW-usaa-cbs-sunset.png");
  background-size: cover; }

div.cstate-viewbook {
  background-image: url("../images/cardBg/cardBg-cstate-viewbook.jpg");
  background-size: cover; }

div.cstate-website {
  background-image: url("../images/cardBg/cardBg-cstate-website.jpg");
  background-size: cover; }

div.rockthistown {
  background-image: url("../images/cardBg/cardBg-rockthistown.jpg");
  background-size: cover; }

div.cstate-begreat {
  background-image: url("../images/cardBg/cardBg-cstate-be-great.jpg");
  background-size: cover; }

div.cstate-tweet {
  background-image: url("../images/cardBg/cardBg-cstate-tweet.jpg");
  background-size: cover; }

div.jtm-soup {
  background-image: url("../images/cardBg/cardBg-jtm-soup.jpg");
  background-size: cover; }

div.jtm-philly {
  background-image: url("../images/cardBg/cardBg-jtm-philly.jpg");
  background-size: 150%; }

div.brand {
  background-image: url("../images/cardBg/cardBg-brand.svg");
  background-size: 150%; }

div.mgt {
  background-image: url("../images/cardBg/cardBg-mgt.jpg");
  background-size: cover; }

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