@charset "utf-8";
/* CSS Document */
/*  Reset for some default browser CSS - General */
*,
*::before,
*::after {
  box-sizing: border-box;
}

@font-face {
    font-family: 'CalibriRegular';
    src: url('fonts/calibri-webfont.eot');
    src: url('fonts/calibri-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/calibri-webfont.woff') format('woff'),
         url('fonts/calibri-webfont.ttf') format('truetype'),
         url('fonts/calibri-webfont.svg#CalibriRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CalibriBold';
    src: url('fonts/calibrib-webfont.eot');
    src: url('fonts/calibrib-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/calibrib-webfont.woff') format('woff'),
         url('fonts/calibrib-webfont.ttf') format('truetype'),
         url('fonts/calibrib-webfont.svg#CalibriBold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'rupee_foradianregular';
    src: url('fonts/rupee-webfont.eot');
    src: url('fonts/rupee-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/rupee-webfont.woff') format('woff'),
         url('fonts/rupee-webfont.ttf') format('truetype'),
         url('fonts/rupee-webfont.svg#rupee_foradianregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
  font-family: 'FontAwesome';
  src: url('fonts/fontawesome-webfont.eot?v=4.0.3');
  src: url('fonts/fontawesome-webfont.eot?#iefix&v=4.0.3') format('embedded-opentype'), 
       url('fonts/fontawesome-webfont.woff?v=4.0.3') format('woff'), 
       url('fonts/fontawesome-webfont.ttf?v=4.0.3') format('truetype'), 
       url('fonts/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}


div, h1, h2, h3, p, ul, ol, li, img 
{padding:0px; border:0px; list-style:none;}

a		{color:#002f71; text-decoration:underline;}
a:hover	{color:#002f71; text-decoration:none;}

html    {height:100%; margin:0px; padding:0px;}
form	{height:100%; margin:0px; padding:0px; background:url('images/bg-header.gif') repeat-x; width:100%}
body	{height:100%; font-family:calibri, 'CalibriRegular'; font-size:14px; color:#535353; background:#fff url('images/bg.gif'); margin:0px; padding:0px;}

p 		{margin:0px  0px 15px 0px; padding:0px; text-align:justify; line-height:15pt;}
.clear	{clear:both}
.clear1	{clear:both; height:15px}
.clear2	{clear:both; width:100%}

span.rs     {font-family: 'rupee_foradianregular'; font-weight:normal; font-style:normal;}
.hr         {border-bottom:1px solid #e2e2e2; margin:0px; padding:0px; width:100%; float:left; margin-bottom:20px;}



/******************************************************************************
ICON STYLING
******************************************************************************/
.icon-font {font-family: FontAwesome; font-style:normal; font-weight: normal; -webkit-font-smoothing: antialiased;}

.icon-view:before           {content:"\f06e";}
.icon-orders:before         {content:"\f022"; margin-right:4px}
.icon-pastorders:before     {content:"\f017"; margin-right:4px}
.icon-changepassword:before {content:"\f13e"; margin-right:4px}
.icon-logout:before         {content:"\f011"; margin-right:4px}
.icon-add:before            {content:"\f055"; margin-right:4px}
.icon-dashboard:before      {content:"\f0ea"; margin-right:4px}
.icon-upload:before         {content:"\f093"; margin-right:4px}

.icon-update        {background:url(images/icon-update.png) no-repeat bottom; width:16px; height:16px; margin:20px 5px 0px ; display:inline-block; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.icon-update:hover  {background:url(images/icon-update-mo.png) no-repeat bottom;}

.icon-edit          {background:url(images/icon-edit.png) no-repeat; width:16px; height:16px; margin:0px 3px; display:block; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.icon-edit:hover    {background:url(images/icon-edit-mo.png) no-repeat;}

.icon-history       {background:url(images/icon-history.png) no-repeat; width:16px; height:16px; margin:0px 3px; display:inline-block; vertical-align:top; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.icon-history:hover {background:url(images/icon-history-mo.png) no-repeat;}

.icon-edit1          {background:url(images/icon-edit.png) no-repeat; width:16px; height:16px; margin:0px 0px; display:inline-block; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.icon-edit1:hover    {background:url(images/icon-edit-mo.png) no-repeat;}






/******************************************************************************
WARPPER STYLING
******************************************************************************/
.home-wrapper		{position:relative; width:1000px; margin:0 auto; text-align:left;}
.home-wrapper		{min-height:100%; height:auto !important; height:100%; margin:0 auto -50px;} 

.wrapper		{position:relative; max-width:1400px; margin:0 auto; text-align:left; background:#fff; float:none;}
.wrapper		{min-height:100%; height:auto !important; height:100%; margin:0 auto -50px;} 
				/*the bottom margin is the negative value of the footer's height*/
.footer			{position:relative; width:100%; margin:0 auto;float:left}
.footer, .push  {height:50px;}
                /*.push must be the same height as .footer*/



              
/******************************************************************************
HEADER
******************************************************************************/
#headerpan  {width:100%; height:100px; background:#f3f3f3 url('images/bg-header.gif') repeat-x;}
#header		{margin:0px auto; float:none;}

.logo	    {margin:0px; padding:0px; float:left}
.top-header	{margin:0px; padding:0px; float:right; margin-top:60px;}
.top-right  {margin:0px auto; padding:0px; float:right;}
.caption    {margin:0px; padding:0px; float:right; font-size:22px; text-transform:uppercase;}




/******************************************************************************
BODY
******************************************************************************/
#bodycontainerpan   {width:100%; margin:0px; padding:0px; padding:15px; background:#fff; float:left; height:100%;}
#bodycontainer      {width:100%; margin:0px auto; float:none;}


/***********************************************************/
/******************** Login Form **************************/
#login-area {width:710px; margin:0px auto; float:none; margin-left:-355px; left:50%; top:50%; position:absolute; display:block}
#loginbox   {width:710px; margin:0px auto; float:left; height:200px; display:block}

#loginbox .login-box-top    {width:710px; min-height:30px; background:url(images/login-box-top.png) no-repeat; position:absolute; top:0; z-index:-2;}
#loginbox .login-box-bottom {width:710px; min-height:40px; background:url(images/login-box-bottom.png); position:absolute; top:170px; bottom:0px;}
#loginbox .login-box-bg     {width:710px; min-height:130px; background:url(images/login-box-bg.png); float:left; margin-top:30px; margin-bottom:40px; padding:10px 0px;}
#loginbox .login-box-top .bread   {margin:0px auto; float:none; position:absolute; width:494px; height:330px; background:url(images/pic-breads.png); background-repeat:no-repeat; z-index:-1; top:-270px; left:130px;}

.login-box-bg .loginform    {width:610px; margin:0px auto; padding:0px;}
.loginform .loginicon       {width:128px; height:128px; background:url(images/icon-login.png); margin:0px auto; padding:0px; float:left}
.loginform .logindetails    {width:462px; margin:0px auto; padding:0px; float:right}

.logindetails ul.formlist       {list-style:none; padding:0px; margin:0px;}
.logindetails ul.formlist li    {list-style:none; padding:0px; margin:0px; display:inline-block}

ul.formlist li .textinput       {width:170px; height:28px; line-height:21pt; margin:0px 5px 0px 0px; padding:0px 6px 0px 40px; border:1px solid #e5e5e8; font-family:Calibri, 'CalibriRegular'; font-size:13px; outline:none; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
ul.formlist li .textinput:hover {border:1px solid #39779e;}
ul.formlist li .textinput:focus {border:1px solid #39779e;}

ul.formlist li .tb-username     {background:url(images/icon-user.png) no-repeat left;}
ul.formlist li .tb-password     {background:url(images/icon-password.png) no-repeat left;}

.logindetails ul.btlogin       {list-style:none; padding:0px; margin:8px 0px; float:left; width:135px;}
ul.btlogin li .submit          {padding:6px 10px 4px; margin:0px; background:#3b789f; font-size:13px; font-weight:bold; text-transform:uppercase; border:1px solid #2d6385; border-width:0px 0px 2px 0px; color:#fff; float:left; cursor:pointer; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
ul.btlogin li .submit:hover    {padding:6px 10px 4px; margin:0px; background:#c80000; font-size:13px; text-transform:uppercase; border:1px solid #960000; border-width:0px 0px 2px 0px; color:#fff;}

.logindetails ul.list       {list-style:none; padding:0px; margin:14px 0px; float:right; width:300px; font-size:13px; text-align:right; margin-right:20px;}
.logindetails ul.list li    {list-style:none; padding:0px 0px 3px 10px; margin:0px; display:inline-block}


/***********************************************************/
/******************** Video Area **************************/
#video-area {width:560px; height:315px; margin:0px auto; float:none; margin-left:-280px; margin-top:-157.5px; left:50%; top:50%; position:absolute; display:block}


/***********************************************************/
/******************** Profile Bar *************************/
#profilebar {width:790px; margin:0px auto; float:right; height:45px; margin-top:15px; text-align:right; margin-bottom:8px;}
#profilebar ul.profilelist {list-style:none; padding:0px; margin:0px;}
#profilebar ul.profilelist li {list-style:none; padding:0px; margin:0px 0px 0px 10px; display:inline-block}
#profilebar ul.profilelist li a {text-decoration:none; color:inherit}
#profilebar ul.profilelist li a:hover {text-decoration:none; color:#c80000}

#profilebar ul.profilelist li a.reminders {text-decoration:none; color:#fff; background:#c80000; padding:2px 5px 3px 5px; float:right; margin-top:5px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
#profilebar ul.profilelist li a.reminders:hover {text-decoration:none; color:#fff; background:#960000;}


/***********************************************************/
/******************** Search Box **************************/
.searchbox  {width:250px; margin:0px; padding:0px; float:right; margin-top:4px;}

.searchbox ul.search    {list-style:none; padding:0px; margin:0px; float:right}
.searchbox ul.search li {list-style:none; padding:0px; margin:0px; display:inline-block; float:left}

.searchbox .tb-search           {width:120px; height:26px; line-height:20pt; margin:0px; padding:0px 5px; background:#fff; color:#999999; border:none; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; outline:none;}
.searchbox .tb-search:hover     {width:140px; margin:0px; padding:0px 5px; background:#fff; color:#000; border:none;}
.searchbox .tb-search:focus     {width:140px; margin:0px; padding:0px 5px; background:#fff; color:#000; border:none;}

.searchbox .tb-go           {width:30px; height:26px; margin:0px; padding:0px; background:#fff url(images/icon-search.png) no-repeat; border:none; cursor:pointer; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; outline:none;}
.searchbox .tb-go:hover     {background:#e7e5e5 url(images/icon-search.png) no-repeat;}


/***********************************************************/
/******************** Order Detail ************************/
#bodyheader     {width:100%; padding:0px; margin:0px auto; margin-bottom:13px; padding:15px; background:#fff url('images/bg.gif'); display:block}
.header         {width:100%; padding:0px 0px 15px 0px; margin:0px auto; border:1px dashed #ccc; border-width:0px 0px 1px 0px; margin-bottom:15px; display:block; _float:left}

.header1        {width:1100px; padding:0px; margin:0px auto; float:none; min-height:30px; margin-bottom:13px;}
.outstanding    {padding:4px 7px; margin:0px; float:right; background:#fff; border:1px solid #ccc; color:#000; font-size:18px}

.order-status   {padding:0px; margin:0px; float:left;}
.order-status .tb-dropdown {width:200px; padding:10px; margin:0px; background:#fff; border:1px solid #ccc; color:#000; font-size:14px; font-family:Calibri, 'CalibriRegular'}


/***********************************************************/
/******************** sales-header ************************/
.sales-header {width:100%; padding:0px; margin:0px auto; margin-bottom:15px;}

.comdropdown  {margin:0px; padding:0px; float:left}
.comdropdown .tb-dropdown   {min-width:200px; padding:5px 5px 5px 1px; height:auto; margin:0px; background:#fff; border:1px solid #39779e; color:#000; font-size:14px; font-family:Calibri, 'CalibriRegular'; outline:none;}
.comdropdown .tb-dropdown:focus   {border:1px solid #39779e;}

.add-record {margin:0px; padding:0px; float:right; margin-top:7px}
.add-record a {background:#c80000; color:#fff; text-decoration:none; padding:7px 14px 7px 14px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.add-record a:hover {background:#39779e; color:#fff; text-decoration:none}


/***********************************************************/
/******************** Order Table *************************/
.order-table        {width:100%; padding:0px; margin:0px;}
.orders             {width:100%; color:#333; margin:0px; line-height:15pt;}
.orders tr          {-webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.orders tr:hover    {background:#eeeeee;}
.orders td          {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}
.orders td .os          {color:#c80000;font-weight:bold}
.orders th          {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}
.orders .th {background:#4e89af; line-height:14pt; font-weight:bold; color:#fff;}
.orders .tc {background:#f4fbff;}
.orders  tr {background:#ffffff;}

.orders a       {color:#c80000; text-decoration:underline;} 
.orders a:hover {color:#c80000; text-decoration:none;}
.orders a.icon       {color:#000; text-decoration:none;} 
.orders a.icon:hover {color:#c80000; text-decoration:none;}

.orders .icon-tracker   {background:url(images/icon-tracker.png) no-repeat; height:16px; width:16px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; display:block; float:right; padding-right:7px}
.orders .icon-tracker:hover   {background:url(images/icon-tracker-mo.png) no-repeat;}

.orders td p    {line-height:12pt; padding:0px; margin:0px 0px 5px 0px; float:left; width:100%; text-align:left}


/***********************************************************/
/******************** Pagging Style ***********************/
.paging         {margin:0px auto; float:left; padding:0px; text-align:left; margin-top:10px;}
.paging ul li   {display:inline-block; list-style:none; float:left; margin:0px 4px 0px 0px; padding:0px; margin-bottom:5px;}
.pgr li         {background:#d5edfb; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.pgr li.text         { padding:0px; margin:5px 10px 0px 0px; float:left; background:none;}

.pgr a          {padding: 5px 7px 5px 7px; color:#000; text-decoration:none; display:block; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.pgr a:hover    {background: #39779e; color:#fff; padding:5px 10px 5px 10px; -ms-transition:all 300ms linear;}
.pgr a.focus    {background:#39779e; color:#fff; padding:5px 10px 5px 10px;}

.paging .pgr li .inactive {overflow:hidden; position: relative; background:#ccc; padding: 5px 5px 5px 5px;}

/***********************************************************/
/******************** New Entery **************************/
.order-entry {width:940px; margin:0px; padding:15px; background:#f4f4f4; float:left; margin-bottom:20px;}
.order-entry ul.orderlist {list-style:none; padding:0px; margin:0px; display:inline-block; float:left; width:50%; vertical-align:top}
.order-entry ul li {list-style:none; padding:0px; margin:0px; display:inline-block; line-height:15pt; text-transform:uppercase; display:inline-block; float:left}
.order-entry ul.orderlist li.spacer {height:15px; margin:auto 0px; padding:0px; width:450px;}

.order-entry ul li.rgtspace {margin-right:8px;}

.tb-textbox {background:#fafafa; border:1px solid #dddddd; padding:0px 5px; margin-right:6px;  height:28px; width:200px; line-height:22px; outline:none; color:#8c8c90; font-family:Calibri, 'CalibriRegular'; font-size:14px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.tb-textbox:hover {background:#eeeeee; color:#000}
.tb-textbox:focus {background:#eeeeee; color:#000}

.tb-textdate {background:#fafafa; border:1px solid #dddddd; border-width:1px 0px 1px 1px; padding:0px 0px 0px 5px; height:28px; width:80px; line-height:22px; outline:none; color:#8c8c90; font-family:Calibri, 'CalibriRegular'; font-size:14px; float:left}
.tb-icondate {background:#fafafa url(images/icon-date.png); width:27px; height:28px; margin:0px; padding:0px; border:1px solid #dddddd; border-width:1px 1px 1px 0px; float:left; cursor:pointer; outline:none;}

.tb-dropdown {background:#fafafa; border:1px solid #dddddd; padding:3px 3px 3px 2px; height:28px; width:210px; line-height:22px; outline:none; color:#8c8c90; font-family:Calibri, 'CalibriRegular'; font-size:14px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.tb-dropdown:hover {background:#eeeeee; color:#000}
.tb-dropdown:focus {background:#eeeeee; color:#000}

.order-entry ul.cutomerlist {list-style:none; padding:0px; margin:0px 5px 0px 0px; display:inline-block; float:left}
.order-entry ul li {list-style:none; padding:0px; margin:0px; display:inline-block; line-height:15pt; text-transform:uppercase; display:inline-block; float:left}

#conmpany-details {width:960px; margin:0px 0px 20px 0px; padding:0px; float:left}
table {width:100%; margin:0px; padding:0px;}
table tr{margin:0px auto; padding:0px;}
table tr td{margin:0px; padding:10px 5px; border-bottom:1px solid #e2e2e2; line-height:14pt;}
table tr td.th {background:#4e89af; line-height:14pt; font-weight:bold; color:#fff; text-trnsform:uppercase; padding:5px 5px;}

ul.del-list {list-style:none; padding:0px; margin:0px; width:100%; float:left;}
ul.del-list li {list-style:none; padding:0px; margin:0px 0px 7px 0px; display:inline-block; vertical-align:top; line-height:15pt;}

.other-detail {width:100%; margin:0px; padding:0px;}
.other-detail table {width:100%; margin:0px; padding:0px;}
.other-detail table tr{margin:0px auto; padding:0px;}
.other-detail table tr td{margin:0px; padding:2px 0px; border:none;}

.invoice-detail {width:100%; margin:0px; padding:0px; float:left}
.invoice-detail ul.list {list-style:none; padding:0px; margin:0px; display:inline-block; float:left}
.invoice-detail ul li {list-style:none; padding:0px; margin:0px; display:inline-block; line-height:15pt; text-transform:uppercase; display:inline-block; float:left}
.tb-inv-upload {background:#fafafa; border:1px solid #dddddd; padding:1px 2px 3px; width:180px; height:20px; line-height:22px; outline:none; color:#8c8c90; font-family:Calibri, 'CalibriRegular'; font-size:14px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; margin:0px;}

.product-details {width:960px; margin:0px auto; padding:0px; float:left; margin-bottom:20px}
.product-details table {width:100%; margin:0px; padding:0px;}
.product-details table tr{margin:0px auto; padding:0px;}
.product-details table tr td{margin:0px; padding:5px 5px; border-bottom:1px solid #e2e2e2; line-height:14pt;}
.product-details table tr td.th {background:#4e89af; line-height:14pt; font-weight:bold; color:#fff; padding:5px 5px;}
.product-details table tr td.tch {background:#fff; text-transform:uppercase}

.product-details ul.prod-list {list-style:none; padding:0px; margin:0px; width:100%; float:left;}
.product-details ul.prod-list li {list-style:none; padding:0px; margin:0px 5px 0px 0px; display:inline-block; vertical-align:top; line-height:15pt;}

.product-details ul.det-list {list-style:none; padding:0px; margin:0px; width:100%; float:left;}
.product-details ul.det-list li {list-style:none; padding:0px; margin:0px 20px 0px 0px; display:inline-block; vertical-align:top; line-height:15pt;}
.product-details ul.det-list li.text {width:100px; padding:0px; margin:0px;}
.product-details ul.det-list li.collan {width:10px; padding:0px; margin:0px;}

.tb-pro-textbox {background:#fafafa; border:1px solid #dddddd; padding:0px 5px; height:24px; width:200px; line-height:22px; outline:none; color:#8c8c90; font-family:Calibri, 'CalibriRegular'; font-size:14px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;}
.tb-pro-textarea {background:#fafafa; border:1px solid #dddddd; padding:0px 5px; width:300px; line-height:22px; outline:none; color:#8c8c90; font-family:Calibri, 'CalibriRegular'; font-size:14px; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; resize:none}
.tb-pro-textbox:hover, .tb-pro-textarea:hover {background:#eeeeee; color:#000}
.tb-pro-textbox:focus, .tb-pro-textarea:focus {background:#eeeeee; color:#000}

.product-details .trans-detail {margin:0px auto; padding:0px; width:50%; float:left}
.product-details .trans-detail table {margin:0px; padding:0px; float:left;}
.product-details .trans-detail table tr td{margin: 0px; padding:5px 5px; border:none;}

.product-details .remarks {margin:0px auto; padding:0px 0px 0px 8px; width:49%; float:left}

.btn        {width:980px; margin:0px; padding:0px; text-align:center;}
.tb-submit          {padding:10px 15px 7px; margin:0px; background:#3b789f; font-size:13px; font-weight:bold; text-transform:uppercase; border:1px solid #2d6385; border-width:0px 0px 2px 0px; color:#fff; cursor:pointer; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; float:none;}
.tb-submit:hover    {padding:10px 15px 7px; margin:0px; background:#c80000; font-size:13px; text-transform:uppercase; border:1px solid #960000; border-width:0px 0px 2px 0px; color:#fff;}


.customer-details {width:960px; margin:0px 0px 20px 0px; padding:0px; float:left}
.customer-details table {width:960px; margin:0px; padding:0px;}
.customer-details table tr{margin:0px auto; padding:0px;}
.customer-details table tr td{margin:0px; padding:3px 5px; border-bottom:1px solid #e2e2e2; line-height:14pt;}
.customer-details stable tr td.th {background:#4e89af; line-height:14pt; font-weight:bold; color:#fff; text-trnsform:uppercase; padding:5px 5px;}


/***********************************************************/
/******************** Track Order *************************/
#trackorder                     {width:650px; margin:0px auto; padding:0px; float:none;}
#trackorder .trackorder-table   {width:100%; padding:0px; margin:0px; margin-top:10px}
#trackorder .trackorder         {width:100%; color:#333; margin:0px; line-height:15pt; border-top:1px solid #ddd;}
#trackorder .trackorder td      {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}
#trackorder .trackorder tr      {background:#ffffff;}

#trackorder ul.orderlist    {list-style:none; padding:0px; margin:0px; display:inline-block; width:100%}
#trackorder ul li           {list-style:none; padding:0px; margin:0px 10px 0px 0px; line-height:15pt; text-transform:uppercase; display:inline-block; float:left}


/***********************************************************/
/******************** Update Order ************************/
#updateorder                    {width:600px; margin:0px auto; padding:0px; float:none;}
#updateorder .updateorder-table {width:100%; padding:0px; margin:0px; margin-top:10px}
#updateorder .updateorder       {width:100%; color:#333; margin:0px; line-height:15pt; border-top:1px solid #ddd;}
#updateorder .updateorder td    {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}
#updateorder .updateorder tr    {background:#ffffff;}


/***********************************************************/
/******************** Update Order ************************/
#orderhistory                       {width:650px; margin:0px auto; padding:0px; float:none;}
#orderhistory .orderhistory-table   {width:100%; padding:0px; margin:0px; margin-top:10px}
#orderhistory .orderhistory         {width:100%; color:#333; margin:0px; line-height:15pt; border-top:1px solid #ddd;}
#orderhistory .orderhistory td      {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}
#orderhistory .orderhistory tr      {background:#ffffff;}
#orderhistory .orderhistory th      {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}


/***********************************************************/
/******************** LR Detail ***************************/
#lrdetail                   {width:500px; margin:0px auto; padding:0px; float:none;}
#lrdetail .lrdetail-table   {width:100%; padding:0px; margin:0px; margin-top:10px}
#lrdetail .lrdetail         {width:100%; color:#333; margin:0px; line-height:15pt; border-top:1px solid #ddd;}
#lrdetail .lrdetail td      {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}
#lrdetail .lrdetail tr      {background:#ffffff;}






/***********************************************************/
/******************** Email Format ************************/
#email          {width:650px; margin:0px auto; padding:0px; float:none; display:block;}
#email .email-table   {width:100%; padding:0px; margin:0px; margin-top:10px; margin-bottom:10px}
#email .email         {width:100%; color:#333; margin:0px; border-top:1px solid #ddd;}
#email .email td      {padding:5px 5px 5px 5px; vertical-align:top; border-bottom:1px solid #ddd;}
#email .email tr      {background:#ffffff;}

#email ul.list  {list-style:none; padding:0px; margin:5px 0px 0px 0px; display:inline-block; width:100%}
#email ul li    {list-style:none; padding:0px; margin:0px 10px 0px 0px; line-height:15pt; display:inline-block; float:left}

#email ul.email  {list-style:none; padding:0px; margin:10px 0px 0px 0px; display:inline-block; width:100%; border:none; text-align:center}
#email ul li    {list-style:none; padding:0px; margin:0px 10px 0px 0px; line-height:15pt; display:inline-block; float:none;}

#email ul li.text   {width:50px; float:left}
#email ul li.collan {width:10px; float:left}


/***********************************************************/
/******************** O/S Statement Format ****************/
#os-statement          {width:100%; margin:0px auto; padding:0px; float:none; display:block;}

#os-statement ul.list  {list-style:none; padding:0px; margin:5px 0px 0px 0px; display:block; width:100%}
#os-statement ul li    {list-style:none; padding:0px; margin:0px 10px 10px 0px; line-height:15pt; width:100%; display:block; float:left}


/***********************************************************/
/******************** Forgot password *********************/
#form {width:600px; margin:0px auto; padding:0px; float:none; display:block;}
#change_password {width:400px; margin:0px auto; padding:0px; float:none; display:block;}
ul.form-box {list-style:none; padding:0px; margin:0px; width:100%;}
ul.form-box li {list-style:none; padding:0px; margin:3px 0px; display:inline-block; vertical-align:top}
ul.form-box li.name {width:150px; padding:5px 0px; margin:0px; float:left;}
ul.form-box li.collan {width:20px; padding:5px 0px; margin:0px; float:left;}
ul.form-box li.box {width:290px; padding:0px; margin:0px; float:left}



/***********************************************************/
/******************** Common Classes **********************/
.th {background:#4e89af; line-height:14pt; font-weight:bold; color:#fff;}
.tc {background:#f4fbff;}



/******************************************************************************
VIEW ORDER
******************************************************************************/
#header-order		{width:650px; margin:0px auto; float:none; height:100px; background:#fff; padding:0px 10px}
#view-order         {width:650px; margin:0px auto; float:none; padding:10px; background:#fff}
.data-order         {width:640px; margin:0px auto; float:none;}

.data-order .th1        {background:#c80000; padding:6px 4px; line-height:14pt; font-size:15px; font-weight:bold; color:#fff; text-transform:uppercase;}
.data-order .th         {background:#999; padding:6px 4px; line-height:14pt; font-weight:bold; color:#fff;}
.data-order .tch        {color:#333; background:#e6e6e6; padding:6px 4px;}
.data-order .tc         {color:#333; background:#f5f5f5; padding:6px 4px;}

.view-table {width:100%; color:#333; margin:0px; background:#fff}
.view-table a {color:#c80000; text-decoration:none;} 
.view-table a:hover {color:#000; text-decoration:none;}
.view-table tr {line-height:12pt;}
.view-table td {padding: 6px 4px; vertical-align:top; border-bottom:1px solid #ddd; line-height:14pt;}
.view-table .attn {font-weight:bold; margin-top:5px; display:block; padding:0px; margin-top:3px;}

.icon-status {background:url('images/icon-view.png') no-repeat left; display:inline-block; padding: 0px 0px 0px 20px; }





/******************************************************************************
FOOTER
******************************************************************************/
#footercontainerpan {width:100%; margin:0px; padding:0px; font-size:13px; float:left; background:#39779e; min-height:50px}
#footercontainer	{width:980px; margin:0px auto; float:none; padding:20px 0px 0px 0px;}
.footer-detail	    {width:980px; margin:0px auto; float:none; color:#fff; font-size:12px; text-align:center}




/******************************************************************************
HEADER TAGS
******************************************************************************/
h1 {font-size:23px; font-style:normal; font-family:calibri, 'CalibriRegular'; font-weight:normal; padding:0px; margin:0px 0px 0px 0px; color:#39779e; text-transform:uppercase;}
h1.popup {font-size:23px; font-style:normal; font-family:calibri, 'CalibriRegular'; font-weight:normal; padding:0px; margin:0px 0px 10px 0px; color:#39779e; text-transform:uppercase; border-bottom:1px dashed #ccc;}

h2              {font-size:21px; font-style:normal; font-family:calibri, 'CalibriRegular'; font-weight:normal; padding:2px 0px 15px 0px; margin:0px; color:#c80000; text-transform:uppercase;}
h2.thd  {font-size:20px; font-style:normal; font-family:calibri, 'CalibriRegular'; font-weight:normal; padding:0px; margin:0px; color:#c80000; text-transform:none;}

h6 {font-size:16px; font-style:normal; font-family:calibri, 'CalibriRegular'; font-weight:normal; padding:0px 0px 3px 0px; margin:0px; color:#c80000; text-transform:uppercase;}
h6.attn {font-size:13px; font-style:normal; font-family:calibri, 'CalibriRegular'; font-weight:bold; padding:10px 0px 3px 0px; margin:0px; color:#000; text-transform:uppercase;}




/******************************************************************************
BREADCRUMB
******************************************************************************/
#breadcrumb			{width:100%; margin:0px auto; color:#000; padding:0px; clear:both; border:1px dashed #dedede; height:27px; margin-bottom:10px; display:block}
#crumbs				{height:27px; margin:0px; padding:0px; float:left}
#crumbs li			{float:left; line-height:27px; color:#3f64a8; padding-left:.75em; font-weight:bold}		
#crumbs li a		{background:url(images/crumbs.gif) no-repeat right center; display:table; padding:0 15px 0 0; font-weight:normal}							
#crumbs li a		{color:#777; text-decoration:none;}	
#crumbs li a:hover, 
#crumbs li a:focus  {color:#dd2c0d;}


a.btn_excel, input.btn_excel {display: inline-block; font-family: Calibri, 'CalibriRegular', Arial; width:auto; height: 32px; padding: 0 12px; line-height: 30px; font-size: 14px; font-weight: bold;  cursor: pointer; background:#c80000 url(images/icon-excel.png) no-repeat left; background-position:6px 6px; color: #fff; text-decoration: none; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear;  padding-left:35px; border:0px;}
a.btn_excel:hover, input.btn_excel:hover {background-color:#39779e; text-decoration: none; color: #ffffff;}

a.back {display: inline-block; font-family: Calibri, 'CalibriRegular'; padding: 5px 12px; font-size: 14px; font-weight: bold;  cursor: pointer; background:#c80000 url(images/icon-back.png) no-repeat left; background-position:6px 6px; color: #fff; text-decoration: none; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; text-transform:uppercase}
a.back:hover {background-color:#39779e; text-decoration: none; color: #ffffff;}

.err { font-weight: bold; color: rgb(200,0,0); }

.tb-reset       {background:transparent; width:20px; cursor:pointer; height:23px; color:#fff; border:0px; font-size:12px; margin:0px 0px 0px 5px; background-image:url(images/icon-reset.png); background-position:center; background-repeat:no-repeat; vertical-align:middle;}


/***********************************************************/
/******************** Messages page ************************/
#messageorderhistory                       {width:500px; margin:0px auto; padding:0px; float:none;}
#messageorderhistory .orderhistory-table   {width:100%; padding:0px; margin:0px; margin-top:10px}
#messageorderhistory .orderhistory         {width:100%; color:#333; margin:0px; line-height:15pt; border-top:1px solid #ddd;}
#messageorderhistory .orderhistory td      {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}
#messageorderhistory .orderhistory tr      {background:#ffffff;}
#messageorderhistory .orderhistory th      {padding:7px 5px 3px 5px; vertical-align:top; border-bottom:1px solid #ddd;}



/***********************************************************/
/******************** Calendar Style **********************/
#lrdetail .lrdetail #calendar      {width:100%; margin:0px auto; padding:0px; float:none;}
#lrdetail .lrdetail #calendar  tr td {margin:0px auto; padding:0px; float:none;}

#updateorder .updateorder-table #calendar      {width:100%; margin:0px auto; padding:0px; float:none;}
#updateorder .updateorder-table #calendar  tr td {margin:0px auto; padding:0px; float:none;}

#updateorder .updateorder-table #calendar1      {width:100%; margin:0px auto; padding:0px; float:none;}
#updateorder .updateorder-table #calendar1  tr td {margin:0px auto; padding:0px; float:none;}

#updateorder .updateorder-table #calendar2      {width:100%; margin:0px auto; padding:0px; float:none;}
#updateorder .updateorder-table #calendar2  tr td {margin:0px auto; padding:0px; float:none;}

#updateorder .updateorder-table #calendar3      {width:100%; margin:0px auto; padding:0px; float:none;}
#updateorder .updateorder-table #calendar3  tr td {margin:0px auto; padding:0px; float:none;}

#os-statement .list #calendar      {width:100%; margin:0px auto; padding:0px; float:none;}
#os-statement .list #calendar  tr td {margin:0px auto; padding:0px; float:none;}

#trackorder .trackorder-table #calendar      {width:100%; margin:0px auto; padding:0px; float:none;}
#trackorder .trackorder-table #calendar  tr td {margin:0px auto; padding:0px; float:none;}
.mycalender   {background-color: #ffffff; border:solid 1px #ccc; margin:5px; padding:5px;}
.mycalender .ajax__calendar_container   {background-color: #ffffff; border:solid 0px #ccc; padding:0px;}

.mycalender .ajax__calendar_header      {background-color: #ffffff; margin-bottom: 4px; padding:0px;}
.mycalender .ajax__calendar_header a    {background-color: #ffffff; margin-bottom: 4px; padding:0px;}
.mycalender .ajax__calendar_title,
.mycalender .ajax__calendar_next,
.mycalender .ajax__calendar_prev    {color: #000;}

.mycalender .ajax__calendar_body    {background-color: #ffffff; border: solid 1px #ffffff;}
.mycalender .ajax__calendar_dayname {text-align:center; font-weight:bold; margin-bottom: 4px; margin-top: 2px; color: #000000; border-bottom: 0px solid #ccc;}
.mycalender .ajax__calendar_day     {text-align:center;}

.mycalender .ajax__calendar_hover .ajax__calendar_day,
.mycalender .ajax__calendar_hover .ajax__calendar_month,
.mycalender .ajax__calendar_hover .ajax__calendar_year,
.mycalender .ajax__calendar_active  {color: #000000; background-color: #ccdeff;}

.mycalender .ajax__calendar_today   {font-weight:bold; color: #6c8cc8;}
.mycalender .ajax__calendar_other   {color: #999999; text-decoration:none}

.mycalender .ajax__calendar_hover .ajax__calendar_today,
.mycalender .ajax__calendar_hover .ajax__calendar_title {color: #6c8cc8; text-decoration:none}

.mycalender .ajax__calendar_title                       {color: #6c8cc8; text-decoration:underline}




/******************************************************************************
TASK MANAGEMENT
******************************************************************************/

.task-area  {width:100%; padding:0px; margin:0px; position:relative; min-height:100%; height:100%; float:left;}

ul.tasklist  {list-style:none; padding:0px; margin:0px auto; width:97%; float:none; position:relative;}
ul.tasklist li  {list-style:none; padding:0px; margin:0px; width:55%; display:block; padding:10px; margin-bottom:15px; text-align:left; border-radius:5px; box-shadow:inset 0px 0px 6px #ddd}

ul.tasklist li.user     {float:right; background:#f4fbff;}
ul.tasklist li.others   {float:left; background:#f9f9f9;}

.name    {text-align:left; color:#000; font-weight:bold;}
.comment {text-align:left;}
.date    {text-align:right; color:#aaa}

ul.tasklist li .arrow-left  {width:0; height:0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left:7px solid #edf2f5; float:right; position:absolute; right:-7px }
ul.tasklist li .arrow-right {width:0; height:0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right:7px solid #ededed; float:left; position:absolute; left:-7px}


.task-area-form {width:100%; padding:0px; margin:0px; position:absolute; top:0px;}
.task-area-form > ul.formlist    {width:100%; margin:0px; padding:0px 8px; margin-top:5px}
.task-area-form > ul.formlist li .textinput       {width:100%; line-height:15pt; margin:0px 5px 0px 0px; padding:0px 6px 0px 5px; height:48px; border:1px solid #e5e5e8; font-family:Calibri, 'CalibriRegular'; font-size:14px; outline:none; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; resize:none; background:#fdf9e3; border-radius:5px;}
.task-area-form > ul.formlist li .textinput:hover {border:1px solid #39779e;}
.task-area-form > ul.formlist li .textinput:focus {border:1px solid #39779e;}

.task-area-form > ul.formlist li .submit          {padding:0px 10px 0px; margin:0px; background:#3b789f url(images/icon-enter.png) no-repeat center center; font-size:13px; font-weight:bold; text-transform:uppercase; border:1px solid #2d6385; border-width:0px 0px 0px 0px; color:#fff; float:left; cursor:pointer; -webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; height:50px; width:50px; border-radius:5px;}
.task-area-form > ul.formlist li .submit:hover    {padding:0px 10px 0px; margin:0px; background:#c80000 url(images/icon-enter.png) no-repeat center center; font-size:13px; text-transform:uppercase; border:1px solid #960000; border-width:0px 0px 0px 0px; color:#fff;}


.pro-content      {width:100%; margin:0px; padding:0px; float:left; display:block; height:550px; overflow:auto;}