@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap");a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}#app{font-family:"Roboto",sans-serif;color:#3C3C3C}#app-zone{padding-left:50px;padding-right:50px}.app-info{text-align:center;margin-top:50px;font-size:25px;}.app-loadzone{padding:50px 30px;border-radius:8px;background:#fff;-webkit-box-shadow:0 0 10px 3px rgba(0,0,0,0.1);box-shadow:0 0 10px 3px rgba(0,0,0,0.1);margin-top:30px;margin-bottom:50px}.app-loadzone__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:20px;}.app-loadzone__header h2{font-size:20px;margin-bottom:30px}.app-loadzone__result-container{margin-top:40px}.app-loadzone__result{display:-webkit-box;display:-ms-flexbox;display:flex}.app-loadzone__result:not(:last-child){margin-bottom:25px}.app-loadzone__image-overlay{border-radius:10px;background:#D9D9D9;width:300px;overflow:hidden}.app-loadzone__image-overlay img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;outline:none;border:none}.app-loadzone__actions{display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:10px}.app-loadzone__action{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:14px;cursor:pointer}.app-loadzone__action:hover{opacity:0.9}.app-loadzone__action span{margin-right:3px}.app-loadzone__action:not(:first-child){margin-left:10px}.app-loadzone__item{padding-left:25px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex}.app-loadzone__file-info{min-width:230px}.app-loadzone__info-section:not(:first-child){margin-left:30px}.app-loadzone__info-section.app-loadzone__info-section_fw{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.app-loadzone__name{font-size:16px;font-weight:bold;margin-bottom:12px;line-height:150%}.app-loadzone__ul{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.app-loadzone__li:not(:first-child){margin-top:12px}.app-loadzone__clipboard{padding:20px 15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;font-size:14px;background:#fff;-webkit-box-shadow:0 0 5px 2px rgba(0,0,0,0.1);box-shadow:0 0 5px 2px rgba(0,0,0,0.1);border-radius:7px;line-height:150%;cursor:pointer}.app-loadzone__clipboard span:nth-child(2){margin-left:15px}.btn{background:#08A652;color:#fff;border-radius:8px;outline:none;font-family:"Roboto",sans-serif;font-size:16px;font-weight:bold;padding:10px 15px;border:none;cursor:pointer;-webkit-transition:all 0.3s;transition:all 0.3s}.btn:hover{opacity:0.8}@media screen and (max-width:1024px){.app-loadzone{padding:30px 25px}.app-loadzone__result{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.app-loadzone__file-info{min-width:unset}.app-loadzone__image-overlay{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.app-loadzone__image{margin-bottom:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.app-loadzone__item{padding-left:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.app-loadzone__info-section:not(:first-child){margin-left:unset}.app-loadzone__info-section_fw .app-loadzone__name{margin-top:12px}.app-loadzone__clipboard{padding:17px 13px;font-size:14px}}progress{display:block;width:100%;transition:opacity 0.5s linear;}progress[value="1"]{opacity:0.5;}.log pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word;}
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap");a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}#app{font-family:"Roboto",sans-serif;color:#3C3C3C}#app-zone{padding-left:50px;padding-right:50px}.app-info{text-align:center;margin-top:50px;font-size:20px}.app-loadzone{padding:50px 30px;border-radius:8px;background:#fff;-webkit-box-shadow:0 0 10px 3px rgba(0,0,0,0.1);box-shadow:0 0 10px 3px rgba(0,0,0,0.1);margin-top:30px;margin-bottom:50px}.app-loadzone__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:20px;}.app-loadzone__header h2{font-size:20px;margin-bottom:30px}.app-loadzone__result-container{margin-top:40px}.app-loadzone__result{display:-webkit-box;display:-ms-flexbox;display:flex}.app-loadzone__result:not(:last-child){margin-bottom:25px}.app-loadzone__image-overlay{border-radius:10px;background:#D9D9D9;width:300px;overflow:hidden}.app-loadzone__image-overlay img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;outline:none;border:none}.app-loadzone__actions{display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:10px}.app-loadzone__action{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:14px;cursor:pointer}.app-loadzone__action:hover{opacity:0.9}.app-loadzone__action span{margin-right:3px}.app-loadzone__action:not(:first-child){margin-left:10px}.app-loadzone__item{padding-left:25px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex}.app-loadzone__file-info{min-width:230px}.app-loadzone__info-section:not(:first-child){margin-left:30px}.app-loadzone__info-section.app-loadzone__info-section_fw{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.app-loadzone__name{font-size:16px;font-weight:bold;margin-bottom:12px;line-height:150%}.app-loadzone__ul{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.app-loadzone__li:not(:first-child){margin-top:12px}.app-loadzone__clipboard{padding:20px 15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;font-size:14px;background:#fff;-webkit-box-shadow:0 0 5px 2px rgba(0,0,0,0.1);box-shadow:0 0 5px 2px rgba(0,0,0,0.1);border-radius:7px;line-height:150%;cursor:pointer}.app-loadzone__clipboard span:nth-child(2){margin-left:15px}.btn{background:#08A652;color:#fff;border-radius:8px;outline:none;font-family:"Roboto",sans-serif;font-size:16px;font-weight:bold;padding:10px 15px;border:none;cursor:pointer;-webkit-transition:all 0.3s;transition:all 0.3s}.btn:hover{opacity:0.8}@media screen and (max-width:1024px){.app-loadzone{padding:30px 25px}.app-loadzone__result{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.app-loadzone__file-info{min-width:unset}.app-loadzone__image-overlay{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.app-loadzone__image{margin-bottom:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.app-loadzone__item{padding-left:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.app-loadzone__info-section:not(:first-child){margin-left:unset}.app-loadzone__info-section_fw .app-loadzone__name{margin-top:12px}.app-loadzone__clipboard{padding:17px 13px;font-size:14px}}progress{display:block;width:100%;transition:opacity 0.5s linear;}progress[value="1"]{opacity:0.5;}.log pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word;}
.header {
    display: flex;
    align-items: center;
    margin: 2vh 2vw;
}

    .header img {
        width: 80px;
        height: 80px;
        background-size: cover;
        object-fit: cover;
        margin: 0 0;
        transition: 500ms;
    }

        .header img:hover {
            transform: scale(1.2);
            transition: 300ms;
        }

    .header h1 {
        font-size: 18px;
        font-weight: 400;
        margin: 0 0.2vw;
        text-align: center;
    }

        .header h1 p {
            font-size: 10px;
            margin: 0;
            color: #858585;
        }

#elem {
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
    /*border: 1px solid black;*/
    float: right;
    margin: 0 1.5%;
}

.save-button {
    margin-left: 10px; /* Добавляет отступ слева только для кнопок с классом save-button */
}

.instructions {
    text-align: center;
    margin: 20px;
    margin-top: 70px;
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #f8f8f8;
}

.instructions h3 {
    color: #08A652;
}

.instructions ul {
    margin-left: 20px;

    li {
        margin-bottom: 5px;
    }
}

.btn {
    cursor: pointer;
    /* Дополнительные стили для кнопок */
}

.btn:hover {
    opacity: 0.8;
}