@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {

    div.hmw-resources-mobile {
        display: none;
    }

}

@media screen {
    /*colours used for HMW portal*/

    .light-green-bg-prtl {
        background-color: #deefbb;
    }

    .dark-green-prtl {
        color: #9acd32;
    }

    .dark-green-prtl-1 {
        color: #468264;
    }

    .dark-blue-bg-prtl {
        background-color: #325b8f;
    }

    .light-blue-bg-prtl {
        background-color: #c7d9e8;
    }

    /* general formating styles starts*/

    .round-tl-tr-10 {
        border-top-left-radius: 10px;
        /*rounded corners for left and top*/

        border-top-right-radius: 10px;
    }

    .round-all-10 {
        border-top-left-radius: 10px;
        /*rounded corners for all sides*/

        border-top-right-radius: 10px;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }

    .uppercase-text {
        text-transform: uppercase;
    }

    /* general formating styles ends*/

    .hmw-tabs [role="tablist"] li.active,
    .hmw-tabs [role="tablist"] li:hover {
        background: #3F699F;
    }

    .ahw-tabs [role="tablist"] li.active,
    .ahw-tabs [role="tablist"] li:hover {
        background: #6B9200;
    }

    .overflowHidden {
        overflow: hidden;
    }

    .returnLink {
        float: right;
        display: inline-block;
    }

    /* Maintain equal white-space between the top and bottom "Return to X listing" links and the content container */

    .returnLinkTop {
        margin-top: 2.5%;
    }

    /* h2.bar-title-size {
        width: 95%;
        display: inline-block;
        vertical-align: top;
        padding-top: 0.3%;
        margin-left: -0.5%;
    } */
    /* styles added as part of redesign July 2015*/
    /*nav bar starts*/

    .navbar-hmw {
        height: 91px;
        padding: 0;
        margin: 0;
        background-color: #4682b4;
    }

    .navbar-hmw .items {
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 20px;
        padding-right: 20px;
        text-align: center;
        /*	border:white 1px solid;*/

        margin-bottom: 40px;
    }

    .navbar-hmw .items-fr {
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 15px;
        padding-right: 15px;
        text-align: center;
        /*	border:white 1px solid;*/

        margin-bottom: 40px;
    }

    .navbar-hmw li.item-small-padding {
        padding: 0px 7px;
    }


    .items a,
    .items a:link,
    .items a:visited,
    .items-fr a,
    .items-fr a:link,
    .items-fr a:visited {
        text-decoration: none;
    }

    .items a:hover,
    .items-fr a:hover {
        text-decoration: underline;
    }

    /*nav bar ends*/


    /* HealthyMinds navbar STARTS  */
    .bg-healthy-minds {
        background-color: #4682b4;
    }

    .nav-healthy-minds,
    .nav-healthy-minds-fr {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }

    .nav-healthy-minds::after,
    .nav-healthy-minds::before,
    .nav-healthy-minds-fr::after,
    .nav-healthy-minds-fr::before {
        content: " ";
        display: table;
    }

    .nav-healthy-minds::after,
    .nav-healthy-minds-fr::after {
        clear: both;
    }

    .nav-healthy-minds>li,
    .nav-healthy-minds-fr>li {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        margin: 0;
        padding: 0;
    }

    .nav-healthy-minds>li:not(.logo-healthy-minds-item)>a {
        color: #fff;
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        padding: 6px 12px;
        font-size: 15px;
        text-decoration: none;
        justify-content: flex-end;
        -webkit-justify-content: flex-end;
    }

    .nav-healthy-minds-fr>li:not(.logo-healthy-minds-item)>a {
        color: #fff;
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        padding: 6px 10px;
        font-size: 15px;
        text-decoration: none;
        justify-content: flex-end;
        -webkit-justify-content: flex-end;
    }

    .logo-healthy-minds-item,
    .nav-healthy-minds-fr .logo-healthy-minds-item {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        padding: 0;
        margin: 0;
    }

    .logo-healthy-minds-item img {
        padding: 0 10px 0 0;
    }

    .nav-healthy-minds>li>a:focus,
    .nav-healthy-minds-fr>li>a:focus {
        color: #fff;
        background-color: transparent;
        text-decoration: underline;
    }

    .nav-healthy-minds>li>a:hover,
    .nav-healthy-minds-fr>li>a:hover {
        background-color: transparent;
        text-decoration: underline;
    }

    .nav-healthy-minds>li>a:visited,
    .nav-healthy-minds-fr>li>a:visited {
        background-color: transparent;
        text-decoration: underline;
    }

    /*flexbox STARTS*/
    .flex-container-nav-healthy-minds {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        flex-wrap: wrap;
        padding: 0;
        margin: 1em 0 0.6em 0;
    }

    .nav-healthy-minds-flex-item {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        align-self: center;
        text-transform: uppercase;
        padding: 0;
        margin: 0;
    }

    /*flexbox ENDS*/
    /* Smallest screens */
    @media screen and (max-width: 519px) {
        .flex-container-nav-healthy-minds {
            -moz-justify-content: center;
            /* OLD - Firefox 19- (buggy but mostly works) */
            -ms-justify-content: center;
            /* TWEENER - IE 10 */
            justify-content: center;
            -webkit-justify-content: center;
            padding: 0;
        }

        .nav-healthy-minds>li:not(.logo-healthy-minds-item)>a,
        .nav-healthy-minds-fr>li:not(.logo-healthy-minds-item)>a {
            padding: 15px 5px;
        }

        .flex-container-nav-healthy-minds img {
            display: block;
        }
    }

    @media screen and (max-width: 1199px) {
        .nav-healthy-minds-flex-item {
            font-size: 80%;
        }

        .logo-healthy-minds-item img {
            padding: 0;
        }

        .nav-healthy-minds>li:not(.logo-healthy-minds-item)>a,
        .nav-healthy-minds-fr>li:not(.logo-healthy-minds-item)>a {
            -moz-justify-content: center;
            /* OLD - Firefox 19- (buggy but mostly works) */
            -ms-justify-content: center;
            /* TWEENER - IE 10 */
            justify-content: center;
            -webkit-justify-content: center;
        }


        .nav-healthy-minds>li:not(.logo-healthy-minds-item),
        .nav-healthy-minds-fr>li:not(.logo-healthy-minds-item) {
            justify-content: center;
            -webkit-justify-content: center;
            -moz-justify-content: center;
            /* OLD - Firefox 19- (buggy but mostly works) */
            -ms-justify-content: center;
            /* TWEENER - IE 10 */
            margin-right: auto;
            margin-left: auto;
        }
    }

    /* Small screens */
    @media screen and (min-width: 520px) and (max-width: 1199px) {

        .nav-healthy-minds>li:not(.logo-healthy-minds-item)>a,
        .nav-healthy-minds-fr>li:not(.logo-healthy-minds-item)>a {
            padding: 15px;
        }

        .nav-healthy-minds-fr>li:not(.logo-healthy-minds-item)>a {
            padding: 15px 10px;
        }

    }

    @media screen and (min-width: 520px) and (max-width: 1199px) {
        .flex-container-nav-healthy-minds {
            -moz-justify-content: space-around;
            /* OLD - Firefox 19- (buggy but mostly works) */
            -ms-justify-content: space-around;
            /* TWEENER - IE 10 */
            justify-content: space-around;
            -webkit-justify-content: space-around;
            padding: 0;
        }

        .nav-healthy-minds-flex-item {
            -moz-justify-content: flex-end;
            /* OLD - Firefox 19- (buggy but mostly works) */
            -ms-justify-content: flex-end;
            /* TWEENER - IE 10 */
            justify-content: flex-end;
            -webkit-justify-content: flex-end;
            padding-left: 0;
            padding-right: 0;
        }

        .logo-healthy-minds-item img {
            width: 1199px;
            height: auto;
        }
    }

    /* HealthyMinds navbar ENDS  */

    div.sidebarcol {
        width: 24%;
        display: inline-block;
        vertical-align: top;
    }

    div.resourcecol {
        width: 73%;
        display: inline-block;
        vertical-align: top;
    }

    div.sidebarcol ul {
        padding-left: 0;
        width: 95%;
    }

    div.sidebarcol ul li {
        list-style-type: none;
        background: #EEEEEE;
        padding-left: 30px;
        padding-top: 6%;
        border-bottom: 3px solid white;
        cursor: pointer;
    }

    div.sidebarcol ul li:hover {
        background: #D5EAAA;
    }

    div.sidebarcol ul li.navheader,
    div.sidebarcol ul li.selected {
        background: #9BCE32;
        color: white;
        cursor: default;
        position: relative;
    }

    div.sidebarcol ul li.navitem button:focus,
    div.sidebarcol ul li.viewall button:focus {
        border: 1px #CCC dotted;
    }

    div.sidebarcol ul li.navitem button,
    div.sidebarcol ul li.viewall button {
        background: none;
        border: 0;
        padding: 0;
        width: 100%;
        text-align: left;
    }

    div.sidebarcol ul li.viewall,
    div.sidebarcol ul li.viewall button {
        text-align: center;
        padding-left: 0px;
    }

    div.sidebarcol ul li.viewall {
        background: #325B8F;
        color: white;
    }

    div.sidebarcol ul li.navheader {
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }

    div.whats-new {
        background: #E5F4C7;
        overflow: hidden;
        margin-left: 1.3%;
        width: 56%;
    }

    div.whats-new ul {
        height: 230px;
        overflow-y: scroll;
    }

    div.whats-new ul li span.italic a {
        font-weight: normal;
    }

    div.whats-new ul li a {
        font-weight: bold;
    }

    div.whats-new ul li {
        padding-bottom: 2%;
    }

    div.whats-new h1 {
        background: #9BCE32;
        color: white;
        font-size: 200%;
        padding: 1% 3%;
    }

    .section-titles-home {
        font-size: 250%;
    }

    .section-titles-home .spaced-out-word {
        font-weight: lighter;
        letter-spacing: 2px;
    }

    .topics-boxes {
        margin-left: 4%;
    }

    .topics-boxes a {
        text-decoration: none;
    }

    .topics-box {
        margin-right: 30px;
        background-color: white;
        width: 28%;
        height: 408px;
        position: relative;
    }

    .arrow {
        background-image: url("https://images.ccohs.ca/portals/healthy_minds_work/arrow.png");
        background-repeat: no-repeat;
        background-size: cover;
        width: 47px;
        height: 47px;
        left: 45%;
        top: 85%;
        position: absolute;
    }

    /*Tools white boxes fix height STARTS*/

    .tools-box {
        min-height: 420px;
    }

    /*Tools white boxes fix height ENDS*/
    /* HMW secondary pages */
    /* HMW secondary pages - listing */

    ul.hmw-listing li {
        margin-bottom: 10px;
        padding: 10px;
    }

    .hmw-listing li:nth-child(odd) {
        background-color: #eee;
    }

    .hmw-listing li:nth-child(even) {
        background-color: #fff;
    }

    .a-z-topics ul li {
        padding: 5px;
    }

    /* Advancing Healthy Workplaces Portal START */

    .light-green-bg {
        background: #6B9200;
    }

    .light-green-bg .wb-navtabs [role="tablist"] li a {
        background: white;
        color: black;
    }

    .light-green-bg .wb-navtabs [role="tablist"] li a:hover,
    .light-green-bg .wb-navtabs [role="tablist"] li.active a {
        background: #B4D308;
    }

    .light-green-bg .wb-navtabs [role="tablist"] li.active {
        background: #6B9200;
    }

    .light-green-bg .wb-navtabs [role="tablist"] li.active a:hover {
        background: #666666;
    }

    .light-green-bg .wb-navtabs [role="tablist"] li.active:hover:before {
        border-top: 10px solid #666666;
    }

    .light-green-bg .wb-navtabs [role="tablist"] li.active:before {
        background: #6B9200;
        border-top: 10px solid #B4D308;
    }

    .wb-tabs.carousel-s2 [role="tablist"] li.plypause {
        margin-top: 0;
    }

    .ahwBlueTitle {
        color: #00458D;
    }

    /* Advancing Healthy Workplaces Portal END */

    /* Healthy Workplaces hoveried boxes START*/

    /* HealthyWorkplaces navbar STARTS  */
    .bg-healthywork {
        background-color: #325B8F;
    }

    .nav-healthywork {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }

    .nav-healthywork::after,
    .nav-healthywork::before {
        content: " ";
        display: table;
    }

    .nav-healthywork::after {
        clear: both;
    }

    .nav-healthywork>li {
        display: block;
        margin: 0;
        padding: 0;
    }

    .nav-healthywork>li:not(.logo-item)>a {
        color: #fff;
        display: block;
        padding: 6px 10px;
        text-decoration: none;
    }

    .nav-healthywork>li:not(.healthywork-item)>a {
        color: #fff;
        display: block;
        padding: 0 10px 0 20px;
        margin-top: 0;
        margin-bottom: 0;
        text-decoration: none;
    }

    .logo-item {
        padding-top: 0;
        margin-top: 0;
    }

    .nav-healthywork>li>a:focus {
        color: #fff;
        background-color: transparent;
        text-decoration: underline;
    }

    .nav-healthywork>li>a:hover {
        background-color: transparent;
        text-decoration: underline;
    }

    .nav-healthywork>li>a:visited {
        background-color: transparent;
        text-decoration: underline;
    }

    .nav-healthywork-flex-item-fr {
        font-size: 90%;
    }

    /*flexbox STARTS*/
    .flex-container-nav-healthywork {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        align-items: flex-start;
        -webkit-align-items: flex-start;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: 0;
        margin: 1em 0 0.6em 0;
    }

    .nav-healthywork-flex-item,
    .nav-healthywork-flex-item-fr {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        align-self: center;
        text-transform: uppercase;
        padding: 0;
        margin: 0;

    }

    /* flexbox ENDS */
    /* Smallest screens */
    @media screen and (max-width: 519px) {
        .flex-container-nav-healthywork {
            justify-content: flex-start;
            -webkit-justify-content: flex-start;
            padding: 0;
        }

        .nav-healthywork>li:not(.healthywork-item)>a {
            padding: 0;
            margin: 0;
        }

        .nav-healthywork>li:not(.logo-item)>a {
            padding-top: 15px;
            padding-bottom: 15px;
        }

        .flex-container-nav-healthywork img {
            display: block;
        }
    }

    @media screen and (max-width: 1199px) {
        .nav-healthywork-flex-item {
            font-size: 80%;
        }

        .nav-healthywork-flex-item-fr {
            font-size: 75%;
        }
    }

    /* Small screens */
    @media screen and (min-width: 520px) and (max-width: 1199px) {
        .flex-container-nav-healthywork {
            justify-content: space-around;
            -webkit-justify-content: space-around;
            padding: 0;
        }

        .nav-healthywork-flex-item,
        .nav-healthywork-flex-item-fr {
            justify-content: flex-start;
            -webkit-justify-content: flex-start;
        }

        .nav-healthywork>li:not(.healthywork-item)>a {
            padding: 0;
            margin: 0;
        }

        .nav-healthywork>li:not(.logo-item)>a {
            padding-top: 15px;
            padding-bottom: 15px;
        }
    }

    /* Medium screens */
    @media screen and (min-width: 520px) and (max-width: 1199px) {
        .flex-container-nav-healthywork img {
            width: 1199px;
            height: auto;
        }
    }

    /* HealthyWorkplaces navbar ENDS  */

    .steps-box {
        border: 1px solid #fcdead;
        text-align: center;
        display: inline-block;
        padding: 4em 2.8em;
    }

    .steps-box-fr {
        border: 1px solid #fcdead;
        text-align: center;
        display: inline-block;
        padding: 3em 2.8em;
    }

    .steps-box p,
    .steps-box-fr p {
        font-size: 120%;
    }

    .steps-box-number {
        color: #faa41a;
        display: block;
        font-size: 125%;
        font-weight: bold;
    }



    div#hw-line11 div#aa-content,
    div#hw-line12 div#cc-content,
    div#hw-line13 div#ee-content,
    div#hw-line14 div#gg-content,
    div#hw-line15 div#kk-content,
    div#hw-line16 div#mm-content,
    div#hw-line17 div#oo-content,
    div#hw-line18 div#rr-content {
        display: block;
        height: 300px;
    }

    div#hw-line11-fr div#aa-content,
    div#hw-line12-fr div#cc-content,
    div#hw-line13-fr div#ee-content,
    div#hw-line14-fr div#gg-content,
    div#hw-line15-fr div#kk-content,
    div#hw-line16-fr div#mm-content,
    div#hw-line17-fr div#oo-content,
    div#hw-line18-fr div#rr-content {
        display: block;
        height: 360px;
    }

    div#hw-line11:hover div#aa-content,
    div#hw-line11:active div#aa-content,
    div#hw-line11:focus div#aa-content,
    div#hw-line11 div#bb-content,
    div#hw-line12:hover div#cc-content,
    div#hw-line12:active div#cc-content,
    div#hw-line12:focus div#cc-content,
    div#hw-line12 div#dd-content,
    div#hw-line13:hover div#ee-content,
    div#hw-line13:active div#ee-content,
    div#hw-line13:focus div#ee-content,
    div#hw-line13 div#ff-content,
    div#hw-line14:hover div#gg-content,
    div#hw-line14:active div#gg-content,
    div#hw-line14:focus div#gg-content,
    div#hw-line14 div#jj-content,
    div#hw-line15:hover div#kk-content,
    div#hw-line15:active div#kk-content,
    div#hw-line15:focus div#kk-content,
    div#hw-line15 div#ll-content,
    div#hw-line16:hover div#mm-content,
    div#hw-line16:active div#mm-content,
    div#hw-line16:focus div#mm-content,
    div#hw-line16 div#nn-content,
    div#hw-line17:hover div#oo-content,
    div#hw-line17:active div#oo-content,
    div#hw-line17:focus div#oo-content,
    div#hw-line17 div#pp-content,
    div#hw-line18:hover div#rr-content,
    div#hw-line18:active div#rr-content,
    div#hw-line18:focus div#rr-content,
    div#hw-line18 div#ss-content,
    div#hw-line11-fr:hover div#aa-content,
    div#hw-line11-fr:active div#aa-content,
    div#hw-line11-fr:focus div#aa-content,
    div#hw-line11-fr div#bb-content,
    div#hw-line12-fr:hover div#cc-content,
    div#hw-line12-fr:active div#cc-content,
    div#hw-line12-fr:focus div#cc-content,
    div#hw-line12-fr div#dd-content,
    div#hw-line13-fr:hover div#ee-content,
    div#hw-line13-fr:active div#ee-content,
    div#hw-line13-fr:focus div#ee-content,
    div#hw-line13-fr div#ff-content,
    div#hw-line14-fr:hover div#gg-content,
    div#hw-line14-fr:active div#gg-content,
    div#hw-line14-fr:focus div#gg-content,
    div#hw-line14-fr div#jj-content,
    div#hw-line15-fr:hover div#kk-content,
    div#hw-line15-fr:active div#kk-content,
    div#hw-line15-fr:focus div#kk-content,
    div#hw-line15-fr div#ll-content,
    div#hw-line16-fr:hover div#mm-content,
    div#hw-line16-fr:active div#mm-content,
    div#hw-line16-fr:focus div#mm-content,
    div#hw-line16-fr div#nn-content,
    div#hw-line17-fr:hover div#oo-content,
    div#hw-line17-fr:active div#oo-content,
    div#hw-line17-fr:focus div#oo-content,
    div#hw-line17-fr div#pp-content,
    div#hw-line18-fr:hover div#rr-content,
    div#hw-line18-fr:active div#rr-content,
    div#hw-line18-fr:focus div#rr-content,
    div#hw-line18-fr div#ss-content {
        display: none;
    }

    div#hw-line11:hover div#bb-content,
    div#hw-line11:active div#bb-content,
    div#hw-line11:focus div#bb-content,
    div#hw-line12:hover div#dd-content,
    div#hw-line12:active div#dd-content,
    div#hw-line12:focus div#dd-content,
    div#hw-line13:hover div#ff-content,
    div#hw-line13:active div#ff-content,
    div#hw-line13:focus div#ff-content,
    div#hw-line14:hover div#jj-content,
    div#hw-line14:active div#jj-content,
    div#hw-line14:focus div#jj-content,
    div#hw-line15:hover div#ll-content,
    div#hw-line15:active div#ll-content,
    div#hw-line15:focus div#ll-content,
    div#hw-line16:hover div#nn-content,
    div#hw-line16:active div#nn-content,
    div#hw-line16:focus div#nn-content,
    div#hw-line17:hover div#pp-content,
    div#hw-line17:active div#pp-content,
    div#hw-line17:focus div#pp-content,
    div#hw-line18:hover div#ss-content,
    div#hw-line18:active div#ss-content,
    div#hw-line18:focus div#ss-content {
        display: block;
        height: 300px;
    }

    div#hw-line11-fr:hover div#bb-content,
    div#hw-line11-fr:active div#bb-content,
    div#hw-line11-fr:focus div#bb-content,
    div#hw-line12-fr:hover div#dd-content,
    div#hw-line12-fr:active div#dd-content,
    div#hw-line12-fr:focus div#dd-content,
    div#hw-line13-fr:hover div#ff-content,
    div#hw-line13-fr:active div#ff-content,
    div#hw-line13-fr:focus div#ff-content,
    div#hw-line14-fr:hover div#jj-content,
    div#hw-line14-fr:active div#jj-content,
    div#hw-line14-fr:focus div#jj-content,
    div#hw-line15-fr:hover div#ll-content,
    div#hw-line15-fr:active div#ll-content,
    div#hw-line15-fr:focus div#ll-content,
    div#hw-line16-fr:hover div#nn-content,
    div#hw-line16-fr:active div#nn-content,
    div#hw-line16-fr:focus div#nn-content,
    div#hw-line17-fr:hover div#pp-content,
    div#hw-line17-fr:active div#pp-content,
    div#hw-line17-fr:focus div#pp-content,
    div#hw-line18-fr:hover div#ss-content,
    div#hw-line18-fr:active div#ss-content,
    div#hw-line18-fr:focus div#ss-content {
        display: block;
        height: 360px;
    }

    div#hw-line11:hover div#bb-content,
    div#hw-line11:active div#bb-content,
    div#hw-line11:focus div#bb-content,
    div#hw-line12:hover div#dd-content,
    div#hw-line12:active div#dd-content,
    div#hw-line12:focus div#dd-content,
    div#hw-line13:hover div#ff-content,
    div#hw-line13:active div#ff-content,
    div#hw-line13:focus div#ff-content,
    div#hw-line14:hover div#jj-content,
    div#hw-line14:active div#jj-content,
    div#hw-line14:focus div#jj-content,
    div#hw-line15:hover div#ll-content,
    div#hw-line15:active div#ll-content,
    div#hw-line15:focus div#ll-content,
    div#hw-line16:hover div#nn-content,
    div#hw-line16:active div#nn-content,
    div#hw-line16:focus div#nn-content,
    div#hw-line17:hover div#pp-content,
    div#hw-line17:active div#pp-content,
    div#hw-line17:focus div#pp-content,
    div#hw-line18:hover div#ss-content,
    div#hw-line18:active div#ss-content,
    div#hw-line18:focus div#ss-content,
    div#hw-line11-fr:hover div#bb-content,
    div#hw-line11-fr:active div#bb-content,
    div#hw-line11-fr:focus div#bb-content,
    div#hw-line12-fr:hover div#dd-content,
    div#hw-line12-fr:active div#dd-content,
    div#hw-line12-fr:focus div#dd-content,
    div#hw-line13-fr:hover div#ff-content,
    div#hw-line13-fr:active div#ff-content,
    div#hw-line13-fr:focus div#ff-content,
    div#hw-line14-fr:hover div#jj-content,
    div#hw-line14-fr:active div#jj-content,
    div#hw-line14-fr:focus div#jj-content,
    div#hw-line15-fr:hover div#ll-content,
    div#hw-line15-fr:active div#ll-content,
    div#hw-line15-fr:focus div#ll-content,
    div#hw-line16-fr:hover div#nn-content,
    div#hw-line16-fr:active div#nn-content,
    div#hw-line16-fr:focus div#nn-content,
    div#hw-line17-fr:hover div#pp-content,
    div#hw-line17-fr:active div#pp-content,
    div#hw-line17-fr:focus div#pp-content,
    div#hw-line18-fr:hover div#ss-content,
    div#hw-line18-fr:active div#ss-content,
    div#hw-line18-fr:focus div#ss-content {
        background-color: #faa41a;
    }

    /* Healthy Workplaces hoveried boxes END*/

    /* Gender, Work and Health portal STARTS */
    .bg-gwh {
        background-color: #30bdb0;
    }

    .light-green-bg {
        background-color: #aae2dd;
    }

    .light-violet-bg {
        background-color: #cac1d4;
    }

    .light-green {
        color: #30bdb0;
    }

    .light-green-bttm-brd {
        border-bottom: 2px solid #30bdb0;
        width: 98%;
    }



    /* GWH navbar STARTS  */
    .brand-gwh {
        padding: 0;
        margin: 0;
        background-color: #fff;
        display: inline-block;
    }

    /*.nav-gwh > li + li {
    margin-right: 2px;
	padding-bottom:0;
}*/
    .nav-gwh {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }

    .nav-gwh::after,
    .nav-gwh::before {
        content: " ";
        display: table;
    }

    .nav-gwh::after {
        clear: both;
    }

    .nav-gwh>li {
        display: block;
    }

    .nav-gwh>li:not(.brand-gwh)>a {
        color: #fff;
        display: block;
        padding: 10px 18px;
        text-decoration: none;
    }

    .nav-gwh>li:not(.nav-gwh-flex-item-right)>a {
        font-weight: bold;
    }

    .nav-gwh .nav-gwh-active a {
        color: #000;
    }

    .nav-gwh>li>a:focus {
        color: #fff;
    }

    .nav-gwh>li:not(.nav-gwh-active)>a:visited {
        color: white;
    }

    .nav-gwh>li:not(.nav-gwh-active)>a:hover {
        color: black;
    }

    .nav-gwh>li>a:visited {
        color: black;
    }

    .nav-gwh>li>a:hover {
        color: black;
    }

    /*flexbox STARTS*/
    .flex-container-nav-gwh {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        align-items: flex-start;
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: 0;
        margin: 0;
    }

    .nav-gwh-flex-item,
    .nav-gwh-flex-item-right {
        padding: 0;
        margin: 0;
        align-self: flex-end;
    }

    .brand-gwh {
        padding: 0;
        margin: 0;
        align-self: flex-start;
    }

    .nav-gwh-flex-item,
    .nav-gwh-flex-item-right {
        margin-bottom: 1.6em;
        background-color: #30bdb0;
    }

    li.nav-gwh-flex-item-right {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        display: flex;
        margin-left: auto;
        justify-content: flex-end;
    }

    .nav-gwh-flex-item {
        /*  text-transform:uppercase;*/
        text-align: center;
    }

    .nav-gwh-flex-item-right {
        flex: 1 0 100px;
        /*200px to move it to second line on smaller devices*/
        text-align: right;
    }

    /*flexbox ENDS*/
    @media (max-width:399px) {

        .nav-gwh-flex-item,
        .nav-gwh-flex-item-right {
            text-align: left;
        }
    }

    @media (max-width:482px) {
        li.nav-gwh-flex-item-right {
            padding-top: 2px;
            flex: 1 0 200px;
            /*200px to move it to second line on smaller devices*/
            justify-content: flex-start;
            text-align: left;

        }

        li.nav-gwh-flex-item-right>a {
            text-align: left;
        }

        .nav-gwh-flex-item {
            align-self: flex-start;
            margin-bottom: 0;
        }

        .flex-container-nav-gwh {
            background-color: #30bdb0;
        }
    }

    @media (min-width:483px) and (max-width:600px) {
        .nav-gwh {
            font-size: 80%;
        }
    }

    @media (min-width:400px) and (max-width:991px) {

        .nav-gwh-flex-item-right {
            text-align: left;
        }
    }

    @media (min-width:400px) and (max-width:1200px) {
        li.brand-gwh {
            width: 100%;
        }
    }

    /* GWH navbar ENDS  */
    /*Main content STARTS*/
    .gwh-intro {
        width: 85%;
        line-height: 200%;
        font-size: 150%;
    }

    /*Main subjects box STARTS*/

    /*Styles for row with two sections */
    /*flexbox STARTS*/
    .main-subjects-flex {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        min-width: 320px;
        width: 100%;
        font-weight: normal;
        background-color: #eee;
        padding: 2em;
        margin-bottom: 2em;
        margin-top: 2em;
    }

    .main-subjects-flex section {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        height: 18em;
    }

    /*flexbox ENDS*/
    /*Styles for row with four sections */
    .main-subjects-row div {
        height: 100%;
        min-height: 15em;
        padding: 2em;
        display: inline-block;
    }

    .main-subjects-row p {
        line-height: 1.5;
    }

    #main-subjects-first {
        background-color: #aae2dd;
    }

    #main-subjects-second {
        background-color: #acd7f2;
    }

    #main-subjects-third {
        background-color: #CAC1D4;
    }

    #main-subjects-fourth {
        background-color: #B8D1DA;
    }

    .subject-titles {
        font-size: 4rem;
        letter-spacing: 2px;
    }

    /*Main subjects box ENDS*/

    /* Infographic styles START*/
    .gender-health-infographic,
    .gender-health-infographic-fr {
        position: relative;
        text-align: center;
    }

    .gender-health-infographic p {
        font-size: 110%;
        font-weight: normal;
        /*font-weight:bold;*/
    }

    .gender-health-infographic-fr p {
        font-size: 105%;
        font-weight: normal;
        /*font-weight:bold;*/
    }

    .gender-health-infographic div,
    .gender-health-infographic-fr div {
        padding: 1em;
    }

    .gender-health-infographic h2 {
        font-size: 130%;
        font-weight: bold;
        width: 100%;
        margin-top: 0;
        padding-top: 0;
    }

    .gender-health-infographic-fr h2 {
        font-size: 125%;
        font-weight: bold;
        width: 100%;
        margin-top: 0;
        padding-top: 0;
    }

    #physical-psychosocial {
        position: absolute;
        top: 6em;
        bottom: 0;
        left: 37em;
        right: 0;
        max-width: 300px;
    }

    .gender-health-infographic-fr #physical-psychosocial {
        position: absolute;
        top: 4.5em;
        bottom: 0;
        left: 37em;
        right: 0;
        max-width: 300px;
    }

    .gender-health-infographic-fr #physical-psychosocial h2 {
        width: 80%;
        padding-bottom: 2px;
        margin: 0 auto;
    }

    #rehab {
        position: absolute;
        top: 22em;
        bottom: 0;
        left: 48em;
        right: 0;
        max-width: 300px;
    }

    #shift-work {
        position: absolute;
        top: 40em;
        bottom: 0;
        left: 48em;
        right: 1em;
        max-width: 300px;
    }

    .gender-health-infographic-fr #shift-work {
        position: absolute;
        top: 40em;
        bottom: 0;
        left: 50em;
        right: 1em;
        max-width: 280px;
    }

    #injury-rates {
        position: absolute;
        top: 53em;
        bottom: 0;
        left: 41em;
        right: 0;
        max-width: 300px;
    }

    .gender-health-infographic-fr #injury-rates {
        position: absolute;
        top: 53em;
        bottom: 0;
        left: 41em;
        right: 0;
        max-width: 280px;
    }

    #training {
        position: absolute;
        top: 53.5em;
        bottom: 0;
        left: 13.5em;
        right: 0;
        max-width: 300px;
    }

    .gender-health-infographic-fr #training {
        position: absolute;
        top: 53em;
        bottom: 0;
        left: 14.5em;
        right: 0;
        max-width: 280px;
    }

    #return-to-work {
        position: absolute;
        top: 40em;
        bottom: 0;
        left: 5em;
        right: 0;
        max-width: 300px;
    }

    #mental-health {
        position: absolute;
        top: 22em;
        bottom: 0;
        left: 5em;
        right: 0;
        max-width: 300px;
    }

    #serious-injury {
        position: absolute;
        top: 6em;
        bottom: 0;
        left: 16em;
        right: 0;
        max-width: 300px;
    }

    .gender-health-infographic-fr #serious-injury {
        position: absolute;
        top: 4.5em;
        bottom: 0;
        left: 17em;
        right: 0;
        max-width: 300px;
    }

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

        .gender-health-infographic h2,
        .gender-health-infographic-fr h2 {
            font-size: 110%;
        }

        .gender-health-infographic p,
        .gender-health-infographic-fr p {
            font-size: 95%;
            font-weight: normal;
            /*font-weight:bold;*/
        }

        #physical-psychosocial {
            top: 3.5em;
            left: 32em;
            max-width: 240px;
        }

        .gender-health-infographic-fr #physical-psychosocial {
            top: 3.5em;
            left: 31em;
            max-width: 240px;
        }

        .gender-health-infographic-fr #physical-psychosocial h2 {
            width: 90%;
            padding-bottom: 2px;
            margin: 0 auto;
        }

        #rehab {
            top: 18em;
            left: 38em;
        }

        .gender-health-infographic-fr #rehab {
            top: 18em;
            left: 39em;
        }

        #shift-work {
            top: 33em;
            left: 41em;
        }

        .gender-health-infographic-fr #shift-work {
            top: 33em;
            left: 41em;
        }

        #injury-rates {
            top: 46em;
            left: 34em;
            max-width: 200px;
        }

        .gender-health-infographic-fr #injury-rates {
            position: absolute;
            top: 45em;
            bottom: 0;
            left: 34.5em;
            right: 0;
            max-width: 200px;
        }

        #training {
            top: 46em;
            left: 12em;
            max-width: 200px;
        }

        .gender-health-infographic-fr #training {
            top: 45em;
            left: 13em;
            max-width: 200px;
        }

        #return-to-work {
            top: 33em;
            left: 1.5em;
        }

        #mental-health {
            top: 18em;
            left: 2em;
        }

        #serious-injury {
            top: 3.5em;
            left: 15em;
            max-width: 220px;
        }

        .gender-health-infographic-fr #serious-injury {
            top: 3.5em;
            left: 15em;
            max-width: 220px;
        }



    }

    @media screen and (max-width: 991px) {
        .gender-health-infographic h2 {
            font-size: 100%;
        }

        .gender-health-infographic-fr h2 {
            font-size: 85%;
        }

        .gender-health-infographic p {
            font-size: 80%;
        }

        .gender-health-infographic-fr p {
            font-size: 75%;
        }

        #physical-psychosocial {
            top: 2.7em;
            left: 24em;
            max-width: 220px;
        }

        .gender-health-infographic-fr #physical-psychosocial {
            top: 1.8em;
            left: 25em;
            max-width: 150px;
        }

        .gender-health-infographic-fr #physical-psychosocial h2 {
            width: 80%;
            padding-bottom: 2px;
            margin: 0 auto;
        }

        #rehab {
            top: 14em;
            left: 30em;
            max-width: 250px;
        }

        .gender-health-infographic-fr #rehab {
            top: 14em;
            left: 30em;
        }

        #shift-work {
            top: 24em;
            left: 33em;
        }

        .gender-health-infographic-fr #shift-work {
            top: 24em;
            left: 32em;
        }

        #injury-rates {
            top: 35em;
            left: 26em;
        }

        .gender-health-infographic-fr #injury-rates {
            top: 35em;
            left: 26.5em;
        }

        #training {
            top: 35em;
            left: 8em;
        }

        .gender-health-infographic-fr #training {
            top: 35em;
            left: 9.5em;
            max-width: 180px;
        }

        #return-to-work {
            top: 24em;
            left: 1em;
            max-width: 220px;
        }

        #mental-health {
            top: 14em;
            left: 1em;
            max-width: 250px;
        }

        #serious-injury {
            top: 2.7em;
            left: 10em;
        }

        .gender-health-infographic-fr #serious-injury {
            top: 2em;
            left: 10em;
        }
    }

    @media screen and (max-width: 485px) {
        .main-subjects-flex section h2 {
            flex: 1 0 200px;
        }
    }

    @media (min-width: 748px) {
        .visible-xs-infographic {
            display: none !important;
        }
    }

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

        .gender-health-infographic img,
        .gender-health-infographic-fr img {
            display: none;
        }

        #physical-psychosocial,
        #rehab,
        #shift-work,
        #injury-rates,
        #training,
        #return-to-work,
        #mental-health,
        #serious-injury,
        .gender-health-infographic-fr #physical-psychosocial,
        .gender-health-infographic-fr #rehab,
        .gender-health-infographic-fr #shift-work,
        .gender-health-infographic-fr #injury-rates,
        .gender-health-infographic-fr #training,
        .gender-health-infographic-fr #return-to-work,
        .gender-health-infographic-fr #mental-health,
        .gender-health-infographic-fr #serious-injury {
            position: static;
            text-align: center;
            max-width: 100%;
            margin: 0;
            padding: 0;
        }

        .gender-health-infographic h2,
        .gender-health-infographic-fr h2 {
            font-size: 150%;
            color: #652F8F;
            margin-bottom: 0.3em;
        }

        .gender-health-infographic p,
        .gender-health-infographic-fr p {
            font-size: 110%;
            font-weight: normal;
            margin-bottom: 1em;
            padding-left: 2em;
            padding-right: 2em;
        }

        .gender-health-infographic-fr #physical-psychosocial h2 {
            width: 100%;
            margin-bottom: 0.3em;
        }
    }

    /* Infographic styles END*/

    /*secondary pages styles*/
    /*flexbox STARTS*/
    .header-sec-page {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
        /* NEW, Spec - Opera 12.1, Firefox 20+ */
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        min-width: 220px;
        font-weight: normal;
    }

    .header-sec-page h1 {
        font-weight: normal;
        padding-left: 5%;
    }

    /*flexbox ENDS*/

    .sec-page-content {
        font-size: 150%;
        width: 98%
    }

    .sec-page-content p {
        margin-bottom: 0.7em;
    }

    /* Carousel styles by Chris E */
    .wb-tabs.carousel-s2 [role=tablist] li.plypause {
        display: none;
    }

    ul.tablist li a {
        outline: 0px;
    }

    .img-grid img {
        padding: 30px 0px 15px 0px;
    }

    .tabpanels>details>div {
        background-color: #C7D9E8;
        padding: 0px;
        margin: 0px;
    }

    .wb-tabs>.tabpanels>details {
        padding: 0px;
    }

    .tgl-panel>.row {
        margin: 0px;
        padding: 20px;
    }

    .wb-navtabs [role="tablist"] li a {
        padding: 15px;
        background-color: black;
        color: white;
        outline: 0px;
        font-size: 13px;
        font-weight: bold;
        font-family: Verdana, Arial, sans-serif;
    }

    .wb-navtabs [role="tablist"] li.active a {
        padding: 15px;
        color: white;
        outline: 0px;
        font-size: 13px;
        font-weight: bold;
        font-family: Verdana, Arial, sans-serif;
    }

    .rounded-row {
        background-color: #ffffff;
        border: 2x solid;
        border-radius: 5px;
        padding: 20px;
        margin-left: 0px;
        margin-right: 0px;
        height: 100%;
    }

    @media screen and (min-width: 992px) {
        .wb-tabs.carousel-s2.show-thumbs [role=tablist] li[role=presentation] img {
            width: 143px;
        }
    }

    /* Gender, Work and Health portal ENDS */
    /*styles specific to medium and small devices for HMW portal START*/

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

        div.tools-box-cont,
        div.tools-box-cont div.row,
        div.tools-box-cont div.row div.cell {
            display: block;
        }

        div.col-sm-4 {
            width: 100%;
        }

        div.whats-new {
            width: 97%;
        }

        div.topics-boxes div.bg-imgs-scaled .col-md-4 {
            clear: both;
            min-width: 86%;
            margin-bottom: 4%;
            margin-left: 5%;
        }

        div.video-frame .col-md-5 {
            width: 100%;
        }

        div.topics-boxes div.mrgn-lft-md {
            margin-left: 0;
        }

        div.topics-boxes div.bg-imgs-scaled {
            overflow: visible;
        }

        .topics-box {
            margin-right: 0px;
            width: 0%;
        }

        div.topics-boxes div.bg-imgs-scaled .col-md-4 .arrow {
            top: 80%;
            left: 45%;
        }

    }

    @media screen and (min-width: 1200px) {
        div.tools-box-cont {
            display: table;
        }

        div.tools-box-cont div.row {
            display: table-row;
        }

        div.tools-box-cont div.row div.cell {
            display: table-cell;
        }

    }


    @media screen and (max-width: 419px) {
        .navbar-hmw .items
        /*, .navbar-hmw .items-fr*/

            {
            display: table-cell;
            padding: 1% 4% 0% 5%;
        }

        div.topics-boxes div.bg-imgs-scaled img {
            width: 100%;
        }

        .navbar-hmw .items-fr {
            display: table-cell;
            padding: 2% 2% 0% 2.5%;
        }

        /*.logo-img {
		width:100%;
	}*/

        .list-inline>li {
            padding-left: 0;
            padding-right: 0;
        }

        .logo-img .mrgn-lft-lg,
        .logo-img .mrgn-rght-lg {
            margin: 0;
        }
    }

    @media screen and (max-width: 1200px) {
        .navbar-hmw {
            height: auto;
        }

        .logo-img,
        .logo-img img {
            width: 100%;
            padding: 0;
            margin: 0;
        }

        /*.list-inline > li {
		padding:0;
	}*/

        .navbar-hmw .items {
            margin-bottom: 0;
        }

        .no-lft-mrgn-and-pddn-sm {
            margin-left: 0;
            padding-left: 0;
        }
    }

    @media screen and (min-width: 319px) and (max-width: 550px) {

        li.items-fr,
        li.items {
            font-size: 80%;
            width: 100%;
        }

        /*.logo-img {
		 width:105%;
		 }
*/
    }

    /* Oleg's styles*/
    /* hmw brand image and navbar for smaller devices*/
    /* hmw brand image  for smaller devices*/
    /*	@media screen and (max-width:1200px) {
		#hmw-brand {
		    display: block;	
			margin:0 auto;
			}
		}*/

    @media screen and (min-width: 420px) and (max-width: 1200px) {
        li#menu-items-second-row {
            display: block;
            width: 100%;
            /*margin:0 auto;*/

            font-size: .9em;
            padding: 0;
        }

        li#menu-items-second-row ul {
            text-align: center;
            margin: 0 auto;
            padding: 0;
            margin: 0;
            width: 100%;
        }

        li#menu-items-second-row ul li {
            display: inline-block;
            margin: 0 auto;
            padding: 7px 10px 0px 10px;
            width: 20%;
        }

        li#menu-items-second-row ul li div.pull-right {
            float: none;
            text-align: center;
            width: 100%;
            min-width: 100px;
        }
    }

    /*styles specific to medium and small devices for HMW portal END*/

    @media screen and (max-width: 991px) {
        /* Adjust spacing of top "return to X listing" link on smaller screens */

        .returnLinkTop {
            margin-top: 4%;
        }
    }

    /* fixed display for ipads*/
    /* Topics section */

    @media screen and (min-width: 1120px) and (max-width: 1532px) {
        .bg-imgs-scaled {
            width: 100%;
            overflow: hidden;
            height: 390px;
        }

        .bg-imgs-scaled .col-md-4 {
            width: 29.3333%;
            float: left;
        }

        .topics-box1,
        .topics-box2,
        .topics-box3 {
            /*background-size: 100% 100%;*/

            background-size: contain;
            padding: 0;
            margin-top: 25px;
        }

        .bg-imgs-scaled h2 {
            font-size: 1.8em;
        }

        .bg-imgs-scaled .col-md-4 .arrow {
            left: 40%;
            top: 80%;
        }

        /* Tools section */

        #tools-title-min-1 {
            font-size: 1.8em;
        }
    }

    @media screen and (min-width: 1120px) and (max-width: 1199px) {
        .bg-imgs-scaled {
            width: 100%;
            overflow: hidden;
            height: 325px;
        }

        .bg-imgs-scaled .col-md-4 .arrow {
            left: 40%;
            top: 240px;
        }
    }

    /* Topics section */

    @media screen and (min-width: 992px) and (max-width: 1119px) {
        .bg-imgs-scaled {
            width: 100%;
            overflow: hidden;
            height: 360px;
        }

        .bg-imgs-scaled .col-md-4 {
            width: 29.3333%;
            float: left;
        }

        .topics-box1,
        .topics-box2,
        .topics-box3 {
            /*background-size: 100% 100%;*/

            background-size: contain;
            padding: 0;
            margin-top: 25px;
        }

        .bg-imgs-scaled h2 {
            font-size: 1.8em;
        }

        .bg-imgs-scaled .col-md-4 .arrow {
            left: 40%;
            top: 240px;
        }

        /* Tools section */

        #tools-title-min-1 {
            font-size: 1.8em;
        }
    }

    /* Topics section */

    @media screen and (min-width: 681px) and (max-width: 991px) {
        .bg-imgs-scaled {
            width: 100%;
            overflow: hidden;
            height: 290px;
        }

        .bg-imgs-scaled .col-md-4 {
            width: 29.3333%;
            float: left;
        }

        .topics-box1,
        .topics-box2,
        .topics-box3 {
            /*background-size: 100% 100%;*/

            background-size: contain;
            padding: 0;
        }

        .bg-imgs-scaled h2 {
            font-size: 1.8em;
        }

        .bg-imgs-scaled .col-md-4 .arrow {
            left: 40%;
            top: 170px;
        }

        /* Tools section */

        #tools-title-min-1 {
            font-size: 1.8em;
        }
    }

    /* fixed display for ipades landscape */
    /* Tools section */

    @media screen and (min-width: 769px) and (max-width: 1532px) {
        .tools-box {
            min-height: 420px;
            margin-top: 25px;
        }
    }

    /* fixed display for ipades */
    /* Tools section */

    @media screen and (min-width: 760px) and (max-width: 768px) {
        .tools-box {
            min-height: 520px;
            margin-top: 25px;
        }
    }

    /* fixed display for iphones landscape */
    /* Tools section */

    @media screen and (min-width: 681px) and (max-width: 759px) {
        .tools-box {
            min-height: 250px;
            margin-top: 25px;
        }
    }

    /* fixed display for iphones */

    @media only screen and (min-width: 681px) {
        div.hmw-resources-mobile {
            display: none;
        }

    }

    @media only screen and (max-width: 680px) {
        /* Topics section */

        .topics-box1,
        .topics-box2,
        .topics-box3 {
            float: none;
            margin: 0 auto;
        }

        .topics-box1 h2,
        .topics-box2 h2,
        .topics-box3 h2 {
            padding-top: 20px;
        }

        /* Tools section */

        .tools-box {
            margin-top: 25px;
            min-height: inherit;
            padding-bottom: 20px;
        }

        div.hmw-resources-desktop {
            display: none;
        }

        .wb-greentabs [role="tablist"] li,
        .wb-tabs [role="tablist"] li,
        .wb-navtabs [role="tablist"] li,
        .wb-navtabs [role="tablist"] li a,
        .wb-greentabs [role="tablist"] li a,
        .wb-tabs [role="tablist"] li a {
            background: none;
            border: 0;
            text-align: left;
            color: black;
        }

        .wb-greentabs [role="tablist"] article li {
            margin-bottom: 10px;
            padding: 10px;
        }

        .wb-greentabs [role="tablist"] li:hover,
        .wb-greentabs [role="tablist"] li a:hover {
            background: none;
        }

        .wb-navtabs [role="tablist"] li a,
        .wb-navtabs [role="tablist"] li a:hover {
            text-decoration: underline;
            color: black;
            display: inline;
        }

        ul.hmw-listing li a:hover {
            color: black;
        }

        ul.hmw-listing li {
            margin-bottom: 10px;
            padding: 10px;
        }

        .hmw-listing li:nth-child(odd),
        .wb-greentabs [role="tablist"] li:nth-child(odd):hover {
            background-color: #eee;
        }

        .hmw-listing li:nth-child(even),
        .wb-greentabs [role="tablist"] li:nth-child(even):hover {
            background-color: #fff;
        }

    }

    .wb-tabs.carousel-s2 [role="tablist"] li.prv a .glyphicon,
    .wb-tabs.carousel-s2 [role="tablist"] li.nxt a .glyphicon {
        font-size: 1.33em;
        height: 1.33em;
        line-height: 1.33em;
        margin: auto 0;
        text-align: center;
        width: 1.33em;
    }

    .wb-tabs.carousel-s2 [role="tablist"] {
        bottom: -3.5%;
    }

    .wb-tabs.carousel-s2 [role="tablist"] li.plypause a,
    .wb-tabs [role="tablist"] li.tab-count .curr-count {
        font-size: 1.33em;
    }

    .wb-tabs.carousel-s2 {
        padding-bottom: 3.375em;
    }

    summary:hover {
        background: #eff7de;
        color: #000000;
    }

    @media screen and (max-width: 768px) {
        div.wb-tabs {
            margin-left: 0%;
        }

        .pddn-left-25,
        .pddn-right-25 {
            padding: 0% 2%;
        }

        details.greenGradient {
            width: 100%;
        }

        div#details-elements {
            padding-left: 0;
            padding-right: 0;
        }

        div#details-elements img {
            width: 100%;
        }
    }

    /* Pandemics/Outbreaks portal styles START  */
    /* Navbar STARTS  */
    .nav-pandemics__header {
        background-color: #CFE6A6;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .nav-pandemics__header,
    .nav-pandemics__main {
        padding: 1em;
    }

    .nav-pandemics__header>a,
    .nav-pandemics__header>a:hover,
    .nav-pandemics__header>a:focus {
        text-decoration: none;
    }

    .nav-pandemics__title .first-title,
    .nav-pandemics__title .second-title {
        display: block;
        color: #000080;
        padding: 0;
        margin: 0;
        text-align: center;
        white-space: nowrap;

    }

    .nav-pandemics__title {
        font-family: 'Roboto', sans-serif;
        font-weight: 300;
    }


    .nav-pandemics__title .first-title {
        font-size: calc(1.40vw + 2rem);
        font-weight: 300;
        letter-spacing: 0.01em;
        line-height: 1;
    }

    .nav-pandemics__title .second-title {
        font-size: calc(0.58vw + 2rem);
        font-weight: 700;
        letter-spacing: 0.03em;
    }

    @media screen and (min-width: 550px) {
        .nav-pandemics__title .first-title {
            font-size: 4.7rem;
        }

        .nav-pandemics__title .second-title {
            font-size: 3.4rem;
        }
    }

    .nav-pandemics__main {
        background-color: #000080;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 1em;
    }

    .nav-pandemics__nav {
        max-width: 100%;
    }

    .portal-navlist {
        list-style-type: none;
        font-size: 1.4rem;
        padding-left: 0;
    }

    .portal-navlist,
    .nav-pandemics__search {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .portal-navlist__item {
        display: flex;
        align-self: center;
        flex-wrap: wrap;
        text-transform: uppercase;
        padding-bottom: 0;
        margin-bottom: 0;
        color: #fff;
    }

    .portal-navlist__item>a {
        color: #fff;
        padding: 0.5em 1em;
        text-decoration: none;
    }

    .portal-navlist__item>a:hover,
    .portal-navlist__item>a:focus {
        text-decoration: underline;
    }

    .nav-pandemics__search {
        padding-bottom: 0.5em;
        width: 100%;
    }

    .portal-search-field {
        min-width: 50vw;
    }

    /* Min width 992px */

    @media screen and (min-width: 992px) {
        .nav-pandemics {
            display: flex;
            flex-wrap: wrap;
        }

        .nav-pandemics__header,
        .nav-pandemics__main {
            padding: 0;
        }

        .nav-pandemics__header {
            width: 40%;
        }

        .nav-pandemics__header--fr {
            width: 44%;
        }

        .nav-pandemics__title .first-title {
            font-size: calc(1.40vw + 2rem);
        }

        .nav-pandemics__title .second-title {
            font-size: calc(0.58vw + 2rem);
        }

        .nav-pandemics__main {
            width: 60%;
            display: inline-block;
        }

        .nav-pandemics__main--fr {
            width: 56%;
        }

        .nav-pandemics__nav {
            border-bottom: 1px solid #fff;
            display: flex;
            padding: 0;
            margin: 0;
            height: 70px;
        }

        .nav-pandemics__nav--right {
            justify-content: flex-end;
        }

        .nav-pandemics__nav--bottom {
            align-items: flex-end;
        }

        .nav-pandemics__search {
            justify-content: flex-end;
            align-items: flex-end;
        }

        .portal-navlist,
        .nav-pandemics__search {
            padding-right: 1.3em;
        }

        .portal-navlist__item {
            margin-right: -0.6em;
        }

        .portal-navlist__item>.portal-navlist__link {
            padding: 0.3em 1.3em 0 1.3em;
        }

        .portal-navlist__item>.portal-navlist__link--fr {
            padding: 0.2em 0.8em 0.1em 0.8em;
        }

        .nav-pandemics__search {
            padding-bottom: 0.6em;
        }

        .nav-pandemics__search>form {
            margin: 1.7rem 0 0 0;
        }

        .portal-search-field {
            min-width: 382px;
        }
    }

    /* Min width 1200px */

    @media screen and (min-width: 1200px) {
        .nav-pandemics__title .first-title {
            font-size: 4.7rem;
        }

        .nav-pandemics__title .second-title {
            font-size: 3.4rem;
        }

        .portal-navlist__item>.portal-navlist__link {
            padding: 0 1.3em;
        }

        .portal-navlist__item>.portal-navlist__link--fr {
            padding: 0 0.8em;
        }

        .portal-search-field {
            min-width: 437px;
        }
    }

    /* Grid for all browsers but IE11 */

    @supports (display: grid) {
        .nav-pandemics__nav {
            width: auto;
            max-width: 100%;
        }

        /* Min width 992px */

        @media screen and (min-width: 992px) {

            .nav-pandemics {
                display: grid;
                grid-template-columns: minmax(min-content, 40%) 1fr;
                grid-auto-rows: auto;
                min-width: auto;
            }

            .nav-pandemics--fr {
                grid-template-columns: minmax(min-content, 44%) 1fr;
            }

            .nav-pandemics__header {
                width: auto;
            }

            .nav-pandemics__title {
                max-width: auto;
            }

            .nav-pandemics__main {
                width: auto;
            }
        }

        /* Min width 1200px */

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

            .portal-navlist,
            .nav-pandemics__search {
                justify-content: flex-end;
            }
        }
    }

    /* Navbar ENDS */

    /* Static banner block STARTS  */
    /* Just for one image, for carousel use WET4 carousel component */
    .pandemic-banner__caption {
        padding: .5em 1em;
        color: #fff;
        background: rgba(36, 56, 80, .9);
    }

    .pandemic-banner__caption p {
        margin-bottom: 0;
        line-height: 1.5;
    }

    /* Static banner block ENDS  */


    /* Useful resource CTA */
    .pandemic-resource-cta {
        background-color: #CFE6A6;
    }

    .pandemic-resource-cta__text {
        font-size: 3rem;
        line-height: 1.5;
        font-weight: 700;
    }

    /* Useful Tools  */
    .useful-tools-heading {
        font-size: 3.4rem;
        color: #162A50;
        font-weight: 700;
    }


    /* Pandemics/Outbreaks portal styles END  */