@import '~assets/scss/_variables.scss';
.search-container {
    .left-panel {
        padding-left: 5px;
        .display-txt {
            opacity: 0.72;
            color: $text-dark-color;
            font-size: 12px;
            font-weight: 500;
            line-height: 24px;
            text-align: left;
            top: 5px;
        }
        .display-option {
            box-sizing: border-box;
            height: 37px;
            width: 74.85px;
            border: 1px solid rgba(0,0,0,0.08);
            border-radius: 2px;
            background-color: $default-white;
            box-shadow: 0 2px 4px 0 rgba(189,159,189,0.12);
            margin: 0;
        }
    }
    .right-panel {
        display: inline-flex;
        float: right;
        .list-icon {
            box-sizing: border-box;
            height: 37px;
            width: 37px;
            border: 1px solid rgba(0,0,0,0.08);
            border-radius: 2px;
            box-shadow: 0 2px 4px 0 rgba(189,159,189,0.12);
            margin: 0 15px 0 0;
            a .image {
                height: 17px;
                width: 17px;
                color: rgba(0,0,0,0.32);
                position: relative;
                top: 6px;
                right: 3px;
            }
            a .image:hover {
                color:$btn-blue;
            }
            a:active .image {
                color:$btn-blue;
            }
        }
       
        .search-box {
            box-sizing: border-box;
            height: 37px;
            width: 294px;
            border: 1px solid rgba(0,0,0,0.08);
            border-radius: 2px;
            background-color: $default-white;
            box-shadow: 0 2px 4px 0 rgba(189,159,189,0.12);
            padding-left: 15px;
            margin-right: 12px;
        }
        .search-icon {
            position: absolute;
            right: 32px;
            top: 7px;
        }
    }

}