/* jelmagyrazat: pl. m = mobile mt=mobile tablet, i=index, i_b_whitewall --> index-backgroundimage-whitewall*/

html {
    overflow-x: clip;
}

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    cursor: url(assets/cursor.gif), auto;
    scrollbar-color: rgba(0, 0, 0, 0.3) transparent; /* firefox*/
}

*::selection {
  background: rgba(245, 39, 67, 0.69); /* color 5 */
  color: #ffffff;
}
*::-moz-selection {
  background: rgba(245, 39, 67, 0.69); /* color 5 */
  color: #ffffff;
}
*::-webkit-selection {
  background: rgba(245, 39, 67, 0.69); /* color 5 */
  color: #ffffff;
}
*::-webkit-scrollbar-track {
    background: transparent;
}
.kotelezo_heading{
    display: none;
}
@media (min-width: 1025px) { /* desktop 4:3 nál nagyobb */
    /*kapcsolat css */
    .kapcsolat_section, .index_section, .tabor_section{
        top: 60px;
        height: calc(100vh - 60px);
    }
    .kapcsolat_section::before, .index_section::before, .tabor_section::before{
        top: 60px;
        height: calc(100vh - 60px);
    }
    .k_contact_holder{
        margin-top: 0px;
    }
    .mobile{
        display: none !important;
    }
    .kurzusok_section{
        position: fixed;
        top: 60px;
        left: 0;
        width: 100vw;
        height: calc(100vh - 60px);
        display: flex;
        justify-content: center;
        flex-direction: row;
        flex-wrap: nowrap;
        overflow: hidden;
    }
    .kurzusok_maincontent::before{
        height: calc(100vh - 60px);
        top: 60px;
    }
    .kurzusok_sidecontent::before{
        height: calc(100vh - 60px);
    }
    .k_m_card_e_mid{
        height: calc(100% - 70px);
        width: 100%;
        display: flex;
        flex-direction: row;
    }
    .kurzusok_sidecontent{
        left: 0;
    }
}
@media (min-width: 766px){ /*desktop + tablet*/
    
    .tsize_kicsi_5{
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        font-size: clamp(0.9rem, 1vw, 1.1rem);
    }

    .tsize_normal_4{
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        font-size: clamp(1.1rem, 1.1vw, 1.4rem);
    }
    .tsize_alcim_3{
        font-family: "Crimson Pro", serif;
        font-weight: 550;
        font-size: clamp(1.2rem, 1.65vw, 1.5rem);
    }
    .tsize_nagy_title_1{
        font-family: "Crimson Pro", serif;
        font-weight: 700;
        font-size: clamp(1.4rem, 2.3vw, 2.3rem);
    }

    body{
        color: #333;
        line-height: 1.6;
        background-color: #000;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-rendering: optimizeLegibility;
    }
    .navbar{
        position: sticky;
        top: 0;
        width: 100%;
        height: 60px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        z-index: 1000;
        -webkit-box-shadow: 0px 37px 50px -10px rgba(0,0,0,0.77); 
        box-shadow: 0px 10px 20px -10px rgba(0,0,0,0.77);
    }
    .nav-logo{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        padding-left: 5px;
        width: clamp(160px, 24vw, 340px);
        height: 90%;
        border-radius: 1rem;
        flex-shrink: 0;
    }
    .nav-logo a{
        width: 20%;
    }
    .nav-logo img{
        height: 100%;
        width: auto;
        filter: drop-shadow(0 0 5px rgba(217,189,115,0.6))
                drop-shadow(0 1px 2px rgba(0,0,0,0.35))
                drop-shadow(0 2px 3px rgba(0,0,0,0.55));
        
    }
    .nav-logo p{
        align-self: center;
        color: rgba(255, 255, 255, 0.9);
        font-size: 2.5rem;
        font-weight: 600;
        font-family: "Crimson Pro";
        width: 80%;
    }
    .nav-gombok{ /* a nav gombokat tarto div */
        overflow: hidden;
        border-radius: 5px;
        height: 60px;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    .nav-gombok ul{
         list-style-type: none;
         margin: 0;
         padding: 0;
         overflow: hidden;
         display: flex;
         flex-direction: row;
         gap: clamp(0.1rem, 0.6vw, 0.2rem);
    }
    .nav-gombok ul li a {     /* desktop!! a tenyleges nav gombok*/
        display: flex;
        justify-content: center;
        align-items: center;
        text-decoration: none;
        padding: 22px clamp(6px, 1.4vw, 16px);
        transition: all 0.3s ease;
        background-color: none;
        border-radius: 10px;
        color:#fff;
        text-shadow: 1px 1px 0.1px rgba(0, 0, 0, 0.7); /* t_shadow 2 (fekete) white text */
        font-family: "Karla";
        font-size: clamp(0.75rem, 1.3vw, 1rem);
        white-space: nowrap;
    }
    .nav-gombok ul li a:hover {    /* hover anim */
        transform: translateY(-3px);
    }
    .nav-gombok ul li a::before {     /* hover anim */
         content: "";
         position: absolute;
         z-index: -1;
         bottom: -1px;
         left: 0;
         right: 0;
         height: 5px;
         background-color:rgba(243, 245, 39, 0.94); /* color 2 */
         transform: scaleY(0);
         transform-origin: bottom;
         transition: transform 0.3s ease;
    }
    .nav-gombok ul li a:hover::before {   /* hover anim */
         transform: scaleY(1);
    }


    /*index site - fooldal*/

    .index_section::before{
        translate: 0px -60px;
    }
    .i_mainbemutatkozas_holder{
        width: clamp(70vw, 1500px, 95vw);
        height: clamp( 70vh, 800px, 95vh);
        padding: 30px 0 50px 0;
    }
    .i_mainbemutatkozas_body{
       width: 100%;
       height: 100%;
    }
    .ibm_bodybubble{ /* a body maga a feher hatter, es ez a benne levo buborek*/
        width: 90%;
        height: 90%;
        display: flex;
        align-items: center;
        flex-direction: row;
    }
    .ibm_left{
        width: 30%;
        height: 100%;
    }
    .i_bm_arckep{
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-evenly;
        gap: 3rem;
    }
    .ibm_left img:nth-child(1){
        width: 80%;
        margin-top: 10%;
    }
    .ibm_left img:nth-child(2){
        width: 50%;
        margin-bottom: 10%;
    }
    .ibm_right{
       height: 100%;
       width: 70%;
       display: flex;
       flex-direction: column;
       align-items:center;
       padding-top: 3%;
    }
    .ibm_right_main{
        width: 100%;
        height: 70%;
        font-size:clamp(1.2rem, 1.3vw, 2rem);
    }
    .imb_right_main_head{
        height: 20%;
    }
    .ibm_right_main_body{
       height: 80%;
    }
    .ibm_right_bottom{
        width: 80%;
        height: 30%;
        flex-wrap: nowrap;
    }
    .ibm_right_bottom_button{
        font-size: 1.1rem;
        padding: 15px 40px 15px 40px;
    }
    .ibm_right_bottom_button::before{
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        opacity: 0;
        transition: opacity 0.35s ease;
        -webkit-transition: opacity 0.35s ease;
        pointer-events: none;
    }
    .ibm_right_bottom_button:hover::before{
        opacity: 1;
    }

    .i_f_w_sarok, .sz_f_k_sarok{
        width: clamp(40px, 45px, 55px);
        height: clamp(40px, 45px, 55px);
    }
    .i_border_left, .sz_border_left{
        height: 98%; width: clamp(20px, 25px, 30px);
    }
    .i_border_right, .sz_border_right{
        height: 98%; width: clamp(20px, 25px, 30px);
    }
    .i_border_top, .sz_border_top{
        height: clamp(20px, 25px, 30px); width: 98%; 
    }
    .i_border_bottom, .sz_border_bottom{
        height: clamp(20px, 25px, 30px); width: 98%;
    }

    .index_tanuloknak_holder, .index_kollegaknak_holder, .index_szuloknek_holder{
        margin-bottom: 100px;
        margin-top: 20px;
        width: 90%;
        align-items: flex-start;
    }
    .i_tanuloknak_head, .i_kollegaknak_head, .i_szuloknek_head{
       height: 55px;
       padding: 30px 40px 30px 40px;
    }
    .i_tanuloknak_head p, .i_kollegaknak_head p, .i_szuloknek_head p{
        font-size: clamp(1.4rem, 2.2vw, 1.8rem);
    }

    .t_multi_paperholder{
        width: 55%;
        display: flex;
        justify-content: center;
        flex-direction: column;
        gap: 5vW;
    }
    .t_single_paperholder{
        position: relative;
        width: 100%;

    }
    .t_single_paperholder .mirrorpaper{ /* papirlapok elrendezese miatt mas kep kell, sima imgkent overwriteolja*/    
        display: none;
    }
    .t_single_paperholder .non_mirrorpaper, .left_paper{
        display: block;
        width: 100%;
    }

    .t_paper_textholder{
        position: absolute;
        top: 10%;
        left: 45%;
        translate: -45%;
        width: 70%;
        line-height: 1.6846; /* unitless (== 2.19vw/1.3vw korabbi aranya), igy mindig a font-size pixelre kerekitett
                                 ertekehez igazodik, nem kulon vw-bol szamolodik - Safari/WebKit-en a ket fuggetlenul
                                 kerekitett vw-ertek okozta a szoveg es a fuzetlapon levo vonalak fokozatos elcsuszasat */
        font-size: 1.3vw;
        color: rgba(0, 0, 0, 0.925);
        text-align: center;
        font-family: Patrick Hand;
    }
    .t_noteimg{
       position: absolute;
       width: 30%;
       left: 30%;
       top: 0;
    }

    .i_szuloknek_body, .i_kollegaknak_body{
       padding: 6%;
       padding-top: 15px;
       padding-bottom:15px;
    }
    .i_kollegaknak_body{
       height: 800px;
    }
    .i_szuloknek_body{
       height: auto;
       min-height: 800px;
    }

    .i_kollegaknak_content{
        padding: 3%;
    }
    .i_kollegaknak_content_title{
        margin-top: 50px;
    }
    .i_kollegaknak_content_p1, .i_kollegaknak_content_p2{
        height: 30%;
    }
    .i_kollegaknak_content_p3{
        height: 25%;
    }
    .i_kollegaknak_content_p1 p , .i_kollegaknak_content_p2 p, .i_sz_content_p1, .i_sz_content_p3{
        font-size: clamp(1.2rem, 2.5vw ,1.4rem);
        line-height: clamp(1.2rem, 3vw ,1.8rem);
    }
    .i_kollegaknak_content_p3 p{
        font-size: clamp(1.2rem, 2.5vw ,1.4rem);
        line-height: clamp(1.2rem, 3vw ,1.5rem);
    }
    .i_szuloknek_content{
        padding: 6%;
    }
    .i_sz_content_title{
        font-size: clamp(1.4rem, 3vw, 2.2rem);
        font-weight: 600;
    }
    .i_sz_content_p2{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        margin: 20px 0 20px 0;
    }
    .i_sz_content_p2_left{
        width: 70%;
        margin-left: 25px;
    }
    .i_sz_content_p2_right{
        width: 30%;
    }
    .i_sz_content_p2_left p, .i_sz_content_p2_right p{
        font-size: 1.3rem;
        text-align: left;
        font-weight: 550;
    }
    .i_sz_content_p2_left ul, .i_sz_content_p2_right ul{
        margin-left: 30px;
    }
    .i_sz_content_p2_left li, .i_sz_content_p2_right li{
        list-style:square;
        font-size: 1.2rem;
    }
    .i_sz_content_p4{
        font-size: 1.3rem;
        width: 100%;
        text-align: center;
        font-weight: 550;
    }
    .index_scrolltotop{
        right: -70px;
        bottom: 100px;
    }
    .index_scrolltotop.show {
        right: 70px;
    }
    .index_scrolltotop button img{
        width: 40px;
        height: 40px;
    }
    .index_scrolltotop button:hover::before{
        opacity: 1;
    }
    .index_scrolltotop button{
       background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.5));
    }
    .index_scrolltotop button::before{
       content: "";
       position: absolute;
       inset: 0;
       z-index: -1;
       opacity: 0;
       transition: opacity 0.35s ease;
       -webkit-transition: opacity 0.35s ease;
       pointer-events: none;
       border-radius: 50%;
       background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.6));
    }
       
    /*kurzusok site*/
                                    /*kurzusok sidecontent*/
    .kurzusok_sidecontent{
        width: 235px;
        position: absolute;
        height: 100%;
        width: 235px;
        border-right: #000 1px solid;
        transition: width 0.2s ease;
        will-change: width;
    }
    .kurzusok_sidecontent::before{
        position: fixed;
        background: linear-gradient(360deg, rgba(46, 27, 42, 0.6), rgba(41, 27, 46, 0.6));
        left: 0px;
        width: 235px;
        filter: blur(6px);
        transition: width 0.2s ease;
        will-change: width;
        overflow-x: hidden;
    }
    .k_sidecontent_main_title{
        flex-direction: row;
    }
    .k_sidecontent_head{
        margin: 10px 0 10px 0;
        height: 140px;
        min-height: 140px;
    }
    .k_sidecontent_collapse button{
        width: 50px;
        height: 50px;
    }
    .k_mutassmindent_button{
        padding: 0.5rem 1.3rem;
    }
    .k_s_K_l_checkbox_text p{
        font-size: 1.1rem;
    }
    .k_s_k_listaelem{
        width: 95%;
    }
    .k_s_k_list{
        width: 95%;
    }
    .k_m_card_backdim{
        background-color: rgba(0, 0, 0, 0.6);
    }
    .k_card_closebutton{
        width: clamp(50px, 70px, 80px);
        height: clamp(50px, 60px, 80px);
        padding: 25px 30px 25px 30px;
    }

                                        /*kurzusok maincontent*/
    .kurzusok_maincontent{
        position: absolute;
        top: 0;
        right: 0;
        width: calc(100vw - 235px);
        height: 100%;
        overflow-y: auto;
        overflow-x: hidden; /* only overflow-y was set, which per spec forces overflow-x
                                to compute as "auto" - letting Safari's elastic scroll
                                reveal any sub-pixel horizontal overflow as blank space */
        z-index: auto;
        transition: width 0.2s ease;
        will-change: width;
    }
    .kurzusok_maincontent::before{
        content: "";
        position: fixed;
        left: 0px;
        width: 100vw;
        height: 100%;
        background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.3)), url(assets/kurzusok/kurzusok_back.jpg);
        background-size: cover;
        filter: blur(6px);
        translate: 0px -60px;
        z-index: -200;
        transition: width 0.2s ease, left 0.2s ease;
        will-change: width, left;
    }
    .d_kurzusok_navbar{ 
        max-width: 70%;
    }
    .d_k_nav_cim_fo{
        font-size: clamp(2rem, 4.5vw, 2.5rem);
    }
    .d_k_nav_cim_al{
        font-size: clamp(1.3rem, 3vw, 1.6rem);
    }
    .k_m_fokategoria_cim p{
        font-size: 1.5rem;
    }
                                            /*kurzusok kártya*/
    .k_m_card{
        position: relative;
        padding: 15px 15px 15px 15px;
        width: 300px;
        height: 400px;
        display: flex;
        flex-direction: column;
        border-radius: 13px;
        border: 1px solid rgba(0, 0, 0, 0.582);
        box-shadow:
            0 8px 20px rgba(0,0,0,0.18),
            inset 0 1px 0 rgba(255,255,255,0.4);
        transition: transform 0.3s ease-out, box-shadow 0.3s ease-out; /*transition 1 emelkedo*/
    }
    .k_m_card:hover{
        transform: translateY(-2px);    /*transition 1 emelkedo*/
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25);     /*transition 1 emelkedo*/
    }
    .k_m_card_kepek{
        height: 65%;
    }
    .k_m_c_extracim{ /* ha a cardon belul a zaszlohoz kell meg egy focim*/
        font-size: 1.2rem;
    }
    .k_m_card_cim{
        height: 30%;
    }
    .k_m_card_cim p{
        font-size: 1.3rem;
        line-height: 1.2rem;
    }
    .k_m_card_ebutton{ /* a div ami tartja a gombot*/
        height: 15%;
    }
    .k_m_card_ebutton button{
        padding: 10px 40px 10px 40px;
        border-radius: 1rem;
        font-size: 1.1rem;
    }
    .k_m_card_extend{
        z-index: 1060;
        padding: 0.5rem 1rem 0.5rem 1rem;
        width: 80vw;
        height: 80vh;
        top: 50%;
        left: 50%;
        translate: -50% calc(-50% + 35px);
        border-radius: 0.5rem;
    }
    .k_m_card_backdim{
        z-index: 1050;
    }
    .k_m_card_e_top{
        height: 12%;
    }
    .k_m_card_e_top_kep_single{ /* single ha 1 nyelv kep van*/
        width: 10%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_m_card_e_top_kep_multi{
        width: 20%;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
    }
    .k_m_card_e_top_kep_multi img{
        width: 40%;
        height: 70%;
        border-radius: 0.5rem;
    }
    .k_m_card_e_top_cim_single{
        width: 80%;
    }
    .k_m_card_e_top_cim_single p{
        width: 93%;
        font-size: calc(1rem + 0.5vw); /* dfont scaling test*/
        line-height: 1.4rem;
    }
    .k_m_card_e_top_close{
        width: 80px;
    }
    .k_card_closebutton:hover{
        background: #b60000da;
    }
    .k_m_card_e_mid_badgek{
        width: 20%;
        height: 100%;
        padding: 1rem;
        border-right: 2px solid #000;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }
    .k_m_card_e_mid_badgek img{
        width: 100%;
    }
    .k_m_card_e_mid_szoveg{
        width: 80%;
        height: 100%;
        padding: 0.6rem;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }
    .k_m_card_e_mid_szoveg_alcim{
        width: 100%;
        height: 7%;
        display: flex;
        align-items: end;
        justify-content: flex-end;
    }
    .k_m_card_e_mid_szoveg_alcim p{
        width: 98%;
        text-align: left;
        font-family: "Crimson Pro", serif;
        font-weight: 600;
        font-size: 1.5rem;
        font-style: italic;
    }
    .k_m_card_e_mid_szoveg_content{
        align-self: center;
        height: calc(100% - 7% - 160px);
        width: 95%;
        overflow-y: auto;
    }
    .kmcard_artablazat_extend_szoveg{
        height: calc(100% - 7% - 240px);
    }
    .k_m_card_e_mid_szoveg_content p{
        font-size: 1.2rem;
        line-height: 1.3rem;
    }
    .k_m_card_e_bottom{
        height: 150px;
        width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-around;
    }
    .kmcard_artablazat_extend_bottom{ /* ha tobb mint 3 soros az artablazat*/
        height: 200px;
    }
    .k_m_card_e_bottom_ar{
        width: 50%;
        height: 100%;
    }
    .kurzusok_ar_table{
        padding: 5px 10px 5px 10px;
    }
    .kurzusok_ar_table th{
        font-size: clamp(1.0rem, 2vw, 1.3rem);
    }
    .kurzusok_ar_table td{
        font-size: clamp(0.9rem, 1.8vw, 1.1rem);
        text-wrap: nowrap;
    }
    .k_m_card_e_bottom_jelentkezes{
        width: 45%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
    }
    .kmcard_redirect{
        display: none;
    }
    .kmcard_jelentkezes_buttonholder{
        width: 100%;
        height: 30%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 5px 10px;
        font-family: "Crimson Pro", serif;
        border-radius: 0.3rem;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
    }
    .kmcard_jelentkezes_buttonholder p{
        font-family: "Crimson Pro", serif;
        color: rgb(0, 0, 0);
        font-weight: 500;
        min-width: 0;
        font-size: clamp(0.9rem, 1.20vw, 1.1rem);
    }
    .kmcard_jelentkezes_buttonholder button{
        height: 95%;
        width: 90px;
        padding: 5px 20px 5px 20px;
        border-radius: 1rem;
        font-size: 0.9rem;
        font-weight: 700;
    }
    .kmcard_jelentkezes_buttonholder button::before{
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        opacity: 0;
        transition: opacity 0.35s ease;
        -webkit-transition: opacity 0.35s ease;
        pointer-events: none;
    }
    .kmcard_jelentkezes_messimg{
        height: 14px;
        padding-right: 6px;
        padding-top: 2px;
    }

    .desktop.k_sidecontent_collapse button {
        position: relative;
        color: transparent;
        background: rgb(128, 2, 2);
        border-color: black;
        transition: background-color 0.2s ease, color 0.2s ease;
    }
    .desktop.k_sidecontent_collapse button:hover {
        background: rgb(155, 10, 10);
    }
    .desktop.k_sidecontent_collapse button::before {
        content: "X";
        position: absolute;
        inset: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 18px;
        line-height: 1;
        font-weight: 700;
        font-family: inherit;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .desktop.k_sidecontent_collapse button {
        background: #1c6f34;
        border-color: #0000007e;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .desktop.k_sidecontent_collapse button:hover {
        background: #2a8d4a;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .desktop.k_sidecontent_collapse button::before {
        content: "›";
        font-size: 30px;
        border-radius: 1rem;
    }
    

    /* k_sidecontent_extended: elrejtés ha összecsukva */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_sidecontent_extended {
        display: none !important;
    }

    /* k_sidecontent_collapsed: elrejtés ha kinyitva */
    .kurzusok_sidecontent:not(.k_sidecontent_isCollapsed) .k_sidecontent_collapsed {
        display: none !important;
    }

    /* === Összecsukott állapot === */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed {
        width: 70px;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed::before {
        width: 70px;
    }

    /* Fő tartalom kiigazítása ha sidebar összecsukva */
    .k_section_sidebarCollapsed .kurzusok_maincontent {
        width: calc(100vw - 70px);
    }
    .k_section_sidebarCollapsed .kurzusok_maincontent::before {
        left: 0;
        width: 100vw;
    }

    /* Összecsukott head layout */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_sidecontent_head {
        height: auto;
        padding: 5px 0;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_sidecontent_collapse {
        width: 100%;
        padding: 5px 0;
        translate: 2px;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_sidecontent_collapse button {
        border-radius: 0.5rem;
        translate: 0;
    }

    /* Összecsukott mutass mindent wrapper */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_mutassmindent_wrapper {
        width: 100%;
        justify-content: center;
        height: 50px;
        padding: 5px 0;
        margin-bottom: 8px;
        translate: 2px;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_mutassmindent_icon_holder {
        width: 100%;
        cursor: pointer;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_mutassmindent_icon_holder.k_s_k_l_image::before {
        width: 45px;
        height: 45px;
    }
    /* Mutass mindent ikon: aktív (nem greyscaled) állapot -> lila háttér */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_mutassmindent_icon_holder.k_s_k_l_image:not(.k_mutassmindent_greyscaled)::before {
        background: linear-gradient(150deg, #d01c52, #a6357e);
    }
    /* Mutass mindent ikon: greyscaled állapot */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_mutassmindent_icon_holder.k_mutassmindent_greyscaled img {
        filter: grayscale(100%);
        opacity: 0.6;
    }

    /* Összecsukott kategória elválasztók: csak vonal, szöveg nélkül */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_sidecontent_kategoriacim {
        padding: 0;
        height: 9px;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_sidecontent_kategoriacim p {
        display: none;
    }

    /* Összecsukott lista elrendezés */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_list {
        align-items: center;
        gap: 0.6rem;
        padding: 0.4rem 0;
    }

    /* Összecsukott lista elemek: csak ikon, középre */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_listaelem {
        width: 50px;
        height: 50px;
        justify-content: center;
        margin: 0;
    }

    /* Szöveg és switch elrejtése összecsukott módban */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_K_l_checkbox_text,
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_l_checkbox_switch {
        display: none;
    }

    /* Al-rows have no icons — hide them entirely when collapsed */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_listaelem_alelemmel_al {
        display: none;
    }

    /* Make the fo-row behave like a regular icon item when collapsed */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_listaelem_alelemmel_fo {
        width: 50px;
        height: 50px;
        justify-content: center;
        margin: 0;
    }

    /* Shrink the outer alelemmel wrapper to icon size when collapsed */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_listaelem_alelemmel {
        width: 50px;
        border: none;
        align-items: center;
    }

    /* Összecsukott ikonok méretezése */
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_l_image {
        width: 45px;
        height: 45px;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_l_image img {
        width: 30px;
        height: 30px;
    }
    .kurzusok_sidecontent.k_sidecontent_isCollapsed .k_s_k_l_image::before {
        width: 45px;
        height: 45px;
    }

    /* Kurzusok sidecontent VEGE */


    /*kapcsolat css */
    .kapcsolat_wrapper{
        height: 100%;
    }
    .k_contact_holder{    
        width: clamp(70vw, 1024px, 95vw);
        height: 600px;
        padding: 50px 0 50px 0;
    }
    .k_contact_body{
        flex-direction: row-reverse;
        justify-content: space-around;
    }
    .k_contact_body_right, .k_contact_body_left{
        width: 50%;
        height: 100%;
    }
    .k_contact_adatok{
        font-size: clamp(1.1rem, 1.1vw, 2rem);
    }
    .k_c_parafa_papir{
        width: 80%;
    }
    .k_gyik_body{   
        width: 73%;
    }
    .k_c_parafa_papir a{
        font-size: clamp(0.8rem, 0.8vw, 1rem);
    }
    .k_c_parafa_papir img{
        height: 60%;
    }
    .k_c_parafa_papir p{
        font-size: clamp(0.8rem, 1vw, 1.4rem);
    }
    .k_gyik_button{
        font-size: clamp(0.8rem, 1.2vw, 1.1rem);
    }
    .k_gyik_elem{
        width: 80%;
    }
    .i_ertekeles{
        width: 340px;
    }
    .i_ertekeles_bigscreen{
        width: clamp(400px, 40vw, 800px);
    }
    .i_e_b_nev{
        font-size: clamp(1.3rem, 3vw, 1.6rem);
    }
    .k_contact_adatok_szoveg{
        font-size: clamp(1.3rem, 3vw, 1.4rem);
        line-height: clamp(1.4rem, 3vw, 1.4rem);
    }

}

/* override desktop 900p - 1080p*/
@media (min-width: 1599px) {
    
    /* tanulok site */
    .tanulok_section{
        overflow-y: hidden;

    }
    .t_multi_paperholder{
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: stretch;
        flex-direction: row;
        gap: 50px;
        padding-top: 0;
    }

    .t_stickyholder{
        top: -15px;
        left: 50%;
        translate: -50%;
    }

    .t_stickyholder img{
        width: 13vw;
    }

    .t_single_paperholder{
        width: 40%;
        height: 100%;
    }
    .t_single_paperholder .mirrorpaper, .left_paper { /* papirlapok elrendezese miatt mas kep kell, sima imgkent overwriteolja*/
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    .t_single_paperholder .non_mirrorpaper{
        display: none;
    }

    .t_paper_textholder{
        position: absolute;
        top: 10%;
        left: 50%;
        width: 75%;
        line-height: 1.4455; /* unitless (== 1.59vw/1.1vw korabbi aranya), lasd megjegyzes fentebb */
        font-size: 1.1vw;
        color: rgba(0, 0, 0, 0.925);
        text-align: center;
        font-family: Patrick Hand;
    }
    .t_s_paperholder_l{ /* mivel 2 papir tukrozott margo miatt mas behuzas kell*/
        translate: -55%;
    }
    .t_s_paperholder_r{
        translate: -45%;
    }
    .k_m_card_extend{
        width: 65vw;
        height: 75vh;
    }


}
/*override desktop ultrawide*/
@media (min-aspect-ratio: 21/9) {
    .t_multi_paperholder{
        height: 100%;
        width: 100%;
    }
    .i_mainbemutatkozas_holder, .index_tanuloknak_holder, .index_szuloknek_holder, .index_kollegaknak_holder, .k_contact, .k_gyik, .i_ertekelesek{
        max-width: 1800px;
    }
    .t_paper_textholder{
        font-size: 22px;
    }
    .kurzusok_maincontent, .kapcsolat_wrapper{
        display: flex;
        align-items: center;
        flex-direction: column;
    }
    .kurzusok_maincontent_wrapper{
        max-width: 2000px;
        min-width: 1700px;
    }
}

@media (max-width: 1024px) { /* tablet + telefon view*/
    .tsize_kicsi_5{
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        font-size: clamp(0.9rem, 3vw, 1rem);
    }

    .tsize_normal_4{
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        font-size: clamp(1.1rem, 1.4vw, 1.4rem);
    }

    .tsize_alcim_3{
        font-family: "Crimson Pro", serif;
        font-weight: 550;
        font-size: clamp(0.9rem, 5vw, 1.5rem);
    }

    .tsize_nagy_title_1{
        font-family: "Crimson Pro", serif;
        font-weight: 700;
        font-size: clamp(1.4rem, 2.2vw, 1.8rem);
    }
    
    .desktop{
        display: none;
    }
    *,
    *::before,
    *::after {
        -webkit-tap-highlight-color: transparent;
    }
    body{
        color: #333;
        line-height: 1.6;
        background-color: #000;
    }
    section{
        background-color: #fff;
        width: 100%;
        min-height: 90vh;
        margin-left: auto;
        margin-right: auto;
    }

    .m_navbar{ /* mobile navbar*/
        position: fixed;
        top: 0;
        width: 100vw;
        height: 45px;
        display: flex;
        justify-content: center;
        z-index: 1000;
        transition: transform 0.3s ease;
    }
    .m_navbar.m_navbar_hidden{
        transform: translateY(-100%);
    }
    .m_navbar_wrapper{
        height: 100%;
        width: 95%;
        display: flex;
        justify-content: space-between;
    }
    .m_navbar_logo{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .m_navbar_logo_img{
        height: 48px;
    }
    .m_navbar_Navigationbutton{ /* a button holder-divje*/
        height: 45px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .m_navbar_Navigationbutton button{ /* oldallista button */
        background-color: transparent;
        border: none;
        color: #fff;
    }
    .m_navbar_menubutton_img{
        height: 45px;
    }
   .m_navbar_Navigationbutton_image{
        height: 45px;
    }
    .m_navbar_SiteMenu{
        position: fixed;
        top: 0;
        left: 0;
        width: 250px;
        height: 100%;
        background: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4));
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        -webkit-backdrop-filter: blur(4px) contrast(50%);
        backdrop-filter: blur(4px) contrast(50%);
        z-index: 1300;
        transform: translateX(-100%);
        transition: transform 0.4s ease;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        pointer-events: none;
    }
    .m_navbar_SiteMenu.m_menu_open{
        transform: translateX(0);
        pointer-events: auto;
    }
    .m_navbar_SiteMenu button{   /*sitenav close button */
        position: fixed;
        top:15px;
        left: 190px;
        width: 50px;
        height: 50px;
        background-color: transparent;
        border: none;
        background: rgb(128, 2, 2);
        flex-shrink: 0;
        background-size: 100% 100%;
        cursor: pointer;
        border: 1px solid rgba(0, 0, 0, 0.472);
        border-radius: 0.8rem;
        color: #fff;
        font-size: 18px;
        font-weight: 700;
    }
    .m_navbar_SiteMenu_lista{
        margin-top: 150px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        gap: 1rem;
        width: 70%;
        height: 50%;

    }
    .m_navbar_SiteMenu_lista img{
        margin-bottom: 50px;
    }

    .m_navbar_SiteMenu_lista a{
        text-align: center;
        font-weight: 700;
        font-size: 1.6rem;
        font-family: "Crimson Pro", serif;
        text-decoration: none;
        color: rgba(255, 255, 255, 0.99);
        text-shadow: 2px 2px 0.3px rgba(0, 0, 0, 0.7);
        background: linear-gradient(to right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        padding: 10px 20px 10px 20px;
        border-radius: 0.5rem;
    }


    /*kurzusok oldal */

    /*/kurzusok oldal end*/


    /*kapcsolat css */
    .kapcsolat_section, .tabor_section{
        top: 0;
        height: 100vh;
    }
    .kapcsolat_section::before, .tabor_section::before{
        top: 0;
        height: 100vh;
    }
    .k_contact_holder{
        margin-top: 45px;
    }
}



@media (min-width: 768px) and (max-width: 1024px) { /* Tablet override */
    .mt_szovegertes_megoldasok_close, .mt_szovegertes_megoldasokwrapper{
        display: none;
    }
    .m_navbar_SiteMenu_lista img{
        width: 160px;
        height: auto;
    }
    .i_szuloknek_body{
        height: auto;
        min-height: 1050px;
    }
    .i_kollegaknak_body{
        height: 950px;
    }
    .i_kollegaknak_content_p1, .i_kollegaknak_content_p2{
        height: 37%;
    }
    .t_multi_paperholder {
        width: 70%;
    }
    .t_paper_textholder {
        position: absolute;
        top: 10%;
        left: 45%;
        translate: -45%;
        width: 70%;
        line-height: 1.55;
        font-size: 1.8vw;
        color: rgba(0, 0, 0, 0.925);
        text-align: center;
        font-family: Patrick Hand;
    }
    .i_kollegaknak_content_p3{
        height: 20%;
    }
    .i_szuloknek_content{
        flex-shrink: 0;
    }
    .ibm_bodybubble{
        flex-direction: column;
    }
    .ibm_left{
        width: 100%;
        height: 25%;
    }
    .i_bm_arckep{
        flex-direction: row;
    }
    .ibm_left img:nth-child(1){
        width: auto;
        height: 80%;
        margin-top: 0;
    }
    .ibm_left img:nth-child(2){
        width: auto;
        height: 60%;
        margin-bottom: 0;
    }
    .ibm_right{
        width: 100%;
        height: 75%;
    }
    .ibm_right_bottom_button{
        font-size: clamp(0.8rem, 1.8vw, 1.1rem);
        padding: 10px 18px 10px 18px;
    }
    .mobile.t_single_paperholder{
        display: none;
    }
    .t_multi_paperholder{
        display: block;
    }
    .desktop.t_single_paperholder{
        display: block;
    }

    .desktop.k_sidecontent_collapse {
        display: none !important;
    }
    .mobile.k_sidecontent_collapse {
        display: flex;
    }
    .kurzusok_sidecontent{
        display: flex;
        flex-direction: column;
        width: 230px !important;
        position: fixed !important;
        right: 0;
        top: 0px;
        height: 100%;
        border-left: #000 1px solid;
        z-index: 1100;
        transform: translateX(100%);
        transition: transform 0.4s ease;
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .kurzusok_sidecontent.m_kategoria_open{
        transform: translateX(0);
        pointer-events: auto;
    }
    .kurzusok_sidecontent::before{
        position: absolute;
        top: 0;
        right: 0;
        width: 230px;
        background: linear-gradient(360deg, rgba(46, 27, 42, 0.8), rgba(41, 27, 46, 0.8));
        height: min(var(--scroll-height, 100%), 100%);
        -webkit-backdrop-filter: blur(8px) contrast(30%);
        backdrop-filter: blur(8px) contrast(30%);
    }
    .kurzusok_maincontent {
        z-index: auto;
        width: 100%;
    }
    .kurzusok_maincontent::before{
        height: 100vh;
        transform: scale(1.05);
        z-index: -2;
    }
    .kurzusok_section{
        position: fixed;
        top: 45px;
        left: 0;
        width: 100vw;
        height: calc(100vh - 45px);
        display: flex;
        justify-content: center;
        flex-direction: row;
        flex-wrap: nowrap;
        overflow: hidden;
    }
    .k_m_card_extend{
        z-index: 1060;
        padding: 0.5rem 1rem 0.5rem 1rem;
        width: 95vw;
        height: 75vh;
        top: 50%;
        left: 50%;
        translate: -50% calc(-50% + 35px);
        border-radius: 0.5rem;
    }
    .k_m_card_backdim{
        z-index: 1050;
    }
    .k_m_card_e_top_kep_single{ /* single ha 1 nyelv kep van*/
        display: none;
    }
    .k_m_card_e_top_kep_multi{
        display: none;
    }
    .k_m_card_e_mid{
        width: 100%;
        height: calc(100% - 70px);
        display: flex;
        flex-direction: column;
        align-items: center;
        overflow-y: hidden;
    }
    .kmcard_mid_artbadge{ /*hogy ne latszodjon a konyv dolog*/
        display: none;
    }
    .k_m_card_e_mid_badgek{
        width: 90%;
        min-height: 80px;
        max-height: 85px;
        padding-top: 10px;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
    }
    .k_m_card_e_mid_badgek img{
        height: 90%;
        flex-grow: 0;
    }
    .k_m_card_e_mid_szoveg{
        width: 100%;
        height: calc(100% - 60px);
        padding: 5px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .k_m_card_e_mid_szoveg_content p{
        font-size: clamp(1.2rem, 2.5vw, 1.6rem);
        line-height: clamp(1.2rem, 2.5vw, 1.6rem);
    }
    .k_m_card_e_mid_szoveg_alcim p{
        font-size: clamp(1.4rem, 3vw, 2.2rem);
    }
    .kmcard_artablazat_extend_szoveg{
        height: calc(100% - 45px - 160px);
        margin-bottom: 15px;
    }
    .k_m_card_e_bottom_ar{
        height: 160px;
    }
    .k_m_card_e_bottom_jelentkezes{
        width: 45%;
        height: 140px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-around;
    }
    .k_m_card_e_mid_badgek{
        border-right: none;
    }
    .k_m_card_e_top_cim_single p {
        width: 93%;
        font-size: clamp(1rem, 3vw, 2rem);
        line-height: clamp(1rem, 3vw, 2rem);
    }
}


@media (max-width: 767px) { /* telefon override */
    .m_navbar_wrapper{
        width: 90%
    }
    .m_navbar_logo{
       width: 80%;
    }
    .m_navbar_Navigationbutton{
        width: 10%;
    }
    


                                    /*Főoldal css */
    .index_section{
        overflow-x: hidden;
    }
    .i_bemutatkozas{
        padding-top: 40px;
    }
    .i_mainbemutatkozas_holder{
        width: 100vw;
        height: clamp(95dvh, 700px, 110dvh);
        padding: 0 0 20px 0;
    }
    .i_mainbemutatkozas_body{
       width: 100%;
       height: 100%;
    }
    .ibm_bodybubble{ /* a body maga a feher hatter, es ez a benne levo buborek*/
        width: 95%;
        height: 90%;
        display: flex;
        align-items: center;
        flex-direction: column;
    }
    .ibm_left{
        width: 100%;
        height: 20%;
    }
    .ibm_right_main_body p{
        font-size: clamp(0.8rem, 5vw, 4rem);
        line-height: 1.5rem;
    }
    .i_bm_arckep{
       height: 100%;
       display: flex;
       flex-direction: row;
       align-items: center;
       justify-content: center;
       gap: 3rem;
    }
    .ibm_left img:nth-child(1){
        height: 80%;
    }
    .ibm_left img:nth-child(2){
        height: 60%;
    }
    .ibm_right{
       height: 80%;
       width: 100%;
       display: flex;
       flex-direction: column;
       align-items:center;
    }
    .ibm_right_main{
        width: 100%;
        height: 80%;
    }
    .imb_right_main_head{
        height: 10%;
    }
    .ibm_right_main_body{
       height: 90%;
    }
    .ibm_right_bottom{
        width: 100%;
        height: 20%;
        flex-wrap: nowrap;
    }
    .ibm_right_bottom_button{
        font-size: clamp(0.8rem,10px,1.1rem);
        padding: 10px 15px 10px 15px;
    }

    .i_f_w_sarok, .sz_f_k_sarok{
        width: clamp(20px, 25px, 35px);
        height: clamp(20px, 25px, 35px);
    }
    .i_border_left, .sz_border_left{
        height: 98%; width: clamp(10px, 15px, 20px);
    }
    .i_border_right, .sz_border_right{
        height: 98%; width: clamp(10px, 15px, 20px);
    }
    .i_border_top, .sz_border_top{
        height: clamp(10px, 15px, 20px); width: 98%; 
    }
    .i_border_bottom, .sz_border_bottom{
        height: clamp(10px, 15px, 20px); width: 98%;
    }
    .index_tanuloknak_holder, .index_kollegaknak_holder, .index_szuloknek_holder{
        margin-bottom: 70px;
        margin-top: 50px;
        width: 98%;
        align-items: center;
    }
    .i_tanuloknak_head, .i_kollegaknak_head, .i_szuloknek_head{
       height: 45px;
       padding: 25px 30px 25px 30px;
    }
    .i_tanuloknak_head p, .i_kollegaknak_head p, .i_szuloknek_head p{
        font-size: clamp(1.1rem, 4.5vw, 1.8rem);
    }
    .t_multi_paperholder{
        width: 100%;
        display: flex;
        justify-content: center;
        flex-direction: column;
        gap: 5vW;
    }
    .t_single_paperholder{
        position: relative;
        width: 100%;
        height: 180%;

    }
    .t_single_paperholder .mirrorpaper{ /* papirlapok elrendezese miatt mas kep kell, sima imgkent overwriteolja*/    
        display: none;
    }
    .t_single_paperholder .non_mirrorpaper, .left_paper, .mobilepaper{
        display: block;
        width: 100%;
    }

    .t_paper_textholder{
        position: absolute;
        top: 5.33%;
        left: 51%;
        translate: -45%;
        width: 75%;
        line-height: 1.2747; /* unitless (== 5.8vw/4.55vw korabbi aranya), lasd megjegyzes fentebb */
        font-size: 4.55vw;
        color: rgba(0, 0, 0, 0.925);
        text-align: center;
        font-family: Patrick Hand;
    }
    .t_noteimg{
        position: absolute;
        width: 30%;
        left: 36%;
        top: 25px;
    }
    .index_scrolltotop{
        right: -70px;
        bottom: 50px;
    }
    .index_scrolltotop.show {
        right: 10px;
    }
    .index_scrolltotop button{
      background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.6));
    }
    .index_scrolltotop button img{
        width: 20px;
        height: 20px;
    }
    

    .i_szuloknek_body, .i_kollegaknak_body{
       padding-top: 15px;
       padding-bottom:15px;
    }
    .i_kollegaknak_content{
        width: 96%;
        height: 100%
    }
    .i_kollegaknak_content_title{
        margin-top: 30px;
    }
    .i_kollegaknak_content_p1 p , .i_kollegaknak_content_p2 p, .i_sz_content_p1, .i_sz_content_p3{
        font-size: clamp(0.8rem, 4.5vw, 1.2rem);
        line-height: 1.4rem;
        margin: 10px 0 10px 0;
    }
    .i_kollegaknak_content_p3 p{
        font-size: clamp(0.8rem, 4.8vw, 1.2rem);
        line-height: 1.4rem;
        margin: 10px 0 20px 0;
        text-align: center;
    }
    .i_szuloknek_content{
        padding: 6%;
    }
    .i_sz_content_title{
        font-size: clamp(1rem, 7vw, 2rem);
        font-weight: 600;
    }
    .i_sz_content_p2{
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }
    .i_sz_content_p2_left{
        width: 95%;
        margin-left: 20px;
    }
    .i_sz_content_p2_right{
        width: 95%;
        margin-left: 20px;
    }
    .i_sz_content_p2_left p, .i_sz_content_p2_right p{
        font-size:clamp(0.8rem, 5.5vw, 1.2rem);
        text-align: left;
        font-weight: 550;
    }
    .i_sz_content_p2_left ul, .i_sz_content_p2_right ul{
        margin-left: 30px;
    }
    .i_sz_content_p2_left li, .i_sz_content_p2_right li{
        list-style:square;
        font-size:clamp(0.8rem, 5vw, 1.2rem);
    }
    .i_sz_content_p4{
        font-size:clamp(0.9rem, 5vw, 1.4rem);
        width: 100%;
        text-align: center;
        font-weight: 550;
    }
    



                                /*kurzusok oldal */

    .desktop.k_sidecontent_collapse {
        display: none !important;
    }
    .mobile.k_sidecontent_collapse {
        display: flex;
    }
    .kurzusok_section{
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100%;
        display: flex;
        justify-content: center;
        flex-direction: row;
        flex-wrap: nowrap;
        overflow: hidden;
    }
        /*sidecontent*/

    .kurzusok_sidecontent{
        z-index: 10000;
        width: 230px !important;
        position: fixed !important;
        right: 0;
        top: 0px;
        height: 100%;
        border-left: #000 1px solid;
        z-index: 1100;
        transform: translateX(100%);
        transition: transform 0.4s ease;
        overflow-x: hidden; /* clip the ::before which is 270px wide */
        overflow-y: hidden; /* setting only overflow-x forces overflow-y to compute
                                as "auto" per spec, giving the OUTER container its
                                own scrollbar too. Only .k_sidecontent_body (inner)
                                should ever scroll. */
    }
    .kurzusok_sidecontent.m_kategoria_open{
        transform: translateX(0);
        pointer-events: auto;
    }
    .kurzusok_sidecontent::before{
        position: absolute;
        height: 100vh;
        top: 0;
        right: 0;
        width: 230px;
        background: linear-gradient(360deg, rgba(46, 27, 42, 0.8), rgba(41, 27, 46, 0.8));
        height: min(var(--scroll-height, 100%), 100%); /* js fix hozza mert nem lehetett contenct heightra sizeolni normalisan */
        -webkit-backdrop-filter: blur(8px) contrast(30%);
        backdrop-filter: blur(8px) contrast(30%);
    }
    .k_sidecontent_main_title{
        flex-direction: row-reverse;
        justify-content: space-between;
    }
    .k_sidecontent_head{
        margin: 10px 0 10px 0;
        height: 100px;
        min-height: 100px;
    }
    .k_sidecontent_collapse button{
        width: 45px;
        height: 45px;
    }
    .k_mutassmindent_button{
        padding: 0.3rem 1rem;
    }
    .k_s_K_l_checkbox_text p{
        font-size: 0.9rem;
    }
    .k_s_k_listaelem, .k_s_k_listaelem_alelemmel{
        width: 93%;
    }
    .k_s_k_list{
        width: 99%;
    }
    .k_m_card_backdim{
        background-color: rgba(0, 0, 0, 0.2);
    }
    .k_card_closebutton{
        width: 45px;
        height: 45px;
        padding: 20px 25px 20px 25px;
    }


        /*maincontent*/
    .kurzusok_maincontent{
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 1;
        padding-top: 60px;
    }
    .kurzusok_maincontent::before{
        content: "";
        position: fixed;
        top: 0px;
        left: 0;
        width: 100%;
        height: 100vh;
        background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.3)), url(assets/kurzusok/kurzusok_back.jpg);
        background-size: cover;
        filter: blur(4px);
        transform: scale(1.05);
        z-index: -2;
    }
    .d_kurzusok_navbar{ 
        max-width: 90%;
    }
    .d_k_nav_cim_fo{
        font-size: 1.6rem;
    }
    .d_k_nav_cim_al{
        font-size: 1.1rem;
    }
    .k_m_fokategoria_cim p{
        font-size: 1.3rem;
    }
                                 /*kurzusok kártya*/
    .k_m_card{
        position: relative;
        padding: 5px;
        width: 46%;
        height: 260px;
        display: flex;
        flex-direction: column;
        border-radius: 10px;
        border: 1px solid rgba(0, 0, 0, 0.582);
        box-shadow:
        0 8px 20px rgba(0,0,0,0.18),
        inset 0 1px 0 rgba(255,255,255,0.4);
        transition: transform 0.3s ease-out, box-shadow 0.3s ease-out; /*transition 1 emelkedo*/
    }
    .k_m_card_kepek{
        height: 55%;
    }
    .k_m_c_extracim{ /* ha a cardon belul a zaszlohoz kell meg egy focim*/
        font-size: 0.7rem;
        text-wrap: nowrap;
    }
    .k_m_c_extracim p{ /* csak mobile ruleban van mert desktopon furcsa problemakat okoz ha centerelem???*/
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 5%;
    }
    .k_m_card_cim{
        height: 40%;
    }
    .k_m_card_cim p{
        font-size: 0.95rem;
        line-height: 0.85rem;
    }
    .k_m_card_ebutton{ /* a div ami tartja a gombot*/
        height: 15%;
    }
    .k_m_card_ebutton button{
        width: 95%;
        height: 100%;
        border-radius: 0.7rem;
        font-size: 0.9rem;
    }
    .k_m_card_extend{
        z-index: 1200;
        padding: 3px;
        top: 1.5%;
        left: 1.5%;
        width: 97%;
        height: 97%;
        border-radius: 0;
        border-radius: 1rem;
    }
    .k_m_card_backdim{
        z-index: 1199;
    }
    .k_m_card_e_top{
        height: 55px;
    }
    .k_m_card_e_top_kep_single{ /* single ha 1 nyelv kep van*/
        display: none;
    }
    .k_m_card_e_top_kep_multi{
        display: none;
    }
    .k_m_card_e_top_cim_single{
        width: calc(100% - 70px);
        overflow: hidden;
    }
    .k_m_card_e_top_cim_single p{
        width: 95%;
        font-size: 1.4rem; /* van hozza js hogy valts adynamically font sizet!!!*/
        line-height: 1em;
    }
    .k_m_card_e_top_close{
        width: 60px;
    }
    .kmcard_mid_artbadge{ /*ideiglenes megoldas hog yne latszodjon a konyv dolog*/
        display: none;
    }
    .k_m_card_e_mid{
        width: 100%;
        height: calc(100% - 55px);
        display: flex;
        flex-direction: column;
        align-items: center;
        overflow-y: auto;
    }
    .k_m_card_e_mid_badgek{
        width: 95%;
        height: 30px;
        padding-top: 5px;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
    }
    .k_m_card_e_mid_badgek img{
        height: 100%;
        width: 30%;
    }
    .k_m_card_e_mid_badgek img:nth-child(3){ /*meglepoen mukodik, azert 3.mert a konyv lathatatlanba meg ott van*/
        border-left: #000 1px solid;
        border-right: #000 1px solid;
        padding: 0 3px 0 3px;
    }
    .k_m_card_e_mid_szoveg{
        width: 100%;
        height: calc(100% - 30px);
        padding: 5px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        gap: 10px;
    }
    .k_m_card_e_mid_szoveg_alcim{
        width: 100%;
        height: 40px;
        flex-shrink: 0;
    }
    .k_m_card_e_mid_szoveg_alcim p{
        font-size: 1.3rem;
        padding-left: 10px;
        padding-top: 2px;
    }
    .k_m_card_e_mid_szoveg_content{
        align-self: center;
        width: 100%;
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
        border-radius: 0.3rem;
    }
    .k_m_card_e_mid_szoveg_content p{
        font-size: clamp(0.8rem, 4vw, 1.4rem);
        line-height: clamp(0.8rem, 5vw, 1.4rem);;
    }
    .k_m_card_e_bottom{
        height: auto;
        flex-shrink: 0;
        width: 100%;
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-start;
    }
    .k_m_card_e_bottom_ar{
        width: 95%;
        height: auto;
    }
    .kurzusok_ar_table{
        padding: 2px 6px;
    }
    .kurzusok_ar_table th{
        font-size: clamp(0.8rem, 4.5vw, 1.2rem);
    }
    .kurzusok_ar_table td{
        font-size: clamp(0.7rem, 4vw, 1rem);
    }
    .k_m_card_e_bottom_jelentkezes{
        width: 95%;
        height: 55px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-around;
    }
    .kmcard_redirect{
        width: 48%;
        height: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 5px 10px;
        font-family: "Crimson Pro", serif;
        border-radius: 0.5rem;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
    }
    .kmcard_jelentkezes_buttonholder p, .kmcard_jelentkezes_buttonholder, .kmcard_redirect p, .kmcard_redirect img{
        display: none;
    }
    .kmcard_redirect button{
        height: 95%;
        width: 90%;
        padding: 10px 70px 10px 70px;
        border-radius: 1.5rem;
        font-size: 0.9rem;
        font-weight: 600;
    }




    
                                /*kapcsolat oldal */
    .k_contact_holder{
        width: 95vw;
        margin-top: 45px;
        height: 900px;
        padding: 50px 0 50px 0;
    }
    .k_contact_body{
        flex-direction: column;
        justify-content: space-around;
    }
    .k_contact_body_right, .k_contact_body_left{
        width: 100%;
        height: 50%;
    }
    .k_contact_adatok{
        font-size: clamp(1.1rem, 1.4vw, 2rem);
    }
    .k_c_parafa_papir{
        width: 100%;
    }
    .k_gyik_body{   
        width: 100%;
    }
    .k_c_parafa_papir a{
        font-size: clamp(0.7rem, 1.5vw, 1rem);
    }
    .k_c_parafa_papir img{
        height: 50%;
    }
    .k_c_parafa_papir p{
        font-size: clamp(0.9rem, 1.05vw, 1.6rem);
    }
    .k_gyik_button{
        font-size: clamp(0.9rem, 1.1vw, 1.6rem);
    }
    .k_gyik_elem{
        width: 90%;
    }
    .i_ertekeles{
        width: 80%;
    }
    .i_ertekeles_bigscreen{
        width: 90%;
    }
    .i_e_b_nev{
        font-size: clamp(1rem, 5vw, 1.4rem);
    }
    .k_contact_adatok_szoveg{
        font-size: clamp(1.2rem, 3vw, 1.4rem);
        line-height: clamp(1.4rem, 3vw, 1.4rem);
    }
}

/* viewport nelkuli global*/
    section{
        position: fixed;
        top: 45px;
        width: 100%;
        height: calc(100vh - 45px);
    }
    .nav_green{ /*index*/
        background: linear-gradient(180deg, rgb(27, 46, 28), rgba(27, 46, 28, 0.8));
    }
    .nav_lila{  /*kurzusok*/
        background: linear-gradient(180deg, rgb(46, 27, 42), rgba(46, 27, 42, 0.8));
    }
    .nav_orange{    /*feladatok*/
        background: linear-gradient(180deg, rgb(59, 38, 25), rgba(59, 38, 25, 0.8));
    }
    .nav_red{ /*kapcsolat*/
        background: linear-gradient(180deg, rgb(45, 22, 22), rgba(45, 22, 22, 0.8));
    }
    .nav_blue{ /*mesetábor*/
        background: linear-gradient(180deg, rgb(27, 31, 46), rgba(27, 31, 46, 0.8));
    }
/*index site - fooldal*/
.index_section{
    position: absolute;
    overflow-y: auto;
    right: 0;
    width: 100%;
    z-index: 1;
    background: none;
}
.index_section::before{
    content: "";
    position: fixed;
    left: 0;
    width: 100vw;
    height: 100vh;
    background:
        linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.2)),
        url(assets/bemutatkozas/index_back.jpg);

    background-size: cover;
    filter: blur(4px);
    z-index: -2;
}
.index_mainbemutatkozas, .index_tanuloknak, .index_kollegaknak, .index_szuloknek{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.index_redir_text{
    color: darkblue;
    text-shadow: 1px 1px 1px rgba(255, 113, 113, 0.3);
    text-decoration: underline 0.3px;
    font-style: italic;
}
.i_mainbemutatkozas_holder{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-family: "Crimson Pro", serif;
}
.i_mainbemutatkozas_body{
    display: flex;
    justify-content: center;
    align-items: center;
    display: flex;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
    background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
}
.ibm_bodybubble{ /* a body maga a feher hatter, es ez a benne levo buborek*/
    background: linear-gradient(/*test*/ 135deg, rgba(255, 255, 255, 0.85), rgba(240, 240, 240, 0.75));
    padding: 1%;
    border-radius: 13px;
    border: 1px solid rgba(0, 0, 0, 0.3);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.ibm_right_main{
    display: flex;
    flex-direction: column;
    align-items:center ;
    justify-content: space-between;
}
.imb_right_main_head{
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(/*test*/ 135deg, rgba(255, 255, 255, 0.65), rgba(240, 240, 240, 0.55));
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
    border-radius: 0.4rem;
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
}
.imb_right_main_head p{
    font-family: "Crimson Pro", serif;
    color: rgba(32, 32, 32, 0.99);
    text-shadow: 2px 2px 0.3px rgba(211, 211, 211, 0.7);
    font-weight: 700;
    padding: 0 20px;
}
.ibm_right_main_body{
    height: 80%;
    width: 90%;
    display: flex;
    align-items:center ;
    justify-content: center;
}
.ibm_right_main_body p{
    font-family: "Crimson Pro", serif;
}
.ibm_right_bottom{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}
.ibm_right_bottom_button{
        border-radius: 1.3rem;
        font-weight: 700;
        font-family: "Crimson Pro", serif;
        cursor: pointer;
        position: relative;
        overflow: hidden;
        z-index: 1;
        border: 1px solid #000;
        transition: color 0.35s ease;
        -webkit-transition: color 0.35s ease;
        color: #fff;
        text-shadow: 1px 1px 0.1px rgba(0, 0, 0, 0.7);
}
.ibmr_button_c1{
    background: linear-gradient(150deg, #D93D04,#8C1C03);
}
.ibmr_button_c1::before{
    background: linear-gradient(150deg, #e47938, #b44830);
}
.ibmr_button_c2{
    background: linear-gradient(150deg, #6669e6,#6b498a);
}
.ibmr_button_c2::before{
    background: linear-gradient(150deg, #7b7cf0, #8160a8);
}
.ibmr_button_c3{
    background: linear-gradient(150deg, #f56e64, #d54a73);
}
.ibmr_button_c3::before{
    background: linear-gradient(150deg, #ff8b8a, #da6aa1);
}
.index_tanuloknak_holder, .index_kollegaknak_holder, .index_szuloknek_holder{
    display: flex;
    justify-content: center;
    flex-direction: column;
    font-family: "Crimson Pro", serif;
}
.i_tanuloknak_head, .i_kollegaknak_head, .i_szuloknek_head{
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(to right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
    margin-bottom: 20px;
    border-radius: 0.2rem;
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
}
.i_tanuloknak_head p, .i_kollegaknak_head p, .i_szuloknek_head p{
    font-family: "Crimson Pro", serif;
    color: rgba(255, 255, 255, 0.99);
    text-shadow: 2px 2px 0.3px rgba(0, 0, 0, 0.7);
    font-weight: 700;
}
.i_tanuloknak_body{
    padding-top: 15px;
    padding-bottom:15px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
    background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
}
.i_tanuloknak_body img{
    pointer-events: none;
}


.i_szuloknek_body, .i_kollegaknak_body{
    padding-top: 15px;
    padding-bottom:15px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    display: flex;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
    background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
}

.i_f_whiteboard_back, .index_szuloknek_back{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.i_f_whiteboard, .sz_f_kepkeret{
    background: radial-gradient(circle at 45% 45%, #fafafa 0%, #f5f5f5 50%, #efefef 100%);
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 95%;
    height: 95%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5),   /*index boxshadow 1*/
                0 8px 16px rgba(0, 0, 0, 0.4),
                0 12px 24px rgba(0, 0, 0, 0.5);
}
.i_f_whiteboard::before, .sz_f_kepkeret::before{ /* rajta az elementem arnyekok befele*/
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    box-shadow: inset 0 0 80px rgba(0, 0, 0, 0.2),
                inset 0 0 60px rgba(0, 0, 0, 0.2);
    pointer-events: none;
    z-index: 10;
}
.i_f_w_sarok{ /* a filces tábla sarkai*/
    position: absolute;
    background: url(assets/bemutatkozas/whiteboard_sarok.png);
    background-size: 100% 100%;
    z-index: -1;
}
.sz_f_k_sarok{
    position: absolute;
    background: url(assets/szuloknek/kepkeret_sarok.png);
    background-size: 100% 100%;
    z-index: -1;
}
.i_sarok_A{top: -2px; left: -2px; transform: rotate(0deg);} /* sarkoknal eleg ugyan azt a bal felso sarkas iamget rotatelni*/
.i_sarok_B{top: -2px; right: -2px; transform: rotate(90deg);}
.i_sarok_C{bottom: -2px; right: -2px; transform: rotate(180deg);}
.i_sarok_D{bottom: -2px; left: -2px; transform: rotate(270deg);}
 .sz_sarok_A{top: -2px; left: -2px; transform: rotate(270deg);} /* mas a base orientacioja a kepnek*/
 .sz_sarok_B{top: -2px; right: -2px; transform: rotate(0deg);}
 .sz_sarok_C{bottom: -2px; right: -2px; transform: rotate(90deg);}
 .sz_sarok_D{bottom: -2px; left: -2px; transform: rotate(180deg);}

.i_f_w_border, .sz_f_k_border{ /* a filces tábla sarkai*/
    position: absolute;
    background-size: 100% 100%;
    z-index: -2;
}
/* tabla szeleinel viszont nem lehet normalisan top:0 val ha nincs kulon vert meg horizon*/
/* defualt vertical jobboldali, enne la 2nel top0 nelkul kimegy keretbol*/
.i_border_left{top: 0; left: -2px; transform: rotate(180deg); background-image: url(assets/bemutatkozas/whiteboard_border_vertical.png);}
.i_border_right{top: 0; right: -2px; transform: rotate(0deg); background-image: url(assets/bemutatkozas/whiteboard_border_vertical.png);}
/*default horizontal bottom tajolasu*/
.i_border_top{top: -2px; right: 0; transform: rotate(180deg); background-image: url(assets/bemutatkozas/whiteboard_border_horizontal.png);}
.i_border_bottom{bottom: -2px; right: 0; transform: rotate(0deg); background-image: url(assets/bemutatkozas/whiteboard_border_horizontal.png);}

.sz_border_left{top: 0; left: -2px; transform: rotate(180deg); background-image: url(assets/szuloknek/kepkeret_szele_vertical.png);}
.sz_border_right{top: 0; right: -2px; transform: rotate(0deg); background-image: url(assets/szuloknek/kepkeret_szele_vertical.png);}
/*default horizontal bottom tajolasu*/
.sz_border_top{top: -2px; right: 0; transform: rotate(180deg); background-image: url(assets/szuloknek/kepkeret_szele_horizontal.png);}
.sz_border_bottom{bottom: -2px; right: 0; transform: rotate(0deg); background-image: url(assets/szuloknek/kepkeret_szele_horizontal.png);}


.i_kollegaknak_content{
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 100%;
}
.i_kollegaknak_content_title{
    height: 55px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.i_kollegaknak_content_title p{
    font-family: "Permanent Marker", cursive;
    font-weight: 570;
    font-size: clamp(1.4rem, 2.5vw, 2.2rem);
    color: blue;
}
.i_kollegaknak_content_p1, .i_kollegaknak_content_p2, .i_kollegaknak_content_p3{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-y: hidden;
}

.i_kollegaknak_content_p1 p , .i_kollegaknak_content_p2 p{   /*  maga a bemutatkozas*/  
    font-family: "Patrick hand", cursive;
    color: #000;
    width: 90%;
    height: 100%;
    font-weight: 500;
    display: block;
    text-align: justify;
}
.i_kollegaknak_content_p3 p{
    font-weight: 550;
    font-family: "Patrick hand", cursive;
    color: #000;
    width: 90%;
    height: 100%;
}

.i_szuloknek_content{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-family: "Crimson Pro", serif;
    color: rgba(0, 0, 0, 0.99);
    text-shadow: 2px 2px 0.3px rgba(209, 209, 209, 0.7);
}


.index_scrolltotop{
    position: fixed;
    z-index: 500;
    width: 70px;
    transition: right 0.3s ease-in-out;
}
.index_scrolltotop button{
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
    border-radius: 50%;
    padding: 10px;
    border: 0.5px solid rgba(0, 0, 0, 0.5);
    cursor: pointer;
    position: relative;
    transition: color 0.35s ease;
    -webkit-transition: color 0.35s ease;
}


/*tanuloknak site*/


.t_single_paperholder img, .t_stickyholder img {
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
}





                                                            /*kurzusok oldal*/

                                        /*kurzusok sidecontent*/
        
    .kurzusok_sidecontent{
        overflow-x: hidden;
        overflow-y: hidden; 
        display: flex;
        align-items: center;
        flex-direction: column;

    }
    .kurzusok_sidecontent::before{
        content: "";
        background-size: cover, cover;
        background-repeat: no-repeat, no-repeat;
        z-index: -2;
    }
    .k_sidecontent_head{
        flex-shrink: 0;
        width: 95%;
        display: flex;
        flex-direction: column;
        border-radius: 0.6rem;
        background: linear-gradient(40deg,rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.1)) ;
        box-shadow: 
            inset 0 -1px 0 rgba(255, 255, 255, 0.3),         /* test */
            0 1px 2px rgba(0, 0, 0, 0.3); 
    }
    .k_sidecontent_cim{
        width: 70%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_sidecontent_cim p{
        font-size: clamp(1.3rem, 1rem + 0.7vw, 1.8rem);
        font-weight: 700;
        color: rgb(255, 255, 255);
        text-shadow:
            0 0 4px rgba(0,0,0,.6),
            0 0 12px rgba(0,0,0,.4);
    }
    .k_mutassmindent_wrapper{
        padding: 10px 0 10px 0;
        width: 100%; /* hogy mimicelje alatta a filtereket */
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 50%;
        padding-right: 10px;
    }
    .k_mutassmindent_icon_holder{ /* ugyan ezen a diven van sima iconos class mar*/
        width: 25%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_mutassmindent_button_holder{
        width: 70%;
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }
    .k_mutassmindent_button{
        border-radius: 0.5rem;
        font-weight: 600;
        font-size: 0.9rem;
        border: 1px solid #000;
        font-family: "Crimson Pro", serif;
        color: #fff;
        text-shadow: 1px 1px 0.1px rgba(0, 0, 0, 0.7);
        background: linear-gradient(150deg, #d01c52, #a6357e);
        cursor: pointer;
        transition: transform 0.3s ease-out, box-shadow 0.3s ease-out; /*transition 1 emelkedo*/
    }
    
    .k_mutassmindent_button:hover{
        transform: translateY(-1px);    /*transition 1 emelkedo*/
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25);     /*transition 1 emelkedo*/
    }
    .k_sidecontent_main_title{
        width: 100%;
        height: 50%;
        display: flex;
    }
    .k_sidecontent_collapse button:hover{
       background: #b60000da;
    }
    .k_sidecontent_collapse button{
        background-color: transparent;
        border: none;
        background: rgb(128, 2, 2);
        flex-shrink: 0;
        background-size: 100% 100%;
        cursor: pointer;
        border: 1px solid rgba(0, 0, 0, 0.472);
        border-radius: 0.8rem;
        color: #fff;
        font-size: 18px;
        font-weight: 700;
        transition: background-color 0.2s ease, color 0.2s ease;
        }
    .k_sidecontent_collapse{
        position: relative;
        width: 25%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_sidecontent_body{
        display: flex;
        flex-direction: column;
        overflow-y: auto;
    }
    .k_sidecontent_kategoria{
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        flex-shrink: 0;
    }
    .k_sidecontent_kategoriacim{
        position: relative;
        width: 80%;
        margin: 10px 0;
        border-bottom: 1px solid #000;
        border-top: 1px solid #0000007c;
        border-radius: 0.6rem;
        background: linear-gradient( 120deg, rgba(251, 214, 245, 0.2) 20%, rgba(255, 208, 246, 0.1) 70%, rgba(255, 126, 233, 0.1) 90%);
        box-shadow: 
            inset 0 -1px 0 rgba(255, 255, 255, 0.3),         /* test */
            0 1px 2px rgba(0, 0, 0, 0.3); 
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 4px 0.5rem;
        cursor: pointer;
    }
    .k_sidecontent_kategoriacim p{
        flex: 1;
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        font-size: 1.2rem;
        color: rgb(255, 255, 255);
        text-shadow:
            0 0 4px rgba(0,0,0,.6),
            0 0 12px rgba(0,0,0,.4);
        text-align: center;
        transition: opacity 0.2s ease;
    }
    .k_s_k_list{
        padding: 10px 0;
        margin: 0 5px;
        display: flex;
        align-items: flex-end;
        flex-direction: column;
        gap: 0.5rem;
        font-family: "Crimson Pro", sans-serif;
        font-weight: 500;
        font-size: 1rem;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
        border-radius: 0.4rem;
        flex-shrink: 0;
    }

    .k_s_k_listaelem{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin: 0.1rem;
        cursor: pointer;
        gap: 0.2rem;
        height: 48px;
        flex-shrink: 0;
    }
    .k_s_k_l_image{ /*container divje*/
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
    }
    .k_s_k_l_image img{
        width: 25px;
        height: 25px;
        flex-shrink: 0;
        object-fit: contain;
    }
    .k_s_k_l_image::before{
        position: absolute;
        width: 35px;
        height: 35px;
        content: "";
        background: linear-gradient(to bottom,rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)) ;
        border-radius: 20%;
        border: 1px solid rgba(95, 95, 95, 0.6);
        z-index: -2;
    }
    .k_s_K_l_checkbox_text{
        position: relative;
        width: 60%;   
    }
    .k_s_K_l_checkbox_text p{
        text-align: center;
        font-family: "Crimson Pro", serif;
        font-weight: 450;
        color: rgba(245, 245, 245, 0.9);
        text-shadow:
            0 0 4px rgba(0,0,0,.6),
            0 0 12px rgba(0,0,0,.4);
    }
        
    .k_s_k_l_checkbox{ /* sima checkbox accesiblity miatt*/
        position: absolute;
        opacity: 0;
        pointer-events: none;
        z-index: -100;
    }
    .k_fo_checkbox{ /* fokategória master toggle */
        position: absolute;
        opacity: 0;
        pointer-events: none;
        z-index: -100;
    }
    .k_fo_checkbox:checked ~ .k_s_k_l_checkbox_switch{
        background-color: purple;
    }
    .k_fo_checkbox:checked ~ .k_s_k_l_checkbox_switch::before{
        transform: translateX(14px);
    }
    .k_sidecontent_kategoriacim:has(.k_fo_checkbox:not(:checked)) p {
        opacity: 0.5;
    }
    .k_s_k_l_checkbox_switch{
        width: 34px;
        height: 24px;
        background-color: rgba(255, 255, 255, 0.4);
        border-radius: 20%;
        position: relative;
        flex-shrink: 0;
        transition: background-color 0.2s ease;
        margin-right: 0.4rem;
    }
    .k_s_k_l_checkbox_switch::before{
        content: "";
        position: absolute;
        width: 14px;
        height: 18px;
        top: 3px;
        left: 3px;
        background: white;
        border-radius: 50%;
        transition: transform 0.2s ease;
        box-shadow: 0 1px 3px rgba(0,0,0,0.35);
    }
    .k_s_k_l_checkbox:checked ~ .k_s_k_l_checkbox_switch{
        background-color: purple;
    }
    .k_s_k_l_checkbox:checked ~ .k_s_k_l_checkbox_switch::before{
        transform: translateX(14px);
    }

    /* Greyscale effektusok a szűrőkhöz */
    /* "Mutass mindent" gomb greyscale (alapértelmezett, ha minden be van kapcsolva) - csak a gomb, NEM az ikon */
    .k_mutassmindent_button.greyscaled {
        filter: grayscale(100%);
        opacity: 0.6;
        transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease-out, box-shadow 0.3s ease-out;
    }
    /* Egyéni kategória kikapcsolt állapot: greyscale az ikonra és szövegre */
    .k_s_k_listaelem.kategoria-off .k_s_k_l_image img {
        filter: grayscale(100%);
        opacity: 0.45;
        transition: filter 0.3s ease, opacity 0.3s ease;
    }
    .k_s_k_listaelem .k_s_k_l_image img {
        transition: filter 0.3s ease, opacity 0.3s ease;
    }
    .k_s_k_listaelem.kategoria-off .k_s_K_l_checkbox_text p, .k_s_k_listaelem_alelemmel_al.kategoria-off{
        filter: grayscale(100%);
        opacity: 0.45;
        transition: filter 0.3s ease, opacity 0.3s ease;
    }
    .k_s_k_listaelem .k_s_K_l_checkbox_text p, .k_s_k_listaelem_alelemmel_al .k_s_K_l_checkbox_text p{
        transition: filter 0.3s ease, opacity 0.3s ease;
    }
    
    
                                            /*kurzusok MAINcontent*/


    .kurzusok_maincontent_wrapper{
        padding-top: 20px;
        display: flex;
        flex-direction: column;
        gap: 1rem;
        align-items: center;
    }
    .d_kurzusok_navbar{ /* legacynak tunik de ez holdolja a cimeket*/
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        justify-content: center;
        align-items: center;
        font-family: "Crimson Pro", serif;
        padding-bottom: 35px;
    }
    .d_k_nav_cim_fo, .d_k_nav_cim_al{
        color: rgb(255, 255, 255);
        text-shadow:
            1px 1px 4px rgba(0,0,0,.4),
            0 0 12px rgba(0,0,0,.4);
        border-radius: 0.2rem;
        padding: 5px 15px 5px 15px;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: linear-gradient(to right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
        -webkit-backdrop-filter: blur(7px);
        backdrop-filter: blur(7px);
    }
    .d_k_nav_cim_fo{
        font-weight: 700;
        text-align: center;
    }
    .d_k_nav_cim_al{
        font-weight: 600;
        text-align: center;
    }
    .k_m_fokategoria{
        position: relative;
        width: 95%;
        display: flex;
        flex-direction: column;
        gap: 0;
        padding-bottom: 2rem;
        align-items: center;
    }

    .k_m_fokategoria_cim{
        background: linear-gradient(to right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        margin-bottom: 10px;
        margin-left: 10px;
        padding: 5px 50px 5px 50px;
        border-radius: 0.4rem;
        -webkit-backdrop-filter: blur(7px);
        backdrop-filter: blur(7px);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-wrap-mode: nowrap;
        text-wrap: nowrap;
    }
    .k_m_fokategoria_cim p{
        text-align: center;
        font-family: "Crimson Pro", serif;
        font-weight: 600;
        color: rgb(255, 255, 255);
        text-shadow:
            1px 1px 4px rgba(0,0,0,.6),
            0 0 12px rgba(0,0,0,.4);
    }
    .k_m_fokategoria_cardsholder{
        width: 100%;
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
        display: flex;
        flex-direction: row;
        row-gap: 2rem; 
        column-gap: 1.5rem;
        flex-wrap: wrap;
        justify-content: space-around;
        border-radius: 0.3rem;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
    }
    
                                        /*kurzusok kártya*/
    .kmcard_white{
        background: linear-gradient(  /*test*/
        135deg,
            rgba(255, 255, 255, 0.75),
            rgba(240, 240, 240, 0.65)
        );
    }
    .kmcard_blue {
        background: linear-gradient(
            135deg,
            rgba(177, 198, 255, 0.95) 0%,
            rgba(196, 209, 251, 0.85) 40%,
            rgba(168, 251, 225, 0.7) 100%
        );
    }
    .kmcard_red {
        background: linear-gradient(
            135deg,
            rgba(244, 158, 158, 0.95) 0%,
            rgba(225, 169, 169, 0.85) 40%,
            rgba(251, 196, 168, 0.7) 100%
        );
    }
    .kmcard_rozsaszin {
        background: linear-gradient(
            135deg,
            rgba(239, 188, 219, 0.95) 0%,
            rgba(255, 210, 240, 0.85) 40%,
            rgba(225, 168, 251, 0.7) 100%
        );
    }
    .kmcard_green {
        background: linear-gradient(
            135deg,
            rgba(166, 191, 166, 0.95) 0%,
            rgba(221, 238, 221, 0.85) 40%,
            rgba(251, 251, 168, 0.7) 100%
        );
    }
    

    .k_m_card.modal-open, /* furcsa glitchek voltak anim miatt*/
    .k_m_card.modal-open:hover {
        transform: none !important;
        transition: none !important;
    }
    .k_m_card_kepek{
        display: flex;
        flex-direction: column;
    }
    .k_m_card_kepek_kicsi{ /* mindig a sima nev a conatinelo div*/
        height: 20%;
    }
    .k_m_c_extracim{ /* ha a cardon belul a zaszlohoz kell meg egy focim*/
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        font-family: "Crimson Pro", serif;
        font-weight: 700;
    }
    .k_m_c_extraflag{ /* ha 2 nyelv is kell todo:online-offline jelolesek*/
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    .k_m_card_kepek_kicsi img{
        width: 25%;
        height: 80%;
    }
    .k_m_card_kepek_nagy_holder{
        height: 80%;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
    }
    .k_m_card_kepek_nagy_main{
        width: 85%;
    }
    .k_m_card_kepek_nagy_main img{
        width: 100%;
        height: auto;
    }
    .k_m_card_kepek_nagy_kicsik{
        width: 15%;
    }
    .k_m_card_kepek_nagy_kicsik img{
        width: 80%;
        height: auto;
    }
    .k_m_card_cim{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .k_m_card_cim p{
        font-family: "Crimson Pro", serif;
        font-weight: 600;
        text-align: center;
    }
    .k_m_card_ebutton{ /* a div ami tartja a gombot*/
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_m_card_ebutton button{
        font-weight: 700;
        font-family: "Crimson Pro", serif;
        cursor: pointer;
        position: relative;
        overflow: hidden;
        z-index: 1;
        border: 1px solid #000;
        transition: color 0.35s ease;
        -webkit-transition: color 0.35s ease;
    }
    .k_m_card_ebutton button::before{
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        opacity: 0;
        transition: opacity 0.35s ease;
        -webkit-transition: opacity 0.35s ease;
        pointer-events: none;
    }
    /*beforeal megldva apple webkit miatt*/
    .k_m_card_ebutton_altalanos{
        background: linear-gradient(150deg, #6669e6,#6b498a);
        color: #fff;
        text-shadow: 1px 1px 0.1px rgba(0, 0, 0, 0.7);
    }
    .k_m_card_ebutton_altalanos::before{
        background: linear-gradient(150deg, #7b7cf0, #8160a8);
    }
    .k_m_card_ebutton_altalanos:hover::before{
        opacity: 1;
    }

    .k_m_card_ebutton_kozep{
        background: linear-gradient(150deg, #D93D04,#8C1C03);
        color: #fff;
        text-shadow: 1px 1px 0.1px rgba(0, 0, 0, 0.7);
    }
    .k_m_card_ebutton_kozep::before{
        background: linear-gradient(150deg, #e47938, #b44830);
    }
    .k_m_card_ebutton_kozep:hover::before{
        opacity: 1;
    }

    .k_m_card_ebutton_fuggetlen{
        background: linear-gradient(150deg, #f56e64, #d54a73);
        color: #ffffff;
        text-shadow: 1px 1px 0.1px rgba(26, 26, 26, 0.7);
    }
    .k_m_card_ebutton_fuggetlen::before{
        background: linear-gradient(150deg, #ff8b8a, #da6aa1);
    }
    .k_m_card_ebutton_fuggetlen:hover::before{
        opacity: 1;
    }

    .k_m_card_extend{
        display: none;
        position: fixed;
        flex-direction: column;
        background: linear-gradient(
            135deg,
            rgba(255, 222, 222, 0.99) 0%,
            rgba(255, 221, 186, 0.99) 40%,
            rgba(254, 231, 198, 0.99) 100%
            );
        border: 1px solid rgba(0, 0, 0, 0.582);
        box-shadow:
            0 8px 20px rgba(0,0,0,0.18),
            inset 0 1px 0 rgba(255,255,255,0.4);
        transform: translateY(100vh);
        transition: transform 0.3s ease;
    }
    .k_m_card_extend.card-extend-open{
        transform: translateY(0);
    }
    .k_m_card_backdim{
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        pointer-events: auto;
        opacity: 0;
        transition: opacity 0.2s ease;
    }
    .k_m_card_backdim.card-extend-open{
        opacity: 1;
    }  
    /* card extend top row*/
    .k_m_card_e_top{
        width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-around;
        border-bottom: 2px solid #000;
    }
    .k_m_card_e_top_cim_single{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_m_card_e_top_cim_single p{
        text-align: center;
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        overflow-wrap: break-word;
    }
    .k_m_card_e_top_close{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_card_closebutton{
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgb(128, 2, 2);
        border: 1px solid black;
        color: #fff;
        border-radius: 1rem;
        font-weight: 700;
        cursor: pointer;

    }
    .k_card_closebutton p{
        font-family: "Crimson Pro", serif;
        font-weight: 700;
        font-size: 20px;
        cursor: pointer;
    }
    .k_m_card_e_top_kep_single img{
        height: 65%;
        border-radius: 0.5rem;
        translate: -5px 0 0 0;
    }
    /* card extend mid row*/

    .k_m_card_e_mid_szoveg_alcim p{
        text-align: left;
        font-family: "Crimson Pro", serif;
        font-style: italic;
    }

    .k_m_card_e_mid_szoveg_content p{
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        padding: 1rem;
        height: 95%;
        text-align: justify;
    }
    /* card extend bottom sor*/

    .k_m_card_e_bottom_ar{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .kurzusok_ar_table{
        width: 100%;
        font-family: "Crimson Pro", serif;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
        border-radius: 0.3rem;
    }
    .kurzusok_ar_table th{
        font-weight: 600;
        border-bottom: 0.3px solid rgba(0, 0, 0, 0.5);
        text-align: center;
    }
    .kurzusok_ar_table td{
        font-weight: 500;
        text-align: left;
    }
    .kmcard_jelentkezes_buttonholder button, .kmcard_redirect button{
        display: flex;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        font-family: "Crimson Pro", serif;
        cursor: pointer;
        position: relative;
        overflow: hidden;
        z-index: 1;
        border: 1px solid #000;
        transition: color 0.35s ease;
        -webkit-transition: color 0.35s ease;
    }
    /* maga a before element csak desktop + tableten van*/
    .k_jelentkezes_button1{
        background: linear-gradient(150deg, #107aded2, #5b18d0cd);
    }
    .k_jelentkezes_button1::before{
        background: linear-gradient(150deg, #4b94f5, #8f7ef0);
    }
    .k_jelentkezes_button2{
        background: linear-gradient(150deg, #4622e3cd, #9e1068);
    }
    .k_jelentkezes_button2::before{
        background: linear-gradient(150deg, #6f59f4, #c47aa4);
    }
    .k_jelentkezes_button3{
        background: linear-gradient(150deg,#9e1068, #c30f12);
    }
    .k_jelentkezes_button3::before{
        background: linear-gradient(150deg, #d86aa8, #e78356);
    }
    .kmcard_jelentkezes_buttonholder button:hover::before{
        opacity: 1;
    }

    .k_m_card_e_bottom_jelentkezes button a{
        display: flex;
        position: absolute;
        inset: 0;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        color: #fff;
        text-shadow: 1px 1px 0.1px rgba(0, 0, 0, 0.7);
        text-wrap: nowrap;
        cursor: pointer;
    }
    .kmcard_jelentkezes_lefticon{
        height: 22px;
    }
    
    

    /* Collapse gomb: desktop only text symbol morph */


                                                                /*kapcsolat oldal */
    .kapcsolat_section{
        position: absolute;    
        right: 0;
        width: 100%;
        overflow-y: auto;
        z-index: 1;
        background: none;
    }
    .kapcsolat_section::before{
        content: "";
        position: fixed;
        left: 0;
        width: 100vw;
        height: 100%;
        background-image: url(assets/kapcsolat/kapcsolat_back.jpg);
        background-size: cover;
        filter: blur(4px);
        z-index: -2;
    }
    .k_gyik, .k_contact{
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_contact_head{
        height: 55px;
        display: flex;
        justify-content: center;
        align-items: center;
        background: linear-gradient(to right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        margin-bottom: 20px;
        padding: 5px 15px 5px 15px;
        border-radius: 0.2rem;
        text-shadow: 1px 1px 0.1px rgba(0, 0, 0, 0.7);
        color: rgba(255, 255, 255, 0.99);
    }

    .k_contact_head p{
        font-family: "Crimson Pro", serif;
        color: rgba(255, 255, 255, 0.99);
        text-shadow: 2px 2px 0.3px rgba(0, 0, 0, 0.7);
        font-size: clamp(1.4rem, 2.2vw, 1.8rem);
        font-weight: 700;
    }
    .k_gyik_holder{
         width: 95%;
    }
    .k_contact_holder, .k_gyik_holder{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        font-family: "Crimson Pro", serif;
    }
    .k_contact_body{
        width: 100%;
        height:calc(100% - 55px);
        display: flex;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
    }

    .k_contact_body_left, .k_contact_body_right{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .k_contact_body_left_bubble{
        width: 90%;
        height: auto;
        display: flex;
        align-items: center;
        flex-direction: column;
        background: linear-gradient(/*test*/ 135deg, rgba(254, 186, 186, 0.35), rgba(219, 147, 147, 0.45));
        padding: 5%;
        border-radius: 13px;
        border: 1px solid rgba(0, 0, 0, 0.3);
        box-shadow:
            0 8px 20px rgba(0,0,0,0.18),
            inset 0 1px 0 rgba(255,255,255,0.4);
    }
    .k_contact_logo{
        width: 100%;
        flex-shrink: 0;
        padding: 10px 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .k_contact_logo img{
        width: 30%;
    }
    .k_contact_adatok{
        height: auto;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items:center;
        color: rgba(255, 255, 255, 0.9);
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        line-height: clamp(1.1rem, 1.3vw, 1.6rem);
        text-shadow: 1px 1px 0.1px rgba(0, 0, 0, 0.7);
    }
    .k_contact_adatok_top{
        height: auto;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 10px 0;
        border-radius: 0.5rem;
        border: 1px solid rgba(0, 0, 0, 0.3);
        box-shadow:
            0 8px 20px rgba(0,0,0,0.18),
            inset 0 1px 0 rgba(255,255,255,0.4);
        background: linear-gradient(/*test*/ 135deg, rgba(54, 5, 40, 0.3), rgba(55, 10, 74, 0.2));
    }
    .k_contact_adatok_szoveg{
        width: 80%;
        height: auto;
        text-align: center;
        padding: 0 5% 5% 5%;
    }
    .k_c_parafa{
        position: relative;
        background-image: url(assets/kapcsolat/k_parafa_back.png);
        background-size: cover;
        z-index: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 90%;
        height: 90%;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5),   /*index boxshadow 1*/
                    0 8px 16px rgba(0, 0, 0, 0.4),
                    0 12px 24px rgba(0, 0, 0, 0.5);
    }
    .k_c_parafa_papir_holder{
        position: relative;
        width: 90%;
        height: 90%;
        z-index: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;

    }
    .k_c_parafa_papir{
        height: 25%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 3% 6% 3% 6%;
    }
    .k_c_parafa_papir p{
        font-family: "Crimson Pro", serif;
        color: rgba(0, 0, 0, 0.99);
        text-shadow: 2px 2px 0.3px rgba(255, 255, 255, 0.7);
        font-weight: 500;
    }
    .k_c_parafa_papir a{
        padding: 10px 15px 10px 15px;
        border-radius: 0.7rem;
        text-shadow: 1px 1px 0.3px rgba(0, 0, 0, 0.7);
        font-weight: 700;
        height: 65%;
        min-width: 25%;
        max-width: 30%;
        font-family: "Crimson Pro", serif;
        color: rgb(255, 255, 255);
        cursor: pointer;
        z-index: 2;
        border: 1px solid #000;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.4) inset, 0 1px 0 rgba(255, 255, 255, 0.6);
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
    }
    .k_c_parafa_papir_messimg{
        min-height: clamp(100%, 1vw, 150%);
        padding-right: 5px;
        padding-bottom: 1px;
    }
    .papir_1{
        background-image: url(assets/kapcsolat/papir_1.png);
        background-size: 100% 100%;
    }
    .papir_1 a{
        background: linear-gradient(150deg, #107aded2, #5b18d0cd);
    }
    .papir_2{
        background-image: url(assets/kapcsolat/papir_2.png);
        background-size: 100% 100%;
    }
    .papir_2 a{
        background: linear-gradient(150deg, #4622e3cd, #9e1068);
    }
    .papir_3{
        background-image: url(assets/kapcsolat/papir_3.png);
        background-size: 100% 100%;
    }
    .papir_3 a{
        background: linear-gradient(150deg,#9e1068, #c30f12);
    }

    .k_c_parafa::before{ /* rajta az elementem arnyekok befele*/
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        box-shadow: inset 0 0 80px rgba(0, 0, 0, 0.2),
                    inset 0 0 60px rgba(0, 0, 0, 0.2);
        pointer-events: none;
        z-index: 10;
    }
    .k_c_sarok{ /* a filces tábla sarkai*/
        position: absolute;
        width: clamp(25px, 30px, 40px);
        height: clamp(25px, 30px, 40px);
        background: url(assets/bemutatkozas/whiteboard_sarok.png);
        background-size: 100% 100%;
        z-index: -1;
    }
    .k_sarok_A{top: -2px; left: -2px; transform: rotate(0deg);} /* sarkoknal eleg ugyan azt a bal felso sarkas iamget rotatelni*/
    .k_sarok_B{top: -2px; right: -2px; transform: rotate(90deg);}
    .k_sarok_C{bottom: -2px; right: -2px; transform: rotate(180deg);}
    .k_sarok_D{bottom: -2px; left: -2px; transform: rotate(270deg);}

    .i_f_w_border{ /* a filces tábla sarkai*/
        position: absolute;
        background-size: 100% 100%;
        z-index: -2;
    }
    /* tabla szeleinel viszont nem lehet normalisan top:0 val ha nincs kulon vert meg horizon*/
    /* defualt vertical jobboldali, enne la 2nel top0 nelkul kimegy keretbol*/
    .k_border_left{top: 0; left: -2px; transform: rotate(180deg); height: 98%; width: clamp(10px, 15px, 20px); background-image: url(assets/bemutatkozas/whiteboard_border_vertical.png);}
    .k_border_right{top: 0; right: -2px; transform: rotate(0deg); height: 98%; width: clamp(10px, 15px, 20px); background-image: url(assets/bemutatkozas/whiteboard_border_vertical.png);}
    /*default horizontal bottom tajolasu*/
    .k_border_top{top: -2px; right: 0; transform: rotate(180deg); height: clamp(10px, 15px, 20px); width: 98%; background-image: url(assets/bemutatkozas/whiteboard_border_horizontal.png);}
    .k_border_bottom{bottom: -2px; right: 0; transform: rotate(0deg); height: clamp(10px, 15px, 20px); width: 98%; background-image: url(assets/bemutatkozas/whiteboard_border_horizontal.png);}





    .k_gyik_head{
        background: linear-gradient(to right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 20px 0 20px 0;
        padding: 5px 15px 5px 15px;
        border-radius: 0.2rem;
    }
    .k_gyik_head p{
        font-family: "Crimson Pro", serif;
        color: rgba(255, 255, 255, 0.99);
        text-shadow: 2px 2px 0.3px rgba(0, 0, 0, 0.7);
        font-size: clamp(1.4rem, 2.2vw, 1.8rem);
        font-weight: 700;
    }
    .k_gyik_body{
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
        display: flex;
        align-items: center;
        flex-direction: column;
        padding: 40px 0 40px 0;
    }
    .k_gyik_elem{
        border-bottom: 1px solid #ddd;
        overflow: hidden;
    }
    .k_gyik_button{
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0.9), rgba(223, 223, 223, 0.8));
        width: 100%;
        font-family: "Crimson Pro", serif;
        font-weight: 500;
        padding: 20px;
        text-align: left;
        border: none;
        outline: none;
        cursor: pointer;
        position: relative;
        transition: background-color 0.3s ease;
        color: #000;
    }
    .k_gyik_elem:first-child{
        border-radius: 0.5rem 0.5rem 0 0;
    }
    .k_gyik_elem:last-child{
        border-radius: 0 0 0.5rem 0.5rem;
    }
    .k_gyik_button .arrow {
        position: absolute;
        right: 20px;
        transition: transform 0.3s ease; 
    }
    .k_gyik_button.active .arrow {
        transform: rotate(180deg);
    }
    .k_gyik_valasz{
        max-height: 0; /* itt igy van megoldva hogy ne latszoldjon alapbol*/
        overflow: hidden;
        transition: max-height 0.3s ease; 
        background: linear-gradient(to top, rgba(255, 255, 255, 0.9), rgba(223, 223, 223, 0.8));
    }
    .k_gyik_valasz p{
        padding: 20px;
        font-size: 16px;
        color: #555
    }

    .i_ertekelesek{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 50px;
}
.i_ertekelesek_holder{
    width: clamp(85% ,1600px, 95%);
    display: flex;
    align-items: center;
    flex-direction: column;
}

.i_ertekelesek_head{
    background: linear-gradient(to right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 0 20px 0;
    padding: 5px 15px 5px 15px;
    border-radius: 0.2rem;
    min-width: 15%;
}
.i_ertekelesek_head p{
    font-family: "Crimson Pro", serif;
    color: rgba(255, 255, 255, 0.99);
    text-shadow: 2px 2px 0.3px rgba(0, 0, 0, 0.7);
    font-size: clamp(1.4rem, 2.2vw, 1.8rem);
    font-weight: 700;
}

.i_ertekeles_body{
     box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
     background: radial-gradient(circle 30vw at top left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
     display: flex;
     align-items: center;
     flex-direction: column;
     padding: 40px 0 40px 0;
     width: 100%;
}
.i_ertekeles_cards_holder{  /* csak magukat az ertekeles kartyakat tartja*/  
    width: 96%;
    margin: 20px 0 20px 0;
    display: flex;
    justify-content:space-around;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 50px;
    transition: transform 0.8s ease-in-out;
}

.i_ertekeles{
    position: relative;
    height: 250px;
    background: linear-gradient(/*test*/ 135deg, rgba(255, 255, 255, 0.9), rgba(240, 240, 240, 0.8));
    text-shadow: 1px 1px 0.1px rgba(255, 255, 255, 0.7);
    color: rgba(0, 0, 0, 0.99);
    border-radius: 13px;
    border: 1px solid rgba(0, 0, 0, 0.569);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.4) inset, 0 1px 0 rgba(255, 255, 255, 0.6);
    padding: 12px;
}

.i_ertekeles_felsoresz{
    width: 100%;
    height: 20%;
    margin-top: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.i_ertekeles_rajzszog{
    background-image: url(assets/bemutatkozas/rajzszog1.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    top: -1px;
    left: 50%;
    translate: -20px;
    width: 35px;
    height: 35px;

}
.i_ertekeles_pfp{ /* img hodler div*/
    width: 10%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.i_ertekeles_pfp img{
    width: 100%;
    height: auto;
}

.i_ertekelo_neve{
    width: 40%;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
    translate: -5%;
    text-shadow: 1px 1px 2px rgba(152, 152, 152, 0.3);
}
.i_ertekeles_alsoresz{
    height: calc(80% - 10px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
.i_ertekeles_gomb{
    padding: 10px 30px 10px 30px;
    border-radius: 1rem;
    font-size: clamp(0.9rem, 1.18vw, 1.1rem);
    text-shadow: 1px 1px 0.3px rgba(0, 0, 0, 0.7);
    font-weight: 700;
    font-family: "Crimson Pro", serif;
    color: rgb(255, 255, 255);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    z-index: 1;
    border: 1px solid #000;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.4) outset, 0 1px 0 rgba(255, 255, 255, 0.6);
    background: linear-gradient(150deg, #d01c52, #a6357e);
    transition: color 0.35s ease;
    -webkit-transition: color 0.35s ease;
}
.i_ertekeles_gomb::before{
    content: "";
    background: linear-gradient(150deg, #e8406e, #c055a0);
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: 0;
    transition: opacity 0.35s ease;
    -webkit-transition: opacity 0.35s ease;
    pointer-events: none;
}
.i_ertekeles_gomb:hover::before{
        opacity: 1;
    }

.ertekeles-text-alap{
    width: 90%;
    height: 90%;
    text-shadow: 1px 1px 2px rgba(199, 199, 199, 0.3);
}

.i_ertekeles_bigscreen {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    height: clamp(300px, 40vh, 600px);
    z-index: 1200;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(240, 240, 240, 0.9));
    border: #000 1px solid;
    border-radius: 20px;
    flex-direction: column;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5),   /*index boxshadow 1*/
                0 8px 16px rgba(0, 0, 0, 0.4),
                0 12px 24px rgba(0, 0, 0, 0.5);
    opacity: 0;
    transform: translate(-50%, 100vh) scale(0.95);
    transition: transform 0.3s ease, opacity 0.3s ease;
    pointer-events: none;
}
.i_ertekeles_bigscreen.card-extend-open {
    display: flex;
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    pointer-events: auto;
}
.i_e_b_felso{
    width: 100%;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}
.i_e_b_pfp{
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.i_e_b_pfp img{
    width: 100%;
}
.i_e_b_nev{
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
}
.i_e_b_close{
    position: absolute;
    right: 5px;
    top: 5px;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.i_e_b_close button{
    width: 100%;
    height: 100%;
    background-color: transparent;
    border: none;
    background: rgb(128, 2, 2);
    background-size: 100% 100%;
    cursor: pointer;
    border: 1px solid black;
    border-radius: 1rem;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    transition: background-color 0.2s ease, color 0.2s ease;
}
.i_e_b_close button:hover{
    background: #b60000da;
}
.i_e_b_also{
    width: 100%; 
    height: calc(100% - 70px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 4% 5% 4% 5%;
    -webkit-overflow-scrolling: touch;
    
}
.i_e_1{                 /*kartyak forgatasa*/
    transform: rotate(2deg);
}
.i_e_2{
    transform: rotate(-2deg);
}
.i_e_3{
    transform: rotate(5deg);
}
.i_e_4{
    transform: rotate(-5deg);
}
.i_e_b_1{               
}
.i_e_b_2{
}
.i_e_b_3{
}
.i_e_b_4{
}


    /*tábor oldal*/
    .tabor_section {
        position: absolute;    
        right: 0;
        width: 100%;
        overflow-y: auto;
        z-index: 1;
        background: none;
    }
    .tabor_section::before{
        content: "";
        position: fixed;
        top:0;
        left: 0;
        width: 100vw;
        height: 100%;
        background-image: url(assets/feladatok/kitolto_feladatback_5.jpg);
        background-size: cover;
        filter: blur(4px);
        z-index: -2;
    }
    .tabor_test{
        margin-top: 200px;
    }
    .tabor_test p{
        color: rgb(255, 255, 255);
        text-shadow: 2px 2px 4px rgba(0, 0, 0, .5), 0 0 12px rgba(0, 0, 0, .3);
        border-radius: 0.2rem;
        padding: 5px 15px 5px 15px;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3);
        background: linear-gradient(to right, rgba(208, 208, 208, 0.4), rgba(202, 202, 202, 0.4));
        -webkit-backdrop-filter: blur(7px);
        backdrop-filter: blur(7px);
        border-radius: 2rem;
        font-size: 2rem;
        text-align: center;
        font-weight: 650;
    }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .m_navbar_SiteMenu{
        background: linear-gradient(to right, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.85));
    }
    .kurzusok_sidecontent::before{
        background: linear-gradient(360deg, rgba(46, 27, 42, 0.95), rgba(41, 27, 46, 0.95));
    }
    .i_tanuloknak_head, .i_kollegaknak_head, .i_szuloknek_head{
        background: linear-gradient(to right, rgba(20, 20, 20, 0.6), rgba(15, 15, 15, 0.55));
    }
    .d_k_nav_cim_fo, .d_k_nav_cim_al{
        background: linear-gradient(to right, rgba(20, 20, 20, 0.6), rgba(15, 15, 15, 0.55));
    }
    .k_m_fokategoria_cim{
        background: linear-gradient(to right, rgba(20, 20, 20, 0.6), rgba(15, 15, 15, 0.55));
    }
    .tabor_test p{
        background: linear-gradient(to right, rgba(60, 60, 60, 0.75), rgba(55, 55, 55, 0.75));
    }
}
@media (max-width: 767px) and (max-height: 700px) {
    .m_navbar_SiteMenu_lista{
        margin-top: clamp(60px, 14vh, 110px);
        gap: clamp(0.5rem, 1.6vh, 0.9rem);
    }
    .m_navbar_SiteMenu_lista img{
        width: clamp(85px, 17vh, 140px);
        height: auto;
        margin-bottom: clamp(12px, 3vh, 30px);
    }
    .m_navbar_SiteMenu_lista a{
        font-size: clamp(1.05rem, 2.8vh, 1.45rem);
        padding: clamp(6px, 1.2vh, 12px) clamp(14px, 3vh, 22px);
    }
}
.kotelezo_heading{
    display: none;
}