/*css-tricks.com/perfect-full-page-background-image/*/
/*www.w3schools.com/howto/howto_css_full_page.asp*/
html {
    /* The image used */
    background-image: var(--htmlBgImage);

    /* Full height */
    height: 100%;

    background-position: var(--htmlBgPosition);
    background-repeat: var(--htmlBgRepeat);
    background-attachment: var(--htmlBgAttachment);
    background-size: var(--htmlBgSize);
    background-color:var(--htmlBgColor);
} 
.edgeBGfix { background-image: var(--htmlBgImageEdge); } /*תיקון תמונת רקע עבור דפדפן אדג*/

/*stackoverflow.com/questions/6803016/css-100-font-size-100-of-what*/
body { 
    font-family : var(--font-family); 
    font-size: var(--font-size);
}

.stickyTop0 { position:sticky;top:0px;z-index:45; }

/*keep BG image to center and cover*/
.bgImgFixedCenter{
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

/*keep footer at the bottom of browser window*/
/*dev.to/niorad/keeping-the-footer-at-the-bottom-with-css-grid-15mf*/
/*css-tricks.com/couple-takes-sticky-footer/*/

.containerAll { 
    display:grid;
    grid-gap: 0;
    padding: 0px 0px; /*0px 10px - לעשות את זה דינאמי*/
    margin: 0;
    align-items: start;
    grid-template-columns: auto;
    grid-template-rows: auto 1fr auto;
    width: 100%; height: 100%;
}
.headerCont { 
    justify-self:var(--headerjustify_self);
    display:grid;
    grid-gap: 0;
    padding: 0px 0px; /*0px 10px - לעשות את זה דינאמי*/
    margin: 0;
    align-items: start;
    grid-template-columns: auto;
    /*grid-template-rows: auto auto auto 1fr auto; נמצא בקובץ של המאסטר ומשתנה בהתאם למבנה שלו*/
    max-width:var(--headerMaxWidth);
    max-height:var(--headerMaxHeight);
    width: 100%; height: 100%;
    background-color:var(--headerBgColor);
    background-image: var(--headerBgImage);
    background-position: var(--headerBgPosition);
    background-repeat: var(--headerBgRepeat);
    background-size: var(--headerBgSize);
}
.headerClass1 {
    align-self:start;
    justify-self:center;
    /*grid-row-start: 1;*/
    display: grid;
    grid-gap: 0px 20px;
    grid-template-columns: var(--header_grid_cols1); /*auto 130px 1fr; - משתנה לרוחב של השפה 0 אם אין שפות או 130*/
    /*grid-template-rows: auto auto auto; נמצא בקובץ של המאסטר ומשתנה בהתאם למבנה שלו*/
    align-items:center;
    justify-content: start;
    width: 99%;
    margin:0px; 
    padding:0px;
}
.pageMaxWidth1{
    max-width:var(--pageMaxWidth1);
    width: 100%;
}
.dynPageBorder{
    border:var(--dynPageBorder);
    border-radius:var(--dynPageBRadius);
}
.menuContDiv {
    align-self:start;
    justify-self: center;
    /*grid-row-start: 2;*/
    display: grid;
    width: 100%;
    grid-gap: var(--menuCont_GridGap);
    grid-template-columns: var(--menuCont_Columns);
    justify-content: center;
    align-items:center;
    margin:0px;padding:0px;
    background-color:var(--menuContBgColor);
}
/*צבעי הרקע והשקיפות של לינקים ניווט - כל המסכים*/
.navBarDiv {
    align-self:start;
    /*grid-row-start: 3;*/
    width:var(--navBarWidth);
    display:grid;
    grid-gap: 0px;
    align-items:center;
    justify-items: start;
    justify-content: start;
    margin:var(--navBarMargin); 
    padding:var(--navBarPadding);
    background-color:var(--navBarBgColor);
}

.contenerSide1{
    display:grid;
    justify-items:start;
    max-width:var(--contSide1MaxWidth);
    width:var(--contSide1Width);
    margin:var(--contSide1Margin);
    padding:var(--contSide1Padding);
}
.contenerCenter1{
    display:grid;
    justify-items:center;
    width:100%;
}
.contTextBG1{
    width:100%;
    border-radius: var(--generalContBradius);
    font-size:var(--generalContFsize);
    font-weight:var(--generalContFweight);
    line-height:var(--generalContLheight);
    color:var(--generalContColor);
    padding:var(--generalContPad);
    background-color:var(--generalContBG);
}

.mainClass {
    align-self:start;
    /*grid-row-start: 4;*/
    display:grid;
    grid-gap: 0;
    align-items: var(--main-align-items);
    justify-items: var(--main-just-items);
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    width: 100%; 
    height: 100%;
    margin:0px;
    padding:0px;
    background-color:var(--contentBGcolor);
}

.footerClass {
    align-self:start;
    /*grid-row-start: 5;*/
    width: 100%;
    display:grid;
    grid-gap: 0px;
    grid-template-columns: auto;
    align-items:center;
    align-content:center;
    margin:0px; padding:0px;
    background-color: var(--footerBGcolor);
}

.langDir { direction:rtl; }

.topTitleH1 { 
    color:var(--topTitleColor);
    font-family:var(--topTitleFontFamily);
    font-weight:var(--topTitleFontWeight);
    padding-bottom:5px;
    padding-top:0px;
    margin:0; 
}

.breakWord { word-wrap:break-word;word-break:break-word;overflow-wrap:break-word; }

/*----------------------Top Small Menu---------------------*/
#CBtoggleTopMenu { display: none; }
#CBtoggleTopMenu:checked ~ .topNavLinks {
  display: grid; 
}

.topNavCont
{
    width:100%;
    display:grid;
    grid-template-columns:auto;
    grid-template-rows:auto;
    justify-items: start;
}
.topNavLinks
{
    width:100%;
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(var(--topMenuItemWidth), var(--topMenuItemWidth)));
    grid-template-rows:auto;
    justify-content:start;
    justify-items: center;
    grid-gap:var(--topNavLinksGap)
}
.topNavLinks a
{
    display:block;
    min-width:var(--topMenuItemWidth);
    height:var(--topMenuItemHeight);
    line-height:var(--topMenuLineHeight);
    text-align:center;
    color:var(--topMenuColor);
    background-color:var(--topMenuCBg);
    border:var(--topMenuB);
    border-radius:var(--topMenuBRadius);
    transition: all .145s ease-in-out; /*none - for edge*/
}
.topNavLinks a:hover{ 
    color:var(--topMenuCoHover); 
    background-color:var(--topMenuCBgHover);
    border:var(--topMenuBHover);
}
.topMenuLabel
{
    display: none;
    width:50px;
    height:var(--topMenuItemHeight);
    grid-gap: 0px;
    grid-template-columns: 50px;
    align-items:center;
    justify-content:center;
    justify-items: center;
    margin:0px; padding:0px;
    color:var(--topTitleColor);
    background-color: var(--topMenuCBg);
    border: var(--topMenuB);
    border-radius:var(--topMenuBRadius);
    cursor:pointer; 
}
/*www.w3schools.com/howto/howto_css_menu_icon.asp*/
.bar1Top, .bar2Top, .bar3Top {
    width: 20px; height: 3px;
    background-color: var(--topTitleColor);
    transition: 0.4s;
}
.bar1Top, .bar3Top { margin: 0; }
.bar2Top { margin: 4px 0; }
.changeTop .bar1Top {
    transform: rotate(-45deg) translate(-3px, 6px);
}
.changeTop .bar2Top {opacity: 0;}
.changeTop .bar3Top {
    transform: rotate(45deg) translate(-4px, -7px);
}
.topLogoImg {  
    width:var(--topLogoImgWidth); 
    max-width:var(--topLogoImgMaxWidth); 
    margin:0; padding:0;
    float:var(--floatOpposite);
}
/*-------------------------langs select css start--------------------------*/
.topLangDiv {
    height:30px;
    color:var(--langTextColor);
    background-color:var(--langBGolor);
}
.openLangIcon 
{ 
    text-align:center;
    font-size:30px;
    display:none;
}
.langContDiv1 { position:relative;display:block;height:30px; }
.langContDiv2 {
    position:absolute;
    top:0;
    z-index:20;
    height:28px;
    width: 130px;
}
.langContDiv2:hover { height:100px; }
.langContDiv2:hover .selectLangsDiv { display:block; }
.selectLangsDiv {
    position:absolute;
    z-index:100;
    top:30px;
    width:130px;
    height:auto;
    padding:5px 0px;
    background-color:var(--colorBgLang1);
    display:none;
}
.langChooseDiv
{ 
    display:grid;
    width:130px;
    grid-template-columns: 28px auto;
    grid-template-rows:28px;
    justify-content:center;
    align-items:center;
    grid-gap:10px;
    cursor:pointer; 
    border: 1px solid rgba(0,0,0, 0); 
    background-color: var(--colorBgLang2);
}
.langOneDiv 
{ 
    display:grid;
    width:130px;
    grid-template-columns: 2px 28px 85px;
    grid-template-rows:30px;
    align-items:center;
    grid-gap:10px;
    cursor:pointer; 
    border: 1px solid rgba(0,0,0, 0); 
}
.langChooseDiv:hover, .langOneDiv:hover { background-color:var(--colorBgLang3); border: 1px solid var(--colorBorLang4); }
.oneLangSpan, .openLangSpan { 
    line-height:30px;
    color:var(--langTextColor);
}
.oneLangImg  { width:28px; height:19px; }
/*-------------------------langs select css end--------------------------*/

/*------------------------------------------css menu start-----------------------*/
/*w3bits.com/css-responsive-nav-menu/*/
/*w3bits.com/labs/css-responsive-nav/*/

/*------------כפתור פתיחת התפריט מסך צר-------------------*/
/*------------עבור תפריט עליון ראשי-------------------*/
.menuLabel
{
    display: grid;
    grid-gap: 0px;
    grid-template-columns: 50px auto 40px;
    align-items:center;
    width: 100%;
    margin:0px; padding:0px;
    color: var(--menuColorA);
    background-color: var(--menuLabelBgColor);
    cursor:pointer; 
    border: var(--menuOpenBorder);
    border-radius:var(--menuBGRadius);
}
.iconMenuDiv {
    justify-self: center;
    cursor: pointer;
    vertical-align:middle;
}
.openMenTextDiv 
{ 
    justify-self: start; 
    font-size:var(--menuFontSize);
    font-weight:var(--menuFontWeight);
    font-family:var(--menuFontFamily);
}
.openMenIconDiv 
{
    color: var(--menuColLabel);
    background-color: var(--menuOpenErrow);
    text-align:center;
    font-size:30px;
}
/*www.w3schools.com/howto/howto_css_menu_icon.asp*/
.bar1, .bar2, .bar3 {
    width: 35px; height: 5px;
    background-color: var(--menuOpenBar);
    transition: 0.4s;
}
.bar1, .bar3 { margin: 0; }
.bar2 { margin: 6px 0; }
.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-9px, 6px);
}
.change .bar2 {opacity: 0;}
.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px);
    transform: rotate(45deg) translate(-8px, -8px);
}

/*------------עבור תפריט מערכות-------------------*/
.sysMenuLabel
{
    display: grid;
    grid-gap: 0px;
    grid-template-columns: 50px auto 40px;
    align-items:center;
    max-width:250px;
    width: 100%;
    margin:0px; padding:0px;
    color: white;
    background-color: var(--sysMenuLabelBgColor);
    border: var(--sysMenuLabelBorder);
    border-radius:var(--sysMenuLBorderRadius);
    cursor:pointer; 
}
.iconMenuDivSys {
    justify-self: center;
    cursor: pointer;
    vertical-align:middle;
}
.openMenTextDivSys { justify-self: start; height:var(--menuSysTopHeight);line-height:var(--menuSysTopLineHeight); font-size:16px; }
.openMenIconDivSys 
{
    background-color: var(--sysMenuOpenErrow);
    text-align:center;
    font-size:18px;
    line-height:var(--menuSysTopLineHeight);
}
/*www.w3schools.com/howto/howto_css_menu_icon.asp*/
.bar1Sys, .bar2Sys, .bar3Sys {
    width: 22px; height: 4px;
    background-color: var(--sysMenuOpenBar);
    transition: 0.4s;
}
.bar1Sys, .bar3Sys { margin: 0; }
.bar2Sys { margin: 4px 0; }
.changeSys .bar1Sys {
    transform: rotate(-45deg) translate(-4px, 6px);
}
.changeSys .bar2Sys {opacity: 0;}
.changeSys .bar3Sys {
    transform: rotate(45deg) translate(-5px, -7px);
}
/*------------סוף כפתור פתיחת התפריט מסך צר----------------*/
/*-----------------איזור התפריט במסך צר-------------------------------*/
.menu { display:grid; margin:var(--menuMargin); }
.menuLabel { margin:var(--menuLabelMargin); }

.menu input[type="checkbox"], .navTopUL ul { display: none; }
.navTopUL, #menuCB:checked + .navTopUL, input[type="checkbox"]:checked + ul { display: grid; }

.navTopUL, .navTopUL ul  
{ 
    list-style-type: none;
    grid-template-columns: auto;
    grid-gap:1px;
    padding: 0px; margin:0px;
}
.navTopUL 
{ 
    border: 1px solid var(--menuBorderColor);
    background-color: var(--menuBorderColor);
}
.navTopUL li a { background-color: var(--menuBgColorA1); }
.navTopUL li ul li a { background-color: var(--menuBgColorA2); }
.navTopUL li ul li ul li a { background-color: var(--menuBgColorA3); }    
.navTopUL a {
    display: block;
    width:100%;height:var(--menuHeightSscreen);line-height:var(--menuHeightSscreen); /*באג של בינג לא עובד טוב במספרים זוגיים*/
    font-size:var(--menuFontSize);
    font-weight:var(--menuFontWeight);
    font-family:var(--menuFontFamily);
    text-decoration: none;
    text-align:start;
    text-indent: 8px;
    white-space: nowrap;
    color: var(--menuColorA); 
    transition: all .145s ease-in-out; /*none - for edge*/
}
.navTopUL a:hover { background-color: var(--menuBgColAhover); }
.navTopUL label{
    display: inline-block;
    width: 20%;
    height:var(--menuHeightSscreen);
    float:var(--floatOpposite);
    font-size: 26px;
    text-align: center;
    text-indent: 0px;
    background-color: var(--menuBgColLabel);
    text-shadow: 0 0 0 transparent;
    color: var(--menuColLabel);
}

/*-------איזור התפריט במסך רחב------*/
@media only screen and (min-width: 1570px) 
{
    .menuLabel, input[type="checkbox"]:checked + ul, .navTopUL ul, .navTopUL li:hover ul li ul { display: none; }

    .navTopUL { display:grid;grid-auto-flow: column; }
    .navTopUL, #menuCB:checked + .navTopUL
    {
        border: 1px;
        grid-template-columns: repeat(auto-fit, var(--menuSubWidth));
        grid-gap:var(--menuGridGap);
        justify-items: start;
        background-color:unset;
    }            
    .navTopUL ul  
    { 
        grid-gap:var(--menuBorderWidth);/* הגבול של התת תפריטים  border: 0px -> grid-gap:0px;     border: 1px -> grid-gap:1px; */
        border: var(--menuBorderWidth) solid var(--menuBorderColor); /* הגבול של התת תפריטים  border: 0px -> grid-gap:0px;    border: 1px -> grid-gap:1px;*/
        background-color:var(--menuBorderColor);
        position: absolute;
        z-index:500; /*50*/
    }

    .navTopUL a, .navTopUL label { height:var(--menuHeightWscreen);line-height:var(--menuHeightWscreen); }
    .navTopUL li { display: block; position: relative; width:var(--menuTopWidth); padding:0px; margin:0px; border: var(--menuBorderWidth) solid var(--menuBorderColor); border-radius:var(--menuBorderRadius); } /*הגבול של התפריטים הראשיים  border: 0px -> width:170px;    border: 1px -> width:172px;   */
    .navTopUL ul li, .navTopUL ul li ul li { width:var(--menuSubWidth); border: 0px }
    .navTopUL li a { text-align:center; text-indent: 0px; }
    .navTopUL ul li a { text-align:start; text-indent: 8px; }
    .topMItem, .topMlinkSub { border-radius:var(--menuBGRadius); }
    .topMliSub:hover, .navTopUL li:hover .topMlinkSub
    { 
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }
    .navTopUL label { width: 18px; font-size: 16px; }
}

/*toggleMenuDiv { border-style: solid;  border-color: rgba(0, 0, 0, .05); }
toggleMenuDiv { border-width: 0 0 1px; }*/
.menuLabel,  .openMenIconDiv { height:57px; line-height:57px; } /*גובה לינק לפתיחת וסגירת תפריט - מסך צר*/

/*-------איזור התפריט במסך צר------*/
@media only screen and (max-width: 1569px) {
    .menu .navTopUL, .sysMenu .navSysUL  { display: none; }
    .menu { grid-column-start: 1; grid-column-end: span 2; width:100%; } /*Make "menu" span 2 columns:*/
    .menuContDiv {
        grid-gap: 0px 10px;
        grid-template-columns: var(--menuCont_Columns2);
        grid-template-rows: auto auto;
        justify-content: center;
        justify-items: center;
    }
}
@media only screen and (max-width: 1000px) {
    .menuContDiv { grid-template-columns: var(--menuCont_Columns3); }
}
@media only screen and (max-width: 630px) {
    .menuContDiv { grid-template-columns: var(--menuCont_Columns4); }
    .menuLabel{ grid-template-columns: 50px auto 0px; }
    .openMenIconDiv { display:none; }
}
@media only screen and (max-width: 460px) {
    .menuContDiv { grid-template-columns: var(--menuCont_Columns5); }
    .menuLabel{ grid-template-columns: 50px 0px 0px; }
    .openMenTextDiv { display:none; }
}
/*------------------------------------------css menu end-----------------------*/

/*--------------------------------categorys system menu start--------------------------*/

/*the system category menu container in small lists dynamic page*/
.catsMenuContLS{ 
    width:100%;
    padding:5px 10px 10px 10px;
    display:grid;
    justify-items:center; 
}
/*-----------------איזור התפריט במסך צר-------------------------------*/
.catsMenuDiv
{
    max-width:250px;
    width:100%;
    display:grid;
    position:relative;
    justify-content:start;
    grid-gap: 12px;
    grid-template-columns: 1fr;
}
.sysMenu { display:grid; width:100%; position:absolute; top:var(--sysMenuTopPosition); z-index:1000; } /*100*/
.sysMenu input[type="checkbox"], .navSysUL ul { display: none; }
.navSysUL, #sysMenuCB:checked + .navSysUL, input[type="checkbox"]:checked + ul { display: grid; }

.navSysUL, .navSysUL ul  
{ 
    width:100%;
    list-style-type: none;
    grid-template-columns: auto;
    grid-gap:1px;
    padding: 0px; margin:0px;
}
.navSysUL 
{ 
    border: 1px solid var(--sysMenuBorderColor);
    background-color: var(--sysMenuBorderColor);
}
.navSysUL li a { background-color: var(--sysMenuBgColorA1); }
.navSysUL li ul li a { background-color: var(--sysMenuBgColorA2); }
.navSysUL li ul li ul li a { background-color: var(--sysMenuBgColorA3); }      
.navSysUL a {
    display: block;
    width:100%;height:40px;line-height:40px; /*באג של בינג לא עובד טוב במספרים זוגיים*/
    text-decoration: none;
    text-align:start;
    text-indent: 8px;
    white-space: nowrap;
    color: var(--sysMenuColorA); 
    transition: all .145s ease-in-out; /*none - for edge*/
}
.navSysUL a:hover { background-color: var(--sysMenuBgColAhover); }
.navSysUL label{
    display: inline-block;
    width: 20%;
    height:40px;
    float:var(--floatOpposite);
    font-size: 26px;
    text-align: center;
    text-indent: 0px;
    background-color: var(--sysMenuBgColLabel);
    text-shadow: 0 0 0 transparent;
    color: var(--sysMenuColLabel);
}

/*-------איזור התפריט במסך רחב------*/
@media only screen and (min-width: 1570px) 
{
    .catsMenuDiv {
        max-width:unset;
        position:unset;
    }
    .sysMenu { display:grid; width:unset; position:unset; top:unset; z-index:unset; }
    .sysMenuLabel, input[type="checkbox"]:checked + ul, .navSysUL ul, .navSysUL li:hover ul li ul { display: none; }

    .navSysUL, #sysMenuCB:checked + .navSysUL
    {
        border: 0px;
        grid-template-columns: repeat(auto-fit, var(--menuSysSubWidth));
        grid-gap:10px;
        justify-items: start;
        background-color:unset;
    }            
    .navSysUL ul  
    { 
        width:var(--menuSysSubWidth_ul);
        grid-gap:1px;
        border: 1px solid var(--sysMenuBorderColor);
        background-color:var(--sysMenuBorderColor);
        position: absolute;
        z-index:500; /*50*/
    }

    .navSysUL a, .navSysUL label { height:var(--menuSysTopHeight);line-height:var(--menuSysTopLineHeight); }
    .navSysUL li { display: block; position: relative; width:var(--menuSysTopWidth); padding:0px; margin:0px; border: var(--sysMenuBorderWidth) solid var(--sysMenuBorderColor);border-radius: var(--menuSysBorRadius) }
    .navSysUL ul li, .navSysUL ul li ul li { width:var(--menuSysSubWidth_li); border: 0px }
    .navSysUL ul li a { height:var(--menuSysSubHeight); line-height:var(--menuSysSubLineHeight); text-align:start; text-indent: 8px; }
    
    .navSysUL li a { text-align:center; text-indent: 0px; }
    .sysMItem, .sysMlinkSub { border-radius:var(--menuSysBGRadius); }
    .sysMliSub:hover, .navSysUL li:hover .sysMlinkSub
    { 
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }
    .navSysUL label{ width: 18px; font-size: 16px; }
}
/*------------------------------------categorys system menu end----------------------------*/

/*---------------top navagation start--------------------------------------*/
.errowNav1
{
    color: var(--errowNavColor);
    font-size: 33px;
    font-weight: bold;
    line-height: 1;
}

.navTopText{color : var(--navTopTextCol);font-size : 18px; font-weight : 400;}
a.navTopText{color : var(--navTopTextCol);text-decoration : none;}
a.navTopText:hover{color : var(--navTopTextCol); text-decoration : underline;}

/*---------------top navagation end-----------------------------------------*/

/*-----------list pages navagation start------------*/
.navLinksCont, .navLinksCont_big_bottom , .navLinksCont_big_top 
{
    display: grid;
    width:100%;
    grid-auto-flow: column;
    justify-content:center;
}
.navLinksCont
{
    grid-gap: 8px;
    margin-top:15px;
    margin-bottom:15px;
}
.navLinksCont_big_top
{
    grid-gap: 12px;
    margin-top:15px;
    margin-bottom:15px;
}
.navLinksCont_big_bottom
{
    grid-gap: 12px;
    margin-top:35px;
    margin-bottom:35px;
}
.navLinkNP, .navLinkSpace, .navLinkText, .navLink, .navLinkNP_big, .navLinkSpace_big, .navLinkText_big, .navLink_big
{
    display: grid;    
    justify-content:center;
    justify-items:center;
    align-content:center;
    align-items:center;
    color:rgb(255, 255, 255);
}
.navLinkNP, .navLinkSpace, .navLinkText, .navLink { height:50px; }
.navLinkNP_big, .navLinkSpace_big, .navLinkText_big, .navLink_big { height:70px; }

.navLink { width:50px; font-size:20px; }
.navLink_big { width:70px; font-size:27px; }

.navLinkText { width:40px; font-size:20px; }
.navLinkText_big { width:60px; font-size:27px; }

.navLinkNP, .navLinkSpace { width:60px; font-size:30px; }
.navLinkNP_big, .navLinkSpace_big { width:80px; font-size:40px; }

.navLinkNP, .navLink { background-color:var(--navPageBgColor); border-radius:5px; }
.navLinkNP_big, .navLink_big { background-color:var(--navPageBgColor); border-radius:10px; }

.navLinkNP:hover, .navLink:hover, .navLinkNP_big:hover, .navLink_big:hover { background-color:var(--navPageBgChover); }
/*-----------list pages navagation end------------*/

.botSmallLinks{
    display:grid;
    grid-auto-flow: column;
    grid-gap: 20px;
    justify-content:center;
    justify-items:center;
    font-size:15px;
}
.botSmallLinks a{ color:var(--botSmallLinkColor); }
.botSmallLinks a:hover{ color:var(--botSmallLinkColorH); }

/*--------------dynamic sys list start-----------*/
.topListHtml
{
    justify-self:center;
    width:99%;
    margin:var(--topListMargin);
}
.sysListCont
{
    width:100%;
    display: grid;
    grid-gap: 40px;
    grid-template-columns: auto; 
    grid-template-rows: auto; 
}
.sysMenuListCont
{
    width:100%;
    display: grid;
    grid-gap: 20px;
    grid-template-columns: auto auto auto; 
    grid-template-rows: auto; 
}
.oneListSec
{
    width:100%;
    background-color:var(--sysListBgColor);
    padding:var(--sysListPadding);
    border-radius: var(--sysListBradius);
    border:var(--sysListBorder);
}
.dynListInfoCont, .dynListInfoContSys, .dynMenuListSys
{
    width:100%;
    display: grid;
    grid-gap: 20px;
    justify-items:start;
    justify-content:start;
    align-items: center;
    padding: 10px;
    grid-template-rows: auto; 
}
.dynListInfoCont {
    grid-template-columns: auto auto auto auto; 
}
.dynListInfoContSys {
    grid-template-columns: auto auto auto; 
}
.dynMenuListSys {
    grid-template-columns: auto auto; 
}
.dynMenuListSysBut{ 
    grid-column: 1 / span 2;
    width:100%;
    padding:5px 10px 10px 10px;
    display:grid;
    justify-items:center; 
}
.sysTextCont { width:350px; color: var(--textColor1); }
.sysTextCont240 { width:240px; color: var(--textColor1); }
.sysTitle
{
    font-size:18px;
    color:var(--sysTitleColor);
    padding:4px 0px;
}
.sysTitle:hover { text-decoration:underline; }
.sysListText { color:var(--sysTextColor); }
.sysEnterLink
{
    width:250px;
    height:74px;
    display: grid;
    grid-gap: 10px;
    align-items: center;
    grid-template-columns: auto auto;
    border-radius: 10px;
    background-color: var(--iconsColorBg); 
    border: var(--iconsWidthBor) solid var(--iconsColorBor);
    color:var(--iconsColor4);
}
.sysEnterText
{
    justify-self:end;
    font-size:20px;
    color:var(--textColor2);
}
.imgSys { max-width:250px; }
.imgSys320 { max-width:320px; }
/*stackoverflow.com/questions/26421274/css-circular-cropping-of-rectangle-image*/
.imgSys-cropper, .imgSys-cropper320 {
    display:block;
    text-decoration:none;
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    border: 3px solid var(--borderColor1);
}
.imgSys-cropper { width: 250px; height: 141px; }
.imgSys-cropper320 { width: 320px; height: 180px; } 
.imgSys-cropper:hover, .imgSys-cropper320:hover { border-color:var(--bColor1hover); }
.imgSys-cropper img, .imgSys-cropper320 img {
    position: absolute;
    display: inline;
    margin: 0 0;
    width: 100%;
    height: 100%;
}
/*--------------dynamic sys list end-----------*/

/*---------------Aspect Ratio Start--------------*/
/*stackoverflow.com/questions/1495407/maintain-the-aspect-ratio-of-a-div-with-css?page=1&tab=votes#tab-top*/
.aspectRatio-container {
  position: relative;
  width: 100%;
}
.aspectRatio-container::before {
  content: "";
  display: block;
}
.aspectRatio-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*0.6816546762589928*/
/* (100/379) * 556 = 147% */
.ratio-379-556::before {
  padding-top: 147%; /*146.7*/
}

/*0.6666666666666667*/
/* (100/2) * 3 = 133% */
.ratio-2-3::before {
  padding-top: 150%;
}

/*0.75*/
/* (100/9) * 12 = 133% */
.ratio-9-12::before {
  padding-top: 133%;
}
/*0.75*/
/* (100/3) * 4 = 133% */
.ratio-3-4::before {
  padding-top: 133%;
}

/*0.777777777777778*/
/* (100/7) * 9 = 128% */
.ratio-7-9::before {
  padding-top: 128%;
}

/*1.333333333333333; 320 x 240*/
/* (100/4) * 3 = 75% */
.ratio-4-3::before {
  padding-top: 75%;
}

/*1.5*/
/* (100/3) * 2 = 66.66% */
.ratio-3-2::before {
  padding-top: 66.66%;
}

/*1.777777777777778 1920 x 1080, 1280 x 720*/
/* (100/16) * 9 = 56.25% */
.ratio-16-9::before {
  padding-top: 56.25%;
}

/*1*/
.ratio-1-1::before {
  padding-top: 100%;
}

/*3*/
/* (100/3) * 1 = 56.25% */
.ratio-3-1::before {
  padding-top: 33.33%;
}
/*---------------Aspect Ratio End--------------*/

/*---------star-ratings-------https://www.cssportal.com/css-clip-path-generator/-----https://codepen.io/geoffgraham/pen/MMOGjm------*/
/* in css */
.clip-star {
  background: var(--starRatingsColor);
  clip-path: polygon(50% 0%, 63% 32%, 98% 35%, 74% 59%, 79% 91%, 50% 73%, 21% 91%, 28% 58%, 2% 35%, 37% 32%);
  display: inline-block;
  height: 17px;
  width: 17px;
}

/*--------------https://codepen.io/Bluetidepro/pen/GkpEa ----------*/
/* in image */
.star-ratings {
    background: url("../images/star-rating-sprite.png") repeat-x;
    font-size: 0;
    height: 17px;
    line-height: 0;
    overflow: hidden;
    text-indent: -999em;
    width: 100px;
    margin: 0px 0px 4px 0px;
}
.star-ratings-rating {
    background: url("../images/star-rating-sprite.png") repeat-x;
    background-position: 0 100%;
    float: left;
    height: 17px;
    display: block;
}

/*תצוגת הוידאו בפריים*/
.vidIFrame {
    width:100%;height:100%;margin:0px;padding:0px;border:none;overflow:hidden;
}

/*---------------כפתורים לשינוי גדלי הפריטים ברשימה התחלה---------------------------------*/
/*https://medium.com/@fionnachan/dynamic-number-of-rows-and-columns-with-css-grid-layout-and-css-variables-cb8e8381b6f2*/
/*https://css-tricks.com/auto-sizing-columns-css-grid-auto-fill-vs-auto-fit/*/

.listSize1, .listSize2, .listSize3
{
    display: grid;
    padding: 0;
    cursor:pointer;
    grid-gap: 2px;
}
.listSize1
{
    grid-template-columns: 10px 10px;
    grid-template-rows: 10px 10px;
}
.listSize1 div { width:10px;height:10px; }
.listSize2
{
    grid-template-columns: 6px 6px 6px;
    grid-template-rows: 6px 6px 6px;
}
.listSize2 div { width:6px;height:6px; }
.listSize3
{
    grid-template-columns: 4px 4px 4px 4px;
    grid-template-rows: 4px 4px 4px 4px;
}
.listSize3 div { width:4px;height:4px; }

.listOnBG div { background-color:var(--listSizeBgOn); }
.listOffBG div { background-color:var(--listSizeBgOff); }
/*---------------כפתורים לשינוי גדלי הפריטים ברשימה סוף---------------------------------*/

/*--------תחילת האיקונים של הכפתורים לאתר הבית של המערכת-------*/
.sysSiteLinks
{
    justify-self:end;
    max-width: 800px;
    display:grid;
    grid-template-columns:auto auto auto;
    grid-template-rows:auto;
    justify-items:center;
    align-items:center; 
    align-content:center;
    grid-gap: 30px;
    margin:0px 20px;
}
.sysSiteLinks2
{
    justify-self:end;
    max-width: 800px;
    display:grid;
    grid-template-columns:auto auto;
    grid-template-rows:auto;
    justify-items:center;
    align-items:center; 
    align-content:center;
    grid-gap: 30px;
    margin:0px 20px;
}
.contSiteLinksL1, .contSiteLinksL2, .contSiteLinks, .contSiteLinks2
{
    display:grid;
    grid-template-columns:auto auto auto;
}
.contSiteLinksL1b, .contSiteLinksL2b, .contSiteLinksb, .contSiteLinks2b
{
    display:grid;
    grid-template-columns:auto;
}
.contSiteLinksL1, .contSiteLinksL2, .contSiteLinks, .contSiteLinks2, .contSiteLinksL1b, .contSiteLinksL2b, .contSiteLinksb, .contSiteLinks2b
{
    width:100%;
    height:auto;
    grid-template-rows:auto;
    justify-items:center;
    align-items:center; 
    align-content:center;
    background-color:var(--affBottonLinksBG); 
}
.contSiteLinksL1, .contSiteLinksL2 { justify-content:start; }
.contSiteLinksL1, .contSiteLinksL1b { padding: var(--siteLinksL1pad); margin: var(--siteLinksL1mar); }
.contSiteLinks, .contSiteLinksb { padding: 10px 10px 10px 10px; }
.contSiteLinksL2, .contSiteLinks2, .contSiteLinksL2b, .contSiteLinks2b { padding: 40px 10px 40px 10px; }

.linkBut
{
    width:100%;
    display:grid;
    grid-template-columns:auto auto;
    grid-template-rows:auto;
    justify-items:center;
    justify-content:center;
    align-items:center; 
    border-radius: 10px;
    background-color: var(--iconsColorBg); 
    border: var(--iconsWidthBor) solid var(--linkButColorBor);
    text-decoration:none;
    text-decoration-color:var(--iconsColor);
    cursor:pointer;
}
.linkBut div { font-size:24px;color:var(--iconsColorText); }
.linkBut:hover{ background-color:var(--iconsColorBgHo); border-color:var(--linkButColorBorHo); }

.linkBut_sysSite { grid-gap: 16px;width:320px;padding:16px 40px; }
.linkBut_sysList { grid-gap: 10px;width:300px;padding:16px 20px; }
.linkBut_sysSite i { font-size:40px;line-height:44px;color:var(--iconsColor);text-decoration:none; }
.linkBut_sysList i { font-size:50px;line-height:44px;color:var(--iconsColor4);text-decoration:none; }


.siteLinkL, .siteLink, .topLinkChat 
{
    display:grid;
    grid-template-columns:auto auto;
    grid-template-rows:auto;
    justify-items:center;
    align-items:center; 
    grid-gap: 15px;
    border-radius: 10px;
    background-color: var(--iconsColorBg); 
    border: var(--iconsWidthBor) solid var(--iconsColorBor);
    text-decoration:none;
    text-decoration-color:var(--iconsColor);
    padding:6px 12px;
    cursor:pointer;
}

.topLinkVideo
{
    width:100%;
    display:grid;
    grid-template-columns:auto auto;
    grid-template-rows:auto;
    grid-gap: 20px;
    justify-content:center;
    justify-items:center;
    align-items:center;
    border-radius: 15px;
    background-color: var(--iconsColorBg); 
    border: var(--iconsWidthBor) solid var(--linkButColorBor);
    text-decoration:none;
    text-decoration-color:var(--iconsColor);
    padding:10px 20px;
    cursor:pointer;
}
.topLinkVideo div { font-size:var(--iconLinkTextSize);color:var(--iconsColorText);padding-bottom:2px; }
.topLinkVideo i { font-size: var(--iconLinkFontSize); }

.siteLinkL div, .sysWebLink div { font-size:24px;color:var(--iconsColorText); }
.siteLinkL i, .sysWebLink i { font-size:40px;color:var(--iconsColor); text-decoration:none; }
.siteLink i { font-size:40px;color:var(--iconsColor); text-decoration:none; }
.siteLink div, .topLinkChat div { font-size:24px;color:var(--iconsColorText);padding-top:2px; }
.siteLinkL:hover, .sysWebLink:hover, .siteLink:hover, .topLinkChat:hover, .topLinkVideo:hover, .sysEnterLink:hover{ background-color:var(--iconsColorBgHo); border-color:var(--linkButColorBorHo); }

.noLive { color:var(--iconsColor); }
.yesLive { color:var(--iconsColor2); }
.topLinkChat i { font-size: 30px; }

/*--------סוף האיקונים של הכפתורים לאתר הבית של המערכת-------*/

/*------תחילת נתונים עבור פרטים ברשימה-----*/
.active {}
.oneItem, .oneItemNoAuto { }
.oneItem:hover, .oneItemNoAuto:hover {
    border-top-style: hidden;
}

/*.inItem {
    width: 100%;
	display: block;
    margin:0;
    padding:0;
    text-align:center;
}
.contPerVideo
{
    display:block;width:100%;height:100%;position:relative;border:0px;
}*/
/*עבור תמונות מתחלפות*/
.imgSlide, .imgTopSlide
{
    display: block;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    border:none;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
/*-------------------------------------התחלה מיון מתקדם של רשימה----------------------------------*/
.listType
{
    display: grid;
    grid-gap: 10px;
    align-items: center;
    grid-template-columns: auto auto;
    color:var(--sysMenuColText);
    cursor:pointer;
    height:29px;
}
.listTypeText {font-size: 18px; padding-bottom: 2px; }
.contTypeItems { position:relative;width:100%; }

.typeItem { font-size:17px; }
.typeItem a { display:block; padding:3px 0px; color:var(--sysMenuColTextSort);}
.typeItem a:hover { text-decoration:underline; }
.typeItem .typeLinkAfter{ color:var(--sysMenuColTextAfter); }
/*-------------------------------------סוף מיון מתקדם של רשימה----------------------------------*/
/*------סוף נתונים עבור פרטים ברשימה-----*/

/*---------------footer css start-----------------------------------------------*/
/*codemyui.com/pure-css-responsive-footer-design/*/
/*gist.github.com/CodeMyUI/f679620714190d0f9c6e*/

.footer-nav-sitemap {
    width:100%;
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    justify-content:center;
    justify-items:center;
    padding:20px 0px 17px 0px; /*המרווחים של הקישורים במפת אתר בתחתית - מסך רחב*/
}

/*-------איזור התפריט התחתון במסך רחב------*/
.navBotUL input[type="checkbox"], .navBotUL input[type="checkbox"]:checked + ul { display: none; }
.navBotUL
{
    list-style-type: none;
    width:100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, max-content));
    justify-content: center;
    justify-items: center;
    grid-gap: 15px;
    padding: 0px; margin:0px;
}
.navBotUL ul  
{ 
    width:100%;
    display: grid;
    list-style-type: none;
    grid-template-columns: 100%;
    grid-gap:7px;
    padding: 0px; margin:0px;
}
.navBotUL li { width:100%;}
.navBotUL label { display: none; }    
.navBotUL li ul { display: grid; }

.navBotUL li a 
{ 
    display:block;
    width:100%;
    color: var(--footerLinkColH3); 
    font-size: 16px;
}
.navBotUL li a:hover { color: var(--footerLinkHover); }

.navBotUL li ul li a 
{ 
    color: var(--footerLink); 
    font-size: 15px;
}
.navBotUL a {
    display: block;
    width:100%;height:30px;line-height:30px; /*באג של בינג לא עובד טוב במספרים זוגיים*/
    text-decoration: none;
    text-align:start;
    text-indent: 8px;
    white-space: nowrap;
}

/*.navBotUL ul li a:hover, .navBotUL li ul li a:hover { color: var(--footerLinkHover); } */
.navBotUL ul li a:visited, .navBotUL li ul li a:visited { color: var(--footerLinkVisited); }

/*-------איזור התפריט התחתון במסך צר------*/
@media only screen and (max-width: 1569px) {
    .navBotUL input[type="checkbox"]:checked + ul { display: grid; }
    .navBotUL
    {
        max-width:600px;
        width:98%;
        grid-template-columns: 100%;
        grid-gap: 7px;
    }
    .navBotUL a 
    { 
        height:47px;line-height:47px; /*באג של בינג לא עובד טוב במספרים זוגיים*/ 
        transition: all .145s ease-in-out;
    }
    .navBotUL a:hover { background-color: var(--footerNavBgHover); } 
    .navBotUL li { background-color:var(--footerNavLiBgCol); }
    .navBotUL li a  { background-color:var(--footerLiHeadABgCol); /*none - for edge*/ }
    .navBotUL li ul { display: none; }
    .navBotUL label
    {
        display: inline-block;
        width: 20%;
        height:47px;
        float:var(--floatOpposite);
        font-size: 26px;
        text-align: center;
        text-indent: 0px;
        background-color: var(--footerOpenErrow);
        text-shadow: 0 0 0 transparent;
        color: var(--menuColLabel);
    }
}
.footer-logo
{
    width: 100%;
    height: 36px;
    position:relative;
    display:grid;
    grid-template-columns:auto;
    justify-items:center;
}
.fLogoImg
{
    width: 87px;
    height: 36px;
}
.gradient_line {
    position:absolute;
    top:13px;
    width: 80%;
    height: 1px;
    clear: both;
    background: #999;
    background: -moz-linear-gradient(left, rgba(153,153,153,0), #999, rgba(153,153,153,0));
    background: -webkit-linear-gradient(left, rgba(153,153,153,0), #999, rgba(153,153,153,0));
    background: linear-gradient(left, rgba(153,153,153,0), #999, rgba(153,153,153,0));
}

.footer-ul-Links { 
    padding:0; margin:0;
    list-style: none; 
}
.footer-ul-Links > li {  text-align: center;}

.linkscont {
    margin-top: auto;
    width: 100%;
}

/*צבע ופונט בקישורים בתחתית*/
/*והמרווחים של הקישורים בתחתית - מסך רחב*/
.footer-nav-Links {
    font-size: 16px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding:20px 0px 30px 0px;
    color: var(--bottomLinkColor);
}

.footer-nav-Links a {
    color: var(--bottomLinkColA);
    font-size: 16px;
    text-decoration: none;
    line-height: 26px;
}
.footer-nav-Links li { display: inline; }

.icon-rta-logo
{
    height: 25px; width: 50px;
    color: #b0b0b0; fill: #b0b0b0;
}
/*---------------footer css end-----------------------------------------------*/

/*----------------------------buts and loaders-------------------------------------*/
.but1{
    text-decoration: none;
    text-align:center;
    background-color: var(--but1BgColor);
    border: 0;
    border-radius: 5px;
    cursor: pointer;
    color: var(--but1Color);
    font-size:18px;
    font-weight: 700;
    line-height: 24px;
    padding: 8px 25px;
}

.loader1 {
  border: 7px solid rgba(194, 195, 201, 0.3);
  border-radius: 50%;
  border-top: 7px solid rgb(255, 255, 255);
  -webkit-animation: spin 1s linear infinite; /* Safari */
  animation: spin 1s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.lds-Grid
{
    width:100%;height:100%;
    display:grid;
    grid-template-columns: 160px;
    grid-template-rows: auto;
    justify-items:center;
    justify-content: center;
    align-items:center;
    align-content:center;
}
/*lodaer ripple----------<div class="lds-ripple"><div></div><div></div></div>-----------*/
.lds-ripple {
  position: relative;
  width: 160px;
  height: 160px;
}
.lds-ripple div {
  position: absolute;
  border: 5px solid #fff;
  opacity: 1;
  border-radius: 50%;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) { animation-delay: -0.5s; }
@keyframes lds-ripple {
  0% {
    top: 75px;
    left: 75px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 150px;
    height: 150px;
    opacity: 0;
  }
}

/*loader dual-ring----------<div class="lds-dual-ring"></div>-------*/
.lds-dual-ring {
  width: 160px;
  height: 160px;
}
.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 144px;
  height: 144px;
  margin: 8px;
  border-radius: 50%;
  border: 10px solid #fff;
  border-color: #fff transparent #fff transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*------------------------end-buts and loaders-------------------------------------*/
/*-------------------------start shapes -------------------------------------------*/
 .circle1 { background:#A2DB00; border-radius:50%; }
/*-------------------------end shapes -------------------------------------------*/

/*-------------------------START TOOLS-------------------------------------------*/
/*www.w3docs.com/learn-html/html-blink-tag.html*/
.blink { animation: blinker 1.5s linear infinite; }
@keyframes blinker { 50% { opacity: 0; } }
/*-------------------------END TOOLS---------------------------------------------*/

@media only screen and (max-width: 1860px) {
    .sysMenuListCont { grid-template-columns: auto auto; }
    .sysMenuListCont .sysTextCont240 { width:340px; }
}
@media only screen and (max-width: 1680px) {
    /*המרווחים של הקישורים בתחתית - מסך צר*/
    .footer-nav-Links { padding:10px 10px 10px 10px; }

    /*כפתורי דיפדוף בין דפים ברשימה*/
    .navLinksCont { grid-gap: 6px; }
    .navLinkNP, .navLinkSpace, .navLinkText, .navLink { height:40px; }
    .navLink { width:40px; }
    .navLinkText { width:30px; }
    .navLinkNP, .navLinkSpace { width:50px; }
}
@media only screen and (max-width: 1650px) {
    .sysLingReg { display:none; }
    .sysSiteLinks { grid-template-columns:auto auto; }
}
@media only screen and (max-width: 1450px) {
    .sysMenuListCont { grid-template-columns: auto; }
    .dynMenuListSys { justify-items:center; justify-content:center; }
}
@media only screen and (max-width: 1400px) {
    .sysLingLog { display:none; }
    .sysSiteLinks { grid-template-columns:auto; }

    .navLinksCont_big_top, .navLinksCont_big_bottom
    {
        grid-gap: 8px;
        margin-top:15px;
        margin-bottom:15px;
    }
    .navLinkNP_big, .navLinkSpace_big, .navLinkText_big, .navLink_big { height:50px; }
    .navLink_big { width:50px; font-size:20px; }
    .navLinkText_big { width:40px; font-size:20px; }
    .navLinkNP_big, .navLinkSpace_big { width:60px; font-size:30px; }
    .navLinkNP_big, .navLink_big { border-radius:5px; }
}    
@media only screen and (max-width: 1200px) {
    .topNavCont
    {
        grid-template-rows:auto auto;
        position:relative;
    }
    .topNavLinks
    {
        display:none;
        width:var(--topMenuItemWidth);
        grid-template-columns:var(--topMenuItemWidth);
        grid-gap:7px;
        position:absolute;
        z-index:20;
        top:40px;
    }
    .topMenuLabel
    {
        display: grid;
    }
}
@media only screen and (max-width: 1330px) {
    .dynListInfoCont
    {
        justify-items:center;
        justify-content:center;
        grid-template-columns:auto auto; 
    }
    .dynListInfoContSys
    {
        justify-items:center;
        justify-content:center;
        grid-gap: 10px 0px;
        grid-template-columns:1fr; 
    }
    .dynListInfoContSys .linkBut_sysSite { max-width:690px; width:100%; }
    .dynListInfoContSys .sysTextCont { max-width:690px; width:98%; }
}
@media only screen and (max-width: 910px) {
    .topTitleH1 { font-size:28px; }
    .contSiteLinksL1, .contSiteLinksL2 { justify-content:center; grid-gap: 30px; }
    .sysSiteLinks, .sysSiteLinks2 { display:none; }
}
@media only screen and (max-width: 840px) {
    .topTitleH1 { font-size:26px; }
    .navBarDiv { display:none; }
    .contSiteLinks { grid-template-columns:auto auto;grid-gap: 40px;padding: 10px 10px 20px 10px; }
    .contSiteLinks2 { grid-template-columns:auto auto;grid-gap: 40px;padding: 20px 10px; }

    /*כפתורי דיפדוף בין דפים ברשימה*/
    .navLinksCont { grid-gap: 5px; }
    .navLinkNP, .navLinkSpace, .navLinkText, .navLink { height:30px; }
    .navLink { width:30px; }
    .navLinkText { width:20px; }
    .navLinkNP, .navLinkSpace { width:40px; }
}
@media only screen and (max-width: 780px) {
    .sLinkHome { display:none; }
    .contSiteLinksL1, .contSiteLinksL2 { grid-template-columns:auto auto; }
}
@media only screen and (max-width: 720px) {
    .dynMenuListSys
    {
        grid-gap: 10px 0px;
        grid-template-columns:1fr; 
    }
    .dynMenuListSysBut{  grid-column: 1 / span 1; }
    .dynMenuListSys .sysTextCont240 { width:98%; }
    
    .navLinksCont_big_top, .navLinksCont_big_bottom
    {
        grid-gap: 6px;
        margin-top:12px;
        margin-bottom:12px;
    }
    .navLinkNP_big, .navLinkSpace_big, .navLinkText_big, .navLink_big { height:40px; }
    .navLink_big { width:40px; font-size:18px; }
    .navLinkText_big { width:40px; font-size:18px; }
    .navLinkNP_big, .navLinkSpace_big { width:50px; font-size:25px; }
}
@media only screen and (max-width: 700px) {
    .topTitleH1 { font-size:24px; }
    .headerClass1 { margin:4px 0px 0px 0px; }
}
@media only screen and (max-width: 690px) {
    .dynListInfoCont
    {
        grid-gap: 10px 0px;
        grid-template-columns:1fr; 
    }
    .linkBut_sysList, .linkBut_sysSite { width:100%; }
    .sysTextCont { width:98%; }
}
@media only screen and (max-width: 600px) {
    .headerClass1 {
        grid-template-columns: var(--header_grid_cols2); /*130px 1fr; - משתנה לרוחב של השפה 0 אם אין שפות או 130*/
        grid-gap: 15px;
    }
    .topPadDiv { padding:0px 0px 0px 0px; } /*המרווחים של ראש האתר - מסך קטן*/
    .topTitleH1, .openLangSpan { display:none;} /*font-size:22px; margin:4px*/
    .openLangIcon { display:block; }
    .contSiteLinks { grid-gap: 30px;padding: 5px 6px 10px 6px; }
    .contSiteLinks2 { grid-gap: 30px;padding: 20px 6px; }
}
@media only screen and (max-width: 525px) {
    .headerClass1 { grid-template-columns: var(--header_grid_cols3); /*57px 1fr; - משתנה לרוחב של השפה 0 אם אין שפות או 57*/ }
    .langChooseDiv
    { 
        width:57px;
        grid-template-columns: 28px 20px;
        grid-gap:0px;
    }
    .langContDiv2 { width: 57px; }
    /*
    .topNavLinks
    {
        grid-template-columns: repeat(auto-fit, minmax(var(--topMenItWidthNer), var(--topMenItWidthNer)));
    }
    .topNavLinks a { min-width: var(--topMenItWidthNer); }
    */

    .contSiteLinksL1, .contSiteLinksL2 { grid-gap:20px; }
    .siteLink, .siteLinkL { padding:6px 7px;grid-gap: 8px; }
    .siteLink div { font-size:17px;padding-top:4px; }
    .siteLinkL div { font-size:17px;padding-top:7px; }
    
    .navLinksCont_big_top, .navLinksCont_big_bottom
    {
        grid-gap: 5px;
        margin-top:10px;
        margin-bottom:10px;
    }
    .navLinkNP_big, .navLinkSpace_big, .navLinkText_big, .navLink_big { height:30px; }
    .navLink_big { width:30px; font-size:17px; }
    .navLinkText_big { width:30px; font-size:17px; }
    .navLinkNP_big, .navLinkSpace_big { width:40px; font-size:23px; }
}
@media only screen and (max-width: 450px) {
    .contSiteLinksL1, .contSiteLinksL2 { grid-gap:10px; }
    .contSiteLinks { grid-gap: 10px;padding: 5px 3px 10px 3px; }
    .contSiteLinks2 { grid-gap: 10px;padding: 20px 3px; }
}
@media only screen and (max-width: 400px) {
    .siteLink div { font-size:15px;padding-top:4px; }
    .siteLinkL div { font-size:15px;padding-top:7px; }
}