﻿/** Common elements >> START:**/
body,html{
   margin:0px;
   margin:2px 0px 10px;
   padding:0px;
   /*font-family:'Century Gothic';
   font-family:Arial, Helvetica, sans-serif;*/
   font-family:"Open Sans","lucida grande","Segoe UI",arial,verdana,"lucida sans unicode",tahoma,sans-serif;
   font-size:14px;
   color:#555;
   line-height:22px;
}
body {
     background:#CCC;
}
div {
    position:relative;
}
.Block{display:block;}
.InlineTextW{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
textarea.AutoSize{resize:none;overflow:hidden;}
textarea{outline-width:0px;}
fieldset {
    border-color:#EFEFEF;
}
.Curved5{
    border-radius:5px;
   -moz-border-radius:5px;
   -webkit-border-radius:5px;
}
.Curved3{
    border-radius:3px;
   -moz-border-radius:3px;
   -webkit-border-radius:3px;
}
.BShadowed {
    /*box-shadow: 0 8px 6px -6px #004099;
    -moz-box-shadow: 0 8px 6px -6px #004099;
    -webkit-box-shadow: 0 8px 6px -6px #004099;*/
    box-shadow: 0px 14px 10px -9px #000;
    -moz-box-shadow: 0px 14px 10px -9px #000;
    -webkit-box-shadow: 0px 14px 10px -9px #000;
}
.Unselected{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;  
}
a{text-decoration:none;color:#006699;}
    a:hover {
        text-decoration: underline;
    }
.MsgW{
    border:1px solid red;
    padding:5px;
    margin-top:2px;
    background:#CCCCCC;
    display:none;
}
button,input[type=submit],input[type=button],.Button{
    background: #FFFFFF;
    padding:5px 5px;
    color: #a53821;
    font-weight:bold;
    border:none;
    text-align:center;
    border:1px solid #a53821;
    min-width:120px;
}
    button:hover, input[type=submit]:hover, input[type=button]:hover,.Button:hover {
         background: #a53821;
         color: #FFFFFF;
         text-decoration:none;
    }
.ClearBoth {
    clear: both;
}
.HiddenCol {
    display: none;
}
ul.InlineList {
    list-style:none;
    padding:0px;
    margin:0px;
    font-size:0px;
}
    ul.InlineList li {
        display:inline-block;
        font-size:14px;
    }
ul.NormalList {
    list-style: none;
    padding: 0px;
    margin:0px;
    font-size: 0px;
}
    ul.NormalList li {
        display: block;
        font-size: 14px;
    }
input[type=text],input[type=password],textarea,select {
    padding:6px;
    border:1px solid #006699;
    border-radius:2px;
   -moz-border-radius:2px;
   -webkit-border-radius:2px;
   width:200px;
}
select {
    padding:4px 4px;
}
    select option {
        padding:1px 0px;
    }
.Heading {
    font-size:22px;
    padding:4px;
    display:block;
}
.Footer {
    display:block;
    position:relative;
    height:20px;
}
hr {
    border:none;
    border-top:1px solid #CCC;
}
img {
     background:#EEEEEE;
     text-align:center;
     overflow:hidden;
     margin:auto;  
}
.Label {
    color:#a53821;
    font-weight:bold;
}
.LabelDetail {
    color: #000;
}
.Bullet {
    display:inline-block;
}
/** Common elements >> END:**/
/** Layout >> START */
#divLayout {
     width:97%;
     /*outline:1px solid #000;*/
     margin:auto;
}
#divHeader {
    margin:auto;
    width:100%
}
#cMainContent {
    padding-top: 5px;
}
#divFooter {
    width:100%;
    height:auto;
    margin:auto;
    margin-top:50px;
    border-top:1px solid #DDD;
}
/** Layout >> END */
/** Header >> START */
#divLogo {
    color:#00b252;
    font-size:40px;
    width:181px;
    height:70px;
    overflow:hidden;
    font-weight:bold;
    float:left;
    line-height:70px;
    background:url("../Images/Web/Viramol_Log_181X70.png") no-repeat;
}
#divMainMenu {
    width:100%;
    background:#00b252;
    margin-left:115px;
    top:12px;
}
#divMainMenu ul li {
    position: relative;
    vertical-align: middle;
    margin: 0px;
    text-align: center;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}
    #divMainMenu ul li:hover a, #divMainMenu ul li.CurrentPageLink a {
        color:#deb610 !important;
    }
#divMainMenu ul li a {
    color:#a53821;
    font-size:16px;
    display:block;
    padding:3px 10px;
    font-weight:bold;
}
    #divMainMenu ul li a:hover {
        /*text-decoration:none !important;*/
    }
#divAccessMenu {
    position:absolute;
    top:0px;
    right:0px;
    z-index:2000;
}
    #divAccessMenu #ulAccessMenu li a {
        padding:4px 10px;
        color:#FFFFFF;
    }
        #divAccessMenu ul li a:hover {
            text-decoration:underline;
        }
#divLoginName {
    cursor: pointer;
    width: 202px;
    overflow: hidden;
}
    #divLoginName #spnUserIcon {
        display: inline-block;
        width: 30px;
        height: 30px;
        background:url(../Images/Icons/User_30X30.png);
    }
#spnLoginName {
    color:#FFFFFF;
    height:30px;
    line-height:30px;
    font-weight:bold;
    display:inline-block;
    width:165px;
}
#ulLoginUserLinks {
    width:200px;
    background:#FFFFFF;
    border:1px solid #006699;
    overflow:hidden;
    display:none;
}
    #ulLoginUserLinks li a{
        display:block;
        padding:6px 3px;
    }
        #ulLoginUserLinks li:hover a{
            background:#0394dc;
            color:#FFFFFF;
            text-decoration:none !important;
        }
#ulSocialLinks {
    width:200px;
    text-align:right;
    position:absolute;
    right:0px;
    bottom:40px;
}
    #ulSocialLinks li {
        vertical-align:middle;
    }
#ulSocialLinks li span {
  display: block;
  color:#FFF;
}
        #ulSocialLinks li #spnFollow {
            padding-right: 5px;
        }
#ulSocialLinks li span#spnFbLogo {
  background: url(../Images/Icons/WebSprite.png) no-repeat -2px -2px;
  width: 25px;
  height: 25px;
}
#ulSocialLinks li span#spnTwitterLogo {
  background: url(../Images/Icons/WebSprite.png) no-repeat -25px -2px;
  width: 25px;
  height: 25px;
}
/** Header >> END */
/** Content >> START */
#divLeftCol {
    width: 68%;
    float: left;
    padding: 4px;
}
#divRightCol {
    width: 28%;
    margin-left: 700px;
    padding: 4px;
}
/** Content >> END */
/** Footer >> START */
#divFooterInfo {
    width:80%;
    float:left;
}
#spnCopyRight {
    display:block;
    text-align:left;
    font-size:16px;
}
#spnAuthorContacts {
    font-size:10px;
    position:relative;
    display:block;
    text-align:right;
    width:20%;
    margin-left:80%;
}
#ulFooterNav li{
    padding:5px 20px 0px 0px;
}
    #ulFooterNav li a {
         color:#a53821;
    }
#spnAuthorContacts a {
    color:#a53821;
    text-decoration:underline;
}
/** Footer >> END */
/** Tabbed Content >> Start */
.Tab {
    list-style:none;
    padding:0px;
    margin:0px;
}
    .Tab li {
       display:inline-block;
       position:relative;
    }
        .Tab li .TabLabel {
            display:block;
        }
        .Tab li .TabContent {
           position:absolute;
        }
/** Tabbed Content >> End */
/*** Ajax Progess >> START **/
  #AjaxProgressMsgDiv{
      background:#FFFFFF;
      padding: 2px;
      position: fixed;
      font-size: 12px;
      color: #444444;
      border: 1px solid #444444;
      width:150px;
      top:0px;
      right:0px;
      left:0px;
      margin:auto;
      z-index: 1000;
  }
  .ProgressSpinner{
      width:16px;
      height:16px;
      background:url("../Images/Icons/Progress_16X16.gif") no-repeat;
      text-align:center;  
      margin:auto;
      display:inline-block;
      padding:0px 0px;
   }
  #AjaxProgressMsgDiv span#text{padding: 3px 0px 3px 10px;position: relative;vertical-align:top;font-weight:bold;}
  /*** Ajax Progress >> END **/
/** Miscelleneous >> START */
.DateTrig {
    position: absolute;
    right: 2px;
    /*width: 26px;
    height: 26px;*/
    top: 0px;
    font-size:20px;
    display: block;
    cursor:pointer;
}
.RequiredFieldMark {
    font-weight:bold;
    color:red;
    position:absolute;
    margin-left:2px;
}
.EmptyGridMsg{
      color:#006699;
      font-weight:bold;
      text-align:center;
      display:block;    
  }
.SelectedRow{
    background:#006699 !important;
    color:#FFFFFF;
}
table tr:last-child a {
    color:#003b99 !important;
    font-weight:bold;
}
/** Miscelleneous >> END */