 /* GRR */
 #grr {
    position: fixed;
    display: flex;
    top: 100vh;
    opacity: 0;
    left: 0;
    z-index: 99999999999;
    width: 100%;
    -webkit-animation-duration: 5s;
    animation-duration: 5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    align-content: flex-end;
    justify-content: center;
}

#grr-tounge a, #grr-tounge a:visited, #grr-tounge a:focus, #grr-tounge a:hover{
    color:#fff !important;
    text-decoration: underline !important;
}

#grr-tounge {
  background-color:#00d97e;
    border: 1px solid rgba(0,0,0,.1);
    color: #fff;
    display: inline;
    padding: 1rem 1.5rem;
    /* overflow: hidden; */
    /* border-radius: .375rem; */
    box-shadow: 0 .25rem .75rem rgba(0,0,0,.1);
    font-size:1.1rem;
    max-width: calc(100% - 22px);
}

.grr-action {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
}

.grr-action-in-hold{
    -webkit-animation-name: fadeInHold !important;
    animation-name: fadeInHold !important;
}
.grr-action-out-hold{
    -webkit-animation-name: fadeOutHold !important;
    animation-name: fadeOutHold !important;
}

.grr-error {
    color: #fff !important;
    background: #e63757 !important;
    
}
.grr-danger-stay{
    padding-left: calc(1rem - 12px) !important;
    cursor: pointer;
}

.grr-error .close-icon{
    position: relative;
    left: calc(100% + 10px);
    top: calc(0% - 26px);
    background: inherit;
    border-radius: 50%;
    padding: 1px;
}

.grr-warning {
    color: #12263f !important;
    background: #f6c343 !important;
}


@keyframes fadeInHold {
    0% {
        opacity: 0;
        top: calc(100vh);
    }

    5% {
        opacity: 1;
        top: calc(100vh - 100px);
    }

    100% {
        opacity: 1;
        top: calc(100vh - 100px);
    }
}

@keyframes fadeOutHold {
    0% {
        opacity: 1;
        top: calc(100vh - 100px);
    }

    5% {
        opacity: 1;
        top: 100vh;
    }

    100% {
        opacity: 0;
        top: 100vh;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 0;
        top: calc(100vh);
    }

    5% {
        opacity: 1;
        top: calc(100vh - 100px);
    }

    94% {
        opacity: 1;
        top: calc(100vh - 100px);
    }

    99% {
        opacity: 1;
        top: 100vh;
    }

    100% {
        opacity: 0;
        top: 100vh;
    }
}
.loader svg path,
.loader svg rect{
  fill: #36b0cd;
  }
  .loader {
      position: fixed;
      z-index: 99999;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(255,255,255,0.8);
      transition: opacity 0.3s ease-in-out;
  }
  .loader.loader-hide {
    display: none;
  }
  #loadedAmount{
    transition: opacity 0.1s ease-in-out;
  }
  #loadedAmount.loadedAmount-hide{
      opacity:0;
  }
  @-webkit-keyframes rotating /* Safari and Chrome */ {
    from {
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  @keyframes rotating {
    from {
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -ms-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  
  .loader-show{
      opacity: 1;
      
  }
  .loader-show.full-screen {
      pointer-events: all;
      background: rgba(0,0,0,.5);
  }
  .loader-show svg{
    -webkit-animation: rotating 0.75s linear infinite;
    -moz-animation: rotating 0.75s linear infinite;
    -ms-animation: rotating 0.75s linear infinite;
    -o-animation: rotating 0.75s linear infinite;
    animation: rotating 0.75s linear infinite;
  }
  .loader-hide svg{
    opacity: 0;
  }
  .loader-hide svg{
      -webkit-animation: rotating 0.75s linear;
        -moz-animation: rotating 0.75s linear;
        -ms-animation: rotating 0.75s linear ;
        -o-animation: rotating 0.75s linear;
        animation: rotating 0.75s linear;
  }

  table [data-order_by]::after {
      content: url("data:image/svg+xml;utf8,<svg width='6' height='10' viewBox='0 0 6 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M3 0L6 4H0L3 0ZM3 10L0 6H6L3 10Z' fill='%2395AAC9'/></svg>");
      margin-left: .25rem;
  }
  table [data-order_by].sorting-asc::after {
      content: url("data:image/svg+xml;utf8,<svg width='6' height='10' viewBox='0 0 6 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M3  10L0 6H6L3 10Z' fill='%232c7be5'/></svg>");
      margin-left: .25rem;
  }
  table [data-order_by].sorting-desc::after {
      content: url("data:image/svg+xml;utf8,<svg width='6' height='10' viewBox='0 0 6 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M3 0L6 4H0L3 0ZM3 ' fill='%232c7be5'/></svg>");
      margin-left: .25rem;
  }
  a.sorting-desc, a.sorting-asc{
      color:#36b0cd !important;
      border-bottom: 2px solid #36b0cd
  }
  table.middle-align-cell td{
      vertical-align: middle;
  }

  /* Custom Form CSS */
  .custom-control-label-lg::after, .custom-control-label-lg::before {
      position: absolute;
      top: 0;
      left: -1.5rem;
      display: block;
      width: 1.5rem;
      height: 1.5rem;
      content: "";
  }
  .custom-control-label-lg{
      padding-left:10px;
  }
  .header-pretitle.breadcrumb .breadcrumb-item a, .header-pretitle.breadcrumb .breadcrumb-item{
      font-size: .625rem !important;
      text-transform: uppercase !important;
      letter-spacing: .08em !important;
      color:#95aac9 !important;
      font-weight: bold;
  }
  .title-truncate {
      width: 180px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      display:inline-block;
  }

  .description-pre{
    font-family:inherit;font-size:inherit;padding:0;
    white-space: pre-wrap;       /* css-3 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
  }

  .card:hover>.card-bg>.card-bg-img {
    -webkit-transform:translateX(0rem);
    transform:translateX(0rem)
   }

   .shadow{
    box-shadow: 0 .35rem 0.5rem rgba(17,17,17,.1) !important; 
   }

   a.heart-card{
    /* content:url("./quiltster-assets/img/heart-outline.svg"); */
    padding:2px 4px 0px 4px;
    background:rgba(255,255,255,0.75);
  }
  
  a.heart-card #heart-outline{
    fill:rgba(0,0,0,0.25);
    stroke:none;
  }
  
  a.heart-card:hover #heart-outline{
    fill:#fff;
    stroke: none;
  }
  a.heart-card:hover{
    /* // content:url("./quiltster-assets/img/heart-fill.svg"); */
    background: rgba(0,0,0,1) !important;
    color:#fff !important;
  
  }
  a.heart-card.active #heart-outline{
    fill:#ff6f61;
    stroke:none;
    }

  [hidden] {
    display: none !important;
  }

  .opacity-0{
    opacity: 0;   
  }

  .dropdown-item + .dropdown-item{
      border-top: none;
  }
  
  button[aria-expanded="true"]{
    color:#36b0cd !important;
  }

  .customize-button{
      cursor: pointer;
  }

  .back{
    position: absolute;
    top: 1.5rem;
    left: 1.5rem;
    z-index: 1030;
    display: -webkit-inline-box;
    display: inline-flex;
    float: right;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1;
    color:#a6a6a6;
    text-shadow: none;
    opacity: .5;
    padding: 0;
    background-color:
    transparent;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }


  /* Position child elements relative to this element */
.aspect-ratio-box {
    position: relative;
    height:auto;
}

/* Create a pseudo element that uses padding-bottom to take up space */
.aspect-ratio-box::after {
    display: block;
    content: '';
    /* 16:9 aspect ratio */
    padding-bottom: 125.78%;
}

/* Image is positioned absolutely relative to the parent element */
.aspect-ratio-box img {
    /* Image should match parent box size */
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit:contain;
}

@media (min-width:992px) {
    .bg-md-transparent{
        background-color: transparent !important;
    }
}
.list-styled-link.active{
    font-weight:bold;
}

/* Clear default safari search bar styling */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance:none;
}

.add-to-cart-alert-container.opacity-0{
    pointer-events: none;
}

@media (max-width:991px) {
    .md-justify-content-space-between{
        justify-content: space-between;
    }
}

/* Disabled animation for megamenu */
.navbar-nav .hovered > .dropdown-menu {
    -webkit-transition: none;
    transition: none;
    transition-property: none;
}

.h-100-force{
    min-height: 100vh !important;
    height: 100vh !important;
}

.custom-control-switch-top-fix.custom-switch .custom-control-label::after{
    top: .27rem;
}

@media (min-width:768px) {
    .filter-bar {
        background:transparent !important;
    }
}

.filter-bar, .filter-bar form {
    width: 100%;
}

.inlineLoginLink {
    display: block;
    clear: both;
}

@media (min-width:580px) {
    .inlineLoginLink {
        display: inline;
        clear: none;
        position: relative;
        top: 12px;
        margin-left: 1em;
    }
}

.video-responsive {
    aspect-ratio: 16 / 9;
    width: 100%;
}


#add-to-cart-completion-preview, #quilt-details-completion-preview { margin-top: 1em; position: relative; }
#add-to-cart-completion-preview, #quilt-details-completion-preview { display: inline-block; vertical-align: middle;  *zoom: 1; *display: inline; margin: 0 -.25em 0 0; width: 100%; }
#add-to-cart-completion-preview svg, #quilt-details-completion-preview svg { height: auto; width: 100%; z-index: 5; }
#add-to-cart-completion-preview .backbar, #quilt-details-completion-preview .backbar { transition: stroke-dashoffset 1s linear; stroke: #666; stroke-dashoffset: 0; stroke-width: 1em; }
#quilt-details-fill-bar, #add-to-cart-fill-bar { stroke: #9EC600; transform: rotate(270deg) translateX(-100%); stroke-width:1em;}

.bg-green{
    background:#9EC600 !important;
}
.text-green{
    color:#9EC600 !important;
}
.text-pink{
    color:#ff1f64;
}

.left.no-purchase.custom-checkbox .custom-control-label::before, .left.no-purchase.custom-checkbox .custom-control-label::after{
    display: none;
    pointer-events:none;
}

.hide-checkbox.custom-checkbox .custom-control-label{
    padding-left:0;
}

.hide-checkbox.custom-checkbox .custom-control-label::before, .hide-checkbox.custom-checkbox .custom-control-label::after{
    display: none;
}

#layout_holder{
    display: none;
    pointer-events: none;
}

.inv-icon {
    height: 30px;
    transform: translateY(-4px);
    width: 30px;
}

.fabrics-in-block-block-sizing{
    -webkit-box-flex: 0;
    flex: 0 0 20%;
    max-width: 20%;
}
@media (min-width:768px) {
    .fabrics-in-block-block-sizing{
        -webkit-box-flex: 0;
        flex: 0 0 16.66%;
        max-width: 16.66%;
    }
}
@media (min-width:992px) {
    .fabrics-in-block-block-sizing{
        -webkit-box-flex: 0;
        flex: 0 0 12.5%;
        max-width: 12.5%;
    }   
}

.copy-share-link-message{
    text-transform: uppercase;
    font-size: 10px;
}

.content-template-hidden{
    opacity:0;
    pointer-events: none;
}
.content-template-hidden .action-item{
    background:transparent;
}

#page_container{
    transition: background 0.5s ease-in-out;
}

.item-list.list-group > .list-group-item:last-of-type{
    border:none;
    padding-bottom: 0;
}

.text-white .text-muted{
    color:#fff !important;
    opacity:0.8 !important;
}

.yardageChartCartFilters {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.filter-button {
    width: 49%;
    transition: all .3s ease;
    margin-bottom: 5px;
}

.filter-button[data-type="requirement"] {
    margin-bottom: 0;
    width: 100%;
}

.filter-button:not(.inactive) {
    border-color: #36b0cd;
    pointer-events: all!important;
}

.filter-button.inactive {
    border-color: grey;
    opacity: .5;
}

.filter-button:not(.inactive):hover {
    background-color: rgba(54,176,205,.5);
}

.filter-button.active {
    background-color: #36b0cd;
}

.filter-button svg {
    pointer-events: none;
}

/* In Quilt Planner Yardage Chart and Print View */
.fabric-title{
    -ms-word-break: break-all;
        word-break: break-all;

        /* Non standard for WebKit */
        word-break: break-word;

    -webkit-hyphens: auto;
        -moz-hyphens: auto;
            hyphens: auto;
}

.quilt-planner-button-disabled{
    pointer-events: none !important;
}