:root{
    --Primary-color: #3F2B21;
    --Secondary-color: #FFF8F0;
    --Tertiary-color: #ED1C3E;

    --Grey-light-color: #F8F8FB;
    --Grey-light-box-color: #F6F7FF;
    --Accent-color: #F79627;
    --Accent-color-2: #706147; 

    --Text-color: #3F2B21;
    --Button-color: #ED1C3E;
    --Button-hover-color: #6850a1;

    --White-color: #fff;

    --Border-style: dashed;
    --Border-width: 2px 2px 2px 2px;
    --Border-color-1: #D6D8FF;
    --Border-color-2: var(--Accent-color);
    --Border-default-color:  hsla(0,0%,7%,.11);

    --Swiper-bullet-color: #d6d8ff;
  
}

/* ---------------------- */
/* ----Base - Start--- */
/* ---------------------- */
/* Base */
/* Font */
/* Semibold font weight (600) */
@font-face {
    font-family: 'Nunito';
    src: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/Nunito-Normal-600.ttf');
    font-weight: 600;
    font-style: normal;
}

/* Bold (700) */
@font-face {
    font-family: 'Nunito';
    src: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/Nunito-Normal-700.ttf');
    font-weight: 700;
    font-style: normal;
}

/* Black (800) */
@font-face {
    font-family: 'Nunito';
    src: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/Nunito-Normal-800.ttf');
    font-weight: 800;
    font-style: normal;
}

/* Heavy (900) */
@font-face {
    font-family: 'Nunito';
    src: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/Nunito-Normal-900.ttf');
    font-weight: 900;
    font-style: normal;
}

h1,h2,h3,h4,h5,h6{
    font-family: 'Nunito', sans-serif;
    font-weight: 900 !important;
}

p:not(.back-link) > a{
    text-decoration: underline;
    text-decoration-color: transparent;
    transition: .3s;
    text-underline-offset: 0.25rem;

    &:hover{
        /* color: var(--Text-color); */
        text-decoration: underline !important;
    }
}

img{
    border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
    -ms-border-radius: 12px 12px 12px 12px;
    -o-border-radius: 12px 12px 12px 12px;
}

.is-object-fit-contain img{
    object-fit: contain;
}


.ict-wysiwyg.content p{
    font-weight: 500 !important;
}

@media screen and (min-width: 1088px) {
    section.section.is-x-large{
        padding-top: 8rem;
        padding-bottom: 8rem;
    }    
}

@media screen and (max-width: 1088px) {
    section.section.is-large{
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}
/* Base - End */

/* ---------------------- */
/* Components - Start */
/* ---------------------- */
/* Buttons */
.page-catalog-product,
.page-catalog-category,
.page-shoppingcart-cart{
    
    & .catfish-button:not(.is-danger, .continueshoppingbutton, .deletecartbutton, .is-outlined){
        background-color: var(--Accent-color) !important;

        &:hover{
            background-color: var(--Button-color) !important;
        }
    }
}

.catfish-button,
.button,
a{
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
}


.catfish-button,
.button{
    font-weight: 700;
    background-color: var(--Button-color) !important;
    color: var(--White-color) !important;
    font-size: 0.875rem !important;
    text-transform: uppercase;
    border: none;

    &:hover{
        background-color: var(--Button-hover-color) !important;
    }

    &:focus,
    &:active{
        border: none;
    }
    
}

h2.has-style-custom-1{
    font-size: 3.625rem !important;
    font-weight: 900;

    @media screen and (max-width: 1087px) {
        font-size: 3.125rem !important;
    }
}

.has-text-custom-1{
    color: var(--Tertiary-color) !important;
}

.has-text-weight-heavy{
    font-weight: 900;
}

p.has-style-custom-1{
    font-size: 1.125rem;
    font-weight: 500;
}

.has-background-blue{
    background-color: #2373b9;
}

.is-linked-button{

    & li{  
        position: relative;
        z-index: 3;

        & a{
            font-size: .825rem;
            font-weight: 900;

            &::before{
                font-family: "FontAwesome";
                content: "\f138";
                width: 1.5rem;
                height: 1.5rem;
                color: var(--Button-color);
                font-size: 1.2rem;
                font-weight: 700;
                display: inline-block;
                position: absolute;
                top: -0.1rem;
                right: -2.2rem;
                transition: .3s;
                -webkit-transition: .3s;
                -moz-transition: .3s;
                -ms-transition: .3s;
                -o-transition: .3s;
            }

        }

        &:hover{

            & a,
            & a::before{
                color: var(--Button-hover-color);
            }
        }
    }
}

.is-icon-list{
    --icon-space: 1.3em;
    list-style: none;
    padding: 0;

    li{
        padding-left: var(--icon-space);
    }

    li:before {
        content: "\f00c"; /* FontAwesome Unicode */
        font-family: FontAwesome;
        font-weight: 600;
        color: var(--Accent-2-color);
        display: inline-block;
        margin-left: calc( var(--icon-space) * -1 );
        width: var(--icon-space);
      }

}

.border-left-primary {
    border-left: 6px solid var(--Tertiary-color);
    border-radius: 0;
    padding: 0 0 0 1rem;
}

.bordered-box-blue{
    border: 2px solid;
    border-width: var(--Border-width);
    border-style: dashed;
    border-color: var(--Border-color-1);
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}

.bordered-box-brown{
    border: 2px solid;
    border-width: var(--Border-width);
    border-style: dashed;
    border-color: var(--Border-color-2);
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}

.is-border-radius-left{
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.is-border-radius-right{
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

.is-border-radius-bottom{
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}

.is-border-radius-top{
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

@media screen and (max-width: 1087px) {
    .is-column-reverse-tablet .columns{
        flex-direction: column-reverse;
    }
    
}

.overlay:before{
    content: '';
    background-color: rgba(255,255,255,.97);
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

ul.page-navigation{
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    
    & li:first-child{
        position: relative;
    }

    & li:first-child a::before{
        content: '/';
        width: 1rem;
        height: 1rem;
        display: inline-block;
        position: absolute;
        top: 0;
        right: -1.2rem;
    }

    & a{
        color: var(--Text-color);
    }

    @media screen and (max-width: 1087px) {
        margin-left: 0 !important;

        & li:not(:first-child){
            margin-left: 0 !important;
        }
    }
}

.image-block img{
    width: 44rem;
    height: 32rem;
}

.section-accordion{
    & .accordion-item{
        border: 1px solid var(--Border-default-color);
    }

    & .button.accordion-title{
        background-color: transparent !important;
        border-radius: 0;
        color: var(--Primary-color) !important;
        margin: 0 !important;
    }
    
    & .button.accordion-title:last-child{
        border: 1px solid var(--Border-default-color);
    }

    & i{
        color: var(--Button-color) !important;
    }

    & .accordion-item.is-active{
        & .button.accordion-title{
            margin-bottom: 0;
            border-bottom: 1px solid var(--Border-default-color);
        }

        & .accordion-content{
            border-top: unset;
            padding-bottom: 1rem;
        }

    }
}

@media screen and (max-width: 900px) and (min-width: 768px) {
    .padding-bottom-large-tablet{
        padding-bottom: 6rem !important;
    }
}

@media screen and (max-width: 768px) {
    .image-block-mobile{
        width: 100%;
        min-width: 100%;
    }
    
    .is-flex-direction-column-mobile{
        flex-direction: column;
    }
}
/* Animations */
.growandfade-animation{
    animation: growAndFadeIn 2s;
    -webkit-animation: growAndFadeIn 2s;
}

/* Scroll animation */

.slide-left-animation{
    transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    opacity: 0;
    transition: opacity 1s ease, transform 2s ease;
    -webkit-transition: opacity 1s ease, transform 2s ease;
    -moz-transition: opacity 1s ease, transform 2s ease;
    -ms-transition: opacity 1s ease, transform 2s ease;
    -o-transition: opacity 1s ease, transform 2s ease;
}

.slide-left-animation.animate{
    opacity: 1;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
}

.slide-right-animation{
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    opacity: 0;
    transition: opacity 1s ease, transform 2s ease;
    -webkit-transition: opacity 1s ease, transform 2s ease;
    -moz-transition: opacity 1s ease, transform 2s ease;
    -ms-transition: opacity 1s ease, transform 2s ease;
    -o-transition: opacity 1s ease, transform 2s ease;
}

.slide-right-animation.animate{
    opacity: 1;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
}

.scale-animation{
    scale: .2;
    opacity: 0;
    transition: scale 1s ease, opacity .5s ease;
    -webkit-transition: scale 1s ease, opacity .5s ease;
    -moz-transition: scale 1s ease, opacity .5s ease;
    -ms-transition: scale 1s ease, opacity .5s ease;
    -o-transition: scale 1s ease, opacity .5s ease;
}

.scale-animation.animate{
    scale: 1;
    opacity: 1;
}


/* Slide Sequence - Service Section */
.slide-sequence--delay-1{
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    opacity: 0;
    transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    -webkit-transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out, transform 1s ease-in-out;
}

.slide-sequence--delay-2{
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    opacity: 0;
    transition: opacity 1.2s ease-in-out, transform 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out, transform 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out, transform 1.2s ease-in-out;
    -ms-transition: opacity 1.2s ease-in-out, transform 1.2s ease-in-out;
    -o-transition: opacity 1.2s ease-in-out, transform 1.2s ease-in-out;
}

.slide-sequence--delay-3{
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    opacity: 0;
    transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out;
    -webkit-transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out;
    -moz-transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out;
    -ms-transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out;
    -o-transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out;
}

.slide-sequence--delay-4{
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    opacity: 0;
    transition: opacity 1.8s ease-in-out, transform 1.8s ease-in-out;
    -webkit-transition: opacity 1.8s ease-in-out, transform 1.8s ease-in-out;
    -moz-transition: opacity 1.8s ease-in-out, transform 1.8s ease-in-out;
    -ms-transition: opacity 1.8s ease-in-out, transform 1.8s ease-in-out;
    -o-transition: opacity 1.8s ease-in-out, transform 1.8s ease-in-out;
}

.slide-sequence--delay-1.animate,
.slide-sequence--delay-2.animate,
.slide-sequence--delay-3.animate,
.slide-sequence--delay-4.animate{
    opacity: 1;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
}

.opacity-animation{
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
    -webkit-transition: opacity 1.5s ease-in-out;
    -moz-transition: opacity 1.5s ease-in-out;
    -ms-transition: opacity 1.5s ease-in-out;
    -o-transition: opacity 1.5s ease-in-out;
}

.opacity-animation.animate{
    opacity: 1;
}

/* Inputs */


/* Components - End */

/* ---------------------- */
/* ----Layout - Start ----*/
/* ---------------------- */
/* System layout */

/* Header */
/* Navigation */
#main-nav{
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;

    &:hover{
        background-color: var(--Secondary-color);
    }

    & .navbar-item,
    & .navbar-link{
        font-family: 'Nunito', sans-serif;
        font-weight: 700;
    }

    & .navbar-link:not(.is-arrowless)::after{
        transition: .3s;
        -webkit-transition: .3s;
        -moz-transition: .3s;
        -ms-transition: .3s;
        -o-transition: .3s;
        border-color: var(--Text-color);
        font-size: .875rem;
        border-width: 3px
    }

    & > .navbar-dropdown{
        left: 1rem;
    }

    & .navbar-dropdown{
        background-color: var(--Secondary-color);
        border: 2px solid var(--Primary-color);
        border-width: var(--Border-width);
        border-style: dashed;
        padding-top: 0;
        padding-bottom: 0;
        border-radius: 12px;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        -ms-border-radius: 12px;
        -o-border-radius: 12px;
       

        & a.navbar-item{
            padding: 1rem 2.5rem 1rem 1.5rem ;

            @media screen and (min-width: 1088px) {
                &:first-child{
                    border-top-right-radius: 12px;
                    border-top-left-radius: 12px;
                }
    
                &:last-child{
                    border-bottom-right-radius: 12px;
                    border-bottom-left-radius: 12px;
                }
            }
        }

        & a.navbar-item:hover{
            background: var(--Button-color) !important;
            color: var(--White-color) !important;
        }
    }

    & .navbar-end{

        & .button.is-small, & .button.is-white {
            background: transparent;
            font-size: 1rem;

            & i{
                font-size: 1rem;
                font-weight: 500;
            }

            &:hover,
            &:active,
            &:focus{
                background: transparent;
            }

            &:focus{
                box-shadow: none;
            }
        }

        & .basket-link{
            padding-left: 1.75rem;
            padding-right: 1.75rem;
        }

        & .button{
            animation: growAndFadeIn 2s;
            -webkit-animation: growAndFadeIn 2s;
        }
    }

    @media screen and (max-width: 1087px) {
        & .has-two-dropdowns{

            &  .first-column{
                border-bottom: unset;
            }

            &  .second-column{
                border-top: unset;
            }
            
            
        }
    }

    @media screen and (max-width: 1550px) {
        .navbar-item, .navbar-link{
            font-size: .875rem;
        }

        .navbar-link:not(.is-arrowless){
            padding-right: 2.25em;
        }

    }

    @media screen and (max-width: 1360px) {
        
        .navbar-link:not(.is-arrowless, .contains-second-tier){
            padding-right: 2em;
            padding-left: 1rem;
        }

        a.navbar-item{
            padding-left: 1rem;
            padding-right: 1rem;
        }

        .navbar-link:not(.is-arrowless, .contains-second-tier)::after{
            right: .4em !important;
        }

        .navbar-item.is-hidden-touch{
            padding: .5rem .75rem;
        }

        .button{
            padding-left: 1.25rem;
            padding-right: 1.25rem;
            font-size: .825rem !important;
        }
    }

    @media screen and (max-width: 1279px) and (min-width: 1200px){
        .navbar-item, .navbar-link{
            font-size: .875rem;
        }

        a.navbar-item{
            padding-left: 1rem;
            padding-right: 1rem;
        }

        .navbar-link:not(.is-arrowless, .contains-second-tier){
            padding-right: 1.5em;
            padding-left: 1rem;
        }

        .navbar-item.is-hidden-touch{
            padding: .5rem;
        }
        .buttons:not(.is-fullwidth) .button:not(:last-child) {
            margin-right: .25rem;
        }
    }

    @media screen and (max-width: 1199px) and (min-width: 1088px){
        .navbar-brand > .navbar-item{
            padding-left: .5rem;
            padding-right: .5rem;
        }

        .navbar-item, .navbar-link{
            font-size: .825rem;
        }

        a.navbar-item{
            padding-left: .5rem;
            padding-right: .5rem;
        }

        .navbar-link:not(.is-arrowless, .contains-second-tier){
            padding-right: 2em;
            padding-left: .75rem;
        }

        .navbar-item .button {
            height: 2.5rem;
            padding-left: 1rem;
            padding-right: 1rem;
        }

        .navbar-item .button.basket-link{
            padding-left: 1.35rem;
            padding-right: 1.35rem;
        }
    }

    @media  screen and (min-width: 1088px) {
        & .first-column{
            width: 10rem;
        }
    
        & .second-column{
            margin-left: 120%;
            width: 10rem;
        }
    }

    @media  screen and (max-width: 1088px){
        & .navbar-group{
            & i{
                font-weight: 500;
            }
        }

        .navbar-dropdown.second-tier-dropdown{
            border:unset;
        }
    }
}

@media screen and (max-width: 1087px) {
    #main-nav,
    #main-navbar{
        background-color: var(--Secondary-color);
    }
}

.nav-search-container{
    background-color: #FFF8F0E8;

    & .searchbutton{
        height: 3.15em;
    }
}

/* Footer */
.ict-dedicated-footer {
  background-color: var(--Tertiary-color);
  display: flex;
  justify-content: space-between;

  & .first-column img {
    max-width: 150px;
    height: auto;
    display: block;
  }

  & .footer-columns {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }

  & .column {
    flex: 1;
    min-width: 0;
    padding: 1rem;
  }

  & .first-column {
  flex: 0 1 40%;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  gap: 0rem; 
}

  @media screen and (max-width: 767px) {
    & .footer-columns {
      flex-wrap: wrap;
    }

    & .column {
      width: 50%;
      flex: 1 1 50%;
    }
  }

  @media screen and (max-width: 475px) {
    text-align: center;

    & .column {
      width: 100%;
      flex: 1 1 100%;
    }

    & li {
      display: flex;
      justify-content: center;
    }

    & li a {
      justify-content: center;
    }
  }
}


.footer-ribbon-banner{

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

        & .column:first-child{
            margin-top: 2rem;
        }
        
        & ul{
            justify-content: center !important;
        }

        & .column:nth-child(2){
            justify-content: center !important;
        }
    }


}

.payment-icons{

    & > .block{
        margin-bottom: 0;
    }

    & .payment-icon{
        display: flex;
    }

    & img{
        object-fit: contain;
    }
}

/* Homepage */
section.main-banner{
    background-position: 90%;
    animation: fade-in 4s;
    -webkit-animation: fade-in 4s;
    animation-duration: all 5s;


    & p{
        font-size: 1.125rem;
        font-weight: 500;
    }

    & .ict-space{
        display: none;
    }

    & h2.growandfade-animation{
        animation: growAndFadeIn 2s;
        -webkit-animation: growAndFadeIn 2s;
    }

    & .button.scalefromleft-animation{
        transform-origin: left;
        transform: scaleX(0);
        animation: scaleIn 1.5s ease forwards;
        -webkit-animation: scaleIn 1.5s ease forwards;
    }

    @media screen and (max-width: 1087px) {
        padding-top: 3rem;
        padding-bottom: 3rem;
        text-align: center;
        background-position: center top;
        background-size: 100%;

        & .column{
            width: 100%;
        }

        & .ict-space{
            display: block;
        }

        & h2:nth-child(7){
            margin-top: 1rem;
        }
    }

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

        & .ict-space{

            & br:nth-child(3){
                display: none;
            }
        }

        & .ict-buttons{
            max-width: 100%;
            width: 100%;
        }

        & .button{
            width: 100%;
        }
    }
}

@keyframes fade-in {

    from{
        opacity: 0;
    }

    to{
        opacity: 1;
    }
}

@keyframes growAndFadeIn {
    0% {
        scale: 0;
        opacity: 0;
    }

    100% {
        scale: 1;
        opacity: 1; 
    }
}

@keyframes scaleIn {
    0% {
        transform: scaleX(0);
    }

    100% {
        transform: scaleX(1);
    }
}

/* Growth Section */
section.growth-box-template{

    @media screen and (max-width: 1087px) {
        padding-top: 3rem !important;
    }

    & .growth-block{
        background-color: var(--Grey-light-color);
        padding: 2rem;
        border: 2px solid;
        border-width: var(--Border-width);
        border-style: dashed;
        border-color: var(--Border-color-1);
        border-radius: 12px;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        -ms-border-radius: 12px;
        -o-border-radius: 12px;

        & li{  
            position: relative;
            z-index: 3;

            & a{
                font-size: .825rem;
                font-weight: 900;
            }
        }
    }

    & .growth-block--image::before{
        content: '';
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 0;
    }

    & .growth-block--image.growth-block--left::before{
        background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/two.png') no-repeat;
        background-position: right;
    }

    & .growth-block--image.growth-block--right::before{
        background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/one.png') no-repeat;
        background-position: right;
    }
   
    & .growth-block--image.growth-block--third::before{
        background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/child-measurement-equipment.png') no-repeat;
        background-position: right; 
    }
    
    & .growth-block--image.growth-block--fourth::before{
        background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/growth-charts.png') no-repeat;
        background-position: right; 
    }

    & .growth-block--image.growth-block--firth::before{
        background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/Perinatal-Notesf.png') no-repeat;
        background-position: right; 
    }

    & .growth-block--image.growth-block--sixth::before{
        background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/MiRecord-lkjn.png') no-repeat;
        background-position: right; 
    }

}

.quality-care-section{

    @media screen and (max-width: 767px) {
        .ict-space:nth-child(2),
        .ict-space:nth-child(5){
            display: none;
        }
    }

    @media screen and (max-width: 475px) {
        .ict-space:nth-child(1),
        .ict-space:nth-child(4){
            display: none;
        }
    }
}

/* Homepage Cards */
.bestsellers{
    
    @media screen and (min-width: 1088px) {
        & h3.title{
            text-align: left !important;
        }
    }
}

.listWrapper{
    justify-content: center;

    & .listItem{
        width: 33.333333%;
        text-align: center;
        padding: .75rem;

        @media screen and (max-width: 767px) {
            width: 50%;
        }

        @media screen and (max-width: 600px) {
            width: 100%;
        }
    }

    & .product-item--info{
        padding-top: 1rem !important;
    }

    & a{
        color: var(--Text-color);
    }

    & .alternate--prices{

        & .flex-container{
            justify-content: center !important;
        }
    }

    & .buttons,
    & .level-item{
        justify-content: center;
    }

    & input{
        width: 50% !important;

        @media screen and (max-width: 1087px) {
            width: 70% !important;
        }

        @media screen and (max-width: 767px) {
            width: 50% !important;
        }

    }
}

.homepage-large-products .item-box{
    @media screen and (min-width: 1088px) {
        height: 90%;
    }
}

.item-box {

    @media screen and (min-width: 1088px) {
        height: 85%;

        .product-item--info{
            transition: transform .3s;
            -webkit-transition: transform .3s;
            -moz-transition: transform .3s;
            -ms-transition: transform .3s;
            -o-transition: transform .3s;
            height: 35%;
            transform: translateY(0);
            -webkit-transform: translateY(0);
            -moz-transform: translateY(0);
            -ms-transform: translateY(0);
            -o-transform: translateY(0);
            background-color: var(--White-color);
            justify-content: flex-start !important;
            
            & .product-item--actions.add-info{
                opacity: 0;
                transition: .2s;
                -webkit-transition: .2s;
                -moz-transition: .2s;
                -ms-transition: .2s;
                -o-transition: .2s;
            }
        }

        &:hover{
            height: 100%;
            
            & .product-item--info{
                transform: translateY(-25%);
                -webkit-transform: translateY(-25%);
                -moz-transform: translateY(-25%);
                -ms-transform: translateY(-25%);
                -o-transform: translateY(-25%);
                

                & .product-item--actions.add-info{
                    opacity: 1;
                }

            }
        }
    }
}

.page-home-index .item-box{
    @media screen and (min-width: 1088px){
        height: 100%;
    }

    .product-item--info{
        transition: unset;
        -webkit-transition: unset;
        -moz-transition: unset;
        -ms-transition: unset;
        -o-transition: unset;
        height: 35%;
        transform: unset;
        -webkit-transform: unset;
        -moz-transform: unset;
        -ms-transform: unset;
        -o-transform: unset;
        background-color: var(--White-color);
        justify-content: space-between !important;
    
        & .product-item--actions.add-info{
            opacity: 1;
        }
    }
}

.page-home-index .homeFeaturedCategoriesWrapper .item-box,
.arone-category-page .sub-category-grid .item-box {
    height: 100%;
}

.sub-category-item{

    & .category-title{
        transform: translateY(0) !important;
        -webkit-transform: translateY(0) !important;
        -moz-transform: translateY(0) !important;
        -ms-transform: translateY(0) !important;
        -o-transform: translateY(0) !important;
        background-color: var(--White-color);
        width: 101%;
    }
    
    & img{
        object-fit: contain !important;
    }

    &:hover{

        & .category-title{
            transform: translateY(-20%) !important;
            -webkit-transform: translateY(-20%) !important;
            -moz-transform: translateY(-20%) !important;
            -ms-transform: translateY(-20%) !important;
            -o-transform: translateY(-20%) !important;
            border-bottom-left-radius: 12px;
            border-bottom-right-radius: 12px;
            padding: 3rem 1rem 3rem 1rem !important;
            width: 101%;
        }
    }
}

/* Our Service */
.service-overlay:before{
    content: '';
    background-color: rgba(255,255,255,.97);
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

.service-block{
    padding: 2.5rem;
    padding-left: 8rem;
    border: 2px solid transparent;
    border-style: dashed;
    border-width: var(--Border-width);
    transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    -webkit-transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    position: relative;


    @media screen and (max-width: 475px){
        padding-left: 2.5rem;
        padding-top: 6rem;
        text-align: center; 

        & .has-text-left{
            text-align: center !important; 
        }
    }

    & > .block{
        margin-bottom: .25rem !important;

        & ul.ict-list{
            @media  screen and (min-width: 1088px) {
                display: block;
                width: 75%;
            }
        }
        
        & a{
            font-family: 'Nunito', sans-serif;
            font-weight: 900;
        }
    }

    & p{
        font-weight: 700;
    }
}

.service-block--brown{
    &:hover{
        border-color: var(--Border-color-2);
    }
}

.service-block--blue.has-background-custom-1{
    background-color: var(--Grey-light-box-color);
    border: 2px solid var(--Border-color-1);
    border-style: dashed;
    border-width: var(--Border-width);
    
    & ul.ict-list{

        & a{
            color: var(--Primary-color);
        }
        
    }

    & p{
        color: var(--Primary-color);
    }

    &:hover{
        border-color: var(--Button-color);
    }
}

.service-block--icon.icon-1::before,
.service-block--icon.icon-2::before,
.service-block--icon.icon-3::before,
.service-block--icon.icon-4::before{
    content: '';
    width: 4rem;
    height: 4rem;
    display: inline;
    position: absolute;
    top: 2.5rem;
    left: 2.5rem;
}

@media screen and (max-width: 475px) {
    .service-block--icon.icon-1::before,
    .service-block--icon.icon-2::before,
    .service-block--icon.icon-3::before,
    .service-block--icon.icon-4::before{
        width: 100%;
        top: 1.5rem;
        left: 0;
    }
}

.service-block--icon.icon-1::before{
    background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/Icon1.png') no-repeat;
    background-position: center;
}

.service-block--icon.icon-3::before{
    background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/ivgycvgu.png') no-repeat;
    background-position: center;
}

.service-block--icon.icon-2::before{
    background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/khvkgv.png') no-repeat;
    background-position: center;
}

.service-block--icon.icon-4::before{
    background: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/ljbvkef-ve.png') no-repeat;
    background-position: center;
}

/* Our partners */
.has-border{
    border: 2px solid hsla(0,0%,7%,.11) !important;
    background-color: var(--White-color);
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media screen and (min-width: 900px) {
    .has-border{
        width: 16% !important;
        height: 50%;
        margin: 0 1rem;
    }
}

@media screen and (max-width: 899px) and (min-width: 768px) {
    .has-border{
        width: 40% !important;
        height: 30%;
        margin: 0 1rem 1rem 0;
    }
}

@media screen and (max-width: 767px) {
    .has-border{
        margin: 0 0rem 1rem 0rem;
        justify-content: center;

        & .is-inline-block{
            display: flex !important;
            justify-content: center;
        }

        & .ict-image.image{
            width: 12rem;
        }

        & img{
            height: 5rem;
            object-fit: contain;
        }
    }
}

.has-border:nth-child(4){
    background-color: #2373b9;
}


/* Image slider */
.custom-image-slider li{

    & .container{
        padding-left: 16px;
        padding-right: 16px;
    }
    
    & .columns{
        align-items: flex-start;
    }
}

.flex-control-paging li a{
    width: .75rem;
    height: .75rem;
    background-color: var(--Swiper-bullet-color) !important;

    &:hover{
        background-color: var(--Button-color) !important;
    }
}


/* Layout - End */

/* ---------------------- */
/* -----Admin Pages - Start-----*/
/* ---------------------- */
/* Category page */
.section.breadcrumb-section{
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    position: relative;

    & li a{
        color: var(--Primary-color);

        &:hover{
            color: var(--Button-color);
        }
    }

    & li + li::before{
        color: var(--Primary-color);
    }

    & li:first-child a{
        
        font-weight: 700;
    }
}

.page-catalog-category .hero{
    background-color: transparent;
    
    & h1.title{
        color: var(--Primary-color)
    }
}

.page-catalog-category .section.breadcrumb-section{
    background-image: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/pattern-.png');
    background-size: 100%;
}

.page-catalog-category .section.breadcrumb-section::before{
    content: '';
    width: 100%;
    height: 100%;
    background-color: #d6d8ff78;
    position: absolute;
    top: 0;
    left: 0;
}

/* Sub Categories */
.slide-block--1{
    background-color: #fff;
    transition: opacity 1s ease-in-out, transform 2s ease-in-out;
    -webkit-transition: opacity 1s ease-in-out, transform 2s ease-in-out;
    -moz-transition: opacity 1s ease-in-out, transform 2s ease-in-out;
    -ms-transition: opacity 1s ease-in-out, transform 2s ease-in-out;
    -o-transition: opacity 1s ease-in-out, transform 2s ease-in-out;
}


.slide-block--2{
    background-color: var(--Grey-light-box-color);
    transition: opacity 1s ease-in-out, transform 2s ease-in-out;
    -webkit-transition: opacity 1s ease-in-out, transform 2s ease-in-out;
    -moz-transition: opacity 1s ease-in-out, transform 2s ease-in-out;
    -ms-transition: opacity 1s ease-in-out, transform 2s ease-in-out;
    -o-transition: opacity 1s ease-in-out, transform 2s ease-in-out;
}

/* Product Landing */
.page-catalog-product .section.breadcrumb-section{
    background-image: url('/00000000-0000-0000-0000-000000000000/Handler/CSSOverride/GetImage/89/pattern-board-.png');
    background-size: 100%;
}

.page-catalog-product .section.breadcrumb-section::before{
    content: '';
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, .60);
    position: absolute;
    top: 0;
    left: 0;
}

/* Review */
.review-wrapper.box.is-light{
    background: var(--Grey-light-box-color);
}


/* Basket Page */
.shoppingcart__wrapper, .order-summary-body{

    & .cartform{

        & label{
            color: var(--Text-color);
        }

        & .cart-item-row{
            border-top: 2px solid hsla(0,0%,7%,.11) !important;
            border-radius: 0 !important;
            -webkit-border-radius: 0 !important;
            -moz-border-radius: 0 !important;
            -ms-border-radius: 0 !important;
            -o-border-radius: 0 !important;
            background-color: transparent !important;
        }

        & .cart-item-row:last-child{
            border-bottom: 2px solid hsla(0,0%,7%,.11) !important;
        } 

    }

    & .cart-item-row{
        @media screen and (min-width: 1471px) {
            & .cart--actions{
                flex: 0 0 10%;
           }
    
            & .productpicture{
                flex: 0 0 20%;
            }

            & .product{
                flex: 1 0 25% !important;
            }

            & .cart--quantity,
            & .cart--itemtotal{
                flex: 1 0 10%;
            }
        }

        @media screen and (max-width: 1470px) {
            & .productpicture{

                & .shopping-cart__product__images{
                    display: flex;
                    justify-content: center;
                }
            }

            & .product,
            & .cart--unitprice,
            & .cart--quantity,
            & .end.cart--itemtotal,
            & .cart-label-header {
                text-align: center;

                & .product__quantity{
                    display: flex;
                    justify-content: center;
                }
            }

            & .rawAttributeInfo__item{

                & .title{
                    text-align: right;
                    flex-basis: 46% !important;
                }

                & .separator{
                    margin: 0 .5rem;
                }

                & .value{
                    text-align: left;
                }
            }
        }
    }

    & .cart-item-row  .product{

        & .rawAttributeInfo__item {
            display: flex;
            font-size: .833em;
        }
        
        & .rawAttributeInfo__item:not(:first-child) {
            margin-top: .5rem;
        }
        
        & .rawAttributeInfo__item:not(:first-child) .title {
            margin-top: 0;
        }
        
        & .rawAttributeInfo__item span.title {
            flex-shrink: 0;
            flex-basis: auto;
            font-size: .975em;
            font-weight: 600;
        }
        
        & .rawAttributeInfo__item .separator {
            margin-right: .5rem;
            margin-left: .2rem;
        }    
    }

    & .cart-footer{
        
        & .cart-footer__container{
            border: var(--Border-default);
            padding: 1rem;
        }

        & .coupon-box{
            border-bottom: 2px solid hsla(0,0%,7%,.11) !important;
            padding: 0  0 1.5rem 0;
        }

        & tr.cart_total--tax{
            border-bottom: 2px solid hsla(0,0%,7%,.11) !important;
            padding-bottom: 1rem;
           
            & td{
                padding-bottom: 1rem;
            }
        }

        & tr.cart_total--order-total{

            & td{
                padding-top: 1rem;
            }
        }

        & .cart_total_left{
            
            & span{
                color: var(--Text-color);
            }
        }
    }

   & .common-buttons{

        @media screen and (max-width: 1470px) {
            justify-content: center;
        }
        
   }
}


/* Checkout */
.checkout-page{

    & .step-title{

        & h2{
            color: var(--Primary-color);
        }
    }
}

/* Delivery Method */
.one-page-checkout #opc-shipping_method .shipping-options .shipping-options__list .shipping-option-item input:checked + label .ui-button-text{
    color: var(--Primary-color);
}

/* Order Summary */
.order-summary-body{

    & .cartform{

        & label{
            color: var(--Text-color);
        }

        /* & .cart-item-row{
            background-color: var(--Tertiary-Light-color) !important;
            border: var(--Border-default) !important;
        } */

    }
}

/* Admin Page */
.block-account-navigation{
    & li{

        &:hover{
            
            & a{
                background-color: var(--Button-color);
                color: var(--White-color);
            }
        }
    }

    & a.active{
        background-color: var(--Accent-color);
    }
}

/* Order Item */
#OrderLineItemGrid{

    & .t-grid-bottom{

        & .t-link,
        & .t-link:active{
            background: var(--Button-color);
            color: var(--White-color);
            border: none;

            &:hover,
            &:focus{
                background: var(--Button-hover-color);
                
            }
        }

        & .t-link.t-state-disabled{
            background-color: hsla(0,0%,7%,.11);
            color: hsla(0,0%,7%,.11);
        }
    }
}

/* Admin Pages - End */

/* ---------------------- */
/* -----Topic Pages - Start-----*/
/* ---------------------- */
/* About */
.title-with-img > .block{
    margin-bottom: 0;
}

/* Topic Pages - End */

/* ---------------------- */
/* -----Responsiveness----*/
/* ---------------------- */

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

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

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

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

@media only screen and (max-width: 320px) {
    
}
/* Responsiveness - End */

/* Two tier column */
/* Two tier menu NEW APPROACH */
.two-tier-menu-item>.navbar-dropdown a.navbar-link {
    font-size: .875rem;
}

.two-tier-menu-item>.navbar-dropdown>a.navbar-link.single-tier:after {
    display: none;
}

.navbar-dropdown.second-tier-dropdown a:hover{
    background: transparent;
}

@media screen and (min-width:1088px) {

    .two-tier-menu-item>.navbar-dropdown>.second-tier-dropdown-inner {
        padding-left: 0;
        position: relative;
    }

    .two-tier-menu-item>.navbar-dropdown>.navbar-link {
        padding-top: 0.375rem;
        padding-bottom: 0.375rem;
    }

    .two-tier-menu-item  > .navbar-dropdown{
        white-space: nowrap;
    }

    .navbar-item.second-tier-dropdown-inner {
        padding-top: 0rem;
        padding-bottom: 0rem;
        padding-right: 0;
    }

    .navbar-item.second-tier-dropdown-inner>.navbar-link {
        display: flex;
        justify-content: space-between;
    }

    .navbar-item.is-hoverable:hover .navbar-dropdown.second-tier-dropdown {
        position: absolute;
        top: 0;
        left: 100%;
        display: none;
    }

    .navbar-item.is-hoverable:hover .second-tier-dropdown-inner:hover .navbar-dropdown.second-tier-dropdown {
        display: block;
    }

    .navbar-item.is-hoverable .second-tier-dropdown-inner .contains-second-tier{
        width: 100%;
    }

    .navbar-link.single-tier {
        padding: 1rem 2.5rem 1rem 1.5rem !important;
    }

    .navbar-link.single-tier:first-child{
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }

    .navbar-link.single-tier:last-child{
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
    }

    .navbar-link.single-tier:hover{
        background-color: var(--Button-color);
        color: var(--White-color);
    }

    .navbar-item .contains-second-tier {
        padding: 1rem 2.5rem 1rem 1.5rem;
    }

    .navbar-item .contains-second-tier:hover,
    .navbar-item .contains-second-tier:active{
        background-color: var(--Button-color);
        color: var(--White-color);
    }

    .navbar-item .contains-second-tier:hover::after{
        border-color: var(--White-color) !important;
    }

    .navbar-dropdown .second-tier-dropdown-inner:hover > a{
        background: var(--Button-color);
        color: var(--White-color);
    }

    .navbar-dropdown.second-tier-dropdown{
        left: 100%;
        top: 0;
    }

    .navbar-item.is-hoverable .second-tier-dropdown-inner .contains-second-tier:after {
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transition: 0.15s;
        -webkit-transition: 0.15s;
        -moz-transition: 0.15s;
        -ms-transition: 0.15s;
        -o-transition: 0.15s;
    }

    .navbar-item.is-hoverable .second-tier-dropdown-inner:hover .contains-second-tier:after {
        transform: rotate(-135deg);
        -webkit-transform: rotate(-135deg);
        -moz-transform: rotate(-135deg);
        -ms-transform: rotate(-135deg);
        -o-transform: rotate(-135deg);
    }

}

@media screen and (max-width:1087px) {
    .navbar-item.has-dropdown.two-tier-menu-item.is-active .navbar-dropdown .second-tier-dropdown-inner:not(.is-active) .navbar-dropdown {
        max-height: 0;
        opacity: 0;
        pointer-events: none;
        padding-top: 0;
        padding-bottom: 0;
        transition: all 0.3s;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -ms-transition: all 0.3s;
        -o-transition: all 0.3s;
    }

    .navbar-item.has-dropdown.two-tier-menu-item.is-active .navbar-dropdown .second-tier-dropdown-inner.is-active .navbar-dropdown {
        max-height: 200rem;
        opacity: 1;
        pointer-events: all;
    }

    .navbar-item.has-dropdown.two-tier-menu-item.is-active .navbar-dropdown .second-tier-dropdown-inner:not(.is-active) .navbar-link:not(.is-arrowless)::after {
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transition: 0.15s;
        -webkit-transition: 0.15s;
        -moz-transition: 0.15s;
        -ms-transition: 0.15s;
        -o-transition: 0.15s;
    }

    .navbar-item.has-dropdown.two-tier-menu-item.is-active .navbar-dropdown .second-tier-dropdown-inner.is-active .navbar-link:not(.is-arrowless)::after {
        transform: rotate(135deg);
        -webkit-transform: rotate(135deg);
        -moz-transform: rotate(135deg);
        -ms-transform: rotate(135deg);
        -o-transform: rotate(135deg);
    }

    .second-tier-dropdown-inner>span.mobile-dropdown-toggle {
        width: 4rem;
    }

    .navbar-item.has-dropdown.two-tier-menu-item.is-active .navbar-dropdown .second-tier-dropdown-inner:not(.is-active) .navbar-item {
        max-height: 0;
        margin: 0;
    }

    .navbar-item.has-dropdown.is-hoverable.two-tier-menu-item.is-active>.navbar-dropdown>.navbar-item {
        margin-bottom: 0;
    }
}