.menu-mobile{
    display: none;
}

@media screen and (max-width: 1360px) {
    .intro .serv-cont .cells{
        grid-template-columns: repeat(2, 1fr); 
    }
    
}
@media screen and (max-width: 600px) {
    *{
        -webkit-tap-highlight-color: transparent; 
    }
    html,#body-o{
        height:100vh;
    }
    .navi{
        display: none;
    }
    #head{
        height: 50px;
    }
    header #head-cont {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    header #head-cont h1{
        padding-left: 20px;
        font-size: 2em;
    }
    header #head-cont #head-t{
        padding-left: 0px;
    }
    .dummyoffset-o{
        height: 90px;
    }
    .menu-toggle{
        padding-right: 20px;
        display: block;
        color: white;
        font-size: 2em;
        margin-bottom: 10px;
    }
    .logo-mb{
        display: block;
        width: 50px;
        height: 50px;
    }
    .main-cont{
        background-size: 300%;
    }
    .main-cont .overlay .cont-text
    {
        padding: 0px;
        width: 90%;
    }
    .main-cont .overlay .cont-text .ttl:first-child{
        display: none;
    }
    .main-cont .overlay .cont-text .ttl:nth-child(2){
        display: block;
        font-size: 3em;
    }
    .main-cont .overlay .cont-text .ttl:nth-child(3){
        display: block;
        font-size: 3em;
    }
    .main-cont .overlay p {
        font-size: 1.3em !important;
    }
    .service-header .overlay {
        height: 120px !important;
    }
    .service-header .overlay h1 {
        margin-top: 20px !important;
        font-size: 2em !important;
    }
    .service-header .overlay p {
        font-size: 1.3rem !important;
    }
    .s-lists {
        margin: 20px !important;
    }
    header #head-cont-scr h1 {
        font-size: 2em;
    }
    .intro {
        padding: 20px;
    }
    .intro h1 {
        font-size: 2em;
        margin-bottom: 10px;
    }
    .intro-cont {
        flex-direction: column;
        width: 90%;
    }
    .intro .intro-cont p {
        font-size: 18px;
    }
    .intro .intro-cont img {
        margin-right: 0px;
    }
    .intro .serv-cont .cell {
        width: 90%;
        height: 200px;
    }
    .intro .serv-cont p {
        font-size: 18px;
    }


    .menu-mobile{
        display: block;
        position: absolute;
        top: 90px;
        left: -100%;
        opacity: 0;
        width: 65%;
        background-color: rgb(54, 70, 97);
        z-index: 1000;
        border: 2px solid white;
        transition: all 0.3s ease-in-out;
    }
    .menu-mobile *{
        
        transition: all 0.1s ease-in-out;
    }
    .menu-mobile a{
        display: block;
        padding: 10px 20px;
        color: white;
        font-size: 1.5em;
        text-decoration: none;
        border-bottom: 1px solid white;
    }
    .cont-username{
        margin: 10px ;
        padding: 5px !important;
    }
    .h{
        
        border-top: 1px solid white;
    }
    #user-nav{
        border:none;
        text-align: center;
        font-size: 2em;
        padding: 0px !important;
    }
    .menu-mobile ul li:nth-child(1){
        border: none;
    }
    .sub-trg .nav-el:hover{
        background-color: rgb(80, 95, 130);
    }
    .nav-elm:hover{
        background-color: rgb(80, 95, 130);
    }

    .menu-mobile ul li:nth-child(2){
    }

    .menu-mobile ul li:nth-child(3){
        border-bottom: none;
    }

    .menu-mobile ul{
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .menu-mobile .submenu{
        padding-left: 30px;
    }
    .menu-mobile .submenu a{
        border-left: 1px solid white;
    }
    .menu-mobile .submenu a:hover{
        background-color: rgb(80, 95, 130);
    }
    .menu-mobile .submenu a:nth-child(5){
        border-bottom: none;
    }

    .submenu{
        display: none;
    }
    .contacts{
        flex-direction: column !important;
    }
    .soc{
        width: 80% !important;
    }
    .soc-t::before,
    .soc-t::after {
        width: 4rem !important;
    }

    label {
        font-size: 1.2em !important;
    }
    .q-links h2,
    .socials h2{
        font-size: 1.2em !important;
    }
    footer a {
        font-size: 1.2em !important;
    }
    footer p {
        font-size: 1em !important;
    }
    .cont-user2 .main-title{
        font-size: 2em;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 10px;
    }
    .form-u{
        flex-direction: column !important;
        gap: 10px !important;
    }
    .custom{
        padding:0px !important;
    }
    .cont-user {
        height:auto !important;

    }
    .sepp{
        width:100% !important;
        height: 5px !important;
        border-radius: 10px !important;
        margin-top: 20px !important;
    }
    .edit-button{
        margin-bottom: 100px !important;
    }
    .fa-circle-notch{
        font-size: larger;
    }
    .cont-user2 {
        padding: 0px !important;
    }
    .intro .serv-cont .cells{
        grid-template-columns: repeat(1, 1fr); 
    }
    .q-links ul {
        padding-left: 40px;
    }
    .socials a {
        padding: 3px;
    }
}