/*---------------------
  Hero
-----------------------*/
.hero {
    padding: 300px 0;
}

.hero__text {

    .section-title {

        h2 {
            color: $white-color;
        }

        p {
            color: #A8A8A8;
        }
    }

    .hero__categories__tags {
        text-align: center;

        li {
            list-style: none;
            display: inline-block;
            margin-right: 5px;

            &:last-child {
                margin-right: 0;
            }

            a {
                font-size: 15px;
                color: $white-color;
                padding: 10px 25px 10px 20px;
                display: block;
                border: 1px solid #ebebeb;
                margin-bottom: 10px;

                img {
                    margin-right: 5px;
                }
            }
        }
    }
}

.hero__search__form {
    margin-bottom: 30px;
    background: rgba(255, 255, 255, 0.1);
    padding: 20px;
    border-radius: 5px;

    form {

        input {
            width: 40%;
            float: left;
            font-size: 15px;
            color: #A8A8A8;
            padding-left: 30px;
            height: 54px;
            border: none;

            &::placeholder {
                color: #A8A8A8;
            }
        }

        .select__option {
            position: relative;
            width: 22.5%;
            float: left;
            height: 54px;

            &:before {
                position: absolute;
                left: 0;
                top: 0;
                height: 100%;
                width: 1px;
                background: #eeeeee;
                content: '';
                z-index: 1;
            }

            .nice-select {
                width: 100%;
                border: none;
                border-radius: 0;
                height: 54px;
                line-height: 56px;

                span {
                    font-size: 15px;
                    color: #323232;
                }

                .list {
                    border-radius: 0;
                    margin-top: 0;
                    width: 100%;
                }
            }

            .nice-select:after {
                border-right: 7px solid #183456;
                border-top: 7px solid transparent;
                height: 6px;
                margin-top: 0;
                right: 18px;
                width: 10px;
                border-bottom: none;
                top: 40%;
            }
        }

        button {
            width: 15%;
            height: 54px;
            border: none;
            font-size: 14px;
            font-weight: 700;
            background: $primary-color;
            color: $white-color;
            text-transform: uppercase;
        }
    }
}