@media only screen and (max-width : 1440px) {

    .callout-wrapper {
        padding: 40px 70px;
    }
}

@media only screen and (max-width : 1280px) {

    .callout-wrapper {
        padding: 40px;
    }

    article.standard {
        padding: 40px 20px 50px
    }
}

@media only screen and (max-width : 1200px) {

    header.main p.float-left {
        float: none;
        height: auto;
        margin-left: 0px;
        padding: 7px 0 0 0;
        border-left: none;
    }

    .sitebranding {
        float: none;
        width: 152px;
        height: 34px;
    }
}

@media only screen and (max-width : 1024px) {

    br.min-tablet-l-wide {
        display: none;
    }

    br.max-tablet-l-wide {
        display: block;
    }

    .header-outer {
        padding-top: 93px;
    }

    .header-wrapper {
        padding: 15px;
    }

    #navicon {
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        right: 10px;
        text-decoration: none;
        z-index: 9;
        width: 40px;
        height: 40px;
        z-index: 3000;
        background: #C0CF13;
        border-radius: 100%;
    }

    #navicon.open {
        border-radius: 20px 0 0 20px
    }

    .scrolled #navicon {
        top: 0px;
    }

    #navicon:before,
    #navicon.closed:before {
        font-family: "Material-Design-Iconic-Font";
        font-size: 1.4em;
        display: block;
        content: '\f197';
        color: #181616;
        width: 40px;
        height: 40px;
        line-height: 40px;
        transition: color 0.3s;
        text-align: center;
        margin: 0;
        cursor: pointer;
    }

    #navicon:before {
        content: '\f136';
    }

    #navicon.closed:before {
        content: '\f197';
    }

    /*.scrolled #navicon.closed:before {
        color: #012b33;
    }*/

    .mobile-nav {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: 100%;
        width: 60%;
        z-index: 5;
        top: 61px;
        top: 0;
        right: -60%;
        position: fixed;
        background: #012b33;
        text-align: left;
        overflow-y: auto;
    }

    nav.main {
        float: none;
        height: auto;
        margin-left: 0;
    }

    nav.main ul {
        text-align: left;
        height: auto;
    }

    nav.main li {
        display: block;
        width: 100%;
        height: auto;
        margin-right: 0px;
        padding: 15px;
    }

    nav.main a {
        color: white;
    }

    .fade {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: #000;
        width: 0;
        opacity: 0.5;
    }

    .banner {
        padding: 50px 0;
    }

    .content-wrapper.split-grey {
        background: white;
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 );
    }

    .content-wrapper.last {
        padding: 0 0 20px;
    }

    article.main {
        width: 100%;
        padding: 30px 20px;
    }

    article.standard {
        padding: 30px 20px 50px;
    }

    article.about {
        width: 100%;
        padding: 30px 20px;
    }

    article.cases {
        width: 100%;
        padding: 30px 20px;
        border-left: none;
    }

    aside {
        width: 100%;
        padding: 30px 20px;
        background: #e5ebec;
    }

    .key-date + h2 {
        margin-top: 40px;
        padding-top: 20px;
    }

    .stats {
        max-width: 70%;
        margin: 0 auto;
    }

    .callout-wrapper {
        float: none;
        width: 100%;
        padding: 20px 100px 40px;
    }

    .insights {
        float: none;
        width: 392px;
        margin: 0 auto;
    }

    .insight {
        float: left;
        margin-bottom: 0;
        margin-right: 1em;
    }

    .insight:last-of-type {
        margin-right: 0;
    }

    footer.top ul:last-of-type {
        margin-top: 20px;
    }

    footer.top ul:last-of-type li {
        height: auto;
        line-height: 1.3;
    }
}

@media only screen and (max-width : 812px) {

    body {
        font-size: 95%;
    }

    br.min-tablet-l {
        display: none;
    }

    .steps-slider .slick-slide {
        width: 100% !important
    }

    /* Test Mode ============================================================================================== Max Width 800px */
    div.testmode p {
        left: 10px;
    }

    div.testmode a {
        right: 10px;
    }

    ul.tm_enabled {
        text-align: left;
        float: right;
    }

    ul.tm_enabled li:last-child {
        margin: 0 10px 0 0;
    }
}

@media only screen and (max-width : 736px) {

    br.min-phone-l-wide {
        display: none;
    }

    div.form-section-grouper {
        margin-bottom: 12px;
        padding: 12px 12px 0;
    }

    div.form-section-grouper.with-bottom-padding {
        padding: 12px;
    }

    div.form-check-group, div.form-radio-group {
        margin-bottom: 12px;
        padding: 12px 12px 2px 12px;
    }

    div.form-input {
        float: none;
        width: 100%;
        margin-right: 0;
        margin-bottom: 12px;
    }
    /* Test Mode ============================================================================================== Max Width 736px */
    div.testmode {
        height: 67px;
        padding: 0 0 8px 0;
    }

    div.testmode p {
        position: relative;
        left: auto;
        top: auto;
        text-align: center;
        margin-bottom: 8px;
    }

    ul.tm_enabled {
        float: none;
        text-align: center;
    }

    ul.tm_enabled li:last-child {
        margin: 0;
    }
}

@media only screen and (max-width : 640px) {

    br.min-phone-l-wide {
        display: none;
    }

    footer.top {
        float: none;
        width: 100%;
    }

    footer.top ul {
        float: none;
        text-align: center;
    }

    footer.top img.logo {
        display: block;
        float: none;
        width: 247px;
        height: 30px;
        margin-right: 0px;
        margin: 20px auto;
    }

    footer.btm {
        float: none;
        width: 104px;
        margin: 20px auto 0;
    }
}

@media only screen and (max-width : 568px) {

    .stats {
        max-width: 100%;
        margin: 0 auto;
    }
}

@media only screen and (max-width : 567px) {

    div.wrapper.tm_enabled {
        padding-top: 131px;
    }

    div.testmode {
        height: 131px;
    }

    ul.tm_enabled {
        width: 260px;
        margin: 0 auto;
    }

    ul.tm_enabled li {
        display: block;
        margin: 0 0 8px 0;
        text-align: left;
    }

    ul.tm_enabled li span.status {
        float: right;
        width: 100px;
        text-align: center;
    }
}

@media only screen and (max-width : 480px) {

    br.min-phone-l {
        display: none;
    }

    a.add.shareholder {
        margin-right: 12px;
    }

    .content-wrapper.last {
        padding: 0 0 20px;
    }

    article.main {
        width: 100%;
        padding: 24px 12px;
    }

    article.standard {
        padding: 24px 12px 50px;
    }

    article.about {
        width: 100%;
        padding: 24px 12px;
    }

    article.cases {
        width: 100%;
        padding: 24px 12px;
        border-left: none;
    }

    aside {
        width: 100%;
        padding: 24px 12px;
        background: #e5ebec;
    }

    .key-date {
        height: 80px;
    }

    .key-date .date {
        width: 80px;
        height: 80px;
        padding: 5px
    }

    .key-date .date p.day {
        font-size: 3em;
    }

    .key-date .date p.month {
        font-size: .75em;
    }

    .key-date .date-info {
        padding: 10px 15px 10px 90px;
        background: #ced9da;
    }

    .announcement {
        padding: 0 15px 0 70px;
    }

    .callout-wrapper {
        padding: 20px;
    }

    .insights {
        width: 290px;
    }

    .insight {
        width: 90px;
        height: 90px;
        margin-right: 10px;
        padding: 7px;
    }

    .insight p {
        font-size: .8em;
    }

    .insight p.total {
        font-size: 1.8em;
    }

    .cases header p.float-right {
        position: relative;
        float: none;
        right: initial;
        bottom: initial;
        margin-bottom: 1em;
    }

    .case {
        padding: 20px;
    }

    div.form-section-grouper.confirmation {
        width: 100%;
    }

    .country-code {
        width: 130px;
    }

    .telephone {
        width: calc(100% - 140px);
    }

    input.secondary-button.back,
    input.secondary-button.cancel,
    input.secondary-button.print {
        font-size: 0;
        width: 44px;
        padding: 0;
        background-position: -2px 50%;
    }

    input.secondary-button.print {
        background-position: -4px 50%;
    }

    a.scrollToTop {
        right: 12px;
    }
}
