/* --- iOS ONLY --- */

@supports (-webkit-overflow-scrolling: touch) {

* {
  -webkit-appearance: none;
}

body {
  -webkit-overflow-scrolling: touch;
}

}


/* --- SHORT WINDOWS --- */

@media screen and (max-height: 700px) {
  .sidebar li {
    margin-bottom: .5em;
  }

  .sidebar ul {
    margin-bottom: 1em;
  }
}





/* --- ADAPT POSITIONS --- */

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

}

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

  main section {
    padding: 0 40px;
  }

  #events #top,
  #voices #top {
    min-height: 0;
  }

  #top .categories li {
    width: auto;
  }

  /* Footer */

  footer nav {
    columns: 2;
    -webkit-columns: 2;
  }

  footer #contact {
    width: 50%;
    padding-left: 50px;
  }

  footer .break {
    column-break-before: auto;
    -webkit-column-break-before: auto;
  }


  #filters .dropdown {
    display: none;
  }

}


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

  main section,
  #overlay article {
    padding: 0 40px;
    max-width: 100%;
  }

  .banner {
    padding-left: 40px;
    padding-right: 40px;
  }

  .cards,
  .resources,
  #map,
  article .wp-block-columns {
    width: 100%;
    margin-left: 0;
  }

  .cards.two,
  .cards.three,
  .cards.four {
    width: calc(100% + 30px);
    margin-left: -15px;
    margin-right: 15px;
  }

  h1 a {
    left: 90px;
  }

  #quickLinks,
  #pageNav,
  #support #top + #donate {
    right: 75px;
  }

  #top div {
    padding-left: 0;
    margin-left: 0;
    /* padding-right: calc(100vw - 1260px + 500px); */
  }

  #top div h4,
  #top div h5,
  #top div p {
    width: 100%;
    max-width: 550px;
  }

  #voices #top,
  #events #top {
    padding-left: 0;
  }

  #voices #top div {
    padding: 0 40px 0 calc(50% + 40px);
  }

  #voices #top img,
  #events #top img {
    width: calc(50% - 40px);
  }

  #events #top div {
    padding: 0 calc(50% + 40px) 0 40px;
  }


  /* Full Width Schtuff */

  article figure.full.size-full-width,
  .cards.slick,
  .blocks-gallery-grid.slick,
  main article > section > .slick,
  article figure.full:not(.size-full-width),
  article figure.size-full-width {
    width: 100vw;
    margin-left: -40px;
  }


  /* Support */

  #support #top + #donate {
    right: 40px;
  }

  #support #top div {
    width: calc(30%);
  }

  #support #top p {
    display: none;
  }

}


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


  /* --- RESIZE TYPE --- */

  body,
  #top {
  	font: 15px/1.6em 'Noto Sans', sans-serif;
  }

  #overlay h3,
  h5 {
    font-size: 24px;
    letter-spacing: -.0179em;
    line-height: 1.25em;
  }

  .stat,
  #home #top h5 {
    font-size: 36px;
    letter-spacing: -.0178em;
    line-height: 1.25em;
  }

  section:first-child h4 + p {
    font-size: 18px;
    line-height: 1.55em;
  }

  h4,
  p > a:only-child,
  .name,
  blockquote cite,
  .cta a,
  h6 strong,
  .categories li,
  #filters > li > .filter,
  #filters .filterCategory,
  .details {
    font-size: 14px;
    letter-spacing: .0428em;
  }

  .card h6,
  .resources h6,
  #mapRegions h5,
  #regionStories h5 {
    font-size: 18px;
  }

  #events #top .location {
    /* font: 700 24px/1.25em "DM Sans", sans-serif; */
  }

  .card {
    font-size: 14px;
    line-height: 1.5em;
  }

  .card .details,
  .card p a {
    font-size: 12px;
    /* line-height: 1em; */
  }

  blockquote p {
    font-size: 18px;
    letter-spacing: .0178em;
    /* line-height: 1.33em; */
  }

  /* Bottom */

  #bottom {
    min-height: 600px;
  }

  /* Map */

  #map {
    overflow: visible;
    margin-top: 50px;
  }

  #mapPoints {
    width: calc(100% - 33% + 50px);
  }

  #mapRegions {
      width: 33%;
      margin-top: 0
    }

  /* Blockquote */

  blockquote {
    width: 100%
  }

  /* Cards */

  .cards {
    margin-top: 0;
  }

  .card,
  .stats .card {
    padding: 20px 20px 40px 20px;
  }

  .stats .card {
    padding-bottom: 20px;
  }

  .card li {
    padding: 20px 20px 0 20px;
  }

  .card .socialIcons li {
    padding: 0 0;
  }

  .card img {
    margin-top: -20px;
    margin-left: -20px;
    width: calc(100% + 40px);
  }

  .card li img {
    margin-top: -40px;
    margin-left: -40px;
  }


  .cards.wide .card {
      padding-left: 20px;
  }

  .cards.wide .card img {
    display: none;
  }

  /* Resources */

  .resource {
    margin-bottom: 0;
  }

  /* Page Nav */
  #pageNav {
    display: none;
  }

  /* Slick */

  .slick-arrow {
    left: 40px;
  }

  .slick-arrow.slick-next {
    right: 40px;
  }

  /* Support */

  #support #top div {
    display: none;
  }

  #support #top + #donate {
    right: 0;
    left: 0;
    margin: 0 auto;
    width: calc(100% - 80px);
    top: 250px
  }

  #support .banner + #header + #pageNav + #top + #donate {
    top: 250px
  }


}



/* --- SMALL WINDOW WIDTHS --- */

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

  .mobile {
    display: inherit;
  }

  .desktop {
    display: none;
  }

  /* --- LAYOUT --- */

  main section {
    /* padding: 0 20px; */
  }

  header {
    margin-bottom: 0;
    padding-right: 40px;
  }

  /* Hide Stuff */

  #pageNav,
  .tint {
    display: none;
  }

  /* --- PAGE PARTS --- */

  /* Header */

  header {
    margin-top: 30px;
    min-height: 50px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  #navIcons {
    top: 10px;
  }

  h1 a {
    position: absolute;
    left: 75px;
    top: 0;
    width: 50px;
    height: 50px;
    background: transparent url(/wp-content/themes/girlup/assets/images/girlupBlack.svg) no-repeat top left;
    z-index: 200;
  }

  #quickLinks {
    text-align: right;
    right: auto;
    top: auto;
    position: relative;
    min-height: 28px;
    padding-left: 50px;
    z-index: 100;
  }

  #quickLinks ul li {
    margin-left: 10px;
    margin-bottom: 20px;
  }

  #quickLinks .cta a {
    font-size: 12px;
  }

  #navIcons a {
    background: transparent url(/wp-content/themes/girlup/assets/images/hamburgerBlack.svg) no-repeat center center;
  }

  /* Sidebar */

  .sidebar {
    width: 100vw;
    left: -100vw;
    padding: 40px 24px 24px 40px;
  }

  .sidebar ul {
    padding-top: 0;
  }

  /* Overlays */

  #overlay article {
    margin-top: 40px;
  }

  #overlay h3 {
    margin-top: 0;
  }

  #overlay #getInvolved h3 {
    margin-left: 0%;
    transform: translateX(0);
  }

  .sidebar .controlSidebar,
  #overlay .hideOverlay {
      top: 40px;
      right: 40px;
  }

  /* Top Area */

  #top,
  #voices #top,
  #events #top {
    background: #FFF !important;
    color: #4D4D4F;
    min-height: 0 !important;
    padding: 0 40px 0 40px;
    text-align: center;
    margin: 0 0;
  }

  #voices #top div,
  #voices #top h4,
  #voices #top h5,
  #events #top div,
  #events #top h4,
  #events #top h5 {
    text-align: left;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }

  #top div,
  #events #top div,
  #voices #top div {
    padding-top: 40px;
  }


  #top h4, #top h5 {
    text-align: center;
  }

  #top h4 {
    color: #DA4A9A;
  }

  #top h5 {
    color: #000;
  }

  #top img .background {
    display: none;
  }

  #top img.mobile,
  #voices #top img,
  #events #top img {
    position: relative;
    display: block;
    width: 100vw;
    height: auto;
    margin-left: -40px;
  }

  #top a {
    color: #4D4D4F;
  }

  /* Main Content */

  main.backgrounded {
    background: none !important;
  }

  main.backgrounded .background {
    display: block;
    width: 100vw;
    height: auto;
  }

  .hasIcon,
  h4.hasIcon,
  h5.hasIcon {
    padding-right: 0;
    padding-left: 0 !important;
  }

  .thumbnails li {
    width: 33%;
  }

  /* Blockquotes */


  /* --- COMPONENTS --- */

  /* Columns */
  article .wp-block-columns {
    display: block;
  }

  article .wp-block-column {
    width: 100%;
    padding: 0 0 !important;
  }

  article .wp-block-column + .wp-block-column {
    margin-top: 40px;
  }

  /* Cards */

  .cards {
    margin-top: 40px;
    margin-bottom: 0;
    display: block;
  }

  h4 + .cards,
  h5 + .cards {
    margin-top: 0;
  }

  .cards.two .card,
  .cards.three .card,
  .cards.four .card {
    margin-left: 0 !important;
    margin-top: 0  !important;
    margin-bottom: 40px;
    margin-right: 0 !important;
    width: 100%;
    padding-bottom: 20px;
  }


  /* Cards: Abbreviated */

  .related .cards .card,
  #people main .cards .card {
    box-shadow: none !important;
   border-radius: 0;
   padding: 0 0;
   margin-bottom: 20px;
   min-height: 5em;
   padding-top: 20px;
  }

  .related .cards:hover {
  }

  .more .related .card h6 {
    margin: 0 0;
  }

  .related .card img,
  .related.more .card p {
    display: none;
  }

  .related .card + .card,
  #people main .cards .card + .card  {
    border-top: 1px solid #D8D8D8;
  }

  .related .cards.default .card.clickable {
    padding-bottom: 0;
    padding-right: 80px;
  }

  .related .card .arrow {
    right: 0;
    top: 0;
    bottom: 0;
    margin-top: 0;
  }

  .related .card p:last-of-type + .button {
    margin-top: 20px;
  }


  /* Map */

  #map {
    overflow: visible;
  }

  #mapPoints {
    width: 100vw;
    margin-left: -40px;
    float: none;
  }

  #mapRegions {
    float: none;
    width: 100%;
    margin-top: 0;
  }

  /* Bottom */

  #bottom {
    min-height: 300px;
    padding-top: 0;
    padding-left: 40px;
    padding-right: 40px;
    margin-top: 100px;
  }

  #bottom div {
    margin-top: -40px;
  }

  /* Footer */

  footer {
    margin-top: 40px;
  }

  footer,
  footer #legal {
    padding: 40px 40px;
  }

  footer {
    padding-bottom: 100px;
  }

  footer #legal {
    padding: 20px 40px;
  }

  footer div,
  footer #legal ul {
    width: 100%;
    max-width: 100%;
  }

  footer nav,
  footer #contact {
    width: 100%;
    float: none;
    padding: 0 0;
  }

  footer #contact {
    margin-bottom: 40px;
  }

  /* Full Sized Content */

  article section .wp-block-quote + figure.size-full-width {
    margin-top: -15vw;
  }

  /* Slick */

  .slick-arrow {
    display: none !important;
  }


  /* --- SECTIONS AND PAGES --- */

  /* Home */

  #home #header {
    padding-bottom: 150px;
    margin-bottom: 40px;
  }

  #home h1 a {
    position: relative;
    width: 90px;
    height: 90px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: auto;
    margin: auto;
  }

  /* Community */

  #community main {
    min-height: 0;
  }

  #community main h4:first-of-type {
    margin-top: 40px;
  }

  /* People */

  #people #cards-director .card {
      display: block;
  }

  #people #cards-director img {
      width: 100%;
      padding-right: 0;
      margin: 0 0 40px 0;
      border-radius: 0;
  }

  #people #cards-director {
    margin-top: 0;
  }

  #people .card::before,
  #people .card::before,
  #people .card::before,
  #people .card::before {
    top: 25px !important;
    right: 0 !important;
    bottom: auto;
  }

  #people .card img {
    border-radius: 50%;
    width: 75px;
    height: 75px;
    margin: 0 0;
    margin-bottom: 20px;
    margin-right: 30px;
    float: left;
  }

  #people .person {
    display: block;
    height: 75px;
    display: table-cell;
    vertical-align: middle
  }

  #people main .cards .card.showModal {
    padding-bottom: 40px;
  }

  #people .card.showModal::after {
    bottom: 0;
  }


  /* Support */

  #support #top {
    /* display: none; */
  }

  #support #top div,
  #support #top p {
    display: block;
    width: 100%;
  }

  #support #top + #donate,
  #support .banner + #header + #pageNav + #top + #donate {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    margin-top: 40px;
  }

  na#support #top + #donate::before {
    font-size: 18px;
    content: "Donate to Girl Up";
    font-weight: 700;
    font-size: 48px;
    letter-spacing: -0.86px;
    text-align: center;
    line-height: 60px;
    margin: 60px auto 30px auto;
  }



}

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

  #quickLinks #ctaAct {
      display: none;
  }



}