﻿/*==========================================================*/
/*================= INSTANCE-LEVEL STYLES ==================*/
/*==========================================================*/

/* 
    This stylesheet is for rules that only apply to a specific implementation (instance) of a Block/Component, 
    or to a certain piece of content that needs unique presentation.
    Any rules that supplement or override standard Framework and Corporate block styles, 
    using CMS-entered CSS classes, should be added to this stylesheet.
*/

.mobile-only {
    display: none !important;
}

/*--- TEMP site logo, this will probably end up part of the updated Site Navigation. TODO ---*/
.header-logo {
    text-align: center;
    padding: 28px 0 20px;
}

/*--- TEMP solution for subnavigation just so we can use the site more easily during development. 
    A new custom nav will have to be developed to achieve
    the strange behavior on the current live site. TODO ---*/
.site-navigation {
    position: relative;
}

    .site-navigation .dropdown-menu {
        top: -9px;
        left: 10px;
        background: #5ac9e4;
    }

.corporateherobannerblock {
    margin-bottom: 50px;
}


/*--- home page 'our products' section, uses standard Framework blocks. CSS class is applied in CMS. ---*/
.home-products-callouts {
    max-width: 1077px;
    margin: 0 auto 60px;
}

    .home-products-callouts h2 {
        color: #541763;
        font-weight: bold;
        font-size: 30px;
    }

    .home-products-callouts h3 {
        margin-left: auto;
        margin-right: auto;
        font-weight: bold;
        font-size: 14px;
        text-align: center;
        max-width: 210px;
    }

    .home-products-callouts p {
        font-size: 16px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

        .home-products-callouts p.intro {
            text-align: left;
        }

        .home-products-callouts p a {
            color: #000;
        }

            .home-products-callouts p a:hover {
                text-decoration: none;
            }

    .home-products-callouts .btn-wrapper {
        background: #541763;
        display: inline-block;
        padding: 14px 25px 14px 20px;
        margin-left: 12px;
    }

        .home-products-callouts .btn-wrapper p {
            margin-bottom: 0;
        }

        .home-products-callouts .btn-wrapper a {
            color: #fff;
        }

            .home-products-callouts .btn-wrapper a:after {
                content: "\e258";
                position: relative;
                top: 3px;
                left: 3px;
                display: inline-block;
                font-family: 'Glyphicons Halflings';
                font-style: normal;
                font-weight: normal;
                line-height: 1;
                -webkit-font-smoothing: antialiased;
            }

/*--- home 'about ascensia' cards row (instance-level tweaks to default rules) ---*/
.home-about-ascensia-cards-row {
    /*their home page seems to observe a different max-width than the rest of the site*/
    max-width: 1077px;
}

    .home-about-ascensia-cards-row .hasBkdImg .content {
        /*this is the native image height*/
        min-height: 627px;
        /*and due to the framing of the image...*/
        background-position: right;
    }

/*-- global site footer TODO: componentize aka convert to new block ---*/
.global-site-footer .main {
    background: #541763;
}

    .global-site-footer .main .main-row {
        max-width: 1044px;
        margin: 0 auto;
        min-height: 370px;
        padding: 0 10px;
    }

        .global-site-footer .main .main-row .left {
            width: 25%;
            float: left;
        }

        .global-site-footer .main .main-row .center {
            width: 41.66666%;
            float: left;
        }

        .global-site-footer .main .main-row .right {
            width: 33.33333%;
            float: left;
        }

        .global-site-footer .main .main-row h4 {
            color: #5ac9e4;
            border-bottom: 1px solid #5ac9e4;
            padding: 8px 0 10px 0;
            font-size: 18px;
        }

        .global-site-footer .main .main-row .left .footer-nav {
            list-style: none;
            padding-left: 0;
        }

            .global-site-footer .main .main-row .left .footer-nav li {
                padding-bottom: 5px;
            }

                .global-site-footer .main .main-row .left .footer-nav li a {
                    color: #fff;
                    font-size: 15px;
                }

                    .global-site-footer .main .main-row .left .footer-nav li a:hover {
                        text-decoration: none;
                    }


        .global-site-footer .main .main-row .right {
        }

            .global-site-footer .main .main-row .right p {
                color: #fff;
                font-size: 16px;
                line-height: 1.5625;
                padding-right: 50px;
                padding-left: 10px;
                padding-bottom: 10px;
                box-sizing: border-box;
            }

            .global-site-footer .main .main-row .right a {
                color: #fff;
                font-size: 16px;
                line-height: 1.5625;
            }

.global-site-footer .legal-row {
    max-width: 1190px;
    margin: 0 auto;
    position: relative;
    padding: 10px;

}

    .global-site-footer .legal-row .left {
        padding-right: 180px;
        box-sizing: border-box;
        padding-top: 24px;
        padding-bottom: 24px;
    }

        .global-site-footer .legal-row .left p {
            font-size: 16px;
            color: #000;
            padding-bottom: 3px;
        }

    .global-site-footer .legal-row .social-links {
        position: absolute;
        right: 10px;
        top: 50px;
        list-style: none;
        padding-left: 0;
    }

        .global-site-footer .legal-row .social-links li {
            display: inline-block;
            margin-left: 20px;
        }

.footer-nav {
    list-style-type: none;
    padding-left: 0px;
}

    .footer-nav li a {
        color: #fff;
        line-height: 24px;
    }

.tweetbox {
    padding-top: 8px;
}
.tweetbox iframe{
    background-color: white;
}

/* --- 'about us: our approach' page cards row ---*/
.our-approach-cards-row {
    margin: 60px auto 50px;
}

#ourApproachCardsRow2 {
    margin: -45px auto 40px;
}


    .our-approach-cards-row .hasBkdImg .content {
        /*this is the native image height*/
        min-height: 462px;
        /*and due to the framing of the image...*/
        background-position: top right;
    }

/* Product page intro text & tabs */
.product-intro h2 {
    color: #541763;
    font-size: 28px;
    text-transform: uppercase;
    font-weight: bold;
    margin-top: 40px;
    margin-bottom: 4px;
}

.product-intro p {
    font-size: 16px;
    line-height: 1.375;
    margin: 0 0 10px;
}

/* Alliances page cards row */
.alliances-cards-row {
    /*max-width: 1024px; removed for bug*/
}

    .alliances-cards-row .content h2 {
        margin-bottom: 10px;
    }

/* Work For Us page cards row */
.work-for-us-cards-row {
    max-width: 1140px;
}

    .work-for-us-cards-row .linkIsButton .content {
        padding-bottom: 80px;
    }

    .work-for-us-cards-row .linkIsButton .bottom-link a {
        bottom: 25px;
    }

#find-jobs {
    padding-left: 0px;
}

    #find-jobs > li {
        width: 30%;
        color: #fff;
    }

    #find-jobs li a, #find-jobs li ul li ul li a, #find-jobs li ul li ul li a p {
        color: #fff;
        margin-bottom:3px;
    }

        #find-jobs li a:hover, #find-jobs li a:active, #find-jobs li a:focus {
            text-decoration: none;
        }

    #find-jobs li ul, #find-jobs li ul li ul {
        margin-top: 0px;
    }

        #find-jobs li ul li ul li {
            padding: 0px 0;
        }

.find-link {
    background-color: #5ac9e4;
    color: #fff;
    padding: 12px 24px;
    border-bottom-right-radius: 26px;
    margin-top: 5px;
    display: inline-block;
    text-decoration: none;
}

#find-jobs .glyphicon-menu-right:before {
    color: #fff;
}

.brdr-btm p {
    color: #fff;
}

#find-jobs ul {
    margin: 0;
    padding: 0;
    width: 106%;
    color: #fff;
    margin-top: 5px;
    text-decoration: none;
}

#find-jobs .brdr-btm {
    border-bottom: 1px solid #fff;
    border-top: 1px solid #fff;
}

    #find-jobs .brdr-btm .bold-it {
        font-weight: bold;
        font-style: italic;
    }

#find-jobs .col {
    width: 48%;
    display: inline-block;
}

#find-jobs ul li {
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: #fff;
}


/*** Search Toolbar ****/

.container-custom.search {
    overflow: initial;
}

div.press-toolbar {
    background-color: #541763;
    width: 100%;
}

.press-contact-details {
    margin-left: 40px;
}

    .press-contact-details h3 {
        font-size: 26px;
    }

    .press-contact-details span {
    }

.press-release-toolbar h3 {
    margin-left: 40px;
}

.press-toolbar {
    height: 80px;
    color: #fff;
}

.press-results {
    width: 25%;
    padding-left: 40px;
    line-height: 75px;
    height: inherit;
    margin-left: 0px;
}

.fr .press-results {
    padding-top: 20px;
    line-height: 20px;
}

.press-searchbar, .press-dropdown {
    line-height: 75px;
    height: inherit;
    margin-left: 0px;
}

.press-searchbar {
    line-height: 18px;
    padding-left: 60px;
}

    .press-searchbar input {
        height: 28px;
        background-color: #541763;
        color: #fff;
        outline: 0;
        margin-top: 27px;
        border-top: none;
        border-right: none;
        border-left: none;
        width: 370px;
        text-align: center;
    }
.press-item {
    margin:20px;
    padding-bottom:20px;
    border-bottom:1px solid #541763;

}

.press-item-container .press-item:last-child {
    border-bottom: 0;
}

.press-item-title h1, .press-item-title h2, .press-item-title h3 {
font-size:18px;
margin:0px;
}
.press-item-location p {
    margin-bottom:0px;
}

.press-sortbar {
    padding-left: 50px;
}

.carousel-indicators {
    left: 50%;
    z-index: 15;
    width: 100%;
    padding-left: 0;
    margin-left: -50%;
    text-align: center;
    list-style: none;
    position: absolute;
}

.testimonial-img img {
    /*padding: 40px;*/
}

::-webkit-input-placeholder {
    color: #fff;
}

:-moz-placeholder { /* Firefox 18- */
    color: #fff;
}

::-moz-placeholder { /* Firefox 19+ */
    color: #fff;
}

:-ms-input-placeholder {
    color: #fff;
}

.press-item-date {
}
#prcountresult, #prcount, #prcountresult {
    padding-left:2px;
}

#prcountresult, #prcount, #prcountresult, .dropdown-toggle, .dropdown-toggle .caret {
    color:#fff;
}

    .dropdown-toggle:hover, .dropdown-toggle:active, .dropdown-toggle:visited, .dropdown-toggle:focus {
        text-decoration:none;
        color:#fff;
        outline:0;
    }


.container-custom.gray-bg-row {
    max-width: 100%;
    background-color: #e6e7e8;
}

    .container-custom.gray-bg-row .row {
        max-width: 1170px;
        margin: 0 auto;
    }

/*Work For Us Carousel styles*/
/* colors
gray: #b3b6b5
light blue: #5ac8e3
purple: #541763
dark blue: #122635 */
#TesimonialCarousel {
    height: 617px;
}

    #TesimonialCarousel .color {
        height: 555px;
    }

    #TesimonialCarousel .bkgd-gray {
        background-color: #b3b6b5;
    }

    #TesimonialCarousel .bkgd-lblue {
        background-color: #5ac8e3;
    }

    #TesimonialCarousel .bkgd-dblue {
        background-color: #122635;
    }

    #TesimonialCarousel .bkgd-purp {
        background-color: #541763;
    }

    #TesimonialCarousel .pos-left {
        position: absolute;
        left: 35px;
        bottom: 35px;
    }

    #TesimonialCarousel .pos-topleft {
        position: absolute;
        left: 35px;
        top: 35px;
    }

    #TesimonialCarousel .pos-btmleft {
        position: absolute;
        left: 35px;
        top: 35px;
    }


    #TesimonialCarousel .pos-right {
        position: absolute;
        right: 35px;
        top: 35px;
    }

    #TesimonialCarousel .pos-btmright {
        position: absolute;
        right: 35px;
        bottom: 35px;
    }

    #TesimonialCarousel .employee {
        width: 45%;
        padding: 10px 20px 20px;
    }

        #TesimonialCarousel .employee h4 {
            text-transform: uppercase;
            font-weight: bold;
            font-size: 30px;
            color: #fff;
        }

        #TesimonialCarousel .employee p {
            color: #fff;
        }

        #TesimonialCarousel .employee p {
            font-weight: bold;
            font-size: 18px;
        }

    #TesimonialCarousel .img-contain {
        width: 40%;
        display: inline-block;
    }

        #TesimonialCarousel .img-contain img {
            width: 100%;
        }

    #TesimonialCarousel .img-contain {
        width: 35%;
    }

    #TesimonialCarousel .findoutmore {
        border-radius: 0 0 20px 0;
        width: 41%;
        padding: 8px 12px;
        font-weight: bold;
        margin-top: 20px;
    }

.bkgd-purp span, .bkgd-gray span, .bkgd-dblue span, .bkgd-lblue span {
    color: #fff;
}

    .bkgd-purp span:after, .bkgd-gray span:after, .bkgd-dblue span:after, .bkgd-lblue span:after {
        content: '\25b6';
        color: #fff;
        position: relative;
        top: 3px;
        left: 12px;
    }

.employee p .employee h4 {
    color: #fff;
}

/************ WDD Full Image Carousel    *****************/
#WDDCarousel {
    height: 617px;
}

    #WDDCarousel .color {
        height: 555px;
    }

    #WDDCarousel .pos-left {
        position: absolute;
        left: 35px;
        bottom: 35px;
    }

    #WDDCarousel .pos-topleft {
        position: absolute;
        left: 35px;
        top: 35px;
    }

    #WDDCarousel .employee {
        display:none;
    }

    #WDDCarousel .img-contain {
        width: 100%;
        display: inline-block;
    }

        #WDDCarousel .img-contain img {
            width: 100%;
        }


/************ END WDD Full Image Carousel   *****************/



/*Testimonials page*/

.testimonial-txt {
    min-height: 580px;
    margin-top: 0;
    padding: 10px 20px;
    background-color: #541763;
}

    .testimonial-txt h3 {
        margin: 15px 0;
        color: #5ac8e3;
    }

    .testimonial-txt p {
        color: #fff;
    }

.testimonial-img {
    background-color: #b3b6b5;
    position: relative;  
    min-height: 580px;
    margin-bottom: 20px;
}

    .testimonial-img img {
        display: block;
        margin: 0 auto;
        min-height: 580px;
        width: auto !important;
    }



.custom-tab.nav > li > a {
    padding: 29px 70px;
    font-weight: bold;
}

.custom-tab.nav-tabs > li > a {
    margin-right: 0;
}

.custom-tab.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
    color: #fff;
}

.tab-wrapper .tab-top {
    background: #541763;
    min-height: 65px;
}

    .tab-wrapper .tab-top .nav-tabs > li {
        margin-bottom: 0;
    }

.tab-top .nav-tabs, .tab-top .nav-tabs li a {
    border: none;
    text-transform: uppercase;
    color: #FFFFFF;
    margin: 0px !important;
}

    .tab-top .nav-tabs li.active a, .tab-top .nav-tabs li a:hover {
        border: none;
        background: #5ac9e4;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
    }

.gallery-heading {
    text-transform: uppercase;
    color: #333333;
    font-weight: bold;
    padding: 20px 0;
}

.content-carousel .carousel-caption {
    bottom: auto;
    left: 10px;
    right: auto;
    width: 400px;
    text-align: left;
}

.carousel-indicators li, .carousel-indicators .active, .carousel-indicators li:hover {
    text-indent: inherit;
    width: 50px;
    height: 50px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    -o-border-radius: 100%;
    border-radius: 100%;
}

.corporateherobannerblock + .corporatesubnavblock {
    margin-top: -50px;
}


/***** Corporate COntact form styles *******/

.form-body {
    max-width: 1096px;
    margin: 0 auto;
    margin-bottom: 20px;
}

    .form-body input, .form-body select {
        width: 100%;
        height: 30px;
    }

    .form-body button {
        width: 130px;
        background-color: #541763;
        color: #FFFFFF;
        font-weight: bold;
        border: none;
        border-radius: 5px;
        height: 30px;
        margin: 0 auto;
        float:right;
        text-transform:uppercase;
    }

    .form-body textarea {
        width: 100%;
        height: 125px;
    }

    label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: bold;
    font-family: "Trebuchet MS", Arial, sans-serif;
    font-size: 16px;
    color: #132736;
    line-height: 22px;
}

.corporatecontactformblock {
    margin-left: 20px;
    margin-right: 20px;
}

.control-group.row {
    margin-bottom:20px;
}

.field-validation-error {
        color: red;
    font-weight: bold;
    font-size:16px;
}

.form-header {
    margin-bottom:40px;
}

input, button, select, textarea {
    font-family: "Trebuchet MS", Arial, sans-serif;
    font-size: 16px;
    line-height: 22px;
}

@media (max-width: 375px) {

    /*Fix for mobile carousel on testimonial page.*/
    #TesimonialCarousel .color {
        /*height: 895px;*/
    }

    #TesimonialCarousel .employee {
        width: 100%;
    padding: 10px 20px 20px;
    top: 440px;
    }
    #TesimonialCarousel {
    height: 900px;
}
        #TesimonialCarousel .pos-btmleft {
        left:0px;
        }
#TesimonialCarousel .img-contain {
    width: 100%;
}

#TesimonialCarousel .bkgd-gray {
    width: 92%;
    left: 4%;  
    }
    .item.bkgd-dblue.active {
         width: 92%;
    left: 4%;
        }
    #EtienneBeaulieu .bkgd-gray {
    width: 100%;
    left: 0px;
    }
    #TesimonialCarousel .pos-right {
        position: absolute;
        right: 0px;
        /*top: auto;*/
    }
    .item.bkgd-dblue.color.active > #TesimonialCarousel .pos-right {
    top: auto;
    }
    .item.bkgd-purp.color.active {
    width: 92%;
    left: 4%;
    }

    .item.bkgd-lblue.color.active {
    width: 92%;
    left: 4%;  
    }
        #TesimonialCarousel .pos-left {
    position: absolute;
    top: 0px;
     left: 0px;
     right:0px;
    }
        #TesimonialCarousel .pos-btmright {
            top:0px;
           left: 0px;
     right:0px;
        }
    #TesimonialCarousel .pos-btmleft {
    top:0px;
    }
    .carousel-inner {
        /*height: 900px;*/
    }
    .img-contain.pos-btmright{
    top: 0px;
    }
    #TesimonialCarousel > div > div.item.bkgd-purp.color.active > a > div > div.employee.bkgd-lblue.pos-left {
    top: 390px;
    }
    #EtienneBeaulieu > a > div > div.employee.bkgd-gray.pos-btmleft {
    top: 390px;
    }
    #DagmarSalamun > a > div > div.employee.bkgd-lblue.pos-btmleft {
    top: 390px;
    }
    #TesimonialCarousel > div > div.item.bkgd-lblue.color.active > a > div > div.employee.bkgd-purp.pos-btmright {
    top: 390px;
    }
    #DagmarSalamun > a > div > div.img-contain.pos-right {
    top: 0px;
    }

    #EtienneBeaulieu > a > div > div.img-contain.pos-right {
    top: 0px;
    }
    #TesimonialCarousel .findoutmore {
        width: 75%;
    }
    .standard-carousel .carousel-control .glyphicon img {
    margin-top: -510px;
}
}


@media (max-width: 375px){

#TesimonialCarousel > div > div.item.bkgd-purp.color.active > a > div > div.employee.bkgd-lblue.pos-left {
    top: 0px;
}
#DagmarSalamun > a > div > div.employee.bkgd-lblue.pos-btmleft {
    top: 0px;
}
#EtienneBeaulieu > a > div > div.employee.bkgd-gray.pos-btmleft {
    top: 0px;
}
#TesimonialCarousel > div > div.item.bkgd-lblue.color.active > a > div > div.employee.bkgd-purp.pos-btmright {
    top: 0px;
}

}
/*loader*/
#divLoader {
    margin: 0px;
    display: none;
    padding: 0px;
    position: fixed;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgb(255, 255, 255);
    z-index: 30001;
    opacity: 0.8;
}

#divLoader img {
    width: 4%;
    position: relative;
    left: 50%;
    top: 35%
}

/*end of loader*/

/*Campaign card grid*/
.campaign-card {
    border: 1px solid #868686;
    margin: 0px;
    margin-bottom: 20px;
}

.campaign-card img {
    width: 100%;
}

.campaign-card div {
    background-color: #5C0967;
    height: 100px;
    padding: 18px;
}

.campaign-card div p {
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.38;
    letter-spacing: normal;
}

.campaign-card .blue-btn-container .campaign-card-btn {
    border-radius: 5px;
    padding: 10px 30px 10px 30px;
    border: 0;
    color: #fff;
    background-color: #5bc9e4;
    font-size: 18px;
    margin: 10px 0 10px 0;
    display: inline-block;
}

.campaign-card .blue-btn-container .campaign-card-withoutlink {
    border-radius: 5px;
    padding: 10px 30px 10px 30px;
    border: 0;
    color: #fff;
    background-color: #5c0967;
    font-size: 18px;
    margin: 10px 0 10px 0;
    display: inline-block;
    -webkit-box-shadow: 0 0 14px -2px rgba(0,0,0,.28);
}

.campaign-card .blue-btn-container .campaign-card-btn:hover {
   -webkit-box-shadow: 0 0 14px -2px rgba(0,0,0,.28);
   box-shadow: 0 0 14px -2px rgba(243,227,247,.78);
}


.campaign-card .blue-btn-container .campaign-card-withoutlink:hover {
   box-shadow: 0 0 14px -2px rgba(243,227,247,.78);
}

/*end of campaign card grid*/