/********* Grid Express Styles *********/

.frameScroll
{
	margin:0px;
	padding:0px;
}

.mainGrid
{
	background-color:#fff;
}

.gridRow 
{	
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#333333;
	height:18px;
	border-top:0px;
	border-left:0px;
	border-bottom:1px solid #d5d5d5;
	border-right:0px;
}



.gridRowError
{
	background-color:#fff;
}

.gridCell
{
	font-size:10px;
	height:12px;
	border-top:0px;
	border-left:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
}

.gridCellPrice
{
	font-size:10px;
	height:12px;
	border-left:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
	color:#e22927;
}

.gridCellHighlight
{
	font-size:10px;
	height:12px;
	border-left:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
	background-color:#ffffe1;
}


.gridCellPriceQty
{
	font-size:10px;
	height:12px;
	border-left:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
	background-color:#fff;
}

.gridCellPriceQtyPrice
{
	font-size:10px;
	height:12px;
	border-left:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
	background-color:#fff;
	color:#ee1c24;
}

.gridCellPriceQtySelected
{
	font-size:10px;
	height:12px;
	border-left:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
	background-color:#ffffe1;
}

.gridCellPriceQtyPriceSelected
{
	font-size:10px;
	height:12px;
	border-left:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
	color:#ee1c24;
	background-color:#ffffe1;
}

.gridCellInput
{
	border-left:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	border-right:1px solid #d5d5d5;
	background-color:#fff;
	font-size:10px;
	height:12px;
}

.gridCellError {
	background-color:#ff9b9d;
	cursor:pointer;
}

.GridInputButton
{
  border-right: #5c5c5c 1px solid; 
  padding-right: 3px; 
  border-top: #5c5c5c 1px solid; 
  padding-left: 3px; 
  font-size: 9px; 
  padding-bottom: 2px; 
  border-left: #5c5c5c 1px solid; 
  color: #FFFFFF; 
  padding-top: 2px; 
  border-bottom: #5c5c5c 1px solid; 
  font-size:10px;
  font-family:Arial;
  height: 19px; 
  background-color: #5c5c5c;
}

.gridInput
{
  border:0;
  height:12px;
  width:100%;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#000;
  background-color:Transparent;
}

.gridInputComment
{
  border:1px solid #d5d5d5;
  height:12px;
  width:100%;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#000;
  background-color:#ffffff;
	
}

.gridText
{
  border:0;
  height:12px;
  width:100%;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#000;
  vertical-align:middle;
  overflow:hidden;
  cursor:default;
}

.gridTextPrice
{
  border:0;
  height:12px;
  width:100%;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#ee1c24;
  vertical-align:middle;
  overflow:hidden;
  cursor:default;
}

.gridTextCode
{
  border:0;
  height:12px;
  width:82px;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#000;
  vertical-align:middle;
  overflow:hidden;
  cursor:default;
}

.gridTextBold
{
  border:0;
  height:12px;
  width:100%;
  font-size:10px;
  font-family:Arial;
  font-weight:bold;
  color:#000;
  vertical-align:middle;
  overflow:hidden;
  cursor:default;
}

.gridTextComment
{
  border:0;
  height:12px;
  width:100%;
  font-size:10px;
  font-family:Arial;
  font-weight:bold;
  color:#000;
  vertical-align:middle;
  cursor:default;
}

.gridTextCommentCommand
{
  border:0;
  height:12px;
  width:100%;
  font-size:10px;
  font-family:Arial;
  font-weight:bold;
  color:#2f4762;
  vertical-align:middle;
  text-decoration:underline;
  cursor:default;
}

.productTileLink
{
  font-family:Arial;
  font-size:10px;
  font-weight:normal;
  color:#909090;
}

a.productTileLink:link
{
  font-family:Arial;
  font-size:10px;
  font-weight:normal;
  color:#909090;
  text-decoration:underline;
}

a.productTileLink:active
{
  font-family:Arial;
  font-size:10px;
  font-weight:normal;
  color:#909090;
  text-decoration:underline;
}

a.productTileLink:visited
{
  font-family:Arial;
  font-size:10px;
  font-weight:normal;
  color:#909090;
  text-decoration:underline;
}

a.productTileLink:hover
{
  font-family:Arial;
  font-size:10px;
  font-weight:normal;
  color:#909090;
  text-decoration:none;
}

.coverDiv
{
  display:;
  z-index:2;
  top:0;
  left:0;
  width:100%;
  height:100%;
  position:absolute;
  filter:Progid:DXImageTransform.Microsoft.Alpha(opacity=00);
  -moz-opacity:0.01;
  -khtml-opacity: 0.01;
  opacity: 0.01;


}

.loadingDiv
{
  display:;
  z-index:4;
  top:0;
  left:0;
  width:100%;
  height:100%;
  position:absolute;
  background-color:#fff;
}

.loadingSpan
{
  font-size:11px;
  font-family:Arial;
  font-weight:bold;
  color:#000;
}

.listDiv
{
  z-index:3;
  position:absolute;
  overflow-y:scroll;
  overflow-x:hidden;
  background-color:#fff;
}

.listCell
{
  overflow:hidden;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#000;
}


.listCellPrice
{
  overflow:hidden;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#ee1c24;
}


.commentDiv
{
  z-index:3;
  position:absolute;
  border-color:#d5d5d5;
  border-width:1;
  border-style:solid;
  background-color:#f4f8fb;
}

.commentDivRow
{
	background-color:#f4f8fb;
	border:1px solid #d5d5d5;
}

.listMain
{
  cursor:pointer;
  background-color:#fff;
  border:1px solid #d5d5d5;
}

.listPriceQty
{
	background-color:#fff;
}

.listRow
{
  background-color:#fff;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#000;
}

.listRowSelected
{
  background-color:#ffffe1;
  font-size:10px;
  font-family:Arial;
  font-weight:normal;
  color:#d2dadc;
}

.listDivPriceQty
{
  overflow-y:scroll;
  overflow-x:hidden;
  background-color:#fff;
  border:1px solid #d5d5d5;
}

.mainContent
{
    border:1px solid #d5d5d5;
    background-color:#fff;
}

/***************************************/
/*	ORDER EXPRESS BUTTONS	*/
/* 
        root element for the scrollable. 
        when scrolling occurs this element stays still. 
    */ 
    div.scrollable { 
     
        /* required settings */ 
        position:relative; 
        overflow-x:hidden; 
        width: 100%; 
	height:125px;
    } 
     
    /* 
        root element for scrollable items. Must be absolutely positioned 
        and it should have a extremely large width to accomodate scrollable items. 
        it's enough that you set width and height for the root element and 
        not for this element. 
    */ 
    div.scrollable div.items { 
        /* this cannot be too large */ 
        width:20000em; 
        position:absolute; 
    } 
     
    /* 
        a single item. must be floated in horizontal scrolling. 
        typically, this element is the one that *you* will style 
        the most. 
    */ 
    div.scrollable div.items div { 
        float:left; 
    } 
     
    /* you may want to setup some decorations to active the item */ 
    div.items div.active { 
        border:1px inset #ccc; 
        background-color:#fff; 
    }
    
        /* this makes it possible to add next button beside scrollable */
    .scrollable {
	    float:left;	
    }

    /* prev, next, prevPage and nextPage buttons */
    a.browse {
	    display:block;
	    width:17px;
	    height:32px;
	    float:left;
	   /* margin:40px 10px;*/
	    cursor:pointer;
	    font-size:1px;
    }

    /* right */
    a.right 				{background-image:url(/ecom_theme/img/orderExpressArrowRight.gif); background-position:top left; margin-left: 0px; float:right;}
    a.right:hover 		{ }
    a.right:active 	{ } 


    /* left */
    a.left				{ background-image:url(/ecom_theme/img/orderExpressArrowLeft.gif); background-position:top left; margin-left: 0px; } 
    a.left:hover  		{  }
    a.left:active  	{  }

    /* up and down */
    a.up, a.down		{  
	    float: none;
	    margin: 10px 50px;
    }

    /* up */
    a.up:hover  		{ background-position:-30px 0; }
    a.up:active  		{ background-position:-60px 0; }

    /* down */
    a.down 				{ background-position: 0 -30px; }
    a.down:hover  		{ background-position:-30px -30px; }
    a.down:active  	{ background-position:-60px -30px; } 


    /* disabled navigational button */
    a.disabled {
	    background-position:bottom;	
    }
    
    
    /*
	    root element for the scrollable.
	    when scrolling occurs this element stays still.
    */
    .scrollable {

	    /* required settings */
	    position:relative;
	    overflow:hidden;
	    width: 680px;
	    height:125px;

	    /* custom decorations */
	    border:1px solid #d5d5d5;
    }

    /*
	    root element for scrollable items. Must be absolutely positioned
	    and it should have a extremely large width to accomodate scrollable items.
	    it's enough that you set the width and height for the root element and
	    not for this element.
    */
    .scrollable .items {
	    /* this cannot be too large */
	    width:20000em;
	    position:absolute;
	    clear:both;
    }

    /* single scrollable item */
    .scrollable img {
	border:1px solid #d5d5d5;
    }

    /* active item */
    .scrollable .active {
	    border:2px solid #000;
	    z-index:9999;
	    position:relative;
    }
    
    #oProductRelationMain
     {
       list-style:none;
       margin:0px;
       padding:0px;
       }
       
     #oProductRelationMain li
     {
       width:120px;
       text-align:center;
       float:left;
       
	     margin-left:5px;
	     margin-right:5px;
		margin-top:5px;
       padding-left:5px;
       padding-right:5px;
       }
	   
	 #divComplementaryProduct{
	width:450px;
	}

	div#divErrorGridContainsErrors {
    background-color:#ffffe1;
    Border:2px solid #ff2c2c;
    z-index:999;
    position:absolute;
    width:540px;
    height:70px;
}