@font-face {
    font-family:head1;
    src: url("../assets/font1/DTPhudu-Black.otf");
}

@font-face {
    font-family:head1;
    src: url("../assets/font1/DTPhudu-Bold.otf");
}
@font-face {
    font-family:head1;
    src: url("../assets/font1/DTPhudu-Light.otf");
}

@font-face {
    font-family:head1;
    src: url("../assets/font1/DTPhudu-Medium.otf");
}

@font-face {
    font-family:head1;
    src: url("../assets/font1/DTPhudu-Regular.otf");
}

@font-face {
    font-family:para;
    src: url("../assets/font2/Raleway-Black.ttf");
}

@font-face {
    font-family:para;
    src: url("../assets/font2/Raleway-Bold.ttf");
}
@font-face {
    font-family:para;
    src: url("../assets/font2/Raleway-ExtraBold.ttf");
}


@font-face {
    font-family:para;
    src: url("../assets/font2/Raleway-Medium.ttf");
}

@font-face {
    font-family:para;
    src: url("../assets/font2/Raleway-Regular.ttf");
}

p{
    font-family: para;
    font-weight: 600;
}



.link--elara::before {
    transform-origin: 50% 100%;
    transition: clip-path 0.3s, transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
    clip-path: polygon(0% 0%, 0% 100%, 0 100%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%, 100% 100%, 100% 0%);
}

.link--elara:hover::before {
    transform: translate3d(0, 2px, 0) scale3d(1.08, 3, 1);
    clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 50% 0, 50% 0, 50% 100%, 50% 100%, 0 100%, 100% 100%, 100% 0%);
}

.link--elara span {
    display: inline-block;
    transition: transform 0.3s cubic-bezier(0.2, 1, 0.8, 1);
}

.link--elara:hover span {
    transform: translate3d(0, -2px, 0);
}
.link::before,
.link::after {
    position: absolute;
    width: 100%;
    height: 0.5px;
    background: #e6faff;
    top: 100%;
    left: 0;
    pointer-events: none;
}

.link::before {
    content: '';
}

.link:hover .spn{
    color: #e6faff;
}

.icon {
    filter: invert(100%) brightness(200%);
  }
  .cke_notification {
    display: none!important;
}
.dashboardleftmenu a:hover i{
  background-color: #27272A;
}
.form-scroll::-webkit-scrollbar{
    display: none!important;
}
.editorialname::-webkit-scrollbar{
    display: none!important;
}
#pagination button {
    padding: 7px 15px;
    background-color: lightgray;
    border: none;
    border-radius: 4px;
    font-weight: 500;
    cursor: pointer;
}

#pagination button.active {
    background-color:#d8e2e5;
}
#pagination button:hover{
        background-color: darkgray;
}
.overlay-menu{
    background-color: #025a6c8e;
}
#content{
    text-transform: none;
}

#mover::-webkit-scrollbar{
    display: none;
}
#mover {
    width: 100%;
    height: 100%;
    display: flex;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
}

#mover .container {
    display: inline-flex;
    height: 100%;
    justify-content: flex-start;
    gap: 20px;
    flex-shrink: 0;
}

#mover .container img {
    width: 100%;
    height: 80%;
    flex-shrink: 0;
    object-fit: contain;
    object-position: center;
}

#mover .container .elems {
    width: 17vw;
    height: 100%;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
}


#mover2{
    width: 100%;
    /* display: flex; */
    /* width: 20vh; */
    overflow-y: hidden;
    overflow-x: hidden;
    height: 100%;
}

#mover2 .container2{
    flex-shrink: 0;
    width: 100%;
    min-height: 100%;
        animation-name: scroll2;
        animation-timing-function: linear;
        animation-duration: 25s;
        animation-iteration-count: infinite;
        animation-fill-mode: forwards;
    /* justify-content: space-between; */
}

/* #mover2 .container2 .elems{
    min-height: 2vh;
    margin-top: 5px;
 
    padding: 0 4%;
    background-color: green;
}
#mover2 .container2 .elems h3{
    width: 10%!important;
} */

@keyframes scroll2 {
    0%{
        transform: translateY(0);
    }
    100%{
        transform: translateY(-100%);
    }

}
.overlay-issue{
    background-color: rgba(0, 0, 0, 0.461);
}
.overscroll::-webkit-scrollbar{
    display: none;
}


#moverresponse::-webkit-scrollbar{
    display: none;
}
#moverresponse {
    width: 100%;
    height: 100%;
    display: flex;
    white-space: nowrap;
    overflow-x: hidden; /* Changed from auto to hidden for smooth infinite scroll */
    overflow-y: hidden;
    top: 0;
}

#moverresponse .containerresponse {
    display: flex;
    height: 100%;
    gap: 20px;
    justify-content: flex-start; /* Changed from space-between for better spacing */
    margin-left: 20px;
    flex-shrink: 0;
    animation-name: scrollResponsive;
    animation-timing-function: linear;
    animation-duration: 15s; /* Will be dynamically adjusted by JS */
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
}

#moverresponse .containerresponse img {
    width: 100%;
    height: 78%;
    object-fit: contain;
    object-position: center;
}

#moverresponse .containerresponse .elemsresponse {
    /* Adjusted for better mobile and desktop experience */
    width: 80vw;
    max-width: 400px; /* Limits size on large screens */
    height: 100%;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    justify-content: center;
}

@media (max-width: 768px) {
    #moverresponse .containerresponse .elemsresponse {
        width: 90vw; /* Wider on mobile */
    }
}

@keyframes scrollResponsive {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%); /* Will be set correctly by JS */
    }
}
p{
    text-align: justify;
}
h2,
h1,
h3,
h4,
h5
{
text-align: justify;
}