/* 
Title:		Root screen stylesheet, ShinyPaw.com
Author: 	www.blixinteractive.com
Copyright 2008
*/

/* global resets
----------------------------------*/
body, div, form, fieldset, table, th, td, input, #logo h1, #signup h2, #copyright p { margin:0; padding:0; }
a { color:#336600; }
a img { border:0; }

/* structure
----------------------------------*/
body 
{
	font-size: 62.5%;
	background: #FFF url(/Images/tracks.gif) no-repeat top center;
	font-family: Arial, sans-serif;
	color: #333;
}

#header { width:900px; margin:0 auto; }
#logo { float:left; width:250px; padding:30px 0 0 0; }
#header-content { float:left; width:650px; padding-top:20px; }
#controls { width:650px; overflow:hidden; }
#menu { width:650px; margin-top:20px; }

#wrap { width:900px; margin:0 auto; padding-top:8px; clear:both;  }
#main-content { width:900px; margin:0 auto; padding-top:10px; overflow:hidden; border-bottom:solid 1px #E1E1E1;  background-color:#FFF; }
#common-content { padding:0 0 0 25px; }
#footer { width:900px; margin:0 auto; margin-top:30px; }


/* content
----------------------------------*/
#shop-menu { float:left; width:189px; }
#shop-pets { margin:25px 0; border-top:solid 1px #E1E1E1; }
#shop-floor { float:left; width:710px; border-left:solid 1px #E1E1E1; min-height:400px; }

#copyspace { clear:both; font-size:1.2em; border-top:solid 1px #E1E1E1; padding:12px 6px 1px; }

#signup { width:860px; border-top:solid 1px #006699; border-bottom:solid 1px #006699; padding:5px 20px;
          background:url(/Images/signup-bg.jpg) repeat-x top left; color:#FFF; overflow:hidden; }
#trailer-menu { padding:13px 2px; }
#official { padding:14px 20px 8px; border-top:solid 1px #E1E1E1; }
#copyright { padding:12px 20px; border-top:solid 1px #E1E1E1; color:#888; }

/* lists / menus
----------------------------------*/
#controls ul { list-style-type:none; margin:0; padding:0; }
#controls ul li { margin:0; padding:2px 0; float:right; font-size:1.1em; display:inline; text-align:center; }
#controls li.account { padding-left:5px; padding-right:17px; border-right:solid 1px #CCC; text-align:right; }    
#controls li a { text-decoration:none; color:#333; }
#controls li span { color:#FFF; font-weight:bold; background-color:#006699; display:block; padding:2px 8px; margin-top:1px;
        text-align:center; -moz-border-radius:3px; -webkit-border-radius:3px; }
#controls li span a { color:#FFF; }
#controls li span.no-span { display:inline; padding:0; margin:0; background-color:Transparent; color:#333; text-align:left; } 
#controls li span.fix-width { width:45px; float:right;  }

#controls li.cart { margin-left:15px; padding:1px 7px 3px 34px; background:url(/Images/cart.gif) no-repeat top left; width:auto; }
#controls li.cart strong { font-size:2.8em; font-weight:normal; }

.mm, .mm * { margin:0; padding:0; list-style: none; }
.mm { line-height:1.0; }
.mm ul { position:absolute; top:-999em; width:13.5em; }
.mm li.mm-last ul { position:absolute; top:-999em; width:214px; }
.mm li:hover { visibility:inherit; }
.mm li { float:left; position:relative; }
.mm a { display:block; position:relative; }
.mm li:hover ul, .mm li.sfHover ul { left:3px; top:2.4em; z-index:99; }

.mm li.mm-last:hover ul, .mm li.mm-last.sfHover ul { left:-158px; top:2.7em; z-index:99; }

ul.mm li:hover li ul, ul.mm li.sfHover li ul { top:-999em; }
ul.mm li li:hover ul, ul.mm li li.sfHover ul { left:10em; top:0; }
ul.mm li li:hover li ul, ul.mm li li.sfHover li ul { top:-999em; }
ul.mm li li li:hover ul, ul.mm li li li.sfHover ul { left:10em; top:0; }

.mm 
{
	background: url(/Images/menu-bg.gif) no-repeat top left;
	float: right; margin-bottom: 1em;
}
.mm a { border-right: 1px solid #FD984C; padding: 8px 12px; text-decoration:none; }
.mm a, .mm a:visited  { color: #FFF; }
.mm li {
	background:	Transparent;
	font-size:15px; font-weight:bold; letter-spacing:-0.5px;
	padding-top:10px;
}
span.sf-sub-indicator { display:none; }
.mm li.mm-store { font-size:17px; background: url(/Images/menu-li-bg.gif) no-repeat top left; padding:0 0; }
.mm a.a-store { background: url(/Images/menu-lis-bg.gif) no-repeat top right; 
    border-right:0; padding-top:14px; padding-right:44px; padding-bottom:10px;  }

.mm li.mm-first { background: url(/Images/li-first.gif) no-repeat bottom left; }
.mm li.mm-first a { border-right:0; }
.mm li.mm-last { background: url(/Images/li-lasts.gif) no-repeat top right; }
.mm li.mm-last a { background: url(/Images/a-last.gif) no-repeat bottom right; border-right:0; }

.mm li li 
{
	float:none;
	font-size:12px;
	color:#660000;
	letter-spacing:normal;
	padding:0 11px 0 11px;
	background-color:#FFF;
	border-left:solid 1px #FD984C;	
	border-right:solid 1px #FD984C;	
}

.mm li li a, .mm li.sfHover li a
{
	color:#660000;
	background:#FFCC99;
	padding:5px 0 5px 12px;
	border:0;
}
.mm li li a:hover, .mm li.sfHover li a:hover { color:#000; }

.mm li.sfHover li.mm-sf { padding-top:11px; }
.mm li.sfHover li.mm-sl { padding-bottom:11px; border-bottom:solid 1px #FD984C; }  
.mm li.sfHover li.mm-sf a { padding-top:10px; -moz-border-radius-topleft:3px; -moz-border-radius-topright:3px; 
        -webkit-border-top-right-radius: 3px; -webkit-border-top-left-radius: 3px; }  
.mm li.sfHover li.mm-sl a { padding-bottom:10px; -moz-border-radius-bottomleft:3px; -moz-border-radius-bottomright:3px; 
        -webkit-border-bottom-right-radius: 3px; -webkit-border-bottom-left-radius: 3px; }  

.mm li.mm-store.sfHover { background-position:0 -100px; }
.mm li.sfHover a.a-store { color:#FF6600; background-position:right -100px; }

.mm li.mm-last.sfHover { background-color:#FFF; background-position:right -100px; }
.mm li.sfHover a.a-last { color:#FF6600; background-position:right -100px; }

.sf-shadow ul {
	background:Transparent url('/Images/shadow.png') no-repeat bottom right;	
	padding:0 8px 8px 0;
	-moz-border-radius-bottomleft:10px;
	-webkit-border-bottom-left-radius:10px;
}
.sf-shadow ul.sf-shadow-off { background: transparent; }


#crumb { width:900px; margin-bottom:10px; background:url(/Images/crumb-bg.gif) repeat-x top left; 
	-moz-border-radius:6px; -webkit-border-radius:6px; overflow:hidden; }
	#crumb-int{ width:885px; overflow:hidden; }
.bc, .bc * { margin:0; padding:0; list-style: none; }
ul.bc { width:2500px; }
.bc li { float:left; font-size:1.3em; font-weight:bold; font-style:italic; padding:7px 20px 7px 50px; color:#FFF;
         font-family:"Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Lucida, sans-serif;
         background:#669900 url(/Images/crumb-n.gif) no-repeat center left; }
.bc li.first { padding-left:28px; background:#669900; -moz-border-radius-topleft:6px; -webkit-border-top-left-radius: 6px; 
               -moz-border-radius-bottomleft:6px; -webkit-border-bottom-left-radius: 6px; }
.bc li.last { background:Transparent url(/Images/crumb-l.gif) no-repeat center left; }
.bc li a { color:#FFF; text-decoration:none; }

.shopm, .shopm * { margin:0; padding:0; list-style: none; }
.home ul.shopm { margin-top:40px; }
.shopm li { font-size:1.1em; margin:5px 0; padding:1px 6px; }
.shopm li a { font-weight:bold; color:#336600; text-decoration:none; }
.shopm li.shopmtitle { font-weight:bold; margin-top:0; padding-top:0; }

.ptm, .ptm * { margin:0; padding:0; list-style: none; }
.ptm li { font-size:1.2em; margin:0 0; padding:1px 5px; border-bottom:solid 1px #E1E1E1; }
.ptm li a { display:block; font-weight:bold; color:#336600; text-decoration:none; text-transform:uppercase; padding:19px 0 19px 65px; }
.ptm li a.dogs { background:url(/Images/brand-dogs.gif) no-repeat center left; }
.ptm li a.cats { background:url(/Images/brand-cats.gif) no-repeat center left; }
.ptm li a.kittens { background:url(/Images/brand-kittens.gif) no-repeat center left; }
.ptm li a.puppies { background:url(/Images/brand-puppies.gif) no-repeat center left; }

.tm, .tm * { margin:0; padding:0; list-style: none; }
.tm li { display:inline; font-size:1.1em; padding:0 18px; border-right:solid 1px #888; }
.tm li.last { border-right:0; }
.tm li a { color:#444; text-decoration:none;  }

ol.ol-ol { margin-top:22px; }
.ol-ol li { font-size:26px; color:#669900; margin-bottom:20px; }
.ol-ol p { color:#333; font-weight:normal; font-size:14px; line-height:1.4em; }


/* links
----------------------------------*/
#signup span a { color:#FFF; }
a#letter { float:right; margin-top:7px; }
#copyright a { color:#888; }


/* text
----------------------------------*/
#logo h1 { font-size:1em; width:247px; height:93px; text-indent:-9999px;
	background:url(/Images/logo.gif) no-repeat top left; }	
#signup h2 { float:left; font-size:1.6em; margin:12px 0 0; padding-bottom:11px; }
#signup span { float:left; display:inline; font-size:1.1em; margin:17px 0 0 60px; }
em { font-family:"Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Lucida, sans-serif; }

span.RegularPrice { color:#888; text-decoration:line-through; }
span.SalePrice, span.Price { color:#CC3300; font-weight:bold; }

label.heavy { font-weight:bold; }

p#p-commit { margin:0; padding:10px 0 20px 100px; font-weight:bold; color:#669900; background:url(/Images/p-commit.png) no-repeat 0 0; }


/* forms
----------------------------------*/
select.ddlBase { font-family:Arial, sans-serif; font-size:11px; }


/* tooltip skin
----------------------------------*/
#tooltip {
	position: absolute;
	z-index: 3000;
	width:250px;
	opacity: 0.9;
	
	padding:0 0 0 7px;	
	background-image: url(/Images/darrowleft.gif);
	background-position:0px 5px;
	background-repeat:no-repeat;
}
#tooltip.viewport-right
{	
	padding:0 7px 0 0;	
	background-image: url(/Images/darrowright.gif);
	background-position:right 5px;
	background-repeat:no-repeat;
}
#tooltip h3, #tooltip div { margin: 0; }

#tooltip div 
{
	border:solid 1px #FF9966;
	font-size:11px;
	color: #222;
	padding: 10px;
	background:#FFF url(/Images/tip-left.gif) repeat-x top left;
}

/* tabs skin
----------------------------------*/
#tab-container { margin-top:30px; }

/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .tabs-nav {
        display: none;
    }
}

.tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
.tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
    min-width: 84px; /* be nice to Opera */
}
.tabs-nav a, .tabs-nav a span {
    display: block;
    padding: 0 20px;
    background: url(/Images/tab.png) no-repeat;
}
.tabs-nav a {
    position: relative;
    top: 1px;
    z-index: 2;
    padding-left: 0;
    color: #333;
    font-size:1.1em;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
}
.tabs-nav .tabs-selected a {
    color: #000;
}
.tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {
    background-position: 100% -150px;
    outline: 0; /* prevent dotted border in Firefox */
}
.tabs-nav a, .tabs-nav .tabs-disabled a:hover, .tabs-nav .tabs-disabled a:focus, .tabs-nav .tabs-disabled a:active {
    background-position: 100% -100px;
}
.tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 22px; /* IE 6 treats height as min-height */
    min-height: 22px;
    padding-top: 8px;
    padding-right: 0;
}
*>.tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
.tabs-nav .tabs-selected a span {
    padding-top: 9px;
}
.tabs-nav .tabs-selected a span, .tabs-nav a:hover span, .tabs-nav a:focus span, .tabs-nav a:active span {
    background-position: 0 -50px;
}
.tabs-nav a span, .tabs-nav .tabs-disabled a:hover span, .tabs-nav .tabs-disabled a:focus span, .tabs-nav .tabs-disabled a:active span {
    background-position: 0 0;
}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.tabs-nav .tabs-disabled {
    opacity: .4;
}
.tabs-container {
    border-top: 1px solid #DDD;
    padding: 6px 8px;
    background: #fff;     
    font-size:1.2em;
}
.tabs-loading em {
    padding: 0 0 0 20px;
    background: url(loading.gif) no-repeat 0 50%;
}

div.tab-specs
{
	border-top:solid 1px #E1E1E1;
	padding-top:5px;
}

/* thickbox skin
----------------------------------*/
#TB_window, #TB_secondLine, #TB_window * { margin:0; padding:0; }

#TB_window {
  font: 12px Arial, Helvetica, sans-serif;
  color: #333333;
}
#TB_secondLine {
  font: 10px Arial, Helvetica, sans-serif;
  color:#666666;
}
#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
  position: fixed;
  z-index:100;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
}
.TB_overlayMacFFBGHack {background: url(/Images/macFFBgHack.png) repeat;}
.TB_overlayBG {
  background-color:#000;
  -moz-opacity: 0.75;
  opacity: 0.75;
}
#TB_window {
  position: absolute;
  background: #ffffff;
  z-index: 102;
  color:#000000;
  display:none;
  border: 4px solid #525252;
  text-align:left;
  top:50%;
  left:50%;
}
#TB_window img#TB_Image {
  display:block;
  margin: 15px 0 0 15px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
}
#TB_caption{
  height:25px;
  padding:7px 30px 10px 25px;
  float:left;
}
#TB_closeWindow{
  height:25px;
  padding:11px 25px 10px 0;
  float:right;
}
#TB_closeAjaxWindow{
  padding:7px 10px 5px 0;
  margin-bottom:1px;
  text-align:right;
  float:right;
}
#TB_ajaxWindowTitle{
  float:left;
  padding:7px 0 5px 10px;
  margin-bottom:1px;
}
#TB_title{
  background-color:#669900;
  height:27px; color:#FFF;
}
#TB_title a:link {color: #FFF;}
#TB_title a:visited {color: #FFF;}
#TB_title a:hover {color: #ff9900;}
#TB_title a:active {color: #FFF;}
#TB_title a:focus {color: #FFF;}

#TB_ajaxContent{
  clear:both;
  padding:2px 15px 15px 15px;
  overflow:auto;
  text-align:left;
  line-height:1.4em;
}
#TB_ajaxContent.TB_modal{
  padding:15px;
}
#TB_ajaxContent p{
  padding:5px 0px 5px 0px;
}
#TB_load{
  position: fixed;
  display:none;
  height:13px;
  width:208px;
  z-index:103;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}
#TB_HideSelect{
  z-index:99;
  position:fixed;
  top: 0;
  left: 0;
  background-color:#fff;
  border:none;
  -moz-opacity: 0;
  opacity: 0;
  height:100%;
  width:100%;
}
#TB_iframeContent{
  clear:both;
  border:none;
  margin-bottom:-1px;
  margin-top:1px;
  _margin-bottom:1px;
}