// Please do not edit this file. Edit ex_custom.less instead.

//breakpoints
@phone:  ~"screen and (min-width: @{screen-xs-min})";
@tablet:  ~"screen and (min-width: @{screen-sm-min})";
@desktop:  ~"screen and (min-width: @{screen-md-min})";
@wide:    ~"screen and (min-width: @{screen-lg-min})";
// when mobile isn't first
@maxphone: ~"screen and (max-width: @{screen-xs-min})";
@maxtab: ~"screen and (max-width: @{screen-sm-min})";

//animations
.transition-slow {
  transition: 1s ease;
}
.transition-medium {
  transition: .5s ease;
}
.transition-fast {
  transition: .2s ease;
}

//typography
@import (css) url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700|Rubik:700&display=swap');

@font-family-display:     "Rubik", 'Helvetica', Arial, sans-serif;
@font-family-sans-serif: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-family-serif:       Georgia, "Times New Roman", Times, serif;

.header_text {
  font-family: @font-family-display;
  font-weight: 700;
  letter-spacing: 0.015em;
}

.display {
  font-family: @font-family-display;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
}

h1, h2, h3, h4, h5, .site-info__title, .main-container .page-header {
  .header_text;
}

.font(@type) when (@type = credits) {
	font-size: 1.0rem;
	font-weight: 400;
}
.font(@type) when (@type = caption) {
	font-size: 1.2rem;
	font-weight: 400;
}
.font(@type) when (@type = small) {
	font-size: 1.3rem;
	font-weight: 400;
}
.font(@type) when (@type = blockTitle) {
	.display;
	font-size: 1.2rem;
}
.font(@type) when (@type = default) {
	font-size: 1.5rem;
	font-weight: 400;
}
.font(@type) when (@type = medium) {
	font-size: 1.6rem;
	font-weight: 700;
}
.font(@type) when (@type = body) {
	font-size: 1.6rem;
	font-weight: 400;
}
.font(@type) when (@type = featureBody) {
	font-size: 1.8rem;
	font-weight: 400;
}
.font(@type) when (@type = sidebarh3) {
	font-size: 1.9rem;
	font-weight: 700;
}
.font(@type) when (@type = contenth3) {
	font-size: 2.0rem;
	font-weight: 700;
}
.font(@type) when (@type = contentHeading) {
	font-size: 2.3rem;
	line-height: 1;
	font-weight: 700;
}
.font(@type) when (@type = contenth2) {
	font-size: 2.4rem;
	font-weight: 700;
}
.font(@type) when (@type = pageTitle) {
	font-size: 4.0rem;
	font-weight: 700;
	line-height: 1;
}
.font(@type) when (@type = siteLogo) {
	font-size: 3rem;
	font-weight: 300;
}
.font(@type) when (@type = slideTitle) {
	font-size: 4.5rem;
	font-weight: 700;
}



// updated color variables 

// fallback for bootstrap parent theme colors
@brand-primary:       #003594; // 2019 Pitt royal blue
@brand-primarylight:  #273A68; // Pitt blue light
@brand-success:       #ffb81c; // 2019 Pitt spirit gold
@brand-info:          #3366ff; // 2019 bright blue
@brand-warning:       #b2ccfc; // Light blue
@brand-danger:        #f60; // orange
@brand-light:         #2653a4; // 2019 light blue
@gray-darker:         #2b2b2b; // 2019 'antracite'
@gray-dark:           @gray-darker;
@gray:                #d6d6d6; // 2019 light grey
@gray-light:          #f2f2f2; //2019
@gray-lighter:        #eaeaea; //2019


@blue-trans: rgba(0, 53, 148, 0.8); // 2019 pitt blue at 80%
@gray-trans: rgba(51, 51, 51, .9);
@white-trans: rgba(255, 255, 255, 0.3);

@pitt-navy:   #1C2957; //old pitt blue 
@pitt-blue: 			               @brand-primary;
@pitt-blue-dark:                #141B4D; // 2019 dark blue
@pitt-gold: 			               @brand-success;
@pitt-gold-dark:            #B58500; // 2019 dark gold
@pitt-tan: 				               #f5f1e5; // 2019 Pitt tan
@pitt-beige:                  @pitt-tan; //no more duplicates
@bright-blue: 			           @brand-info;
@bright-blue-alt:           #245BFF; //accessible links on sidebar
@blue-gray: 			              #4d72b4; //2019 
@light-blue:                  #b2ccfc;
@yellow-hover:             lighten(yellow, 15%);
@light-yellow:               #ffff99;
@uber-light-yellow:      #ffffd8;
@orange:                      @brand-danger;
@blue-trans-dark:   rgba(0, 53, 148, 0.95); //pitt blue at 75%
@gray-trans-light:   rgba(198, 201, 213, .75);
@gray-trans-dark:   rgba(0,0,0,.65);
@tan-trans:             rgba(248, 244,235, .75);

.blue-fade {
  background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, @blue-trans 75%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,@blue-trans 75%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,@blue-trans 75%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='@pitt-blue-dark',GradientType=0 ); /* IE6-9 */
}
.gray-fade {
  background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, @gray-trans-dark 75%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,@gray-trans-dark 75%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,@gray-trans-dark 75%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='@gray-trans-dark',GradientType=0 ); /* IE6-9 */
}


// elements //
body {
  color: @gray-dark;
}
a:hover, a:focus {
  color: @bright-blue;

}

// header //
.header_wrapper {
  background: url(../img/bg_header.png) no-repeat center center @pitt-blue;
  background-size: cover;
  #pittbar, #site-info, #primary-links {
    background: none;
  }
}
#pittbar .pitt-logo a, .pitt-logo a {
  background-image: url("../img/pitt_seal_2019.png");
  background-image: url("../img/pitt_logo_2019.png");
}
.site-info {
  padding-top: 20px;
  padding-bottom: 25px;
}
// v3
#site-info {
    position: relative;
  .navbar-header {
    position: absolute;
    top: 2px;
    left: 0;
  }
}
#pittbar {
  border-bottom-color: @white-trans;
  padding: 10px 0;
  .pittbar__logo, .pitt-logo {
    margin-left: -5px;
    @media @maxphone {
      margin: 0;
    }
  }
  .pittbar__links {
    font-family: @font-family-sans-serif;
    font-weight: 600;
    letter-spacing: 0.05em;
    li {
      border-right-color: @white-trans;
      a {
        &:focus {
          text-decoration: underline;
        }
      }
    }
  }
}
// v3 
.secondary-links ul.menu li {
  border-right-color: @white-trans;
}

.region-logo {
  padding: 0 0 7px 40px;
  .site_logo {
    .header_text; 
  }
  .view-title-block {
    line-height: 1.2;
  }
}
.site-info__navbar-toggle {
  width: 100%;
  .navbar-toggle {
    position: absolute;
    top: -4px;
    left: 0;
  }
}
.view-display-id-header_social_block {
  @media @maxphone {
    display: none;
  }  
}
.navbar-header .navbar-toggle .icon-bar {
  background-color: @pitt-gold;
}

// main nav //
#primary-links {
  @media @maxtab {
    //negates "short" menu stying
    width: auto !important;
    float: none !important;
  }
  .navbar-collapse {
  box-shadow: none;
  .region-navigation {
    .block-menu-block {
      margin-bottom: -1px;
      font-family: @font-family-sans-serif;
      ul.menu  {
        li  {
          font-weight: 600;
          position: relative;
          &:after {
            content: " ";
            background: @white-trans;
            position: absolute;
            right: -1px;
            top: 12px;
            width: 1px;
            height: 20px;
            display: block;
            z-index: 0;
            @media @maxtab {
              top: 6px;
              height: 16px;
            }
          }
          &:last-child:after {
            display: none;
          }
          &:hover:after {
            display: none;
          }
          a {
            font-size: 1.0rem;
            padding: 8px 11px;
            letter-spacing: 0.05em;
            background: none;
            @media @desktop {
              font-size: 1.3rem;
              padding: 15px 20px;
            }
            &:hover, &:focus {
              background: @bright-blue;
              border-right: none;
            }
          }
          &.active-trail {
            &:after {
              display: none;
              }
              a {
                color: @pitt-blue;
                font-weight: 600;
                background: @pitt-gold;
                border-right: none;
            }
                li a {
                  background: none;
                }
          }
          ul.menu {
            li {
              letter-spacing: normal;
            }
          }
          &.expanded, &.expanded:not(.active-trail) {
            ul.menu {
              background: @gray-lighter;
              margin-top: -1px;
              li a {
                //color: #fff;
                &:hover {
                  color: @pitt-blue;
                }
              }
            }
          } 
        }
      }
    }
    // version 3 templates
    .menu-block-1 {
      ul.menu  {
        @media @desktop {
          margin-left: -15px;
        }
        @media @wide {
          margin-left: -20px;
        }
        li {
          a {
            @media @wide {  
              padding: 15px 20px;
            }
            &:after {
              height: 26px;
            }
          }
          ul.menu {
            li {
              a {
                
              }
            }
          }
        }
      }
    }
  }
}
}
// sidebar //
.region-sidebar-second {
  .block-menu-block, #block-menu-block-2 {
    .block-title {
      font-weight: 700;
      font-size: 1.6rem;
      padding-left: 25px;
      @media @desktop {
        padding-top: 38px;
      }
    }
    ul.menu li {
      a {
        @media @desktop {
          padding-left: 25px;
        }
        &:hover, &:focus {
          background: @bright-blue;
        }
        &.active-trail {
          background: none;
        }
        &.active.active {
            color: @pitt-blue;
            background: @pitt-gold;
            font-weight: 600;
        }
      }
      ul.menu {
        @media @desktop {
          padding-bottom: 8px;
        }
        li a:before {
          content: "\2013 ";
          margin-right: 4px;
        }
      }
    }
  }
  .nodesinblock__title {
    .font(sidebarh3);
  }
  .nodesinblock--with-text .nodesinblock__column {
    color: #212121;
    background: @gray-light;
    @media @desktop {
      padding: 30px 25px 30px;
    }
    a {
      color: @bright-blue-alt;
      &:hover {
        color: @pitt-blue;
      }
    }    
    .nodesinblock__image-wrapper {
      @media @desktop {
        margin: -30px -25px 23px;
      }
    }
  }
  .nodesinblock--image-only {
    .nodesinblock__link:hover .nodesinblock__title{
      .transition-fast;
      padding-right: 0;
      &:after {
      .transition-fast;
        margin-left: 8px;
      }
    }
    .nodesinblock__title {
      .font(blockTitle);  
      &--absolute  {
        @media @desktop {
          padding: 10px 25px;
        }
      }
      &:after {
        color: @light-yellow;
        font-size: 1.0rem;
        font-weight: 700;
        display: inline-block;
      }
    }
    p, li {
      .font(small);
    }
  }
}
// home page //
.front {
  .main-container {
    background: @gray-lighter;
  }
}
// features and sliders 
#block-views-feature-image-story-block-1 .view .flexslider img {
//  width: 100%;
}
.block__feature-image--long-text .feature__title {
  .font(contenth2);
  text-transform: none;
  letter-spacing: normal;
}
.block__feature-image--default .flex-control-nav li a {
  background: @pitt-gold;
}
#block-views-feature-image-story-block-1 .flexslider .feature-info {
  @media @tablet {
    background: @gray-trans;
  }
  a {
    color: @pitt-gold;
  }
}
.feature-text--large {
  background: @gray-lighter;
  .feature-text__heading {
    font-size: 3.5rem;
    font-weight: 700;
  }
}
.block__feature-image--centered-text .feature__title {
  font-weight: 700;
}
.feature__button--gold {
  background: @bright-blue  ;

}
.node-home-display-text .field-body p {
  font-size: 2.3rem;
  font-weight: 400;
}
.view-icon-set .view-content .views-row {
  font-size: 2.3rem;
  font-weight: normal;
}

.block__slider--grid {
  .grid-block__wrapper  {
    background: @gray-light;
    h3 {
      font-size: 1.6rem; 
      a {}
    }
    a {
      color: @bright-blue;
      &:hover h3:after {
        font-size: 1.4rem;
        color: @pitt-blue;
      }
    }
    p {
      @media @desktop {
        .font(default);
      }
      a {
        color: @bright-blue;
      }
    }
  }
}
.block__slider--three-item .flexslider {
  .views-field {
    background: @gray-light;
    .views-field-field-slider-item-image:hover a h3::after {
      font-size: 1.4rem;
    }
    h3 {
      font-size: 1.6rem; 
      
    }
    p {
      @media @desktop {
        .font(default);
      }    
      a {
        color: @bright-blue;
      }
    }
  }
  .views-field-field-slider-item-image:hover a h3::after {
    font-size: 1.4rem;
  }
}
// v3 templates
#block-views-slider-block-2 .views-field-nothing .grid-block p {
  .font(default);
}
#block-views-feature-image-story-block-2 .feature-title h3,
#block-views-slider-block, 
#block-views-slider-block-1, 
#block-views-slider-block-2, {
  .block-title {
     font-size: 1.4rem;
  }
}
#block-views-slider-block-2 .views-field-nothing .grid-block--inner h3 {
  a {
    font-size: 1.8rem;
    &:after {
      .transition-fast;
      display: inline-block;
      font-size: 1.5rem;
      font-weight: 900;
    }
    &:hover {
      text-decoration: none;
      &:after{
        .transition-fast;
        margin-left: 8px;
      }
    }
  }
}

// news 
.news-events {
  .block-title {
    .font(contenth2);
  }
  .news-block__title a {
    //color: @gray-dark;
    &:hover {
      color: @bright-blue-alt;
    }
  }
  .view-footer a.more-link {
    color: @bright-blue;
    font-weight: 700;
    letter-spacing: 0.075em;
  }
}
// events embed
.embed-default {
  #event-list {
    a.event-name { 
      font-family: @font-family-sans-serif;
      color: @gray-dark;
      &:hover {
        color: @bright-blue;
      }
    }
    .event-date {
      background: @pitt-blue;
        font-family: @font-family-sans-serif;
      .month {
        font-size: 1.0rem;
      }
      .date {
        font-size: 2.2rem;
        font-weight: bold;
      }
    }
  }
}
.view-home-page-news-and-events .views-field .field-content .more-link {
  color: @bright-blue;
  font-weight: 700;
  letter-spacing: 0.075em;
}
// stats
.node-statistics .field-statistics {
  .field-stat-number {
    .header_text;
    color: @pitt-blue;
  }
  .field-stat-description {
    font-weight: normal;
    font-size: 2.3rem;
  }
  &:hover .field-stat-number{
    color: @pitt-blue;
  }
}

// interior pages //
.region-content {
  h3{ 
    font-size: 1.8rem;
  }
  h4 {
    font-size: 1.4rem;
  }
}
// general
table {
  color: @gray-dark;
  tbody tr th, th {
    .font(small);
    background: @gray;
    font-weight: bold;
  }
  tbody tr {
    background: @gray-light;
    &:nth-child(2n+1) {
      background: @gray-lighter;
    }
    &:nth-child(even) {
      background: @gray-light;

    }
  }
}
blockquote {
  max-width: none;
  padding: 11px 0;
  &:before {
    font-family: @font-family-display;
    font-weight: bold;
    color: @gray-lighter;
    font-size: 15.0rem;
    margin-top: -58px;
    height: 59px;
    width: 80px;
    margin-left: -40px;
  }
  &:after {
    color: @gray-dark;
  }
}
.view-social-media-icons .views-row {
  @media @desktop {
    margin-left: 8px;
  }
}
.btn, .feature__button {
  font-weight: 600;
}
// landing pages 
.view-landing-page-breakouts {
  h2.field-section-title {
    font-size: 1.8rem;
    font-weight: 700;
  }
  a h2 {
    color: @gray-dark;
    &:after {
      .transition-fast;
      content: "\f101";
      font-family: "Font Awesome 5 Pro";
      font-size: 1.5rem;
      color: #ff6600;
      font-weight: bold;
      display: inline-block;
      margin-left: 5px;
    }
    &:hover:after {
      .transition-fast;
      margin-left: 8px;    
      font-size: 1.5rem;  
    }
  }
  // version 3 templates
  h3.field-section-title {
      font-size: 1.8rem;
  }
  a h3.field-section-title {
    color: @gray-darker;
    &:after {
      content: "\f101";
      font-family: "Font Awesome 5 Pro";
      font-size: 1.5rem;
      display: inline-block;
      color: #ff6600;
      font-weight: bold;
      margin-left: 5px;
    } 
    &:hover:after {
      margin-left: 8px;
    }
  }
  .views-field {
    &-field-section {
      &-image {
        &:hover {
          + .views-field-nothing {
            a {
              .field-section-title {
                .transition-fast;
                &:after {
                  .transition-fast;
                  font-size: 1.5rem;
                  margin-left: 8px;
                }
              }
            }
          }
        }
      }
    }
  }
//
}

// news 
.view-display-id-page {
  .views-row {
    margin-bottom: 25px;
    @media @wide {
      margin-bottom: 35px;
    }
    .views-field-created {
      .font(blockTitle);
      margin-bottom: 7px;
    }
    a.article__title {
      .font(body);
      color: @bright-blue;
      &:hover {
        color: @pitt-blue;
      }
    }
  }
}
.pagination {
  text-align: left;
  > li {
    > a, > span {
      font-weight: bold;
      color: #fff;
      border-radius: 0 !important;
      border: none;
      background: @bright-blue;
      margin-right: 5px;
    }
    > a:hover, a:focus {
      color: #fff;
      background: @bright-blue-alt;
    }
     &.active > span {
      color: @pitt-blue;
      background: @pitt-gold;
    }
  }
}
// links grid 
.links-grid {
  &__title {
    font-family: @font-family-display;
    font-weight: 700 !important;
		&:before {
			content: "";
			background: @pitt-gold;
			height: 1px;
			width: 50%;
			display: block;
			top: 0;
			position: absolute;
			z-index: 2;
			left: 23px;
			.transition-fast;
		}
  }
  &--style-a {
    .links-grid {
      &__title {
        font-size: 1.4rem;
      }
      &__column .links-grid__title:after {
        font-size: 1.2rem;
      }
    }
  }
  &--style-b {
   .links-grid {
      &__image a::after {
        background: @blue-trans;
      }
      &__column:hover .links-grid__image a:after {
       background: @blue-trans-dark;
      }
      &__title {
        font-size: 1.4rem;
      }
    }
  }
  &--style-c {
    .links-grid {
      &__title {
        font-size: 1.6rem;
        padding-top: 8px;
      }
      &__image a:after {
        .gray-fade;
      }
      &__column:hover img {
        transform: scale(1.07, 1.07);
      }
    }
  }
  &--style-d {
    .links-grid {
      &__title {
        font-size: 1.6rem;
      }
      &__image a:after {
        .gray-fade;
      }
      &__column:hover .links-grid__title:after {
        font-size: 1.0rem;
      }
      &__column:hover img {
        transform: scale(1.07, 1.07);
      }      
    }
  }
}

// people grid
.view-people {
  .group h3 {
  }
  .view-people__filter {
    margin-bottom: 0;
  }
  &--staff-chair.list, 
  
  .attachment-before {
    .views-field-title,
    .view-people__title {
      .font(featureBody);
      .header_text;
      margin-bottom: .25em;
      a {
        color: @gray-dark;
        &:after {
          font-size: 75%;
          font-weight: normal;
          content: "\f101";
          font-family: "Font Awesome 5 Pro";
          margin-left: 5px;
          color: @orange;
          transition: .2s ease;
        }
        &:hover:after {
          margin-left: 7px;
        }
      }
    }
  }
  a .views-field-title {
    color: @gray-dark;
    .view-people__title {
      font-size: 1.5rem;
    }
    &:hover {
      color: @bright-blue;
    }
  }
}
// person detail  page 
.person-contact, .person-awards {
  color: @gray-dark;
  background: @pitt-tan;
  h2 {
    font-size: 18px;
    }
  
  .views-row, .group {  
    a {
      color: @bright-blue;
    }
  }
}

// footer
.footer {
  background: @gray-dark;
  .site_title h3 {
    .header_text;
    margin-left: 35px;
  }
  #block-views-title-block-footer-title-block {
    padding-left: 35px; 
    @media @desktop {
      padding-left: 45px;
      }
  }
  .region-footer {

    .block__social-media {
      @media @tablet {
        width: 100%;
      }
      @media @desktop {
        width: 20%;
      }
      .view-social-media-icons {
        @media @tablet {
          float: left; 
          margin-left: 51px;
        }
        @media @desktop {
          float: right;
          margin-left: 0;
        }
      }
    }
  }
  .field-contact-info a {
    font-weight: normal;
  }
  a {
    color: @pitt-gold;
    &:hover {
      color: @pitt-gold;
    }
    &:focus {
      text-decoration: underline;
    }
  }
  #copyright {
    padding-left: 67px;
  }
  
}

