{"version":3,"sources":["tiles.scss","tiles.css"],"names":[],"mappings":"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AxEP,qD,CA4EO,qB,CACA,S,CA7EP,2B,CAmFG,U,CACA,W,CACA,O,CACA,6B,CAGF,0B,CACE,gB,CACA,O,CACA,wB,CACA,Y,CAGA,sB,CAEA,8B,CACA,+B,CAVD,2C,CAaG,U,CACA,iB,CACA,Q,CACA,Q,CACA,M,CACA,U,CACA,Q,CACA,S,CACA,8B,CAoCH,wC,CAzDA,gC,CAkEG,U,CACA,iB,CACA,K,CACA,M,CACA,U,CACA,W,CACA,8B,CAxEH,gC,CAiCG,6B,CAFA,U,CAKF,kC,CACE,iB,CACA,S,CAtCH,6B,CA0CG,kB,CACA,gB,CACA,oB,CAEA,+B,CA9CH,6B,CAkDG,gB,CACA,gB,CAMJ,uB,CACE,gB,CACA,O,CAEA,iB,CACA,e,CACA,+B,CAND,wC,CAgBG,S,CACA,S,CAjBJ,uB,CAAC,kC,CAzDA,6B,CAAA,6B,CA8EG,8B,CAIJ,yB,CAAA,2B,CAEE,iB,CACA,O,CACA,a,CACA,U,CACA,W,CACA,iB,CACA,8B,CARD,2B,CAAA,6B,CAWG,iB,CACA,O,CACA,Q,CACA,8B,CAKJ,yB,CACE,O,CACA,6B,CACA,oC,CACA,S,CACA,S,CACA,6B,CAND,2B,CASG,c,CACA,0B,CAIJ,2B,CACE,M,CACA,8B,CACA,sC,CACA,S,CACA,S,CALD,6B,CAQG,iB,CACA,kB,CAMN,kB,CACE,iB,CACA,kC,CACA,qB,CACA,Y,CACA,gB,CACA,a,CACA,4B,CACE,Q,CARH,qC,CAAA,wC,CAAA,gC,CAaK,S,CAbL,+B,CAiBK,mB,CAjBL,wD,CAsBO,mC,CAtBP,sD,CA0BO,kB,CA1BP,+D,CAkCK,S,CACA,wF,CAnCL,uE,CAuCO,qB,CACA,qC,CAxCP,2D,CAqDO,gB,CACA,0B,CAtDP,oE,CA0DW,e,CA1DX,8D,CA+DS,e,CACA,kB,CACA,oB,CAjET,+D,CAsEO,Y,CACA,8E,CAvEP,iE,CAgFK,S,CACA,wF,CAjFL,8D,CA8FO,gB,CACA,0B,CA/FP,iE,CAkGS,kB,CAlGT,kE,CAwGO,Y,CACA,kE,CAUN,+B,CACE,iB,CACA,Q,CACA,mC,CACA,W,CACA,W,CACA,wB,CACA,iB,CACA,gB,CACA,e,CACA,iB,CACA,iB,CACA,8B,CACA,S,CACA,kB,CAjIH,yB,CAAA,0B,CAqIG,U,CACA,iB,CACA,K,CACA,O,CACA,Q,CACA,M,CACA,S,CACA,8B,CACA,S,CA7IH,0B,CAuJG,S,CAMF,2B,CACE,iB,CACA,U,CACA,Y,CACA,qB,CACA,sB,CACA,kB,CACA,S,CACA,mB,CACA,kB,CATD,8B,CAYG,8B,CACA,kB,CAbH,6B,CAiBG,U,CACA,e,CACA,c,CAnBH,6B,CAuBG,kB,CAKJ,6B,CACE,W,CACA,W,CACA,iB,CACA,iB,CACA,iB,CACA,gB,CACA,e,CACA,mB,CACA,wB,CACA,8B,CACA,kB,CACA,6B,CACA,0B,CAGD,0D,CAEG,+B,CACA,qC,CACA,e,CACA,U,CACA,c,CACA,W,CACA,gB,CACA,iB","file":"../tiles.css","sourcesContent":["@import \"../../assets/styles/variables\";\r\n@import \"../../assets/styles/mixins\";\r\n\r\n.brk-tiles {\r\n\r\n  // Full\r\n  &-full {\r\n    position: relative;\r\n    height: 100%;\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    min-height: 280px;\r\n\r\n    text-align: center;\r\n\r\n    &:hover {\r\n      .brk-tiles-full__thumb {\r\n        &:before {\r\n          opacity: 1;\r\n        }\r\n      }\r\n\r\n      .brk-tiles-full__content {\r\n        box-shadow: 0 6px 30px rgba(var(--brand-primary-rgb), 0.6);\r\n\r\n        &:before {\r\n          border-right-color: var(--brand-primary);\r\n          border-left-color: var(--brk-base-2);\r\n\r\n          @media (max-width: 767px) {\r\n            border-right-color: transparent;\r\n            border-left-color: transparent;\r\n            border-bottom-color: var(--brk-base-2);\r\n          }\r\n        }\r\n\r\n        &:after {\r\n          opacity: 1;\r\n        }\r\n\r\n        h4,\r\n        p {\r\n          color: var(--white);\r\n        }\r\n\r\n        h4 {\r\n          &:before {\r\n            background-color: var(--white);\r\n          }\r\n        }\r\n\r\n        .brk-tiles-full__link {\r\n          border: 2px solid var(--white);\r\n        }\r\n\r\n      }\r\n    }\r\n\r\n\r\n    // Left //\r\n    &_left {\r\n      .brk-tiles-full__thumb {\r\n        @media (min-width: 768px) {\r\n          order: 2;\r\n        }\r\n      }\r\n\r\n      .brk-tiles-full__content {\r\n        @media (min-width: 768px) {\r\n          order: 1;\r\n        }\r\n\r\n        &:before {\r\n          left: auto;\r\n          right: -16px;\r\n          border-right: 0 solid transparent;\r\n          border-left: 16px solid #f8f8f8;\r\n\r\n          @media (max-width: 767px) {\r\n            top: -16px;\r\n            left: 50%;\r\n            right: auto;\r\n            transform: translateX(-50%);\r\n            border-right: 16px solid transparent;\r\n            border-left: 16px solid transparent;\r\n            border-top: 0;\r\n            border-bottom: 16px solid #f8f8f8;\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    // End Left //\r\n\r\n\r\n    &__thumb,\r\n    &__content {\r\n      flex-basis: 100%;\r\n      max-width: 100%;\r\n\r\n      @media (min-width: 768px) {\r\n        flex-basis: 50%;\r\n        max-width: 50%;\r\n      }\r\n    }\r\n\r\n    &__thumb {\r\n      background: no-repeat center center;\r\n      background-size: cover;\r\n      position: relative;\r\n      min-height: 250px;\r\n\r\n      &:before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n        opacity: 0;\r\n        transition: all .3s ease-in-out;\r\n        z-index: 1;\r\n        background-color: rgba(var(--brk-base-2-rgb), 0.2);\r\n      }\r\n\r\n    }\r\n\r\n    &__content {\r\n      padding: 40px 0 20px;\r\n      position: relative;\r\n\t\t\tbackground-color: #f8f8f8;\r\n\r\n      &-layer {\r\n        position: relative;\r\n        z-index: 2;\r\n      }\r\n\r\n      &:before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 50%;\r\n        left: -16px;\r\n        transform: translateY(-50%);\r\n        width: 0;\r\n        height: 0;\r\n        transition: all .4s ease-in-out;\r\n        border-top: 16px solid transparent;\r\n        border-bottom: 16px solid transparent;\r\n        z-index: 9;\r\n        border-right: 16px solid #f8f8f8;\r\n\r\n        @media (max-width: 767px) {\r\n          top: -16px;\r\n          left: 50%;\r\n          transform: translateX(-50%);\r\n          border-right: 16px solid transparent;\r\n          border-left: 16px solid transparent;\r\n          border-bottom: 16px solid #f8f8f8;\r\n          border-top: 0;\r\n        }\r\n      }\r\n\r\n      &:after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n        opacity: 0;\r\n        transition: all .4s ease-in-out;\r\n        background-image: linear-gradient(50deg,\r\n          rgba(var(--brand-primary-rgb), 0.94),\r\n          rgba(var(--brk-base-2-rgb), 0.94));\r\n      }\r\n\r\n      h4 {\r\n        text-transform: uppercase;\r\n        position: relative;\r\n        padding: 0 15px 12px;\r\n        margin-bottom: 24px;\r\n\r\n        &:before {\r\n          content: '';\r\n          position: absolute;\r\n          bottom: 0;\r\n          left: 50%;\r\n          transform: translateX(-50%);\r\n          width: 24px;\r\n          height: 2px;\r\n          background-color: var(--brand-primary);\r\n        }\r\n      }\r\n\r\n      p {\r\n        padding: 0 15px;\r\n        max-width: 500px;\r\n        margin: 0 auto 25px auto;\r\n        color: #9f9f9f;\r\n\r\n        @media (min-width: 768px) {\r\n          max-width: 380px;\r\n        }\r\n      }\r\n\r\n    }\r\n\r\n    &__link {\r\n      display: block;\r\n      margin: 0 auto;\r\n      width: 42px;\r\n      height: 42px;\r\n      border-radius: 50%;\r\n      position: relative;\r\n      background-color: var(--white);\r\n      border: 2px solid #f4f4f4;\r\n\r\n      i {\r\n        position: absolute;\r\n        top: 50%;\r\n        left: 50%;\r\n        transform: translate(-50%, -50%);\r\n        font-size: rem(18);\r\n        color: var(--brand-primary);\r\n      }\r\n    }\r\n  }\r\n\r\n  // Simple\r\n  &-simple {\r\n    background: no-repeat center center;\r\n    background-size: cover;\r\n    position: relative;\r\n    min-height: 292px;\r\n\r\n    &:hover {\r\n      .brk-tiles-simple {\r\n        &__link {\r\n          box-shadow: none;\r\n\r\n          .before {\r\n            animation: 1.5s brk-pulse .3s infinite;\r\n          }\r\n\r\n          .after {\r\n            animation: brk-pulse 1.5s infinite;\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    .before {\r\n      position: absolute;\r\n      top: 0;\r\n      left: 0;\r\n      width: 100%;\r\n      height: 100%;\r\n      background-image: linear-gradient(to right, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));\r\n      z-index: 1;\r\n    }\r\n\r\n    &_left {\r\n      .before {\r\n        @media (min-width: 768px) {\r\n          background-image: linear-gradient(to left, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));\r\n        }\r\n      }\r\n\r\n      .brk-tiles-simple__content {\r\n        @media (min-width: 768px) {\r\n          text-align: right;\r\n          align-items: flex-end;\r\n        }\r\n      }\r\n\r\n    }\r\n\r\n    &__content {\r\n      position: relative;\r\n      z-index: 2;\r\n      padding: 47px 30px 15px;\r\n      text-align: left;\r\n      display: flex;\r\n      flex-direction: column;\r\n\r\n      h4 {\r\n        letter-spacing: 0.01em;\r\n        margin-bottom: 30px;\r\n        color: var(--white);\r\n      }\r\n\r\n      p {\r\n        max-width: 230px;\r\n        font-size: rem(14);\r\n        line-height: 26px !important;\r\n        letter-spacing: 0.01em;\r\n        margin-bottom: 41px !important;\r\n        display: block;\r\n        color: #c5c5c5;\r\n      }\r\n    }\r\n\r\n    &__link {\r\n      display: block;\r\n      width: 42px;\r\n      height: 42px;\r\n      border-radius: 50%;\r\n      position: relative;\r\n      background-color: var(--brand-primary);\r\n      box-shadow: 0 5px 16px rgba(var(--brand-primary-rgb), 0.5);\r\n\r\n      .before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        right: 0;\r\n        bottom: 0;\r\n        border-radius: 50%;\r\n        z-index: -1;\r\n        background-color: rgba(var(--brand-primary-rgb), 0.5);\r\n      }\r\n\r\n      .after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        right: 0;\r\n        bottom: 0;\r\n        border-radius: 50%;\r\n        z-index: -1;\r\n        background-color: rgba(var(--brand-primary-rgb), 0.5);\r\n      }\r\n\r\n      i {\r\n        position: absolute;\r\n        top: 50%;\r\n        left: 50%;\r\n        transform: translate(-50%, -50%);\r\n        font-size: rem(18);\r\n        color: var(--white);\r\n      }\r\n    }\r\n  }\r\n\r\n  // Clean\r\n  &-clean {\r\n    position: relative;\r\n    min-height: 270px;\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    background-color: var(--white);\r\n    border-top: 1px solid #e9e9e9;\r\n    border-bottom: 1px solid #e9e9e9;\r\n\r\n    &:hover {\r\n      .brk-tiles-clean {\r\n        &__thumb {\r\n          &:before {\r\n            opacity: 1;\r\n\r\n            @media (min-width: 768px) {\r\n              left: 0;\r\n            }\r\n          }\r\n        }\r\n\r\n        &__content {\r\n          &:before {\r\n            width: 158px;\r\n            clip-path: polygon(30% 0, 100% 0, 100% 100%, 30% 100%, 0 50%);\r\n          }\r\n        }\r\n\r\n        &__link {\r\n          @media (min-width: 768px) {\r\n            width: 174px;\r\n            left: -180px;\r\n\r\n            i {\r\n              left: 28px;\r\n            }\r\n          }\r\n\r\n        }\r\n      }\r\n    }\r\n\r\n\r\n    // LEFT Class\r\n    &_left {\r\n      justify-content: flex-end;\r\n\r\n      &:hover {\r\n        .brk-tiles-clean {\r\n          &__thumb {\r\n            &:before {\r\n              left: auto;\r\n              right: 0;\r\n            }\r\n          }\r\n\r\n          &__content {\r\n            &:before {\r\n              clip-path: polygon(0% 0%, 70% 0, 100% 50%, 70% 100%, 0% 100%);\r\n            }\r\n          }\r\n\r\n          &__link {\r\n            @media (min-width: 768px) {\r\n              left: auto;\r\n              right: -180px;\r\n\r\n              i {\r\n                left: auto;\r\n                right: 28px;\r\n              }\r\n            }\r\n          }\r\n        }\r\n      }\r\n\r\n      .brk-tiles-clean {\r\n        &__thumb {\r\n          order: 2;\r\n\r\n          &:before {\r\n            @media (min-width: 768px) {\r\n              left: auto;\r\n              right: -100%;\r\n              clip-path: polygon(7.5% 0, 100% 0, 100% 100%, 7.5% 100%, 0 50%);\r\n            }\r\n          }\r\n        }\r\n\r\n        &__content {\r\n          order: 1;\r\n          right: auto;\r\n          left: 0;\r\n          padding-right: 56px;\r\n          padding-left: 41px;\r\n\r\n          &:before {\r\n            left: auto;\r\n            right: 1px;\r\n            transform: translateX(100%);\r\n            clip-path: polygon(0% 0%, 100% 0, 0 50%, 100% 100%, 0% 100%);\r\n          }\r\n        }\r\n\r\n        &__link {\r\n          top: auto;\r\n          bottom: -21px;\r\n\r\n          @media (min-width: 768px) {\r\n            left: auto;\r\n            right: -21px;\r\n            bottom: auto;\r\n            top: 50%;\r\n\r\n            i {\r\n              left: auto;\r\n              right: 17px;\r\n            }\r\n\r\n            span {\r\n              left: auto;\r\n              right: 0;\r\n              text-align: left;\r\n              padding-right: 0;\r\n              padding-left: 35px;\r\n            }\r\n          }\r\n\r\n          @media screen and (max-width:767px) {\r\n            z-index: 3;\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    // End LEFT Class\r\n\r\n\r\n    &__thumb {\r\n      background: no-repeat center center;\r\n      background-size: cover;\r\n      flex-basis: 100%;\r\n      max-width: 100%;\r\n      min-height: 250px;\r\n      position: relative;\r\n      overflow: hidden;\r\n\r\n      @media (min-width: 768px) {\r\n        flex-basis: 50%;\r\n        max-width: 50%;\r\n      }\r\n\r\n      &:before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        bottom: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        opacity: 0;\r\n        transition: all .3s ease-in-out;\r\n        background-color: rgba(var(--brand-primary-rgb), 0.6);\r\n\r\n        @media (min-width: 768px) {\r\n          left: -100%;\r\n          opacity: 1;\r\n          transition: all .6s ease-in-out;\r\n          clip-path: polygon(0% 0%, 92% 0%, 100% 50%, 92% 100%, 0% 100%);\r\n        }\r\n      }\r\n\r\n    }\r\n\r\n    &__content {\r\n      position: relative;\r\n      flex-basis: 100%;\r\n      max-width: 100%;\r\n      min-height: 250px;\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: center;\r\n      padding: 20px 30px 20px 56px;\r\n      z-index: 3;\r\n      background-color: var(--white);\r\n\r\n      @media (min-width: 768px) {\r\n        text-align: left;\r\n        flex-basis: 50%;\r\n        max-width: 50%;\r\n      }\r\n\r\n      @media (max-width: 1199px) {\r\n        padding-right: 25px;\r\n        padding-left: 35px;\r\n      }\r\n\r\n      &:before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: 1px;\r\n        width: 41px;\r\n        height: 100%;\r\n        transform: translateX(-100%);\r\n        clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 100%, 100% 50%);\r\n        transition: all .5s ease-in-out;\r\n        z-index: 1;\r\n        background-color: var(--white);\r\n\r\n        @media (max-width: 767px) {\r\n          display: none;\r\n        }\r\n      }\r\n\r\n      h4 {\r\n        margin-bottom: 15px;\r\n        margin-top: -7px;\r\n        font-size: rem(21);\r\n\r\n        @media (max-width: 767px) {\r\n          font-size: rem(18);\r\n        }\r\n      }\r\n\r\n      p {\r\n        font-size: rem(16);\r\n        line-height: 26px;\r\n        color: #9f9f9f;\r\n\r\n        @media (min-width: 992px) and (max-width: 1199px) {\r\n          font-size: rem(14);\r\n          line-height: 24px;\r\n        }\r\n\r\n        @media (max-width: 767px) {\r\n          font-size: rem(14);\r\n          line-height: 24px;\r\n        }\r\n      }\r\n\r\n    }\r\n\r\n    &__link {\r\n      position: absolute;\r\n      top: -21px;\r\n      left: 50%;\r\n      transform: translateX(-50%);\r\n      display: block;\r\n      width: 174px;\r\n      height: 42px;\r\n      border-radius: 21px;\r\n      overflow: hidden;\r\n      transition: all .5s ease-in-out;\r\n      z-index: 2;\r\n      background-color: var(--brand-primary);\r\n      box-shadow: 0 5px 16px rgba(var(--brand-primary-rgb), 0.5);\r\n\r\n      @media (min-width: 768px) {\r\n        width: 42px;\r\n        top: 50%;\r\n        left: -21px;\r\n        transform: translateY(-50%);\r\n      }\r\n\r\n      i {\r\n        position: absolute;\r\n        top: 50%;\r\n        left: 28px;\r\n        transform: translateY(-50%);\r\n        font-size: rem(18);\r\n        transition: all .5s ease-in-out;\r\n        color: var(--white);\r\n\r\n        @media (min-width: 768px) {\r\n          left: 18px;\r\n        }\r\n      }\r\n\r\n      span {\r\n        width: 174px;\r\n        height: 100%;\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        font-size: rem(14);\r\n        line-height: 42px;\r\n        font-weight: bold;\r\n        text-transform: uppercase;\r\n        text-align: right;\r\n        padding-right: 35px;\r\n        color: var(--white);\r\n      }\r\n    }\r\n  }\r\n\r\n  // Assorted\r\n  &-assorted {\r\n    min-height: 610px;\r\n    background: no-repeat center center;\r\n    background-size: cover;\r\n    display: flex;\r\n    flex-direction: column;\r\n    position: relative;\r\n    margin: 5px 0;\r\n    z-index: 1;\r\n\r\n    &_back {\r\n      .brk-tiles-assorted {\r\n        &__title {\r\n          order: 3;\r\n\r\n          .brk-abs-overlay {\r\n            bottom: auto;\r\n            top: 0;\r\n          }\r\n\r\n          &:after {\r\n            top: auto;\r\n            bottom: 0;\r\n          }\r\n        }\r\n\r\n        &__bg {\r\n          order: 1;\r\n        }\r\n      }\r\n    }\r\n\r\n    &:hover {\r\n      z-index: 2;\r\n\r\n      .brk-tiles-assorted {\r\n        &__title {\r\n          background-color: transparent;\r\n          box-shadow: 0 6px 15px var(--brk-base-1);\r\n\r\n          .brk-abs-overlay {\r\n            height: 100%;\r\n          }\r\n\r\n          &:after {\r\n            height: 0;\r\n          }\r\n\r\n          h3 {\r\n            color: rgba(var(--white-rgb), 0.4);\r\n          }\r\n\r\n          h4 {\r\n            color: var(--white);\r\n          }\r\n\r\n        }\r\n\r\n        &__bg {\r\n          box-shadow: 0 6px 15px var(--brk-base-1);\r\n\r\n          .brk-abs-overlay {\r\n            opacity: 1;\r\n          }\r\n\r\n          .brk-layer {\r\n            opacity: 0;\r\n          }\r\n        }\r\n\r\n        &__link {\r\n          right: calc(50% - 21px);\r\n          opacity: 1;\r\n        }\r\n\r\n        &__search {\r\n          left: calc(50% - 19px);\r\n          opacity: 1;\r\n        }\r\n      }\r\n    }\r\n\r\n    .before {\r\n      width: 100%;\r\n      height: 10px;\r\n      order: 2;\r\n      background-color: var(--white);\r\n    }\r\n\r\n    &__title {\r\n      min-height: 220px;\r\n      order: 1;\r\n      text-transform: uppercase;\r\n      padding: 15px;\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: center;\r\n      position: relative;\r\n      transition: all .3s ease-in-out;\r\n      box-shadow: inset 0 0 0 1px #eee;\r\n\r\n      .brk-abs-overlay {\r\n        content: '';\r\n        position: absolute;\r\n        top: auto;\r\n        bottom: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 0;\r\n        z-index: 1;\r\n        transition: all .3s ease-in-out;\r\n      }\r\n\r\n      &:after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n        z-index: -1;\r\n        transition: all .3s ease-in-out;\r\n        background-color: var(--white);\r\n      }\r\n\r\n      &-content {\r\n        position: relative;\r\n        z-index: 2;\r\n      }\r\n\r\n      h3 {\r\n        font-size: rem(15);\r\n        line-height: 18px;\r\n        letter-spacing: 0.05em;\r\n        transition: all .3s ease-in-out;\r\n        color: rgba(var(--black-rgb), 0.4);\r\n      }\r\n\r\n      h4 {\r\n        font-size: rem(24);\r\n        line-height: 24px;\r\n        transition: all .3s ease-in-out;\r\n      }\r\n\r\n    }\r\n\r\n    &__bg {\r\n      min-height: 380px;\r\n      order: 3;\r\n      transition: all .3s ease-in-out;\r\n      position: relative;\r\n      overflow: hidden;\r\n      box-shadow: inset 0 0 0 1px #eee;\r\n\r\n      .brk-abs-overlay {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n        transition: all .3s ease-in-out;\r\n        opacity: 0;\r\n        z-index: 2;\r\n      }\r\n\r\n      .brk-layer {\r\n        transition: all .3s ease-in-out;\r\n      }\r\n    }\r\n\r\n    &__link,\r\n    &__search {\r\n      position: absolute;\r\n      top: 50%;\r\n      display: block;\r\n      width: 46px;\r\n      height: 46px;\r\n      border-radius: 50%;\r\n      transition: all .4s ease-in-out;\r\n\r\n      i {\r\n        position: absolute;\r\n        top: 50%;\r\n        left: 50%;\r\n        transform: translate(-50%, -50%);\r\n      }\r\n\r\n    }\r\n\r\n    &__link {\r\n      right: 0;\r\n      transform: translate(50%, -50%);\r\n      box-shadow: 0 5px 21px rgba(0, 0, 0, .1);\r\n      opacity: 0;\r\n      z-index: 4;\r\n      background-color: var(--white);\r\n\r\n      i {\r\n        font-size: rem(16);\r\n        color: var(--brand-primary);\r\n      }\r\n    }\r\n\r\n    &__search {\r\n      left: 0;\r\n      transform: translate(-50%, -50%);\r\n      border: 2px solid rgba(255, 255, 255, .26);\r\n      opacity: 0;\r\n      z-index: 3;\r\n\r\n      i {\r\n        font-size: rem(14);\r\n        color: var(--white);\r\n      }\r\n    }\r\n  }\r\n\r\n  // Formats\r\n  &-formats {\r\n    position: relative;\r\n    background: no-repeat center center;\r\n    background-size: cover;\r\n    display: flex;\r\n    min-height: 330px;\r\n    margin: 20px 0;\r\n    &_no-margin{\r\n      margin: 0;\r\n    }\r\n\r\n    &:hover {\r\n      .before {\r\n        opacity: 1;\r\n      }\r\n\r\n      .after {\r\n        opacity: 0 !important;\r\n      }\r\n\r\n      .brk-tiles-formats {\r\n        &__format-post {\r\n          transform: translateX(-50%) scale(0);\r\n        }\r\n\r\n        &__read-more {\r\n          transform: scale(1);\r\n        }\r\n      }\r\n    }\r\n\r\n    /* formats posts */\r\n    &.format-image {\r\n      .brk-tiles-formats__format-post {\r\n        top: -17px;\r\n        background-image: linear-gradient(to right,\r\n          var(--brk-secondary-4),\r\n          var(--brk-secondary-3));\r\n        &_primary{\r\n          background-image: none;\r\n          background-color: var(--brand-primary);\r\n        }\r\n\r\n      }\r\n    }\r\n\r\n    &.format-quote {\r\n      &:after {\r\n        opacity: 1;\r\n      }\r\n\r\n      .brk-tiles-formats {\r\n        &__content {\r\n          padding-top: 62px;\r\n          justify-content: flex-start;\r\n\r\n          &:hover {\r\n            h4 {\r\n              margin-top: 36px;\r\n            }\r\n          }\r\n\r\n          h4 {\r\n            margin-top: 52px;\r\n            margin-bottom: 38px;\r\n            letter-spacing: 0.04em;\r\n          }\r\n        }\r\n\r\n        &__format-post {\r\n          bottom: -17px;\r\n          background-image: linear-gradient(50deg,\r\n            var(--brand-primary),\r\n            var(--brk-base-2));\r\n        }\r\n      }\r\n    }\r\n\r\n    &.format-gallery {\r\n      .brk-tiles-formats__format-post {\r\n        top: -17px;\r\n        background-image: linear-gradient(to right,\r\n          var(--brk-secondary-5),\r\n          var(--brk-secondary-6));\r\n      }\r\n    }\r\n\r\n    &.format-standard {\r\n      &:after {\r\n        opacity: 1;\r\n      }\r\n\r\n      .brk-tiles-formats {\r\n        &__content {\r\n          padding-top: 73px;\r\n          justify-content: flex-start;\r\n\r\n          h4 {\r\n            margin-bottom: 45px;\r\n          }\r\n\r\n        }\r\n\r\n        &__format-post {\r\n          bottom: -17px;\r\n          background-image: linear-gradient(to right,\r\n            #50c2ae,\r\n            #02d8b7,\r\n            #0cdfbf);\r\n        }\r\n      }\r\n    }\r\n\r\n    /* end formats posts */\r\n\r\n    &__format-post {\r\n      position: absolute;\r\n      left: 50%;\r\n      transform: translateX(-50%) scale(1);\r\n      width: 100px;\r\n      height: 34px;\r\n      text-transform: uppercase;\r\n      font-size: rem(14);\r\n      line-height: 34px;\r\n      font-weight: bold;\r\n      text-align: center;\r\n      border-radius: 6px;\r\n      transition: all .4s ease-in-out;\r\n      z-index: 3;\r\n      color: var(--white);\r\n    }\r\n\r\n    .after {\r\n      content: '';\r\n      position: absolute;\r\n      top: 0;\r\n      right: 0;\r\n      bottom: 0;\r\n      left: 0;\r\n      opacity: 1;\r\n      transition: all .4s ease-in-out;\r\n      z-index: 1;\r\n    }\r\n\r\n    .before {\r\n      content: '';\r\n      position: absolute;\r\n      top: 0;\r\n      right: 0;\r\n      bottom: 0;\r\n      left: 0;\r\n      opacity: 0;\r\n      transition: all .4s ease-in-out;\r\n      z-index: 1;\r\n    }\r\n\r\n    /* Content */\r\n    &__content {\r\n      position: relative;\r\n      width: 100%;\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: center;\r\n      align-items: center;\r\n      z-index: 2;\r\n      padding-bottom: 10px;\r\n      color: var(--white);\r\n\r\n      h4 {\r\n        transition: all .3s ease-in-out;\r\n        color: var(--white);\r\n      }\r\n\r\n      p {\r\n        width: 100%;\r\n        max-width: 380px;\r\n        padding: 0 15px;\r\n      }\r\n\r\n      i {\r\n        font-size: rem(30);\r\n      }\r\n\r\n    }\r\n\r\n    &__read-more {\r\n      width: 130px;\r\n      height: 34px;\r\n      border-radius: 6px;\r\n      text-align: center;\r\n      font-size: rem(14);\r\n      line-height: 34px;\r\n      font-weight: bold;\r\n      letter-spacing: 0.1em;\r\n      text-transform: uppercase;\r\n      transition: all .4s ease-in-out;\r\n      transform: scale(0);\r\n      background-color: var(--white);\r\n      color: var(--brand-primary);\r\n    }\r\n\r\n    &_minimal {\r\n      .brk-tiles-formats__format-post{\r\n        background-image: none !important;\r\n        background-color: var(--brand-primary);\r\n        border-radius: 0;\r\n        width: auto;\r\n        min-width: 90px;\r\n        height: 30px;\r\n        line-height: 30px;\r\n        text-align: center;\r\n      }\r\n    }\r\n\r\n  }\r\n\r\n}\r\n",".brk-tiles-full {\n  position: relative;\n  height: 100%;\n  display: flex;\n  flex-wrap: wrap;\n  min-height: 280px;\n  text-align: center; }\n  .brk-tiles-full:hover .brk-tiles-full__thumb:before {\n    opacity: 1; }\n  .brk-tiles-full:hover .brk-tiles-full__content {\n    box-shadow: 0 6px 30px rgba(var(--brand-primary-rgb), 0.6); }\n    .brk-tiles-full:hover .brk-tiles-full__content:before {\n      border-right-color: var(--brand-primary);\n      border-left-color: var(--brk-base-2); }\n      @media (max-width: 767px) {\n        .brk-tiles-full:hover .brk-tiles-full__content:before {\n          border-right-color: transparent;\n          border-left-color: transparent;\n          border-bottom-color: var(--brk-base-2); } }\n    .brk-tiles-full:hover .brk-tiles-full__content:after {\n      opacity: 1; }\n    .brk-tiles-full:hover .brk-tiles-full__content h4,\n    .brk-tiles-full:hover .brk-tiles-full__content p {\n      color: var(--white); }\n    .brk-tiles-full:hover .brk-tiles-full__content h4:before {\n      background-color: var(--white); }\n    .brk-tiles-full:hover .brk-tiles-full__content .brk-tiles-full__link {\n      border: 2px solid var(--white); }\n  @media (min-width: 768px) {\n    .brk-tiles-full_left .brk-tiles-full__thumb {\n      order: 2; } }\n  @media (min-width: 768px) {\n    .brk-tiles-full_left .brk-tiles-full__content {\n      order: 1; } }\n  .brk-tiles-full_left .brk-tiles-full__content:before {\n    left: auto;\n    right: -16px;\n    border-right: 0 solid transparent;\n    border-left: 16px solid #f8f8f8; }\n    @media (max-width: 767px) {\n      .brk-tiles-full_left .brk-tiles-full__content:before {\n        top: -16px;\n        left: 50%;\n        right: auto;\n        transform: translateX(-50%);\n        border-right: 16px solid transparent;\n        border-left: 16px solid transparent;\n        border-top: 0;\n        border-bottom: 16px solid #f8f8f8; } }\n  .brk-tiles-full__thumb, .brk-tiles-full__content {\n    flex-basis: 100%;\n    max-width: 100%; }\n    @media (min-width: 768px) {\n      .brk-tiles-full__thumb, .brk-tiles-full__content {\n        flex-basis: 50%;\n        max-width: 50%; } }\n  .brk-tiles-full__thumb {\n    background: no-repeat center center;\n    background-size: cover;\n    position: relative;\n    min-height: 250px; }\n    .brk-tiles-full__thumb:before {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      opacity: 0;\n      transition: all .3s ease-in-out;\n      z-index: 1;\n      background-color: rgba(var(--brk-base-2-rgb), 0.2); }\n  .brk-tiles-full__content {\n    padding: 40px 0 20px;\n    position: relative;\n    background-color: #f8f8f8; }\n    .brk-tiles-full__content-layer {\n      position: relative;\n      z-index: 2; }\n    .brk-tiles-full__content:before {\n      content: '';\n      position: absolute;\n      top: 50%;\n      left: -16px;\n      transform: translateY(-50%);\n      width: 0;\n      height: 0;\n      transition: all .4s ease-in-out;\n      border-top: 16px solid transparent;\n      border-bottom: 16px solid transparent;\n      z-index: 9;\n      border-right: 16px solid #f8f8f8; }\n      @media (max-width: 767px) {\n        .brk-tiles-full__content:before {\n          top: -16px;\n          left: 50%;\n          transform: translateX(-50%);\n          border-right: 16px solid transparent;\n          border-left: 16px solid transparent;\n          border-bottom: 16px solid #f8f8f8;\n          border-top: 0; } }\n    .brk-tiles-full__content:after {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      opacity: 0;\n      transition: all .4s ease-in-out;\n      background-image: linear-gradient(50deg, rgba(var(--brand-primary-rgb), 0.94), rgba(var(--brk-base-2-rgb), 0.94)); }\n    .brk-tiles-full__content h4 {\n      text-transform: uppercase;\n      position: relative;\n      padding: 0 15px 12px;\n      margin-bottom: 24px; }\n      .brk-tiles-full__content h4:before {\n        content: '';\n        position: absolute;\n        bottom: 0;\n        left: 50%;\n        transform: translateX(-50%);\n        width: 24px;\n        height: 2px;\n        background-color: var(--brand-primary); }\n    .brk-tiles-full__content p {\n      padding: 0 15px;\n      max-width: 500px;\n      margin: 0 auto 25px auto;\n      color: #9f9f9f; }\n      @media (min-width: 768px) {\n        .brk-tiles-full__content p {\n          max-width: 380px; } }\n  .brk-tiles-full__link {\n    display: block;\n    margin: 0 auto;\n    width: 42px;\n    height: 42px;\n    border-radius: 50%;\n    position: relative;\n    background-color: var(--white);\n    border: 2px solid #f4f4f4; }\n    .brk-tiles-full__link i {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n      font-size: 1.125rem;\n      color: var(--brand-primary); }\n\n.brk-tiles-simple {\n  background: no-repeat center center;\n  background-size: cover;\n  position: relative;\n  min-height: 292px; }\n  .brk-tiles-simple:hover .brk-tiles-simple__link {\n    box-shadow: none; }\n    .brk-tiles-simple:hover .brk-tiles-simple__link .before {\n      -webkit-animation: 1.5s brk-pulse .3s infinite;\n              animation: 1.5s brk-pulse .3s infinite; }\n    .brk-tiles-simple:hover .brk-tiles-simple__link .after {\n      -webkit-animation: brk-pulse 1.5s infinite;\n              animation: brk-pulse 1.5s infinite; }\n  .brk-tiles-simple .before {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));\n    z-index: 1; }\n  @media (min-width: 768px) {\n    .brk-tiles-simple_left .before {\n      background-image: linear-gradient(to left, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0)); } }\n  @media (min-width: 768px) {\n    .brk-tiles-simple_left .brk-tiles-simple__content {\n      text-align: right;\n      align-items: flex-end; } }\n  .brk-tiles-simple__content {\n    position: relative;\n    z-index: 2;\n    padding: 47px 30px 15px;\n    text-align: left;\n    display: flex;\n    flex-direction: column; }\n    .brk-tiles-simple__content h4 {\n      letter-spacing: 0.01em;\n      margin-bottom: 30px;\n      color: var(--white); }\n    .brk-tiles-simple__content p {\n      max-width: 230px;\n      font-size: 0.875rem;\n      line-height: 26px !important;\n      letter-spacing: 0.01em;\n      margin-bottom: 41px !important;\n      display: block;\n      color: #c5c5c5; }\n  .brk-tiles-simple__link {\n    display: block;\n    width: 42px;\n    height: 42px;\n    border-radius: 50%;\n    position: relative;\n    background-color: var(--brand-primary);\n    box-shadow: 0 5px 16px rgba(var(--brand-primary-rgb), 0.5); }\n    .brk-tiles-simple__link .before {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      border-radius: 50%;\n      z-index: -1;\n      background-color: rgba(var(--brand-primary-rgb), 0.5); }\n    .brk-tiles-simple__link .after {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      border-radius: 50%;\n      z-index: -1;\n      background-color: rgba(var(--brand-primary-rgb), 0.5); }\n    .brk-tiles-simple__link i {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n      font-size: 1.125rem;\n      color: var(--white); }\n\n.brk-tiles-clean {\n  position: relative;\n  min-height: 270px;\n  display: flex;\n  flex-wrap: wrap;\n  background-color: var(--white);\n  border-top: 1px solid #e9e9e9;\n  border-bottom: 1px solid #e9e9e9; }\n  .brk-tiles-clean:hover .brk-tiles-clean__thumb:before {\n    opacity: 1; }\n    @media (min-width: 768px) {\n      .brk-tiles-clean:hover .brk-tiles-clean__thumb:before {\n        left: 0; } }\n  .brk-tiles-clean:hover .brk-tiles-clean__content:before {\n    width: 158px;\n    -webkit-clip-path: polygon(30% 0, 100% 0, 100% 100%, 30% 100%, 0 50%);\n            clip-path: polygon(30% 0, 100% 0, 100% 100%, 30% 100%, 0 50%); }\n  @media (min-width: 768px) {\n    .brk-tiles-clean:hover .brk-tiles-clean__link {\n      width: 174px;\n      left: -180px; }\n      .brk-tiles-clean:hover .brk-tiles-clean__link i {\n        left: 28px; } }\n  .brk-tiles-clean_left {\n    justify-content: flex-end; }\n    .brk-tiles-clean_left:hover .brk-tiles-clean__thumb:before {\n      left: auto;\n      right: 0; }\n    .brk-tiles-clean_left:hover .brk-tiles-clean__content:before {\n      -webkit-clip-path: polygon(0% 0%, 70% 0, 100% 50%, 70% 100%, 0% 100%);\n              clip-path: polygon(0% 0%, 70% 0, 100% 50%, 70% 100%, 0% 100%); }\n    @media (min-width: 768px) {\n      .brk-tiles-clean_left:hover .brk-tiles-clean__link {\n        left: auto;\n        right: -180px; }\n        .brk-tiles-clean_left:hover .brk-tiles-clean__link i {\n          left: auto;\n          right: 28px; } }\n    .brk-tiles-clean_left .brk-tiles-clean__thumb {\n      order: 2; }\n      @media (min-width: 768px) {\n        .brk-tiles-clean_left .brk-tiles-clean__thumb:before {\n          left: auto;\n          right: -100%;\n          -webkit-clip-path: polygon(7.5% 0, 100% 0, 100% 100%, 7.5% 100%, 0 50%);\n                  clip-path: polygon(7.5% 0, 100% 0, 100% 100%, 7.5% 100%, 0 50%); } }\n    .brk-tiles-clean_left .brk-tiles-clean__content {\n      order: 1;\n      right: auto;\n      left: 0;\n      padding-right: 56px;\n      padding-left: 41px; }\n      .brk-tiles-clean_left .brk-tiles-clean__content:before {\n        left: auto;\n        right: 1px;\n        transform: translateX(100%);\n        -webkit-clip-path: polygon(0% 0%, 100% 0, 0 50%, 100% 100%, 0% 100%);\n                clip-path: polygon(0% 0%, 100% 0, 0 50%, 100% 100%, 0% 100%); }\n    .brk-tiles-clean_left .brk-tiles-clean__link {\n      top: auto;\n      bottom: -21px; }\n      @media (min-width: 768px) {\n        .brk-tiles-clean_left .brk-tiles-clean__link {\n          left: auto;\n          right: -21px;\n          bottom: auto;\n          top: 50%; }\n          .brk-tiles-clean_left .brk-tiles-clean__link i {\n            left: auto;\n            right: 17px; }\n          .brk-tiles-clean_left .brk-tiles-clean__link span {\n            left: auto;\n            right: 0;\n            text-align: left;\n            padding-right: 0;\n            padding-left: 35px; } }\n      @media screen and (max-width: 767px) {\n        .brk-tiles-clean_left .brk-tiles-clean__link {\n          z-index: 3; } }\n  .brk-tiles-clean__thumb {\n    background: no-repeat center center;\n    background-size: cover;\n    flex-basis: 100%;\n    max-width: 100%;\n    min-height: 250px;\n    position: relative;\n    overflow: hidden; }\n    @media (min-width: 768px) {\n      .brk-tiles-clean__thumb {\n        flex-basis: 50%;\n        max-width: 50%; } }\n    .brk-tiles-clean__thumb:before {\n      content: '';\n      position: absolute;\n      top: 0;\n      bottom: 0;\n      left: 0;\n      width: 100%;\n      opacity: 0;\n      transition: all .3s ease-in-out;\n      background-color: rgba(var(--brand-primary-rgb), 0.6); }\n      @media (min-width: 768px) {\n        .brk-tiles-clean__thumb:before {\n          left: -100%;\n          opacity: 1;\n          transition: all .6s ease-in-out;\n          -webkit-clip-path: polygon(0% 0%, 92% 0%, 100% 50%, 92% 100%, 0% 100%);\n                  clip-path: polygon(0% 0%, 92% 0%, 100% 50%, 92% 100%, 0% 100%); } }\n  .brk-tiles-clean__content {\n    position: relative;\n    flex-basis: 100%;\n    max-width: 100%;\n    min-height: 250px;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    padding: 20px 30px 20px 56px;\n    z-index: 3;\n    background-color: var(--white); }\n    @media (min-width: 768px) {\n      .brk-tiles-clean__content {\n        text-align: left;\n        flex-basis: 50%;\n        max-width: 50%; } }\n    @media (max-width: 1199px) {\n      .brk-tiles-clean__content {\n        padding-right: 25px;\n        padding-left: 35px; } }\n    .brk-tiles-clean__content:before {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 1px;\n      width: 41px;\n      height: 100%;\n      transform: translateX(-100%);\n      -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 100%, 100% 50%);\n              clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 100%, 100% 50%);\n      transition: all .5s ease-in-out;\n      z-index: 1;\n      background-color: var(--white); }\n      @media (max-width: 767px) {\n        .brk-tiles-clean__content:before {\n          display: none; } }\n    .brk-tiles-clean__content h4 {\n      margin-bottom: 15px;\n      margin-top: -7px;\n      font-size: 1.3125rem; }\n      @media (max-width: 767px) {\n        .brk-tiles-clean__content h4 {\n          font-size: 1.125rem; } }\n    .brk-tiles-clean__content p {\n      font-size: 1rem;\n      line-height: 26px;\n      color: #9f9f9f; }\n      @media (min-width: 992px) and (max-width: 1199px) {\n        .brk-tiles-clean__content p {\n          font-size: 0.875rem;\n          line-height: 24px; } }\n      @media (max-width: 767px) {\n        .brk-tiles-clean__content p {\n          font-size: 0.875rem;\n          line-height: 24px; } }\n  .brk-tiles-clean__link {\n    position: absolute;\n    top: -21px;\n    left: 50%;\n    transform: translateX(-50%);\n    display: block;\n    width: 174px;\n    height: 42px;\n    border-radius: 21px;\n    overflow: hidden;\n    transition: all .5s ease-in-out;\n    z-index: 2;\n    background-color: var(--brand-primary);\n    box-shadow: 0 5px 16px rgba(var(--brand-primary-rgb), 0.5); }\n    @media (min-width: 768px) {\n      .brk-tiles-clean__link {\n        width: 42px;\n        top: 50%;\n        left: -21px;\n        transform: translateY(-50%); } }\n    .brk-tiles-clean__link i {\n      position: absolute;\n      top: 50%;\n      left: 28px;\n      transform: translateY(-50%);\n      font-size: 1.125rem;\n      transition: all .5s ease-in-out;\n      color: var(--white); }\n      @media (min-width: 768px) {\n        .brk-tiles-clean__link i {\n          left: 18px; } }\n    .brk-tiles-clean__link span {\n      width: 174px;\n      height: 100%;\n      position: absolute;\n      top: 0;\n      left: 0;\n      font-size: 0.875rem;\n      line-height: 42px;\n      font-weight: bold;\n      text-transform: uppercase;\n      text-align: right;\n      padding-right: 35px;\n      color: var(--white); }\n\n.brk-tiles-assorted {\n  min-height: 610px;\n  background: no-repeat center center;\n  background-size: cover;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  margin: 5px 0;\n  z-index: 1; }\n  .brk-tiles-assorted_back .brk-tiles-assorted__title {\n    order: 3; }\n    .brk-tiles-assorted_back .brk-tiles-assorted__title .brk-abs-overlay {\n      bottom: auto;\n      top: 0; }\n    .brk-tiles-assorted_back .brk-tiles-assorted__title:after {\n      top: auto;\n      bottom: 0; }\n  .brk-tiles-assorted_back .brk-tiles-assorted__bg {\n    order: 1; }\n  .brk-tiles-assorted:hover {\n    z-index: 2; }\n    .brk-tiles-assorted:hover .brk-tiles-assorted__title {\n      background-color: transparent;\n      box-shadow: 0 6px 15px var(--brk-base-1); }\n      .brk-tiles-assorted:hover .brk-tiles-assorted__title .brk-abs-overlay {\n        height: 100%; }\n      .brk-tiles-assorted:hover .brk-tiles-assorted__title:after {\n        height: 0; }\n      .brk-tiles-assorted:hover .brk-tiles-assorted__title h3 {\n        color: rgba(var(--white-rgb), 0.4); }\n      .brk-tiles-assorted:hover .brk-tiles-assorted__title h4 {\n        color: var(--white); }\n    .brk-tiles-assorted:hover .brk-tiles-assorted__bg {\n      box-shadow: 0 6px 15px var(--brk-base-1); }\n      .brk-tiles-assorted:hover .brk-tiles-assorted__bg .brk-abs-overlay {\n        opacity: 1; }\n      .brk-tiles-assorted:hover .brk-tiles-assorted__bg .brk-layer {\n        opacity: 0; }\n    .brk-tiles-assorted:hover .brk-tiles-assorted__link {\n      right: calc(50% - 21px);\n      opacity: 1; }\n    .brk-tiles-assorted:hover .brk-tiles-assorted__search {\n      left: calc(50% - 19px);\n      opacity: 1; }\n  .brk-tiles-assorted .before {\n    width: 100%;\n    height: 10px;\n    order: 2;\n    background-color: var(--white); }\n  .brk-tiles-assorted__title {\n    min-height: 220px;\n    order: 1;\n    text-transform: uppercase;\n    padding: 15px;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    position: relative;\n    transition: all .3s ease-in-out;\n    box-shadow: inset 0 0 0 1px #eee; }\n    .brk-tiles-assorted__title .brk-abs-overlay {\n      content: '';\n      position: absolute;\n      top: auto;\n      bottom: 0;\n      left: 0;\n      width: 100%;\n      height: 0;\n      z-index: 1;\n      transition: all .3s ease-in-out; }\n    .brk-tiles-assorted__title:after {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      z-index: -1;\n      transition: all .3s ease-in-out;\n      background-color: var(--white); }\n    .brk-tiles-assorted__title-content {\n      position: relative;\n      z-index: 2; }\n    .brk-tiles-assorted__title h3 {\n      font-size: 0.9375rem;\n      line-height: 18px;\n      letter-spacing: 0.05em;\n      transition: all .3s ease-in-out;\n      color: rgba(var(--black-rgb), 0.4); }\n    .brk-tiles-assorted__title h4 {\n      font-size: 1.5rem;\n      line-height: 24px;\n      transition: all .3s ease-in-out; }\n  .brk-tiles-assorted__bg {\n    min-height: 380px;\n    order: 3;\n    transition: all .3s ease-in-out;\n    position: relative;\n    overflow: hidden;\n    box-shadow: inset 0 0 0 1px #eee; }\n    .brk-tiles-assorted__bg .brk-abs-overlay {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      transition: all .3s ease-in-out;\n      opacity: 0;\n      z-index: 2; }\n    .brk-tiles-assorted__bg .brk-layer {\n      transition: all .3s ease-in-out; }\n  .brk-tiles-assorted__link, .brk-tiles-assorted__search {\n    position: absolute;\n    top: 50%;\n    display: block;\n    width: 46px;\n    height: 46px;\n    border-radius: 50%;\n    transition: all .4s ease-in-out; }\n    .brk-tiles-assorted__link i, .brk-tiles-assorted__search i {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%); }\n  .brk-tiles-assorted__link {\n    right: 0;\n    transform: translate(50%, -50%);\n    box-shadow: 0 5px 21px rgba(0, 0, 0, 0.1);\n    opacity: 0;\n    z-index: 4;\n    background-color: var(--white); }\n    .brk-tiles-assorted__link i {\n      font-size: 1rem;\n      color: var(--brand-primary); }\n  .brk-tiles-assorted__search {\n    left: 0;\n    transform: translate(-50%, -50%);\n    border: 2px solid rgba(255, 255, 255, 0.26);\n    opacity: 0;\n    z-index: 3; }\n    .brk-tiles-assorted__search i {\n      font-size: 0.875rem;\n      color: var(--white); }\n\n.brk-tiles-formats {\n  position: relative;\n  background: no-repeat center center;\n  background-size: cover;\n  display: flex;\n  min-height: 330px;\n  margin: 20px 0;\n  /* formats posts */\n  /* end formats posts */\n  /* Content */ }\n  .brk-tiles-formats_no-margin {\n    margin: 0; }\n  .brk-tiles-formats:hover .before {\n    opacity: 1; }\n  .brk-tiles-formats:hover .after {\n    opacity: 0 !important; }\n  .brk-tiles-formats:hover .brk-tiles-formats__format-post {\n    transform: translateX(-50%) scale(0); }\n  .brk-tiles-formats:hover .brk-tiles-formats__read-more {\n    transform: scale(1); }\n  .brk-tiles-formats.format-image .brk-tiles-formats__format-post {\n    top: -17px;\n    background-image: linear-gradient(to right, var(--brk-secondary-4), var(--brk-secondary-3)); }\n    .brk-tiles-formats.format-image .brk-tiles-formats__format-post_primary {\n      background-image: none;\n      background-color: var(--brand-primary); }\n  .brk-tiles-formats.format-quote:after {\n    opacity: 1; }\n  .brk-tiles-formats.format-quote .brk-tiles-formats__content {\n    padding-top: 62px;\n    justify-content: flex-start; }\n    .brk-tiles-formats.format-quote .brk-tiles-formats__content:hover h4 {\n      margin-top: 36px; }\n    .brk-tiles-formats.format-quote .brk-tiles-formats__content h4 {\n      margin-top: 52px;\n      margin-bottom: 38px;\n      letter-spacing: 0.04em; }\n  .brk-tiles-formats.format-quote .brk-tiles-formats__format-post {\n    bottom: -17px;\n    background-image: linear-gradient(50deg, var(--brand-primary), var(--brk-base-2)); }\n  .brk-tiles-formats.format-gallery .brk-tiles-formats__format-post {\n    top: -17px;\n    background-image: linear-gradient(to right, var(--brk-secondary-5), var(--brk-secondary-6)); }\n  .brk-tiles-formats.format-standard:after {\n    opacity: 1; }\n  .brk-tiles-formats.format-standard .brk-tiles-formats__content {\n    padding-top: 73px;\n    justify-content: flex-start; }\n    .brk-tiles-formats.format-standard .brk-tiles-formats__content h4 {\n      margin-bottom: 45px; }\n  .brk-tiles-formats.format-standard .brk-tiles-formats__format-post {\n    bottom: -17px;\n    background-image: linear-gradient(to right, #50c2ae, #02d8b7, #0cdfbf); }\n  .brk-tiles-formats__format-post {\n    position: absolute;\n    left: 50%;\n    transform: translateX(-50%) scale(1);\n    width: 100px;\n    height: 34px;\n    text-transform: uppercase;\n    font-size: 0.875rem;\n    line-height: 34px;\n    font-weight: bold;\n    text-align: center;\n    border-radius: 6px;\n    transition: all .4s ease-in-out;\n    z-index: 3;\n    color: var(--white); }\n  .brk-tiles-formats .after {\n    content: '';\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    opacity: 1;\n    transition: all .4s ease-in-out;\n    z-index: 1; }\n  .brk-tiles-formats .before {\n    content: '';\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    opacity: 0;\n    transition: all .4s ease-in-out;\n    z-index: 1; }\n  .brk-tiles-formats__content {\n    position: relative;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    z-index: 2;\n    padding-bottom: 10px;\n    color: var(--white); }\n    .brk-tiles-formats__content h4 {\n      transition: all .3s ease-in-out;\n      color: var(--white); }\n    .brk-tiles-formats__content p {\n      width: 100%;\n      max-width: 380px;\n      padding: 0 15px; }\n    .brk-tiles-formats__content i {\n      font-size: 1.875rem; }\n  .brk-tiles-formats__read-more {\n    width: 130px;\n    height: 34px;\n    border-radius: 6px;\n    text-align: center;\n    font-size: 0.875rem;\n    line-height: 34px;\n    font-weight: bold;\n    letter-spacing: 0.1em;\n    text-transform: uppercase;\n    transition: all .4s ease-in-out;\n    transform: scale(0);\n    background-color: var(--white);\n    color: var(--brand-primary); }\n  .brk-tiles-formats_minimal .brk-tiles-formats__format-post {\n    background-image: none !important;\n    background-color: var(--brand-primary);\n    border-radius: 0;\n    width: auto;\n    min-width: 90px;\n    height: 30px;\n    line-height: 30px;\n    text-align: center; }\n"]}