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

  .front #block-views-work-packages-block > .content,
  .container {
    width: 100%;
  }

  #navigation .region {
    overflow: unset;
  }

  #sliding-popup .popup-content {
    padding-left: 20px;
    padding-right: 20px;
  }

  /* ------------------------
            SEARCH
  ----------------------------- */

  #block-search-form.mobile-open {
    position: relative;
  }

  #navigation #block-search-form.mobile-open #search-block-form {
    display: block;
  }

  /* Cross icon (close search) */
  #block-search-form.mobile-open > i {
    position: absolute;
    top: 25px;
    right: 40px;
    z-index: 9999;
    color: #fff;
    font-weight: bold;
    content: '\f00d';
    line-height: 1.2;
    cursor: pointer;
    font-size: 26px;
  }

  /* Cross icon on hover */
  #block-search-form.mobile-open > i:hover {

  }

  #block-search-form > div.content {
    display: none;
  }

  #navigation #search-block-form > div {
    width: 100%;
    padding: 0;
  }

  #navigation #search-block-form .form-item-search-block-form {
    float: none;
    width: 100%;
  }

  #block-search-form.mobile-open > div.content {
    display: block;
    min-width: 40vw;
    width: 600px;
    max-width: 80vw;
    color: #fff;
    padding: 25px 40px;
    background: #017879;
    position: absolute;
    top: 0;
    right: 0;
  }

  /* Search title */
  #block-search-form.mobile-open > div.content::before {
    content: 'Search';
    display: block;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 30px;
    margin-bottom: 10px;
    text-align: center;
    line-height: 1;
  }

  /* Search box */
  #navigation #search-block-form input.form-text {
    background: transparent;
    border: 2px solid #fff;
    padding: 20px;
    text-align: center;
    width: 100%;
    line-height: unset;
    font-size: 16px;
    color: #fff;
  }

  /* Search button submit */

  #navigation #search-block-form div.form-actions {
    position: static;
    display: block;
    margin-top: 20px;
    text-align: center;
    float: none;
  }

  #navigation #search-block-form div.form-actions::before {
    display: none;
  }

  .front .list-view .list-item .views-field-nothing .description {
    display: none;
  }

/*  .front #block-views-news-block {
    float: none;
    width: 100%;
    margin: 0 0 40px 0;
    padding-left: 35px;
  }*/

  .front #block-views-news-block .view-content .views-row,
  .front #block-views-events-block .view-content .views-row {
    height: auto;
  }

  .front #block-views-events-block .view-footer,
  .front #block-views-news-block .view-footer {
    text-align: right;
  }

  .front #facts_about_waste,
  .front #block-views-events-block {
    width: 100%;
    margin: 0 0 40px 0;
    position: static;
  }

  .front #facts_about_waste h2 {
    text-align: center;
  }

  .front #facts_about_waste h2::after {
    margin: 20px auto;
    display: block;
    position: static;
  }

  .front #facts_about_waste .content {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
  }

  #facts_about_waste p:not(:first-of-type) {
    text-align: center;
  }

  #navigation #block-system-main-menu.mobile-open {
    float: none;
  }

  #block-system-main-menu > div.content {
    display: none;
  }

  #block-system-main-menu::before {
    content: '\f0c9';
    font-family: 'Font Awesome 5 Pro';
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
    cursor: pointer;
    color: #25334d;
  }

  #block-system-main-menu:hover::before {
    color: #007BC2;
  }

  #block-system-main-menu.mobile-open > div.content {
    background: #0b3c58;
    color: #fff;
    padding-top: 80px;
  }

  /* Menu title */
  #block-system-main-menu.mobile-open > div.content::before {
    content: 'Menu';
    display: block;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 30px;
    margin-bottom: 10px;
    line-height: 1;
    position: absolute;
    top: 25px;
    left: 20px;
  }

  #block-system-main-menu.mobile-open > div.content {
    display: block;
    min-width: 40vw;
    width: 600px;
    max-width: 80vw;
    color: #fff;
    background: #0b3c58;
    position: absolute;
    top: 0;
    right: 0;
  }

  /* Cross icon (close search) */
  #block-system-main-menu.mobile-open > i {
    position: absolute;
    top: 25px;
    right: 20px;
    z-index: 9999;
    color: #fff;
    font-weight: bold;
    content: '\f00d';
    line-height: 1.2;
    cursor: pointer;
    font-size: 26px;
  }

  #navigation #block-system-main-menu ul li {
    float: none;
    width: 100%;
    border-top: 2px solid #ebe9e7;
  }

  #navigation #block-system-main-menu ul li ul {
    border-top: 2px solid #ebe9e7;
    position: relative;
    top: 0 !important;
    margin-left: 0;
  }

  #navigation #block-system-main-menu ul li a::before,
  #navigation #block-system-main-menu ul li a::after {
    display: none;
  }

  #navigation #block-system-main-menu ul li a {
    color: #fff;
    padding: 0 20px;
    display: block;
  }

  #navigation #block-system-main-menu ul li.active-trail > a,
  #navigation #block-system-main-menu ul li.active-trail > i,
  #navigation #block-system-main-menu ul li a:hover {
    color: #f6a022 !important;
  }

  /* submenus on mobile */
  #navigation #block-system-main-menu ul li.expanded ul {
    display: none;
    padding: 10px 0;
  }

  #navigation #block-system-main-menu ul li.expanded:hover ul {
    display: none;
  }

  #navigation #block-system-main-menu ul ul li {
    padding: 0;
    height: auto;
    border: 0;
  }

  #navigation #block-system-main-menu ul li.expanded {
    position: relative;
  }

  #navigation #block-system-main-menu ul li.expanded i.fas.submenu {
    position: absolute;
    top: 0;
    right: 10px;
    line-height: 50px;
    color: #ebe9e7;
    padding: 0 10px;
    cursor: pointer;
  }

  #navigation #block-system-main-menu ul li.expanded i.fas.submenu:hover {
    color: #fff;
  }

  #navigation #block-system-main-menu ul ul li a {
    padding: 0 0 0 20px;
    font-weight: 500;
    line-height: 35px;
  }

  #navigation #block-system-main-menu ul ul li a::before {
    content: '\f111';
    font-family: 'Font Awesome 5 Pro';
    font-weight: bold;
    font-size: 14px;
    display: inline-block;
    margin-right: 7px;
    color: #f6a021;
  }

  .view-work-packages .views-row {
    height: auto;
  }

  #advisory_board .views-row {
    width: calc(100% / 3);
  }

  /* work packages page */
  .not-front.work-package .view-work-packages .views-row.wp-WP3 .views-field-body,
  .not-front.work-package .view-work-packages .views-row.wp-WP5 .views-field-body,
  .not-front.work-package .view-work-packages .views-row.wp-WP3 .views-field-title,
  .not-front.work-package .view-work-packages .views-row.wp-WP5 .views-field-title {
    left: 0;
  }

  .not-front.work-package .view-work-packages .views-row {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% - 20px);
    margin: 60px 20px 0 0;
  }

  .not-front.work-package .view-work-packages .views-row .views-field-field-image::before {
    background: url(../images/corner.png) no-repeat left top;
    background-size: contain;
    content: "";
    position: absolute;
    right: -40px;
    top: -40px;
    z-index: -1;
    width: 165px;
    height: 165px;
  }

  .not-front.work-package .view-work-packages .views-row.views-row-even .views-field-field-image::before {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
    right: auto;
    left: -40px;
  }

  .not-front.work-package .view-work-packages .views-row.wp-WP5 {
    margin-top: 60px;
  }

  .not-front #main::before {
    display: none;
  }

  .not-front.work-package .view-work-packages .views-row .views-field.views-field-field-wp-number {
    order: 1;
    top: -45px;
    left: calc(50% - 40px);
  }

  .not-front.work-package .view-work-packages .views-row .views-field-title {
    order: 2;
    width: 100%;
    border: 0;
  }

  .not-front.work-package .view-work-packages .views-row .views-field.views-field-body {
    order: 3;
    width: 100%;
    padding: 0;
  }

  .not-front.work-package .view-work-packages .views-row .views-field.views-field-field-image {
    order: 4;
    position: relative;
    float: none;
    top: 0;
    left: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .not-front.work-package .view-work-packages .views-row .views-field.views-field-field-image img {
    z-index: 1;
  }

  .not-front.work-package .view-work-packages .views-row.wp-WP3::after,
  .not-front.work-package .view-work-packages .views-row.wp-WP4::after {
    display: none;
  }

  .not-front.work-package .view-work-packages .views-row.views-row-even {
    padding-left: 0;
    margin-top: 0;
  }





}

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

  #about_section.facts ul.menu li {
    width: calc(100% / 2 - 10px);
  }

  #about_section.facts ul.menu li:nth-child(3n+3) {
    margin-right: 20px;
  }

  #about_section.facts ul.menu li:nth-child(2n+2) {
    margin-right: 0;
  }

  .node-type-facts-about-waste-page .main_image {
    float: none;
    margin: 20px 0;
  }

  .node-type-facts-about-waste-page .main_image + .region-content {
    width: 100%;
    float: none;
  }

  .view-work-packages .view-content {
    padding-top: 0;
    margin-top: 50px;
  }

  .view-work-packages .views-row:nth-of-type(2) {
    margin-left: 15%;
    margin-top: 15px;
  }

  .view-work-packages .views-row:nth-of-type(3) {
    float: right;
    margin-top: 0;
  }

  .view-work-packages .views-row {
    width: 70%;
    float: none;
    margin-bottom: 44px;
  }

  .view-work-packages .views-row .views-field-title h3 {
    margin-bottom: 0;
  }

  .view-work-packages .views-row::after,
  .view-work-packages .views-row::before {
    display: none;
  }

  .view-work-packages .views-row::after {
    position: absolute;
    left: 0;
    right: 0;
    top: unset;
    bottom: -40px;
    width: 100%;
    height: 38px;
    background: url(../images/tablet-three-gradient-dots.png) no-repeat bottom center;
    display: block;
  }

  .front #above_content .section-wrapper {
    background: #fff url(../images/main-header-background-1100px.png) no-repeat 32px top;
    overflow: visible;
    background-size: 100% auto;
  }

  .node-type-facts-about-waste-page .image_gallery .alignright,
  .node-type-facts-about-waste-page .image_gallery .alignleft {
    width: 100%;
    float: none;
    text-align: center;
  }

  .node-type-facts-about-waste-page .image_gallery .alignright .caption,
  .node-type-facts-about-waste-page .image_gallery .alignleft .caption {
    text-align: center;
    padding: 0;
  }

}

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

  /* ------------------------
            MENU
  ----------------------------- */

  /* ------------------------
            HOMEPAGE
  ----------------------------- */

  .front #slogan,
  .front #above_content_wrapper {
    height: 390px;
  }

  .front #above_content_wrapper {
    width: 117%;
    background-position: right bottom;
    background-size: auto 85%;
  }

  #block-views-project-partners-block {
    float: none;
    margin: 0 auto;
    width: 100%;
    padding-right: 0;
  }

  #block-views-project-partners-block .view-header h2 {
    text-align: center;
  }

  #block-twitter-block-1  > .content {
    text-align: center;
  }

  #block-views-project-partners-block .slick-active ~ .views-row:not(.slick-active) {
    left: -67%;
  }

  #twitter_follow_us {
    border: 0;
    padding: 0;
    background: transparent;
    margin-top: 20px;
    position: static;
  }

  #footer .section {
    padding: 40px 16px;
  }

  .node-type-about-page .work_packages:not(.slideshow) .view-work-packages,
  .node-type-about-page:not(.about-project-outcomes) .body_text {
    float: none;
    width: 100%;
    margin: 0;
  }

  .node-type-about-page .work_packages:not(.slideshow) .view-work-packages {
    margin-top: 40px;
  }

  .view-about-pages .view-content .views-row,
  .view-about-pages .view-content {
    display: block;
    width: 100%;
  }

  .page-project-partners .view-project-partners .view-content .views-row {
    width: calc(100% / 2 - (20px / 2));
  }

  .page-project-partners .view-project-partners .view-content .views-row:nth-child(3n+3) {
    margin-right: 20px;
  }

  .page-project-partners .view-project-partners .view-content .views-row:nth-child(2n+2) {
    margin-right: 0;
  }

  .node-type-project-partner #content {
    padding-right: 20px;
  }

  #newsletter_section {
    width: calc(100% - 16px*2);
    display: block;
    margin: 40px 16px 0 16px;
  }

  #newsletter_section .block {
    width: 100%;
    display: block;
  }

  #newsletter_section .container {
    padding: 0;
  }

  #newsletter_section #block_newsletter_bottom {
    text-align: center;
    padding-right: 20px;
  }

  #newsletter_section form .form-actions {
    position: static;
    text-align: center;
    width: 100%;
    margin-top: 20px;
  }

  #newsletter_section form .form-actions input {
    margin: 0;
  }

  .node-type-project-partner #main > div,
  .one-sidebar #main > div:not(.clearfix),
  .node-type-project-partner #content {
    width: 100%;
    display: block;
    padding-right: 0;
  }

  .node-type-project-partner .partner_link {
    text-align: left;
  }

  #sidebar {
    padding-left: 0;
    border-left: 0;
  }

  #sidebar div.block {
    width: calc(50% - 20px / 2);
    float: left;
    margin-right: 20px;
  }

  #sidebar div.block:nth-child(2n+2) {
    margin-right: 0;
  }

  .contact #sidebar div.block {
    width: 100%;
    float: none;
    margin-right: 0;
  }

  .contact #sidebar #block-block-1 {
    margin-bottom: 30px;
  }

  .not-front #main::before {
    display: none;
  }

  .not-front.about .field-name-field-image {
    float: none;
    width: 100%;
    margin: 20px 0;
  }

  .not-front.about .field-name-body {
    width: 100%;
  }

  .not-front.about .field-name-field-image {
    max-width: 500px;
  }

  .about-project-outcomes #outcomes {
    margin: 0;
  }

  .about-project-outcomes .outcome h2 {
    width: 100%;
  }

  .about-project-outcomes .outcome:nth-child(2n)::after,
  .about-project-outcomes .outcome::after {
    background: url(../images/tablet-three-gradient-dots.png) no-repeat center center;
    height: 50px;
  }

  .about-project-outcomes .outcome:nth-child(2n) {
    float: none;
  }

  .about-project-outcomes .outcome + .outcome {
    margin: 0;
  }

  .facts-about-waste-key-facts .section_image {
    float: none;
    margin: 20px 0;
  }

  .facts-about-waste-key-facts .section_image .caption {
    text-align: left;
    padding: 0;
  }

  .contact #sidebar #block-block-1 .media-p {
    float: left;
    margin-right: 20px;
  }

  /* aims page */

  .not-front.about.about-project-aims .field-name-body {
    width: 100%;
  }

  .not-front.about.about-project-aims .field-name-field-image {
    margin-left: auto;
    margin-right: auto;
  }

}

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

  .front #above_content_wrapper {
    background-size: auto 70%;
  }

  .front #above_content #slogan {
    padding-left: 171px;
    padding-top: 35px;
    width: 100%;
    margin-left: 0;
  }

  .front #above_content .section-wrapper {
    background: #fff url(../images/main-header-background-840px-v3.png) no-repeat 32px top;
    overflow: visible;
    background-size: 100% auto;
  }

  /*.front #above_content .section-wrapper .section {
    background-size: 465px auto;
    height: 530px;
    left: 0;
  }*/

  .front #block-views-news-block {
    width: 100%;
    float: none;
  }

  #block-twitter-block-1 {
    clear: both;
    width: 100%;
    padding-left: 0;
    float: none;
  }

  #block_newsletter_top,
  #block-mailchimp-signup-mc-newsletter-signup,
  #block-mailchimp-signup-mc-newsletter-signup + .block {
    margin-left: 20px;
    margin-right: 20px;
    width: calc(100% - 40px);
  }

  #block-mailchimp-signup-mc-newsletter-signup + .block .content {
    margin: 0;
    width: 100%;
  }


  #block_newsletter h2::after {
    margin: 20px auto;
    display: block;
    position: static;
  }

  #block_newsletter_top,
  #block-mailchimp-signup-mc-newsletter-signup{
    text-align: center;
  }

  #block_newsletter .content {
    padding-top: 0;
  }

  #block_newsletter h2 {
    padding-bottom: 10px;
  }

  #block_newsletter .form-actions {
    text-align: center;
  }
}

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


  #sidebar div.block {
    width: 100%;
    float: none;
    margin-right: 0;
  }

  .page-project-partners #block-views-exp-project-partners-page-1 .views-exposed-form .views-exposed-widget:not(.views-submit-button) {
    width: 100%;
    float: none;
  }

  .page-project-partners #block-views-exp-project-partners-page-1 {
    margin-top: 0;
  }

  #about_section.facts ul.menu li {
    width: 100%;
    margin-right: 0;
  }

}

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

  .view-work-packages .views-row .views-field-title h3 {
    font-size: 20px;
  }

  .page-project-partners .view-project-partners .view-content .views-row .partner-overlay .title a,
  .page-project-partners .view-project-partners .view-content .views-field-field-image a,
  .page-project-partners .view-project-partners .view-content .views-row {
    height: 280px;
  }

  .page-project-partners .view-project-partners .view-content img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
  }

  .front #above_content_wrapper {
    background-size: auto 50%;
  }

  .front #block-views-work-packages-block h2 {
    text-align: center;
  }

  .front #block-views-work-packages-block h2::after {
    margin: 20px auto;
    display: block;
    position: static;
  }

  .front #block-views-events-block .view-footer,
  .front #block-views-news-block .view-footer {
    text-align: center;
  }

  .front #block-views-news-block .view-content .views-row,
  .front #block-views-events-block .view-content .views-row {
    float: none;
    width: 100%;
    margin-left: 0;
    margin-bottom: 20px;
  }

  .front #block-views-events-block .view-footer {
    margin-top: 0;
  }

  #objectives_list .objective_item {
    width: 100%;
    margin: 40px 0;
    float: none;
  }

  .node-type-about-page.about-project-objectives .top_wrapper {
    margin-bottom: 0;
  }

  #footer #secondary-menu {
    float: none;
    margin: 20px 0;
    text-align: center;
  }

  #footer #secondary-menu li {
    line-height: 1.5;
    height: auto;
  }

  #advisory_board .views-row {
    width: calc(100% / 2);
  }

}

@media screen and (max-width: 690px) {
  .front #slogan {
    height: auto;
  }

  .front #above_content .section-wrapper {
    background: #fff url(../images/main-header-background-650px.png) no-repeat 32px top;
    overflow: visible;
    padding: 0;
    background-size: 100% auto;
  }

  .front #above_content #slogan {
    padding: 40px 90px;
    text-align: center;
  }

  .front #above_content #slogan p {
    margin-bottom: 20px;
    font-size: 26px;
  }

  .front #above_content .section-wrapper .section {
    background-position: center bottom;
    height: 530px;
    left: 0;
  }

  .front #above_content .section-wrapper .section div:last-child {
    text-align: center;
    display: block;
  }

  .front #above_content .section-wrapper .section div:last-child img {
    width: 240px;
  }
}

@media screen and (max-width: 660px) {
  .node-type-event .information > span.separator {
    display: none;
  }

  .node-type-event .information > div {
    display: block;
    margin-bottom: 10px;
  }
}

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

  .view-work-packages .views-row .views-field-field-wp-number {
    left: 0;
  }

  .node-type-facts-about-waste-page .main_image,
  .facts-about-waste-key-facts .section_image {
    width: 100%;
  }

  .view-work-packages .views-row {
    width: 100%;
    margin-left: 0px !important;
    margin-right: 0;
  }

  .not-front.work-package .view-work-packages .views-row {
    width: 100%;
  }

  #logo {
    width: 180px;
  }

  #block-views-project-partners-block .slick-track {
    padding-top: 0;
  }

  #block-views-project-partners-block .slick-active ~ .views-row:not(.slick-active) {
    position: static;
  }

  #block-views-project-partners-block .views-row {
    text-align: center;
  }

  .slick-initialized .slick-slide {
    display: table;
  }

  #twitter_follow_us {
    text-align: center;
  }

  #footer #logo_footer {
    display: block;
    text-align: center;
    margin: 0 0 20px 0;
    width: 100%;
  }


  #footer #logo_footer img {
    max-width: 60px;
    height: auto;
  }

  #footer #social {
    float: none;
    text-align: center;
    margin: 0;
  }

  #credits {
    padding: 0;
  }

  #credits > div {
    float: none;
    margin: 20px 0;
    text-align: center;
  }

  #footer .section {
    padding-bottom: 0;
  }

  .node-type-work-package .top_wrapper,
  .node-type-about-page .top_wrapper {
    background: none;
    padding-right: 0;
  }

  .node-type-about-page .work_packages:not(.slideshow) .view-work-packages .views-row {
    float: none;
    width: calc(100% - 36px);
    /*max-width: 335px;*/
    margin-bottom: 50px;
    height: auto;
  }

  .node-type-about-page .work_packages:not(.slideshow) .view-work-packages {
    background: none;
  }

  #wp_coordinator_profile .image {
    float: none;
    margin: 20px 0;
    text-align: center;
  }

  .view-funding .views-row .funder-content-wrapper .image {
    display: block;
    margin-bottom: 10px;
    width: 100%;
    text-align: center;
  }

  .view-funding .views-row .views-field-title {
    text-align: center;
  }

  .view-funding .views-row .funder-content-wrapper .description {
    padding: 0;
    text-align: center;
  }

  .view-funding .views-row .funder-content-wrapper {
    display: block;
  }

  .page-project-partners .view-project-partners .view-content .views-row {
    width: 100%;
    float: none;
  }

  .list-view .list-item {
    border: 0;
    background: #ececec;
    padding: 30px;
    height: auto;
  }

  .list-view .list-item .views-field-field-image {
    max-width: 30%;
    margin: 0 20px 0 0;
  }

  .list-view .list-item .views-field-field-image img {
    max-width: 100%;
    height: auto;
  }

  #newsletter_section .block {
    padding: 30px 10px;
  }

  .not-front #page-title {
    font-size: 35px;
  }

  .contact form .form-actions {
    text-align: center;
  }

  .not-front.about .field-name-field-image {
    margin-bottom: 30px;
    float: none;
    text-align: center;
  }

  .not-front.about.about-project-outcomes .field-name-field-image {
    position: static;
  }

  .not-front.node-type-about-page #page-title {
    text-align: center;
  }

  .not-front.about .field-name-field-image .caption {
    text-align: center;
    padding: 0;
  }

  .not-front.about .field-name-field-image,
  .not-front.about .field-name-body {
    width: 100% !important;
  }

  .not-front #main-wrapper.container {
    background: none;
    padding-left: 20px;
  }

  .glossary_buttons {
    flex-wrap: wrap;
  }

  .glossary_buttons div:last-child {
    justify-content: flex-start;
    margin-left: 12px;
    margin-bottom: 5px;
  }

  .not-front #main-wrapper.container {
    padding-top: 30px;
  }
}