/*  Sets styles for index header  */
/* -----------------------------  */

/* Header for index page */

.o_header_index {
    position: relative;
    padding-top: 15%;
    min-height: 100vh;
    background-size: 150%;
    z-index: 1;
    overflow: hidden;
}

.o_header_404 {
    position: relative;
    height: 100vh;
    background: url('../../img/pics/error-404.jpg') left center no-repeat;
    background-size: 105%;
    z-index: 1;
    overflow: hidden;
}

.o_header_index::before,
.o_header_404::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--eco-black);
    opacity: 0.5;
    z-index: -1;
}

.o_header_mark {
    display: block;
    width: 100px;
    height: 100px;
    /* background: url('../../img/svg/mark_white.svg') center no-repeat; */
    /* background-size: cover; */
}

.o_header_mark img {
    width: 100%;
    height: auto;
}

.o_header_info {
    width: 40%;
    position: relative;
    top: 25%;
    text-align: center;
}

.o_header_info a {
    display: block;
}

@media only screen and (max-width: 600px) {

    .o_header_index {
        position: relative;
        background: url('../../img/pics/index-bg.jpg') center no-repeat;
        background-size: cover;
        padding: 25% 0 10% 0;
        z-index: 1;
        min-height: 100vh;
        overflow: hidden;
    }

    .o_header_index::before,
    .o_header_404::before {
        height: 100%;
    }

    .o_header_info {
        width: 90%;
        position: relative;
        text-align: center;
    }

    .o_header_404 {
        position: relative;
        background: url('../../img/pics/error-404.jpg') center no-repeat;
        padding: 0;
        background-size: cover;
        z-index: 1;
        min-height: 100vh;
        overflow: hidden;
    }

}


@media only screen and (min-width: 600px) and (max-width: 1200px) {

    .o_header_index {
        position: relative;
        background: url('../../img/pics/index-bg.jpg') center no-repeat;
        background-size: cover;
        padding: 20% 0 5% 0;
        z-index: 1;
        min-height: 60vh;
        overflow: hidden;
    }

    .o_header_index::before,
    .o_header_404::before {
        height: 100%;
    }

    .o_header_info {
        width: 80%;
        position: relative;
        text-align: center;
    }

    .o_header_404 {
        position: relative;
        background: url('../../img/pics/error-404.jpg') left center no-repeat;
        background-size: 105%;
        padding: 20% 0 5% 0;
        z-index: 1;
        min-height: 60vh;
        overflow: hidden;
    }

}