

/* Hide the burger menu on larger screens */
@media screen and (min-width: 769px) {
    .custom-burger,
    .custom-menu-toggle {
        display: none;
    }

    /* Ensure the menu is visible on larger screens without needing the burger */
    .custom-menu {
        margin: 0;
        display: flex;
        position: static;
        width: auto;
        background-color: #3d3326;
        border-bottom: 1px solid #333;
    }

    .custom-menu-item {
        padding: 0;
    }

    .custom-menu-link {
        color: #333;
    }
}


@media (max-width:1100px)
{

    .homeHero .delement > div:nth-child(1)
    {background:transparent}
    .setStyle.homeHero {
        background-image: url("../../pictures/backing-tracks-lyrics-player.jpg");
        position: relative;
        opacity: 1;
        height: 70vh;
        background-position-x: right;
        background-size:cover;
        text-shadow: 2px 2px 5px black;
        margin-bottom: 45px;
    }

    .setStyle.homeHero > div {align-content:center;height: 100%;padding: 0; max-width:1600px;}
    .setStyle.homeHero > div > div {font-size: 28px;color:white;font-weight:bold;height: 100%;align-items: center;align-content: baseline;}
    .setStyle.homeHero > div .intro {font-size: 19px;font-weight:normal;}

    .setStyle.homeHero h1 {
        font-size: 28px;
    }


    .setStyle.homeIntro > div {padding:10px;font-size: 17px;}


    .youtubeVideo {
        border: none;
        border-radius: o;
        box-shadow: none;
        overflow: hidden;



    }
}

@media (max-width: 800px) {


    .custom-nav {
        position: relative;
        padding: 3px;
        margin-top: -39px;
    }

    .custom-burger {
        cursor: pointer;
        width: 30px;
        height: 25px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        margin: 10px;
        background: #c6d7a3;
        padding: 10px;
        float: right;
        position: relative;
        top: -20px;
    }

    .custom-burger-line {
        height: 4px;
        background-color: #333;
        margin: 0 !important;
        padding: 0 !important;
    }

    .custom-menu {
        list-style: none;
        /* position: absolute; */
        top: 110px; /* Adjust this value for correct placement */
        left: 0;
        width: 97%;
        display: none;
        background-color: #efefef;
        padding: 48px;
        z-index: 10000;
        margin: 0;
        box-sizing: border-box;
    }

    .custom-menu-item {
        padding: 10px;
        text-align: center;
        margin: 0 !important;
    }

    .custom-menu-link {
        color: #fff;
        text-decoration: none;
    }

    /* Show menu when burger is clicked */
    .custom-menu-toggle:checked + .custom-menu {
        display: block;
    }

    /* Hide the checkbox */
    .custom-menu-toggle {
        display: none;
    }

    p.osLogos {
        /* font-size: 38px; */
        text-shadow: 2px 5px 5px black;
    }

    .setStyle.homeIntro > div {padding:0px;
    }

    .priceGrid .delement > div {
        margin-bottom: 45px;
    }


    .setStyle.homeHero > div > div
    {font-size: 30px;align-content: baseline;}

    div#topSocials {
        color: white;
        text-decoration: none;
        float: left;
        width: 100%;
        margin-top: 20px;
        display: flex;
        align-items: center;
        place-content: space-evenly;
    }
    .setStyle {padding:20px}
    .setStyle.homeTop {padding:10px;}
    .setStyle.homeFour {padding:10px;}

    #banner {display:block;contain: layout;}
    .readingBit {box-sizing: border-box;}

    .theText {
        display: block;
    }

    body {font-size: 18px !important;}

    #infoot pre {text-align: center !important;}

    .logo {width: 75% !important;/* max-width: 115px; */float: left;margin-right: 20px;}

    .FloatLeft, .FloatRight {float:none; width:100%;}
    #cssmenu
    {bottom: auto;top: 120px;}
    .tooltip{position:relative;float: left;left: -20px;top: 19px;}


    .setStyle > div > div {width:90%; clear:both; }
    .setStyle > div   {display: block !important;}





    .pp {width: 85% !important;}
    .formBit input {/* float:left; *//* margin-bottom: 20px; */position: relative;font-size: 19px;}
    #threeFooter div,#threeFooter div:first-child,#threeFooter div:last-child{width:90%;
        margin:auto;
        text-align:center!important;
        float:none!important;
    }


    #threeFooter div{font-size:12px!important;}


    .caption {

        font-size:22px;

        opacity: 1;
    }



}


@media (max-width: 600px) {

    .setStyle > div > div {display: block;width: auto;}

}

/* gallery styles */


@media (max-width: 1024px) {
    #galBoxes div {
        flex: 1 1 calc(33% - 10px);
        max-width: calc(33% - 10px);
    }
}

@media (max-width: 768px) {
    #galBoxes div {
        flex: 1 1 calc(50% - 10px);
        max-width: calc(50% - 10px);
    }
}

@media (max-width: 480px) {
    #galBoxes div {
        flex: 1 1 calc(100% - 10px);
        max-width: calc(100% - 10px);
    }
}

@media (max-height:670px)
{
    body {

        font-size: 18px;

        font-weight: normal;
    }

    .setStyle.homeHero h1 {
        font-size: 30px;
    }

    .homeHero .delement > div:nth-child(1) {
        background: rgb(34 34 34);
        max-width: 500px;

    }
    .setStyle.homeIntro > div {

        font-size: 18px;
    }}
