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

    .hero-content > div > h1 {
      font-size: 30px;
    }

    .map-regions > img:first-child,
    .map-regions > .tablet-map {
        display: none;
    }

    .map-regions > .mobile-map {
        display: block;
    }

    .map-regions > img {
        height: auto;
        object-position: unset;
    }

    .map-regions > div > a {
        margin-top: 20px;
    }

    .map-regions > div > h2 {
        margin-bottom: 15px;
    }

    .footer-middle > div {
        width: 100%;
        flex-direction: column;
        margin-top: 0;
    }

    .footer-middle img {
        width: 120px;
        height: auto;
        margin: 0 auto 20px;
    }

    .footer-middle p {
        text-align: center;
    }

    header[role="banner"] {
        height: 62px;
    }

    header #block-sitebranding img {
        height: 40px;
        display: flex;
        margin-left: 0;
    }

    #block-sitebranding {
        height: 100%;
        align-items: center;
        margin-right: 0;
    }

    .main-nav-header {
        padding-top: 10px;
        padding-bottom: 10px;
        min-height: 0;
    }

    .responsive-menu {
        padding-bottom: 0;
    }

    .top-bar {
        height: max-content;
    }

    .hero-content {
        margin-top: -135px;
    }

    /** contact mobile **/

    .contact-content {
        display: flex;
        flex-direction: column;
        margin: 35px 0 0;
    }

    #block-views-block-contact-block-1 {
        width: 100%;
    }

    #block-contactform {
        width: auto;
        margin: 0 20px;
    }

    body.contact .views-element-container {
        width: 100%;
    }

    .contact-message-contact-us-form .field--name-field-name {
        width: 100%;
    }

    .contact-message-contact-us-form .field--name-field-email {
        float: none;
        width: 100%;
        margin-top: 30px;
    }

    .contact-details {
        margin: 35px 0;
        padding: 30px 20px;
        width: 100%;
    }

    .contact-details img {
        max-width: 100%;
    }

    #block-views-block-contact-block-2 {
        width: 100%;
        padding: 0;
    }

    .follow-for-more {
        margin-bottom: 35px;
    }

    .follow-for-more h2 {
        margin-left: 20px;
    }

    .follow-for-more ul {
        margin: 0 20px;
        width: auto;
    }

    .form-item-gdpr-consent label {
        text-align: left;
    }

    .explore-map > img {
        object-position: 36%;
    }

    #map-marker-united-kingdom {
        left: 31%;
    }

    #map-marker-germany {
        left: 56%;
        top: 22%;
    }

    #map-marker-poland {
        left: 79%;
    }

    #map-marker-france {
        left: 41%;
    }

    #map-marker-portugal {
        left: 17%;
    }

    #map-marker-spain {
        left: 29%;
    }

    #map-marker-greece {
        left: auto;
        right: 10%;
    }

    .popup-country .popup-content {
        width: 90%;
        padding: 50px 30px;
    }

    .twitter-block iframe {
        width: 90% !important;
    }

    body.home .twitter-block > div:first-child {
        width: 90%;
    }

}

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

    /** general text rules **/

    h1,
    .primary-title {
        font-size: 25px;
    }

    h2,
    .title {
        font-size: 22px;
    }

    h3,
    .subtitle {
        font-size: 18px;
    }

    body:not(.home):not(.news):not(.events) .views-element-container header {
        padding: 40px 20px 50px;
    }

    #block-pilos-content .views-element-container header p {
        width: 100%;
    }

    /** about **/

    .about-static-content > div {
        flex-direction: column;
    }

    .about-static-content h2 {
        text-align: center;
        margin-top: 20px;
    }

    .about-static-content p a {
        margin-left: auto;
        margin-right: auto;
    }

    .about-static-content img {
        margin-right: 0;
    }

    /** project partners **/

    .node-header {
        padding: 40px 20px 50px;
    }

    .bef-exposed-form {
        margin: 0 20px;
    }

    #views-exposed-form-project-partners-page-1 {
        flex-direction: column;
        margin-bottom: 0;
    }

    #views-exposed-form-project-partners-page-1 .form-actions {
        position: relative;
        bottom: 0;
    }

    .fieldgroup {
        margin-bottom: 30px;
    }

    .bef-exposed-form .form-actions {
        align-self: flex-start;
    }

    body.project-partners #block-pilos-content {
        margin: 0 20px;
    }

    .project-partners .views-element-container footer {
        grid-column-end: auto;
    }

    body.project-partners .views-element-container > div {
        grid-template-columns: repeat(1, 100%);
    }

    .views-field-field-partner-logo {
        padding: 15px;
    }

    .views-field-field-partner-logo > img {
        height: auto;
        width: auto;
        max-width: 100%;
    }

    body.project-partners #block-pilos-content footer::before {
        background-size: cover;
    }

    .project-partners .views-element-container footer {
        margin: 0 0 45px;
    }

    /* .popup-content > div:last-child p:first-of-type {
        margin-top: 20px;
    } */

    .events-container, .news-container {
        margin: 0 20px;
    }

    .card,
    .search-card {
        flex-direction: column;
    }

    .card img,
    .search-card img {
        min-height: 250px;
        margin: 0 auto;
    }

    .card-text {
        margin-left: 0;
        padding: 20px;
        margin-top: 10px;
    }

    .card:first-child .card-text::after,
    .card:nth-child(2) .card-text::after,
    .card:nth-child(3) .card-text::after,
    .card:nth-child(4) .card-text::after,
    .card:nth-child(5) .card-text::after,
    .card:nth-child(6) .card-text::after {
        background-image: none;
        display: none;
    }

    #views-exposed-form-news-block-1 {
        flex-direction: column;
    }

    #views-exposed-form-news-block-1 .form-actions input {
        width: 100%;
    }

    #views-exposed-form-news-block-1 .js-form-type-select label {
        white-space: nowrap;
        margin-right: 20px;
    }

    #views-exposed-form-news-block-1::after {
        content: '';
        background-image: url('/themes/Pilos/images/straight-green-divider.jpg');
        max-width: 100%;
        height: 27px;
        width: 100vw;
        background-repeat: no-repeat;
        display: block;
        margin: 40px 0 0;
        background-size: cover;
    }

    .node-individual-body {
        margin: 35px 20px 40px;
    }

    .node-individual > img {
        width: 100%;
    }

    footer #block-sitebranding-2 img {
        max-width: 100%;
    }

    .search-results-container header h1:last-child {
        margin-left: 7px;
    }

    .card-text p:last-of-type {
        -webkit-line-clamp: 3;
    }

    .hero-content {
        background-position: 14%;
        overflow: hidden;
    }

    .hero-content-container img {
        right: -10px;
    }

    header.responsive-menu .main-menu {
        margin-left: 0;
    }

    .mailchimp-newsletter-mergefields .form-item {
        flex-direction: column;
    }

    .mailchimp-newsletter-mergefields .js-form-item:first-child label,
    .mailchimp-newsletter-mergefields .js-form-item:last-child label {
        margin-bottom: 20px;
    }

    .hero-content-container img {
        width: 500px;
    }

    #views-exposed-form-news-block-1::after,
    #views-exposed-form-events-block-1::after,
    #views-exposed-form-search-results-page-1::after {
        margin-top: 60px;
    }

    #search-page-info {
        right: 0;
        left: 20px;
        bottom: -117px;
    }

    body .views-element-container .news-container header,
    body .views-element-container .events-container header {
        margin-top: 100px;
        text-align: start;
    }

    #views-exposed-form-news-block-1,
    #views-exposed-form-events-block-1 {
        margin-top: -80px;
    }

    .search-results-container header h1:last-of-type {
        margin-left: 1px;
    }

    .twitter-block iframe {
        width: 100% !important;
        display: block !important;
        margin: 0 !important;
    }

    .twitter-block > div:first-child {
        width: auto;
    }

    .country-deets div p {
        font-size: 14px;
    }

    .country-deets div span {
        font-size: 16px;
    }

    .explore-map > img {
        object-position: 42%;
        height: 420px;
    }

    #map-marker-united-kingdom {
        left: 23%;
    }

    #map-marker-germany {
        left: 51%;
    }

    #map-marker-poland {
        top: 20%;
        left: 71%;
    }

    #map-marker-france {
        left: 31%;
    }

    #map-marker-portugal {
        left: 12%;
      }

    #map-marker-spain {
        left: 25%;
    }

    #map-marker-greece {
        right: 15%;
    }

    .node-type--wp .node-header h1 span {
        font-size: 18px;
        height: 85px;
        width: 85px;
        min-width: 85px;
        line-height: 85px;

    }
}

@media screen and (max-width: 630px) {
    #map-marker-united-kingdom {
        left: 23%;
    }

    #map-marker-germany {
        left: 51%;
    }

    #map-marker-poland {
        top: 20%;
        left: 71%;
    }

    #map-marker-france {
        left: 31%;
    }

    #map-marker-portugal {
        left: 12%;
    }

    #map-marker-spain {
        left: 25%;
    }

    #map-marker-greece {
        right: 15%;
    }

    #sliding-popup .popup-content {
      flex-direction: column;
    }

    #sliding-popup #popup-text {
      margin-bottom: 20px;
      max-width: 100%;
      text-align: center;
      line-height: 1.5em;
    }
}

@media screen and (max-width: 600px) {
    .news-card-front {
        flex-direction: column;
    }

    .twitter-block > div:first-child,
    .latest-news-block > div:first-child {
        align-items: center;
    }

    .news-card-front img:first-of-type {
        height: auto;
        width: 100%;
        max-width: 340px;
        margin: 0 auto;
    }

    .news-content {
        margin-left: 0;
        margin-top: 10px;
    }

    .explore-map > img:first-child {
        display: none;
    }

    .explore-map > .explore-map-mobile {
        display: block;
        height: auto;
    }

    #map-marker-united-kingdom {
        left: 21%;
        top: 40%;
    }

    #map-marker-germany {
        left: 53%;
        top: 49%;
    }

    #map-marker-poland {
        top: 51%;
        left: 77%;
    }

    #map-marker-france {
        left: 36%;
        top: 58%;
    }

    #map-marker-portugal {
        left: 3%;
        top: auto;
        bottom: 55px;
    }

    #map-marker-spain {
        left: 22%;
        top: auto;
        bottom: 65px;
    }

    #map-marker-greece {
        right: 9%;
        top: auto;
        bottom: 80px;
    }

    .twitter-block > div:first-child,
    .latest-news-block > div:first-child {
        flex-direction: column;
    }

    .twitter-block > div:first-child a,
    .latest-news-block > div:first-child a {
        margin-top: 20px;
    }

    .popup-content div:last-child .country-deets div p {
        font-size: 14px;
      }

}

@media  screen and (max-width: 530px) {
    .hero-content-container img {
        width: 400px;
    }

    .focus-regions img {
        margin: 0 auto 30px;
    }
}

@media  screen and (max-width: 500px) {
    .timeline-legend {
        flex-direction: column;
        text-align: start;
        justify-content: flex-start;
        right: 0;
        left: 20px;
        bottom: -90px;
    }

    .timeline-of-key-dates #block-pilos-content header > div.timeline-legend > p {
        margin-left: 0;
        margin-top: 20px;
    }

    .timeline-year-checkpoints:first-of-type {
        margin-top: 70px;
    }

    .map-regions > div {
        top: 55px;
        left: 0;
    }

    .map-regions > div > p {
        display: none;
    }

    .map-top-bar {
        flex-direction: column;
    }

    .map-top-bar p {
        margin-bottom: 10px;
    }

    #map-marker-portugal {
        left: 7px;
    }

    #map-marker-greece {
        right: 31px;
        bottom: 60px;
    }

    #map-marker-poland {
        top: 48%;
    }

    body.advisory-board .item-list ul {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }
}

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

    header.responsive-menu #block-pilos-search .sm-icons {
        display: none;
    }

    #search-block-form,
    #search-block-form > div.js-form-type-search,
    #search-block-form > div.js-form-type-search > input {
        width: 100%;
    }

    .hero-content > div > h1 {
        font-size: 24px;
    }

    .arrows-container {
        bottom: -190px;
    }

    .slick-slide img {
        max-width: 150px;
        max-height: 70px;
    }

    .card img {
        width: 100%;
        height: auto;
        min-height: auto;
    }

  #views-exposed-form-news-block-1 .form-actions {
      display: block;
      margin-left: 0;
  }

  #views-exposed-form-news-block-1 .js-form-type-select,
  #views-exposed-form-events-block-1 .js-form-type-select {
      display: flex;
      align-items: center;
      margin-bottom: 20px;
  }

  #views-exposed-form-events-block-1 .form-actions {
    margin-left: 0;
    width: 100%;
  }

  #views-exposed-form-events-block-1 .form-actions > input {
    width: 100%;
  }

  #views-exposed-form-events-block-1 .form-item:first-child label {
    white-space: nowrap;
    margin-right: 20px;
  }

  #map-marker-greece {
      right: 27px;
      bottom: 50px;
  }

  .pilot-select {
      width: 100%;
  }

  body .views-element-container .news-container header,
  body .views-element-container .events-container header {
    margin-top: 150px;
  }

  #views-exposed-form-news-block-1,
  #views-exposed-form-events-block-1 {
    margin-top: -130px;
  }

}