a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}

ol, ul {
    list-style: none
}

blockquote, q {
    quotes: none
}

    blockquote:after, blockquote:before, q:after, q:before {
        content: "";
        content: none
    }

table {
    border-collapse: collapse;
    border-spacing: 0
}

strong {
    font-weight: 700
}

@font-face {
    font-family: geologica;
    src: url("/fonts/Geologica-VariableFont_CRSV,SHRP,slnt,wght.ttf")
}



html {
    height: 100%
}

body {
    font-family: geologica, Arial, Helvetica, sans-serif;
    font-size: 100%;
    color: #666;
    margin: 0;
    padding: 0;
    height: 100%;
    display: table;
    width: 100%;
    font-weight: lighter
}

p {
    margin: 1em 0;
    line-height: 1.3em;
    padding: 0;
    font-size: 1.2em
}

    p.bold {
        margin: 1em 0;
        line-height: 1.3em;
        font-weight: 700;
        padding: 0
    }

    p.larger {
        font-size: 1.3em
    }

    p.italic {
        font-style: italic;
        font-size: 1.2em
    }

    p.name {
        color: #fff;
        font-size: 1.2em;
        padding: 1em;
        text-align: center;
        display: block
    }

a {
    color: #6cb1db;
    text-decoration: none;
    font-weight: 700
}

    a:hover {
        color: #000
    }

ol, ul {
    margin: 1em 1em;
    padding: 0 1em 0 1.5em;
    font-size: 1.3em;
    line-height: 1.3em
}

    ul li {
        list-style: disc;
        padding-bottom: 8px
    }

    ol li {
        list-style: decimal;
        padding-bottom: 8px
    }

    ul li a {
        color: #666;
        text-decoration: none;
        font-weight: 400
    }

        ul li a:hover {
            color: #333
        }

img, img.scale {
    width: 100%;
    max-width: 100%;
    height: auto
}

.logo img.scale {
    max-width: 250px;
    padding: 10px 0 0 0
}

.holdinglogo img.scale {
    max-width: 250px;
    padding: 10px 0 0 0;
    margin: 1em auto
}


@media only screen and (max-width:768px) {
    .logo img.scale {
        max-width: 250px;
        padding-bottom: 0
    }
}

.banner img.scale {
    padding: 10px 0
}

.clear {
    clear: both
}

h1 {
    font-weight: 400;
    font-size: 2.25em;
    line-height: 1.2em;
    margin: 1em 0;
    padding: 0;
    text-align: center;
    color: #005057;
    text-transform: capitalize
}

.topbannertext h1, .topbannertext2 h1 {
    color:  #005057;
    text-align: center;
    font-size: 1.2em;
    font-weight: normal;
    text-transform: uppercase
}

h2 {
    font-weight: 400;
    font-size: 1.5em;
    line-height: 1.2em;
    margin: .5em 0 0 0;
    padding: 0;
    text-align: left;
    color: #93328e;
    text-transform: capitalize
}

    h2.home {
        font-size: 2em;
        margin: 0 auto .5em auto;
        text-align: center;
        background-color: #d9d7df;
        color: #93328e;
        text-transform: capitalize;
        max-width: 60%;
        padding: .5em 2em
    }

h3 {
    font-size: 1.5em;
    line-height: 18px;
    margin-bottom: 10px;
    padding: 0 0 0 .5em;
    font-weight: 600;
    color: #93328e
}

span.bold {
    font-weight: 700
}

hr {
    color: #fff;
    border: 1px dashed #333;
    margin: 2em 0
}

@media only screen and (max-width:640px) {
    h2.home {
        max-width: none;
        width: 93%;
        margin: .75em 0;
        padding: .5em .5em
    }
}

@media only screen and (max-width:414px) {
    .topbannertext h1 {
        font-size: 1em
    }

    h2.home {
        max-width: none;
        width: 90%
    }
}

input[type=submit] {
    cursor: pointer
}

div.error {
    color: #c00;
    margin: 1em 0
}

#maincontainer {
    margin: 0 0 2em 0;
    height: 100%;
    background-color: #fff
}

header {
    margin-top: 0;
    padding: 0;
    width: 100%;
    border-top: 15px solid #93328e;
    border-bottom: 15px solid #93328e;
    background-color: #fff
}

.content {
    padding-bottom: 2em !important
}

.contact {
    font-size: 1.7em;
    font-weight: 400
}

.topbanner {
    background-image: url(/images/testtopbanner.jpg);
    background-position: top center;
    background-repeat: no-repeat
}

.topbanner2 {
    background-image: url(/images/scute-career-transition-banner2.jpg);
    background-position: top center;
    background-repeat: no-repeat
}

.topbannertext {
    padding: 1.5em 2em 2em 2em !important;
    margin: 2em auto;
    background-image: url(/images/tranbg.png);
    background-repeat: repeat;
    border: 1px solid #ccc;
    text-align: center;
    color: #000;
    font-size: 1.7em;
    max-width: 600px
}

    .topbannertext a {
        background-color: #62225f;
        color: #fff;
        padding: 5px 15px;
        border-radius: 25px
    }

        .topbannertext a:hover {
            color: #6cb1db
        }

.homefullwidth {
    background-color: #e5e5e5;
    width: 98% !important;
    box-sizing: border-box;
    padding: 0 1em 1em 1em
}

.homefullwidth, .homefullwidth2 {
    text-align: center
}

    .homefullwidth p {
        font-size: 1.5em;
        margin: 1.5em .5em .5em .5em;
        padding: 0;
        color: #31538a
    }

    .homefullwidth2 p {
        font-size: 1.4em;
        margin: 0;
        padding: 2em 3em
    }

.homefull {
    background-color: #fff;
    text-align: center
}

    .homefull p {
        font-size: 1.3em;
        margin: 2em;
        padding: 0
    }

.call {
    text-align: center !important;
    padding: 1em 0 1em 0
}

p.button a {
    background-color: #005057;
    color: #fff;
    padding: 5px 15px;
    border-radius: 25px;
    width: 200px;
    font-weight: lighter
}

p.download {
    margin: 2em 0 !important
}

    p.download a {
        background-color: #31538a;
        color: #fff;
        padding: 5px 15px;
        border-radius: 25px;
        width: 200px;
        
    }

        p.button a:hover, p.download a:hover {
            color: #55CABE
        }

.homebanner2 {
    color: #31538a;
    height: 300px
}

    .homebanner ul, .homebanner2 ul {
        margin: 1em 0;
        padding: 0 1em;
        box-sizing: border-box
    }

        .homebanner ul li, .homebanner2 ul li {
            line-height: 1.2em;
            list-style: none;
            padding: 20px
        }

        .homebanner2 ul li {
            font-size: 1.35em;
            padding: 16px 10px 16px 0;
            margin-left: 30px
        }

            .homebanner2 ul li::before {
                content: "•";
                color: #875ca7;
                display: inline-block;
                width: .9em;
                margin-left: -1em
            }

.homebanner p {
     line-height: 1.2em;
    padding: 12px 1em 16px 1em;
    text-align: center;
    color: #165c90
}

span.step {
    font-size: 1.1em;
    font-style: italic
}

@media only screen and (max-width:414px) {
    .topbanner {
        background-image: url(/images/mobiletopbanner.jpg);
        background-position: top center;
        background-repeat: no-repeat
    }

    .topbanner2 {
        background-image: url(/images/mobiletopbanner.jpg);
        background-position: top center;
        background-repeat: no-repeat
    }
}

div.form {
    width: 70%;
    margin: 1em auto 1em auto;
    padding: 0;
    align-content: center !important
}

input {
    font-family: geologica, Arial, Helvetica, sans-serif;
    border: 1px solid #999;
    border-radius: 7px;
    padding: 10px;
    margin: .5em 5px;
    color: #452d5e;
    font-size: 1.1em
}

    input[type=checkbox] {
        width: 25px;
        margin: 0 0 0 6px;
        position: relative
    }



ul.articles {
    width: 80%;
    margin: 1em auto;
    padding: 1em
}

    ul.articles li {
        list-style: none;
        padding: 0 2em 3em 3.5em;
        background-image: url(/images/iii.gif);
        background-position: left top;
        background-repeat: no-repeat
    }

span.date {
    font-size: 1.2em;
    font-weight: 700
}

span.more {
    width: 100%
}

    span.more a {
        color: #8e67a9
    }

#nonFooter {
    display: table;
    width: 100%
}

* html #nonFooter {
    height: 100%
}

footer {
    display: block;
    clear: both;
    position: relative;
    z-index: 10;
    background-color: #ED0D6C;
    margin-top: 0;
    padding: 0;
    width: 100%;
    color: #fff;
    line-height: 1.3em
}

.footertext {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    max-width: 1200px;
    font-size: 0.9em
}

    .footertext ul {
        margin: 0.5em 0;
        padding: 0
    }

        .footertext ul li {
            display: block;
            list-style: none;
            padding: 0 10px 4px 0
        }

    .footertext a {
        color: #fff;
        font-weight: 400
    }

        .footertext a:hover {
            color: #000
        }

    .footertext img {
        margin-right: 8px;
        max-width: 100%
    }

    .footertext p {
        line-height: 1.5em
    }

        .footertext p.footurl {
            font-size: 1.5em;
            line-height: .75em
        }

.nav {
    margin: 0;
    padding: 0;
    text-align: right
}

    .nav ul {
        margin: 0;
        padding: 20px 0 0 0;
        z-index: 100;
        position: relative;
        font-size: 1.2em
    }

        .nav ul li {
            list-style: none;
            display: inline
        }

            .nav ul li a {
                text-decoration: none;
                padding: 0 8px 3px 8px;
                text-transform: uppercase;
                font-weight: 700
            }

            .nav ul li.topnav a {
                background-color: #99328e;
                color: #fff;
                padding: 3px 25px;
                border-radius: 25px;
                width: auto;
                font-size: 1.1em;
                text-transform: capitalize
            }

            .nav ul li a.one {
                color: #99328e
            }

            .nav ul li a.two {
                color: #039
            }

            .nav ul li a:hover {
                color: #5587bf;
                border-bottom: 2px dashed #5587bf
            }

            .nav ul li.topnav a:hover {
                color: #5587bf;
                border: none
            }

            .nav ul li a.on {
                border-bottom: 2px dashed #039;
                color: #039
            }

        .nav ul li {
            position: relative
        }

        .nav ul ul {
            margin: 0;
            padding: .35em 3px 0 3px;
            display: none;
            position: absolute;
            top: 20px;
            left: 0;
            font-size: .9em;
            font-weight: 400 !important;
            width: auto;
            z-index: 102;
            background-color: #fff
        }

        .nav ul li.over ul, .nav ul li:hover ul {
            display: block
        }

        .nav ul li ul li {
            padding: 0
        }

            .nav ul li ul li a.drop {
                display: block;
                text-decoration: none;
                padding: 5px 10px;
                text-align: left;
                background-color: #fff;
                text-transform: capitalize;
                color: #039;
                border-bottom: 1px dashed #039
            }

                .nav ul li ul li a.drop:hover {
                    color: #5587bf
                }

.section {
    max-width: 1200px;
    margin: 0 auto;
    clear: both;
    padding: 8px
}

header .section {
    max-width: 1400px;
}

@media only screen and (max-width:1024px) {
    .section {
        max-width: 95%;
        padding-left: 10px
    }
}

@media only screen and (max-width:800px) {
    .section {
        max-width: 95%;
        padding-left: 1em
    }

    .topbanner .section, .topbanner2 .section {
        max-width: 95%;
        padding-left: 0
    }
}

.col {
    display: block;
    float: left;
    margin: .5% 2% 1% 0
}

.col1 {
    margin-left: 0
}

.col.topbanner {
    display: block;
    float: left;
    margin: 1% 0 1% 0
}

.col.topbanner2 {
    display: block;
    float: left;
    margin: 0 !important;
    padding: 0 !important
}

@media only screen and (max-width:667px) {
    .col {
        margin: 0 2% 1% 0 !important
    }
}

.span_1 {
    width: 100%;
    text-align: center
}

.span_2_2 {
    width: 100%
}

.span_1_2 {
    width: 48%;
    padding: 0
}

    .span_1_2.homebanner2 {
        width: 48%;
        padding: 0
    }

@media only screen and (max-width:860px) {
    .contact.span_1_2 {
        width: 75%;
        padding: 0
    }
}

@media only screen and (max-width:667px) {
    .span_1_2 {
        width: 98%;
        padding: 0
    }

    .banner.span_1_2 {
        width: 48%;
        padding: 0
    }

    .span_1_2.homebanner, .span_1_2.homebanner2 {
        width: 98%;
        padding: 0;
        margin-bottom: 1em !important
    }
}

@media only screen and (max-width:414px) {
    .span_1_2 {
        width: 98%;
        padding: 0
    }

    .banner.span_1_2 {
        width: 98%;
        padding: 0
    }

    .span_1_2.homebanner, .span_1_2.homebanner2 {
        width: 100%;
        padding: 0;
        margin-bottom: 12px !important
    }
}

.span_3_3 {
    width: 100%
}

.span_2_3 {
    width: 65%
}

.span_1_3 {
    width: 31%;
    padding: 0;
    text-align: center
}

.logo.span_1_3 {
    text-align: left
}


.span_1_3.homebanner {
    width: 31.15%;
    padding: 0
}

.span_1_3 ul {
    text-align: left
}

@media only screen and (max-width:1024px) {
    .logo.span_1_3 {
        width: 30%;
        padding: 0
    }

    .nav.span_2_3 {
        width: 100%
    }

    .span_1_3.homebanner {
        width: 30%;
        padding: 0;
        text-align: center
    }
}

@media only screen and (max-width:860px) {
    .span_3_3 {
        width: 100%
    }

    .span_2_3 {
        width: 100%
    }

    .span_1_3 {
        width: 45%
    }

        .span_1_3.homebanner {
            width: 31%;
            padding: 0
        }
}

@media only screen and (max-width:768px) {
    .logo.span_1_3 {
        width: 65%
    }

    .span_1_3.homebanner {
        width: 31%;
        padding: 0
    }

    .span_2_3.new {
        width: 100%
    }
}

@media only screen and (max-width:568px) {
    .logo.span_1_3 {
        width: 75%
    }

    .span_1_3.homebanner {
        width: 100% !important;
        padding: 0;
        margin-bottom: 1em
    }
}

@media only screen and (max-width:414px) {
    .span_1_3.homebanner {
        width: 100% !important;
        padding: 0;
        margin-bottom: 1em
    }
}

.span_4_4 {
    width: 100%
}

.span_3_4 {
    width: 74%
}

.span_2_4 {
    width: 49.2%
}

.span_1_4 {
    width: 23%
}

.article.span_1_4, .team.span_1_4 {
    width: 25%
}

.article img, .team img {
    max-width: 250px
}

.article.span_3_4, .team.span_3_4 {
    width: 60%;
    padding: .5em 0 0 0
}

.article.span_3_4 {
    padding: 0;
    box-sizing: content-box;
    width: 70%
}

.footertext .col {
    padding: 2em 0
}

.footertext .span_1_4 {
    width: 25%
}

    .footertext .span_1_4.right {
        text-align: right;
        width: 17%
    }

@media only screen and (max-width:1200px) {
    .span_1_4 {
        width: 23%
    }
}

@media only screen and (max-width:1024px) {
    .article.span_3_4, .team.span_3_4 {
        width: 70%;
        padding: 0
    }
}

@media only screen and (max-width:960px) {
    .span_1_4 {
        width: 22%
    }

    .span_3_4 {
        width: 73%
    }

    .footertext .span_1_3 {
        width: 31%
    }

        .footertext .span_1_3.right {
            text-align: left;
            width: 100%
        }

    .footertext .col {
        padding: 0
    }
}

@media only screen and (max-width:768px) {
    .footertext .span_1_3 {
        width: 90%
    }
}

@media only screen and (max-width:667px) {
    .article.span_1_4, .team.span_1_4 {
        width: 25%;
        max-width: 250px
    }

    .article.span_3_4, .team.span_3_4 {
        width: 68%;
        padding: 0
    }
}

@media only screen and (max-width:414px) {
    .span_1_4 {
        width: 42%
    }

    .span_3_4 {
        width: 95%
    }

    .footertext .span_1_4 {
        width: 90%;
        padding: 0 0 0 1em
    }

    .team.span_1_4 {
        width: 50%
    }

    .team.span_3_4 {
        width: 95%
    }
}

.span_5_5 {
    width: 100%
}

.span_4_5 {
    width: 79.68%
}

.span_3_5 {
    width: 59.36%
}

.span_2_5 {
    width: 39.04%
}

.span_1_5 {
    width: 18.7%
}

@media only screen and (max-width:800px) {
    .span_1_5 {
        width: 50%
    }

    .span_2_5 {
        width: 100%
    }

    .span_3_5 {
        width: 100%
    }
}

@media only screen and (max-width:600px) {
    .span_1_5 {
        width: 100%
    }

    .span_4_5 {
        width: 95%
    }
}

.span_6_6 {
    width: 100%
}

.span_5_6 {
    width: 83.06%
}

.span_4_6 {
    width: 66.13%
}

.span_3_6 {
    width: 49.2%
}

.span_2_6 {
    width: 30.26%;
    padding-left: 2%
}

.span_1_6 {
    width: 15.33%
}

@media only screen and (max-width:768px) {
    .span_6_6 {
        width: 100%
    }

    .span_5_6 {
        width: 100%
    }

    .span_4_6 {
        width: 100%
    }

    .span_3_6 {
        width: 100%
    }

    .span_2_6 {
        width: 100%;
        padding-left: 0
    }

    .span_1_6 {
        width: 50%
    }
}

.group:after, .group:before {
    content: "";
    display: table
}

.group:after {
    clear: both
}

@media only screen and (max-width:1024px) {
    .nav ul {
        margin: 0 0 0 .5em;
        padding: 55px 0 0 0;
        z-index: 100;
        position: relative;
        font-size: 1.1em
    }

        .nav ul li a {
            padding: 0 10px 0 0
        }

    .logo img.scale {
        max-width: 300px
    }

    .nav {
        margin: 0;
        padding: 0;
        text-align: left
    }

        .nav ul {
            padding: 0 0 20px 0;
            font-size: 1em
        }

    .footertext p.footurl {
        font-size: 1.35em
    }

    .homebanner2 {
        height: 375px !important
    }
}

@media only screen and (max-width:960px) {
    .homebanner2 ul {
        width: 96% !important
    }

        .homebanner2 ul li {
            padding: 15px .5em !important;
            font-size: 1.15em
        }

    .homebanner2 {
        height: 355px !important
    }

    .homebanner p {
        font-size: 1.25em
    }
}

@media only screen and (max-width:860px) {
    .footertext {
        width: 97%;
        max-width: 1200px
    }
}

@media only screen and (max-width:800px) {
    .nav ul {
        font-size: .9em
    }
}

@media only screen and (max-width:768px) {
    .nav {
        text-align: left;
        font-size: .9em
    }

        .nav ul {
            margin: 0;
            padding: 15px 0 20px 10px;
            z-index: 100;
            position: relative;
            font-size: 1.1em
        }

            .nav ul ul {
                margin-left: 6px
            }

    .footertext p.footurl {
        font-size: 1.25em
    }

    .homebanner2 {
        height: 400px !important
    }
}

@media only screen and (max-width:736px) {
    .nav {
        margin: 0;
        padding: 0;
        text-align: left;
        font-size: .9em
    }

        .nav ul {
            margin: 1em 0 0 .5em;
            padding: 0 0 20px 0;
            z-index: 100;
            position: relative;
            font-size: 1em
        }

            .nav ul li {
                list-style: none;
                display: block
            }

    .topbannertext {
        padding: 1.5em 1em 2em 1em !important;
        margin: 2em auto;
        color: #000;
        font-size: 1.2em;
        max-width: 90%
    }
}

@media only screen and (max-width:667px) {
    .homebanner2 {
        height: auto;
        max-height: 300px;
        margin: 1em 0 !important
    }

    .homefullwidth p {
        font-size: 1.2em
    }
}

@media only screen and (max-width:600px) {
    .nav {
        margin: 0;
        padding: 0;
        text-align: left
    }

        .nav ul {
            margin: 1em 0 0 .5em;
            padding: 0 0 20px 0;
            z-index: 100;
            position: relative;
            font-size: 1em
        }

            .nav ul li {
                list-style: none;
                display: block
            }

                .nav ul li a {
                    padding: 0
                }

            .nav ul ul {
                margin: 0;
                padding: .5em 0 0 0;
                display: none;
                position: absolute;
                top: -10px;
                left: 105px;
                font-size: .9em;
                font-weight: 400 !important;
                width: auto;
                z-index: 102;
                background-color: #fff
            }
}

@media only screen and (max-width:414px) {
    .contact {
        font-size: 1.2em
    }

    .homebanner2 {
        height: auto;
        max-height: 370px
    }

        .homebanner2 ul li {
            padding: 15px .5em !important;
            font-size: 1.2em;
            margin-left: 1em
        }

    .homefullwidth2 p {
        padding: 2em 1em
    }

    .topbannertext {
        padding: 1.5em .25em 2em .25em !important;
        margin: 2em 0 .5em 10px;
        color: #000;
        font-size: 1.2em;
        max-width: 94% !important
    }

        .topbannertext p {
            font-size: 1em
        }

        .topbannertext a {
            background-color: #93328e;
            color: #fff;
            padding: 5px 10px;
            border-radius: 25px;
            font-size: .95em !important
        }

    .homebanner2 {
        height: auto;
        max-height: 335px
    }

        .homebanner2 ul {
            width: 98% !important;
            padding: 5px;
            margin: .5em 0
        }

            .homebanner2 ul li {
                font-size: 1.1em;
                padding: 6px 6px 6px 0;
                margin-left: 20px
            }

    .homefullwidth {
        background-color: #e5e5e5;
        width: 89% !important;
        box-sizing: content-box;
        padding: 0 1em 1em 1em
    }
}

@media only screen and (max-width:320px) {
    .topbannertext {
        margin: 2em 0 2em .5em
    }
}

.lity-iframe .lity-container {
    max-width: 450px !important
}

.lity-content {
    padding: 0 10px !important
}

.lity-iframe-container {
    height: 650px !important
}
/*-- .lity-iframe-container iframe {
  overflow-x: hidden !important;
  overflow-y: auto !important
}  --*/

.lightbox {
    width: 90%;
    max-width: 800px;
    height: auto;
    background-image: url(/images/lightbox.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    padding: 3em 1em 4em 1em;
    z-index: 1;
    margin: 2em auto 2em auto;
    border: 1px solid #ccc;
    color: #fff
}

.lbcontent {
    width: 70%;
    margin: 0 auto 0 auto !important;
    padding: 2em;
    text-align: center;
    z-index: 2;
    background-image: url(/images/lbtransparent.png);
    background-repeat: repeat;
    border: 1px solid #ccc
}

    .lbcontent p {
        color: #fff
    }

        .lbcontent p.first {
            font-size: 2em;
            color: #fff;
            margin: .5em 0 0 0
        }

        .lbcontent p.lbsmaller {
            font-size: 1em;
            color: #fff;
            line-height: 1.2em;
            margin: .5em 0 1em 0
        }

.lightbox .close {
    font-size: 1.5em;
    color: #666;
    text-align: right;
    padding: 0 1em 0 0;
    font-weight: 700
}

.lbcontent input {
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 4px 8px;
    width: 65%;
    font-size: 1em;
    margin: 0 0 1em 0;
    color: #999;
    text-align: center
}

    .lbcontent input[type=submit] {
        border: 1px solid #999;
        background-color: #e5e5e5;
        color: #333;
        padding: 4px 8px;
        width: 40%;
        font-size: .9em
    }

.lbcontent span.error {
    color: #c03;
    line-height: 25px
}

.lbcontent a {
    color: #fff;
    text-decoration: underline;
    font-weight: 400
}

@media only screen and (max-width:576px) {
    .lightbox {
        max-width: 500px
    }

    .lbcontent {
        width: 85%;
        padding: 2em
    }
}

@media only screen and (max-width:480px) {
    .lightbox {
        max-width: 350px
    }

    .lbcontent {
        width: 85%;
        padding: 2em 1em
    }
}


.section.new {
    width: 100%;
    max-width: 100%;
    clear: both;
    padding: 2.75em 0;
    margin: 0
}

    .section.new.bluefoot {
        padding: 0;
        background-color:#2D9188;
        color: #fff
    }

.tophead a {
    color: #fff;
    font-size: 1.3em
}

.row {
    width: 70%;
    margin: auto;
    padding: 0;
    clear: both
}

.section.new .col {
    display: block;
    float: left;
    margin: 0 1% !important
}

.section.new .col {
    display: block;
    float: left;
    margin: 0 1% !important
}

.grey {
    background-color: #e5e5e5;
    color: #333
}

.pink {
    background-color: #ED0D6C;
    color: #fff
}

.white {
    background-color: #fff;
    color: #666;
    padding: 2em 0 2em 0 !important
}

.purple {
    background-color: #9B5DA5;
    color: #fff
}

.green {
    background-color: #2D9188;
    color: #fff
}

.blue {
    background-color: #007CC4;
    color: #fff
}

.dgreen {
    background-color: #005057;
    color: #FFF
}

.blue img, .green img, .orange img, .pink img, .purple img {
    max-width: 75%;
    margin: 0 0 -4px 0 !important;
    padding: 0 0 0 1% !important
}

.section.new .col.testimonial {
    color: #fff;
    padding: 0;
    margin: 2em 1em !important;
    box-sizing: border-box;
    border-radius: 12px;
    font-size: 1.1em
        
}

.section.new .col.testsgreen {
    background-color: #2D9188
}

.section.new .col.testspurple {
    background-color: #9B5DA5
}

.section.new .col.testsyellow {
    background-color: #C6CC42}

.section.new .col.testsorange {
    background-color: #F9A777
}

.section.new .col.testspink {
    background-color: #ed2a81
}

.section.new .col.testsblue {
    background-color: #007CC4;
}

.section.new .col.testimonial .body {
    box-sizing: border-box;
    height: 80%
}

    .section.new .col.testimonial .body p {
        font-style: italic;
        font-size: 1.1em;
        text-align: center;
        padding: 1em 2em
    }

.section.new .col.testimonial .footer {
    box-sizing: border-box;
    height: 20%;
    background-color: #e5e5e5;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    background-image: url(/images/quote.png);
    background-position: bottom right;
    background-repeat: no-repeat
}

    .section.new .col.testimonial .footer p {
        font-size: 1.2em;
        text-align: center;
        padding: 1em 1em 1em;
        color: #333;
        margin: 0
    }

@media only screen and (max-width:1140px) {
    .section.new .col.testimonial .body {
        box-sizing: border-box;
        height: 85%
    }

    .section.new .col.testimonial .footer {
        box-sizing: border-box;
        height: 15%
    }
}

span.step {
    font-size: 1.2em;
    font-style: italic;
    line-height: 1.5em
}

.new ul {
    font-size: 1.2em;
    margin: 1em 2em;
}

.span_1_2.new {
    width: 48%;
    padding: 0;
    box-sizing: border-box
}

.span_1.new {
    width: 98%;
    text-align: center
}

.white .span_1.new {
    text-align: left
}

    .white .span_1.new p.button {
        text-align: center !important
    }

.span_1_3.new {
    width: 28%;
    box-sizing: border-box
}

    .span_1_3.new.homearticle {
        width: 32%;
        box-sizing: border-box;
        margin-left: 1em !important
    }

h2.home {
    max-width: 100%;
    margin: 0 auto 0 auto;
    padding: .5em 0;
    background-color: transparent;
    color: #31538a
}



.row a {
    color: #333
}

    .row a:hover {
        color: #31538a
    }

.homebanner p {
    font-size: 1.4em;
    line-height: 1.2em;
    padding: 0 6px 12px 6px
}

span.step {
    color: #31538a
}

p.button.navy a {
    background-color: #ed2a81;
    font-size: 1.5em
}

    p.button.navy a:hover {
        background-color: #31538a
    }

.topbanner a {
    background-color: #005057;
    padding: 5px 20px;
    font-size: 0.75em;
    font-weight: lighter
}

.topbanner a:hover {color:#55CABE}

p.intro {
    font-size: 1.75em;
    font-style: italic;
    color: #62225f;
    margin-top: .75em
}

.homearticle {
    background-color: #f5f5f5;
    padding: 0 0 1em 0
}

    .homearticle p {
        padding: 0 1em;
       
    }

        .homearticle p.navy {
            color: #005057;
            font-size: 1.25em;
           
        }

.col.span_1.topbanner {
    display: block;
    float: left;
    margin: 0 !important
}

header {
    border-top: 0;
    border-bottom: 10px solid #ED0D6C
}

.nav ul li.topnav {
    padding: 3px 25px;
    border-radius: 25px;
    width: auto;
    font-size: 1.1em
}

.nav ul li.topnav {
    background-color: #99328e;
    color: #fff;
    padding: 3px 25px;
    border-radius: 25px;
    font-size: 1.1em;
    text-transform: capitalize
}

/*--- calendly {
    
    color: #fff;
    padding: 3px 25px;
    border-radius: 25px;
    max-width: 200px;
    font-size: 1.5em;
    text-transform: capitalize;
    text-align: center;
    margin: 0 auto
}


----*/

    .nav ul li.topnav:hover, p.calendly:hover {
        color: #6cb1db
    }

.footertext {
    width: 90%
}

 a.fish {
    color: #fff;
    font-size: .75em;
    font-weight: normal!important;
   float: right
}

  a.fish:hover {
        color: #000
    }

.social i {
    padding: 1.25em 6px;
    font-size: 1.25em
}

@media only screen and (max-width:1366px) {
    .row {
        width: 90%
    }

    .section {
        padding: 8px 2%
    }

    .new ul {
        padding: 0 1em
    }
}

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


    

    .footertext .col, .footertext ul {
        padding: 0
    }
}

@media only screen and (max-width:1024px) {
    .logo.span_1_3 {
        width: 30%
    }

    .nav {
        margin: 0;
        padding: 1em 0;
        text-align: right
    }

    .logo.span_1_3 {
        width: 30%
    }

    .nav.span_2_3 {
        width: 65%
    }

    .span_1_3.new, .span_2_3.new {
        width: 44%;
        box-sizing: border-box
    }
}

@media only screen and (max-width:850px) {
    .nav ul {
        padding: 0
    }

    .footerext, .footertext p {
        text-align: center
    }

    .footertext .span_1_3 {
        width: 100%
    }

    .homearticle {
        border-bottom: 8px solid #fff
    }
    
     a.fish {   
   float: left!important
}

}

@media only screen and (max-width:812px) {
    .logo.span_1_3 {
        width: 100%;
        text-align: center !important
    }

    .nav.span_2_3 {
        width: 100%;
        text-align: center
    }

    .nav ul {
        padding: 0
    }

    .footerext, .footertext p {
        text-align: center
    }

    .footertext .span_1_3 {
        width: 100%
    }

    .row p {
        padding: 0 1%
    }

    .homearticle p {
        padding: 0 12px
    }
    
  
    .span_1_3.new, .span_2_3.new, .span_1_3.new.homearticle {
        width: 96%;
        box-sizing: border-box
    }
    
    
        .span_1_3.new.homearticle {
            margin-left: 0 !important
        }

}




@media only screen and (max-width:576px) {
    .section.new {
        margin: 0 0 0 0
    }

    .span_1.new {
        width: 100%;
        text-align: center
    }

    .span_1_2.new {
        width: 100%;
        padding: 0;
        box-sizing: border-box
    }



    .new ul {
        margin: 0
    }

    div.form {
        width: 100%
    }
    
    
 .section.new .col.testimonial {
    
    margin: 0 0 2em 0.5em !important;
    
        
}
   
    
    
    
    
}

.burger i {
    color: #005057;
    display: inline-block;
    font-size: 1.5em;
    margin: 1em .5em 8px 0
}

    .burger i:hover {
        color: #ED0D6C
    }

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 250;
    top: 0;
    right: 0;
    background-color: #005057;
    overflow-x: hidden;
    padding: 20px 0 0 0;
    transition: .5s;
    text-align: center
}

    .sidenav a {
        padding: 10px 4px 0 0;
        text-decoration: none;
        font-size: 1.2em;
        color: #fff;
        display: block;
        transition: .3s
    }

        .sidenav a:hover {
            color: #D5DA76
        }

    .sidenav .closebtn {
        position: absolute;
        top: 0;
        right: 0;
        font-size: 1em
    }

a.close {
    font-size: 2em;
    text-align: right;
    padding-right: 30px
}

#mySidenav ul {
    margin: 1em 0 2em 0;
    padding: 0
}

    #mySidenav ul li {
        list-style: none;
        padding-bottom: 5px
    }

        #mySidenav ul li ul {
            padding: 8px 0 0 25px;
            margin-bottom: .5em
        }

li a.sub {
    list-style: none;
    font-size: 1em
}

#mySidenav ul li.loginside {
    padding-top: 2em
}

#mySidenav i {
    margin-right: 20px
}

@media only screen and (max-width:414px) {
    .sidenav {
        padding-top: 15px
    }

        .sidenav a {
            font-size: 1.1em
        }

    #mySidenav ul li {
        padding-bottom: 2px
    }

    li a.sub {
        font-size: .9em
    }

    .close, .closebtn {
        font-size: 2em !important
    }

    .burger {
        font-size: 2em;
        margin: 0
    }

        .burger i {
            margin: 8px 0
        }
}



.row img {
    max-width: 400px;
    float: left;
    margin: 1em 1em 1em 0
}

.homearticle img {
    max-width: 100%;
    margin: 0 0 2em 0
}

.articles .col.span_3_4 {
    width: 70%
}

.articles:nth-child(even) {
    background-color: #e5e5e5
}

.articles:nth-child(odd) {
    background-color: #fff
}

p.date {
    font-size: 1em;
    font-weight: 700;
    margin-top: 6px
}

p.more a {
    color: #ED0D6C;
    font-weight: normal
}

    p.more a:hover {
        color: #333
    }

.articles p {
    margin: 0 0 .75em 0
}

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

    .row img {
        max-width: 98%;
        float: 0;
        margin: 1.5em 0;
        text-align: center
    }
}



@media only screen and (max-width:576px) {
    .articles .col.span_1_4 {
        width: 30%
    }

    .articles .col.span_3_4 {
        width: 65%
    }
}

@media only screen and (max-width:480px) {
    .articles img {
        margin-bottom: 1em
    }

    .articles .col.span_1_4 {
        width: 60%
    }

    .articles .col.span_3_4 {
        width: 100%
    }
}

p.larger {
    font-size: 2em;
    margin: 0
}

p.center {
    text-align: center
}

h2.contact {
    font-size: 2em;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    text-transform: none;
    padding: .25em 0
}

    h2.contact a {
        color: #6cb1db
    }

        h2.contact a:hover {
            color: #fff
        }

@media only screen and (max-width:950px) {
    .col {
        margin: 0 1% 0 1% !important
    }
}

span.step {
    color: #31538a;
    font-size: 1.3em;
    font-style: italic;
    line-height: 1.5em
}

p.step {
    color: #31538a;
    font-size: 1.3em;
    font-style: normal;
    line-height: 1.3em
}

.section.testimonial {
    width: 80%;
    margin: 1em auto
}

@media only screen and (max-width:1366px) {
    .section.testimonial {
        width: 100%;
        margin: 1em auto
    }
}

.flex {
    display: flex;
    margin: 0 auto;
    padding: 0
}

.col.flex.tests {
    flex-wrap: wrap;
    display: flex;
    padding: 2em 0;
    margin: 1em auto
}

@media only screen and (max-width:576px) {
    .col.flex.tests, .flex {
        display: block
    }
}


/*---- cookie table----*/

table.cookiedetail {
    width: 100%;
    border: 1px solid #ccc;
    border-collapse: collapse;
    margin: 1em 0 1em 8px
}

tr:nth-of-type(odd) {
    background: #eee;
}

table.cookiedetail td, table.cookiedetail th {
    padding: 10px 15px;
    text-align: left;
    border-bottom: 1px solid #ccc
}

table.cookiedetail th {
    font-weight: bold;
    background-color: #fff
}


/* 
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {

    /* Force table to not be like tables anymore */
    table, thead, tbody, th, td, tr {
        display: block;
    }

        /* Hide table headers (but not display: none;, for accessibility) */
        thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }

    tr {
        border: 1px solid #ccc;
    }

    td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
    }

        td:before {
            /* Now like a table header */
            position: absolute;
            /* Top/left values mimic padding */
            top: 6px;
            left: 6px;
            width: 45%;
            padding-right: 10px;
            white-space: nowrap;
        }
}

#cookiesOverlay .cookiesConsentSlider {
    padding: 0 5px 2px 5px !important;
}




.holding {padding: 5em 0;
margin: 1em auto!important;
font-size: 1.2em;
text-align: center;
}

.holding a {font-weight: normal}