/* ed tech page

   developer:   rmiske
   requires:    /common/framework/css/framework.es.css
   ========================================================================== */

/* ==========================================================================
   setup the environment
   ========================================================================== */

:root {
    /*greys*/
    --grey-22: #222222;
    --grey-32: #323232;
    --grey-4b: #4b4b4b;
    --grey-53: #535353;
    --grey-80: #808080;
    --grey-a6: #a6a6a6;
    --grey-db: #dbdbdb;
    --grey-f2: #f2f2f2;
    /*blues*/
    --darkest-blue: #1c2a40;
    --dark-blue: #364660;
    --hero-blue: #4e70a7;
    --light-blue: #8e9fbc;
    --lightest-blue: #bed4f5;
    /*links*/
    --link-base: #227599;
    --link-hover: #eb661e;
    /*etc*/
    --main-red: #dd1100;
    --main-orange: #ff7700;
    --new-orange: #eb5f03;
    /*measurements*/
    --wrapper-h-pad: 2rem;
    --mobile-img-pad-bot: 20px;
    --slide-nav-h: 2rem;
    --quote-pad-t: 1.875rem;
    --quote-lh: 1.5rem;
    /*font: 1.125rem x line-height: 1.2*/
    --quote-lines: 4;
    --quote-pad-b: 1.25rem;
    --quote-att-h: 1.2rem;
}
main {
    color: #404040;
    font-family: 'Source Sans Pro', Arial, sans-serif;
}
main img, main video {
    height: auto;
    max-width: 100%;
}
.video-wrapper {
    text-align: center;
}
/*section*/

section, main header {
    padding: 0 var(--wrapper-h-pad);
    width: 100%;
}
div[id$="-content"] {
    margin: 0 auto;
    max-width: 69.125rem;
    /*1106px*/
    padding-bottom: 3.125rem;
    padding-top: 2.5rem;
    width: 100%;
    border-top: 1px solid #ccc;
}
#why-wolfram-content,
#work-with-content,
#universities-content,
#tell-us-form-content {
    border-top: none;
}
#thank-you-content {
    margin: 0 auto;
    max-width: 69.125rem;
    /*1106px*/
    padding-bottom: 3.125rem;
    padding-top: 0;
    width: 100%;
    border-top: none;
}
div[id$="-content"].narrow {
    max-width: 68.75rem;
}
.feature div[id$="-content"] {
    border-top: 1px solid var(--grey-db);
}
#hero+.feature div[id$="-content"] {
    border-top: none;
}
/*grids*/

.feature-grid {
    align-items: start;
    border-top: 1px solid #ccc;
    display: grid;
    grid-gap: 0 84px;
    grid-template-columns: 1fr 27.4375rem;
    margin-top: 3.125rem;
    padding-top: 3.125rem;
}
.feature-grid.img-on-left {
    grid-template-columns: 27.4375rem 1fr;
}
.feature-grid img, .feature-grid video {
    margin: 0 auto;
}
.feature-grid .feature-right {
    /*font-size: 0;*/
    text-align: center;
}
.feature-grid.img-on-left .feature-left {
    order: 2;
}
.feature-grid.img-on-left .feature-right {
    order: 1;
}
.feature-grid.img-stroke img, .feature-grid.img-stroke video {
    border: 2px solid var(--grey-db);
}
.feature-grid.img-gradient img, .feature-grid.img-gradient video {
    background: linear-gradient(0deg, #ebebeb 0%, #fbfbfb 100%);
    padding: 0.625rem;
}
/*grids*/

.feature-quote-grid {
    align-items: start;
    display: grid;
    column-gap: 0px;
    row-gap: 0px;
    grid-template-columns: 1fr 500px;
}
.feature-quote-grid.img-on-left {
    grid-template-columns: 500px 1fr;
}
.feature-quote-grid img, .feature-quote-grid video {
    margin: 0 auto;
}
.feature-quote-grid .feature-right {
    /*font-size: 0;*/
    text-align: center;
}
.feature-quote-grid .feature-top {
    grid-column: 1 / span 2;
    display: grid;
}
.feature-quote-grid.img-on-left .feature-left {
    order: 2;
    height: 100%;
}
.feature-quote-grid.img-on-left .feature-right {
    order: 1;
}
.feature-quote-grid.img-stroke img, .feature-quote-grid.img-stroke video {
    border: 2px solid var(--grey-db);
}
.feature-quote-grid.img-gradient img, .feature-quote-grid.img-gradient video {
    background: linear-gradient(0deg, #ebebeb 0%, #fbfbfb 100%);
    padding: 0.625rem;
}
.feature-quote-grid ul {
    margin-left: 15px;
    margin-right: 30px;
    margin-top: 30px;
    margin-bottom: 30px;
}
/*text*/

main h1 {
    color: var(--grey-4b);
    font-size: 3.625rem;
    letter-spacing: -0.06rem;
    line-height: 1;
    padding-bottom: 0.75rem;
}
main h2 {
    color: var(--main-orange);
    font-size: 2.25rem;
    padding-bottom: 1.5rem;
}
main h2 .subtitle {
    color: #404040;
    display: block;
    font-size: 1.875rem;
    padding-top: 0.25rem;
}
main h3 {
    color: var(--grey-22);
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.15;
    padding-bottom: 0.5rem;
}
main p {
    font-size: 1.25rem;
    padding-bottom: 1.25rem;
}
main div[id$="-content"] .feature-grid p {
    font-size: 1rem;
    padding-bottom: 1rem;
}
main div[id$="-content"] p:last-child, .feature-grid li:last-child {
    padding-bottom: 0;
}
main li {
    line-height: 1.2;
    padding-bottom: 0.625rem;
}
main li a {
    color: var(--main-orange);
}
main li a:hover {
    color: #e65c00;
}
/*restore bullets*/

ul.with-bullets li {
    display: list-item;
    list-style: disc;
    margin-left: 1.5rem;
    padding-bottom: 1rem;
}
/*links*/

.chevron-before.rotate-90-cw {
    padding-left: 1.65rem;
}
.chevron-before.rotate-90-cw::before {
    display: inline-block;
    font-size: 1.75rem;
    font-weight: 300;
    line-height: 0.5rem;
    position: absolute;
    bottom: 0;
    left: 0;
    top: 0;
    transform: rotate(90deg);
}
.video-icon-after {
    background: url('/solutions/educational-technology/img/icon-video.svg') no-repeat right;
    background-size: 1rem;
    padding-right: 1.375rem;
}
/*buttons*/

.button_box {
    display: inline-block;
    margin: 1rem 0;
}
.buttons {
    display: flex;
    flex-flow: row wrap;
    gap: 1rem;
}
.button {
    background: #027485;
    border: 1px solid #027485;
    border-radius: 0.25rem;
    color: #fff;
    font-size: 1rem;
    line-height: 1;
    padding: 0.625rem 0.75rem;
    position: relative;
}
.button:nth-child(n+3) {
    margin-bottom: 0;
}
.button:hover {
    background: #10505b;
}
.button:active {
    background: #003352;
}
.gpt_box {
    max-width: 14rem;
    display: inline-block;
    margin: 1rem 0 0 1.5rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #ff7700;
    background: #fdf3ec;
    border: 1px solid #fdc689;
    border-radius: 0.25rem;
    padding: 0.75rem 1rem;
    vertical-align: top;
}
.gpt_box a {
    color: #404040;
}
.gpt_box a:hover {
    color: #ff7700;
}
.gpt_box .chevron-after:after {
    color: #ff7700;
}
.gpt_box .divider {
    border-right: 1px solid #acacac;
    margin: 0 0.25rem -2px 0.3125rem;
    display: inline-block;
    height: 12px;
}
/* ==========================================================================
   hero
   ========================================================================== */

#hero {
    background: #c4e5c3;
    background: linear-gradient(90deg, #c4e5c3 0%, #acded3 90%);
    color: #052d41;
    overflow: hidden;
}
#hero-content {
    padding-bottom: 1.5rem;
    padding-top: 1.5rem;
}
#hero h1 {
    color: #052d41;
}
#hero h1 strong {
    white-space: nowrap;
}
#hero .feature-grid {
    align-items: center;
    border: none;
    grid-template-columns: 1fr 1fr;
}
#hero .feature-left img {
    margin: 0 auto;
}
#hero .feature-right {
    position: relative;
    height: 302px;
}
#hero .feature-right img {
    left: 0;
    max-width: none;
    position: absolute;
    top: 0;
}
#hero p {
    font-size: 1.625rem;
    white-space: nowrap;
}

main a#stripe {
    background: #002c42;
    font-size: 1.13rem;
    line-height: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    text-align: center;
}

main a#stripe:hover {
    background: #004365;
}

main a#stripe p {
    background: url('/solutions/educational-technology/img/stripe-logo-quezzio.svg') no-repeat left center;
    background-size: 3.125rem;
    color: #fff;
    margin: 0;
    padding: 1rem 0 1rem 3.625rem;
    font-size: 1.13rem;
    line-height: 1.5rem;
}

main a#stripe p span { color: #cbecfc; }



/* ==========================================================================
   Trustworthy AI
   ========================================================================== */

#quote_trustworthy {
    margin: 0 auto;
    padding-bottom: 3.125rem;
    width: 100%;
}

#quote_trustworthy p {
    font-size: 1rem;
}

/* ==========================================================================
   carousel
   ========================================================================== */

.cd-hero {
    max-width: 440px;
    position: relative;
}
.cd-hero__slider {
    height: calc(308px + var(--slide-nav-h));
    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;
}

#quote_trustworthy .cd-hero__nav {
    bottom: unset;
    margin-top: 26px;
    width: 95%;
}

.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-x: hidden;
    width: 100%;
}
.cd-hero__nav ul.inner-ul {
    align-items: stretch;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    overflow: hidden;
    /*overflow-x: hidden;*/
}
.cd-hero__nav ul.inner-ul>li {
    flex: 0 0 auto;
}
.cd-hero__nav .dot {
    background: transparent;
    border-radius: 100%;
    border: 2px solid var(--grey-a6);
    cursor: pointer;
    display: inline-block;
    height: 12px;
    margin: 0 4px;
    width: 12px;
}
.cd-hero__nav li.cd-selected .dot {
    background: var(--grey-a6);
}
.cd-hero__nav .dot:hover {
    border-color: var(--link-hover);
}
.cd-hero__nav li.cd-selected .dot:hover {
    background: var(--link-hover);
}
#quote-content .cd-hero__nav {
    bottom: 10px;
    left: 468px;
}
/* quoted content */

.grid-container {
    display: grid;
    grid-template-columns: 45% 55%;
    max-width: 1100px;
    margin: 0 auto;
    border: 1px solid #cccccc;
}

#quote_trustworthy .grid-container {
    grid-template-columns: 62% 38%;
    border: none;
}

.grid-container .top {
    grid-column: 1 / -1;
    display: grid;
}
.left {
    max-width: 500px;
    display: grid;
    margin: auto auto;
}
.right {
    display: grid;
    background: #4059a2;
    align-items: center;
    height: 371px;
}

#quote_trustworthy .right {
    background: #fff;
    text-align: left;
    padding-left: 22px;
    height: 428px;
}

.responsive-image {
    max-width: 100%;
    height: auto;
    width: auto;
}
.right ul li {
    display: block;
    list-style: none;
}
#quote {
    color: #fff;
}
#quote .carousel {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
}
#quote p {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.25;
    margin-left: calc(10px + (16 - 10) * ((100vw - 600px) / (1920 - 600)));
    margin-right: calc(-12px + (0 + 12) * ((100vw - 600px) / (1920 - 600)));
    padding-bottom: 0px;
    padding-left: calc(58px + (78 - 58) * ((100vw - 600px) / (1920 - 600)));
    padding-right: calc(24px + (38 - 24) * ((100vw - 600px) / (1920 - 600)));
}
#quote p.the-quote-itself {
    background: url(/solutions/educational-technology/img/quote-open-blue.png) no-repeat;
    background-size: calc(44px + (70 - 44) * ((100vw - 600px) / (1920 - 600)));
    font-size: calc(15px + (20 - 15) * ((100vw - 600px) / (1920 - 600)));
    font-style: italic;
    padding-left: calc(56px + (85 - 56) * ((100vw - 600px) / (1920 - 600)));
    text-align: left;
}
#quote p.attribution {
    font-size: calc(10.5px + (15 - 10.5) * ((100vw - 600px) / (1920 - 600)));
    margin-right: calc(0px + (9 - 0) * ((100vw - 600px) / (1920 - 600)));
    margin-top: calc(18px + (27 - 18) * ((100vw - 600px) / (1920 - 600)));
    padding-bottom: 0px;
    text-align: right;
}
#quote p.read-the-story {
    margin-top: calc(21px + (35 - 21) * ((100vw - 600px) / (1920 - 600)));
    margin-bottom: calc(16px + (0 - 16) * ((100vw - 600px) / (1920 - 600)));
}
#quote p.read-the-story a {
    color: #fdc689;
    font-size: calc(14.4px + (20 - 14.4) * ((100vw - 600px) / (1920 - 600)));
    padding-left: calc(-27px + (10 + 27) * ((100vw - 600px) / (1920 - 600)));
    text-align: left;
    text-decoration: none;
}
#quote p.read-the-story a:hover {
    color: #e65c00;
    text-decoration: none;
}
.barnes-and-noble .left {
    margin: 0;
}
.barnes-and-noble .left img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}
.uofm .left {
    margin: auto;
}
.barnes-and-noble .left img, .uofm .left img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}
.barnes-and-noble .left, .uofm .left {
    margin: 0;
}
#quote .cd-hero__nav {
    bottom: 2.5rem;
    padding-right: 1rem;
}
#quote .cd-hero__nav nav {
    float: right;
}
#quote_trustworthy .cd-hero__slider,
#quote .cd-hero__slider {
    height: calc(371px + var(--slide-nav-h));
    overflow: hidden;
    position: relative;
    width: 100%;
}
#quote .cd-hero__slide {
    height: 100%;
    left: 0;
    position: absolute;
    text-align: inherit;
    top: 0;
    width: 100%;
}

#quote_trustworthy .cd-hero__slider {
    height: calc(398px + var(--slide-nav-h));
}

#quote_trustworthy .left {
    max-width: 100% !important;
    width: 673px;
}

/* ==========================================================================
   OTHER SECTIONS
   ========================================================================== */

/*section-content exceptions*/

/*#courseware-content, #assessment-content, #why-wolfram-content { padding-bottom: 0; }*/

#intro-content {
    border-bottom: 1px solid #ccc;
    padding-bottom: 2.5rem;
    padding-top: 2rem;
    border-top: none;
}
#quote-content {
    margin-bottom: 80px;
    margin-top: 60px;
    max-width: 1107px;
    border: 1px solid black;
    padding: 0px;
}
.feature-quote-grid .feature-left {
    background-color: #4059a2;
    display: flex;
    align-items: center;
    justify-content: center;
}
.feature-quote-grid .feature-right {
    display: flex;
    align-items: center;
    justify-content: center;
}
.feature-quote-grid .responsive {
    width: 100%;
    max-width: 600px;
    height: auto;
}
/*courseware tech*/

#courseware h2+p {
    padding-bottom: 2.4375rem;
}
/*assessment*/

#assessment {
    margin-top: 2.5rem;
}

#assessment .step {
    display: inline-block;
    height: 3rem;
    line-height: 3rem;
    margin-right: 0.375rem;
    padding: 0 1.5rem;
    position: relative;
}
#assessment .step::before {
    border-width: 1.5rem 0 1.5rem 1rem;
    border-style: solid;
    content: " ";
    left: -0.9rem;
    margin-top: -1.5rem;
    position: absolute;
    top: 50%;
}
#assessment .step::after {
    content: " ";
    border-color: transparent;
    border-style: solid;
    border-width: 1.5rem 0 1.5rem 1rem;
    margin-top: -1.5rem;
    position: absolute;
    right: -0.9rem;
    top: 50%;
}
#assessment .step.generate {
    background: #c6e6df;
}
#assessment .step.generate::before {
    border-color: #c6e6df;
    border-left-color: transparent;
}
#assessment .step.generate::after {
    border-left-color: #c6e6df;
}
#assessment .step.display {
    background: #c8e7dc;
}
#assessment .step.display::before {
    border-color: #c8e7dc;
    border-left-color: transparent;
}
#assessment .step.display::after {
    border-left-color: #c8e7dc;
}
#assessment .step.express {
    background: #cee7d8;
}
#assessment .step.express::before {
    border-color: #cee7d8;
    border-left-color: transparent;
}
#assessment .step.express::after {
    border-left-color: #cee7d8;
}
#assessment .step.assess {
    background: #d3e9d5;
}
#assessment .step.assess::before {
    border-color: #d3e9d5;
    border-left-color: transparent;
}
#assessment .step.assess::after {
    border-left-color: #d3e9d5;
}
#assessment .step.analyze {
    background: #d6e9d3;
}
#assessment .step.analyze::before {
    border-color: #d6e9d3;
    border-left-color: transparent;
}
#assessment .step.analyze::after {
    border-left-color: #d6e9d3;
}
#assessment-steps {
    margin: 1.875rem auto 0;
}
#assessment-steps ul {
    align-items: center;
    display: flex;
    font-weight: 600;
    justify-content: center;
}
#assessment-steps li {
    font-size: 1.375rem;
    padding: 0.7rem 0.7rem 0.8rem 0.8rem;
}
#assessment-steps .step::before {
    border-width: 1.5rem 0 1.55rem 1rem;
}
#assessment-steps .step:last-child {
    margin-right: 0;
}
#assessment-slide .step {
    height: 2.5rem;
    left: -0.5rem;
    line-height: 2.5rem;
    margin-bottom: 0.25rem;
    padding: 0 0.5rem;
    font-size: 1.25rem;
    font-weight: 600;
}
#assessment-slide .step::before {
    border-width: 1.25rem 0 1.25rem 0.75rem;
    left: -0.70rem;
    margin-top: -1.25rem;
}
#assessment-slide .step::after {
    border-bottom: 1.25rem solid transparent;
    border-top: 1.25rem solid transparent;
    margin-top: -1.25rem;
}
/*why wolfram*/

#why-wolfram {
    background: #eff7f6;
}
#why-wolfram p, #why-wolfram li {
    font-size: 1.25rem;
}
#why-wolfram li {
    break-inside: avoid;
}
#why-wolfram .feature-grid {
    font-weight: 600;
    grid-gap: 0;
    grid-template-columns: 1fr 320px;
    padding-top: 1rem;
}
/*engaging*/

#engaging img {
    margin: 1.75rem 0 1rem;
}
#engaging .list-inline {
    display: block;
}
#engaging .list-inline li {
    display: inline-block;
    font-size: 1.25rem;
}
#engaging .list-inline li:after {
    content: '\2022';
    margin: 0 5px;
}
#engaging .list-inline li:last-child:after {
    content: '';
}
/* ==========================================================================
  Work With Wolfram
   ========================================================================== */

#work-with-wolfram {
    background: #e2eef5;
}
#cody-framework h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #5d61ad;
    line-height: 1.35;
}
#cody-framework .education h3 {
    color: #784ea0;
}
#cody-framework .programming h3 {
    color: #902990;
}
#cody-framework .full-project h3 {
    color: #a72365;
}
#cody-framework .ad-hoc-mds h3 {
    color: #b52044;
}
#cody-framework p {
    font-size: 1rem;
    font-weight: 400;
    color: #404040;
    line-height: 1.313;
    padding-bottom: 0;
}

#cody-framework .text-component a {
	color: var(--main-orange);
	text-decoration: none;
	
}

#cody-framework .text-component a:hover {
	color: #e65c00;
	
}
/* ==========================================================================
   CONTACT US
   ========================================================================== */

#tell-us-form, #thank-you {
    background-color: #1b7483;
    color: #fff;
}
#tell-us-form h2 {
    color: #fff;
	font-size:1.75rem;
    padding-bottom: 1.0rem;
}
#tell-us-form .grid.cols-1.width-full {
    padding: 1rem 0 0.5rem 0;
}
#tell-us-form #_form-gui ._main-grid> :nth-child(2n+1) {
    padding-right: 0.5rem;
}
#tell-us-form #_form-gui ._main-grid>*:nth-child(even) {
    padding-left: 0.6rem;
}
#tell-us-form #_form-gui ._main-grid>*, #tell-us-form #_form-gui ._radio-grid>* {
    padding-bottom: 0.5rem;
}
#tell-us-form .grid.cols-2.heirs-width-1-2:first-child {
    margin-right: 0.5rem;
}
#tell-us-form a {
    color: #fff !important;
    font-weight: 600;
}
#tell-us-form .display-f{
	display:flex;
}
#tell-us-form a:hover {
    color: #1F2127 !important;
}
#tell-us-form input[type='email'], #tell-us-form input[type='text'], #tell-us-form textarea {
    color: #656565;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.25;
}
#tell-us-form #_form-gui label {
    color: #fff;
}
#tell-us-form #_form-gui #submit {
    background: #10505b;
    border: none;
    border-radius:0;
    font-size: 0.9375rem;
    margin-top: 0.5rem;
    padding: .7rem 1.7rem;
}
#tell-us-form #_form-gui #submit:hover, #tell-us-form #_form-gui #submit:focus {
    background: #e65c00;
    color: #fff;
}
#tell-us-form .error-msg {
    background: url('../img/form-error.png') no-repeat center left;
    background-size: 14px 14px;
    color: #fff;
    font-weight: 300;
}
.tell-us {
    color: #ffffff;
	font-size:1.13rem;
    margin: 0.5rem 0 0 0;
    padding-bottom: 0.5rem;
}
#thank-you {
    display: none;
}
#thank-you h2 {
    color: #fff;
    font-weight: 400;
    font-size: 1.875rem;
}
#processing-error {
    display: none;
}

/*contact section*/
#contact-us h2 {
    color: #dd4c00;
    text-align: left;
}
#contact-us .information {
    color: #535353;
    font-size: 1.3rem;
    font-weight: 300;
    line-height: 1.5;
}
#contact-us #compare-nav a, #contact-us #support-nav a {
    color: #545454;
}
#contact-us #compare-nav a:hover, #contact-us #support-nav a:hover {
    color: #f57300;
}




/* ==========================================================================
  Sticky footer
   ========================================================================== */
.footer {
    background-color: #f86300;
    color: #fff;
    font-size: 1.125rem;
    font-weight: 400;
    padding: 1rem 2rem;
    width: 100%;
}
.sticky {
    bottom: 0;
    position: fixed;
    z-index: 999999999;
}
.footer a, .footer span {
    align-items: center;
    display: flex;
    justify-content: center;
}
.footer a { color: #fff; }
.footer a:hover { color: #ffdd6f; }
.footer svg { 
    height: 1.75rem;
    margin: 0.25rem 0.625rem 0 0.875rem; 
    width: 1.75rem;
}
.footer a:hover .a { fill: #ffdd6f; }



#close-form-button {
    -webkit-transform: rotate(270deg);
    -webkit-transition-duration: .25s, .5s;
    -webkit-transition-property: opacity, bottom;
    -webkit-transition-timing-function: ease-in;
    color: rgba(255, 255, 255, 1);
    cursor: pointer;
    font-size: 2.125rem;
    font-weight: 300;
    height: 0.5rem;
    margin: 0 auto;
    opacity: 1;
    transform: rotate(270deg);
    transition-duration: .25s, .5s;
    transition-property: opacity, bottom;
    transition-timing-function: ease-in;
    width: 1rem;
    z-index: 2;
}
/* ==========================================================================
   responsive breakpoint styles
   ========================================================================== */

@media (max-width: 1200px) {
    /*setup*/
    :root {
        --wrapper-h-pad: 3rem;
        /*45px*/
        --quote-lines: 4;
    }
    #assessment-slide .step::after {
        border-top: 1.35rem solid transparent;
    }
    #assessment-slide .step::before {
        border-width: 1.25rem 0 1.35rem 0.85rem;
    }
    #assessment-slide .step.generate::before, #assessment-slide .step.assess::before {
        border-width: 1.25rem 0 1.3rem 0.85rem;
    }
}
@media (max-width: 900px) {
    /*setup*/
    :root {
        --wrapper-h-pad: 3.2rem;
        /*~45px*/
        --quote-lines: 7;
        --quote-att-h: 2.4rem;
    }
    div[id$="-content"] {
        padding-bottom: 40px;
        padding-top: 34px;
    }
    .feature-grid {
        grid-gap: 0;
        grid-template-columns: 1fr !important;
    }
    .feature-grid img, .feature-grid video {
        padding-bottom: var(--mobile-img-pad-bot);
        padding-top: calc(var(--mobile-img-pad-bot));
    }
    .feature-quote-grid {
        grid-gap: 0;
        grid-template-columns: 1fr !important;
    }
    .feature-quote-grid img, .feature-quote-grid video {
        padding-bottom: var(--mobile-img-pad-bot);
        padding-top: calc(var(--mobile-img-pad-bot));
    }
    main h1 {
        font-size: 56px;
        padding-bottom: 0;
    }
    .button_box {
        display: block;
        border-right: none;
        max-width: 37.375rem;
    }
    .gpt_box {
        display: block;
        margin: 1rem 0 0 0;
    }
    /*hero*/
    #hero-content {
        padding-bottom: 30px;
        padding-top: 43px;
    }
    #hero h1, #hero p {
        text-align: center;
    }
    #hero p {
        padding-bottom: 30px;
        padding-top: 6px;
    }
    /*carousel*/
    .cd-hero {
        margin: 0.5rem auto var(--mobile-img-pad-bot);
        max-width: 439px;
        width: 100%;
    }
    .cd-hero img, .cd-hero video {
        padding: 0;
    }
    #quote-content .cd-hero {
        margin: 0px;
        max-width: 439px;
        width: 100%;
    }
    #quote-content .feature-quote-grid .feature-top {
        grid-column: 1 / span 1;
        display: grid;
    }
    /*other sections > section-content exceptions*/
    #intro-content {
        padding-bottom: 28px;
        padding-top: 37px;
    }
    /*other sections > everything else*/
    #assessment-steps {
        margin: 22px auto 0;
    }
    #why-wolfram-content {
        padding-bottom: 10px;
        padding-top: 30px;
    }
    #why-wolfram-content>img.show__900 {
        margin: 0 auto 2rem;
    }
    #why-wolfram ul {
        column-count: 2;
        column-gap: 4rem;
    }
    #why-wolfram .feature-grid {
        padding-bottom: 0;
    }
    #why-wolfram li, #why-wolfram li:last-child {
        padding-bottom: 28px;
    }
    /*#quote_trustworthy .cd-hero__nav {
        margin-top: 0px; 
    }*/
} 
@media (max-width: 600px) {
    /*setup*/
    :root {
        --wrapper-h-pad: 20px;
        /*line up with global menu*/
        --quote-lines: 11;
        --quote-att-h: 3.6rem;
    }
    div[id$="-content"] {
        padding-bottom: 32px;
        padding-top: 32px;
    }
    div[id$="-content"].narrow {
        max-width: 450px;
    }
    section.feature {
        padding-left: 0;
        padding-right: 0;
    }
    section.feature div[id$="-content"] {
        padding-left: var(--wrapper-h-pad);
        padding-right: var(--wrapper-h-pad);
    }
    main h1 {
        font-size: 36px;
        line-height: 1;
    }
    div[id$="-content"].feature-grid p {
        font-size: 17px;
    }
    /*main li { font-size: 1.24rem; line-height: 1.25; }*/
    .button_box {
        max-width: 41rem;
    }
    .button {
        border-radius: 0.3rem;
        font-size: 0.8rem;
        margin: 0 7px 7px 0;
        padding: 0.625rem 0.25rem !important;
    }
    .chevron-before.rotate-90-cw::before {
        display: none;
    }
    /*hero*/
    a#stripe p {
        max-width: 299px;
        text-align: center;
    }
    a#stripe {
        padding: 0 10px;
    }
    #hero p {
        white-space: normal;
    }
    /*other sections > section-content exceptions*/
    #intro-content {
        padding-bottom: 33px;
    }
    /*other sections > everything else*/
    #why-wolfram ul {
        column-count: 1;
        padding-bottom: 20px;
    }
    #why-wolfram li, #why-wolfram li:last-child {
        padding-bottom: 10px;
    }
    /*contact us*/
    #tell-us-form ._main-grid>*, #tell-us-form ._radio-grid>* {
        padding-top: .6rem;
    }
    input::placeholder, textarea::placeholder {
        font-size: 0.875rem;
    }
    /*quoted content*/
    #quote_trustworthy .right {
        padding-right: 22px;
        padding-left: 22px;
        height: auto;
    }
    #quote_trustworthy .cd-hero__nav {
        margin-top: 0;
    }
    #quote_trustworthy .grid-container,
    .grid-container {
        grid-template-columns: 100%;
        max-width: 500px;
    }
    #quote p.the-quote-itself {
        font-size: 1.0625rem;
        background: url(/solutions/educational-technology/img/quote-open-blue.png) no-repeat;
        background-size: 44px;
        font-style: italic;
        text-align: left;
        padding-left: 56px;
    }
    #quote p {
        padding-left: 74px;
        padding-right: 21px;
        margin-left: 10px;
        margin-right: 10px;
    }
    #quote p.attribution {
        font-size: 13px;
        text-align: right;
        margin-right: 21px;
        margin-top: 18px;
        line-height: 1.25;
    }
    #quote p.read-the-story a {
        font-size: 17.5px;
        margin-left: -15px;
        color: #fdc689;
    }
    #quote p.read-the-story {
        margin-top: 21px;
        margin-bottom: 16px;
    }
    .left {
        max-width: 600px;
    }
    .right {
        align-items: unset;
        height: 413px;
        padding-top: 3vh;
    }
    .uofm .left img {
        display: block;
        width: 100%;
        height: 100%;
        min-width: 100%;
        min-height: 100%;
    }
    #quote_trustworthy .cd-hero__nav {
        bottom: unset;
    }
    #quote .cd-hero__nav {
        bottom: 1.0rem;
        padding-right: unset;
    }
    #quote_trustworthy .cd-hero__nav nav,
    #quote .cd-hero__nav nav {
        float: inherit;
    }
    #quote_trustworthy .cd-hero__slider {
        height: calc(215px * 2 + var(--slide-nav-h));
    }
    #quote .cd-hero__slider {
        height: calc(305px * 2 + var(--slide-nav-h));
    }
    #assessment-slide .step.generate::before, #assessment-slide .step.display::before {
        border-width: 1.25rem 0 1.25rem 0.85rem;
    }
    #assessment {
        margin-top: 1.25rem;
    }

    /*footer*/
    .footer a { display: block; }

    /*stripe*/
    main a#stripe p {
        max-width: 323px;
    }
    main a#stripe {
        padding: 0 20px;
    }
}
@media (max-width: 320px) {
    .right {
        align-items: unset;
        padding-top: 2rem;
    }
}
@media print {}