subline/views/dashboardPage/css/mobile/landscapeTablet.css

@media screen and (orientation: landscape){
    @media screen and (max-width: 1200px){
        body{
            background: rgb(0, 27, 45);
        }

        .contentBlock{
            padding: 0;
        }

        .button{
            padding: 3px 0;
        }

        .mobileMenuSelector{
            display: flex;
            color: rgb(240, 252, 255);
            z-index: 10;
        }

        .strandHead{
            color: white;
            position: fixed;
            top: 5px;
            left: 25px;
            right: 0;
            margin: 0;
            text-align: center;
            font-size: 20px;
        }

            .strandTitle{
                margin: 0;
            }

        .choosable{
            background: rgb(201, 201, 201);
            color: black;
        }

        /* HOME */
        #homeStrand{
            flex-direction: row;
            padding: 0;
            align-items: flex-end;
        }

            #graphCard{
                display: none;
            }

            #inventoryCheckCard{
                display: none;
            }

            .flexRow{
                height: 80%;
            }

                .flexRow:nth-child(3){
                    flex-grow: 2;
                }

                .card{
                    background: white;
                }

                #popularIngredientsCard{
                    max-height: 100%;
                    padding-bottom: 5px;
                }

        /* INGREDIENTS */
        #ingredientsStrand{
            padding-bottom: 10px;
            justify-content: flex-end;
        }

        #categoryList{
            height: 70%;
        }

            .categoryDiv{
                margin: 3px;
            }

                .categoryDiv > div:first-of-type p{
                    padding: 5px 10px;
                }

                .categoryDiv > div:first-of-type button{
                    padding: 0;
                    height: initial;
                    width: initial;
                    display: flex;
                    align-items: center;
                }
            
            .ingredientsDiv{
                width: 90%;
            }

        /* RECIPE BOOK */
        #recipeBookStrand{
            padding-bottom: 10px;
            justify-content: flex-end;
        }

            #recipeList{
                height: 70%;
            }

        /* ANALYTICS */
        #analyticsStrand{
            padding-bottom: 10px;
            justify-content: space-between;
        }

            #analyticsStrand .strandHead{
                position: static;
                height: unset;
                flex-wrap: wrap;
            }

                #analyticsStrand .strandTitle{
                    width: 100%;
                    margin-top: -13px;
                    margin-left: 10px;
                }

                .switch{
                    margin-top: -15px;
                    font-size: 15px;
                }

                #analyticsStrand .dateRange{
                    margin-top: -55px;
                }

                .analDateRange{
                    display: none;
                }

            .analContent{
                padding: 0;
                height: 70%;
            }

                .itemsList{
                    width: 23%;
                }

                .analData{
                    width: 73%
                }

                .dataRow{
                    display: none;
                }

                .modebar-container{
                    display: none;
                }

            #analRecipeContent{
                height: 70%;
            }

            #newOrderBtn{
                display: none;
            }

        /* ORDERS */
        #ordersStrand{
            justify-content: flex-end;
        }

            #ordersStrand .buttonBox{
                margin: 0;
            }

            #orderList{
                height: 70%;
            }

        /* TRANSACTIONS */
        #transactionsStrand{
            justify-content: flex-end;
        }

            #transactionsStrand .buttonBox{
                margin: 0;
            }

            #transactionsList{
                height: 70%;
            }


        /* SIDEBARS */
        .sidebar{
            width: 100vw;
            color: white;
            padding: 3px 15px;
        }

        .sidebarIconButtons{
            display: none;
        }

        /* MENU */
        #menu{
            display: none;
            width: 100vw;
            height: 100vh;
            padding: 0;
            flex-wrap: wrap;
            flex-direction: row;
            justify-content: space-around;
        }

            .menuShifter{
                display: none;
            }

            .menuHead{
                justify-content: center;
                padding: 0;
                margin-bottom: 0;
                height: 50px;
            }

                .menuHead a{
                    width: initial;
                    justify-content: center;
                }

                    .menuLogo{
                        max-height: 50px;
                        max-width: 50px;
                    }

                .menuButton{
                    width: 40%;
                    justify-content: center;
                    background: rgb(201, 201, 201);
                    color: black;
                    margin: 15px;
                    padding-left: 0;
                    box-shadow: 0 0 5px white;
                    height: 10vh;
                }

            /* INGREDIENT DETAILS */
            #ingredientDetails > *{
                margin: 0;
            }

            #recipeListLabel, #subIngredientList{
                display: none;
            }

            /* FILTER ORDERS */
            #orderFilter > *{
                margin: 0;
            }

            #orderFilter h1{
                padding: 0;
            }

            #filterOrderDateRange, #orderFilter .lineBorder{
                display: none;
            }

            .dateRange{
                padding-bottom: 3px;
            }

            #orderFilterSubmit{
                margin-top: 3px;
            }

            /* ORDER DETAILS */
            #orderIngredients{
                display: none;
            }

            /* TRANSACTION DETAILS */
            #transactionRecipesLabel, .transactionRecipes, #transactionDetails .lineBorder{
                display: none;
            }

            /* FILTER TRANSACTIONS */
            #transactionFilter > *{
                margin: 0;
            }

            #transactionFilterDateLabel{
                display: none;
            }

            #transactionFilter .dateRange{
                margin-bottom: 5px;
            }

            #transFilterSubmit{
                margin-top: 5px;
            }
    }
}