﻿@media screen and (min-width:769px)
{
    .Popup_Body
    {
        min-width: 350px;
        max-width: 100%;
        top: 290px !important;
    }
}
@media screen and (min-width:500px) and (max-width:769px)
{
    .Popup_Body
    {
        min-width: 350px;
        max-width: 500px;
        top: 290px !important;
    }
}

@media (max-width:925px)
{
    /*************************************************
                             Main
    *************************************************/
                                    
    ul
    {
        margin: 0px;
        padding: 0px;
    }

    li
    {
        list-style: none;
    }

    .Clear_Mobile
    {
        clear: both;
    }

    .Clear_Only_In_Web
    {
        clear: none;
    }

    .Float_Left
    {
        float: left;
    }

    /*************************************************
                                                                Label Style
                                            *************************************************/
    .Title_Main
    {
        color: #7e2e83;
        font: 30px 'Century Gothic';
        float: left;
        margin: 0px 0px 5px 5px;
        text-align: left;
    }

    .Title_Sub
    {
        box-sizing: border-box;
        border: 0.5px solid transparent;
        color: #7e2e83;
        float: left;
        font-family: 'Century Gothic';
        font-size: 20px;
        height: 26px;
        margin: 0px 0px 0px 5px;
        padding: 0px 0px 0px 0px;
        text-align: left;
    }

    .Label_Title
    {
        border: 0.5px solid transparent;
        box-sizing: border-box;
        font-family: 'Century Gothic';
        font-size: 14px; /*height: 25px;         line-height: 25px;         min-height: 25px;*/
        line-height: 26px;
        margin: 0px 2px 2px 2px;
        padding: 0px 2px;
        text-align: left;
    }

    .Label_Value
    {
        border: 0.5px solid #aaaaaa;
        box-sizing: border-box;
        font-family: 'Century Gothic';
        font-size: 14px;
        height: auto;
        margin: 3px 5px 5px 5px;
        min-height: 25px;
        padding: 4px 2px 0px 5px;
        text-align: left;
    }

    .Label_Value[disabled="disabled"]
    {
        background-color: #ebebe4;
    }

    /*************************************************
                                                         Collapsible Panel
                                        *************************************************/
    .Collapsible_Header
    {
        background-color: #e2cfeb;
        box-sizing: border-box;
        border: 0.5px solid #e2cfeb;
        color: #963688;
        float: left;
        font-family: 'Century Gothic';
        font-size: 20px;
        height: 27px;
        text-align: center;
        width: 95%;
    }

    .Collapsible_Panel
    {
        border: 1px solid #e2cfeb;
        box-sizing: border-box;
        float: left;
        margin: 0px 5px 0px 5px;
        max-width: 95%;
        padding: 2px;
        position: static;
        width: 95%;
    }

    .Collapsible_Image
    {
        height: 26px;
        margin: 0px;
        position: relative;
    }

    /*************************************************
                                               Container
                            *************************************************/
    .Box_With_Title fieldset
    {
        border: 1px solid #aaaaaa; /*border-radius: 5px;*/
        padding: 0px 5px 0px 5px; /*width: 95%;*/ /* max-width: 95%;*/
    }

    .Box_With_Title legend
    {
        color: #7e2e83;
        font-family: 'Century Gothic';
        font-weight: bold;
        font-size: 14px;
        height: 14px;
    }

    .Div
    {
        /*border: 0.5px solid #aaaaaa; */
        float: left;
        max-width: 100%;
    }

    .Div_Display_Only_In_Web
    {
        display: none;
    }

    .Box_With_Title
    {
        /*border: 0.5px solid #aaaaaa; */
        float: left;
        padding: 0px 0px 0px 5px;
        margin: 0px 0px 5px 0px;
        max-width: 100%;
    }

    .Box
    {
        border: 0.5px solid #aaaaaa;
        float: left;
        margin: 3px;
        padding: 3px;
    }

    .Box_Scroll
    {
        /*border: 0.5px solid #aaaaaa; */
        float: left;
        min-height: 10px;
        overflow: auto;
        position: static;
        width: 100%;
    }


    /*************************************************
                                                               Component
                                        *************************************************/
    .Button
    {
        background-color: White;
        border: 1px solid #a65aa4;
        box-sizing: border-box;
        color: #7e2e83;
        cursor: pointer;
        float: left;
        font-family: 'Century Gothic';
        font-size: 14px;
        height: 25px;
        margin: 3px;
        padding: 0px 5px;
    }

    .Button:hover
    {
        border: 2px solid #5F3761;
        cursor: pointer;
    }

    .Button:disabled, .Button[disabled]:hover
    {
        background-color: #ebebe4;
        border: 0.5px solid #aaaaaa;
        color: #545454;
        cursor: auto;
    }

    .Button_Selected
    {
        background-color: #a65aa4;
        border: 1px solid #5F3761;
        box-sizing: border-box;
        color: White;
        float: left;
        font-family: 'Century Gothic';
        font-size: 14px;
        height: 26px;
        margin: 3px;
        padding: 0px 5px 0px 5px;
    }

    .CheckBox input[type="checkbox"]
    {
        margin: 3px 3px 2px 3px;
    }

    .CheckBox span
    {
        float: left;
    }

    .CheckBox label
    {
        /*display: inline;*/
        font-family: 'Century Gothic';
        font-size: 14px;
    }

    .CheckBox
    {
        margin: 0px 0px 5px 5px;
        padding: 5px 5px 0px 0px;
    }

    .CheckBox
    {
        display: inline-block;
    }

    .CheckBox label
    {
        line-height: 31px;
    }

    .CheckBoxList
    {
        display: inline-block;
        margin: 5px;
    }

    .CheckBoxList input[type="checkbox"]
    {
        margin: 0px 3px 5px 3px;
    }

    .CheckBoxList label
    {
        /*display: inline;*/
        font-family: 'Century Gothic';
        font-size: 15px;
    }

    .DropDownList
    {
        border: 0.5px solid #aaaaaa;
        font: 14px 'Century Gothic';
        height: 26px;
        margin: 3px;
        padding: 0px;
    }

    .DropDownList:disabled
    {
        background-color: #ebebe4;
    }

    .DropDownList ul
    {
        /*overflow: scroll;*/
    }

    .ImageButton
    {
        float: left;
        height: 25px;
        margin: 5px 0px 2px 5px;
        padding: 0px;
    }

    .RadioButton input[type="radio"]
    {
        margin: 4px 5px 10px 5px;
    }

    .RadioButton label
    {
        /*display: inline;*/
        border: 0.5px solid transparent;
        box-sizing: border-box;
        font-family: 'Century Gothic';
        font-size: 14px;
        height: 26px;
        margin: 5px 0px 5px 0px;
        padding: 4px 5px 0px 0px;
        text-align: right;
    }

    .TextBox
    {
        border: 0.5px solid #aaaaaa;
        box-sizing: border-box;
        font-family: 'Century Gothic';
        font-size: 14px;
        height: 25px;
        margin: 0px 5px 5px 5px;
        min-height: 20px;
        padding: 2px 5px;
    }

    .CheckBoxList td
    {
        font: 15px 'Century Gothic';
        height: 15px;
        padding: 0px;
    }

    .TreeView
    {
        font: 14px 'Century Gothic';
        margin: 4px;
        padding: 0px 5px 0px 0px;
    }

    .TreeView_Root a
    {
        color: #7e2e83;
        font: 14px 'Century Gothic';
        font-weight: bold;
    }

    .TreeView_Parent a
    {
        color: #0A47C2;
        font: 14px 'Century Gothic';
    }

    .TreeView_Leaf a
    {
        color: #00aa00;
        font: 14px 'Century Gothic';
    }

    .TreeView_SelectedNode
    {
        background-color: #c6ddff;
        border: solid 1px #71a9ff;
        display: block;
        text-decoration: none;
    }

    .Div_NumericUpDownExtender td
    {
        font-size: 0;
        padding: 0px;
    }

    .Div_NumericUpDownExtender tr
    {
        font-size: 0;
        padding: 0px;
    }

    /****************************************************
                                                             GridView_Ext
                                        ****************************************************/
    .GridView
    {
        border: 0.5px solid #808080;
        margin: 5px;
    }
}
