﻿body {
}


        /*Style for the two root elements of the two grids*/
#mv_Users {

    position: absolute;
    top: 30px;
    left:10px;
}

#mv_Items {
    position: absolute;
    top: 350px;
    left: 10px;
}

.mv_Root {
    font-family:Arial;
    background-color: #EEEEEE;
}

 /*Grid Table Properties*/
.mv_Table {
    border-spacing: 0px;
    overflow:hidden;
    background-color:#EEEEEE;
    box-shadow: 5px 5px 10px #AAAAAA;
}

 /* Header Properties */
.mv_HeaderRow {
    height: 30px;
    background-color: #777777;
}

.mv_HeaderCell {
    border: 2px solid #555555;
    border-radius:3px;
    padding: 3px;
    text-align: center;
    font-size: 15px;
    font-weight:bold;
    color:white;
}

/* Table Body Properties - Row and Cell elements*/
.mv_Row {
    height: 28px;
}

.mv_Row:nth-child(even) {
}

.mv_Row:nth-child(odd) {
  background-color: #DDDDDD;
}

.mv_Cell {
    border: 1px solid #888888;
    border-radius:3px;
    padding: 3px;
    text-align: center;
    font-size: 14px;
    color:#333333;
}

/* Footer Properties */
.mv_FooterRow {
    height: 40px;
    border-radius:3px;
}

.mv_FooterCell {
}

/*  Navigation Properties */
.mv_AddNew {
    float:right;
    border: 1px solid #888888;
    border-radius:3px;
    height:26px;

}

.mv_Paging{
    border:1px solid #DDDDDD;

}

.mv_NavigationLink {
    display: inline-block;
    text-decoration: none;
    text-align:center;
    width:18px;
    padding:5px;
    font-size:15px;
    color: #333333;
}

.mv_NavigationLink:hover {
    background-color: #888888;
    color: #FFFFFF;
    border-radius: 4px;
}

.mv_NavigationCurrentPage {
    display: inline-block;
    width: 18px;
    padding: 5px;
    font-size: 16px;
    text-decoration: none;
    text-align: center;
    background-color: #444444;
    color: #FFFFFF;
    border-radius: 4px;
}

.mv_CellLink {
    color: red;
    text-decoration-line: underline;
    text-decoration-color: red;
    padding: 5px;
}

.mv_CellLink:hover {
    background-color: #888888;
    color: #FFFFFF;
    border-radius: 4px;
}



.mv_Error {
    position: absolute;
    top: -20px;
    left: 0px;
    background-color: Red;
    padding: 3px;
    color: white;
    display: none;
    min-width: 180px;
}

    /*JSON Record PopUp CSS*/
    /* Css for the popUp div if you use a link to the JSON Record PopUp function and associated div */
    #mv_PopUp_JsonRecord {
        padding: 10px;
        background-color: white;
        width: 340px;
        height: 340px;
        vertical-align: middle;
        border-radius: 10px;
        font-family: Arial;
        font-size: 14px;
        color: #444444;
    }

    /*User Form CSS*/
    /* Css for the popUp div if you use a link */
    #GridPopUp_User {
        padding: 10px;
        background-color: white;
        width: 340px;
        height: 340px;
        vertical-align: middle;
        border-radius: 10px;
        font-family: Arial;
        font-size: 14px;
        color: #444444;
        display: none;
        box-shadow: 5px 5px 20px #CCCCCC;
    }

    #btnSubmit_User {
        position: absolute;
        top: 320px;left:20px;
        width: 110px;
    }

    div[id^="divLabelUser_"] {
        position: absolute;
        left: 20px;
        width: 100px; height: 22px;
        text-align: right;
        padding-top: 4px; padding-right: 10px;
        overflow: hidden;
        display: table-cell;
        vertical-align: middle;
        border: 1px solid #DDDDDD;
        border-radius: 3px;
        background-color: #EEEEEE;
    }

    #divLabelUser_0 { top: 20px; }
    #divLabelUser_1 { top: 50px; }
    #divLabelUser_2 { top: 80px; }
    #divLabelUser_3 { top: 110px; }
    #divLabelUser_4 { top: 140px; }
    #divLabelUser_5 { top: 170px; }
    #divLabelUser_6 { top: 200px; }
    #divLabelUser_7 { top: 230px; }
    #divLabelUser_8 { top: 260px; }
    #divLabelUser_9 { top: 290px; }

    [id^="divDataUser_"] {
        position: absolute;
        left: 135px;
        width: 200px;
        height: 22px;
        overflow: hidden;
        padding-left: 5px;
        border:1px solid #999999;
        border-radius: 3px;
    }

    #divDataUser_0 { top: 20px; }
    #divDataUser_1 { top: 50px; }
    #divDataUser_2 { top: 80px; }
    #divDataUser_3 { top: 110px; }
    #divDataUser_4 { top: 140px; }
    #divDataUser_5 { top: 170px; }
    #divDataUser_6 { top: 200px; }
    #divDataUser_7 { top: 233px; }
    #divDataUser_8 { top: 263px; }
    #divDataUser_9 { top: 293px; }



    /*Item Form CSS*/
    #GridPopUp_Item {
        padding: 10px;
        background-color: white;
        width: 600px;
        height: 400px;
        vertical-align: middle;
        border-radius: 10px;
        font-family: Arial;
        font-size: 14px;
        color: #444444;
        display: none;
    }
    div[id^="divLabelItem_"] {
        position: absolute;
        left: 20px;
        width: 100px;
        height: 25px;
        text-align: right;
        padding-top: 4px;
        overflow: hidden;
        display: table-cell;
        vertical-align: middle;
        border: 0px solid green;
    }

    #divLabelItem_0 { top: 20px; }
    #divLabelItem_1 { top: 50px; }
    #divLabelItem_2 { top: 180px; }
    #divLabelItem_3 { top: 210px; }
    #divLabelItem_4 { top: 240px; }
    #divLabelItem_5 { top: 270px; }

    [id^="divDataItem_"] {
        position: absolute;
        padding-left:5px;
        left: 130px;
        width: 400px;
        height: 20px;
    }

    #divDataItem_0 {
        top: 20px;
        width: 410px;
    }
    #divDataItem_1 {
        top: 50px;
        height: 100px;
        border: 3px solid #cccccc;
        padding: 5px;
    }

    #divDataItem_2 { 
        top: 180px; 
        width:150px;
    }
    #divDataItem_3 {
        top: 210px;
        width: 50px;
    }
    #divDataItem_4 {
        top: 240px;
        width: 50px;
    }
    #divDataItem_5 { top: 270px; }

    #btnSubmit_Item {
        position: absolute;
        top: 350px;
    }

    [id^="Grid_ItemsRowCell_2"] {
        text-align:left;
    }
