
@media screen and (max-width: 991px) {
    .md-none {
        display: flex;
    }

    .m-none {
        display: none !important;
    }

    .sidebar {
        width: 100%;
        height: 100px;
        border-radius: 0px;
        align-items: center;
        align-content: center;
        top: unset;
        justify-content: space-around;
        bottom: 0%;
        flex-direction: row !important;
        margin-top: unset !important;
        margin-bottom: unset !important;
    }

    .glenn .svg {
        width: 60px;
        height: 60px;
    }

    .kicthen-options img {
        width: 60px;
        height: 60px;
    }

    .glenn:hover {
        box-shadow: 0 0 5px #fff;
        -moz-box-shadow: 0 0 5px #fff;
        -webkit-box-shadow: 0 0 5px #fff;
        border-top: 4px solid #a24b2b;
        border-bottom: 0px solid #a24b2b;
        margin: -4px 0px;
        border-left: 0px !important;
        border-right: 0px !important;
    }

    .option-details {
        left: 0px;
        height: 400px;
        width: 100%;
        border-radius: 0;
        bottom: 5%;
        top: auto;
    }

    .sidebar::before {
        /* content: url(img/curve.png);
        position: absolute;
        top: -24px; */
        display: none;
    }

    .sidebar::after {
        /* content: url(img/curve.png);
        position: absolute;
        bottom: -19px; */
        display: none;
    }

    .logoDiv img {
        width: 65px;
        height: auto;
    }

    .logoDiv h2 {
        margin-bottom: 0px;
        margin-left: 15px;
        color: #fff;
        font-size: 55px;
    }

    .logoDiv {
        margin: 0px !important;
        background: #41464b59;
        display: flex;
        align-items: center;
        position: fixed;
        font-size: 14px;
        z-index: 111111;
        width: 100%;
        top: 0%;
        padding: 30px;
        justify-content: flex-start;
        align-content: center;
    }


    .slide-right {
        animation: 1s slide-top;
    }

    #floor-selector.active,
    #wallcolor-selector.active,
    #backsplash-selector.active,
    #door-selector.active,
    #handle-selector.active,
    #worktop-selector.active,
    #showBomList.active,
    #start_threed.active {
        box-shadow: 0 0 5px #fff;
        -moz-box-shadow: 0 0 5px #fff;
        -webkit-box-shadow: 0 0 5px #fff;
        border-top: 4px solid #a24b2b;
        border-bottom: 0px solid #a24b2b;
        margin: -4px 0px;
        border-left: 0px !important;
        border-right: 0px !important;
    }

    .option-details p {
        font-size: 35px;
    }

    .option-details hr {
        width: 0% !important;
    }

    .optionsList {
        display: grid;
        padding: 0px;
        list-style: none;
        gap: 5px 10px;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
        float: left;
    }

    .optionsList li a p {
        font-size: 16px !important;
        margin-top: 10px !important;
    }

    .optionsList img {
        width: 110px !important;
        height: 110px !important;
    }

    #rightSideBlock .col-md-3 {
        width: 25% !important;
    }

    .rightSideBlock {
        bottom: 7% !important;
        z-index: inherit !important;
    }

    .rightSideBlock i {
        font-size: 55px;
    }

    .optionsList li a.active:before{
        content: url(../kitchen3d/img/checked.png) !important;
    }

    .bom_div .container{
        max-width: 100%;
        padding: 0px 30px;
    }

    /* FullScreenMode Css */

    .fullScreenMode .logoDiv{
        padding: 15px !important;
    }

    .fullScreenMode .logoDiv img{
        width: 40px !important;
    }
    .fullScreenMode .logoDiv h2{
        font-size:25px !important;
    }
    
    .fullScreenMode .sidebar{
        height: 65px !important;
    }

    .fullScreenMode .glenn .svg,
    .fullScreenMode .kicthen-options img {
        width: 30px !important;
        height: 30px !important;
    }

    .fullScreenMode #start_threed,
    .fullScreenMode .bomListOption,
    .fullScreenMode .glenn{
        padding: 8px 5px !important;
    }

    .fullScreenMode .rightSideBlock i {
        font-size: 30px !important;
    }

    .fullScreenMode .rightSideBlock {
        bottom: 10% !important;
    }

    .fullScreenMode .bom_div .container{
        padding: 0px 6px !important;
    }

    .fullScreenMode .option-details{
        padding:10px 10px 20px 25px !important;
    }

    .fullScreenMode .option-details p {
        font-size: 23px !important;
    }

    .fullScreenMode .optionsList img {
        width: 60px !important;
        height: 60px !important;
    }
    .fullScreenMode .optionsList li a.active:before {
        content: url(../kitchen3d/img/checklist.png);
        position: absolute;
    }
}

@media only screen and (max-width: 991px) and (orientation: landscape) {
    .logoDiv {
        height: 60px;
        padding: 2px 25px 0px 25px !important;
        position: fixed;
        width: 100%;
        top: 0;
    }

    .sidebar {
        display: flex !important;
        width: 100%;
        height: 68px;
        position: absolute !important;
        bottom: 0px !important;
        align-content: center;
        justify-content: space-around;
        flex-direction: row !important;
    }

    .glenn .svg {
        width: 40px !important;
        height: 40px !important;
    }

    .kicthen-options img {
        width: 40px !important;
        height: 40px !important;
    }

    .option-details p {
        font-size: 20px !important;
    }

    .optionsList li a p {
        font-size: 10px !important;
        margin-top: 6px !important;
    }

    .option-details {
        left: 0px;
        height: 190px;
    }

    .optionsList {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    }

    .optionsList img {
        width: 60px !important;
        height: 60px !important;
    }

    .logoDiv img {
        width: 35px;
        height: auto !important;
    }

    .logoDiv h2 {
        font-size: 30px !important;
        color: #fff;
    }
    
    .rightSideBlock {
        bottom: 17% !important;
    }

    .rightSideBlock i {
        font-size: 30px;
    }
}