/* ==================================
   BREADCRUMB
================================== */

/*.breadcrumb{*/
/*    background:#f8faff;*/
/*    border-bottom:1px solid #edf2ff;*/
/*}*/

.breadcrumb{
    display:inline-block;
    width: auto;
    /*width:100%;*/
    background:rgba(255,255,255,.12);
    /*background:#0b5fff;*/
    color:#fff;
    padding:10px 18px;
    border-radius:30px;
    font-size:13px;
    font-weight:600;
    /*margin-bottom:25px;*/
}

.breadcrumb-wrapper{

    display:flex;
    align-items:center;
    gap:12px;

    min-height:30px;
}

.breadcrumb-home,
.breadcrumb-parent{

    display:flex;
    align-items:center;
    gap:8px;

    color:#0B5FFF;
    /*color:#ffffff;*/

    font-size:14px;
    font-weight:600;

    transition:.3s;
}

.breadcrumb-home:hover,
.breadcrumb-parent:hover{

    color:#071C63;
    /*color:#ffffff;*/
}

.breadcrumb-arrow{

    color:#b8c2d8;
    /*color:#ffffff;*/
    font-size:12px;
}

.breadcrumb-current{

    color:#667085;
    /*color:#ffffff;*/
    font-size:14px;
    font-weight:500;
}

/* ==================================
   TABLET
================================== */

/*@media(max-width:768px){*/

/*    .breadcrumb-wrapper{*/
/*        min-height:20px;*/
/*        gap:8px;*/
/*    }*/

/*    .breadcrumb-home,*/
/*    .breadcrumb-parent,*/
/*    .breadcrumb-current{*/
/*        font-size:13px;*/
/*    }*/
/*}*/

/* ==================================
   MOBILE
================================== */

/*@media(max-width:480px){*/

/*    .breadcrumb-wrapper{*/
/*        flex-wrap:wrap;*/
/*        padding:12px 0;*/
/*    }*/
/*}*/

/* ==================================
   3840px (4K)
================================== */

@media (min-width:3000px){

    .breadcrumb{
        padding:18px 34px;
        border-radius:50px;
    }
    
    .breadcrumb-wrapper{
        gap:18px;
        min-height:50px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:22px;
    }

    .breadcrumb-arrow{
        font-size:18px;
    }
}

/* ==================================
   2560px
================================== */

@media (min-width:2200px) and (max-width:2999px){

    .breadcrumb{
        padding:16px 30px;
    }

    .breadcrumb-wrapper{
        gap:16px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:19px;
    }

    .breadcrumb-arrow{
        font-size:16px;
    }
}

/* ==================================
   1920px
================================== */

@media (min-width:1600px) and (max-width:2199px){

    .breadcrumb{
        padding:12px 22px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:16px;
    }

    .breadcrumb-arrow{
        font-size:14px;
    }
}

/* ==================================
   1440px
================================== */

@media (max-width:1440px){

    .breadcrumb{
        padding:10px 18px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:14px;
    }

    .breadcrumb-arrow{
        font-size:12px;
    }
}

/* ==================================
   1366px
================================== */

@media (max-width:1366px){

    .breadcrumb-wrapper{
        gap:10px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:14px;
    }
}

/* ==================================
   1280px
================================== */

@media (max-width:1280px){

    .breadcrumb{
        padding:9px 16px;
    }

    .breadcrumb-wrapper{
        gap:10px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:13px;
    }
}

/* ==================================
   1024px
================================== */

@media (max-width:1024px){

    .breadcrumb{
        padding:8px 15px;
    }

    .breadcrumb-wrapper{
        gap:8px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:13px;
    }

    .breadcrumb-arrow{
        font-size:11px;
    }
}

/* ==================================
   768px
================================== */

@media (max-width:768px){

    .breadcrumb{
        padding:8px 14px;
    }

    .breadcrumb-wrapper{
        gap:8px;
        min-height:auto;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:12px;
    }

    .breadcrumb-arrow{
        font-size:10px;
    }
}

/* ==================================
   576px
================================== */

@media (max-width:576px){

    .breadcrumb{
        padding:7px 12px;
        border-radius:24px;
    }

    .breadcrumb-wrapper{
        gap:6px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:12px;
    }
}

/* ==================================
   480px
================================== */

@media (max-width:480px){

    .breadcrumb{
        width:100%;
        display:block;
        padding:10px 12px;
    }

    .breadcrumb-wrapper{
        gap:6px;
        line-height:1.6;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:11px;
    }

    .breadcrumb-arrow{
        font-size:10px;
    }
}

/* ==================================
   375px
================================== */

@media (max-width:375px){

    .breadcrumb{
        padding:8px 10px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:10px;
    }

    .breadcrumb-arrow{
        font-size:9px;
    }
}

/* ==================================
   320px
================================== */

@media (max-width:320px){

    .breadcrumb{
        padding:8px;
    }

    .breadcrumb-wrapper{
        gap:5px;
    }

    .breadcrumb-home,
    .breadcrumb-parent,
    .breadcrumb-current{
        font-size:9px;
    }

    .breadcrumb-arrow{
        font-size:8px;
    }
}