//////////  TWEAKS   ////////////

//to display change to "block", and to hide change to "none" (without quotes)
@loaderDisplay: none;

/////////////////////////////////

//view elements when in EDIT MODE
.sqs-edit-mode{
  .sqs-block{
    opacity:1 !important;
  }
}

.index-section-wrapper{
  padding-top:40px !important;
  padding-bottom:40px !important;
}

#folderNav{
  display:none;
}
#content{
  width:100% !important;
}

//removing padding
#collection-5797c05ed2b85733fa155ecd, #collection-5772da1f725e25836e3a2c37, #collection-57767789ff7c5070b30f8ff0{
  #page{
      padding-top:35px !important;
      padding-bottom:35px !important;
  }
}
.newsletter-form-wrapper{
  padding:0 !important;
  h2{
    color:#26689C !important;
  }
  p{
    color:black !important;
  }
}
.banner-thumbnail-wrapper{
  min-height:344px !important;
  height:344px !important;
  padding:0 !important;
  position:relative;
  .desc-wrapper{
    display:flex;
    display:-webkit-flex;
    -webkit-align-items:center;
    align-items:center;
    height:325px;
    flex-direction:column;
    justify-content:center;
    p{
      margin:8px;
    }
  }
  .blog-item-wrapper{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    -webkit-transform:translate(-50%, -50%);
    -moz-transform:translate(-50%, -50%);
    -o-transform:translate(-50%, -50%);
  }
}

@keyframes fadeInScaleIn{
  from{
	opacity:0;
    transform: scale(0,0);
  }
  to{
	opacity:1;
    transform: scale(1,1);
  }
}

//loader
@keyframes swirl{
  from {
	transform:scale(0.4);
    -webkit-transform:scale(0.4);
    -moz-transform:scale(0.4);
    -o-transform:scale(0.4);
  }
  to{
    transform:rotate(2deg) scale(0.43);
    -webkit-transform:rotate(2deg) scale(0.43);
    -moz-transform:rotate(2deg) scale(0.43);
    -o-transform:rotate(2deg) scale(0.43);
  }
}
@keyframes pulseIn{
   0%        {
     fill: #b5d7f4;
   }
  100%        {
    fill: #ABCAE6;
  }
}
@keyframes pulseOut{
   0%        {
     fill: #ABCAE6;
   }
  100%        {
    fill: #b5d7f4;
  }
}
.loader{
  display:none;
}
#collection-5771c3b2f5e2314b48329ca9{
.loader{
  display:@loaderDisplay !important;
  transition:1s;
  -webkit-transition:1s;
  &.hide{
    opacity:0;
  }
  position:fixed;
  top:0;
  left:0;
  z-index:99999;
  width:100%;
  height:100vh;
  box-shadow:inset 0px 0px 500px #9ea7af;
  background:white;
  .content{
    opacity:0;
    -webkit-transition:0.6s;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -o-transform:translate(-50%,-50%);
    #companyName{      
      .title{
        font-family: "livory";
        position:absolute;
        left:23.5%;
        top:36.5%;
        font-size:3.2em;
      }
      .tagName{
        color:#AFC7DF;
        font-family: "livory";
        position:absolute;
        font-size:2.7em;
        opacity:0.7;
        left:52%;
        top:54%;
      }
    }
    #swor{
     animation: swirl 3s infinite alternate linear;
      -webkit-animation: swirl 3s infinite alternate linear;
      width:600px;
      .cls-1:nth-child(odd){
        animation: pulseOut 0.2s infinite linear alternate;
        -webkit-animation: pulseOut 0.2s infinite linear alternate;
      }
      .cls-1:nth-child(even){
        animation: pulseIn 0.2s infinite alternate;
        -webkit-animation: pulseIn 0.2s infinite alternate;
      }
    }
    .image-wrapper{
      display:none;
      width:10em;
	  img{
        width:100%;
      }
    }
  }
}
}
//sqs-block animating
@keyframes fadeUp {
  from{
     opacity:0;
     transform: translate3d(0px,10px,0);
     -webkit-transform: translate3d(0px,10px,0);
     -moz-transform: translate3d(0px,10px,0);
     -o-transform: translate3d(0px,10px,0);
  }
  to{
      opacity:1;
      transform: translate3d(0,0px,0);
      -webkit-transform: translate3d(0,0px,0);
      -moz-transform: translate3d(0,0px,0);
      -o-transform: translate3d(0,0px,0);   
  }
}

.sqs-block{
    &.sqs-widget{
      opacity:1 !important;
    }
    opacity:0;
    transform: translate3d(0px,10px,0);
    -webkit-transform: translate3d(0px,10px,0);
    -moz-transform: translate3d(0px,10px,0);
    -o-transform: translate3d(0px,10px,0);
    &.animate{
      animation: fadeUp 0.6s forwards;
      -webkit-animation: fadeUp 0.6s forwards;
      -moz-animation: fadeUp 0.6s forwards;
      -o-animation: fadeUp 0.6s forwards;
      animation-delay:0.2s;
      -webkit-animation-delay:0.2s;
      -moz-animation-delay:0.2s;
      -o-animation-delay:0.2s;
    }
}

//nav header
#header{
  border-bottom:solid 4px #990033;
  box-shadow:0px 1px 6px black; 
}

//banner thumbnail
@keyframes zoomOut {
  from{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
  }
  to{
    transform: scale(1) translateY(0);
    -webkit-transform: scale(1) translateY(0);
    -moz-transform: scale(1) translateY(0);
    -o-transform: scale(1) translateY(0);
  }
}


.sqs-gallery-container{
  .meta-description{
    &.animate{
      opacity:1;
      a{
        opacity:0;
        transform: scale(0);
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -o-transform: scale(0);      
        animation:fadeInScaleIn 0.4s  forwards cubic-bezier(0.175, 0.885, 0.32, 1.275);
        animation-delay: 1.5s;
      }
    }
  }  
}

.banner-thumbnail-wrapper{
  &.is-initialized{
    .desc-wrapper{
      visibility:visible;
      opacity:1;
    }
  }
  .desc-wrapper{
    opacity:0;
    &.animate{
      opacity:1;
      a{
        opacity:0;
        transform: scale(0);
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -o-transform: scale(0);      
        animation:fadeInScaleIn 0.4s  forwards cubic-bezier(0.175, 0.885, 0.32, 1.275);
        animation-delay: 1.5s;
      }
    }
  }
  #thumbnail{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    &.animate{
      animation: zoomOut 2.5s ease-out forwards;
      -webkit-animation: zoomOut 2.5s ease-out forwards;
      animation-delay:0.2s;
      -webkit-animation-delay:0.2s;
    }
  }
}

//video image wrapper
.media-wrapper{
  &.is-initialized{
    display:block;
  }
  display:none;
  position:relative;
  .video{
    position:absolute;
    min-height:499px;
    height:auto;
    width:100%;
  }
}

#page{
    background:none;
    box-shadow:none;
}

#products{
  .item-wrapper{
    width:50%;
  }
}


//service and product blocks

#services-1, #products{
  .item-wrapper .item{
    padding:1em;
    height:5em;
  }
  .image{
    float:left;
    width:20%;
  }
  .inner-content{
    float:left;
    width:80%;
    .title{
      display: flex;
      justify-content: center;
      flex-direction: column;
      height: 2em;
      font-size:1.2em;
    }
  }
}


//item squarespace query blocks
.item-collection{
  .mobile{
    @media screen and (max-width:1024px){
      width:100%;
    }
  }
  .item-wrapper.full.width{
    width:100%;
    .mobile
  }
  .item-wrapper.two.wide{
    width:50%;
    .mobile
  }
  .item-wrapper.three.wide{
    width:33.3%;
    .mobile
  }
  .item-wrapper.blog{
    .item{
      min-height:5em;
      @media screen and (max-width:1024px){
        min-height:7em;
      }
      .excerpt{
        padding:1em;
      }
    }
  }
  .item-wrapper.media{
    .item{
      &:hover{
        background:white;
        color:black;
        cursor:pointer;
        box-shadow:2px 5px 10px #7a7a7a; 
        &:after{
          width:100%;
          margin-left:0;
        }
      }
      &:after{
        transition:0.2s;
        position:absolute;
        bottom:0;
        left:0;
        content:"";
        border-bottom:solid 5px #990033;
        display:inline-block;
        width:0;
        margin-left:-20px;    
      }
    }
    
  }
  .item-wrapper{
    position:relative;
    float:left;
    .item{
      &:hover{
        background:#990033;
        color:white;
        cursor:pointer;
      }
      //border-bottom:solid 4px #990033;
      box-shadow:1px 1px 3px #bfbfbf;
      background:white;
      margin:2em;
      overflow:hidden;
      position:relative;
      
      .image-wrapper{
        overflow:hidden;
        height:10em;
        .image{
          padding-top:2em;
          padding-left:5em;
          padding-right:5em;
          img{
            width:100%;
          }
        }
      }
      .content{
        .title{
          padding:1em;
          text-align:center;
          font-weight:600;
        }
        .meta{
          font-size:0.7em;
          text-transform:uppercase;
          position:absolute;
          bottom:0;
          left:50%;
          transform:translateX(-50%);
          -webkit-transform:translateX(-50%);
          -moz-transform:translateX(-50%);
          -o-transform:translateX(-50%);
        }
      }
      &:hover .icon{
          transform: translate(0);
          opacity:1;
      }
      .icon{
        position:absolute;
        opacity:1;
        top:27%;
        left:0%;
        color:black;
        padding-left:1em;
        transition: 0.4s;
        transform: translate(-5em);
        p,i{
          color:white;
        }
      }
    }
  }
  .item-wrapper:nth-child(4){
    .icon{
      top:7px;
    }
  }
}