rlm@46: /*
rlm@46:  * Ext JS Library 2.1
rlm@46:  * Copyright(c) 2006-2008, Ext JS, LLC.
rlm@46:  * licensing@extjs.com
rlm@46:  * 
rlm@46:  * http://extjs.com/license
rlm@46:  */
rlm@46: 
rlm@46: /*
rlm@46:  Creates rounded, raised boxes like on the Ext website - the markup isn't pretty:
rlm@46:   <div class="x-box-blue">
rlm@46:         <div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
rlm@46:         <div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
rlm@46:             <h3>YOUR TITLE HERE (optional)</h3>
rlm@46:             <div>YOUR CONTENT HERE</div>
rlm@46:         </div></div></div>
rlm@46:         <div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
rlm@46:     </div>
rlm@46:  */
rlm@46: 
rlm@46: .x-box-tl {
rlm@46: 	background: transparent url(../images/default/box/corners.gif) no-repeat 0 0;
rlm@46:     zoom:1;
rlm@46: }
rlm@46: 
rlm@46: .x-box-tc {
rlm@46: 	height: 8px;
rlm@46: 	background: transparent url(../images/default/box/tb.gif) repeat-x 0 0;
rlm@46: 	overflow: hidden;
rlm@46: }
rlm@46: 
rlm@46: .x-box-tr {
rlm@46: 	background: transparent url(../images/default/box/corners.gif) no-repeat right -8px;
rlm@46: }
rlm@46: 
rlm@46: .x-box-ml {
rlm@46: 	background: transparent url(../images/default/box/l.gif) repeat-y 0;
rlm@46: 	padding-left: 4px;
rlm@46: 	overflow: hidden;
rlm@46:     zoom:1;
rlm@46: }
rlm@46: 
rlm@46: .x-box-mc {
rlm@46: 	background: #eee url(../images/default/box/tb.gif) repeat-x 0 -16px;
rlm@46: 	padding: 4px 10px;
rlm@46: 	font-family: "Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif;
rlm@46: 	color: #393939;
rlm@46: 	font-size: 12px;
rlm@46: }
rlm@46: 
rlm@46: .x-box-mc h3 {
rlm@46: 	font-size: 14px;
rlm@46: 	font-weight: bold;
rlm@46: 	margin: 0 0 4px 0;
rlm@46:     zoom:1;
rlm@46: }
rlm@46: 
rlm@46: .x-box-mr {
rlm@46: 	background: transparent url(../images/default/box/r.gif) repeat-y right;
rlm@46: 	padding-right: 4px;
rlm@46: 	overflow: hidden;
rlm@46: }
rlm@46: 
rlm@46: .x-box-bl {
rlm@46: 	background: transparent url(../images/default/box/corners.gif) no-repeat 0 -16px;
rlm@46:     zoom:1;
rlm@46: }
rlm@46: 
rlm@46: .x-box-bc {
rlm@46: 	background: transparent url(../images/default/box/tb.gif) repeat-x 0 -8px;
rlm@46: 	height: 8px;
rlm@46: 	overflow: hidden;
rlm@46: }
rlm@46: 
rlm@46: .x-box-br {
rlm@46: 	background: transparent url(../images/default/box/corners.gif) no-repeat right -24px;
rlm@46: }
rlm@46: 
rlm@46: .x-box-tl, .x-box-bl {
rlm@46: 	padding-left: 8px;
rlm@46: 	overflow: hidden;
rlm@46: }
rlm@46: 
rlm@46: .x-box-tr, .x-box-br {
rlm@46: 	padding-right: 8px;
rlm@46: 	overflow: hidden;
rlm@46: }
rlm@46: 
rlm@46: .x-box-blue .x-box-bl, .x-box-blue .x-box-br, .x-box-blue .x-box-tl, .x-box-blue .x-box-tr {
rlm@46: 	background-image: url(../images/default/box/corners-blue.gif);
rlm@46: }
rlm@46: 
rlm@46: .x-box-blue .x-box-bc, .x-box-blue .x-box-mc, .x-box-blue .x-box-tc {
rlm@46: 	background-image: url(../images/default/box/tb-blue.gif);
rlm@46: }
rlm@46: 
rlm@46: .x-box-blue .x-box-mc {
rlm@46: 	background-color: #c3daf9;
rlm@46: }
rlm@46: 
rlm@46: .x-box-blue .x-box-mc h3 {
rlm@46: 	color: #17385b;
rlm@46: }
rlm@46: 
rlm@46: .x-box-blue .x-box-ml {
rlm@46: 	background-image: url(../images/default/box/l-blue.gif);
rlm@46: }
rlm@46: 
rlm@46: .x-box-blue .x-box-mr {
rlm@46: 	background-image: url(../images/default/box/r-blue.gif);
rlm@46: }