/* ==========================================================
   HZ-003 Global Notification Bar v2
========================================================== */


/*
--------------------------------------------------
MAIN BAR
--------------------------------------------------
*/

.hz-bar-v2 {

    width:100%;
    height:62px;

  overflow:hidden; 

    display:flex;
    align-items:center; 

    background:linear-gradient(
        90deg,
        #5f0ebe 0%,
        #7b32ff 55%,
        #b586ea 100%
    );

    color:#ffffff;

    box-shadow:0 2px 10px rgba(0,0,0,.15);

    position:relative;
    z-index:1000;

}








/*
--------------------------------------------------
SLIDER
--------------------------------------------------
*/

.hz-slider{

    position:relative;

    flex:1;
    height:52px;

    overflow:hidden;

}


/*
--------------------------------------------------
SLOTY
--------------------------------------------------
*/

.hz-slot{

    position:absolute;
    left:0;

    width:100%;
    height:52px;

    display:flex;
    justify-content:center;
    align-items:center;

    padding:0 70px 0 20px;

    box-sizing:border-box;

    cursor:pointer;

    color:#ffffff;
    text-decoration:none;

    font-size:18px;
    font-weight:600;

    transition:
    /*    transform .8s ease, */
        text-decoration .3s ease;

}

/* ACTIVE NIE ANIMUJE */

.hz-slot-active{

    opacity:1; 
    transform:translateY(-62px); 

    transition:transform 1.1s ease;

} 


/* NEXT ANIMUJE */

 .hz-slot-next{

    opacity:0;
    transform:translateY(62px);

    transition:transform 1.1s ease;

} 




/* --------------------------------------------------
WYJAZD DO GÓRY
-------------------------------------------------- */

 /*.hz-slot-out{

    opacity:0;
    transform:translateY(-62px);

    transition:transform .8s ease;

} */


/*
--------------------------------------------------
HOVER
--------------------------------------------------
*/

 .hz-slot:hover{

    color:#ffffff;
    text-decoration:underline;

} 




/*
--------------------------------------------------
POZYCJE SLOTÓW
--------------------------------------------------
*/

.hz-slot-prev{

	opacity:0;
  /* transform:translateY(-52px); */

}


.hz-slot-active{

	opacity:1;
   transform:translateY(0); 

}


.hz-slot-next{

	opacity:0;
  /*  transform:translateY(52px); */

}





/*
.hz-slot-prev{
border:3px solid red;
}

.hz-slot-active{
border:3px solid green;
}

.hz-slot-next{
border:3px solid blue;
}
*/






/* ==========================================================
   HZ-002
   Close Button
========================================================== */

.hz-global-notification-close {

    position: absolute;
    right: 0;
    top: 0;

    width: 62px;
    height: 62px;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 22px;
    line-height: 1;

    color: #ffffff;

    cursor: pointer;

    z-index: 10;

    user-select: none;

}

.hz-global-notification-close:hover {

    opacity: .8;

}



/* =========================================
TEST HOVER CSS
========================================= */
/*
.hz-bar-v2:hover .hz-slot-active,
.hz-bar-v2:hover .hz-slot-next {

    transition: none !important;

} */








@media (max-width: 480px){

    .hz-slot{

        font-size:13px;

        padding:0 10 0 15px;

    }

}