/**
 * Theme Name: Wolfram Consulting
 * Theme URI: http://www.wolfram.consulting.com/
 * Description: Wolfram Consulting Theme, 2023
 * Version: 1.0
 * Author: Wolfram Research
 * Author URI: http://www.wolfram.consulting.com/
 * Tags: Wolfram
 *
 *     Contact WBI for problems or updates to this theme
 *
 *     requires: /common/framework/css/framework.css
 */


/* ==========================================================================
   SITE SETUP
   ========================================================================== */
:root {
    /*measurements*/
    --wrapper-h-pad:  3.125rem;  /*  50px*/
    --page-width:    64.5rem;    /*1032px*/
    --gutter:         1.5625rem; /*  25px*/
    --hero-bg:       26.5625rem; /* 425px*/
    --subhero-bg:    11.875rem;  /* 190px*/

    /*colors*/
    --nearly-black:  #0a141c;
    --darkest-blue:  #132535;
    --darker-blue:   #1b354c;
    --dark-blue:     #1268b5;
    --main-blue:     #3b81c0;
    --alt-blue:      #4e8dc6;
    --light-blue:    #75beff;
    --lightest-blue: #bfdad8;
}

html { 
    border: none;
    font-family: 'Fira Sans', Arial, sans-serif; 
    font-variant-ligatures: no-common-ligatures;
}
body {
    min-height: 100vh;
    position: relative;
}
body main { padding-bottom: 4.5rem; }


/*container*/
.page-width {
    margin: 0 auto;
    max-width: calc(var(--page-width) + (2 * var(--wrapper-h-pad)));
    padding: 3.375rem var(--wrapper-h-pad) 3.75rem;
    width: 100%;
}
.page-width.rule-above { padding-top: 0; }
.page-width.rule-above::before { 
    border-top: 1px solid #ccc;
    content: '';
    display: block;
    grid-column-end: span 6; 
}


/*container modifiers*/
.dark-bg h1,
.dark-bg h2,
.dark-bg p:not(article *) { 
    color: #fff; 
}
.sticky-bg {
    background-attachment: fixed !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}


/*text*/
main h1 { 
    font-size: 2.375rem;
    font-weight: 700;
    line-height: 3.75rem;
}

main h2, 
.single-post h1,
.error404 h1 {
    color: var(--main-blue); 
    font-size: 1.5625rem;
    font-weight: 700;
    line-height: 1.5;
    padding-bottom: 1.875rem;
}
main .page-width.rule-above h2 { padding-top: 2.75rem; }
.articles > h2 { padding-bottom: 2.75rem; }
.about-grid > h2 { padding-bottom: 0; }
#logos h2 { padding-bottom: 1.5rem; }
#contact-us h2 { padding-bottom: 1.375rem; }

main h3 {
    color: var(--darkest-blue);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.5;
    padding-bottom: 1rem;
}
#page-content.services section h3 { padding-bottom: 1rem; }
#management-team h3 { padding-bottom: 0; }
main .txt h3 { padding-bottom: 0; line-height: 1.5rem; }

main h4 {
    color: var(--main-blue);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
}

main p {
    color: #444;
    line-height: 1.5;
    padding-bottom: 1rem;
}
main p:last-child { padding-bottom: 0; }


/*special text*/
.two-col {
    column-count: 2;
    column-gap: 3rem;
    padding-bottom: 1rem;
}
ul.two-col:last-child { margin-bottom: -1rem; }
.two-col li { break-inside: avoid; }

main ul li {
    color: #444;
    line-height: 1.5;
    padding: 0 0 1rem 0.75rem;
    position: relative;
}
main ul li::before {
    color: var(--main-blue);
    content: '\25AA';
    margin-left: -0.75rem;
    position: absolute;
}

main hr { 
    border-bottom: none; 
    border-top: 1px solid #ccc; 
    margin: 1rem 0;
}


/*links*/
main a { color: var(--main-blue); }
main a:hover { color: var(--darkest-blue); }

article h3 a { color: var(--darkest-blue); }
article h3 a:hover { color: var(--main-blue); }

article h4 a { color: var(--main-blue); }
article h4 a:hover { color: var(--dark-blue); }


/*buttons*/
p.buttons { 
   display: flex;
   padding-bottom: 0; 
}
a.button {
    background: var(--main-blue);
    color: #fff;
    display: inline-block;
    font-weight: 700;
    padding: 0.5rem 1.25rem;
}
a.button:hover { background: var(--dark-blue); color: #fff; }
a.button + a.button { margin-left: 0.75rem; }



/*for admins*/
.editable { position: relative; }
.editable.hovered { 
    border: 1px dashed #fe0000; 
    border-radius: 0.375rem; 
}
a.edit-link { 
   background: #dd1100; 
   border: 1px solid #b00f00;
   border-radius: 0.25rem;
   color: #fff !important; 
   font-size: 0.875rem;
   padding: 0.25rem 0.5rem 0.125rem;
   position: absolute;
   right: 0;
   text-transform: uppercase;
   top: 0;
}
a.edit-link:hover { background: #fe0000; }
a.edit-link:active { background: #b00f00; }
body[class*="page-template-preview"] #contact-us { display: none; }


/*anchors*/
article { scroll-snap-type: y proximity; }
article *[id] {
    scroll-margin-top: 60px;
    scroll-snap-margin-top: 60px;
    scroll-snap-align: start;
    scroll-snap-stop: normal;
}



/* ==========================================================================
   TOP NAV
   ========================================================================== */
body > header { background: var(--nearly-black); color: #fff; }
#topnav { 
    align-items: center;
    display: grid;
    grid-gap: var(--gutter);
    grid-template-columns: calc(250px + var(--wrapper-h-pad)) 1fr;
    height: 85px;
    position: relative;
    transition: height 0.25s ease-in-out;
    overflow: hidden;
}


/*logo*/
#topnav > a { 
    display: flex; 
    margin-left: var(--wrapper-h-pad);
}


/*menu items*/
#topnav ul {
    font-weight: 700;
    justify-self: end;
    line-height: 1rem;
    margin-right: var(--wrapper-h-pad);
}
#topnav ul a { color: #fff; }
#topnav ul a:hover { color: var(--main-blue); }
#topnav ul li { display: inline; padding: 0 0.875rem; }

#topnav .contact a { 
    background: var(--main-blue); 
    padding: 0.5rem 0.625rem; 
    transition: padding 0.125s ease-in-out;
}
#topnav .contact a:hover { background: var(--dark-blue); color: #fff; }
#topnav ul li.linked-in-top { padding-right: 0; }


/*highlighted*/
.mobile-menu .line:hover,
.category-insights #topnav .insights a,
.category-client-results #topnav .client-results a,
.p-services #topnav .services a,
.p-about #topnav .about a,
.p-careers #topnav .careers a { 
    color: var(--light-blue); 
}


/*sticky*/
body > header.is-sticky { 
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 100000;
}
body.admin-bar > header.is-sticky { top: 32px; }
.is-sticky #topnav { height: 48px; /*same as mobile nav*/ }
.is-sticky #topnav ul { line-height: 16px; }
.is-sticky #topnav .contact a { padding: 1.5rem 0.625rem; }
body > header.is-sticky + main { margin-top: 85px; }


/*hamburger*/
.mobile-menu { 
    display: none; /*is flex at 600*/
    flex-direction: column;
    height: 19px;
    justify-content: space-between;
    justify-self: end;
    width: 24px;
}
.mobile-menu .line {
  background: #fff;
  border-radius: 10px;
  height: 3px;
  width: 100%;
}
.mobile-menu .line1 {
  transform-origin: 100% 0%;
  transition: transform 0.25s ease-in-out;
}
.mobile-menu .line2 { 
  transition: transform 0.125s ease-in-out;
}
.mobile-menu .line3 { 
  transform-origin: 100% 100%;
  transition: transform 0.25s ease-in-out;
}
.mobile-menu:hover .line { background: var(--main-blue); }

.mobile-menu.clicked .line1 { transform: rotate(-45deg) translate(-15%, -115%); }
.mobile-menu.clicked .line2 { transform: scaleY(0); }
.mobile-menu.clicked .line3 { transform: rotate(45deg) translate(-13%, 113%); }




/* ==========================================================================
   HERO
   ========================================================================== */
#hero { 
    background: var(--darkest-blue); 
    background-position: right;
    background-repeat: no-repeat;
}
#hero .page-width {
    align-items: center;
    display: grid;
    grid-template-columns: 1fr;
    height: auto;
    min-height: var(--hero-bg);
    padding: 0 var(--wrapper-h-pad);
}


/*home (w/video)*/
.home #hero { position: relative; }
.home #hero #video-wrapper { 
    height: var(--hero-bg);
    overflow: hidden;
    position: absolute;
    width: 100%;
    z-index: 1;
}
.home #hero #video {
    height: 100%;
    object-fit: cover;
    width: 100%;
}
.home #hero .page-width {
    position: relative;
    z-index: 2;
}
.home #hero .page-width > div {
    align-self: end;
}
.home #hero h1 { 
    border-bottom: 1px solid #c1e4ff;
    max-width: 50rem;
    padding-bottom: 2.625rem;
    width: fit-content;
}
.home #hero h2 {
    align-self: start;
    color: #c1e4ff;
    font-size: 1.125rem;
    font-style: italic;
    font-weight: 300;
    max-width: 50rem;
    padding: 0.5rem 0 0;
}


/*subpages*/
#hero.subpage {
    background-image: url('images/hero-points.jpg'); /*default*/
    background-size: auto var(--subhero-bg);
}
#hero.subpage .page-width  { 
    min-height: var(--subhero-bg); 
}
.category-insights #hero.subpage { background-image: url('images/hero-tablet.jpg'); } 
.category-client-results #hero.subpage { background-image: url('images/hero-points.jpg'); } 
.p-services #hero.subpage { background-image: url('images/hero-mesh.jpg'); }
.p-about #hero.subpage { background-image: url('images/hero-screens.jpg'); }

#hero.subpage h1 { line-height: 1.2; }




/* ========================================================================== 
   FEEDS
   ========================================================================== */
/*level 1*/
.articles {
    display: grid;
    grid-gap: 0 2rem;
    grid-template-columns: repeat(6, 1fr);
}
.articles > article { background: #fff; }

.span-2 { grid-column-end: span 2; }
.span-6 { grid-column-end: span 6; }


/*level 2*/
article.span-6 { 
    align-items: start;
    display: grid;
    grid-gap: 2rem;
    grid-template-columns: 1fr 1fr;
}
article.span-6 .post-thumbnail { order: 1; }
article.span-6 div.txt {
    display: grid;
    order: 2; 
}


/*level 3*/
div.clampy { 
    display: -webkit-box;
    max-height: 14.0625rem; /*thumbnail (250) minus read more line (25)*/
    order: 2;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical; 
    overflow: hidden;
}
a.more-link { 
   line-height: 1.5;
   order: 3;
}


/*alternating and etc*/
article.span-6:not(:first-of-type) {
    border-top:1px solid #ccc;
    margin-top: 3.125rem;
    padding-top: 3.125rem;
}
article.span-6:nth-of-type(even) div.txt { order: 1; }
article.span-6:nth-of-type(even) .post-thumbnail { order: 2; }


/*grid background exceptions*/
article.span-2 .post-thumbnail { aspect-ratio: 16 / 9; }
article.span-6 .post-thumbnail, 
.single-post .post-thumbnail { 
    aspect-ratio: 2 / 1;
}


/*content*/
.post-thumbnail {
    background-position: center; 
    background-repeat: no-repeat;
    background-size: auto 100%;
    display: flex;
    transition: background-size 0.25s ease-in-out;
    width: 100%; 
    height: auto;
}
a.post-thumbnail:hover { background-size: auto 125%; }
article .wp-content p { padding-bottom: 0; }
article .wp-content p + p { display: none; }

h4.cat {
    display: flex;
    line-height: 1.5rem;
    padding-bottom: 0.625rem;
}
h4.cat a:not(:last-child)::after {
    content: ',';
    display: inline-flex;
    margin-left: -2px; 
    margin-right: 6px;
}
span.count { display: none; }

.articles .more-btn { 
    grid-column-end: span 6; 
    margin: 3.125rem auto 0 ;
}


/*related*/
#related-posts { background: var(--darker-blue) url('images/bg-lines-2.jpg'); }
.single-post #related-posts { background-image: url('images/bg-dots-2.jpg'); }
#related-posts .articles { grid-gap: 0 var(--gutter); }
#related-posts div.txt { padding: 1.25rem; }




/* ========================================================================== 
   SINGLE POST
   ========================================================================== */
.single-post article > .wp-single-content { padding: 0; }
.wp-single-content::after {
    content: "";
    clear: both;
    display: table;
}
.wp-single-content .post-thumbnail {
    float: left;
    margin: 0.25rem var(--gutter) 1rem 0;
    max-width: calc(50% - calc(var(--gutter) / 2)); 
}
.wp-single-content img { 
    clear: both;
    height: auto; 
    max-width: 100%; 
}

#testimonial {
    background: #f4f8fc;
    border-left: 5px solid #75a6d2;
    margin-top: 0.5rem;
    padding: 1.5rem 1.5625rem;
}


/*share this*/
/* 
#social-sharing { 
   display: flex; 
   padding-top: 2.5rem;
}
#social-sharing * { box-sizing: content-box; }
#social-sharing .stButton { margin-left: 0; margin-right: 0.5rem; }
#social-sharing .stButton .stBubble_hcount { padding-left: 3px; padding-right: 3px; }
#social-sharing .stMainServices { border-radius: 4px; width: 24px; }
#social-sharing .stMainServices.st-facebook-counter{ width: 22px; }
#social-sharing .stMainServices.st-twitter-counter,
.stMainServices.st-sharethis-counter { width: 23px; }
 */




/* ========================================================================== 
   CATEGORY ARCHIVE
   ========================================================================== */
.archive.category .articles {
    padding-bottom: 3.125rem;
    padding-top: 3.125rem;
}




/* ========================================================================== 
   SERVICES
   ========================================================================== */
#page-content #intro .buttons {
    display: grid;
    grid-gap: 1.875rem var(--gutter);
    grid-template-columns: 1fr 1fr 1fr; 
    grid-template-rows: 1fr 1fr 1fr; 
    padding-top: 2.75rem; 
}
#page-content #intro .button { 
    margin-left: 0; 
    width: 100%;
    height: 100%;
    text-align: center;
    padding: 0.75rem 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
#page-content.services section:not(:first-of-type) {
    border-top:1px solid #ccc;
    margin-top: 3.125rem;
    padding-top: 3.125rem;
}

#page-content.services section:not(:first-of-type) article > *:last-child,
#page-content.services section:not(:first-of-type) article > *:last-child > *:last-child {
    padding-bottom: 0
}


article.single-img {
    display: grid;
    grid-gap: var(--gutter);
    grid-template-columns: repeat(6, 1fr);
}
article.single-img .edit-link { grid-column-end: span 6; }
article.single-img .img { grid-column-end: span 2; }
article.single-img .txt { grid-column-end: span 4; }

article.multi-img .img {
    display: grid;
    grid-gap: var(--gutter);
    grid-template-columns: repeat(3, 1fr);
    padding-bottom: 2.25rem;
}

article.single-img .post-thumbnail { aspect-ratio: 4 / 3; }
article.multi-img .post-thumbnail { aspect-ratio: 2 / 1; }




/* ========================================================================== 
   ABOUT
   ========================================================================== */
.about-grid {
    display: grid;
    grid-gap: 1.875rem 1.875rem;
    grid-template-columns: repeat(4, 1fr);
}
.about-grid.rule-above::before { 
    grid-column-end: span 4; 
    padding-bottom: 0;
}

.articles > h2 { grid-column-end: span 6; }
.about-grid > h2 { grid-column-end: span 4; }
.about-grid img { height: auto; max-width: 100%; }


/*locations*/
article#locations {
    grid-template-columns: repeat(2, 1fr);
    padding-top: 2.25rem;
}
#locations > img { 
    grid-column-end: span 2; 
    padding-bottom: 0.625rem;
}
#locations h3 { 
    background: var(--main-blue); 
    color: #fff;
    padding: 1rem 1.875rem;
}
#locations div { background: #d6e5f1; }
#locations p {
    padding: 1.625rem 1.875rem;
}


/*
#management-team {  }
#management-team img { margin-bottom: 0.875rem; }
#management-team p { font-style: italic; padding: 0; }
#management-team img + p { display: none; }
*/


/*resources*/
#wolfram-resources {
    background: var(--darker-blue) url('images/bg-points-2.jpg');
    color: #fff;
    padding-bottom: 1.75rem;
}
#wolfram-resources .about-grid { grid-template-columns: repeat(3, auto) 208px; }
#wolfram-resources .about-grid > h2 { padding-bottom: 0.625rem; }
#wolfram-resources a { 
    display: grid;
    grid-template-columns: 1fr;
    overflow: hidden;
}
#wolfram-resources a span { 
    color: #c1e4ff; 
    margin-top: -.25rem;
    white-space: nowrap;
}
#wolfram-resources a:hover span { color: #fff; }

#wolfram-resources a.has-badge.wolfram-research { grid-template-columns: 48px 1fr; }
#wolfram-resources a.has-badge.wolfram-u { grid-template-columns: 44px 1fr; }
#wolfram-resources a.has-badge span { grid-column: 2; }




/* ========================================================================== 
   FRONT PAGE
   ========================================================================== */
.home #intro { padding-bottom: 1.875rem; }
.home #intro h2 { padding-bottom: 0; }


/*insights*/
#insights > article:first-child { margin-top: 3.125rem; }


/*quotes*/
#quotes { background: #374d96 url('images/bg-points-1.jpg'); }
#quotes .page-width { padding-bottom: 3.125rem; }
#quotes a { color: #82d5fc; }
#quotes a:hover { color: #fff; }
#quotes p:not(:last-child) { padding-bottom: 1.5rem; }

p.meta::before { content: '\2014'; }
p.meta strong + br { display: none; }

#quotes ul li { padding: 0; }
#quotes ul li::before { display: none; }


/*client results*/
#client-results > div.span-6 { padding-bottom: 1.5rem; }
#client-results article.span-6 .post-thumbnail { order: 2; }
#client-results article.span-6 div.txt { order: 1; }
#client-results article.span-6:nth-of-type(even) div.txt { order: 2; }
#client-results article.span-6:nth-of-type(even) .post-thumbnail { order: 1; }


/*logos*/
#logos { background: var(--darker-blue); }
#logos .page-width { padding-bottom: 2.5rem; }
#logos ul { margin-left: -1rem; /*left alignment*/ }
#logos li { 
    align-items: center;
    display: flex;
    font-size: 0; 
    justify-content: center;
    padding: 1rem 0; 
    width: 6.5rem; /*as close to container width/10 as possible*/
}
#logos ul li::before { display: none; }




/* ==========================================================================
   CAROUSEL
   ========================================================================== */
.cd-hero { position: relative; }
.cd-hero__slider { 
    height: 10rem; 
    overflow: hidden;
    position: relative;
    width: 100%;
}
.cd-hero__slide {
    height: 100%;
    left: 0;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
    /* Force Hardware Acceleration */
    -webkit-transform: translateZ(0px);
    transform: translateZ(0px);
    will-change: transform;
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.cd-hero__slide.cd-hero__slide--selected {
    /* this is the visible slide */
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}
.cd-hero__slide.cd-hero__slide--move-left {
    /* slide hidden on the left */
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
}
.cd-hero__slide.cd-hero__slide--is-moving,
.cd-hero__slide.cd-hero__slide--selected {
    /* the cd-hero__slide--is-moving class is assigned to the slide which is moving outside the viewport */
    -webkit-transition: -webkit-transform 0.5s;
    transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
    transition: transform 0.5s, -webkit-transform 0.5s;
}
html:not(.js-enabled) .cd-hero__slide { display: none; }
html:not(.js-enabled) .cd-hero__slide.cd-hero__slide--selected { display: block; }


/* hero slider nav */
.cd-hero__nav { 
    bottom: 0;
    height: 1.125rem;
    position: absolute;
    width: 100%;
    z-index: 2;
}
.cd-hero__nav nav,
.cd-hero__nav ul,
.cd-hero__nav li,
.cd-hero__nav a { height: 100%; }

.cd-hero__nav nav {
    display: block;
    margin: 0 auto;
    position: relative;
}
.cd-hero__nav ul.outer-ul {
    align-items: stretch;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
}
.cd-hero__nav li { 
    line-height: 1.125rem; 
    padding-bottom: 0; 
}
.cd-hero__nav ul.outer-ul li.scroll {
    overflow: hidden;
    width: 100%;
}
.cd-hero__nav ul.inner-ul {
    align-items: stretch;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    overflow: hidden;
}
.cd-hero__nav ul.inner-ul > li { flex: 0 0 auto; }
.cd-hero__nav .dot {
    background: var(--main-blue);
    border-radius: 100%;
    /*border: 2px solid var(--main-blue);*/
    cursor: pointer;
    display: inline-block;
    height: 12px;
    margin: 0 4px;
    width: 12px;
}
.cd-hero__nav li.cd-selected .dot { background: #fff; }
.cd-hero__nav .dot:hover { background: #fff; /*border-color: var(--link-hover);*/ }
/*.cd-hero__nav li.cd-selected .dot:hover { background: #fff; }*/




/* ========================================================================== 
   BOTTOM
   ========================================================================== */
/*footer form*/
#contact-us { background: var(--darkest-blue); }
#formWrapper { color: #fff; }


/*form-gui overrides*/
#_form-gui { font-family: 'Fira Sans', Arial, sans-serif; }
#_form-gui, #_form-gui label { color: #fff; }
#contact-us ._main-grid > :nth-child(2n+1) { padding-right: 0.625rem; }
#_form-gui ._main-grid > *:nth-child(even) { padding-left: 0.625rem; }

#_form-gui > div:first-of-type,
#contact-us ._main-grid > * {
    padding-bottom: 0.625rem;
    padding-top: 0.625rem;
}

#_form-gui a, #contact-us a { color: var(--light-blue); }
#_form-gui a:hover, #contact-us a:hover { color: var(--lightest-blue); }

#_form-gui #submit {
    background: var(--main-blue);
    border-radius: 0;
    border: none;
    font-weight: 700;
    font-size: 1rem;
    margin-top: 0.75rem;
}
#_form-gui #submit:focus { background: var(--darker-blue); }
#_form-gui #submit:hover { background: var(--dark-blue); }
#_form-gui .required { color: #dd1100; }
#_form-gui .error-msg { 
    background: url('images/form-error-blue.png ') no-repeat center left;
    background-size: 14px 14px;
    color: var(--light-blue);
    text-transform: uppercase; 
}


/*footer actual*/
#site-footer {
    background: var(--nearly-black); 
    color: #ccc;
    font-size: 0.875rem;
    padding: 1.75rem 0;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 2;
}
#site-footer .page-width {
    display: grid;
    grid-gap: 2rem;
    grid-template-columns: 3fr 2fr;
    padding: 0 var(--wrapper-h-pad);
}
#site-footer .page-width div:last-child { justify-self: end; }

#site-footer a { color: #ccc; }
#site-footer a:hover { color: #fff; }

#site-footer a.linked-in {
    line-height: 1;
    padding-left: 0.625rem;
    vertical-align: bottom;
}
a.linked-in svg {
    height: 1.25rem;
    margin-top: -0.4375rem;
    vertical-align: sub;
    width: 1.25rem;
}
a.linked-in:hover #bg { fill: var(--main-blue); }
a.linked-in:hover #txt { fill: #fff; }


#st-1 {
  text-align: left!important;
  margin-top: 2.5rem;
}

/* ========================================================================== 
   responsive breakpoint styles 
   ========================================================================== */
@media (max-width: 1200px) {
    /*about*/
    #wolfram-resources .about-grid a { grid-template-columns: 1fr !important; }
    #wolfram-resources a span { grid-column: 1 !important; }
    #wolfram-resources a img { grid-column-end: span 1 !important; }
}



@media (max-width: 900px) {
    /*site setup*/
    :root {
        --wrapper-h-pad: 2rem;
    }


    /*top nav*/
    #topnav { grid-template-columns: calc(107px + var(--wrapper-h-pad)) 1fr; }
    #topnav ul li { 
        display: inline; 
        padding: 0 0.5rem; 
    }


    /*feeds*/
    article.span-6 { grid-template-columns: 1fr; }
    article.span-6 .post-thumbnail { order: 1 !important; }
    article.span-6 div.txt { order: 2 !important; }
    .post-thumbnail { margin: 0 auto; max-width: 500px; }


    /*services*/
    article.single-img, article.multi-img .img { grid-template-columns: 1fr; }
    article.single-img .edit-link,
    article.single-img .img,
    article.single-img .txt { grid-column-end: span 1; }


    /*about*/
    #locations h3 { padding: 0.75rem 1.5rem; }
    #locations p { padding: 1.25rem 1.5rem; }
    /*
    #management-team .about-grid { grid-template-columns: repeat(3, 1fr); }
    #management-team .about-grid > h2 { grid-column-end: span 3; }
    */
    #wolfram-resources .about-grid { grid-template-columns: repeat(2, 1fr); }
    #wolfram-resources .about-grid > h2 { grid-column-end: span 2; }


    /*carousel*/
    .cd-hero__slider { height: 12rem; }
}


@media (max-width: 600px) {
    /*site setup*/
    :root {
        --wrapper-h-pad: 1rem;
    }
    /*main h1 { text-align: center; }*/
    body main { padding-bottom: 80px; }
    .two-col { columns: 1; }


    /*top nav*/
    #topnav { height: 48px; overflow: visible; }
    #topnav ul {
        background: var(--darkest-blue); 
        left: 0;
        opacity: 0;
        position: absolute; 
        top: 48px;
        transform: translateX(-150%);
        width: 100%;
        z-index: 3;
    }
    #topnav ul.open { 
        grid-column-end: span 2;
        margin-right: 0;
        transform: translateX(0);
        transition: opacity 0.2s ease-in-out;
        opacity: 1;
    }
    #topnav ul li { 
        display: block; 
        padding: 10px var(--wrapper-h-pad) !important; 
        text-align: center; 
    }
    #topnav .contact { background: var(--main-blue); }
    #topnav .contact a { background: none; padding: 0; }
    #topnav .contact:hover { background: var(--dark-blue); }
    #topnav .contact a:hover { background: none; }
    #topnav ul li.linked-in-top svg { display: none; }
    #topnav ul li.linked-in-top a:before { content: 'LinkedIn'; }
    #topnav .mobile-menu { 
        display: flex; 
        margin-right: var(--wrapper-h-pad);
    }
    body.admin-bar > header.is-sticky { top: 0; }


    /*hero*/
    .home #hero {
        background: var(--darkest-blue) url('images/hero-wave.jpg') top right no-repeat; 
        background-size: auto var(--hero-bg); 
    }
    .home #hero #video-wrapper { display: none; }
    #hero .page-width { padding: 2rem var(--wrapper-h-pad); }
    #hero.subpage { 
        background-size: cover; 
        background-position: right;
    }


    /*feeds*/
    .wp-single-content .post-thumbnail {
        float: none;
        margin: 0 auto 1.5rem; 
        max-width: 31.25rem; /*500px*/ 
    }
    #related-posts .span-2  { grid-column-end: span 6; } 
    #related-posts article {
        margin: 0 auto var(--gutter);
        max-width: 300px; 
    }
    #related-posts article:last-of-type { margin-bottom: 0; }


    /*services*/
    #page-content #intro .buttons {
        grid-gap: 1rem;
        grid-template-columns: 1fr; 
    }
    article.single-img .post-thumbnail { aspect-ratio: 2 / 1; }


    /*about*/
    .about-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .about-grid > h2 { grid-column-end: span 2 !important; }
    article#locations { 
        grid-template-columns: 1fr !important; 
        grid-gap: 1rem; 
    }
    #locations > img { grid-column-end: span 1; padding-bottom: 0; }
    #wolfram-resources .about-grid { grid-template-columns: 1fr !important; }
    #wolfram-resources .about-grid > h2 { grid-column-end: span 1 !important; }

   
    /*carousel*/
    .cd-hero__slider { height: 16rem; }


    /*bottom*/
    #site-footer .page-width { 
        grid-gap: 0.5rem;
        grid-template-columns: 1fr; 
    }
    #site-footer .page-width div { justify-self: center !important; }


    /*stupid but needed*/
    html #wpadminbar { top: -46px; }
}


@media (max-width: 320px) {}