styles.css

For CSS, this is to use for ComponetOne menu s skin

/*Dock horizontally*/
.C1Window_ArcticFox
{
  float:left;
}

/*Invisible items*/
.C1Window_ArcticFox .C1wInvisible
{
  display:none;
}

.C1Window_ArcticFox .c1-resize-handle
{
  display:none;
  font-size: 0.1px;
  position:absolute;
}

/*
  Fix IE7 hover bug.
  If handle dosen't have a background-color or background-image, when hovering cursor dosen't change to desired cursor.
*/
*:first-child+html .C1Window_ArcticFox .c1-resize-handle
{
  background: transparent url('Images/blank.gif') repeat-x repeat-y;
}

.C1Window_ArcticFox .C1wResizer-proxy
{
  border:dashed 1px black; 
}

.C1Window_ArcticFox .C1wResizer-n
{
  cursor:n-resize;
  height:6px;
  left:0px;
  top:0px;
  width:100%;
}

.C1Window_ArcticFox .C1wResizer-e
{
  cursor:e-resize;
  height:100%;
  right:0px;
  top:0px;
  width:6px;
}

.C1Window_ArcticFox .C1wResizer-s
{
  cursor:s-resize;
  bottom:0px;
  height:6px;
  left:0px;
  width:100%;
}

.C1Window_ArcticFox .C1wResizer-w
{
  cursor:w-resize;
  height:100%;
  left:0px;
  top:0px;
  width:6px;
}

.C1Window_ArcticFox .C1wResizer-se
{
  background:transparent url('Images/resizehandle.gif') left top no-repeat;
  cursor:se-resize;
  width:18px;
  height:17px;
  bottom:0px;
  right:0px;
}

/*
  Fix IE7 hover bug.
  If handle dosen't have a background-color or background-image, when hovering cursor dosen't change to desired cursor.
*/
*:first-child+html .C1Window_ArcticFox .C1wResizer-se
{
  background:transparent url('Images/resizehandle.gif') left top no-repeat;
}

.C1Window_ArcticFox .C1wResizer-sw
{
  bottom:0px;
  cursor:sw-resize;
  height:9px;
  left:0px;
  width:9px;
}

.C1Window_ArcticFox .C1wResizer-ne
{
  bottom:0px;
  cursor:ne-resize;
  height:9px;
  right:0px;
  top:0px;
  width:9px;
}

.C1Window_ArcticFox .C1wResizer-nw
{
  bottom:0px;
  cursor:nw-resize;
  height:9px;
  left:0px;
  top:0px;
  width:9px;
}

/*---remove bar when toggled and minimized----*/
.C1Window_ArcticFox .C1wClosed .C1wFooter .C1wOuter .C1wInner .C1wContent {height: 4px; margin-top: -2px;}
.C1Window_ArcticFox .C1wMinimized .C1wFooter .C1wOuter .C1wInner .C1wContent {height: 4px; 	margin-top: -2px; }
* HTML .C1Window_ArcticFox .C1wClosed .C1wFooter .C1wOuter .C1wInner .C1wContent{	height: 4px; margin-top: -2px; }
* HTML .C1Window_ArcticFox .C1wMinimized .C1wFooter .C1wOuter .C1wInner .C1wContent{height: 4px; 	margin-top: -2px; }

.C1Window_ArcticFox .C1wClosed .C1wFocus .C1wFooter .C1wOuter .C1wInner .C1wContent{height: 4px; margin-top: -2px;}
.C1Window_ArcticFox .C1wMinimized .C1wFocus .C1wFooter .C1wOuter .C1wInner .C1wContent{height: 4px; margin-top: -2px;}
* HTML .C1Window_ArcticFox .C1wClosed .C1wFocus .C1wFooter .C1wOuter .C1wInner .C1wContent {height: 4px;  margin-top: -2px;}
* HTML .C1Window_ArcticFox .C1wMinimized .C1wFocus .C1wFooter .C1wOuter .C1wInner .C1wContent{height: 4px; margin-top: -2px;}


/*Unfocused heading*/
.C1Window_ArcticFox .C1wHeading .C1wOuter
{
  background:transparent url('Images/title_left_unfocused.gif') no-repeat scroll left top;
  padding-left: 5px;
  overflow:hidden;
}

.C1Window_ArcticFox .C1wHeading .C1wInner
{
  background:transparent url('Images/title_right_unfocused.gif') no-repeat scroll right top;
  padding-right:5px;
}

.C1Window_ArcticFox .C1wHeading .C1wContent
{
  background:transparent url('Images/title_center_unfocused.gif') repeat-x scroll left top;
  padding: 0px 0px 0px 0px;
  height: 30px;
  text-align:left;
}

/*Focused heading*/
.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wOuter
{
  background:transparent url('Images/title_left.gif') no-repeat scroll left top;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wInner
{
  background:transparent url('Images/title_right.gif') no-repeat scroll right top;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wContent
{
  background:transparent url('Images/title_center.gif') repeat-x scroll left top;
}

/*Maximized heading*/
.C1Window_ArcticFox .C1wFocus-Maximized .C1wHeading .C1wOuter
{
  background-image: none;
  padding-left:0px;
}

.C1Window_ArcticFox .C1wFocus-Maximized .C1wHeading .C1wInner
{
  background-image: none;
  padding-right:0px;
}

.C1Window_ArcticFox .C1wFocus-Maximized .C1wHeading .C1wContent
{
  background:transparent url('Images/title_center_maximize.gif') repeat-x scroll left top;
}

.C1Window_ArcticFox .C1wHeading .C1wTextNode-Outer
{
  float: left;
}

/*Unfocused heading text node*/
.C1Window_ArcticFox .C1wHeading .C1wTextNode
{
  font-family: System;
  font-size: 12px;
  color: #000000;
  -moz-user-select: none;
  -khtml-user-select: none;
  line-height:30px;
  padding-left:2px;
}

/*Focused heading text node*/
.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wTextNode
{
  color:#767676;
}

/*Maximized heading text node*/
.C1Window_ArcticFox .C1wFocus-Maximized .C1wHeading .C1wTextNode
{
  color: #FFFFFF;
}

/*Caption Icon*/
.C1Window_ArcticFox .C1wHeading .C1wIcon
{
  float:left;
  width:16px;
  height:16px;
  margin-top:7px;
}

/*Caption buttons*/
.C1Window_ArcticFox .C1wHeading .C1wList .C1wListItem
{
  background:transparent url('Images/Tool-Sprites.gif') no-repeat scroll left top;
  cursor:pointer;
  float:left;
  overflow:hidden;
  height: 16px;
  width: 18px;
  margin-left:1px;
}

.C1Window_ArcticFox .C1wHeading .C1wControlBox
{
  float:right;
  margin-top:7px;
  height:16px;
  overflow:hidden;
}

.C1Window_ArcticFox .C1wHeading .C1wList .C1wCloser
{
  background-position: 0px 0px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wCloser
{
  background-position: -18px 0px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wCloser-Hover,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wCloser-Hover
{
  background-position:-36px 0px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wCloser-Active,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wCloser-Active
{
  background-position:-54px 0px;
}

.C1Window_ArcticFox .C1wHeading .C1wList .C1wMaximizer
{
  background-position : 0px -25px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wMaximizer
{
  background-position : -18px -25px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wMaximizer-Hover,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wMaximizer-Hover
{
  background-position: -36px -25px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wMaximizer-Active,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wMaximizer-Active
{
  background-position: -54px -25px;
}

.C1Window_ArcticFox .C1wMaximized .C1wHeading .C1wList .C1wMaximizer
{
  background-position: 0px -50px;
}

.C1Window_ArcticFox .C1wFocus-Maximized .C1wHeading .C1wList .C1wMaximizer
{
  background-position: -18px -50px;
}

.C1Window_ArcticFox .C1wFocus-Maximized .C1wHeading .C1wList .C1wMaximizer-Hover,
.C1Window_ArcticFox .C1wMaximized .C1wHeading .C1wList .C1wMaximizer-Hover
{
  background-position: -36px -50px;
}

.C1Window_ArcticFox .C1wFocus-Maximized .C1wHeading .C1wList .C1wMaximizer-Active,
.C1Window_ArcticFox .C1wMaximized .C1wHeading .C1wList .C1wMaximizer-Active
{
  background-position: -54px -50px;
}

.C1Window_ArcticFox .C1wHeading .C1wList .C1wMinimizer
{
  background-position: 0px -75px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wMinimizer
{
  background-position: -18px -75px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wMinimizer-Hover,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wMinimizer-Hover
{
  background-position: -36px -75px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wMinimizer-Active,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wMinimizer-Active
{
  background-position: -54px -75px;
}

.C1Window_ArcticFox .C1wMinimized .C1wHeading .C1wList .C1wMinimizer
{
  background-position: 0px -50px;
}

.C1Window_ArcticFox .C1wFocus-Minimized .C1wHeading .C1wList .C1wMinimizer
{
  background-position: -18px -50px;
}

.C1Window_ArcticFox .C1wFocus-Minimized .C1wHeading .C1wList .C1wMinimizer-Hover,
.C1Window_ArcticFox .C1wMinimized .C1wHeading .C1wList .C1wMinimizer-Hover
{
  background-position: -36px -50px;
}

.C1Window_ArcticFox .C1wFocus-Minimized .C1wHeading .C1wList .C1wMinimizer-Active,
.C1Window_ArcticFox .C1wMinimized .C1wHeading .C1wList .C1wMinimizer-Active
{
  background-position: -54px -50px;
}

.C1Window_ArcticFox .C1wHeading .C1wList .C1wToggler
{
  background-position: 0px -100px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wToggler
{
  background-position: -18px -100px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wToggler-Hover,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wToggler-Hover
{
  background-position: -36px -100px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wToggler-Active,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wToggler-Active
{
  background-position: -54px -100px;
}

.C1Window_ArcticFox .C1wClosed .C1wHeading .C1wList .C1wToggler
{
  background-position: 0px -125px;
}

.C1Window_ArcticFox .C1wFocus-Closed .C1wHeading .C1wList .C1wToggler
{
  background-position: -18px -125px;
}

.C1Window_ArcticFox .C1wFocus-Closed .C1wHeading .C1wList .C1wToggler-Hover,
.C1Window_ArcticFox .C1wClosed .C1wHeading .C1wList .C1wToggler-Hover
{
 background-position : -36px -125px;
}

.C1Window_ArcticFox .C1wFocus-Closed .C1wHeading .C1wList .C1wToggler-Active,
.C1Window_ArcticFox .C1wClosed .C1wHeading .C1wList .C1wToggler-Active
{
  background-position: -54px -125px;
}

.C1Window_ArcticFox .C1wHeading .C1wList .C1wReloader
{
  background-position: 0px -150px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wReloader
{
  background-position: -18px -150px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wReloader-Hover,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wReloader-Hover
{
  background-position: -36px -150px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wReloader-Active,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wReloader-Active
{
  background-position: -54px -150px;
}

.C1Window_ArcticFox .C1wHeading .C1wList .C1wPinner
{
  background-position: 0px -175px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wPinner
{
  background-position: -18px -175px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wPinner-Hover,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wPinner-Hover
{
  background-position: -36px -175px;
}

.C1Window_ArcticFox .C1wFocus .C1wHeading .C1wList .C1wPinner-Active,
.C1Window_ArcticFox .C1wHeading .C1wList .C1wPinner-Active
{
  background-position: -54px -175px;
}

.C1Window_ArcticFox .C1wPinned .C1wHeading .C1wList .C1wPinner
{
  background-position: 0px -200px;
}

.C1Window_ArcticFox .C1wFocus-Pinned .C1wHeading .C1wList .C1wPinner
{
  background-position: -18px -200px;
}

.C1Window_ArcticFox .C1wFocus-Pinned .C1wHeading .C1wList .C1wPinner-Hover,
.C1Window_ArcticFox .C1wPinned .C1wHeading .C1wList .C1wPinner-Hover
{
  background-position: -36px -200px;
}

.C1Window_ArcticFox .C1wFocus-Pinned .C1wHeading .C1wList .C1wPinner-Active,
.C1Window_ArcticFox .C1wPinned .C1wHeading .C1wList .C1wPinner-Active
{
  background-position: -54px -200px;
}

/*Unfocused Content*/
.C1Window_ArcticFox .C1wContentPanel .C1wOuter
{
  background:transparent url('Images/content_left_unfocused.gif') repeat-y scroll left top;
  padding-left:5px;
}

.C1Window_ArcticFox .C1wContentPanel .C1wInner
{
  background:transparent url('Images/content_right_unfocused.gif') repeat-y scroll right top;
  padding-right:5px;
}

.C1Window_ArcticFox .C1wContentPanel .C1wContent
{
}

.C1Window_ArcticFox .C1wContentPanel .C1wContentTemplate
{
  background:#FFFFFF;
  font-size:12px;
}

/*Focused Content*/
.C1Window_ArcticFox .C1wFocus .C1wContentPanel .C1wOuter
{
  background:transparent url('Images/content_left.gif') repeat-y scroll left top;
  padding-left:5px;
}

.C1Window_ArcticFox .C1wFocus .C1wContentPanel .C1wInner
{
  background:transparent url('Images/content_right.gif') repeat-y scroll right top;
  padding-right:5px;
}

/*Maximized Content*/
.C1Window_ArcticFox .C1wMaximized .C1wContentPanel .C1wOuter
{
  background-image: none;
  padding-left:0px;
}

.C1Window_ArcticFox .C1wMaximized .C1wContentPanel .C1wInner
{
  background-image: none;
  padding-right:0px;
}

.C1Window_ArcticFox .C1wContentPanel .C1wStatusBar
{
  background:transparent url('Images/status.gif') repeat-x scroll 0pt top;
  height:30px;
}

.C1Window_ArcticFox .C1wContentPanel .C1wSpinner
{
  height:16px;
  width:16px;
  background:url('Images/loading.gif') no-repeat;
  float:left;
  margin: 8px 0 0 5px;
}

.C1Window_ArcticFox .C1wContentPanel .C1wSpinnerContainer
{
  height:30px;
  width:30px;
  background:url('Images/status_separator.gif') no-repeat;
  background-position:right;
  float:left;
}

.C1Window_ArcticFox .C1wContentPanel .C1wStatusTemplate
{
  line-height:30px;
  font-size:12px;
}

/*Unfocues footer*/
.C1Window_ArcticFox .C1wFooter .C1wOuter
{
  background:transparent url('Images/footer_left_unfocused.gif') no-repeat scroll left bottom;
  padding-left:5px;
}

.C1Window_ArcticFox .C1wFooter .C1wInner
{
  background:transparent url('Images/footer_right_unfocused.gif') no-repeat scroll right bottom;
  padding-right:5px;
}

.C1Window_ArcticFox .C1wFooter .C1wContent
{
  height: 5px;
  background:transparent url('Images/footer_center_unfocused.gif') repeat-x scroll left bottom;
  font-size:0px;
}

/*Focues footer*/
.C1Window_ArcticFox .C1wFocus .C1wFooter .C1wOuter
{
  background:transparent url('Images/footer_left.gif') no-repeat scroll left bottom;
  padding-left:5px;
}

.C1Window_ArcticFox .C1wFocus .C1wFooter .C1wInner
{
  background:transparent url('Images/footer_right.gif') no-repeat scroll right bottom;
  padding-right:5px;
}

.C1Window_ArcticFox .C1wFocus .C1wFooter .C1wContent
{
  height: 5px;
  background:transparent url('Images/footer_center.gif') repeat-x scroll left bottom;
  font-size:0px;
}

/*Maximized footer*/
.C1Window_ArcticFox .C1wFocus-Maximized .C1wFooter .C1wOuter
{
  display:none;
}

.C1Window_ArcticFox .C1wAccesskeyAnchor
{
  -moz-outline:0 none;outline:0 none;width:0;height:0;overflow:hidden;position:absolute;top:0;left:0;
}