.bsb-animated {
    --bsb-animation-duration: 1s;
    animation-duration: var(--bsb-animation-duration);
    animation-fill-mode: both
}

@keyframes bsb-fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.bsb-fadeIn {
    animation-name: bsb-fadeIn
}

@keyframes bsb-fadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.bsb-fadeInUp {
    animation-name: bsb-fadeInUp
}

@keyframes bsb-fadeInDown {
    0% {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.bsb-fadeInDown {
    animation-name: bsb-fadeInDown
}

@keyframes bsb-fadeInLeft {
    0% {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.bsb-fadeInLeft {
    animation-name: bsb-fadeInLeft
}

@keyframes bsb-fadeInRight {
    0% {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.bsb-fadeInRight {
    animation-name: bsb-fadeInRight
}

@keyframes bsb-fadeOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

.bsb-fadeOut {
    animation-name: bsb-fadeOut
}

@keyframes bsb-fadeOutUp {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
}

.bsb-fadeOutUp {
    animation-name: bsb-fadeOutUp
}

@keyframes bsb-fadeOutDown {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
}

.bsb-fadeOutDown {
    animation-name: bsb-fadeOutDown
}

@keyframes bsb-fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
}

.bsb-fadeOutLeft {
    animation-name: bsb-fadeOutLeft
}

@keyframes bsb-fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
}

.bsb-fadeOutRight {
    animation-name: bsb-fadeOutRight
}

@keyframes bsb-zoomIn {
    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
    50% {
        opacity: 1
    }
}

.bsb-zoomIn {
    animation-name: bsb-zoomIn
}

.bsb-overlay {
    --bsb-overlay-opacity: 0.5;
    --bsb-overlay-bg-color: var(--bs-black-rgb);
    position: relative
}

.bsb-overlay:after {
    background-color: rgba(var(--bsb-overlay-bg-color), var(--bsb-overlay-opacity));
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0
}

.bsb-overlay > * {
    position: relative;
    z-index: 1
}

.bsb-overlay-figure {
    --bsb-overlay-figure-opacity: 0.5;
    --bsb-overlay-figure-bg-color: var(--bs-black-rgb);
    position: relative
}

.bsb-overlay-figure:after {
    background-color: rgba(var(--bsb-overlay-figure-bg-color), var(--bsb-overlay-figure-opacity));
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.bsb-overlay-hover {
    --bsb-overlay-hover-opacity: 0.5;
    --bsb-overlay-hover-bg-color: var(--bs-black-rgb);
    position: relative;
    overflow: hidden;


}

.bsb-overlay-hover > a {
    bottom: 0;
    display: block;
    left: 0;
    position: relative;
    right: 0;
    top: 0
}

.bsb-overlay-hover > a > img{
    width: 100%;
    object-fit: cover;
    transition: transform .5s
}


.bsb-overlay-hover > a > img.bsb-scale {
    --bsb-scale: 1
}

.bsb-overlay-hover > a > img.bsb-scale, .bsb-overlay-hover > a > img.bsb-scale-up {
    transform: scale3d(var(--bsb-scale), var(--bsb-scale), var(--bsb-scale));
    transform-style: preserve-3d;
    transition: transform .5s
}

.bsb-overlay-hover > a > img.bsb-scale-up {
    --bsb-scale: 1.2
}

.bsb-overlay-hover > a:after {
    background-color: rgba(var(--bsb-overlay-hover-bg-color), var(--bsb-overlay-hover-opacity));
    content: "";
    cursor: pointer !important;
    display: block;
    z-index: 0
}

.bsb-overlay-hover > a:after, .bsb-overlay-hover > figcaption {
    bottom: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0
}

.bsb-overlay-hover > figcaption {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    pointer-events: none;
    z-index: 1
}

.bsb-overlay-hover > figcaption > * {
    opacity: 0
}

.bsb-overlay-hover:hover > a > img.bsb-hover-scale {
    --bsb-scale-hover: 1;
    transform: scale3d(var(--bsb-scale-hover), var(--bsb-scale-hover), var(--bsb-scale-hover))
}

.bsb-overlay-hover:hover > a > img.bsb-hover-scale-up {
    --bsb-scale-hover: 1.2;
    transform: scale3d(var(--bsb-scale-hover), var(--bsb-scale-hover), var(--bsb-scale-hover))
}

.bsb-overlay-hover:hover > a:after {
    opacity: 1;
    transition: opacity .15s linear
}

.bsb-overlay-hover:hover > figcaption {
    opacity: 1;
    transition: opacity .15s linear .1s
}

.bsb-overlay-hover:hover > figcaption > .bsb-hover-fadeIn {
    --bsb-animation-duration: 500ms;
    animation-duration: var(--bsb-animation-duration);
    animation-fill-mode: both;
    animation-name: bsb-fadeIn
}

.bsb-overlay-hover:hover > figcaption > .bsb-hover-fadeInUp {
    --bsb-animation-duration: 500ms;
    animation-duration: var(--bsb-animation-duration);
    animation-fill-mode: both;
    animation-name: bsb-fadeInUp
}

.bsb-overlay-hover:hover > figcaption > .bsb-hover-fadeInDown {
    --bsb-animation-duration: 500ms;
    animation-duration: var(--bsb-animation-duration);
    animation-fill-mode: both;
    animation-name: bsb-fadeInDown
}

.bsb-overlay-hover:hover > figcaption > .bsb-hover-fadeInLeft {
    --bsb-animation-duration: 500ms;
    animation-duration: var(--bsb-animation-duration);
    animation-fill-mode: both;
    animation-name: bsb-fadeInLeft
}

.bsb-overlay-hover:hover > figcaption > .bsb-hover-fadeInRight {
    --bsb-animation-duration: 500ms;
    animation-duration: var(--bsb-animation-duration);
    animation-fill-mode: both;
    animation-name: bsb-fadeInRight
}

.bsb-overlay-hover:hover > figcaption > .bsb-hover-zoomIn {
    --bsb-animation-duration: 500ms;
    animation-duration: var(--bsb-animation-duration);
    animation-fill-mode: both;
    animation-name: bsb-zoomIn
}


/*===============  CUSTOM   ======================*/
.bsb-project-pro-2-item{
    margin-bottom: 2rem !important;
}
.bsb-overlay-hover > a > img,
.bsb-overlay-hover {
    height: 10rem !important;  ;

}

.bsb-project-pro-2-item figcaption{
    font-size: .813rem !important;
}

.bsb-project-pro-2-item figcaption h4{
    font-size: 1rem !important;

}


@media (max-width: 576px) {

    .bsb-overlay-hover > a > img,
    .bsb-overlay-hover {
        height: 15rem !important;  ;
    }

    .bsb-overlay-hover.card-hg-1,
    .bsb-overlay-hover.card-hg-1 > a > img {
        height: 15rem !important;
    }




    .bsb-overlay-hover.card-hg-2,
    .bsb-overlay-hover.card-hg-2 > a > img {
        height: 15rem !important;
    }





}

@media (min-width: 768px) {

    .bsb-overlay-hover > a > img,
    .bsb-overlay-hover {
        height: 10rem !important;  ;
    }

    .bsb-overlay-hover.card-hg-1,
    .bsb-overlay-hover.card-hg-1 > a > img {
        height: 10rem !important;
    }



    .bsb-overlay-hover.card-hg-2,
    .bsb-overlay-hover.card-hg-2 > a > img {
        height: 5rem !important;
    }




}

@media (min-width: 992px) {

}

@media (min-width: 1200px) {
    .bsb-overlay-hover > a > img,
    .bsb-overlay-hover {
        height: 9rem !important;  ;
    }

    .bsb-overlay-hover.card-hg-1,
    .bsb-overlay-hover.card-hg-1 > a > img {
        height: 12rem !important;
    }



    .bsb-overlay-hover > a > img,
    .bsb-overlay-hover {
        height: 9rem !important;  ;
    }

    .bsb-overlay-hover.card-hg-2,
    .bsb-overlay-hover.card-hg-2 > a > img {
        height: 7rem !important;
    }


}



@media (min-width: 1400px) {

}

.bsb-project-pro-2-item h5{
    margin:.5rem 0 !important;
}

.bsb-project-pro-2-item h5 a {
    font-size: 1rem !important;
    font-weight: 700 !important;
    font-family: inherit;
    text-decoration: none;
    transition: color 0.3s ease-in-out;
}

.bsb-project-pro-2-item h4{
    margin:.5rem 0 0 0  !important;
}

.bsb-project-pro-2-item h4 a {
    font-size: 1rem !important;
    font-weight: 700 !important;
    font-family: inherit;
    text-decoration: none;
    transition: color 0.3s ease-in-out;
}


.bsb-project-pro-2-item .badge{
    font-size: .75rem !important;
    padding: .25rem .75rem !important;
    border-radius: 1rem !important;
    font-weight: 300 !important;
}



.nav-link-1{
    margin-right:1rem !important;
    border: 1px solid;
    border-radius: 1rem;
    font-size: .75rem !important;
    padding: .25rem .75rem !important;
    display: block;
    margin-bottom: .25rem !important;
}



.nav-link-1.green{
    color: var(--color-green-600) !important;
    border-color: var(--color-green-400) !important;

}

.nav-link-1.green.active,
.nav-link-1.green:hover{
    color: var(--color-white) !important;
    background-color: var(--color-green-500) !important;
    border-color: var(--color-green-500) !important;
    transition:  background-color 0.3s ease, border-color 0.3s ease;
}

.bsb-project-pro-2-item p{
    font-size: .813rem !important;
    font-style: italic !important;

}

/* ფერები კლასთან შესაბამისად */
.bsb-project-pro-2-item p,
.bsb-project-pro-2-item h4 a,
.bsb-project-pro-2-item h5.green a {
    color: var(--color-green-500);
}
.bsb-project-pro-2-item h4 a:hover,
.bsb-project-pro-2-item h5.green a:hover {
    color: var(--color-green-600);
}

.bsb-project-pro-2-item .badge.green{
    color: var( --color-green-500) !important;
    background-color: var(--color-green-100) !important;
}


/*============================================================*/




.nav-link-1.primary{
    color: var(--color-primary-600) !important;
    border-color: var(--color-primary-400) !important;

}

.nav-link-1.primary.active,
.nav-link-1.primary:hover{
    color: var(--color-white) !important;
    background-color: var(--color-primary-500) !important;
    border-color: var(--color-primary-500) !important;
    transition:  background-color 0.3s ease, border-color 0.3s ease;
}



/* ფერები კლასთან შესაბამისად */
.bsb-project-pro-2-item p,
.bsb-project-pro-2-item h4 a,
.bsb-project-pro-2-item h5.primary a {
    color: var(--color-primary-500);
}
.bsb-project-pro-2-item h4 a:hover,
.bsb-project-pro-2-item h5.primary a:hover {
    color: var(--color-primary-600);
}

.bsb-project-pro-2-item .badge.primary{
    color: var( --color-primary-500) !important;
    background-color: var(--color-primary-100) !important;
}

/*============================================================*/




.nav-link-1.violet{
    color: var(--color-violet-600) !important;
    border-color: var(--color-violet-400) !important;

}

.nav-link-1.violet.active,
.nav-link-1.violet:hover{
    color: var(--color-white) !important;
    background-color: var(--color-violet-500) !important;
    border-color: var(--color-violet-500) !important;
    transition:  background-color 0.3s ease, border-color 0.3s ease;
}



/* ფერები კლასთან შესაბამისად */
.bsb-project-pro-2-item p,
.bsb-project-pro-2-item h4 a,
.bsb-project-pro-2-item h5.violet a {
    color: var(--color-violet-500);
}
.bsb-project-pro-2-item h4 a:hover,
.bsb-project-pro-2-item h5.violet a:hover {
    color: var(--color-violet-600);
}

.bsb-project-pro-2-item .badge.violet{
    color: var( --color-violet-500) !important;
    background-color: var(--color-violet-100) !important;
}
/*===============================================*/


.clinics-region-card{
    padding-top: .5rem !important;
    border: 1px solid transparent !important;
min-height: 18rem !important;
border-radius: 1rem !important; overflow: hidden

}

.clinics-region-card:hover{
    background-color: var(--color-primary-10) !important;
 border: 1px solid var(--color-primary-50) !important;
}



.clinics-doctor-card{
    padding-top: .5rem !important;
    border: 1px solid transparent !important;

    border-radius: 1rem !important; overflow: hidden

}

.clinics-doctor-card:hover{
    background-color: var(--color-green-50) !important;
    border: 1px solid var(--color-green-100) !important;
}

.clinics-doctor-card .green p,
.clinics-doctor-card .green h4 a{
    color: var(--color-green-500) !important;
}