.mobile-only{
    display:none;
}
#menu .menu-text-entry-mobile{
    display:none;
}
@media (orientation: portrait)  {
    body{

    }
    .float-rounded{
        border-radius: 100% !important;
        position: fixed;
        bottom: 45px;
        right: 5px;
        z-index:200;
        background:var(--color-primary);
        width:48px;
        aspect-ratio:1/1;
        background: var(--gradient);
        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
        font-weight:bold;
        padding:4px;
        border: 2px solid white;
        cursor:pointer;
    }
    .mobile-only{
        display:block;
    }
    #dev-menu, .no-mobile{
        display:none !important;
    }

    .login-form {
        padding: 0em;
        margin: 0em;
    }
    /***************************************** MENU ********************************/
    #menu-container{
        width:100%;
    }
    #menu{
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:auto;
        min-height:auto;
        padding:2px;
        z-index:2000;
    }
    #menu form{
        display:none;
    }
    #menu br{
        display:none;
    }
    #menu hr{
        display:none;
    }
    #menu .menu{
        color:#ffffff;
        line-height:1em;
        text-decoration: none;
        margin-bottom:2px;
        display: inline-block;
        padding:2px;
        border-radius:5px;
    }
    #menu .menu .material-symbols-outlined{
        font-size:1.6em;
    }
    #menu .menu-text-entry{
        display:none;
    }
    #menu .menu-text-entry-mobile{
        display:block;
        font-size:.8em;
    }
    #header{
        padding-top:50px;
    }
    h1{
        margin-top:40px;
        font-size: 30px;
        line-height: 80px;
    }
    h2{
        font-size: 20px;
        line-height: 26px;
    }
    h3{
        font-size: 14px;
        line-height: 20px;
    }
    h4{
        font-size: 14px;
        line-height: 16px;
    }
    h5{
        font-size: 14px;
        line-height: 16px;
    }
    h6{
        font-size: 14px;
        line-height: 16px;
    }

    .h1{
        font-size: 40px !important;
        line-height: 80px !important;
    }
    .h2{
        font-size: 30px !important;
        line-height: 36px !important;
    }
    .h3{
        font-size: 24px !important;
        line-height: 28px !important;
    }
    .h4{
        font-size: 20px !important;
        line-height: 24px !important;
    }
    .h5{
        font-size: 16px !important;
        line-height: 20px !important;
    }
    .h6{
        font-size: 14px !important;
        line-height: 16px !important;
    }

    .btn{
        font-size:.6em !important;
        padding:2px;
        padding-left:2px;
        padding-right:2px;
        border-radius:7px;
    }

    .activity-visual{
        max-width:150px;
    }

    .activity-legend{
        background-color: #ffffff;
        position:relative;
        padding:.5em;
        height:100%;
        margin-bottom:2em;
    }

    .header-hr {
        margin-top: 1em;
    }

    .breadcrumb {
        margin-top: .5em;
        margin-bottom: .5em;
    }

    .breadcrumb {
        margin-left:0;
        padding-left:0;
        font-size: .8em;
        & button.btn{
            margin-right:.5em;
            padding:2px !important;
        }
        & a{
            margin-right:.5em;
            padding:2px !important;
        }
         & i.spacer {
            margin-right: .5em;
            font-style: normal;
            padding-top: 8px;
            padding-bottom: 8px;
            font-size: 1em;
        }
    }

    /*************************Theme***************************/
    .mobile-category{
        margin-bottom:.5em;
    }
    .mobile-category a {
        font-size:.6em;
    }
    /*************************Theme Details***************************/

    .mobile-theme-detail {}
    .mobile-theme-detail-container{
        display:flex;margin-bottom:.5em;
    }

    .mobile-theme-detail-image{
        flex-shrink: 4;margin:0;padding:0;width:48px;
    }

    .mobile-theme-detail-content{
        font-size:smaller;flex-grow:4;margin:0;padding:0;padding-left:.5em;
    }

    .mobile-theme-detail-content a{
        text-decoration:none;
        text-transform:capitalize;
    }

    .mobile-theme-detail-content  .material-symbols-outlined{
        font-size:1.6em;
    }

    /***********************************************Activity Details************************************/
    #activity{
        margin:5px;
    }
    .activity-link{
        text-align: left !important;
    }
    .activity-link a, .activity-link button{
        font-size:smaller;
        border:none;
        background:transparent;
    }
    #downarrow{
        margin-top:0;
    }
    .lines{
        white-space: normal;
        text-align: left;
    }

    .lines:after, .lines:before {
        display: none;
    }
    #subactivity-content {
        padding-top: 0em;
    }
    .mobile-om-todo{

    }
    .om-options {
        margin-top: .2em;
        margin-left: -5px;
        margin-right: -5px;
        padding-left: 0px;
        padding-right: 0px;
        background-color: #f9f9f9;
        padding-top: .5em;
        padding-bottom: 2em;
    }
    #subactivity-nav-placeholder{
        margin-top: 2em ;
    }
    #subactivity-nav-placeholder .btn, #contact-form .btn{
        font-size:1.2em !important;
    }
    .orange-border{
        border-left: 1px solid transparent;
        padding-left:5px;
    }
    .om-line{
        margin-top: 2em;
    }
    .om-purpose{
        display:block;
        margin-top:.5em;
        margin-bottom:.5em;
    }
    .theme a{
        aspect-ratio: 1.5;
    }

    .theme-legend h2{
        font-size: 1em;
        line-height: 1.5em;   
        min-height: 1em;
    }
    #menuUser{
        border-left: none   !important;
    }
    .theme-legend{
        padding:.5em;
    }
}