/*//// Slider ////*/

.swiper-container {
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}


.swiper-slide {
  /* Center slide text vertically */
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  overflow-x:hidden;
}


/*//// Project Titles ////*/

.project-header-container {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  grid-column: 2 / span 9;
  grid-row: 2 / span 6;

  display: -webkit-box;

  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-pack: center;
  justify-content: center;
  line-height: 9.5vw;

  z-index: 2;
}


.header-top {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}


.header-middle {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}


.header-middle2 {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: end;
  justify-content: flex-end;
}


.header-bottom {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}


.float-right {
  float: right !important;
}


.pad-r-0 {
  padding-right: 00%;
}

.pad-r-10 {
  padding-right: 10%;
}

.pad-r-15 {
  padding-right: 15%;
}

.pad-r-20 {
  padding-right: 20%;
}

.pad-r-25 {
  padding-right: 25%;
}

.pad-r-30 {
  padding-right: 30%;
}

.pad-r-35 {
  padding-right: 35%;
}

.pad-r-40 {
  padding-right: 40%;
}

.pad-r-45 {
  padding-right: 45%;
}

.pad-r-50 {
  padding-right: 50%;
}

.pad-r-55 {
  padding-right: 55%;
}

.pad-l-10 {
  padding-left: 10%;
}

.pad-l-15 {
  padding-left: 15%;
}

.pad-l-20 {
  padding-left: 20%;
}

.pad-l-25 {
  padding-left: 25%;
}

.pad-l-30 {
  padding-left: 30%;
}

.pad-l-35 {
  padding-left: 35%;
}

.pad-l-40 {
  padding-left: 40%;
}

.pad-l-45 {
  padding-left: 45%;
}

.pad-l-50 {
  padding-left: 50%;
}

.pad-l-55 {
  padding-left: 55%;
}

.flex-left {
  align-self: flex-end;
}

.EVO {
  align-self: flex-end;
}


/*//// Project Info ////*/

.deliverables {
  grid-column: 1 / span 3;
  grid-row: 8;
  align-self: end;
}


.see-work {
  grid-column: 3;
  grid-row: 8;

  display: -webkit-box;

  display: flex;
  -webkit-box-pack: end;
  justify-content: flex-end;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;

}


.see-work-title {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  flex-direction: row;
  z-index: 999;
}


.swiper-pagination {
  position: relative;
}


/*//// Project Image ////*/

.project-image {
  grid-column: 9 / span 5;
  grid-row: 1 / span 8;
  overflow: hidden;
  justify-self: center;
}


.project-image > img {
  height: 100%;
  max-width:100%;
  overflow: hidden;
  -o-object-fit: cover;
  object-fit: cover;
}


/*//// Java Script Effects ////*/

/* ----- See Work ----- */

a.ex1 {
  color: white !important;
  -webkit-text-stroke: .8px white !important;
  -webkit-transition: all .2s ease-in;
  transition: all .2s ease-in;
}


a.ex1:hover {
  color: rgba(0, 0, 0, 0) !important;
}


.mobile-project-header-container {
  display: none;
}

#mobile-project-link {
  display: none;
}


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

  .project-image {
    grid-column: 9 / span 5;
    grid-row: 1 / span 8;
    justify-self: center;
  }

  .project-header-container {
    grid-column: 2 / span 8;
    grid-row: 2 / span 6;
    z-index: 2;
  }

  .project-image > img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    overflow: hidden;
    max-width: 100%;
  }

  .see-work {
    grid-column: 4 / span 3;
    grid-row: 8;
    color: white;
    font-weight: 300;
    font-size: calc(10px + .5vw);
    align-self: end;
  }
}

.project-image-mobile {
  display: none;
}

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

  .site-border-full {
    padding: 20px;
  }

  .site-border-full-mobile  {
    padding: 20px !important;
  }

  .project-image {
    display: none;
  }

  .project-image-mobile {
    text-align: center;
    display: block;

    position: absolute;
    width: 100%;
    height: 100%;
  }

  .project-image-mobile img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    -o-object-fit: cover;
    object-fit: cover;
  }


  .project-header-container {
    display: none;
  }

  .mobile-project-header-container {
    display: inline-block;

    grid-column: 1 / span 3;
    grid-row: 6;
    z-index: 99999999999999999999999999999999;
    align-self: end;
  }

  .deliverables, .see-work {
    display: none;
  }

  #mobile-project-link {
    display: inline-block;
    position: absolute;

    width: 100%;
    height: 100%;
    z-index: 9999;
    background-color: black !important;

    opacity: 0.25;
    -moz-opacity: 0.25; /* Firefox and Mozilla browsers */
    -webkit-opacity: 0.25; /* WebKit browser e.g. Safari */
   }


  a.fill-div {
    display: block;
    height: 100%;
    width: 100%;
    text-decoration: none;

  }

  .page-cover-counter {
    z-index: -1;
  }

}