@import url('https://fonts.googleapis.com/css?family=Rubik+Mono+One&display=swap&subset=cyrillic');
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed&subset=cyrillic');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@900&display=swap');





body{
width: 100vw;
height: 100vh;
background-image: url(../img/SVG/fonOut.svg);
background-repeat: no-repeat;
background-size: cover;
}

.out_header {
    width: 100%;
    max-width: 1223px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    /*! padding-bottom: 21px; */
    align-items: center;
    background-color: #fff;
    border-radius: 10px;
}

header {
    display: flex;
    flex-wrap: wrap;
    height: 54px;
    align-items: center;
    margin-top: 7px;
}

.menu menu-hover {
    border: none;
}

a {
    text-decoration: none;
}

h4 {
    margin: 5px;
    padding: 0;
}

.shapka {
    width: 100%;
    /* height: 160px; */
    background: url(../img/SVG/header-01.svg) no-repeat;
    margin-top: 5px;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    font-size: 1.5em;
    display: flex;
    background-color: #fff;
    /* padding: 10px; */
    border: 5px solid #fff;
    border-radius: 10px;
    background-size: cover;

}

.shapka h1 {
    text-align: left;
    padding-left: 20px;
    width: 100%;
    padding-top: 20px;
}

.shapka h1 span {
    color: #fff;
    font-size: 2em;
}

.shapka h2 {
    text-align: left;
    padding-left: 20px;
    color: #fff;
    font-size: 1.2em;
    padding-bottom: 20px;
}
.menu_centr{
    width: 100%;
    background-color: #fff;
    border-radius: 5px;
    color:#979A20;
    font: 1em Roboto Condensed;
    height: 30px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 10px;

}
.menu_centr li{
    list-style: none;
    text-align: right;

}
.menu_cenrt_icon_one{
    background-image: url(../img/SVG/arrows_right.svg);
    background-size: 8px;
    background-repeat: no-repeat;
    background-position-x: 13px;
    background-position-y: center;
    width: 86px;

}
.menu_centre_icon{
    background-image: url(../img/SVG/home.svg);
    background-size: 20px;
    background-repeat: no-repeat;
    background-position-x: 10px;
    background-position-y: center;
    width: 86px;

}
.menu_cenrt_icon_card, .menu_cenrt_icon_listovka, .menu_cenrt_icon_disk {
    background-image: url(../img/SVG/arrows_right.svg);
    background-size: 8px;
    background-repeat: no-repeat;
    background-position-x: 13px;
    background-position-y: center;
    width: 161px;

}
.menu_cenrt_icon_listovka{
    width: 178px;
}
.menu_cenrt_icon_disk{
    width: 189px;
}



.boxout {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    margin-top: 5px;
    font: 700 1.4em Roboto Condensed;
    margin: auto;
    margin-top: 10px;
    border-radius: 10px;
}

.boxout:hover {
    color: #fff;
}

.box {
    width: 300px;
    height: 300px;
    background: #fff;
    margin: 5px;
}

.boximage {
    width: 100%;
    height: 225px;
}

.boximageviz {
    background: url(../img/business-cards.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    color: #805c4d;
    justify-content: center;
    margin: 5px;
    background-color: #ffebad;
    padding: 10px;
    border-radius: 10px;
    border: 5px solid #fff;
}

.boximageviz:hover {
    background: url(../img/hover_business-cards.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    color: #fff;
    background-color: #979A20;
    justify-content: center;
    margin: 5px;
}

.boximagebags {
    background: url(../img/bags.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    color: #805c4d;
    justify-content: center;
    margin: 5px;
    background-color: #ffebad;
    padding: 10px;
    border-radius: 10px;
    border: 5px solid #fff;
}

.boximagebags:hover {
    background: url(../img/hover_bags.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    background-color: #979A20;
    color: #fff;
    justify-content: center;
    margin: 5px;
}

.boximagedisk {
    background: url(../img/disk.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    color: #805c4d;
    justify-content: center;
    margin: 5px;
    background-color: #ffebad;
    padding: 10px;
    border-radius: 10px;
    border: 5px solid #fff;
}

.boximagedisk:hover {
    background: url(../img/hover_disk.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    background-color: #979A20;
    color: #fff;
    justify-content: center;
    margin: 5px;

}

.boximagelistovki {
    background: url(../img/brochure.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    color: #805c4d;
    justify-content: center;
    margin: 5px;
    background-color: #ffebad;
    padding: 10px;
    border-radius: 10px;
    border: 5px solid #fff;
}

.boximagelistovki:hover {
    background: url(../img/hover_brochure.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    background-color: #979A20;
    color: #fff;
    justify-content: center;
    margin: 5px;
}

.boximagebox {
    background: url(../img/pack.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    color: #805c4d;
    justify-content: center;
    margin: 5px;
    background-color: #ffebad;
    padding: 10px;
    border-radius: 10px;
    border: 5px solid #fff;
}

.boximagebox:hover {
    background: url(../img/hover_pack.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    background-color: #979A20;
    color: #fff;
    justify-content: center;
    margin: 5px;
}

.boxrollup {
    background: url(../img/roll-up.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    color: #805c4d;
    justify-content: center;
    margin: 5px;
    background-color: #ffebad;
    padding: 10px;
    border-radius: 10px;
    border: 5px solid #fff;
}

.boxrollup:hover {
    background: url(../img/hover_roll-up.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    background-color: #979A20;
    color: #fff;
    justify-content: center;
    margin: 5px;
}

.boxplastikcard {
    background: url(../img/credit-card.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    color: #805c4d;
    justify-content: center;
    margin: 5px;
    background-color: #ffebad;
    padding: 10px;
    border-radius: 10px;
    border: 5px solid #fff
}

.boxplastikcard:hover {
    background: url(../img/hover_credit-card.svg);
    width: 225px;
    height: 160px;
    background-position: center 18px;
    background-size: 114px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    background-repeat: no-repeat;
    background-color: #979A20;
    color: #fff;
    justify-content: center;
    margin: 5px;
}


.logo {
    display: flex;
    flex-wrap: wrap;
    background: url(../img/SVG/logo_new-01.svg);
    width: 222px;
    height: 55px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: left;
    background-position-y: center;

}

.logo a {
    color: #979A20;
}

.textlogo {
    font-size: 1.2em;
}

.logotext {
    list-style: none;
    font-size: 2em;
    color: #fff;
}

.logotextone {
    list-style: none;
    font-size: 16px;
    color: #805c4d;
}

.logone {
    display: flex;
    flex-wrap: wrap;
    width: 200px;
    padding-left: 20px;
    height: 69px;
    margin: 0;
}

.log {
    width: 393px;
    margin: 0;
    align-items: center;
    font: 700 1em Roboto;
}

.phone {
    list-style: none;
    background-image: url(../img/smartphone.svg);
    background-repeat: no-repeat;
    color: #805c4d;
    width: 191px;
    background-size: 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background-position-x: 31px;
    background-position-y: center;
    justify-content: flex-end;
}

.mail {
    list-style: none;
    background-image: url(../img/mail.svg);
    background-repeat: no-repeat;
    color: #805c4d;
    width: 160px;
    background-size: 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background-position-x: 16px;
    background-position-y: center;
    justify-content: flex-end;
}

.mail a {
    color: #979A20;
}

li.mail a {
    color: #805c4d;
}

li.mail a:hover {
    color: #979A20;
}

.menu li {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    height: 34px;
    align-items: center;
}

.menu a {
    text-decoration: none;
    font: 700 16px Roboto Condensed;
    ;
    color: #805c4d;
    height: 100%;
}

.menu a:hover {
    color: rgb(151, 153, 13);
}

.b {
    background-image: url(../img/brochure.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 10px;
    background-position-y: center;
}

.b:hover {
    background-image: url(../img/hover_brochure.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 10px;
    background-position-y: center;
}

.card {
    background-image: url(../img/credit-card.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 7%;
    background-position-y: center;
}

.card:hover {
    background-image: url(../img/hover_credit-card.svg);
}

.roll-up {
    background-image: url(../img/roll-up.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 10px;
    background-position-y: center;
}

.roll-up:hover {
    background-image: url(../img/hover_roll-up.svg);
}

.bags {
    background-image: url(../img/bags.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 10px;
    background-position-y: center;
}

.bags:hover {
    background-image: url(../img/hover_bags.svg);
}

.disk {
    background-image: url(../img/disk.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 10px;
    background-position-y: center;
}

.disk:hover {
    background-image: url(../img/hover_disk.svg);
}

.business-cards {
    background-image: url(../img/business-cards.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 10px;
    background-position-y: center;
}

.business-cards:hover {
    background-image: url(../img/hover_business-cards.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 10px;
    background-position-y: center;
}

.pack {
    background-image: url(../img/pack_ico.svg);
    background-repeat: no-repeat;
    background-size: 26px;
    display: flex;
    background-position-x: 10px;
    background-position-y: center;
}

.pack:hover {
    background-image: url(../img/hover_pack_ico.svg);
}

body {
    margin: 0;
    background-color: #D7E2ED;
}

hr {
    padding: 0;
    margin: 0;
    color: #0C2465;
}

.prod {
    background: url(../img/printer.svg);
    background-repeat: no-repeat;
    background-size: 37px;
    background-position-x: left;
    background-position-y: center;
    width: 131px;
    padding-left: 10px;
    padding-right: 10px;
}

.prod:hover {
    background: url(../img/printer_hover.svg);
    background-size: 37px;
    background-position-x: left;
    background-position-y: center;
    background-repeat: no-repeat;
}

.sher {
    background: url(../img/plotter.svg);
    background-repeat: no-repeat;
    background-size: 37px;
    background-position-x: left;
    background-position-y: center;
    width: 184px;
    padding-left: 10px;
    padding-right: 10px;
}

.sher:hover {
    background: url(../img/plotter_hover.svg);
    background-repeat: no-repeat;
    background-size: 37px;
    background-position-x: left;
    background-position-y: center;
    width: 184px;
    padding-left: 10px;
    padding-right: 10px;
}

.disc {
    background: url(../img/compact-disc.svg);
    background-repeat: no-repeat;
    background-size: 37px;
    background-position-x: left;
    background-position-y: center;
    width: 143px;
    padding-left: 10px;
    padding-right: 10px;
}

.disc:hover {
    background: url(../img/compact-disc_hover.svg);
    background-repeat: no-repeat;
    background-size: 37px;
    background-position-x: left;
    background-position-y: center;
    width: 143px;
    padding-left: 10px;
    padding-right: 10px;
}

h1 {
    font: 800 1.2em Roboto;
    color: #ffff;
    margin: 0;
    text-align: center;
    word-spacing: 0px;
}

span {
    color: #805c4d;
}

h2 {
    font: 800 2em Roboto;
    color: #805c4d;
    margin: 0;
    word-spacing: 0px;
}

h3 {
    font: 700 1.3em Roboto Condensed;
    color: #979A20;
    margin: 0;
    word-spacing: 0px;
}

main {
    /*! width: 80vw; */
    max-width: 1223px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.viz_out_img {
    width: 100%;
    background-image: url(../img/SVG/bags_header-01.svg);
    margin-top: 5px;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    font-size: 1.5em;
    display: flex;
    background-color: #fff;
    height: 143px;
    border: 5px solid #fff;
    border-radius: 10px;
    background-size: cover;
}

.viz_out_img h1 {
    color: #fff;
    text-align: left;
    padding-left: 20px;
    font: 800 2.5em Roboto;
}

.viz_out_img h2 {
    color: #fff;
    text-align: left;
    padding-left: 20px;
    font: 24px Roboto;
}

.viz_out_img_pack {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background-image: url(../img/SVG/pack_header.svg);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    height: 143px;
    margin-top: 10px;
    color: #fff;
    text-align: left;
    padding-left: 20px;
    font: 18px Roboto;
    background-color: #fff;
    border: 5px solid #fff;
    border-radius: 10px;
}

.viz_out_img_rollup {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background-image: url(../img/SVG/rollup_header.svg);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    height: 143px;
    margin-top: 10px;
    color: #fff;
    text-align: left;
    padding-left: 20px;
    font: 18px Roboto;
    background-color: #fff;
    border: 5px solid #fff;
    border-radius: 10px;
}

.viz_out_img_viz {
    width: 100%;
    background: url(../img/SVG/viz_header-01.svg) no-repeat;
    margin-top: 5px;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    font-size: 1.5em;
    display: flex;
    background-color: #fff;
    height: 143px;
    border: 5px solid #fff;
    border-radius: 10px;
    background-size: cover;

}

.viz_out_img_viz h1 {
    color: #fff;
    text-align: left;
    padding-left: 20px;
    font-size: 2.5em;
}

    .viz_out_img_disk {
        width: 100%;
        margin-top: 5px;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
        display: flex;
        background-color: #fff;
        height: 143px;
        border: 5px solid #fff;
        border-radius: 10px;
        background-size: cover;
        background-image: url(../img/SVG/disk_headr-01.svg);
        font: 18px Roboto;
  
    }
    .vizout_listovki { 
        padding-left: 20px;
    }


    .viz_out_img_listovki {
        width: 100%;
        margin-top: 5px;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
        display: flex;
        background-color: #fff;
        height: 143px;
        border: 5px solid #fff;
        border-radius: 10px;
        background-size: cover;
        background-image: url(../img/SVG/leaflets_header-01.svg);

    }

    .viz_out_img_listovki h1,
    .viz_out_img_disk h1,
    .viz_out_img_pack h1,
    .viz_out_img_rollup h1,
    .viz_out_img_plastickarta h1 {
        color: #fff;
        text-align: left;
        font-size: 3em;
    }

    .viz_out_img_listovki h2,
    .viz_out_img_disk h2,
    .viz_out_img_pack h2,
    .viz_out_img_rollup h2,
    .viz_out_img_plastickarta h2 {
        color: #fff;
        text-align: left;
        font: 26px Roboto;
    }

    .viz_out_img_plastickarta {
        width: 100%;
        background-image: url(../img/SVG/card_header.svg);
        margin-top: 5px;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
        display: flex;
        background-color: #fff;
        height: 143px;
        border: 5px solid #fff;
        border-radius: 10px;
        background-size: cover;

    }


    .viz h2 {
        font: 700 2.2em Roboto;
        color: #805c4d;
        margin: 0;
    }

    .viz {
        /*! padding-top: 3vh; */

        padding-left: 10px;
        padding-right: 0;
        /*! background-color:#ffebad; */
        /*! padding-bottom: 20px; */
        padding-top: 10px;
        /*! padding: 10px; */
        /*! background: #ffebad; */
        /*! width: 100%; */
        height: 70px;
    }

    .enveloper_header {
        /*! padding-top: 3vh; */

        padding-left: 10px;
        padding-right: 0;
        /*! background-color:#ffebad; */
        /*! padding-bottom: 20px; */
        padding-top: 10px;
        /*! padding: 10px; */
        /*! background: #ffebad; */
        width: 100%;
        height: 70px;
    }

    .viz_enveloper {
        /*! background-color: #fff; */
        width: 100%;
        /*! height: 230px; */
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .viz_enveloper_two {
        background-color: #fff;

        width: 100%;
        height: auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .enveloper_ul {
        display: flex;
        flex-wrap: wrap;

        width: 100%;
        justify-content: flex-start;
        /*! height: 60px; */
        align-content: center;
    }

    .text {
        font: 400 1em Roboto;
        color: #333;
        margin: 0;
        padding-left: 20px;
    }

    table {
        width: 100%;
        border-spacing: 4px;
    }

    th {
        background-color: #979A20;
        color: #fff;
        font: 500 1.2em Roboto Condensed;
        width: 20vw;
        text-align: center;
        height: 3vh;
        border-radius: 5px;
    }

    td {
        background-color: #ffebad;
        color: #805c4d;
        font: 500 1.2em Roboto Condensed;
        width: 20vw;
        text-align: center;
        height: 3vh;
        border-radius: 5px;
    }

    p {
        font: 14px Roboto Condensed;
        display: flex;
        align-items: center;
        /*! margin: 10px; */
        padding-left: 38px;
        color: #805c4d;
        margin: 0;
        color: #fff;
        width: 500px;
    }

    /*----------------menu-------------*/
    #bar {
        list-style: none;
        margin: auto;
        padding: 0;
        max-width: 100%;
        display: flex;
        margin-top: 0px;
        flex-wrap: wrap;
        align-items: center;
        /*! height: 60px; */
        justify-content: center;
        height: auto;
        width: 100%;
    }

    #bar>li {
        float: left;
        position: relative;
        width: 175px;
        text-align: left;
        margin-top: 5px;
    }
    .menu_card{
        width: 175px;
    }


    #bar>li>a {
        color: #805c4d;
        display: block;
        margin-right: 0;
        padding: 11px 0 10px 43px;
        text-decoration: none;
        -webkit-transition: all 0.25s;
        background-color: #fff;
        width: auto;
        margin: 5px;
        border-radius: 5px;

    }

    #bar>li>:hover {
        background-color: #979A20;
    }

    #bar>li>a:hover {
        color: #fff;
    }

    #bar>li:after {
        background-color: #fff;
    }

    .menu .submenu {
        background: #fff;
        border-radius: 0px;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
        left: -47px;
        list-style: none;
        margin: 0;
        opacity: 0;
        padding: 0;
        position: absolute;
        top: 38px;
        -webkit-transition: all 0.25s;
        transition: all 0.25s;
        visibility: hidden;
        width: 218px;
    }

    .no-js .menu:hover .submenu,
    .menu-hover:hover .submenu,
    .menu-click.menu-active .submenu {
        opacity: 1;
        top: 100%;
        visibility: visible;
    }

    .menu .submenu:before,
    .menu .submenu::before {
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-bottom: 6px solid white;
        content: "";
        height: 0;
        left: 24px;
        position: absolute;
        top: -6px;
        width: 0;
    }

    .menu .submenu li {
        border-bottom: 1px solid #EBEBEB;
        padding: 7px 10px;
    }

    .menu .submenu li:last-child {
        border-bottom: none;
    }

    .menu .submenu a {
        color: #979A20;
        display: inline-block;
        line-height: 1.2em;
        padding: 5px 0;
        text-decoration: none;
    }

    .menu .submenu a:hover {
        color: rgb(255, 111, 97);
    }

    .menu-right .submenu {
        left: auto;
        right: -12px;
        text-align: right;
    }

    .menu-right .submenu:before,
    .menu-right .submenu::before {
        left: auto;
        right: 24px;
    }

    .menu1 {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        width: 998px;
    }

    .menu1 li {
        list-style: none;
        background: url(../img/height.png) no-repeat left center;
        list-style: none;
        padding-left: 31px;
        line-height: 28px;
    }

    .menu1 h6 {
        width: 100%;
        font-size: 19px;
        padding: 0;
        margin: 0;
    }

    h6 {
        width: 100%;
        font-size: 19px;
        padding: 0;
        margin: 0;
        font-variant: all-small-caps;
    }

    a {
        color: #fff;
    }


    ul {
        display: flex;
        flex-wrap: wrap;
        padding: 0;
        width: 100%;
        margin: 5px;
    }


    .enveloper_ul li {
        background: url(../img/SVG/icon-01.svg) no-repeat left center;
        list-style: none;
        padding-left: 31px;
        /*! line-height: 28px; */
        /*! width: 100%; */
        font-family: Roboto;
        color: #805c4d;
        align-content: center;
        align-items: center;
        background-size: 15px;
        width: 160px;
    }

    .textbox li {
        background: url(../img/SVG/icon-01.svg) no-repeat left center;
        list-style: none;
        padding-left: 31px;
        line-height: 28px;
        width: 360px;
        /*! color: #805c4d; */
        background-size: 20px;
    }

    .textbox_shelk li {
        background: url(../img/SVG/icon-01.svg) no-repeat left center;
        list-style: none;
        padding-left: 31px;
        line-height: 28px;
        width: 536px;
        background-size: 20px;
    }

    section {
        margin: 0;
        padding-bottom: 7vh;
        margin-bottom: 5vh;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        width: 1223px;
    }

    .out {
        margin-top: 5px;
        background-color: #fff;
        border-radius: 10px;
        margin-bottom: 5px;
    }

    .out a {
        color: #fff;
    }

    footer {
        height: 183px;
        width: 100%;
        background-color: #ffebad;
        display: flex;
        flex-grow: initial;
        flex-wrap: wrap;
        align-content: end;
        margin: auto;
    }

    #upbutton {
        background: url(../img/up-arrow.svg) no-repeat top left;
        height: 60px;
        width: 60px;
        bottom: 10%;
        right: 10%;
        cursor: pointer;
        display: none;
        position: fixed;
        z-index: 999;
    }

    .enveloper {
        background-image: url(../img/enveloper.png);
        height: 250px;
        background-repeat: no-repeat;
        background-position: center center;
        width: 300px;
        background-size: contain;
    }

    .enveloper_box {
        width: auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 100%;
    }

    .enveloper_H {
        /*! display: flex; */
        /*! flex-wrap: wrap; */
        justify-content: flex-end;
        /*! padding: 10px; */
        /*! color: #fff; */
        /*! width: 514px; */
        background: #ffebad;
        padding: 10px;
        height: 68px;
    }

    .enveloper_box_img {
        width: 373px;
        height: auto;
    }

    .enveloper_box_one {
        display: flex;
    }

    .enveloper_one_cd {
        width: 99%;
        height: 213px;
        background-image: url(../img/enveloper-01.svg);
        background-size: 225px;
        background-repeat: no-repeat;
        margin: 0;
        padding: 0;
        background-position-x: center;
        background-position-y: center;
        border-radius: 10px;
        background-color: #ffebad;
        border: 5px solid #fff;

    }

    .enveloper_two_cd {
        width: 99%;
        height: 213px;
        background-image: url(../img/enveloper_two_cd.svg);
        background-size: 314px;
        background-repeat: no-repeat;
        margin: 0;
        padding: 0;
        background-position-x: center;
        background-position-y: center;
        background-color: #ffebad;
        border: 5px solid #fff;
        border-radius: 10px;
    }

    .cddigipack {
        width: 99%;
        height: 213px;
        background-image: url(../img/cddigipack-01.svg);

        background-size: 311px;
        background-repeat: no-repeat;
        margin: 0;
        padding: 0;
        background-position-x: center;
        background-position-y: center;
        border-radius: 10px;
        border: 5px solid #fff;
        background-color: #ffebad;
    }

    .dvddigipack {
        width: 99%;
        height: 213px;
        background-image: url(../img/SVG/dvddigipack.svg);

        background-size: 311px;
        background-repeat: no-repeat;
        margin: 0;
        padding: 0;
        background-position-x: center;
        background-position-y: center;
        border-radius: 10px;
        border: 5px solid #fff;
        background-color: #ffebad;
    }

    .enveloper_box_out {
        width: 49%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-top: 5px;
        height: auto;
        background-color: #fff;
        border-radius: 10px;
        margin: 5px;
        min-width: 455px;
    }

    .fot {
        width: 100%;
        background-color: #805c4d;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        height: 200px;
    }


    .fotone {
        width: 100%;
        background-color: #ffebad;
        height: 1vh;
    }

    .table_size {}

    .size {}