﻿
    .chosen-container.chosen-container-single {
        width: 100% !important; /* or any value that fits your needs */
    }

    .chosen-single {
        width: 100% !important;
    }

    .chosen-search {
        width: 100% !important;
    }

    .chosen-drop {
        width: 91% !important;
    }

    .chosen-single chosen-default {
        width: 100%;
    }

    .Header {
        max-height: 115px;
        max-width: 750px;
        height: inherit !important;
    }

    .chosen-container chosen-container-single chosen-container-active {
        width: 274px;
    }

    

    .instructions {
        position: relative;
        height: 25px;
        width: 175px;
        margin: 20px auto;
        background: rgba(0, 0, 0, 0.25);
        border-radius: 3px;
        -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
        box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
    }

    .instructions-label {
        position: relative;
        z-index: 2;
        float: left;
        width: 58px;
        line-height: 26px;
        font-size: 11px;
        color: rgba(255, 255, 255, 0.35);
        text-align: center;
        text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
        cursor: pointer;
    }

        .instructions-label:active {
            font-weight: bold;
        }

    /*.switch-label-off {
      padding-left: 2px;
    }

    .switch-label-on {
      padding-right: 2px;
    }*/


    .instructions-input {
        display: none;
    }

        .instructions-input:checked + .instructions-label {
            font-weight: bold;
            color: rgba(0, 0, 0, 0.65);
            text-shadow: 0 1px rgba(255, 255, 255, 0.25);
            -webkit-transition: 0.15s ease-out;
            -moz-transition: 0.15s ease-out;
            -ms-transition: 0.15s ease-out;
            -o-transition: 0.15s ease-out;
            transition: 0.15s ease-out;
            -webkit-transition-property: color, text-shadow;
            -moz-transition-property: color, text-shadow;
            -ms-transition-property: color, text-shadow;
            -o-transition-property: color, text-shadow;
            transition-property: color, text-shadow;
        }

        .instructions-input:checked + .instructions-label-on ~ .instructions-selection {
            left: 60px;
            /* Note: left: 50%; doesn't transition in WebKit */
        }

    .instructions-selection {
        position: absolute;
        z-index: 1;
        top: 2px;
        left: 2px;
        display: block;
        width: 58px;
        height: 22px;
        border-radius: 3px;
        background-color: #65bd63;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9dd993), color-stop(100%, #65bd63));
        background-image: -webkit-linear-gradient(top, #9dd993, #65bd63);
        background-image: -moz-linear-gradient(top, #9dd993, #65bd63);
        background-image: -ms-linear-gradient(top, #9dd993, #65bd63);
        background-image: -o-linear-gradient(top, #9dd993, #65bd63);
        background-image: linear-gradient(top, #9dd993, #65bd63);
        -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
        -webkit-transition: left 0.15s ease-out;
        -moz-transition: left 0.15s ease-out;
        -ms-transition: left 0.15s ease-out;
        -o-transition: left 0.15s ease-out;
        transition: left 0.15s ease-out;
    }


    /*Ends Here*/


    /*EEEE*/






    /*ENDS HERE*/





    .wrapper {
        margin: 100px 0;
    }

    .switch {
        position: relative;
        height: 26px;
        width: 120px;
        margin: 20px auto;
        background: white;
        border-radius: 3px;
        -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
        box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
    }

    .switch-label {
        position: relative;
        z-index: 2;
        float: left;
        width: 58px;
        line-height: 26px;
        font-size: 12px;
        color: darkslategrey;
        text-align: center;
        /*text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);*/
        cursor: pointer;
    }

        .switch-label:active {
            font-weight: bold;
        }

    /*.switch-label-off {
      padding-left: 2px;
    }

    .switch-label-on {
      padding-right: 2px;
    }*/


    .switch-input {
        display: none;
    }

        .switch-input:checked + .switch-label {
            font-weight: bold;
            color: rgba(0, 0, 0, 0.65);
            text-shadow: 0 1px rgba(255, 255, 255, 0.25);
            -webkit-transition: 0.15s ease-out;
            -moz-transition: 0.15s ease-out;
            -ms-transition: 0.15s ease-out;
            -o-transition: 0.15s ease-out;
            transition: 0.15s ease-out;
            -webkit-transition-property: color, text-shadow;
            -moz-transition-property: color, text-shadow;
            -ms-transition-property: color, text-shadow;
            -o-transition-property: color, text-shadow;
            transition-property: color, text-shadow;
        }

        .switch-input:checked + .switch-label-on ~ .switch-selection {
            left: 60px;
            /* Note: left: 50%; doesn't transition in WebKit */
        }

    .switch-selection {
        position: absolute;
        z-index: 1;
        top: 2px;
        left: 2px;
        display: block;
        width: 58px;
        height: 22px;
        border-radius: 3px;
        background-color: #d1d1e0;
        /*background-color:black;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9dd993), color-stop(100%, #65bd63));
        background-image: -webkit-linear-gradient(top, #9dd993, #65bd63);
        background-image: -moz-linear-gradient(top, #9dd993, #65bd63);
        background-image: -ms-linear-gradient(top, #9dd993, #65bd63);
        background-image: -o-linear-gradient(top, #9dd993, #65bd63);
        background-image: linear-gradient(top, #9dd993, #65bd63);*/
        -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
        -webkit-transition: left 0.15s ease-out;
        -moz-transition: left 0.15s ease-out;
        -ms-transition: left 0.15s ease-out;
        -o-transition: left 0.15s ease-out;
        transition: left 0.15s ease-out;
    }



    /*import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro);
    *{
      margin:0px;
      padding:0px;
    }*/
    html {
        /*background: #497dd0;*/
    }
    /*.wrapper {
      margin: 100px 0;
    }*/
    .toggle_radio {
        /*position: relative;
      /*background: rgba(255,255,255,.1);*/
        /*background-color:blueviolet;*/
        background-color: rgba(0, 0, 0, 0.25);
        margin: 4px auto;
        overflow: hidden;
        /*padding: 0 !important;*/
        /*-webkit-border-radius: 50px;
      -moz-border-radius: 50px;*/
        /*border-radius: 50px;*/
        position: relative;
        height: 26px;
        width: 65%;
        -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
        box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
        */;
    }

        .toggle_radio > * {
            float: left;
        }

        .toggle_radio input[type=radio] {
            display: none;
            /*position: fixed;*/
        }

        .toggle_radio label {
            font: 90%/1.618 "Source Sans Pro";
            /*color:blue;*/
            z-index: 0;
            display: block;
            width: 100px;
            height: 20px;
            margin: 3px 3px;
            /*-webkit-border-radius: 50px;
      -moz-border-radius: 50px;*/
            border-radius: 50px;
            z-index: 1;
            color: rgba(255, 255, 255, 0.35);
            text-align: center;
            text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
            cursor: pointer;
        }

    .toggle_option_slider {
        /*display: none;*/
        /*background: red;*/
        /*width: 100px;
      height: 20px;
      position: absolute;
      top: 3px;
      -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
      border-radius: 50px;
      -webkit-transition: all .4s ease;
      -moz-transition: all .4s ease;
      -o-transition: all .4s ease;
      -ms-transition: all .4s ease;
      transition: all .4s ease;*/
        position: absolute;
        z-index: 1;
        top: 2px;
        left: 2px;
        display: block;
        width: 100px;
        height: 22px;
        border-radius: 3px;
        /*background-color: #65bd63;*/
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9dd993), color-stop(100%, #65bd63));
        background-image: -webkit-linear-gradient(top, #9dd993, #65bd63);
        background-image: -moz-linear-gradient(top, #9dd993, #65bd63);
        background-image: -ms-linear-gradient(top, #9dd993, #65bd63);
        background-image: -o-linear-gradient(top, #9dd993, #65bd63);
        background-image: linear-gradient(top, #9dd993, #65bd63);
        -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
        -webkit-transition: left 0.15s ease-out;
        -moz-transition: left 0.15s ease-out;
        -ms-transition: left 0.15s ease-out;
        -o-transition: left 0.15s ease-out;
        transition: left 0.15s ease-out;
    }

    #first_toggle:checked ~ .toggle_option_slider {
        /*background: rgba(255,255,255,.3);*/
        font-weight: bold;
        color: rgba(0, 0, 0, 0.65);
        text-shadow: 0 1px rgba(255, 255, 255, 0.25);
        -webkit-transition: 0.15s ease-out;
        -moz-transition: 0.15s ease-out;
        -ms-transition: 0.15s ease-out;
        -o-transition: 0.15s ease-out;
        transition: 0.15s ease-out;
        -webkit-transition-property: color, text-shadow;
        -moz-transition-property: color, text-shadow;
        -ms-transition-property: color, text-shadow;
        -o-transition-property: color, text-shadow;
        transition-property: color, text-shadow;
        left: 0px;
    }

    #second_toggle:checked ~ .toggle_option_slider {
        /*background: rgba(255,255,255,.3);*/
        font-weight: bold;
        color: rgba(0, 0, 0, 0.65);
        text-shadow: 0 1px rgba(255, 255, 255, 0.25);
        -webkit-transition: 0.15s ease-out;
        -moz-transition: 0.15s ease-out;
        -ms-transition: 0.15s ease-out;
        -o-transition: 0.15s ease-out;
        transition: 0.15s ease-out;
        -webkit-transition-property: color, text-shadow;
        -moz-transition-property: color, text-shadow;
        -ms-transition-property: color, text-shadow;
        -o-transition-property: color, text-shadow;
        transition-property: color, text-shadow;
        left: 109px;
    }

    #third_toggle:checked ~ .toggle_option_slider {
        /*background: rgba(255,255,255,.3);*/
        font-weight: bold;
        color: rgba(0, 0, 0, 0.65);
        text-shadow: 0 1px rgba(255, 255, 255, 0.25);
        -webkit-transition: 0.15s ease-out;
        -moz-transition: 0.15s ease-out;
        -ms-transition: 0.15s ease-out;
        -o-transition: 0.15s ease-out;
        transition: 0.15s ease-out;
        -webkit-transition-property: color, text-shadow;
        -moz-transition-property: color, text-shadow;
        -ms-transition-property: color, text-shadow;
        -o-transition-property: color, text-shadow;
        transition-property: color, text-shadow;
        left: 215px;
    }

    #fourth_toggle:checked ~ .toggle_option_slider {
        /*background: rgba(255,255,255,.3);*/
        font-weight: bold;
        color: rgba(0, 0, 0, 0.65);
        text-shadow: 0 1px rgba(255, 255, 255, 0.25);
        -webkit-transition: 0.15s ease-out;
        -moz-transition: 0.15s ease-out;
        -ms-transition: 0.15s ease-out;
        -o-transition: 0.15s ease-out;
        transition: 0.15s ease-out;
        -webkit-transition-property: color, text-shadow;
        -moz-transition-property: color, text-shadow;
        -ms-transition-property: color, text-shadow;
        -o-transition-property: color, text-shadow;
        transition-property: color, text-shadow;
        left: 321px;
    }


    .dropdown.dropdown-scroll .dropdown-menu {
        max-height: 200px;
        width: 60px;
        overflow: auto;
    }

    .search-control {
        padding: 5px 10px;
    }

    .grid1510636781396 .ui-grid-render-container-body .ui-grid-header-canvas {
        height: 55px;
    }
    /* width */
    ::-webkit-scrollbar {
        width: 8px;
    }

    /* Track */
    ::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px grey;
        border-radius: 10px;
    }

    /* Handle */
    ::-webkit-scrollbar-thumb {
        background: grey;
        border-radius: 10px;
        
    }

    ::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }

    /* Track */
    ::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px grey;
        border-radius: 10px;
    }

    /* Handle */
    ::-webkit-scrollbar-thumb {
        background: grey;
        border-radius: 10px;
        width:8px !important;
    }

    .chosen-container.chosen-container-single {
        width: 100% !important; /* or any value that fits your needs */
    }

    .grid {
        min-height: 250px;
        height: inherit !important;
    }

