.wrapper {
    background: url(../images/bg.jpg) no-repeat top center;
    background-size: cover;
    height: 100vh;
}

.mob-banner {
    display: none;
}

.intro-text {
    padding-left: 50px;
    max-width: 100%;
}

p {
    margin: 0;
    padding: 0;
}

hr {
    width: 100%;
    display: none;
}

/*-------- button -----------*/
.content {
    position: relative;
    min-height: calc(100vh - (120px + 227px));
    display: flex;
    align-items: flex-end;
}

.button-box {
    width: 100%;
    min-height: 221px;
    text-align: center;
    position: relative;
    display: block;
}

.btn-dk {
    position: absolute;
    top: 30%;
    right: 50%;
    transform: translateX(17%);
}

.btn-dn {
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translateX(-17%);
}

.button-box a img {
    max-width: 100%;
}

/*-------- end button -----------*/
/*-------- steps -----------*/
.steps-container {

    padding: 0 10px;
    background: rgb(4, 4, 4);
    background: linear-gradient(0deg, rgba(4, 4, 4, 1) 0%, rgba(0, 31, 24, 1) 21%, rgba(1, 45, 36, 1) 52%, rgba(0, 31, 24, 1) 80%, rgba(0, 0, 0, 1) 100%);
}

.steps-box {
    width: 1355px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 120px;
}

.steps-box div {
    display: flex;
}

.num {
    margin-right: 10px;
}

.letter {
    max-width: 100%;
}

.first-step {
    display: block;
    color: white;
    font-size: 16px;
}

.first-step img {
    margin-bottom: 10px;
}

.first-step p {
    margin-left: 15px;
    margin-top: -10px;
}

/*--------end steps -----------*/
.mob {
    display: none;
}

@media (max-width:1360px) {

    hr {
        display: block;
    }

    .steps-box {
        width: 100%;
        flex-direction: column;
        padding: 10px 0;
    }

    .steps-box div {
        width: 400px;
    }

    .steps-container {
        background: rgb(4,4,4);
background: linear-gradient(0deg, rgba(4,4,4,1) 0%, rgba(0,42,32,1) 2%, rgba(1,45,36,1) 52%, rgba(0,36,28,1) 98%, rgba(0,0,0,1) 100%);
    }
}

@media (max-width: 767px) {
    .mob {
        display: block;
        max-width: 100%;
    }

    .desk {
        display: none;
    }

    .wrapper {
        background: #052819;
        height: unset;
    }

    .btn-dk,
    .btn-dn {
        top: 15%;
        transform: translateX(0%);
    }

    .num {
        width: 75px;
        height: 75px;
    }

    .letter {
        width: 200px;
    }

    .steps-box div {
        width: 310px;
    }
}

@media (max-width: 600px) {

    .button-box {
        min-height: 100px;
    }
}