@import url('https://fonts.googleapis.com/css2?family=Fredoka:wdth,wght@75..125,300..700&display=swap');

:root {
    --Almost-black: #222;
    --medium-grey: #767676;
    --light-grey: #A0A0A0;
    --space: #262A2E;
    --violet: #FF4382;
    --deepsky: #20B1F3;
    --white: #ffffff;
    --Iron: #D4D7D9;
    --Almost-White: #FBFBFB;
    --supernova: #FFD43A;
    --smoke: #F4F4F4;
    --Red: #EF5350;
    --alice-blue: #EDF7FF;
    --go-green: #55C05A;
    --bright-sun: #F6DC56;
    --Shark: #1D1D1B;
    --Green: #66BB6A;
    --supernova-positive: #FFCC16;
    --Bunker: #121517;
    --Alabaster: #F9F9F9;
}
* {font-family: 'Fredoka', sans-serif;}
strong {font-weight: 500;}
li {font-weight: 400;}
body {
    direction: rtl;
    margin: 0px !important;
}
h1, h2 {
    color: #4c4c4c;
    font-weight: 500;
}
body, p {
    color: #4c4c4c;
    font-weight: 400;
}
a {
    text-decoration: none;
    color: var(--Bunker);
}
a:hover{
    text-decoration:underline;
}
h4 {
    font-weight:500;
    margin: 5px 0 0 0;
}
.sideBarTitle {
    color: #B73D76;
    text-decoration: none;
    padding: 5px;
    font-weight: 500;
}
.sideBarTitle:hover {
    text-decoration: underline;
}
.sideBarImage {
    width: 100%;
    max-height: 400px;
    object-fit: cover;
    border-radius: 5px;
}
    .sideBarImage:hover {
        /*opacity: 0.7;*/
    }
.DivTosideBarImage250 {}
.sideBarImage250 {
    width: 100%;
    max-height: 200px;
    object-fit: cover;
    border-radius: 5px;
    min-height: 200px;
}
    .sideBarImage250:hover {
        opacity: 0.7;
    }
p, div {
    font-size: 18px;
}
.middle900 {
    margin: auto;
    padding:10px;
}
h1 {
    color: #B73D76;
    font-size: 34px;
}

h2 {
    font-size: 22px;
}
h3 {
    font-size: 21px;
}
#Image1 {
    width: 100%;
}
#Image2 {
    width: 100%;
}
#Image3 {
    width: 100%;
}

@media screen and (min-width: 700px) {
    .TextMainArticle {
        position: absolute;
        bottom: 0;
        background: rgb(0 0 0 / 55%);
        color: white;
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        text-align: right;
        max-width: 800px;
    }
        .TextMainArticle p {
            color: var(--smoke);
        }
    article {
        width: 24%;
        max-width: 350px;
    }
    .articleContainer {
        display: flex;
        flex-wrap: wrap;
        justify-content: center; /* ממרכז את האלמנטים אופקית */
        align-items: flex-start; /* מיישר את האלמנטים לצד העליון */
    }
    .SingleArticle {
        padding: 10px;
        float: right;
        min-height: 400px;
    }
    .MobileLogo{
        display:none;
    }
    .spaceBeforeTitle {
        padding: 20px;
    }
    .Logo {
        position: absolute;
        float: left;
        left: 13px;
    }
    .Logo img {}
    #menu img {}

    #p1 {
        /*width: 100%;
    max-height: 250px;*/
        border-radius: 5px;
        width: 100%;
        height: 400px;
    }
    h1 {
        color: #B73D76;
        font-size: 30px;
    }

    /*h2 {
        font-size: 22px;
    }*/

    h3 {
        margin: 5px 0 -10px 0;
        font-size: 20px;
        font-weight: 500;
    }

    #Post h3 {
        font-size: 24px;
        color:#3b3b3b !important;
    }

    #Image1 {
        width: 900px;
        max-height: 400px;
        object-fit: cover;
        border-radius: 5px;
    }

    #Image2 {
        width: 900px;
        max-height: 400px;
        object-fit: cover;
        border-radius: 5px;
    }

    #Image3 {
        width: 900px;
        max-height: 400px;
        object-fit: cover;
        border-radius: 5px;
    }

    .Image3Div {
        float: left;
        margin-right: 20px;
    }

    ShortBottomTextDiv {
        float: right;
    }

    .middle900 {
        max-width: 900px;
        margin: auto;
        float: right;
    }

    .middlmiddle100pe900 {
        max-width: 100%;
        margin: auto;
        float: right;
    }

    .middle200 {
        width: 250px;
        margin: auto;
        float: left;
        padding-right: 20px
    }

    .middle1100 {
        max-width: 1200px;
        margin: auto;
        width: 95%;
    }

    .middle100p {
        min-width: 1200px;
        margin: auto;
        width: 95%;
    }
}

.topnav {
    background-color: var(--Almost-White);
/*    display: flex;
    justify-content: space-between;
    align-items: center;*/
    height: 75px;
    border-bottom: 1px solid var(--Iron);
}


#myTopnav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: absolute;
    width: 100%;
    /*background: #262a2e;*/
}

#myTopnav li {
    display: inline-block;
    float: right;
    margin-left: 1px;
}

#myTopnav li:last-of-type {
    /*display: inline-block;
    float: left;
    margin-left: 1px;*/
}
/*    #myTopnav li a {
        display: block;
        text-align: center;
        line-height: 74px;
        text-decoration: none;
        padding: 0 20px 0 20px;
    }*/


    #myTopnav li a {
        display: block;
        text-align: right;
        line-height: 74px;
        text-decoration: none;
        padding: 0 20px 0 20px;
    }


@media screen and (max-width: 700px) {
    h3 {
        font-size: 21px;
        font-weight: 500;
        margin: 0;
    }
    #myTopnav li .logo {
        display: none;
    }

    #myTopnav li:last-of-type {
        float: right !important;
    }

    #myTopnav ul {
        /*width: 89%;*/
    }

}
#myTopnav li .logo {
    padding: 0 30px 0 10px !important;
    margin-left: 90px;
    color: #ffcc16;
    font-size: 24px;
    font-weight: 600;
}
/*#myTopnav li:hover a:not(.logo):not(.hidden) {
    background: #FAC10B;
}*/



#myTopnav li:hover ul li a {
    color: #262a2e;
    height: 40px;
    line-height: 40px;
}

    #myTopnav li:hover ul li a:hover {
        background: #f3f3f3;
        /*background: #FAC10B;*/
    }

    #myTopnav li ul {
        display: none;
        width: unset;
    }

        #myTopnav li ul li {
            display: block;
            float: none;
        }

            #myTopnav li ul li a {
                width: auto;
                min-width: 150px;
                padding: 0 10px;
            }

#myTopnav ul li a:hover + .hidden, #myTopnav .hidden:hover {
    display: block;
    background: unset;
    background-color: #ffffff;
    min-width: 160px;
    z-index: 99999;
    padding: 10px;
    border-radius: 16px;
    box-shadow: 0px 8px 18px -6px #18274B1F;
    width: 200px;
}

#myTopnav input[type=checkbox] {
    display: none;
}

#myTopnav input[type=checkbox]:checked ~ #menu {
    display: block;
}

#myTopnav .show-menu {
    /*color: #fff;
    background: #262a2e;*/
    text-align: right;
    padding: 20px 10px;
    display: none;
}


@media screen and (max-width:700px) {
    .middle100p {
        padding:0 9px 0 9px;
    }
    .Desktoponly {
        display: none !important;
    }

 /*   .MobileLogo img {
        height: 50px;
    }

    .MobileLogo {
        position: absolute;
        float: left;
        left: 13px;
    }*/

    .spaceBeforeTitle {
        padding: 10px;
    }
    .MobileLogo {
        position: absolute;
        top: 15px;
        width: 70%;
        text-align: center;
        right: 14%;
        left: 14%;
    }
        .MobileLogo a {
            color: #ffcc16;
            font-size: 24px;
            font-weight: 600;
            text-decoration: none;
        }

        .MobileLogo img {
            margin-top: 10px;
            width: 160px;
        }
    #p1 {
        /*width: 100%;
    max-height: 250px;*/
        border-radius: 5px;
        width: 100%;
        height: 150px;
        background-repeat:no-repeat;
    }
    .sideBarImage250 {
        max-width: unset;
    }
    .DivTosideBarImage250{
        padding-left:0px;
    }
    #myTopnav ul {
        position: static;
        display: none;
    }

    #myTopnav li {
        width: 100%;
        background-color: var(--Almost-White);
        border-bottom: 1px solid var(--Iron);
    }

    #myTopnav ul li, li a {
      /*  width: 100%;*/
    }

    #myTopnav .show-menu {
        display: block;
    }
    .LobbyArticlesTitleParagraf {
        margin: 5px 0 40px 0;
    }
}
.LBTitle {
    /*margin-top: -50px;
    padding: 5px;*/
    position: relative;
    text-align: center;
    margin-bottom: 30px;
    height: 200px;
}
}

.LBTitleImg {
    /*opacity:0.9;*/
    border-radius: 5px;
    width: 100%;
}

    .LBTitleImg:hover {
        /*opacity: 0.7;*/
        border-radius: 2px;
    }

.PTitle {
    /*position: relative;
    top: 130px;
    background-color: #000;
    opacity: 0.75;*/
    position: absolute;
    bottom: 0;
    width: 100%;
    color: white;
    padding: 10px 0;
    background: var(--white);
    box-shadow: 0px 2px 16px 0px #0000000D;
}
.PSubTitle {
    font-weight: 400 !important;
    font-size: 14px !important;
    color:var(--light-grey) !important;
}
.PTitle p {
    color: var(--Almost-black);
    padding-right: 16px;
    font-weight: 400;
    font-size: 16px;
    margin: 0;
    text-align:right;
}


.pTextBarLeft {
    position: relative;
    top: -60px;
    right: 10px;
    color: #100f0f;
}

.LeftBarCatTitle {
    font-size: 26px;
    text-decoration: none;
    color: #ffc50a;
    text-align: center;
    margin: 10px;
    font-weight: 500;
}

.smallText {
    font-size: 15px;
    margin: 5px 0;
}

.SingleArticle {
    /*padding: 10px;
    float: right;
    min-height: 400px;*/
}

#TxtCredit, #Created{
    font-size:14px;
}

.SubTitleSideBar{
    font-size:15px;
    padding:5px;
}

.LobbyMainArticlesTitle {
    font-size: 23px;
    color: var(--supernova);
    text-decoration: none;
}

.LobbyMainArticlesTitle:hover{
    text-decoration:underline;
}

.LobbyArticlesTitle {
    font-size: 20px;
    color: #B73D76;
    text-decoration: none;
}

.LobbyArticlesTitleContainer {
    /*min-height:50px;*/
}

.LobbyArticlesTitleParagraf{
    font-size:18px;
}
.LobbyArticlesTitle:hover {
    text-decoration: underline;
}


div.wrapper {
    overflow: hidden;
}

div.wrapper > div {
    width: 100%;
    height: 100%;
    transition: background-size 0.3s ease;
    background-size: 100%;
    background-position: center center;
}

div.wrapper:hover > div {
    background-size: 120%;
}

.divB {
    width: 35px;
    height: 5px;
    background-color: var(--Bunker);
    margin: 6px 0;
}


.SideBarMoreInMagazineTitle {
    font-size: 21px;
    color: #B73D76;
    text-decoration: none;
    padding-right: 10px;
    font-weight: 500;
}

    .SideBarMoreInMagazineTitle:hover {
        text-decoration: underline;
    }

.ArticleCreditFont {
    font-weight: 500;
    font-size: 15px;
}

.StripOnMainImage {
    position: relative;
    top: -60px;
    background-color: #3f3e3d;
    opacity: 0.70;
    height: 30px;
    font-size: 16px;
    color: #ffffff;
    padding: 12px;
}

.PaddingToImageInArticles{
    padding:10px 0 0 0;
}
.H1MarginTop {
    /*margin-top: -40px;*/
    margin: -55px 0 0 0;
}

.FooterText {
    color: whitesmoke;
    font-size: 13px;
}

.SubCatName a {
    font-size: 17px;
    color: #ffc50a;
}

.SubCatName {
    font-size: 17px;
    color: #ffc50a;
}


.LeadFormTitle {
    font-size: 20px;
    color: #B73D76;
    font-weight: 500;
}

.ExtraStringTOSubCatName a{
    font-weight:500;
    font-size:18px;
}

.iframe-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
}

.iframe-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



/*#region Footer */
.f26 {
    font-size: 26px;
}
.white {
    color: #fff;
}
.orange {
    color: #ffc50a;
}
.L {
    float: left;
}

.R {
    float: right;
}


.parsley-error-list {
    display: none !important;
}

.parsley-error {
    border: 1px solid red !important;
}



.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}
/*#endregion */

#Post a {
    text-decoration:underline;
    color: #e8aa00;
}



/*START LEAD FORM STYLE*/
@media screen and (min-width: 1000px) {
    .formLead .group input {
        font-size: 18px;
        padding: 10px 10px 10px 5px;
        display: block;
        width: 180px;
        border: 1px solid #ccc;
        border-radius: 3px;
    }
        .formLead .group input[type=submit] {
            font-size: 18px;
            border-radius: 4px;
            background: #02b25d;
            color: #ffffff;
            width: 180px;
            cursor: pointer;
            padding: 10px 10px 10px 5px;
        }
        .formLead .group input[type=submit]:hover {
            border: 0px solid #113724;
            background: #099d63;
        }
    
}

@media screen and (max-width: 700px) {
    .TextMainArticle {
        bottom: 0;
        background: var(--Bunker);
        color: white;
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        text-align: right;
        max-width: 800px;
    }
    #CatName{
        padding:18px;
    }
    .formLead .group input {
        font-size: 18px;
        padding: 0;
        display: block;
        height: 56px;
        width: 360px;
        border: 1px solid #ccc;
        border-radius: 3px;
    }

        .formLead .group input[type=submit] {
            border: 0px solid #02de74;
            border-radius: 4px;
            background: #02b25d;
            color: #ffffff;
            width: 360px;
            height: 56px;
            cursor: pointer;
        }

            .formLead .group input[type=submit]:hover {
                border: 0px solid #113724;
                background: #099d63;
            }
}

.formLead .group {
    float: right;
    margin-left: 20px;
}

.formLead {
    background-color: #f9f9f9;
    padding: 10px;
}

.LeadRegularExpressionValidator {
    color: red;
    font-size: 14px;
    font-weight: 700;
}

.SMessage {
    color: red;
    font-size: 20px;
    font-weight: 700;
    margin-right: 25px;
    display: none;
}
/*END LEAD FORM STYLE*/

.L{
    float:left !important;
}



.MainArticlesContainer {
    position: relative;
    margin-bottom: 50px;
}

    .MainArticlesContainer .sideBarImage {
        display: block;
        width: 100%;
        height: auto;
    }




    .MainArticlesContainer .LobbyMainArticlesTitle {
        font-size: 23px;
        color: var(--supernova);
        text-decoration: none;
    }

    .MainArticlesContainer p {
        color: var(--smoke);
        font-weight: 400;
    }



#EndFooter {
    font-size: 14px !important;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: -0.599795937538147px;
    margin: auto;
    padding: 20px 100px 20px 100px;
    text-align: right;
}

    #EndFooter .logoImg {
        display: table;
        width: 100%;
        padding-bottom: 30px;
        padding-top: 40px;
    }
        #EndFooter .logoImg .FooterLogo {
            width: 142px;
        }

        #EndFooter .logoImg a {
            text-decoration: none;
        }
    #EndFooter .Footericon {
        width: 32px;
        margin-right: 20px;
        vertical-align: middle;
    }
    #EndFooter .logoImg a span {
        color: var(--Almost-White);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        letter-spacing: -0.6px;
        padding-right: 5px;

    }
    #EndFooter .yellowline {
        width: 100%;
        height: 1px;
        background-color: var(--supernova);
        margin-bottom: 30px;
    }
.Almost-White {
    color: var(--Almost-White);
}
#EndFooter {
    background: var(--space);
}