@media only screen and (max-width: 480px) and (min-width: 320px){
	.hidem{display: none !important;}
	.hided{display: block !important;display: flex !important;}
    :root{
        --padding-h: 3vw !important;
    }
    .header .menu{
        padding: 10px;
        margin-right: 20px;
        border: 0px;
        background: transparent;
        height: 45px;
    }
    .header .menu .l1{
        width: 25px;
        height: 4px;
        background: #5e5e5e;
        margin: 2px 1px;
        border-radius: 2px;
    }
    .header .menu .lx{
        width: 15px;
    }
    .header .menu:active .l1{ background: #111; }

    .landing{
        flex-direction: column;
        padding: 30px;
        min-height: auto;
    }
    .landing .graphic {
        flex: 1;
        margin: 20px 0px;
        width: 100vw;
        height: 100vw;
    }
    .landing.main{height:auto;}
    .landing .lines {
        flex: 1;
        padding: 0px 30px;
    }
    .landing .graphic img {
        height: auto;
        max-height: 100%;
        width: 100%;
    }
    .landing .lines .l1{
        font-size: 30px;
    }
    .landing .items{ margin: 50px 0px; }
    .mttl {
        font-size: 30px;
    }
    .howto {
        padding: 30px;
        min-height: auto;
        align-items: center;
        flex-direction: column;
    }
    .howto .f {
        margin-bottom: 50px;
    }
    .features{ margin-top: 0px; }
    .features .items{
        gap: 15px;
        justify-content: center;
    }
    .features .item{
        flex-basis: 45%;
        max-width: 45%;
    }
    .landing .lb {
        flex-direction: column;
    }
    .landing.try {
        padding: 30px;
    }
    .footer{
        flex-direction: column;
        padding: 30px;
    }
    .footer .s1 {
        margin-bottom: 30px;
    }
    .footer .s2 {
        flex: 1;
        margin-bottom: 30px;
    }
    .premium .plans {
        flex-direction: column;
    }
    .mnav{
        top: 0px;
        left: 0px;
        bottom: 0px;
        background: #fff;
        box-shadow: 5px 0px 27px #ccc;
        flex-direction: column;
        width: 80vw;
        z-index: 2020;  
        padding: 30px;      
    }
    .mnav.h{
        transform: translateX(-100vw);
    }
    header.h{
        transform: translateX(80vw);
    }
    header.h .menu .l1a{
        transform: translate(2px, 9px) rotate(45deg);   
    }
    header.h .menu .l1b{
        transform: translate(2px, 1px) rotate(-45deg);
    }
    header.h .menu .lx{
        display: none;
    }
    .mnav .logo{
        max-height: 40px;
        margin-bottom: 30px;
    }
    .mnav .nav a{
        border-radius: 4px;
        padding: 10px;
    }
    .mnav .nav a.on{
        background: #f3f3f3;
    }
    .appify .content{
        padding: 0px;
        width: 100%;
    }
    .help .how .btns button {
        width: 45px;
        height: 45px;
        margin: 20px;
        border: 0px;
    }
    .help .how .btns button .ico {
        font-size: 36px;
        background: var(--color);
        color: #fff;
        padding: 10px;
        margin-top: 5px;
    }
    .help .how .title {
        margin-bottom: 20px;
    }
    .help .sector {
        padding: 30px !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    .go-part{
        width: 100%;
        margin: 0px;
    }
    .contact .cform{
        flex-direction: column;
    }
    .contact .uform {
        flex: 1;
        padding: 20px;
    }
    .contact .hed {
        padding: 40px 30px 200px 30px;
    }
    .account {
        padding: 30px;
    }
    .sitfy{
        flex-direction: column;
    }
    .sitfy .side {
        flex: 1;
        max-width: 100%;
        border-right: 0px;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }
    .sitfy .sitnav{
        flex-wrap: wrap;
    }
    .dialogbox .msgbox{
        max-width: 90vw;
        min-width: 90vw;
    }
    .sitdb{
        flex-direction: column;
    }
    .profile .form, .edit-site .form, .sitdb .form{
        width: 100% !important;
    }
    .fotr {
        height: 3vh;
    }
    .notes{
        max-width: 100%;
        margin-left: 0px;
    }
    .sitbup{
        flex-direction: column;
    }

    .landing.main .l1{
        width: 80vw !important;
    }
    

}