﻿/*Styling Selectbox*/
.dropdown {
    /*width: 300px;*/
    width: inherit;
    display: inline-block;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 2px rgb(204, 204, 204);
    transition: all .5s ease;
    position: relative;
    font-size: 14px;
    color: #474747;
    /*height: 100%;*/
    text-align: left;
    outline: 0 !important;
}

    .dropdown .select {
        cursor: pointer;
        display: block;
        padding: 10px;
    }

        .dropdown .select > i {
            font-size: 13px;
            color: #1BBC9B;
            cursor: pointer;
            transition: all .3s ease-in-out;
            float: right;
            line-height: 20px;
        }

    .dropdown:hover {
        box-shadow: 0 0 4px rgb(204, 204, 204);
    }

    .dropdown:active {
        background-color: #f8f8f8;
    }

    .dropdown.active:hover,
    .dropdown.active {
        box-shadow: 0 0 4px rgb(204, 204, 204);
        border-radius: 5px 5px 0 0;
        background-color: #f8f8f8;
    }

        .dropdown.active .select > i {
            transform: rotate(-90deg);
        }

    .dropdown .dropdown-menu {
        position: absolute;
        background-color: #fff;
        width: 100%;
        left: 0;
        margin-top: 1px;
        box-shadow: 0 1px 2px rgb(204, 204, 204);
        border-radius: 0 1px 5px 5px;
        overflow: hidden;
        display: none;
        z-index: 9;
    }

        .dropdown .dropdown-menu li {
            padding: 10px;
            transition: all .2s ease-in-out;
            cursor: pointer;
        }

    .dropdown .dropdown-menu {
        padding: 0;
        list-style: none;
    }

        .dropdown .dropdown-menu li:hover {
            background-color: #e7fcf7;
        }

        .dropdown .dropdown-menu li:active {
            background-color: #7cefd3;
        }
