@import 'Categories.css';
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css');

/* #Buttons */
/* #CLEARFIX */
/* #Data Grid */
/* #Grid Content*/
/* #Forms */
/* #Horizontal Tab Navigation */
/* #Header */
/* #IFRAME POPUP */
/* #Layout */
/* #Login Page */
/* #Menu Bar */
/* #Navigation Bar*/
/* #Typography */
/* #RESET */

/* #INVOICING.ASPX */
/* #INVOICINGPOST.ASPX */
/* #INVOICEMISCITEMS.ASPX */
/* #MAIN.ASPX */
/* #MANAGECOMPANIES.ASPX */
/* #MANAGECUSTOMEREDIT.ASPX */
/* #MANAGEDIVISION.ASPX */
/* #MANAGEORDERDETAILSEDIT.ASPX */
/* #MANAGEORDERSEDIT.ASPX */
/* #MANAGEPRICEGROUPS.ASPX */
/* #MANAGEPRODUCTATTRIBUTES.ASPX */
/* #MANAGEPRODUCTSEDIT.ASPX */
/* #RECEIVING.ASPX */


/* #RESET */
/* (Inspired by E. Meyers)
================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline; 
}
	
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}
	
body {
    line-height: Normal;
}
	
ol, ul {
    list-style: none;
}
	
blockquote, q {
    quotes: none; 
}
	
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
	
/* #CLEARFIX */
/* ================================================== */

.clearfix:before, .clearfix:after {
    content: " ";
    display: block;
}
 
.clearfix:after {
    clear: both;
}
 
.clearfix {
    *zoom: 1;
}


html {
overflow: -moz-scrollbars-vertical; 
overflow-y:scroll;
}

body
{
    font-family: Arial, Helvetica, sans-serif;
    height: 100%;
    background: #cccccc;
    font-size:0.75em; /*12pt*/
}

/* #Typography */
/* ================================================== */

h1, h2, h3, h4, h5, h6 {
    color: #181818;
    font-weight: bold; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a  {
    font-weight: inherit; 
    }

h1 { /*32px*/
    display: block;
    font-size: 200%;
}

h2 { /*24px*/
    display: block;
    font-size: 150%;
}

h3 { /*19px*/
    display: block;
    font-size: 117%;
    margin:10px 0 0 0;
}

h4 { 
    /*Default font
    1em or 100% or 16px*/
}

h5 { /*13px*/
    display: block;
    font-size: 83%;
}

h6 { /*10px   */
    display: block;
    font-size: .67em;
}

.subheader  {
    color: #777; 
}

p  {
    margin: 0 0 10px 0; 
}

p img  {
    margin: 0; 
}

em  {
    font-style: italic; 
}

strong {
    font-weight: bold; 
    color: #333;
 }
 
 /* #Buttons */
/* ================================================== */

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    background: #eee; /* Old browsers */
    border: 1px solid #aaa;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: #444;
    display: inline-block;
    font-weight:bold;
    text-decoration: none;
    cursor: pointer;
    margin: 0 0.2em;
    line-height: normal;
    padding: 0.4em 0.625em;
}

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
    color: #222;
    background: #ddd; /* Old browsers */
    border: 1px solid #888;
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa; 
}

.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
    border: 1px solid #666;
    background: #ccc; /* Old browsers */
}

.button.full-width,
button.full-width,
input[type="submit"].full-width,
input[type="reset"].full-width,
input[type="button"].full-width {
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center;
}

/* Fix for odd Mozilla border & padding issues */
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}

/* #Forms */
/* ================================================== */
	
fieldset {
    margin-bottom: 1.25em; /*20px*/
}

input[type="text"], input[type="password"], select {
    margin:0;
    padding:2px 6px;
    height:15px;
}
	
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
    border: 1px solid #aaa;
    color: #444;
    display: inline-block;
    text-decoration: none;
    height:20px;
}
	
select {
    padding:2px;
    margin: 0;
    height:25px
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus,
input[type="submit"]:focus,
input[tyep="reset"]:focus {
    outline: none;
}

*:focus {
    outline: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    }

textarea {
    min-height: 3.75em;/*60px*/
}
	
label,
legend {
    display: inline-block;
    font-weight: 600;
}
		
input[type="checkbox"] {
    display: inline;
}
	
label span,
legend span {
    font-weight: normal;
    color: #444;
}
		
a, a:hover, a:link, a:visited
{
    color: #5e91ad;
    text-decoration: underline;
}	

a:visited
{
    color: #0560A6;
}

.errorMessage {
	color: #CC0000;
	font-weight:bold;
}
	
select.fieldError, input.fieldError {
	border:2px solid #CC0000;
}
	
.warningMessage {
color: #F27900;
font-weight: bold;
}

.frameBorder
{
     width:99%;
     margin:6px;   
}

/* #Layout */
/* ================================================== */        
#layout-wrapper
{
    height: 100%;
    background: #ccc;
}
	
.container
{
    width: 90%;
    margin: 0 auto !important;
    background: #fff;
    min-width:1100px;
}

.mainContent
{
    padding: 0 10px 10px 10px;
}

/* #Header */
/* ================================================== */  
.header {
    border-top: 8px solid #387fd1;
    border-left: 8px solid #387fd1;
    border-right: 8px solid #387fd1;
    background-image: url(../Images/HeaderBkgrnd.gif);
    height:50px
}

.hdContent1 {
    float:left;
    width:20%;
}

.hdContent2 {
    display: inline-block;
    margin:0 auto;
    width:68%;
    text-align:center;
    padding-top:10px;
}

.hdContent3 {
    float:right;
    width:10%;
    text-align:right;
    padding-top:10px;
}

/* #Menu Bar */
/* ================================================== */  
.menu
{
    background: #387fd1;
}

.mContent1
{
    float: left;
    position: relative;
    padding-top: 10px;
    padding-left:10px;
    text-align: left;
    clear:both;
}

.mContent2
{
    float: right;
    position: relative;
}

/* #Horizontal Tab Navigation */
/* ================================================== */  	
a.tab, a.tab:hover, a.tab:link, a.tab:visited
{
    color: #0560a6;
    text-decoration: none;
    white-space:nowrap;
}

.tdSelect
{
    border: #000 1px solid;
    background-color: #C5D6eB;
    padding:10px 6px;
}
	
.tdSelected
{
    border-right: #000 1px solid;
    border-top: #000 1px solid;
    border-left: #000 1px solid;
    background-color: #F0EEEE;
}

.tdAddBorder
{
    border: 1px solid #000;
}	

/* #Navigation Bar*/
/* ================================================== */ 
.nav
{
    position: relative;
    margin: 0;
    padding: 0;
    line-height: 22px;
    width:40em;
    top:-1px;
} 

.nav > li
{
    display: block;
    float: left; /* Displaying them on the same line */
    margin: 0;
    padding: 0;
    border-right:1px solid #fff;
}

.nav > li:last-child
{
    border: 0px;
}
 
/* The main navigation links */ 
.nav > li > a
{
    /* Nav Layout */
    display: block;
    position: relative;
    padding: 10px;
    color: #fff;
    text-decoration: none; /* Background */
} 
 
/* Changing the color on hover */ 
.nav > li > a:hover, .nav > li:hover > a
{
    color:#0048b3;
    background:#cce0ff;
    padding-bottom:10px;
} 
 
/* The links which contain dropdowns menu are wider, because they have a little arrow */ 

.nav > .dropdown > a
{
    padding: 10px 30px 10px 5px;
} 

/* The arrow indicating the dropdown */  
.dropdown > a::after
{
    content: "";
    position: absolute;
    top: 15px;
    right: 10px;
    width: 7px;
    height: 7px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;
} 
 
/* Changing the color of the arrow on hover */  
.dropdown > a:hover::after, .dropdown:hover > a::after
{
    border-color: #0052cc;
} 

/* The submenus */ 
.nav ul
{
    position: absolute;
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
    border: 1px solid #99c2ff;
}

/* General layout settings for the link containers of the submenus */ 
.nav ul li
{
    position: absolute;
    top: -9999px; /* Hiding them */
    height: 0px;
    display: block;
    margin: 0;
    padding: 0; /* Making them to expand their height with a transition, for a slide effect */
    -webkit-transition: height .2s ease-in;
    -moz-transition: height .2s ease-in;
    -o-transition: height .2s ease-in;
    -ms-transition: height .2s ease-in;
    border-bottom: 1px solid #fff;
}

.nav ul li:last-child
{
    border: 0px;
}

/* Displays the submenu links, by expading their containers (with a transition, previously defined) and by repositioning them */ 
.dropdown:hover > ul > li
{
    height: 32px;
    position: relative;
    top: auto;
} 

/* The submenu links */ 
.nav ul li a
{
    /* Layout */
    padding: 5px 20px;
    width: 120px;
    display: block;
    position: relative;
    color: #000;
    text-decoration: none;
    background:#e5f0ff;
    -webkit-transition: color .3s ease-in, background .3s ease-in;
    -moz-transition: color .3s ease-in, background .3s ease-in;
    -o-transition: color .3s ease-in, background .3s ease-in;
    -ms-transition: color .3s ease-in, background .3s ease-in;;
} 

/* Changing the link's color and background on hover */ 
.nav ul li:hover > a, .nav ul li a:hover
{
    color: #0048b3;
} 

/* Making the level 2 (or higher) submenus to appear at the right of their parent */ 
.nav ul .dropdown:hover ul
{
    left: 160px;
    top: 0px;
} 

/* The submenu links have a different arrow which indicates another dropdown submenu */ 
.nav ul .dropdown a::after
{
    width: 6px;
    height: 6px;
    border-bottom: 0;
    border-right: 1px solid #0066ff;
    border-top: 1px solid #0066ff;
    top: 12px;
} 

/* Changing the color of the arrow on hover */ 
.nav ul .dropdown:hover > a::after, .nav ul .dropdown > a:hover::after
{
    border-right: 1px solid #0048b3;
    border-top: 1px solid #0048b3;
} 

.tdMain
{
    border-right: #000 1px solid;
    border-left: #000 1px solid;
    border-bottom: #000 1px solid;
    background-color: #F0EEEE;
    padding:6px 0 0 0;
}

.tdTabBk
{
    background-color: #FDFDFD;
    border-bottom: #000 1px solid;
}

.tdPopUpTab
{
    background-color: #CCCCCC;
    border-bottom:#000 1px solid;
}

#btnEdit
{
    color: #0560A6;
    text-decoration: none;
    border: #0560a6 1px solid;
    padding: 2px;
    font-weight: Normal;
    background-color: #c5d6eb;
}

.Title
{
    font-weight: 600;
    font-size: 150%;
    color: #ffff99;
}

.GsgLabelHelp
{
    border: #000 1px solid;
    padding: 2px;
    background-color: #ffff99;
}

.DisabledLabel
{
    color: #ccc;
    visibility: visible;
}

.ErrorText
{
    color: #CC0033;
    font-size: 120%;
    font-weight: 600;
}

/* #IFRAME POPUP */
/* ================================================== */	
	
	#popUpDiv {
	    -webkit-overflow-scrolling: touch;
        overflow-y: scroll;
		display:none;
		margin:0;
		padding:0;
	}
	
	#popUpIframe {
		border:0;
		margin:0;
		padding:0; 
		width:100%;
		height:100%;
		min-height:500px; 	
	}
	
	#popUpDivFixed {
	    -webkit-overflow-scrolling: touch;
        overflow-y: no;
		display:none;
		margin:0;
		padding:0;
	}
	
	#popUpIframeFixed {
		border:0;
		margin:0;
		padding:0; 
		width:100%; 
		height:100%;	
	} 

     .printDropDown {
	    background-color: #EDEFF0;
	    border-bottom: #cccccc 1px solid;
	    }
	
    .printDropDownSub {
	    background-color: #EDEFF0;
	    border-bottom: #cccccc 1px solid;
	    }

/* #Login Page */
/* ================================================== */ 
.ulLogin label
{
    width:100px;
    display: inline-block;
    padding:3px;
    text-align: right;
}

.ulLogin li
{
    height: 3em;
}

.ulLogin li input[type="text"], input[type="password"]
{
    width: 200px;
    height:1.5em;
}

.ulLogin li span#lblLoginMsg
{
    display: inline-block;
    padding:10px 0 0 170px;
    color: #e60000;
}

.lblLoginRemember
{
    width:2px;
}

.loginIndent
{
    margin-left: 110px;
}

.loginCenter
{
    position: absolute;
    height: 200px;
    width: 400px;
    margin: -100px 0 0 -200px;
    top: 40%;
    left: 50%;
}

/* #Data Grid */
/* ================================================== */ 

.dataGrid
{
    width: 100%;
    background-color: #fff;
    border: 1px solid #484848;
}
	
.dataGrid-Item
{
    padding: 0;
    border: 1px solid #484848;
}
	 
.dataGrid-ItemAlt
{
    padding: 0;
    background-color: #f2f2f2;
    border: 1px solid #484848;
}

.dataGrid-Delete
{
    vertical-align: middle;
    background-color: Transparent;
    width: 16px;
    height: 16px;
}
	
.dataGrid-Header
{
    padding: 0 4px;
    font-weight: bold;
    border: 1px solid #666666;
    background-color: #C5D6eB;
    height: 40px;
}
	 
.dataGrid-Footer
{
    background-color: #484848;
}

/* #Grid Content*/
/* ================================================== */ 

.gridContent {
    height:45px;
    width:100%;
}

.gdContent1 {
    float:left;
    padding-top:5px;
}

.gdContent1Fixed
{
  width:300px;  
}

.gdContent2
{
    display: inline-block;
    margin: 0 auto;
    padding-top:10px;
}

.gdContent3 {
    float:right;
    text-align:right;
    padding-top:5px;
}

.gdContent3Fixed
{
  width:200px;  
}

.gridFooter
{
    width: 100%;
    text-align: right;
    padding-top: 5px;
}

.gridSubmit
{
    width: 100%;
    text-align: center;
    padding-top: 5px;
}

/* #MANAGECOMPANIES.ASPX */
/* ================================================== */ 

.dvMCTopMessage 
{
    width:10%;
    margin:0 auto;
}

/* #INVOICING.ASPX */
/* ================================================== */
 
.tdInvoiceHeader
{
    border-bottom: #000 1px solid;
    background-color: #C5D6eB;
    padding:6px;
    height:30px;
}

/* #MANAGEPRICEGROUPS.ASPX */
/* ================================================== */ 

.dvpriceGroupGrid
{
    margin-bottom:1em;
}

/* #MANAGEDIVISION.ASPX */
/* ================================================== */ 

input[type="submit"].btnDivisionAdd
{
  margin:10px 0;
  border:1px solid #000;   
}

.GridHeader {
     width:100%;
     padding:0;
     margin:0;
}
	
.GridHeader  ul {
    list-style: none;
    display:inline-block;
    width:100%;
    padding:0;
    margin: 0.5em 0;	
}

.GridHeader ul li {
    display:inline-block;
    width:33%;
    text-align: center;
}

.GridHeader ul > li:first-child
{
    text-align: left;
}

.GridHeader ul > li:last-child 
{
    text-align: right;
}

.GridHeader li label 
{
    padding: 0 6px 0 3px;
    font-weight:normal;
}

.CustGridHeader {
     width:100%;
     padding:0;
     margin:0;
}
	
.CustGridHeader  ul {
    list-style: none;
    display:inline-block;
    width:100%;
    padding:0;
    margin: 0.5em 0;	
}


.CustGridHeader ul li {
    display:inline-block;
    width:49.7%;
}

.CustGridHeader ul > li:first-child
{
    text-align: left;
}

.CustGridHeader ul > li:last-child 
{
    text-align: right;
}


.prodGridHeader {
     width:100%;
     padding:0;
     margin:0;
}
	
.prodGridHeader  ul {
    list-style: none;
    display:inline-block;
    width:100%;
    padding:0;
    margin: 0.5em 0;	
}

.prodGridHeader ul li {
    display:inline-block;
    width:29.5%;
    text-align: center;
}

.prodGridHeader ul > li:first-child
{
    text-align: left;
    width:40%;
}

.prodGridHeader ul > li:last-child 
{
    text-align: right;
}

.prodGridHeader li label 
{
    padding: 0 6px 0 3px;
    font-weight:normal;
}

.prodGridHeader li label 
{
    padding: 0 6px 0 3px;
    font-weight:normal;
}

/* #RECEIVING.ASPX */
/* ================================================== */ 

.ReservedProductReceiving
{
    border: 1px solid red;
    font-style: italic;
}

	 
/* #MANAGEORDERDETAILSEDIT.ASPX */
/* ================================================== */ 

.orderDetailsCCode
{
    width: 18em;
}

.orderDetailsTitle
{
    padding: 0 0 0 6em;
    text-align:center;
    width: 90%;
}

.pnlOrderDetails
{
    width: 100%;
    margin: 0 5% !important;
}

.tblConfirmPanel
{
    border: #000 1px solid;
    background-color: #F0EEEE;
    padding:6px 0 0 0;
    margin:0 0 0.5em 0;
}

/* #MANAGEPRODUCTATTRIBUTES.ASPX */
/* ================================================== */ 

.tblAttributes
{
    width: 1000px;
    margin: 0 auto !important;
    padding: 0 0 1em 0;
}

.divAddCells
{
    visibility: hidden;
    position: absolute;
    width: 100%;
}

/* #MAIN.ASPX */
/* ================================================== */ 

.ulMain
{
    list-style-type: none;
}

.ulMain li
{
    padding: 0.5em 0;
    font-size: 1.4em;
}

.dvMainCenter
{
    text-align: center;
}

.dvMainUser
{
    text-align: left;
    font-size:1.4em;
    }
    
img.imgPreviewSm 
{
    width:100px;
    height:auto;
    }   

img.imgPreviewLg 
{
  width:200px;
  height:auto;  
}


    .tdInvoice {
    border: #000 1px solid;
    background-color: #C5D6eB;
    padding:6px;
    }

/* #INVOICINGPOST.ASPX */
/* ================================================== */	
    .dvPrintInvoice {
        position: relative;
        display: inline-block;
    }

    .dvPrintInvoice-Content {
        display: none;
        left:15px;
        position: absolute;
        background-color: #f9f9f9;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        padding: 6px 12px;
        min-width:120px;
        z-index: 10;
    }

    a.hlGoPrint {
     font-size:1.2em;
     text-decoration:none;
    }

    .pIDropdown {
        text-align:center;
        display:inline-block;
        width:100%;
        padding-top:5px;
    }

    .pICloseWindow {
        width:48%;
        text-align:right;
        float:left;
    }

    .pIPrintInvoice {
       width:48%;
       text-align:left;
       float:left;
    }
    
/* #MANAGECUSTOMEREDIT.ASPX */
/* ================================================== */
    .LargeSelectClass {
        width:235px;
        font-size:12px;
    }
	
    .tdAdvAdminMnu {
        border-bottom: black 1px solid
    }

/* #MANAGEPRODUCTSEDIT.ASPX */
/* ================================================== */

    .manageProductsInput
    {
        width:250px;
    }

    .manageProductsInputSm
    {
        width:75px;
    }

    .manageProductsLabel 
    {
        width:30%;
        text-align:right;
    }

/* #MANAGEORDERSEDIT.ASPX */
/* ================================================== */

    .showTrackingNumbers {
        display:none;
    }

/* #MANAGEORDERDETAILS.ASPX */
/* ================================================== */
    div.buttonmenu {
        position:absolute;
        z-index:20;
        border:solid 1px #666666;
        background-color:#fff;
        visibility:hidden;
    }


/* #INVOICEMISCITEMS.ASPX */
/* ================================================== */
	.invMiscItemsPanel {
		display: none;
		width:95%;
		border: 1px solid #888888;
		-moz-border-radius: 0.375em;/*3px*/
		-webkit-border-radius: 0.375em;
		border-radius: 0.375em;
		color: #444;
		display: inline-block;
		text-decoration: none;
		padding:0.8em;
        margin:0 0.4em;
	}