@media (min-width: 100px){
    body{
        font-family: arial;
        margin: 0; 
        color:rgb(254, 254, 254);
    }
    .str1{
        background-image: url("img/doska.jpg");
        background-size:cover;
        width: 100vw;
        height: max-content;
        padding-top: 3vh;
    }
    a{
        color: rgb(254, 254, 254);
        text-decoration: none;
    }
    a:hover{
        color: #f77519;
    }
    .menu{
        z-index: 1;
        position: fixed;
        margin-top: -13vw;
    }
    #ul-menu{
        font-size: 1.2rem;
        margin: 0;
        text-align: center;
    }
    .li-menu{
        display: inline-block;
        margin: 0 2vw;
    }
    .a-div{
        padding: 5px 0;
        width: 115px;
        margin-top: 8px;
        background-color: rgb(61, 61, 61);
        border-width: 2px;
        border-style: solid;
        border-color:rgb(254, 254, 254); 
        border-radius: 5vw;
    }
    a.li-menu{
        text-decoration:none;
    }
    a:hover{
        color:#f77519;
    }
    .title{
        font-family:SEGOE PRINT;
        text-align: center;
    }
    h2{
        font-family:SEGOE PRINT;
    }
    .text1{
        width: max-content;
        height: 128vw;
        margin-top: -10px;
        margin:0 1vw;
        font-size: 4vw;
    }
    .blok11{
        margin: 0 10px;
    }
    .jpg11{
        background-image: url("img/programmist.PNG");
        background-size:cover;
        width:46vw;
        height: 46vw;
        float: left;
        border-radius: 17px 0 0 17px;
    }
    .text11{
        background-color: rgba(3, 28, 255, 0.253);
        width:46vw;
        height: 68vw;
        float: left;
        border-radius: 0 17px 17px 0;
    }
    .blok12{
        margin: 0 10px;
        margin-top: 1vh;
    }
    .text12{
        background-color: rgba(3, 28, 255, 0.253);
        width:46vw;
        height: 68vw;
        float: left;
        margin-top: -14vw;
        border-radius: 17px 0 0 17px;
    }
    .jpg12{
        background-image: url("img/stroitel.PNG");
        background-size:cover;
        width:46vw;
        height: 46vw;
        float: left;
        margin-top: 8vw;
        border-radius: 0 17px 17px 0;
    }
    .str2{
        width: 100vw;
        height: min-content;
    }
    .jpg21{
        background-image: url("img/professii.PNG");
        background-size: cover;
        width: 100vw;
        height: 55vw;
        margin-top: -1px;
    }
    .text21{
        font-family:SEGOE PRINT;
        font-size: 6vw;
        float: left;
        margin: -30vw 5vw 0 5vw;
    }
    .str3{
        background-image: url("img/doska.jpg");
        background-size:cover;
        color: #f77519;
        width: 100vw;
        height: min-content;
    }
    .blok3{
        background-color: rgba(0, 0, 0, 0.616);
        padding: 3vh 0;
        height: 100%;
    }
    .text3{
        font-size: 3vw;
    }
    .zgl{
        margin-top: 5vh;
    }
    .win-p{
        width:fit-content;
        margin-bottom: 5px;
        padding: 0 12px;
        border-style:dotted none;
        border-radius:10px;
        border-width: 2px;
        border-color: rgb(254, 254, 254);
    }
    .p{
        padding-left: 9px;
        display: inline;
    }
    .str4{
        background-color: rgba(0, 0, 0, 0.445);
        padding-top: 5px;
        color: #444343;
        width: 100vw;
        height: min-content;
    }
    .sss{
        background-color:rgba(254, 254, 254, 0.486) ;
        width: 50vw;
        border-radius: 3px;
        padding: 10px;
        font-size: 4vw;
        margin: 5px;
        border-style: solid;
        border-width: 2px;
        border-color: #f77519;
    }
    #position{
        margin-top:8px ;
    }
    summary{
        font-weight: 800;
        text-decoration: underline;
        text-decoration-thickness: 2px ;
        text-decoration-color:#f77519;
    }
    .doc{
        background-color:#5e5e5e;
        width: fit-content;
        margin:5px;
        padding: 0 5px;
        border-style: solid;
        border-width: 1px;
        border-radius: 5px;
        border-color: #f77519;
    }
    details a:hover{
        color: transparent;
        background-image: linear-gradient(90deg, rgb(255, 0, 0), rgb(255, 196, 0), rgb(208, 255, 0), rgb(47, 128, 0), rgb(0, 174, 255), rgb(0, 47, 255), rgb(140, 0, 255),#f77519 );
        -webkit-background-clip: text;
        background-clip: text;
        background-size: 100px 100px;
        background-position: 0 0;
        animation: bp 2s infinite linear;
    }
    .text42{
        width: 100vw;
        height: min-content;
        background-image: url("img/haker.PNG");
        background-size: cover  ;
    }
    #ps{
        font-size: 4vw;
        width: 96vw;
        height: 68vw;
        background-color:rgba(3, 3, 3, 0.541);
        color: rgb(254, 254, 254);
        margin-top: 10px;
        padding: 2vw;
    }
    #ps big{
        color: red;
    }
    #pohta{
        height: min-content;
        width: max-content;
        background-color:rgb(255, 0, 0) ;
        border-radius: 14px;
        padding: 1vh 5vw;
    }
    #pohta a{
        color: rgb(255, 255, 255);
    }
}
@media (min-width: 375px){
    .li-menu{
        margin: 0 5vw;
    }
    .menu{
        margin-top: -6vh;
    }
}
@media (min-width: 667px){
    .str1{
        padding-top: 12vw;
    }
    .text1{
        font-size: 3vw;
    }
    .text11{
        height: 55vw;
    }
    .blok12{
        margin: 0 10px;
        margin-top: 1vh;
    }
    .text12{
        height: 55vw;
        margin-top: -3vw;
    }
    .jpg12{
        margin-top: 6vw;
    }
    .blok10{
        margin-top: -12vw;
    }
    .menu{
        margin-top: -2vw;
    }
    .title{
        margin-top: -5vw;
        margin-left: 50vw;
        font-size: 2vw;
    }
    .sss{
        width: 40vw;
        font-size: 2vw;
    }
}
@media (min-width: 1024px){
    .text1{
        height: 75vw;
        font-size: 2vw;
    }
    .blok11{
        margin: 0 10px;
    }
    .jpg11{
        width:28vw;
        height: 28vw;
    }
    .text11{
        width:28vw;
        height: 39vw;
        float: left;
    }
    .blok12{
        margin: 0 10px;
        margin-top: 1vh;
    }
    .text12{
        width:28vw;
        height: 39vw;
        margin-top: -7vw;
    }
    .jpg12{
        width:28vw;
        height: 28vw;
        margin-top: 4vw;
    }
}
@media (min-width: 1440px){
    .menu{
        margin-top: -3vw;
    }
    .li-menu{
        margin: 0 2vw;
    }
    #ul-menu{
        font-size: 1.5rem;
    }
    .a-div{
        padding: 10px 0;
        width: 170px;
        margin-top: 15px;
        border-width: 4px;
    }
    .text3{
        font-size: 2vw;
        border-radius: 10px;
    }
    .win-p{
        border-width: 3px;
    }
    #pohta{
        font-size: 3vw;
        height: min-content;
        width: max-content;
        background-color:rgb(255, 0, 0) ;
        border-radius: 2vw;
        padding: 1vh 5vw;
    }
}
@media (min-width: 2560px){
    .menu{
        margin-top: -3vw;
    }
    #ul-menu{
        font-size: 2vw;
    }
    .a-div{
        width: 12vw;
    }
}