/*
  Running Squiz Matrix
  Developed by Squiz - http://www.squiz.net
  Squiz, Squiz Matrix, MySource, MySource Matrix and Squiz.net are registered Trademarks of Squiz Pty Ltd
  Page generated: 26 August 2021 09:57:43
*/


@media all and (max-width: 800px) {

    .main-content,
    .article-page .main-content {
        width: 65%;
    }

    .article-page .main-content p {
        max-width: 100%;
    }

    nav#main-nav .top-nav li {
        float: left;
    }

    nav#main-nav .top-nav li a {
        height: 58px;
    }

    .sub-nav-wrapper {
        width: 33%;
    }

    .observatory #mobile-nav-icon,
    .observatory #languagebar {
        display: none;
    }

    #top-content {
        background-color: #eeeeee;
        margin-bottom: 1em;
    }

    #top-content div[class*="module"] {
        border: none;
        margin: 0 1% 1em;
        width: 48%;
        min-height: 0;
    }

    .top-box__content {
        padding: 16px 8px 0 0;
        position: relative;
        transform: none;
    }

    .top-box:hover .top-box__content {
        transform: none;
    }

    .top-box__title {
        width: 100%;
        white-space: normal;
        overflow: visible;
    }

    .main-content div[class*="module"].module-3-3,
    .main-content div[class*="module"].module-full-width {
        width: 100%;
    }

    .main-content div[class*="module"].intro-box,
    .main-content div[class*="module"].featured-module,
    .main-content #top-story[class*="sub-module"] {
        width: 100%;
    }

    .main-content div[class*="module"].intro-box {
        width: 100%;
    }


    .main-content div[class*="module"] {
        margin: 1 .9% 1em;
        width: 48%;
    }

    div[class*="sub-module"]>div {
        float: left;
    }

    .scroll-to-top.show {
        display: none !important;
    }

    .index-list-divider {
        display: none;
    }

    #top-content #top-story {
        border-bottom: 1px solid #e2e2e2;
        width: 98%
    }

    #top-content #top-story>* {
        display: block;
        float: left;
        margin-right: 2%;
        width: 48%
    }

    #top-content #top-story img {
        clear: left;
    }

    #footer-featured .module-1-6 {
        height: auto;
        min-height: auto;
        width: 33.333%;
    }

    #contact-us.footer-box {
        width: 25%
    }

    #contact-us.footer-box h3 {
        margin-left: 0;
    }

    #contact-us.footer-box img {
        float: none;
    }

    #contact-us.footer-box p {
        float: none;
        margin: 0;
    }

    #utilities {
        display: none;
    }

    .main-content .featured-publication.height-185,
    .main-content div[class*="module"].searchbar {
        height: auto;
        width: 100%;
    }

    .image-grid-container>div {
        flex-wrap: wrap;
    }

    .image-grid-container img {
        width: 49%;
    }
}

@media all and (max-width: 560px) {

    body,
    #page-wrap,
    header {
        margin: 0;
        padding: 0;
        width: 100%
    }

    .page-haeder {
        text-align: center;
    }

    .mobile-nav-bar {
        display: flex;
        justify-content: space-between;
        padding-left: 11px;
        padding-right: 11px;
    }

    nav#main-nav {
        display: none;
    }

    nav#main-nav .top-nav li a {
        font-size: 1.6em;
        padding: 0px 1.2em;
    }

    #breadcrumb {
        display: none;
    }

    img {
        height: auto;
        width: 100% !important;
    }

    .social-link img {
        width: auto !important;
    }

    #top-content #top-story * {
        float: none;
        width: 100%;
    }

    #content,
    .main-content,
    .article-page .main-content {
        border-left: none;
        padding: 10px;
        width: 100%
    }

    #logo {
        float: none;
        top: auto;
        background-size: 70% auto;
        display: block;
        margin: 0 auto;
    }

    #header-searchbar {
        float: none;
        margin: 0;
        padding: 0;
    }

    #header-searchbar p {
        margin: 0;
    }

    #searchbar-icon {
        background: transparent url('../img/search-icon.png') center center no-repeat;
        display: inline-block;
        height: 31px;
        text-indent: -999em;
        width: 31px;
    }

    #mobile-nav-icon {
        background: transparent url('../img/mobile-nav-icon.png') center center no-repeat;
        display: inline-block;
        height: 31px;
        text-indent: -999em;
        width: 31px;
    }

    #header-searchbar {
        width: 95%;
        margin: 0 1em;
    }

    #header-searchbar form {
        display: none;
        padding-bottom: 1em;
        padding-top: 1em;
    }

    #header-searchbar input {
        margin: 0;
    }

    #header-searchbar input[type="text"] {
        height: 34px;
        width: 70%
    }

    #header-searchbar input[type="submit"] {
        height: 34px;
        width: 30%;
    }

    #languagebar {
        float: none;
        display: inline-block;
        margin: 0;
        text-align: center;
        width: 100px;
        z-index: 941;
    }

    #languagebar ul,
    #languagebar li {
        float: none;
        padding: 0;
        margin: 0;
    }

    #languagebar li {
        display: none;
        list-style: none;
    }

    #languagebar li.current-language {
        display: block;
    }

    #languagebar a {
        background-color: #e2e2e2;
        border: 1px solid #cdcdcd;
        display: block;
        padding: 5px 0;
        text-decoration: none;
    }

    #languagebar li.current-language a {
        background-color: #fff;
        font-weight: normal;
        text-decoration: none;
    }

    nav#main-nav .top-nav li {
        border-bottom: 1px solid #f0f0f0;
        border-right: none;
        float: none;
        margin: 0;
        width: 100%
    }

    nav#main-nav .top-nav li a {
        padding: 15px;
    }

    nav#main-nav .top-nav li a:after {
        display: none;
    }

    header .partners {
        display: none;
    }

    footer .partners a {
        width: 12%;
    }

    .share {
        display: none;
    }

    .page-top-image {
        margin-left: 0;
    }

    .event-location-container img,
    .event-date-container img {
        width: auto !important;
    }

    .event-partners img {
        margin: 0 4% 1.5em;
        width: auto !important;
        max-width: 40%;
    }

    .link-box {
        margin-bottom: 2em !important;
    }

    /*
	 * SUB-NAV
	 */
    .sub-nav-wrapper {
        width: 100%;
    }

    .sub-nav li a {
        display: block;
        font-size: 16px;
        padding: 5px;
    }

    .sub-nav ul,
    .sub-nav ul ul {
        padding-left: 0;
    }

    div[class*="module"] .sub-nav ul ul {
        background-color: #e2e2e2;
        text-indent: 0;
    }

    .sub-nav ul ul ul {
        background-color: #C9C9C9;
        text-indent: 0em;
    }

    div[class*="module"] .sub-nav ul ul li a {
        padding-left: 1em;
    }

    .grid-layout-3 li {
        min-height: 180px;
        padding: 0 1%;
        width: 50%;
    }

    .grid-layout-3 li img {
        height: auto;
        width: auto;
        max-width: 1000%;
    }

    .grid-layout-3 li div {
        width: 100%;
    }


    .article-content figure {
        float: none;
        height: auto;
        width: 100%;
    }

    .article-content .quote,
    .article-content .article-aside {
        border-bottom: 1px solid #e2e2e2;
        border-left: none;
        margin: 0 5% 1em;
        padding-bottom: 1em;
        max-width: 90%;
        width: 90%;
    }

    .equal-height {
        flex-direction: column;
    }

    .module-2-3.top-box {
        width: 100%;
    }

    .top-box__image {
        height: auto;
        width: 100%;
    }

    .top-box__content {
        padding: 16px 8px 0 0;
        position: relative;
        transform: none;
    }

    .top-box:hover .top-box__content {
        transform: none;
    }

    .top-box__title {
        width: 100%;
        white-space: normal;
        overflow: visible;
    }

    /*
	 * Footer
	 */

    #footer-featured .module-1-6 {
        border-right: none;
        float: left;
        height: auto;
        min-height: auto;
        width: 50%;
    }

    .footer-box {
        border-right: none;
        float: none;
        min-height: 1px;
        padding: 0;
        width: 100%;
    }

    .footer-box h3 {
        padding: 0 10px 10px 1em;
        position: relative;
    }

    .footer-box li {
        font-size: 16px;
    }

    .footer-box .toggle-footer-box {
        color: #EBF2F7;
        display: block;
        position: absolute;
        right: 10px;
        top: 0;
        z-index: 1;
        /* Place on top of h3 */
    }

    .footer-box h3 .active {
        transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        /* IE 9 */
        -webkit-transform: rotate(180deg);
        /* Safari and Chrome */
    }

    .footer-box-content {
        background-color: #09436B;
        box-shadow: inset 0 0 5px rgba(0, 0, 0, .2);
        display: none;
        padding: 1em;
    }

    .footer-box-content * {
        margin: 0;
        padding: 0;
    }

    #top-content div[class*="module"] {
        border-bottom: 1px solid #ccc;
        border-right: none;
        min-height: auto;
        height: auto;
        margin: 0 0 1em 0;
        width: 100%;
    }

    .topic-site #top-content div[class*="module"] {
        min-height: auto;
    }

    .main-content div[class*="module"],
    div[class*="module"] {
        border: none;
        border-bottom: 1px solid #e2e2e2;
        float: none;
        margin: 0;
        width: 100%;
    }

    #data-and-evidence div {
        border-bottom: 1px solid #e2e2e2;
        border-right: none;
        float: none;
        margin-right: 0;
        margin-bottom: 1em;
        width: 100%
    }

    #top-story.featured-publication img {
        max-width: 20%;
    }

    #latest-publications li {
        clear: both;
    }

    #latest-publications li img,
    #latest-publications li div {
        display: block;
        float: left;
    }

    #latest-publications li img {
        max-width: 22% !important;
    }

    .main-content div.sub-module-2>div {
        padding-top: 1em;
    }

    .sub-module-2.intro-box .sub-module-first {
        width: 100%;
    }

    .sub-module-2.intro-box .sub-module-last {
        width: 100%;
    }

    .main-content div[class*="module"] .sub-module-last,
    div[class*="module"] .sub-module-last {
        border-bottom: none;
    }


    #latest-publications li div {
        margin-left: 3%;
        vertical-align: top;
        width: 70%
    }

    #footer-featured .module-1-4 {
        border-right: none;
        border-bottom: 4px solid #fff;
        float: none;
        width: 100%
    }

    #top-story .more,
    .more {
        font-size: 0.9em;
        text-align: right;
    }

    .sub-nav li.has-children:after {
        content: 'в–¶';
        position: absolute;
        right: 1em;
        top: 0.5em;

    }

    .sub-nav li.has-children span {
        position: absolute;
        background: none;
        top: 0;
        right: 0;
        height: 24px;
        width: 40px;
        left: auto;
    }

    .index-list {
        background: rgba(255, 255, 255, .7);
        border: 1px solid #333 !important;
        float: none !important;
        right: 0 !important;
        padding-bottom: 0 !important;
        padding-top: 0 !important;
        position: absolute !important;
        width: 2em !important;
        z-index: 1000;
    }

    .index-list a {
        border-bottom: 1px solid #333;
        display: block;
        margin: 0;
        padding: 5px 0;
        text-align: center;
    }

    .index-list a:last-child {
        border-bottom: none;
    }

    div[class*=sub-module]>.sub-module-first {
        max-width: 100%;
    }

    div[class*=sub-module]#top-story>.sub-module-first.border-right {
        border-right: none;
    }

    .participant--image {
        height: auto;
    }

    .tools {
        flex-wrap: wrap;
        justify-content: space-around;
    }

    .tool {
        width: 30%;
    }

    .news-updates-container .slick-prev {
        left: -20px;
        top: 5%;
    }

    .news-updates-container .slick-next {
        right: -20px;
        top: 5%;
    }

    .image-grid-container>div {
        flex-direction: column;
    }

    .event-update {
        padding: 1em 2em;
    }

    .event-updates-wrapper .slick-next {
        right: -25px;
    }

    .event-updates-wrapper .slick-prev {
        left: -25px;
    }


}