/* SITE: ELŐZŐ+KÖVETKEZŐ Teljes szélességű konténer két oldalsó div-vel */
.full-width-container {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
}

.left-content {
    flex: 1;
    text-align: left;
}

.right-content {
    flex: 1;
    text-align: right;
}

.nav-link {
    font-size: 20px;
    color: black;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-block;
    padding: 2px 4px;
    border-radius: 4px;
}

.nav-link:hover {
    text-decoration: underline;
    transform: scale(1.1);
}
/* VÉGE: SITE: ELŐZŐ+KÖVETKEZŐ Teljes szélességű konténer két oldalsó div-vel */

/* Kurzor szerű villogó aláhúzás animáció */
@keyframes cursor-underline {
    0% { 
        text-decoration: underline;
        text-decoration-color: currentColor;
    }
    50% { 
        text-decoration: underline;
        text-decoration-color: currentColor;
    }
    51% { 
        text-decoration: none;
    }
    100% { 
        text-decoration: none;
    }
}
.cursor-underline {
    animation: cursor-underline 1s infinite;
}
/* VÉGE: Kombinált: pulzálás + villogó aláhúzás */

.site-content figure {
    margin: 1.5em 0;
    max-width: 100%;
    display: table;
}

.site-content figure img {
    display: block;
    max-width: 100%;
    height: auto;
}

.site-content figure figcaption {
    display: table-caption;
    caption-side: bottom;
    padding: 0.75em;
    font-style: italic;
    font-size: 0.9em;
    color: #666;
    text-align: center;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-top: none;
    line-height: 1.4;
}


.path_container { 
	height: auto;
}

.site-sub {
    width:1000px;
}

.site-sub img {
    max-width: 100%;
    height: auto;
    margin-top: 10px;
    margin-bottom: 10px;
}

.site-content {
    background-color: #fdffff;
    background-image:
        url("/images/4381/kek-hatter-felso.jpg"),
        url("/images/4382/kek-hatter-also.jpg");
    background-repeat: no-repeat, no-repeat;
    background-position: top right, bottom left;
    background-size: 100% auto, 100% auto;
    padding-bottom: 200px;
    display: flex;
    flex-direction: column; /* Vertikális elrendezés */
    align-items: center; /* Horizontális középre */
    justify-content: center; /* Vertikális középre */
    padding-top: 10px;  /*80+48+20*/
}

.widget-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    grid-gap: 1rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

.widget-card {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.1s, box-shadow 0.1s;
}

.widget-card:hover {
    transform: scaleX(1.01) scaleY(1.01);
    box-shadow: 2px 2px -2px rgba(0,0,0,0.15);
}

.widget-card__image {
    display: flex;
    justify-content: center;
    align-items: center;
}

.widget-card__image img {
    width: 150px;
    height: auto;
    display: block;
}

.widget-card__body {
    flex: 1;               /* stretch to fill card */
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.widget-card__title {
    margin: 0 0 0.5rem;
    font-size: 1.1rem;
    color: #00488d;
}

.widget-card__desc {
    margin: 0;
    color: #666;
    font-size: 10px;
    line-height: 1.4;
    flex: 1;               /* push footer or grow as needed */
}

.clickss {
    text-decoration: none;  /* remove underline */
    color: inherit;         /* inherit the card's text color */
    display: flex;
    flex-direction: column; /* ensure the whole card is clickable */
}

.panel-layout > .panel-grid > .panel-grid-cell ul {
    max-width: 400px;
}

.panel-layout > .panel-grid > .panel-grid-cell {
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 1.0);
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    height: 400px;
}

.panel-layout > .panel-grid > .panel-grid-cell img {
    order: -1;
}

.panel-layout > .panel-grid > .panel-grid-cell p {
    display: flex;
    justify-content: center;
    align-items: center;
}

.panel-layout > .panel-grid > .panel-grid-cell h3 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    margin-bottom: 10px;
}

.otherp {
    display: block !important;
    margin: 0;
}

.otherp2 {
    display: flex !important;
    margin: 0;
}

.download_title_card {
    display: flex;
    justify-content: center;
    align-items: center;
}

.download_title_card > div {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 20px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    width: 700px;
}

.download_title_card span {
    color: black !important;
    text-shadow: 0 0 20px rgba(255, 255, 255, 1);
    font-weight: bold;
}

.download_title_card > p {
    display: flex;
    justify-content: center;
    align-items: center;
}

.download_title_card {
    opacity: 0;
    transform: translateY(20px) scale(1.03);
    filter: blur(8px);
    transition: 
        opacity 0.6s ease-out,
        transform 0.6s ease-out,
        filter 0.6s ease-out;
    /* Tipp a teljesítményhez */
    will-change: opacity, transform, filter;
}

/* Amikor belépünk vele: áttűnés */
.download_title_card.animated {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
}

/* Alapállapot: legyen átlátszó és kissé lentebb tolva */
.panel-grid-cell {
    opacity: 0;
    transform: translateY(20px) scale(1.03);
    filter: blur(8px);
    transition: 
        opacity 0.6s ease-out,
        transform 0.6s ease-out,
        filter 0.6s ease-out;
    /* Tipp a teljesítményhez */
    will-change: opacity, transform, filter;
}

/* Amikor belépünk vele: áttűnés */
.panel-grid-cell.animated {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
}

.panel-grid-cell:hover {
    transform: scale(1.02);
}

.logoo {
	height: 41px;
	padding: 0px;
	opacity: 0.9;
	cursor: pointer;
	z-index: 45;
	pointer-events: auto;
}