/*fonts*/

body {
    overflow-x: hidden !important;
}

@font-face {
    font-family: 'HelveticaNeue-Regular';
    src: url('fonts/helveticaneue/HelveticaNeue-01.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-Bold';
    src: url('fonts/helveticaneue/HelveticaNeue-Bold-02.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-BoldItalic';
    src: url('fonts/helveticaneue/HelveticaNeue-BoldItalic-04.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-CondensedBlack';
    src: url('fonts/helveticaneue/HelveticaNeue-CondensedBlack-10.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-CondensedBold';
    src: url('fonts/helveticaneue/HelveticaNeue-CondensedBold-05.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-Italic';
    src: url('fonts/helveticaneue/HelveticaNeue-Italic-03.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-Light';
    src: url('fonts/helveticaneue/HelveticaNeue-Light-08.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-LightItalic';
    src: url('fonts/helveticaneue/HelveticaNeue-LightItalic-09.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-Medium';
    src: url('fonts/helveticaneue/HelveticaNeue-Medium-11.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-MediumItalic';
    src: url('fonts/helveticaneue/HelveticaNeue-MediumItalic-12.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-Thin';
    src: url('fonts/helveticaneue/HelveticaNeue-Thin-13.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-ThinItalic';
    src: url('fonts/helveticaneue/HelveticaNeue-ThinItalic-14.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-UltraLight';
    src: url('fonts/helveticaneue/HelveticaNeue-UltraLight-06.ttf');
}

@font-face {
    font-family: 'HelveticaNeue-UltraLightItalic';
    src: url('fonts/helveticaneue/HelveticaNeue-UltraLightItalic-07.ttf');
}

:root {
    font-size: 16px;
}

h1 {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 4rem;
    letter-spacing: 1.6px;
}

.caseheader > .container > .row > .col-xl-8 {
    margin-bottom: 196px;
}

.caseheader > .container > .row > .websitecase {
    margin-bottom: 48px;
}

h1.white {
    color: #FFFFFF;
}

h2 {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 48px;
    color: #121212;
    letter-spacing: 1.2px;
    padding-bottom: 8px;
    line-height: 64px;
}

h3 {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 36px;
    color: #121212;
    letter-spacing: 0.9px;
    line-height: 54px;
}

h3.caseclient {
    opacity: 0.5;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 48px;
    color: #FFFFFF;
    letter-spacing: 1.2px;
    margin-bottom: 32px;
}

h4 {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 32px;
    color: #121212;
    letter-spacing: 1.58px;
    line-height: 52px;
}

h4.white {
    color: #ffffff;
}

h5 {
    font-family: HelveticaNeue-Regular, sans-serif;
}

h6 {
    font-family: HelveticaNeue-Regular, sans-serif;
}

p {
    font-family: HelveticaNeue, sans-serif;
    font-size: 1.5rem;
    color: #525252;
    letter-spacing: 0.6px;
    line-height: 36px;
}

.p-medium {
    font-family: HelveticaNeue-Medium, sans-serif;
}

.p-bold {
    font-family: HelveticaNeue-Bold, sans-serif;
}

a {
    font-family: HelveticaNeue-Bold, sans-serif;
    color: var(--case-client-dark-color);
    text-decoration: underline;
}

.underline {
    text-decoration: underline!important;
}

p.caseintro {
    opacity: 0.8;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 1.5rem;
    color: #FFFFFF;
    letter-spacing: 0.6px;
    line-height: 32px;
}

p.smalltitle {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 18px;
    color: var(--case-client-dark-color);
    letter-spacing: 0.45px;
}

p.readingtime {
    font-family: HelveticaNeue-Medium, sans-serif;
    font-size: 18px;
    color: var(--case-client-light-color);
    opacity: 50%;
    letter-spacing: 0.45px;
    margin-top: 16px;
    display: none;
}

.italic {
    font-family: HelveticaNeue-Italic, sans-serif;
}


/*colors*/

:root {
    --case-client-dark-color: #121212;
    --case-client-light-color: #efefef;
    --case-client-superlight-color: #f4f4f4;
}

.casecolor {
    color: var(--case-client-dark-color) !important;
    opacity: 100 !important;
}

.bigbuttonwhite {
    background: #FFFFFF;
    border-radius: 8px;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 24px;
    color: #121212;
    letter-spacing: 0.6px;
    padding: 20px 57px;
    text-decoration: none;
    margin-top: 40px;
    display: inline-block;
    transition: all .2s ease-in-out;
    margin-right: 24px;
}

.bigbuttonwhite:hover {
    text-decoration: none;
    color: #121212;
    transform: scale(1.03);
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.20);
}

.bigbuttonblack {
    background: #121212;
    border-radius: 8px;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 24px;
    color: #FFFFFF;
    letter-spacing: 0.6px;
    padding: 20px 57px;
    text-decoration: none;
    margin-top: 40px;
    display: inline-block;
    transition: all .2s ease-in-out;
}

.bigbuttonblack:hover {
    text-decoration: none;
    color: #FFFFFF;
    transform: scale(1.03);
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.20);
}

.bigbuttongrey {
    background: #F5F5F5;
    border-radius: 8px;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 24px;
    color: #121212;
    letter-spacing: 0.6px;
    padding: 20px 57px;
    text-decoration: none;
    margin-top: 40px;
    display: inline-block;
    transition: all .2s ease-in-out;
}

.bigbuttongrey:hover {
    text-decoration: none;
    color: #121212;
    transform: scale(1.03);
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.20);
}

.bigbuttonneutral {
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 24px;
    color: #FFFFFF;
    letter-spacing: 0.6px;
    padding: 20px 57px;
    text-decoration: none;
    margin-top: 40px;
    display: inline-block;
    transition: all .2s ease-in-out;
}

.bigbuttonneutral:hover {
    color: #FFFFFF;
    text-decoration: none;
    background-color: rgba(255, 255, 255, 0.2);
    transform: scale(1.03);
    /*    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.20);*/
}

.bigbuttonimage {
    height: 30px;
    position: relative;
    left: -24px;
}

.navbarmain {
    color: #ffffff;
    position: absolute;
    top: 32px;
    z-index: 100;
    width: 100%;
    padding: 0px 0px 0px 0px;
}

.topnavcol {
    padding: 0;
}

.collapsing {
    background: rgba(18, 18, 18, 0.98);
    position: fixed;
    left: 0;
    top: 0px;
    width: 100%;
    z-index: 99;
    height: 100vh !important;
    padding-top: 40vh;
}

.navbarmain > a {
    opacity: 0.85;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 2rem;
    color: #FFFFFF;
    letter-spacing: 0.8px;
    text-decoration: none;
}

.navbar-toggler {
    background: url(../images/topnav-icon.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    width: 40px;
    height: 40px;
    z-index: 100;
}

.navbar-toggler[aria-expanded="true"] {
    background: url(../images/topnav-icon-close.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    width: 40px;
    height: 40px;
}

.navbar-brand {
    z-index: 100;
}

#navbarNav > ul {}

.nav-link {
    color: #ffffff;
    text-decoration: none;
    margin: 0 auto;
    text-align: center;
    font-size: 18px;
    padding: 8px 20px !important;
    margin-left: 10px;
    opacity: 0.5;
    letter-spacing: 0.45px;
}

.nav-link:hover {
    opacity: 1;
    color: #ffffff;
}

.navactive {
    opacity: 0.8;
}

.show {
    background: rgba(18, 18, 18, 0.98);
    position: fixed;
    left: 0;
    top: 0px;
    width: 100%;
    z-index: 99;
    height: 100vh;
    padding-top: 40vh;
}


/* HOMESCREEN */

.headerhome {
    background: url(../images/homeheaderimage.png), url(../images/homeheadergradient1.png);
    background-size: 600px, cover;
    background-repeat: no-repeat, no-repeat;
    background-position: 50vw bottom, bottom;
    padding: 119px 0 32px;
    margin-bottom: 72px;
    background-color: #121212;
}


}
.headerhome:after {}
.greetinghome {
    opacity: 0.1;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 160px;
    color: #FFFFFF;
    letter-spacing: 4px;
    line-height: 191px;
    left: -50px;
    position: absolute;
    overflow: hidden;
}
.headerhomecontainer {
    margin-top: 60px;
    padding-top: 0px;
    padding-bottom: 100px;
}
.namehome {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 72px;
    color: #FFFFFF;
    letter-spacing: 1.8px;
    margin-top: 58px;
}
.subtitlehome {
    opacity: 0.8;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 36px;
    color: #FFFFFF;
    letter-spacing: 0.9px;
    line-height: 52px;
    padding-bottom: 14px;
}
.subsubtitlehome {
    opacity: 0.4;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 24px;
    color: #FFFFFF;
    letter-spacing: 0.6px;
    line-height: 36px;
}
.homeheaderimage {
    max-height: 668px;
    position: relative;
    left: -65px;
}
.margintop48 {
    margin-top: 48px !important;
}
.homeheader_current-occupation {
    margin-top: 32px;
    padding: 32px;
    border-radius: 8px;
    background: #EDF7F7;
    display: block;
    text-decoration: none;
    transition: all .2s ease-in-out;
}
.homeheader_current-occupation:hover {
    text-decoration: none;
    transform: scale(1.03);
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1);
}
.homeheader_current-occupation_text {
    text-decoration: none;
    font-family: HelveticaNeue-Bold, sans-serif;
    color: #212121;
    letter-spacing: 0.4px;
    vertical-align: middle;
}
.homeheader_current-occupation_text-a {
    color: #025E5D;
    font-family: HelveticaNeue-Bold, sans-serif;
    letter-spacing: 0.4px;
    vertical-align: middle;
}
.homeheader_available-for-projects {
    margin-top: 32px;
    padding: 16px;
    padding-bottom: 20px;
    border-radius: 8px;
    background: rgba(207, 255, 232, 0.5);
    display: block;
    text-decoration: none;
    transition: all .2s ease-in-out;
}
.homeheader_available-for-projects:hover {
    text-decoration: none;
    transform: scale(1.03);
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1);
}
.homeheader_available-for-projects_text {
    text-decoration: none;
    position: relative;
    left: 8px;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 16px;
    color: #26563F;
    letter-spacing: 0.4px;
    vertical-align: middle;
    line-height: 2.3em;
}
a.homeheader_available-for-projects a {
    color: #145637;
}
.current_situation {
    margin-bottom: 72px;
}
.home_cases {
    background: url(../images/casesectionbg.png);
    background-repeat: no-repeat;
    background-position: 64vw top;
    background-size: 320px;
}
.home_cases_cases {
    margin-top: 67px;
}
.homecasetile {
    display: block;
    text-decoration: none;
    padding: 32px;
    border-radius: 8px;
    height: 668px;
    overflow: hidden;
    transition: all .2s ease-in-out;
}
.homecasetile:hover {
    transform: scale(1.03);
    text-decoration: none;
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.20);
}
.homecasetile > h4 {
    opacity: 0.7;
    font-size: 28px;
    color: #FFFFFF;
}
.homecasetile > h3 {
    font-size: 36px;
    color: #FFFFFF;
    letter-spacing: 2.03px;
}
.casetile1 {
    background: #FF9015;
    margin-right: 19px;
}
.casetile2 {
    background: #002771;
    position: relative;
    top: 204px;
    margin-left: 19px;
}
.casetile3 {
    background: #496E07;
    margin-right: 19px;
}
.casethumb_herobalancer {
    width: 428px;
    margin-left: 2em;
    margin-top: 40px;
}
.casethumb_nhs {
    height: 350px;
    position: relative;
    left: -220px;
    margin-top: 80px;
}
.casethumb_website {
    width: 550px;
    margin-left: 2em;
    float: right;
    position: relative;
    top: -10px;
}
.casethumb_amsterdamsports {
    width: 250px;
    margin-left: 100px;
    margin-top: 0px;
}
.cases_cta {
    margin-top: 240px;
    margin-left: 100px;
    width: 350px;
}
.cases_cta > h3 {
    font-size: 36px;
    color: #121212;
    letter-spacing: 2.03px;
}
.home_smalltitle {
    opacity: 0.6;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 24px;
    color: #121212;
    letter-spacing: 0.6px;
    line-height: 32px;
}
.home_bigtitle {
    font-size: 72px;
    color: #121212;
    letter-spacing: 1.8px;
    line-height: 92px;
    vertical-align: baseline;
}
.home_websites {
    background: url(../images/websitessectionbg.png);
    background-repeat: no-repeat;
    background-position: 64vw top;
    background-size: 320px;
    margin-top: 200px;
}
.home_websites_websites {
    margin-top: 67px;
}
.homewebsitetile {
    display: block;
    text-decoration: none;
    padding: 32px;
    border-radius: 8px;
    height: 440px;
    overflow: hidden;
    transition: all .2s ease-in-out;
}
.homewebsitetile:hover {
    transform: scale(1.03);
    text-decoration: none;
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.20);
}
.homewebsitetile > span {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    max-width: 490px;
}
.homewebsitetile h4 {
    opacity: 0.7;
    font-size: 28px;
    color: #FFFFFF;
}
.homewebsitetile h3 {
    font-size: 36px;
    color: #FFFFFF;
    letter-spacing: 2.03px;
}
.websitetile1 {
    background: #FF9015;
}
.websitetile2 {
    background: #2d857a;
    position: relative;
}
.home_about {
    background: url(../images/aboutsectionbg.png);
    background-repeat: no-repeat;
    background-position: right 16vw top 24px;
    background-size: 320px;
    margin-top: 200px;
}
.home_aboutwebdesign {
    background: url(../images/webdesignsectionbg.png);
    background-repeat: no-repeat;
    background-position: right 16vw top 24px;
    background-size: 320px;
    margin-top: 100px;
}
.about_available-for-projects {
    margin-top: 42px;
}
.about_available-for-projects_text {
    position: relative;
    font-family: HelveticaNeue-Bold, sans-serif;
    left: 8px;
    font-size: 16px;
}
.home_degrees {
    margin-top: 200px;
    margin-bottom: 200px;
}
.home_degrees > .container {
    background: url(../images/degreessectionbg.png);
    background-repeat: no-repeat;
    background-position: left 24px center;
    background-size: 420px;
}
.smalltitle-degrees {
    opacity: 100;
}
.degreename {
    padding-bottom: 48px;
}
.home_degrees .home_smalltitle {
    margin-bottom: 0;
    text-decoration: none;
}
.degrees-logo {
    width: 335px;
    margin: 40px 0;
}

/* PULSATING CIRCLE */
.blob {
    float: left;
    background: #36ED94;
    border-radius: 50%;
    margin: 10px;
    height: 20px;
    width: 20px;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
    transform: scale(1);
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(54, 237, 148, 0.7);
    }
    
    70% {
        transform: scale(1.1);
        box-shadow: 0 0 0 20px rgba(54, 237, 148, 0);
    }
    
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(54, 237, 148, 0);
    }
}

/* END PULSATING CIRCLE */

/* END HOMESCREEN */

/* ABOUT */
.headerabout {
    background: linear-gradient(to bottom, rgba(18, 18, 18, 0.9), rgba(18, 18, 18, 0.9)), url(../images/aboutbg.gif) center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 200px 0 238px 0;
    height:
}
.subtitleabout {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 36px;
    color: #FFFFFF;
    letter-spacing: 0.9px;
    line-height: 52px;
    padding-bottom: 14px;
}
.subsubtitleabout {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 24px;
    color: #707070;
    letter-spacing: 0.6px;
    line-height: 36px;
}
.aboutquote {
    padding: 80px 95px;
    background: #FFFFFF;
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.05);
    border-radius: 8px;
    margin-bottom: 40px;
    position: relative;
    top: -150px;
}
.about-highlight {
    margin-bottom: 96px;
}
.about-highlights-caption {
    margin-top: 40px;
}
.about-highlight .img-fluid {
    margin-bottom: 0;
}

/* END ABOUT */

/* WEBDESIGN */
.headerwebdesign {
    margin-top: 0;
}
.headerwebdesign h1 {
    color: #A9D8F5;
    opacity: 0.9;
}
.headerwebdesign h3 {
    color: #A9D8F5;
}
.headerwebdesign h3.subsubtitleabout {
    opacity: 1;
    color: #A9D8F5;
    opacity: 0.87;
}
.webdesign-callout {
    background-image: url(../images/homeheadergradient.png);
    background-repeat: no-repeat;
    background-position: bottom;
}
.webdesign-callout p {
    color: rgba(255, 255, 255, 0.7)!important;
}
.floatingCta {
    position: fixed;
    bottom: 0;
    z-index: 100;
    padding-bottom: 16px;
    transition: all 0.2s;
    opacity: 0;
}
.floatingCtaShow {
    opacity: 1;
    width: 100%;
    bottom: 0px;
}
.floatingCtaHide {
    opacity: 0;
    bottom: -100px;
    width: 100%;
}
.floatingCta a {
    max-width: 500px;
    float: right;
    margin-right: 16px;
    ;
    text-align: center;
    background-color: #311B92;
}
.floatingCta a:hover {
    background-color: #311B92;
}

/* END WEBDESIGN */

/* CONTACT */
.headercontact {
    background: linear-gradient(to bottom, rgba(18, 18, 18, 0.75), rgba(18, 18, 18, 0.75)), url(../images/telephonecell.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 15%;
    height: 715px;
}
.contactcta {
    background: #ffffff url(../images/footermailicon.png) no-repeat right top;
    border-radius: 8px;
    padding: 132px 252px 96px 96px;
    margin-bottom: 344px;
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.05);
}
.contact {
    position: relative;
    top: 264px;
    /*    z-index: 100;*/
}

/* END CONTACT */
.caseheader {
    background-color: var(--case-client-dark-color);
    padding: 175px 0 80px 0;
    margin-bottom: 267px;
}
.caseheader_webdesign {
    padding-bottom: 0;
    margin-bottom: 0;
    background: url(../images/homeheadergradient1.png) no-repeat;
    background-color: var(--case-client-dark-color);
}
.caseheader > h1 {}
.case-content-section {
    padding-bottom: 200px;
}
.case-content-callout {
    background-color: var(--case-client-light-color);
    padding-top: 88px;
    padding-bottom: 88px;
    margin-bottom: 200px;
}
.alert-primary {
    background-color: var(--case-client-light-color);
    border-width: 0;
    margin-top: 32px;
    display: flex;
    align-items: center;
}
.alert-primary > p {
    font-family: HelveticaNeue-Medium, sans-serif;
    font-size: 1.3125rem;
    color: var(--case-client-dark-color);
    letter-spacing: 0.52px;
    line-height: 36px;
    margin: 20px 40px 20px 0px;
}
.centeredcol {
    margin: 0 auto;
}
img.requirementarrow {
    position: relative;
    left: -35px;
    background-color: var(--case-client-dark-color);
    border-radius: 100px;
}
.designchallenge {
    background: #FFFFFF;
    box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.10);
    border-radius: 8px;
    padding: 32px 48px;
    margin-top: 80px;
    border-left: 6px solid var(--case-client-dark-color);
}
.designchallengetext {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 32px;
    color: #121212;
    letter-spacing: 0.8px;
    line-height: 46px;
}
section.requirements {
    margin-bottom: 105px;
    margin-top: 64px;
}
footer {}
.footercta {
    background-image: url(../images/footermailicon.png), url(../images/homeheadergradient.png);
    background-repeat: no-repeat, no-repeat;
    background-position: right top, bottom;
    border-radius: 8px;
    padding: 132px 252px 96px 96px;
    margin-bottom: 120px;
}
.footerillustration {
    width: auto;
    height: 186px;
    position: relative;
    left: 50%;
    top: 93px;
    transform: translateX(-50%);
}
.footersmalltitle {
    opacity: 0.6;
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 24px;
    color: #FFFFFF;
    letter-spacing: 0.6px;
    line-height: 32px;
    margin-bottom: 0px;
}
.h1-footer {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 72px;
    color: #FFFFFF;
    letter-spacing: 1.8px;
    line-height: 96px;
    margin-bottom: 30px;
}
.footer-p {
    font-family: HelveticaNeue, sans-serif;
    color: #FFFFFF;
    letter-spacing: 0.6px;
    line-height: 36px;
}
p.footnote {
    opacity: 0.4;
    font-family: HelveticaNeue-Medium, sans-serif;
    font-size: 18px;
    color: #000000;
    letter-spacing: 0.45px;
    text-align: center;
    line-height: 32px;
    margin-bottom: 80px;
}
.herobalancerlogo {
    width: 246px;
    position: relative;
    left: 80px;
}
.img-fullwidth {
    width: 100%;
    height: 100%;
    max-width: 1920px;
    margin: 80px auto;
}
.img-fluid {
    margin: 80px auto;
}
.smallmargin {
    margin: 40px auto;
}
.screenshotmockup {
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.10);
    margin-left: 64px;
    width: calc(100% - 64px);
}
.screenshotmockupleft {
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.10);
    margin-right: 64px;
    width: calc(100% - 64px);
}
.verticalcenter {
    display: flex;
    justify-content: center;
    align-items: center;
}
.caseheaderimage-herobalancer {
    position: absolute;
    max-width: 785px;
    width: 45%;
    height: auto;
    left: 55%;
    top: 500px;
    margin-bottom: -100%;
}
.caseheaderimage-nhs {
    position: absolute;
    height: auto;
    width: 60%;
    max-width: 1100px;
    top: 550px;
    left: 35%;
    margin-bottom: -100%;
}
.caseheaderimage-amsterdamsports {
    position: absolute;
    height: 1000px;
    left: 61%;
    top: 386px;
    margin-bottom: -100%;
}
.caseheaderimage-herobalancer_website {
    position: absolute;
    max-width: 785px;
    width: 65%;
    height: auto;
    left: 50%;
    top: 30px;
    margin-bottom: -100%;
}
.fullwidthfluidvideo {
    width: 100%;
    height: auto;
}
.quotesection {
    background-image: url("../images/quote-icon.png");
    background-size: 140px;
    background-position: ;
    background-repeat: no-repeat;
}
.blockquote {
    max-width: 730px;
    margin: 0 auto;
    margin-bottom: 114px;
}
.quotebody {
    background: #FFFFFF;
    padding: 32px 48px;
    margin-top: 80px;
    border-left: 6px solid var(--case-client-dark-color);
}
.quoteshadow {
    border-radius: 8px;
    box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.10);
}
.quotename {
    font-family: HelveticaNeue-Bold, sans-serif;
    font-size: 18px;
    color: var(--case-client-dark-color);
    letter-spacing: 0.45px;
    line-height: 28px;
}
.quotetext {
    font-family: HelveticaNeue-Medium;
    font-size: 24px;
    color: #121212;
    letter-spacing: 0.6px;
    line-height: 36px;
}
.quotesource {
    font-family: HelveticaNeue-Italic, sans-serif;
    font-size: 18px;
    color: #121212;
    letter-spacing: 0.2px;
    text-align: right;
    float: right;
    margin-top: 16px;
    line-height: 18px;
    text-decoration: none;
}
.margintop {
    margin-top: 80px;
}
.carousel-inner {
    box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.10);
}
.carouselbuttons {
    margin: 0 auto;
    margin-top: 40px;
    width: 119px;
    float: right;
}
.carousel-control-prev {
    opacity: 100;
    position: relative;
    float: left;
    margin: 0 auto;
    width: 48px;
    margin-right: 23px;
}
.carousel-control-next {
    opacity: 100;
    position: relative;
    float: left;
    margin: 0 auto;
    width: 48px;
    margin-left: 0px;
}
.carousel-control-prev-icon {
    background: url(../images/NHS/nhs-carousel-prev-icon.png);
    background-size: contain;
    height: 48px;
    width: 48px;
}
.carousel-control-next-icon {
    background: url(../images/NHS/nhs-carousel-next-icon.png);
    background-size: contain;
    height: 48px;
    width: 48px;
}
.imgshadow {
    box-shadow: 0 0 100px 0 rgba(0, 0, 0, 0.10);
}
.carousel-indicators {
    position: relative;
    padding-top: 40px;
    margin: 0;
    padding-bottom: 0px;
    float: left;
}
.carousel-indicators [data-target="#carouselExampleIndicators"] {
    background: var(--case-client-dark-color);
    border-radius: 100px;
}
.carousel-indicators li {
    height: 16px;
    width: 16px;
    border-width: 0;
    margin: 0 5px;
    opacity: 20%;
}
.carousel-indicators .active {}
.carousel-item {
    transition: transform 0.6s cubic-bezier(0.65, 0.05, 0.36, 1), -webkit-transform 0.6s cubic-bezier(0.65, 0.05, 0.36, 1);
    transition-property: transform, -webkit-transform;
    transition-duration: 0.6s, 0.6s;
    transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1), cubic-bezier(0.65, 0.05, 0.36, 1);
    transition-delay: 0s, 0s;
}
.scroll-bar {
    height: 0.4em;
    background: var(--case-client-dark-color);
    width: 0%;
    z-index: 100;
    position: fixed;
}

/* media queries */

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
    .greetinghome {
        font-size: 120px;
    }
    
    .casethumb_herobalancer {
        width: 328px;
        margin-left: 2em;
        margin-top: 40px;
    }
    
    .casethumb_nhs {
        height: 320px;
        position: relative;
        left: -220px;
        margin-top: 100px;
    }
    
    .casethumb_amsterdamsports {
        width: 200px;
        margin-left: 85px;
        margin-top: 0px;
    }
    
    .casethumb_website {
        width: 440px;
    }
    
    .case-clientlogo {
        padding-top: 40px;
        margin: 0 auto;
        left: 0 !important;
        max-width: 100%;
    }
    
    .caseheaderimage-herobalancer {
        top: 650px;
    }
    
    .caseheaderimage-nhs {
        top: 750px;
        width: 75%;
        left: 20%;
    }
    
    .caseheaderimage-herobalancer_website {
        top: 120px;
    }
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    .home_cases_cases {
        margin-top: 0px;
    }
    
    .homecasetile {
        margin-top: 68px;
    }
    
    .casetile1 {
        margin-right: 0px;
    }
    
    .casetile2 {
        margin-left: 0px;
        top: 0px;
    }
    
    .casetile3 {
        margin-right: 0px;
    }
    
    .homewebsitetile {
        height: 100%;
    }
    
    .homewebsitetile > span {
        max-width: 100%;
        padding-right: 2em;
        position: relative;
        top: 0;
    }
    
    .casethumb_website {
        width: 100%;
        position: relative;
        margin-top: 2em;
        left: -50%;
        transform: translateX(50%);
    }
    
    .cases_cta {
        margin: 120px auto auto auto;
        width: 100%;
    }
    
    .footercta {
        padding: 132px 64px 96px 64px;
    }
    
    .contactcta {
        padding: 132px 64px 96px 64px;
    }
    
    .home_degrees > .container {
        background-position: right 24px top;
        background-size: 200px;
    }
    
    .case-content-section {
        padding-top: 64px;
        padding-bottom: 64px;
    }
    
    .screenshotmockup {
        margin-left: 0px;
        width: 100%;
        margin-top: 32px;
    }
    
    .caseheaderimage-herobalancer {
        position: inherit;
        height: auto;
        width: 100%;
        left: 0%;
        top: 0px;
        margin-bottom: -50%;
        margin-top: 40px;
    }
    
    .caseheaderimage-nhs {
        position: relative;
        height: auto;
        width: 100%;
        left: 0%;
        top: 0px;
        margin-bottom: -50%;
        margin-top: 40px;
    }
    
    .caseheaderimage-amsterdamsports {
        position: relative;
        height: auto;
        max-height: 800px;
        top: 0px;
        left: 50%;
        margin-bottom: -40%;
        margin-top: 40px;
        transform: translateX(-50%);
    }
    
    .caseheaderimage-herobalancer_website {
        position: inherit;
        height: auto;
        width: 100%;
        left: 0%;
        top: 0px;
        margin-bottom: -50%;
        margin-top: 40px;
    }
    
    .caseheader > .container > .row > .col-xl-8 {
        margin-bottom: 80px;
    }
    
    .caseheader > .container > .row > .websitecase {
        margin-bottom: 24px;
    }
    
    .casethumb_herobalancer {
        width: 80%;
        height: auto;
        margin-left: 10%;
        margin-right: auto;
        margin-top: 20px;
    }
    
    .casethumb_nhs {
        height: 65%;
        display: block;
        position: relative;
        float: right;
        left: 10px;
        right: 0;
        margin: 0 auto;
        margin-top: 60px;
    }
    
    .casethumb_amsterdamsports {
        width: auto;
        display: block;
        height: 100%;
        margin: 0 auto;
        margin-top: 20px;
    }
    
    .greetinghome {
        font-size: 80px;
        letter-spacing: 1.2px;
        left: -20px;
    }
    
    .home_degrees {
        margin-top: 146px;
        margin-bottom: 80px;
    }
    
    .home_about {
        margin-top: 146px;
    }
    
    .home_aboutwebdesign {
        margin-top: 146px;
    }
    
    .headerhomecontainer {
        margin-top: 40px;
    }
    
    .homeheaderimage {
        display: none;
    }
    
    .headerhome {
        background-position: center 130px, top;
        background-size: 500px, cover;
        padding-top: 500px;
    }
    
    .nav-link {
        color: #ffffff;
        text-decoration: none;
        margin: 0 auto;
        text-align: center;
        font-size: 28px;
        padding: 16px 15px;
    }
    
    .aboutquote {
        padding: 46px 64px;
        margin-bottom: 0;
    }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    p {
        font-size: 1.25rem;
        line-height: 32px;
    }
    
    p.designchallengetext {
        font-size: 1.5rem;
        line-height: 36px;
    }
    
    .alert-primary > p {
        font-size: 1.25rem;
        line-height: 32px;
    }
    
    p.caseintro {
        font-size: 1.25rem;
        line-height: 32px;
    }
    
    h1 {
        font-size: 2.625rem !important;
        line-height: 50px;
    }
    
    h2 {
        font-size: 2.25rem !important;
        padding-bottom: 8px;
        line-height: 48px !important;
    }
    
    h3 {
        font-size: 28px !important;
        line-height: 40px;
    }
    
    h3.caseclient {
        font-size: 28px;
        margin-bottom: 4px;
    }
    
    h4 {
        font-size: 24px;
        line-height: 40px;
    }
    
    .homecasetile > h4 {
        font-size: 24px;
    }
    
    .case-content-callout h4 {
        font-size: 1.25rem;
        line-height: 32px;
    }
    
    .home_smalltitle {
        font-size: 1.125rem;
        margin-bottom: 0;
    }
    
    .bigbuttonwhite {
        border-radius: 8px;
        font-size: 18px;
        letter-spacing: 0.6px;
        padding: 16px 28px;
        margin-top: 16px;
    }
    
    .bigbuttonblack {
        border-radius: 8px;
        font-size: 18px;
        letter-spacing: 0.6px;
        padding: 16px 28px;
        margin-top: 16px;
    }
    
    .bigbuttonneutral {
        border-radius: 8px;
        font-size: 18px;
        letter-spacing: 0.6px;
        padding: 16px 28px;
        margin-top: 16px;
    }
    
    .bigbuttongrey {
        border-radius: 8px;
        font-size: 18px;
        letter-spacing: 0.6px;
        padding: 16px 28px;
        margin-top: 16px;
    }
    
    .floatingCta {
        background-color: var(--case-client-dark-color);
    }
    
    .floatingCta a {
        margin-left: 16px;
        width: calc(100% - 32px);
        max-width: 100vw;
        background-color: rgba(255, 255, 255, 0.1);
    }
    
    .floatingCta a:hover {
        background-color: #311B92;
        background-color: rgba(255, 255, 255, 0.1);
    }
    
    .bigbuttonimage {
        height: 24px;
        position: relative;
        left: -12px;
    }
    
    .greetinghome {
        font-size: 64px;
    }
    
    .subtitlehome {
        font-size: 21px !important;
        line-height: 28px;
        padding-bottom: 0px;
    }
    
    .subsubtitlehome {
        font-size: 16px !important;
        line-height: 24px
    }
    
    .case-content-callout {
        margin-bottom: 80px;
    }
    
    .quotebody {
        padding: 32px 24px;
    }
    
    .quotetext {
        font-size: 16px;
        line-height: 28px;
    }
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .headerhome {
        padding-top: 320px;
        background-size: 260px, cover;
        background-position: center 120px, bottom;
    }
    
    .headerhomecontainer {
        padding-bottom: 0;
    }
    
    .case-content-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    
    .home_cases_cases {
        position: relative;
        left: -15px;
        width: calc(100% + 45px);
    }
    
    .home_cases_cases .col-lg-6 {
        padding-right: 0px;
    }
    
    .homecasetile {
        border-radius: 0;
        margin-top: 0px !important;
        height: 580px;
    }
    
    .home_websites_websites {
        position: relative;
        left: -15px;
        width: calc(100% + 45px);
        margin-top: 0;
    }
    
    .first {
        margin-top: 8px;
    }
    
    .home_websites_websites .col-lg {
        padding-right: 0px;
    }
    
    .homewebsitetile {
        border-radius: 0;
        margin-top: 0px !important;
        height: 580px;
    }
    
    .casethumb_website {
        width: 120%;
    }
    
    .home_cases {
        background-position: right 16px top;
        background-size: 156px;
    }
    
    .home_cases .home_bigtitle {
        margin-bottom: 16px;
    }
    
    .cases_cta {
        padding-left: 15px;
        padding-right: 15px;
    }
    
    .casethumb_herobalancer {
        width: 85vw;
        height: auto;
        margin-left: 0em;
        margin-right: 0em;
        margin-top: 20px;
    }
    
    .casethumb_nhs {
        height: 270px;
        display: block;
        position: relative;
        float: right;
        left: 10px;
        right: 0;
        margin: 0 auto;
        margin-top: 60px;
    }
    
    .casethumb_amsterdamsports {
        width: auto;
        display: block;
        height: 440px;
        margin: 0 auto;
        margin-top: 20px;
    }
    
    .greetinghome {
        font-size: 48px;
        line-height: 57px;
    }
    
    .footercta {
        padding: 96px 15px 32px 15px;
        border-radius: 0;
        margin-bottom: 64px;
        background-size: 200px;
    }
    
    .contactcta {
        padding: 96px 15px 32px 15px;
        width: 100vw
    }
    
    .caseheader {
        margin-bottom: 180px;
    }
    
    .standardfooter {
        position: relative;
        left: -15px;
    }
    
    .standardfooter .container {
        padding-right: 0px;
    }
    
    .standardfooter .col-xl-12 {
        padding-right: 0px;
    }
    
    .headercontact {
        position: relative;
    }
    
    .headercontact .container {
        padding-right: 0px;
    }
    
    .headercontact .col-xl-12 {
        padding-right: 0px;
    }
    
    .contact {
        position: relative;
        left: -30px;
        top: 25vh;
    }
    
    .footerillustration {
        height: 128px;
        top: 64px;
    }
    
    p.footnote {
        margin-bottom: 64px;
        font-size: 16px;
    }
    
    .degrees-logo {
        width: 260px;
    }
    
    img.requirementarrow {
        left: -8px;
    }
    
    .alert-primary {
        padding: 0px 20px 0px 20px
    }
    
    .alert-primary > p {
        margin: 20px 0 20px 10px;
        font-size: 1em;
        line-height: 28px
    }
    
    .designchallenge {
        border-radius: 0;
    }
    
    .blockquote .quotebody {
        border-radius: 0;
    }
    
    .namehome {
        margin-top: 24px;
    }
    
    .h1-footer {
        margin-bottom: 16px;
        line-height: 68px;
    }
    
    .home_about {
        background-position: right 4vw top 8px;
        background-size: 160px;
    }
    
    .home_aboutwebdesign {
        background-position: right 4vw top 8px;
        background-size: 160px;
    }
    
    .headerabout {
        padding-top: 80px;
    }
    
    .aboutquote {
        padding: 46px 15px;
        position: relative;
        left: -15px;
        width: calc(100% + 30px);
    }
    
    .navbarmain > a {
        font-size: 1.45rem;
    }
    
    .carousel-indicators li {
        height: 8px;
        width: 8px;
        margin: 0 3px;
    }
    
    .carouselbuttons {
        float: none;
        margin: 90px auto;
    }
    
    .quotesource {
        position: relative;
        right: 15px;
    }
    
    .caseheader_webdesign {
        padding-bottom: 80px;
        margin-bottom: 0;
        padding-top: 80px;
    }
}

/* Extra large devices (large desktops)
/* No media query since the extra-large breakpoint has no upper bound on its width

/* END media queries */