@import url(../StyleSheet.css);
@import url(../Shared/StyleSheet.css);

body 
{
    magin: 0 0 50px 0;
    text-align: center;
    background: #fff;
}

input.button 
{
    border-color: #d9b555;
    background-color: #FFE49D;
    background-image: url(Canvas/ButtonSync.gif);
    color: #860;
}
#canvas 
{
    width: 960px;
    margin: 0 auto;
    text-align: left;
}
#content { width: 100%; overflow: hidden; margin: 0 0 15px 0; }

/**** Header Area **********************************************************/
#header 
{
    background: url(Header/BgSync.jpg) top repeat-x;
    width: 100%;
    overflow: hidden;
    height: 81px;
    margin-bottom: 3px;
}
#header a { color: #55a9f6; }
#headerLogo { float: left; width: 509px; }
#headerLogo a 
{
    display: block;
    width: 509px;
    height: 81px;
    background: url(Header/Logo.jpg) top left no-repeat;
    overflow: hidden;
    text-indent: -9999px;
}
#header fieldset, #topTool fieldset { padding: 0; border: 0; }

/**** Login pane ************************************************************/
#headerLoginPane { float: right; width: 401px; padding: 10px 10px 0 0; text-align: right; color: #ffe59d; }
#headerLoginPane fieldset { float: right; }
#headerLoginPane fieldset label { padding: 4px !important; margin: 0; font-size: 13px; color: #999; }
#headerLoginPane fieldset input.password { width: 146px; margin-right: 5px; }
#headerLoginPane fieldset input.username { width: 200px; }
#headerLoginPane fieldset input.textInput { padding: 3px; }
#headerLoginPane fieldset td { font-size: .9em; padding: 2px; }
#headerLoginPane fieldset td input { float: left; vertical-align: middle; }
#headerLoginPane .content { padding: 10px 0 0 0; }
#headerLoginPane .content p { margin: 0 0 5px 0; }

/**** Top Toolbar ***********************************************************/
#topTool 
{
    background: url(TopTool/Bg.jpg) top center no-repeat;
    height: 56px;
    position: relative;
    z-index: 500;
}

/**** Main Toolbar **********************************************************/
ul#mainTool, ul#mainTool li, ul#mainTool ul { margin: 0; padding: 0; list-style-type: none; }
ul#mainTool 
{
    position: absolute;
    top: 0;
    left: -13px;
    width: 960px;
}
ul#mainTool li 
{
    float: left;
    position: relative;
    margin: 0 20px 0 0;
}
ul#mainTool li a  
{
    display: block;
    padding: 15px 15px 13px 15px;
    background: transparent;
    position: relative;
    z-index: 515;
    border-color: #ffe793;
    border-style: solid;
    overflow: hidden;
    height: 28px;
    float: left;
}
ul#mainTool li a:hover 
{
    border-width: 2px;
    padding: 13px 13px 7px 13px;
}
ul#mainTool li.active a, ul#mainTool li a:hover
{
    background: #fff9e6 url(MainTool/MenuItemBg.gif) top repeat-x;
}
ul#mainTool li.active a
{
    border-width: 2px 2px 0 2px; 
    padding: 13px;
}

ul#mainTool li.selected a img
{
    position: relative;
    top: -51px;
}
ul#mainTool li.active a img 
{
    position: static;
}
ul#mainTool .subMenu 
{
    position: absolute;
    top: 54px;
    left: 0;
    z-index: 510;
}
ul#mainTool .subMenu ul 
{
    background: #fff9e6;
    border-color: #ffe793;
    border-style: solid;
    border-width: 2px;
    width: 175px;
    padding: 20px 10px 0 10px;
}
ul#mainTool .subMenu ul li 
{
    float: none;
    position: static;
    margin: 0 0 10px 0;
    width: 160px;
    background: url(MainTool/SubMenuArrow.gif) 0 4px no-repeat;
    padding: 0 0 0 10px;
}
ul#mainTool .subMenu ul li a, ul#mainTool .subMenu ul li a:hover
{
    color: #1f508f;
    border: 0;
    padding: 0;
    background: none;
    float: none;
    height: auto;
}

/**** Search Pane ******************************************************/
#searchPane 
{
    position: absolute;
    top: 0;
    right: 0;
    width:212px;
    padding: 15px 0;
}
#searchPane input { float: left; }
#searchPane input.searchText { width: 175px; padding: 3px; }
#searchPane fieldset { float: right; }
#searchPane fieldset label { padding: 4px; font-size: 13px; color: #999; }

/**** Footer ***********************************************************/
#footer 
{
    border-top: 1px solid #ccc;
    padding: 10px 0;
    width: 100%;
    overflow: hidden;
    color: #858585;
}
#footer ul.links, #footer ul.links li { margin: 0; padding: 0; list-style-type: none; }
#footer ul.links { float: right; }
#footer ul.links li  
{
    float: left;  
    border-right: 1px solid #2084dd;
    margin-right: 10px;
    padding-right: 10px;
}
#footer ul.links li.last { margin-right: 0; padding-right: 0; border-right: 0; }
#footer .copyright { float: right; padding: 0 0 0 20px; }

/**** Main Image ***********************************************/
#mainBannerImage { margin: 0 0 10px 0; }

/**** Blue button ***********************************************/
a.blueButton {
  background-color: #0f5aa0;
  position: relative;
  font-size: 1em;
  margin:0;
  text-decoration: none;
  color:#fff;
  overflow: hidden;
}
a.blueButton, a.blueButton b, a.cssButton span { display:inline-block; cursor:pointer;}
/* text layer ***/
a.blueButton b {
color:#fff;
padding: .4em 1em;
vertical-align: middle;
white-space: nowrap;
position: relative;
z-index: 10;
text-align: center;  
}
/* highlight layer ****/
a.blueButton span { 
	background-color: #1e6cb2; 
	position: absolute;
	top: 0;
	left: 0;
	height: .9em;
	right: 0;
	width: 100%;
	border-bottom: 2px solid #1663a9;
	overflow: hidden;
	z-index: 9;
}
a.blueButton:hover {background-color:   #1e6cb2;}
a.blueButton:hover span {background-color: #0f5aa0;}


/*** Body ****************************************************************/
#body 
{
    width: 740px;
    float: right;
}

/**** Pager Table ********************************************************/
table.pagerFrame { border-collapse: collapse; width: 100%; }
table.pagerFrame th, table.pagerFrame td { padding: 6px 12px; }
table.pagerFrame th { background: #d1e4f5; text-align: left; font-size: 1.1em; }
table.pagerFrame th a { color: #333; }
table.pagerFrame tr.alternate td, table.pagerFrame tr td.alternate { background: #edf6ff; }
table.pagerFrame td a { font-weight: bold; }

/**** Product Table ********************/
#productCatalog { border-color: #4D8FD6; }
#productCatalog .productOptions { background-color: #EAF3FA; }

/**** Modal ******************************/
#windowHeader { background-image: url(Canvas/PrintLogo.gif); }