// general styles
//----------------
//
// mods on fonts and typography
// not in foundation variables
// -----------------------------

h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6,
button,.button,
header nav {
  font-variant:all-small-caps;
  a {
    color: $body-font-color;
  }
}
.excerpt,.post-excerpt{
  a {
    color: $body-font-color;
    &:hover {
      p {
        color: $anchor-color;
      }
    }
  }
}

//
// main block
//--------------


main {
  article {
    @include xy-grid;
    header {
      @include xy-cell(12);
      .entry-title {
        width: 100%;
        text-align: center;
      }
    }
    section {
      padding: $global-padding $global-padding*2;
    }
    .entry-content,.omekas-entry-content {
      @include breakpoint(small){
        @include xy-cell(12);
        padding: $global-padding*2 ;
        margin:0 auto;
      }
      @include breakpoint(medium){
        @include xy-cell(12);
        padding: $global-padding*2 $global-padding*3;
        max-width: 50rem;
        margin:0 auto;
      }
      @include breakpoint(xlarge){
        @include xy-cell(12);
        max-width: 50rem;
        padding: $global-padding*2 $global-padding*3;
        font-size: $global-font-size*1.2;
        margin: 0 auto;
      }
    }
  }
}



//
//
// .contain selector for max-width
//--------------
.contain-width {
    .entry-content,.omekas-entry-content {
      @include breakpoint(small){
      }
      @include breakpoint(medium){
        max-width: 50rem;
      }
      @include breakpoint(xlarge){
        max-width: 50rem;
      }
    }
}


//
// news category
//--------------

.news,.news-category {
  @include xy-grid;
  header,main,aside {
    @include breakpoint(small){
      padding-top: 0;
      @include xy-cell(12);
      @include flex;
      @include flex-align(center,top);
      padding-top: $global-padding*3;
      h3 {
        line-height: $global-lineheight/1.5;
      }
    }
  }
  main {
    //@include xy-cell(12);
    @include xy-grid;
    article{
      text-align:center;
      @include card-container();
      @include breakpoint(small){
        @include xy-cell(12);
      }
      @include breakpoint(medium){
        @include xy-cell(6);
      }
      @include breakpoint(large){
        @include xy-cell(4);
      }
      figure {
        @include breakpoint(small){
          @include xy-cell(12);
          height: 58vw;
          max-width: 100%;
          overflow: hidden;
          background-position: center;
          background-repeat: no-repeat;
          background-size: cover;
        }
        @include breakpoint(medium){
          height: 28vw;
        }
        @include breakpoint(large){
          height: 20vw;
        }
      }
      .date {
        // height: 1rem;
        padding-top: $global-padding*2;
      }
      .entry-title {
        padding-top: $global-padding*2;
        line-height: 0.7;
        font-size: $global-font-size*1.5;
      }

    }
  }
  aside {
    @include breakpoint(small){
      padding-top:0;
      padding-bottom: $global-padding*3;
    }
    @include breakpoint(medium){
      padding-top:$global-padding*3;
      padding-bottom: 0;

    }
  }
}
// end news category


//
// collections category
//--------------

.collections-list {
  @include xy-grid;
  padding:0;
  header,main{
    @include xy-cell(12);
    @include flex;
    @include flex-align(center,top);
  }
  header {
    margin-top: 2*$global-margin;
    border-top: 1px solid $body-font-color;
    padding: $global-padding*2 0;
  }
  main {
    @include xy-grid;
    padding: 0;
    margin: 0;
    article {
      @include card-container();
        @include xy-cell();
        width: 100%;
        padding: 0;
        margin: 0;
      @include breakpoint(small){
        font-size: $global-font-size*0.7;
      }
      @include breakpoint(medium){
        font-size: $global-font-size*1;
      }
      @include breakpoint(large){
      }
      margin-bottom:0;
    }
  }
  .accordion-content {
    padding-top: 0;
    section {
      @include xy-grid;
      padding-top: 0;
      padding-bottom: 0;
      @include breakpoint(small){
        figure {
          @include xy-cell(12);
          margin-left:0;
          margin-right:0;
        }
        p {
          @include xy-cell(12);
        }
      }
      @include breakpoint(medium){
        figure {
          @include xy-cell(3);
          margin-left: 0;
        }
        p {
          @include xy-cell(9);
        }
      }
      @include breakpoint(large){
      }
    }
  }
}
// end collections category

// partners
// for big announcemnts
//---------------------

.partners {
  .entry-content {
    max-width: unset;
    p {
      padding-left: 30vw;
      padding-bottom: 2rem;
      margin-bottom: 2rem;
      &:after {
        content: '';
        display: inline-block;
        border-bottom: 1px solid $body-font-color;
        width: 100vw;
        position: absolute;
        left: 0;
        padding-top: 2rem;
      }
    }
    .alignleft {
      margin: 0;
      padding: 0;
    }
    .wp-block-image {
      margin: 0;
    }
  }
}

//
// hero
// for big announcemnts
//---------------------


.hero {
  border-top: 2px solid $primary-color;
  .slides {
    @include xy-grid();
    .slide {
      @include xy-grid;
      justify-content: center;
      @include breakpoint(small){
        width: 100vw;
        margin: 0;
        padding: $global-padding * 3;
        .textwidget {
        }
      }
      @include breakpoint(medium){
        .textwidget {
          max-width: 50rem;
          margin:auto;
          padding: $global-padding * 2;
          font-size: $global-font-size*1.3;
        }
      }
      @include breakpoint(large){
        width: 50%;
        height: calc((50vw*9)/16);
        padding: 0;
        margin: 0;
        overflow:hidden;
        a {
          @include flex;
          @include flex-align (center,middle);
        }
        img {
          //  max-width: unset !important;
          height: 100% !important;
        }
        .textwidget {
          font-size: $global-font-size*1.2;
          padding: $global-padding * 2;
        }
      }
      @include breakpoint(xlarge){
        .textwidget {
          font-size: $global-font-size*1.3;
          padding: $global-padding*3;
        }
      }
      @include breakpoint(xxlarge){
        .textwidget {
          font-size: $global-font-size*1.6;
          padding: $global-padding*3;
        }
      }
      &:first-child {
        background-color: $primary-color;
        font-variant:all-small-caps;
      }
      color: $white;

      .logo {
        @include breakpoint(medium){
          max-width: 80%;
        }
      }
    }
  }
  aside {
    @include xy-grid();
    background-color: $secondary-color;
    nav {
      @include xy-cell(auto);
      @include flex;
      @include flex-align(spaced,middle);
      min-height: 6rem;
      padding: $global-padding 0 ;
      a {
        color: $body-font-color;
      }
      .button {
        justify-content:center;
      }
    }
  }
  //hero secondary
  &.secondary {
    border-top: none;
    background-color: $secondary-color;
    .slide{
      figure {
        background-color: unset;
      }
    }
  }
  &.omeka {
    border-top: none;
    max-height: unset;
    @include breakpoint(small){
      .slides {
        background-color: $secondary-color;
        .slide {
          flex-direction: column;
          align-content: center;
          align-self: center;
          margin: $global-margin auto;
          &:first-child {
            color: unset;
            background-color: unset;
            font-variant:all-small-caps;
          }
          figure {
            margin: 0 auto;
            display:flex;
            justify-content: center;
          }
        }
      }
    }
    aside {
      background-color: $white;
      flex-direction: column;
      align-items: center;
      h2 {
        margin: $global-margin;
      }
    }
  }
  &.collections-all {

  }
  &.collection-single {
    .slides{
      background-color: unset;
      .slide {
      margin:0 auto;
      height: unset;
      width: 100vw;
      max-height: 10rem;
      @include breakpoint(large){
        height: unset;
      }
      img,.arc-page-header-img {
        background-repeat: no-repeat;
        background-size: contain;
        width: 100vw;
      }
    }
    }
    aside {
      nav {
        width: 100vw;
        border-top: $global-border-archive;
        border-bottom: $global-border-archive;
        margin: 0;
      }
    }
  }
}
//end hero

// omeka specific styles
  #user-bar {
    width: 100%;

  }
//end omeka specific styles