/***
   do not delete this dummy class which is
   used to fix some strange problems
***/

.xxx {
}

/**********************************************************/
#branding {
         background-image: url("images/topbanner.jpg");
      background-repeat: no-repeat;
      height: 99px;
}

#branding a{
   color:#fff;
}

/**********************************************************/
#rooms {
   font-size:12px;
   border: 0px solid red;
   font-weight:bold;
   background-color: #75573D;
         height: 20px;
   }

#rooms div {
   float:left;
   height:20px;
}

/********************** FAT LIST  ******************************/
#fatList1{
   height: 350px;
   border: 1px solid red;
   width: 500px;
}

#fatList{
}

/********************** FAT LIST - LEFT ******************************/
#fatList #leftInner {
   float: left;
   width: 420px;
}

/********************** FAT LIST - RIGHT ******************************/
#fatList #rightInner {
   border: 0px solid green;
   float: right;
   width: 250px;
   margin-left: 25px;
}


#fatList #rightInner .imageContainer {
   float: left;
   padding-top: 40px;
}

#fatList #rightInner .imageCaption {
	font-size:10px;
	text-align:center;
	font-style: italic;
}

/********************* STAFF IMAGE *******************************/
#fatList #staffImage {
   border: 1px solid #AC8C65;
   float: left;
   margin: 5px 5px 5px 0px;
   height: 253px;
   width:125px;
   padding:2px;
}

#fatList #staffImage .picture {
   height: 188px;
}

#fatList #staffImage .imageContainer {
   margin: 2px;
}

#fatList #staffImage .imageContainer img {
   padding: 2px;
}

#fatList #staffImage .name {
   font-weight: bold;
   text-align: center;
   padding-top: 5px;
}

#fatList #staffImage .position {
   text-align: center;
   padding: 5px 0px 3px 0px;
}

#fatList #partner {
   text-align: center;
   margin: 0px 30px 0 0;
   float:left;
}

#fatList #partner h1{
   width: 145px;
}

/***************** CAREERS ***********************/
#careersFatList {
   border:2px solid #AC8C65;
}

#careersFatList .title {
   color: #fff;
   background-color: #C67618;
   padding: 5px;
}

#careersFatList #leftCol {
   width: 420px;
   float: left;
   padding:5px;
}

#careersFatList #rightCol {
   width: 260px;
   float: right;
}

#careersFatList img {
   padding: 5px;
}

/***************** LOYALTY ***********************/
#loyaltyFatList {
}

#loyaltyFatList .loyaltyCardRight {
   float: right; 
   margin-left: 10px;
}

#loyaltyFatList #left {
   float: left;
   width: 335px;
   _height: 170px;
   min-height: 170px;
}

#loyaltyFatList #box, 
#loyaltyFatList #contactNotes {
   border: 1px solid #AC8C65;
   margin-bottom:15px;
   min-height:100px;
}

#loyaltyFatList #box {
   border: 1px solid #AC8C65;
   margin-bottom:15px;
   min-height:100px;
   width: 680px;
}

#loyaltyFatList #contactNotes {
   _height: 100px;
   min-height: 100px;
   padding: 10px 0 5px 10px;
}

#loyaltyFatList #boxRight {
	float: left;
   width: 335px;
   border: 1px solid #AC8C65;
   margin: 0px 0px 15px 7px;
   _height: 220px;
   min-height: 220px;
}

#loyaltyFatList #topCol {
   min-height: 150px;
   _height: 150px;
}

#loyaltyFatList #bottomCol {
   border: 1px solid #AC8C65;
   width: 680px;
}


#loyaltyFatList #box div,
#loyaltyFatList #boxRight div,
#loyaltyFatList #bottomCol div {
   padding: 3px 0px 5px 10px;
}

#loyaltyFatList #box div div {
   padding:3px;
}

#loyaltyFatList #box .header,
#loyaltyFatList #boxRight .header,
#loyaltyFatList #bottomCol .header {
   height: 20px;
   background-color: #C67618;
   color: #fff;
   font-weight: bold;
}

#loyaltyFatList #box .header {
   width: 670px;
   height: 20px;
   background-color: #C67618;
   color: #fff;
   font-weight: bold;
}

#loyaltyFatList #box .header a{
   color: #fff;
}

div.userPicture {
   float: left;
   padding:1px !important;
   height: 150px;
   width: 140px;
}

.userPicture img{
   margin:auto
}

.userPicture .nyroModal img {
   border: 2px solid #AC8C65;
}
/********************** CONTACT US ******************************/
#contactUsFatList {
}

#contactUsFatList #leftCol {
   width: 250px;
   float: left;
}

#contactUsFatList #leftCol .contact {
   padding-top: 15px;
}

#contactUsFatList #rightCol {
   float: left;
}

#contactUsFatList #rightCol .imageContainer {
   padding-left: 20px;
}

#googleMap {
    margin: 15px 0px 0px 15px;
}

/**********************************************************/
#footer {
         margin-top: 60px;
      background-color: #C3B6AB;
   text-align:left;
   padding:3px 5px;
	font-size:9px;
	height: 30px;
}

/****************************************************/
#staffDetail {
   margin-top:25px;
}

#staffDetailLeft {
   float: left;
   width: 125px;
   text-align:center;
}

#staffDetailLeft .staffImage img{
}

#staffDetailLeft .staffName {
   font-weight: bold;
}

#staffDetailLeft .staffPosition {
}

#staffDetailMiddle {
   float: left;
   width: 300px;
   margin-left:10px;
}

#staffDetailRight {
   float: right;
}

/******************* PRODUCT SEARCH*********************/
#productSearch {
}

#productSearch div{
   float:left;
   margin-right:10px;
}

#productSearch div.cart{
   margin-left:20px;
}

#productSearch select{
   width:150px;
}

/*********************************************************/
#product {
   position:relative;
   left:40px;margin:auto;
}

#product .productImage{
   float: left;
   width: 200px;
   height: 150px;
   margin:7px;
}

.productImage img {
   width: 200px;
   margin:auto;
}

/*************************************************/
#productListContainer {
   margin-top:20px;
}

#productListLeft {
   width: 460px;
   float:left;
}

#productListRight {
   float:right;
   width: 225px;
   border:0px solid red;
}

#productListRight .image {
	margin-top: 70px;
}

#productListRight .description {
   margin-top: 10px;
}

.teamDocs .docCategory {
   margin-bottom: 10px;
}

#productListRight img{
   margin:auto;
}

/******************* PRODUCT LIST ************************/
#productList {
   width: 450px;
   margin-top:15px;
   border-collapse:collapse;
}

#productList td {
   padding:5px;
   border-left: 1px solid #4F4F4F;
   border-right: 1px solid #4F4F4F;
}

#productList td.right{
   text-align:right;
}

#productList #headerRow td{
   color:#FFFFFF;
   background-color: #4F4F4F;
}

#productList #rowValues td{
   border-bottom: 1px solid #4F4F4F;
}

******************* PRODUCT LIST ************************/
#productListItem {
   width: 450px;
   margin-top:15px;
}

#productListItem table {
   border: 5px solid #4F4F4F;
   padding:5px;
}

#productListItem td {
   padding:5px;
   border: 0px solid #4F4F4F;
}

#productListItem td.right{
   text-align:right;
}

#productListItem #headerRow td{
   color:#FFFFFF;
   background-color: #4F4F4F;
}
 
/******************* PRODUCT DETAIL ******************************/
#productDetail {
}

#productCatDescription img {
   margin:auto;
}

/******************* PRODUCT DETAIL TOP *********************/
#productDetail #topRow {
   margin-bottom:20px;
}

#productDetail #topRow div{
   float:left;
   margin-right:10px;
}

/******************* PRODUCT DETAIL LEFT *********************/
#productDetail #leftCol {
   float:left;
   width:390px;
}

#productDetail #leftCol .productDetailDescription {
	padding-top: 25px;
}

#leftCol #fields {
   margin-bottom:20px;
}

#leftCol #fields div {
   float: left;
   margin-right:5px;
}

/******************* PRODUCT DETAIL RIGHT *********************/
#productDetail #rightCol {
   float:right;
   width:300px;
}

#productDetail #rightCol img{
   margin:auto;
}

/******************* HAIR AND SKIN CARE *********************/
#serviceFilter {
   float: left;
   width: 250px;
}

#servicePrint {
   float: left;
   padding-top: 2px;
}

#service {
   border: 1px solid #AC8C65;
   margin-top: 15px;
   width:428px;
}

#service td.categoryColor {
	background-color: #D58812;
}

#service td {
   padding:5px;
   border:1px solid #BF8C5F;
}

#service td.right{
   text-align:right;
   width:80px;
   padding-left:2px;
}

#service #headerRow td{
   color:#FFFFFF;
   background-color: #603F20;
}

#service .nyroTitle {
   text-align: left;
}

/********************** CART TABLE ******************************/
#cartTable {
   border: 1px solid #AC8C65;
   width: 600px;
}

#cartTable td {
   padding:5px;
   border:1px solid #AC8C65;
   vertical-align:top;
}

#cartTable td.right{
   text-align:right;
}

#cartTable #headerRow td{
   color:#FFFFFF;
   background-color: #C67618;
}

/********************** CART FOOTER ******************************/
#cartFooter{
   margin-top:15px;
}

#cartFooter div{
   float:left;
   margin:5px 5px 0px 0px;
}

/****************** to vertical align the text in div **************************/
#valignContainer1
{
   display: table;
   width: 100%;
   height: 100%;
   _position: relative;
   overflow: hidden;
   border:0px solid blue;
}

#valignContainer2
{
   _position: absolute;
   _top: 50%;
   display: table-cell;
   vertical-align: middle;
}

#valignContainer3
{
   _position: relative;
   _top: -50%;
}

/********************** SEARCH PANEL ******************************/
#genericForm{
   border: 1px solid #AC8C65;
   margin-bottom:15px;
}

#genericForm td{
   padding:10px;
   vertical-align: top;
   text-align: left;
}

#genericForm .formTitle, .formTitle{
   font-size: 14px;
   font-weight: bold;
   background-color:#C67618;
   color:#FFFFFF;
   text-align: left;
   padding:5px;
}

#genericForm .formRow{
   _padding:1px;
   width:100%;
   overflow:hidden;
}

#genericForm .formFieldLabel{
   font-weight: bold;
   width:175px;
   text-align:left;
   float:left;
   padding:5px;
}

#genericForm .formFieldValue{
   float:left;
   padding:5px;
}

#genericForm .formInputBox{
   width:250px;
}

#genericForm .formInputCountryCode{
   width:30px;
}

#genericForm .formInputBoxSmall{
   width:210px;
}

#genericForm .formSmallText{
   font-size: 10px;
   font-weight: bold;
}

/*********************Roster*************************************/

#roster{
   font-weight: normal;
   border-right:1px solid #fff;
   margin-top:0px;
   margin-bottom:10px;
   border-collapse:seperate;
   border: 0px solid red;
   width: 100%;
}

#roster td{
   color: #fff;
   padding:5px;
   border:1px solid #fff;
   border-right:0px;
   border-top:0px;
}

#roster #heading{
   border-left:1px solid #fff;
   color: #FFF;
   background-color: #000066;
   text-align: left;
   //font-weight: bold;
}
#roster td.last
{
   border-bottom:0px;
}

#roster .headerRow td
{
   border-top:1px solid #fff;
   background-color:#7092b6;
   font-weight:bold;
}

#roster a
{
   text-decoration:none;
}

#roster .list1
{
   color:#000033;
   background-color: #b8cce0;
}

#roster .list2
{
   color:#000033;
   background-color: #8daccc;
}

#roster #button
{
   width:125px;
   height:15px;
   color:#fff;
   border: 0px solid #fff;
   margin:0x;
   padding-top:3px;
   text-align:center;
   background-color:#7092b6;
   cursor:pointer;
}

/**********************************************************/
#loginPanel {
   float:right;
   color: #fff;
   margin:5px 5px 0;
   padding:2px 5px;
   _padding:2px 0px;
   text-align: right;
}

#loginPanel p {
   margin:0 0 5px 0;
   padding:0;
   clear:both;
}

#loginPanel form{
    width:175px;
}

#loginPanel label {
  float:left;
  width:65px;
  margin-right:10px;
  text-align:right;
  font-weight:bold;
  padding-left: 10px;
}

#loginPanel input{
   width:80px;
}

#loginPanel input.submit{
   width:47px;
   float:right;
   margin-right:6px;
}

#loginPanel p.error{
   margin:0;
   font-size:0.8em;
   text-align:right;
}
/**********************************************************/
#thinList
{
   font-weight: normal;
   margin-top:30px;
   border-collapse:collapse;
}

#thinList td
{
   color: #000;
   padding:5px;
   border:1px solid #4F4F4F;
}

#thinList td.last
{
}

#thinList .headerRow
{
   border: 1px solid #4F4F4F;
   background-color:#4f4f4f;
   font-weight:bold;
   color: #fff;
}

.teamDocs { padding-top: 30px}
.staffDocument { 
   clear:both;
   padding: 0;
   margin: 0;
   _padding: 0;
   _margin: 0;
}

.staffDocument #thinList{
   margin-top:0;
   width: 100%;
}

.staffDocument #thinList .headerRow {
   background-color: #634125;
}

.docCategory {
   border: 0px solid #000;
   font-weight:bold;
   list-style: none;
   float:left;
}

.docCategory a {
   text-decoration: none;    
   background-color: #FEA815;
   padding: 5px;
   display:block;
}

.docCategory a.current {background-color: #634125; color: #fff;}

#thinList a
{
   margin:0x;
   padding:0x;
}

#thinList .list1
{
   background-color: #fff;
}

#thinList .date
{
   width:80px;
}

#thinList .list2
{
   background-color: #fff;
}

#thinList #button
{
   width:125px;
   height:15px;
   color:#fff;
   border: 0px solid #fff;
   margin:0x;
   padding-top:3px;
   text-align:center;
   background-color:#7092b6;
   cursor:pointer;
}

#thinList .attachment {
   text-align:left;
}


/********************** List ******************************/
ul#list, ul#list ul{
   list-style:none;
   margin:0;
}

ul#list li{
   padding:3px;
   zoom: 1;
   background-color:#EFEFEF;
   margin-bottom:3px;
}

ul#list li div{
   float:left;
   width:100px;
   padding:8px;
}

ul#list li.orderHeader div{
   font-weight:bold;
}

ul#list div{
    padding:5px;
}

ul#list div a.arrowRight {
    padding: 0 0 5px 12px;
    background:url('/images/arrow_right.gif') no-repeat 0 3px;
}

ul#list div a.arrowDown {
    padding: 0 0 5px 12px;
    background:url('/images/arrow_down.gif') no-repeat 0 3px;
}

ul#list div.orderItems{
   margin:10px;
   border: 1px solid #AC8C65;
   width:500px;
   background-color:#fff;
}

ul#list div.orderItems table{
   width:100%;
}

ul#list div.orderItems table td{
   vertical-align:top;
}

/********************** CALENDAR (for roster) ******************************/
#calendar {
	/** configure the width **/
	width:100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin:0px;
	padding:0px;
	text-align:center;
	border-collapse:collapse;
}
#calendar th {
	background-color: #D58812;
	font-weight: bold;
	height: 20px;
	border:1px solid #000;
}

#calendar .header {
	background-color: #7C5939;
	font-weight: bold;
	height: 24px;
	color: #FFFFFF;
}

#calendar .footer {
	background-color: #7C5939;
	font-weight: bold;
	font-size:0.8em;
	color: #FFFFFF;
	height: 24px;
}

#calendar td {
	border:1px solid #000;
	width:14.28%;
	text-align:center;
}

#calendar td div.cellWrapper{
	padding: 5px;
}

#calendar .today {
	height: 16px;
	background-color: #FAD2DA;
	padding: 2px;
	border: 1px solid #000000;
}

#calendar .link {
	height: 16px;
	padding: 2px;
	border: 1px solid #000000;
}

#calendar a, #calendar a:link, #calendar a:hover {
	font-weight: bold;
	text-decoration: underline;
	color: #000000;

}

#calendar a.headerNav, #calendar a:link.headerNav, #calendar a:hover.headerNav {
	color: #ffffff;
}

#calendar a.footerNav, #calendar a:link.footerNav, #calendar a:hover.footerNav {
	color: #ffffff;
}

#calendar .description{
   margin-top:10px;
   height: 25px;
   font-size:0.8em;
}

.confirmOrderForm {
   margin-top: 25px;
}

.confirmOrderForm .formSmallText {
   padding-bottom: 10px;
}

.confirmOrderForm label {
   position: relative;
   bottom: 105px;
   font-weight: bold;
}
/**********************************************************/

#progressInd {
    border:1px solid #000;
    margin:0 auto;
    position:absolute;
    width:100px;
    background-color:#F7B64A;
    top:0;
    left:0;
    z-index:20000;
}

.subcolumns {overflow: hidden; width:100%;}
.c25l {width:25%; float:left;}
.c33l {width:33%; float:left;}
.c75r {width:75%; float:right;}
.subcl  {padding:0 1em 0 0;}
.c75r .gallery {overflow:auto;height:340px;}
.galleryPicture img {display:block; margin:auto;}
.galleryPicture {height:130px; margin:5px;width:160px;overflow:hidden;}

/************************GALLERY CATEGORIES *****************/
.gallery #categories a {color: #B4B4B4; padding:3px 0 3px 10%; display:block;}
.gallery #categories .selected a, .gallery #categories .selected a:hover  {color: #000; font-weight: bold}
.gallery #categories a:focus, .gallery #categories a:hover {color: #666666;}