﻿/*---------------------------------------------------------------------------
C O M M O N
---------------------------------------------------------------------------*/

/*------------------------------
STRUCTURE
------------------------------*/
#site { margin: 0 auto; font: normal 81.3%/1.25 Verdana, Geneva, Tahoma, sans-serif; }
#site em { font-style: italic; }
#site h2, #spotlightWrapper h2 { text-indent: -9999px; }
ul.GHnavPrim { width: 845px; }

/*------------------------------
BOXES
------------------------------*/
/*Common features*/
.box { overflow: hidden; }
.box h3 { text-indent: -9999px; }
.box .inner, .box .left, .box .right { background: url(/designs/shared/img/boxBgCollection.png) no-repeat; }
.box .inner { background-repeat: repeat-x; float: left; }
.box .left, .box .right { width: 15px; display: block; float: left; }
/*White box, 390px high*/
.white390 .inner { height: 390px; background-position: 0 -390px; }
.white390 .left, .white390 .right { height: 390px; }
.white390 .right { background-position: -15px top; }
/*Transparent box, 330px high*/
.transparent330 .inner { height: 330px; background-position: 0 -1111px; }
.transparent330 .left, .transparent330 .right { height: 330px; background-position: 0 -780px; }
.transparent330 .right { background-position: -15px -780px; }
/*Transparent box, 276px high*/
.transparent276 { height: 276px; }
.transparent276 .inner { height: 276px; background-position: 0 -1716px; }
.transparent276 .left, .transparent276 .right { height: 276px; background-position: 0 -1440px; }
.transparent276 .right { background-position: -15px -1440px; }

/*------------------------------
BUTTONS
------------------------------*/
.btn, .btn span { background: url(/designs/shared/img/btnCollection.png) no-repeat; }
.btn.large, .btn.large span { background: url(/designs/shared/img/btnLargeCollection.png) no-repeat; }
.btn.green .label, .btn.orange .label, .btn.blue .label { padding: 2px 2px 7px 0; }/*these images is not cut as the other button images, therefore the overwrite*/
.btn { height: 25px; display: inline-block; color: #fff; font: bold 76.9%/15px Verdana, Geneva, Tahoma, sans-serif; text-decoration: none; cursor: pointer; }
.btn.large { height: 30px; }
.btn .label { padding: 2px 2px 6px 0; margin: 0 0 0 16px; line-height: 17px; background-repeat: repeat-x !important; float: left; }
.btn.large .label { height: 30px; line-height: 30px; padding: 0px 2px 0 2px; margin: 0 0 0 23px; }
.btn .decor { width: 20px; height: 25px; float: left; }
.btn.large .decor { width: 23px; height: 30px; }
/*Yellow*/
.btn.yellow { background-position: 0 -390px; }
.btn.yellow .label { background-position: 0 -450px; }
.btn.yellow .decor { background-position: 0 -510px; }
.btn.yellow:hover { background-position: 0 -360px; }
.btn.yellow:hover .label { background-position: 0 -420px; }
.btn.yellow:hover .decor { background-position: 0 -480px; }
/*Red*/
.btn.red { background-position: 0 -210px; }
.btn.red .label { background-position: 0 -270px; }
.btn.red .decor { background-position: 0 -330px; }
.btn.red:hover { background-position: 0 -180px; }
.btn.red:hover .label { background-position: 0 -240px; }
.btn.red:hover .decor { background-position: 0 -300px; }
/*Gray*/
.btn.gray { background-position: 0 -30px; }
.btn.gray .label { background-position: 0 -90px; }
.btn.gray .decor { background-position: 0 -150px; }
.btn.gray:hover { background-position: 0 0; }
.btn.gray:hover .label { background-position: 0 -60px; }
.btn.gray:hover .decor { background-position: 0 -120px; }
/*Blue*/
.btn.blue { background-position: 0 -572px; }
.btn.blue .label { background-position: 0 -636px; }
.btn.blue .decor { background-position: 0 -700px; }
.btn.blue:hover { background-position: 0 -540px; }
.btn.blue:hover .label { background-position: 0 -604px; }
.btn.blue:hover .decor { background-position: 0 -668px; }
/*Orange*/
.btn.orange { background-position: 0 -764px; }
.btn.orange .label { background-position: 0 -828px; }
.btn.orange .decor { background-position: 0 -892px; }
.btn.orange:hover { background-position: 0 -732px; }
.btn.orange:hover .label { background-position: 0 -796px; }
.btn.orange:hover .decor { background-position: 0 -860px; }
/*Green*/
.btn.green { background-position: 0 -956px; }
.btn.green .label { background-position: 0 -1020px; }
.btn.green .decor { background-position: 0 -1084px; }
.btn.green:hover { background-position: 0 -924px; }
.btn.green:hover .label { background-position: 0 -988px; }
.btn.green:hover .decor { background-position: 0 -1052px; }
/*White large*/
.btn.large.white { color: #03539a; background-position: 0 0; }
.btn.large.white:hover { background-position: 0 -30px; }
.btn.large.white .label { background-position: 0 -60px; }
.btn.large.white:hover .label { background-position: 0 -90px; }
.btn.large.white .decor { background-position: 0 -120px; }
.btn.large.white:hover .decor { background-position: 0 -150px; }
/*Blue large*/
.btn.large.blue { background-position: 0 -180px; }
.btn.large.blue:hover { background-position: 0 -210px; }
.btn.large.blue .label { background-position: 0 -240px; }
.btn.large.blue:hover .label { background-position: 0 -270px; }
.btn.large.blue .decor { background-position: 0 -300px; }
.btn.large.blue:hover .decor { background-position: 0 -330px; }
/*Red large*/
.btn.large.red { background-position: 0 -360px; }
.btn.large.red:hover { background-position: 0 -390px; }
.btn.large.red .label { background-position: 0 -420px; }
.btn.large.red:hover .label { background-position: 0 -450px; }
.btn.large.red .decor { background-position: 0 -480px; }
.btn.large.red:hover .decor { background-position: 0 -510px; }

/*------------------------------
IMAGE OVERLAYS
------------------------------*/
.overlays { background: url(/designs/shared/img/overlayCollection.png) no-repeat; }

/*------------------------------
SEPERATORS
------------------------------*/
.seperator li { background: url(/designs/shared/img/dividerHorizontal.gif) left bottom repeat-x; }

/*------------------------------
SCROLLBARS
------------------------------*/
.jScrollPaneContainer a.jScrollArrowUp, .jScrollPaneContainer a.jScrollArrowDown, .jScrollPaneContainer .jScrollPaneTrack { background: url(/designs/shared/img/scrollCommonCollection.png) no-repeat; }
.jScrollPaneContainer a.jScrollArrowUp { height: 23px; background-position: 0 0; }
.jScrollPaneContainer a.jScrollArrowDown { height: 23px; background-position: 0 -23px; }
.jScrollPaneContainer .jScrollPaneTrack { background-position: -18px 0; background-repeat: repeat-y; }
.jScrollPaneContainer .jScrollPaneDragTop { height: 8px; background-position: 0 0; }
.jScrollPaneContainer .jScrollPaneDragBottom { height: 8px; background-position: 0 -8px !important; }
.jScrollPaneContainer .jScrollPaneDrag { margin: 0 0 0 2px; background-position: -18px 0 !important; background-repeat: repeat-y !important; }