@media (min-width: 1200px) {
    #how-slideshow {
        height: 800px;
    }
}

@media (max-width: 1350px) {
}

@media (max-width: 1199px) {
    #intro h3 {
        font-size: 52px;
    }

    #main a {
        padding: 5px;
    }

    .lowHeight .percentages {
        margin-bottom: 40px;
    }

    .lowHeight .percentage h3 {
        font-size: 48px;
    }

    .lowHeight .percentage p {
        font-size: 18px;
    }

    .reference-embed iframe {
        width: 100%;
    }

    #perks h2 {
        width: 100%;
    }

    .perk h3 {
        width: 100%;
    }

    #header > .container, .top .container {
        padding: 0;
    }

    #tackle h3 {
        width: 65%;
    }

    .slide h3 {
        font-size: 24px;
    }

    .slide p {
        font-size: 17px;
    }

    #header nav li {
        margin-left: 17px;
    }
}

@media (max-width: 1024px) {
    #tackle .section-title {
        width: 80%;
        margin: 0 auto;
    }

    #intro .col-md-5 {
        width: 50%;
    }

    #benefits {
        padding: 80px 0 100px;
    }

    #benefits h2 {
        font-size: 60px;
    }

    .benefit {
        font-size: 24px;
        background-size: 30px 30px;
    }

    #benefits header {
        margin-bottom: 60px;
    }

    #intro {
        height: 100%;
        position: relative;
        top: 0;
        margin-top: 0;
        opacity: 1 !important;
    }

    .slick-prev, .slick-next {
        width: 20px;
        height: 35px;
    }

    .slick-prev {
        left: 15px;
    }

    .slick-next {
        right: 15px;
    }

    .darken-bg {
        position: relative;
        display: none;
    }

    #why, #reference-content {
        margin-top: 0 !important;
    }

    #intro {
        background-position: 63% center;
    }

    #reference #intro {
        top: 0px;
        margin-top: 0px;
    }

    #reference-content {
        text-align: center;
    }

    #reference #intro .table {
        margin: 0;
    }

    #home.logged-in #intro {
        top: 0;
    }

    #perks h2 {
        font-size: 28px;
    }

    .perk h3 {
        width: 65%;
    }

    #why .container > p {
        font-size: 21px;
    }

    .flex-control-nav {
        bottom: 14%;
    }

    /* Mobile menu madness */
    #mobile {
        // display: block;
        // position: absolute;
        // right: 5%;
        // top: 0;
        // z-index: 3;
        display: block;
        margin-left: auto;
        margin-right: 10px;
    }

    #navigation {
        position: fixed;
        padding: 25px;
        top: 0;
        right: 0;
        background:#333;
        width: 65%;
        flex-direction: column;
        text-align: right;
        align-items: flex-end;
        transform: translateX(100%);
        transition: 400ms all ease;
        min-height: 100vh;
    }
    
    
    /* body > *:not(#header) {
        transition: 300ms all 
    } */

    /* .menuActive > *:not(#header) {
        filter:  blur(5px);
    } */

    .site-content {
        transition: 400ms all ease;
        position: relative;
    }
    .menuActive .site-content {
        filter:  blur(5px);
    }
    .site-content:before {
        z-index: 2;
        content: "";
        display: block;
        position: absolute;
        top:  0;
        left:  0;
        right:  0;
        bottom:  0;
        position: fixed;
        background: rgba(0, 0, 0, 0.3);
        opacity: 0;
        transition: 400ms all ease;
        visibility: hidden;
    }
    .menuActive .site-content:before {
        opacity: 1;
        visibility: visible;
    }

    /* .menuActive #header {
        background: rgba(0, 0, 0, 0.10) !important;
        height:  100vh !important;
    } */

    #header {
        height: 48px;
        padding-left:  10px;
        padding-right: 10px;
        /* transition: 300ms all ease; */
    }

    .site-logo img{
        height:  28px !important;
    }
    
    .menuActive #navigation {
        transform: translateX(0);
    }

    .menuActive .site-logo {
        display: none;
    }

    .menuActive #header {
        background: none;
    }

    .aside-menu {
        display: block;
    }

    .aside-menu li {
        display: block;
        margin-bottom: 30px;
    }
    

    
    .main-menu {
        padding-top: 40px;
    }

    .main-menu li {
        display: block;
        margin-bottom: 30px;
        padding: 0;
    }

    // #navigation {
    //     position: absolute;
    //     top: -400px;
    //     width: 100%;
    //     left: 0;
    //     background: #FFF;
    //     z-index: 1;
    //     -moz-transition: top 0.4s;
    //     -webkit-transition: top 0.4s;
    //     -ms-transition: top 0.4s;
    // }

    // #navigation nav > ul {
    //     width: 90%;
    //     margin: 0 auto 0;
    //     float: none !important;
    // }

    #header .top > .container {
        /* width: 90%; */
        /* margin: 0 auto;
        display: block; */
    }

    #footer a {
        font-size:  14px;
    }



    /* header */
    #header {
        top: 0 !important;
        position: absolute;
        background: rgba(51, 51, 51, 0.90)

    }

    .front .slick-dots li {
        width:  auto;
        height:  auto;
    }

    .front .slick-dots li button {
        width:  auto;
        height:  auto;
    }

    .front .slick-dots li button:before { 
        height: 6px;
        width:  6px;
    }



    #header #main li, #header .top li {
        margin-left: 0;
    }

    #header #main li {
        margin-bottom: 10px;
    }

    #main a {
        padding: 8px;
    }

    #header .container {
        // width: 100%;
    }

    #header nav li {
        // margin-right: 10px;
        margin-left: 0;
    }

    .lowHeight #intro {
        margin-top: 0px;
    }

    /* top */
    #header > .top {
        display: none;
    }

    .top ul {
        float: none;
        display: block;
        width: 100%;
    }

    /* .top * {
        display: inline-block;
        font-size: 16px;
    } */

    .top li * {
        padding: 5px;
    }

    .top li:hover a {
        color: #666;
    }

    /* main */
    #main a {
        color: #999;
        width: 100%;
        font-size: 18px;
        background: #EEE;
        border-radius: 5px;
    }

    #main li.active a {
        background: #1675a9;
    }

    #main li.active a span {
        color: #FFF;
    }

    #main li:hover span, nav li.active span {
        border: none;
        color: #666;
    }

    .menuActive #main li:hover span, nav li.active span {
        color:  #ddd;
    }


    #aside li {
        vertical-align: middle;
        display: inline-block;
    }

    .login a {
        
        color: #fff;
        background-color: transparent;
        padding: 0;
        line-height: 1;
        border-radius: 0;
        font-size: 16px;

    }

    .language-switcher-locale-url {
        border-left: none;
        margin-left: 0;
    }

    .language-switcher-locale-url li {
        display: inline-block;
    }

    .top a.active {
        color: #333;
    }

    .top .container {
        /* width: 90%; */
        /* margin: 0 auto;
        padding: 0; */
    }

}

@media (max-width: 991px) {
    .reference-embed iframe {
        width: 500px;
    }

    .lowHeight #intro {
        height: auto;
        position: relative;
        top: 0;
        margin-top: 0px;
    }

    .lowHeight #intro .table {
        margin: 100px 0;
    }

    .lowHeight #intro .table-cell {
        opacity: 1 !important;
    }

    .lowHeight #why {
        margin-top: 0 !important;
    }

    #intro .col-md-5 {
        width: 100%;
    }

    #intro {
        text-align: center;
    }

    .darken {
        background: rgba(0,0,0,.4);
    }

    #intro h2 img {
        max-width: 60%;
        width: auto;
    }

    #intro h3 {
        font-size: 42px;
    }

    #intro p.play {
        text-align: center;
    }

    #reference-list {
        margin-left: -4%;
    }

    /* how-slideshow */
    .flex-control-nav {
        bottom: 8%;
    }

    #how-slideshow .col-md-5 {
        width: 41.6667%;
        float: left;
        padding: 0;
    }

    #how-slideshow .col-md-7 {
        width: 58.3333%;
        float: left;
    }

    #how-slideshow .slide img {
        width: 100%;
        margin: 10% auto 0;
    }

    #three img {
        margin-top:;
    }

    .flex-direction-nav a {
        width: 23px;
        height: 39px;
    }

    .flex-next {
        right: 1%;
    }

    .flex-prev {
        left: 1%;
    }

    /* references */
    .reference {
        float: left;
        width: 46%;
        margin: 0 0 4% 4%;
        padding: 0;
    }

    /* sitemap */
    #sitemap {
        margin-bottom: 60px;
    }

    #sitemap header {
        margin-bottom: 60px;
    }

    #sitemap ul {
        width: 100%;
        margin-left: -30px;
    }

    #sitemap li {
        margin-left: 30px;
        display: inline-block;
    }

    /* reference */
    .reference-embed {
        margin-top: 60px;
    }

    .reference-embed iframe {
        display: inline-block;
    }

    .reference-images .row {
        margin-left: -4%;
    }

    .reference-image {
        float: left;
        width: 46%;
        margin: 0 0 4% 4%;
        padding: 0;
    }

    .flex-control-nav {
        bottom: 40px;
    }

    #getconnected {
        height: 100%;
        padding: 100px 0;
    }

    #intro .table-cell > div {
        margin: 0;
    }

    #intro .table {
        margin: 0;
    }

    .lowHeight .percentage {
        width: 22%;
    }

    .lowHeight #how-slideshow .slide-content {
        margin-bottom: 0px;
    }

    .twitter_created_time span, .twitter_created_time em, .twitter_text, .twitter_text a {
        font-size: 21px;
    }

    .tweet.col-md-10 {
        float: left;
        width: 78%;
    }

    .indicator.col-md-2 {
        width: 20%;
        float: left;
        margin-right: 2%;
    }

    .indicator.col-md-2 img {
        width: 100%;
        height: auto;
    }

    #tackle .section-title, #tackle h3 {
        width: 100%;
    }

    .reference-text .text {
        padding-right: 0;
        text-align: center;
    }

    .reference .color {
        display: none;
    }
}

@media (max-width: 768px) {
    /* general */
    .row {
        margin: 0;
    }

    .col-md-7, .col-md-6, .col-md-5, .col-md-4 {
        padding: 0;
    }

    /* other responsive lines */
    .container {
        /* width: 90%; */
        /* margin: 0 auto;
        padding: 0; */
    }

    #intro { /* top: 80px;*/
        margin-top: 0px;
        height: 92%;
    }

    #intro .table-cell > div {
        margin: 100px 0;
    }

    #intro-menu {
        display: none;
    }

    #intro h3 {
        display: inline-block;
        padding-bottom: 20px;
        margin-bottom: 20px;
        margin-top: 20px;
        border-bottom: 1px dotted #FFF;
        font-size: 36px;
    }

    #intro p {
        font-size: 18px;
    }

    #home #intro header {
        text-align: center;
    }

    #home #intro header > * {
        margin-right: 0;
    }

    #intro h3 {
        font-size: 42px;
    }

    #home #intro h2 img {
        max-width: 75%;
    }

    #intro p.play {
        text-align: center;
    }

    .percentages {
        margin-left: -3% !important;
    }

    .percentage {
        width: 42% !important;
        margin: 0 auto 30px 7% !important;
    }

    .lowHeight .percentage {
        width: 35% !important;
    }

    /* fonts */
    /*.section-title h2, #contact-newsletter h2 { font-size: 30px; }*/
    #why .container > p br {
        display: none;
    }

    .cta span {
        font-size: 18px;
    }

    .slide h3 {
        font-size: 25px;
        line-height: 30px;
    }

    /*.flex-direction-nav { display: none; }*/
    #benefits h2 {
        font-size: 48px;
    }

    /*#benefits h2 img { margin-top: 20px; }*/
    .benefit {
        font-size: 24px;
        padding-left: 45px;
        background-size: 30px;
    }

    #partners .slide a {
        width: 100%;
    }

    #interested p {
        font-size: 18px;
        margin-top: 20px;
    }

    /* how-slideshow */
    #how-slideshow {
        height: 800px;
    }

    #how-slideshow .col-md-7 {
        width: 60%;
        margin: 0 auto;
        float: none;
        height: auto !important;
    }

    #how-slideshow .col-md-5 {
        width: 100%;
        float: none;
    }

    .number {
        font-size: 24px;
        width: 52px;
        height: 52px;
        line-height: 47px;
        margin-bottom: 10px;
    }

    /*.slide h2 { font-size: 14px; }*/
    .slide header {
        text-align: center;
        margin-bottom: 30px;
    }

    #how-slideshow #one img {
        margin-top: 0;
    }

    /* forms */
    input {
        width: 100%;
        margin-bottom: 30px;
    }

    .form-steps__step footer {
        margin-left: -20px;
    }

    /*#interactive-form .button { margin-left: 0; }*/
    /* contact */
    #contact-block-bottom {
        padding: 70px 0 40px 0;
    }

    #sitemap {
        margin-top: 0;
        margin-bottom: 30px;
    }

    #sitemap ul:first-child {
        padding-top: 0;
        border-top: none;
    }

    #sitemap ul {
        margin-left: -15px;
        width: 100%; /*margin: 0;*/
        float: none;
    }

    #sitemap li {
        margin: 0 0 15px 15px;
    }

    #sitemap a {
        font-size: 18px;
    }

    #sitemap .row > div {
        padding-top: 20px;
        border-top: 1px dotted #ccc;
    }

    #newsletter-content header img {
        margin-top: 20px;
    }

    #newsletter-content p {
        font-size: 18px;
    }

    #mailchimp-form .button, #newsletter-content label {
        width: 100%;
    }

    #newsletter-content label {
        margin: 20px 0 0 0;
    }

    /* getconnected */
    #getconnected {
        height: auto;
        padding: 150px 0;
    }

    #getconnected img {
        width: 100%;
    }

    #getconnected h2 {
        font-size: 60px;
    }

    /* footer */
    #footer .container .right {
        // width: 100%;
        // margin-left: 0;
        // float: left;
    }

    #footer-nav ul {
    /*     margin-left: -20px; */
    }

    #footer-nav img {
        transform:  scale(0.75);
    }

    .reference-quote article {
        width: 100%;
    }

    .lowHeight #why .section-title {
        width: 100%;
    }

    #tackle .section-title {
        width: 100%;
    }

    #benefits {
        padding: 100px 0;
    }

    .section-title h2 {
        font-size: 42px;
    }

    #reference #intro {
        top: 0;
    }

    .lowHeight #intro .table {
        margin: 20px 0;
    }

    #intro .table-cell > div {
        margin: 20px 0;
    }

    #reference #intro.short {
        height: 300px;
    }

    /*#reference #intro.short .table-cell > div { margin: 80px 0; }*/
    #reference #intro h2 {
        display: block;
    }

    #reference #intro img {
        width: 70%;
    }

    #reference-content {
        margin-top: 0 !important;
    }

    .reference-quote {
        padding: 80px 0;
    }

    .reference-quote h3 {
        font-size: 24px;
    }

    .reference-text {
        padding: 80px 0;
    }

    .reference-text p {
        font-size: 16px;
    }

    .logged-in .page-wrap {
        margin-top: 0;
    }

    #reference #intro {
        margin-top: 0;
    }

    #footer {
        height: auto;
        padding:  5px 0;
    }

    .form-steps {
        width: 100%;
    }

    .form-steps__step {
        width: 90%;
        left: 10%;
    }

    .form-steps__step.current {
        left: 5%;
    }

    .form {
        margin-left: 0;
    }

    .form > input {
        margin-left: 0;
    }

    #interactive-form .button {
        margin-bottom: 20px;
    }

    #home #intro {
        margin-top: 75px;
    }

    .page-wrap {
        padding-top: 80px;
    }

    #news-content .row {
        border-left-width: 8px;
    }

    .twitter_created_time span, .twitter_created_time em, .twitter_text, .twitter_text a {
        font-size: 18px;
    }

    #page .text {
        -webkit-column-count: 1;
        -moz-column-count: 1;
    }

    .scrolldown {
        display: none;
    }

    .perk {
        width: 46%;
    }

    .perk h3 {
        width: 67%;
    }

    /*.language-switcher-locale-url { border-left: none; margin-left: 0; }
    .top a.active { color: #333; }*/
    #partners .slide .logo-wrap { /*width: 16%;*/
        margin-left: 8%;
    }

    #partners .flex-direction-nav {
        top: 58%;
    }

    #how-slideshow #one img {
        margin-top: -20px;
    }

    #how-slideshow #two img {
        margin-top: 0;
    }

    #why .section-title {
        margin-bottom: 40px;
    }

    #why {
        padding: 60px 0;
    }

    #why h2 {
        font-size: 30px;
    }

    .percentages {
        margin-bottom: 40px;
    }

    #why .container > p {
        width: 100%;
    }

    #interactive-form {
        padding: 40px 0 80px;
    }

    /* press */
    .press-items li {
        width: 15%;
    }
}

@media (max-width: 620px) {
    #reference-list, .reference-images .row {
        margin-left: 0;
    }

    .reference, .reference-image {
        width: 100%;
        margin-left: 0;
        margin-bottom: 5%;
    }

    .reference-embed iframe {
        display: inline-block;
        width: 100%;
    }

    #news-content .row {
        border-left-width: 6px;
    }

    .twitter_created_time span, .twitter_created_time em, .twitter_text, .twitter_text a {
        font-size: 16px;
    }

    #reference #intro.short {
        height: auto;
    }

    #reference #intro .pagetitle h2 {
        font-size: 36px;
    }

    /* press */
    .press-items li {
        width: 20%;
    }
}

@media (max-width: 480px) {
    /* #references {
        padding: 80px 0;
    } */

    #references header {
        margin-bottom: 60px;
    }

    #intro {
        height: auto;
    }

    .section-title h2, #contact-newsletter h2 {
        font-size: 28px;
    }

    #why .container > p {
        font-size: 18px;
    }

    .percentages, .lowHeight .percentages {
        margin-left: 0 !important;
        margin-bottom: 0 !important;
    }

    .percentage, .lowHeight .percentage {
        width: 75% !important;
        margin: 0 auto 60px 0 !important;
    }

    #why {
        padding: 100px 0;
    }


    #benefits h2 img {
        margin-top: 20px;
        width: 100%;
    }

    #benefits h2 {
        font-size: 36px;
    }

    /*#how-slideshow .col-md-7 { width: 100%; }*/
    #how-slideshow .col-md-7 {
        width: 50%;
    }

    #how-slideshow .flex-direction-nav {
        top: 50%;
    }

    .benefit {
        text-align: center;
        padding-left: 0;
        padding-top: 45px;
        background-position: center top;
    }

    .reference {
        margin-bottom: 5%;
    }

    /* #partners {
        padding: 80px 0;
    } */

    #partners .slide img {
        width: 70%;
        margin: 0 auto;
    }

    #partners h2 {
        font-size: 20px;
    }

    #partners header {
        margin-bottom: 30px;
    }

    #partners header img {
        vertical-align: -2px;
        width: 100px;
        height: auto;
    }

    #partners .slide .logo-wrap {
        width: 45%;
        margin-bottom: 10%;
        margin-left: 4%;
    }

    /*#interested, #interactive-form { padding: 90px 0; }*/
    #how-slideshow {
        height: 450px;
    }

    /*.slide header { margin-bottom: 0; }*/
    .slide h2 {
        font-size: 18px;
        margin-bottom: 15px;
    }

    .number {
        border-width: 2px;
        display: block;
        margin: 0 auto 15px;
        width: 30px;
        height: 30px;
        font-size: 14px;
        line-height: 30px;
        box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.05);
    }

    .slide h3 {
        font-size: 18px;
        line-height: normal;
    }

    .slide p {
        font-size: 13px;
    }

    .flex-control-nav {
        bottom: 5%;
    }

    .flex-control-nav a {
        width: 12px;
        height: 12px;
    }

    .flex-direction-nav a {
        width: 10px;
        height: 16.8px;
    }

    .lowHeight #intro .table, #intro .table-cell > div {
        margin: 20px 0;
    }

    /* #intro h2 { display: none; }*/
    #intro h2 img {
        width: 70%;
    }

    #intro h3 {
        margin: 10px 0;
        padding: 0;
        border: none;
    }

    #intro p {
        font-size: 18px;
    }

    .play {
        margin-top: 10px;
        padding: 10px;
    }

    .play img {
        width: 30px;
        height: auto;
    }

    .lowHeight .percentage h3 {
        font-size: 72px;
    }

    .lowHeight .percentage p {
        font-size: 24px;
    }

    .section-title h2, #contact-newsletter h2 {
        font-size: 28px;
    }

    input {
        padding: 10px;
        font-size: 18px;
    }

    .button {
        padding: 15px 35px;
        font-size: 21px;
    }

    .form {
        margin-bottom: 0;
    }

    #news-content .row {
        border-left-width: 4px;
    }

    #perks {
        padding: 80px 0;
    }

    .perk {
        width: 100%;
    }

    .perk h3 {
        width: 100%;
    }

    #tackle h3 {
        font-size: 16px;
    }

    .benefit {
        font-size: 18px;
        margin-top: 30px;
        padding-top: 35px;
    }

    #perks h2 {
        font-size: 21px;
    }

    .circle {
        width: 75%;
    }

    .percentage h3 {
        font-size: 48px;
        margin-bottom: 20px;
    }

    .percentage p {
        font-size: 18px;
    }

    .percentage header {
        margin-bottom: 10px;
    }

    .percentage h3 {
        margin-bottom: 0px;
    }

    .percentage, .lowHeight .percentage {
        margin-bottom: 30px;
    }

    .cta span {
        margin-top: 0;
    }

    .perk {
        margin-bottom: 40px;
    }

    .perk img {
        margin-bottom: 20px;
    }

    #perks .container > div {
        padding-top: 30px;
        border-top: 1px dashed #ccc;
    }

    #getconnected h2 {
        font-size: 30px;
    }

    #home #intro header h2 {
        display: none;
    }

    .contact-link.fixed {
        right: 5%;
        display: block;
        background-position: center 14px;
        height: 45px;
        padding: 10px;
        text-indent: -9999px;
        width: 40px;
    }

    /* press */
    .press-items li {
        width: 40%;
    }
}

@media (max-width: 450px) {
    #zologie {
        margin-top: 0;
    }
}

@media (max-width: 320px) {
    #aside {
        text-align: center;
    }

}
