/* New Tabs */
#tabs {float:left; width:100%;}
#tabs ul li
{
	display: inline;
	padding: 0;
	margin: 0;
	width:200px;
}

#tabs ul
{
	text-align: left;
	padding: 0;
	margin: 0;
	height:20px;
}

.tabs
{
	margin:10px 15px 15px;
}

.ui-tabs-nav a
{
	/*
		In general, style all links in the tab navigation area.
		In practice, this allows us to differentiate between active tabs
		and inactive tabs
	*/
	position:relative;
	font-weight:bold;
	text-transform:uppercase;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#fff;
	background:transparent url(/images/bg-tab.png) 0 0 no-repeat;
	border: none;
	text-decoration:none;
	border-bottom: 0; /* Make an unselected tab appear to float above the panel slightly */
	z-index:1;
}


.ui-tabs-nav
{
	/*
		A margin at the bottom allows us to put padding at the bottom
		of the tab headers
	*/
	margin-bottom: 2px;
}

.ui-tabs-selected
{
}

.ui-tabs-unselect
{
}

.ui-tabs-selected a
{
	/*
		Style the selected tab header link (which overwrites the 'ui-tabs-nav a'
		style)
	*/
	position:relative;
	border: none;
	background-position:0 -34px;
	text-decoration:none;
	z-index:2;
}

a.tab-installation {padding: 9px 35px 5px 15px;}
a.tab-features {margin-left:0px; padding: 9px 85px 5px 15px;}


.ui-tabs-disabled
{
}

.ui-tabs-panel
{
	padding: 20px;
	border: none;
    background-color: #c68f0a;
    width:650px;
}

.ui-tabs-hide
{
	display: none;
}

/*Tabbed Panels*/
.tabArea { clear:both; color: #FFF; width: 702px; position:relative; height: 260px; }
.tabArea#videoArea { min-height: 800px; }
.tabArea#videoOnly { min-height: 800px; }

h2.aaHead { display:block; width: 518px; height: 30px; text-indent: -9999px; }
    h2.aaHead#moistureHead { background: url(/images/thead-aa-moisture.gif) no-repeat; display:block; width: 518px; height: 30px; text-indent: -9999px; }
    h2.aaHead#stiffnessHead { background: url(/images/thead-aa-stiffness.gif) no-repeat; display:block; width: 518px; height: 30px; text-indent: -9999px; }
    h2.aaHead#serviceHead    { background: url(/images/thead-aa-service.gif) no-repeat; display:block; width: 518px; height: 30px; text-indent: -9999px; }
 
.tabTop { width: 702px; height: 34px; position:relative; }
    .tabTop#aa { background: url(/images/tabs-aa-bar-1.gif) no-repeat #FFF; }
    .tabTop#media { background: url(/images/tabs-media-bar-1.gif) no-repeat #FFF; }
.tabTop span.hotbox { height: 26px; display: block; position: absolute; top: 6px; overflow:hidden; text-indent: -9999px; cursor: pointer; }
    .tabTop span.hotbox#builders { left: 5px;  width: 90px; }
    .tabTop span.hotbox#homeowners { left: 110px;  width: 110px; }
    .tabTop span.hotbox#retailers { left: 230px;  width: 90px; }
    .tabTop span.hotbox#architects { left: 330px;  width: 100px; }
    
    .tabTop span.hotbox#video { left: 5px;  width: 90px; }
    .tabTop span.hotbox#photos { left: 110px;  width: 110px; }

.tabContent { width: 670px; background-color: #c68f0a; padding: 18px 16px; margin-bottom: 20px; position: absolute; top: 34px; left: 0; }
.tabContent.builders, .tabContent.homeowners, .tabContent.retailers, .tabContent.architects { font-size: 14px; line-height: 18px; font-weight: bold; }
.tabContent.video { padding: 2px; width: 698px; } 
.tabContent.photos { padding: 2px; width: 698px; } 
.tabContent ul { padding: 0 0 0 20px; font-weight: bold }
.tabContent ul li { padding: 10px 0; }
.tabContent .tcPic { background: #013c68; border: 1px solid #FFF; width: 145px; font-size:11px; float: right; margin: 0 0 5px 15px; }
.tabContent .tcPic p { line-height: 15px; margin: 4px 6px 6px 8px; padding: 0; }

#tabVidPlayer { float: left; width: 450px; margin: 13px; display: inline; }
.tabVidCaption { color: #FFF; float: left; width: 193px; height: 213px; margin: 13px 13px 0 0; display: inline; }
.tabVidCaption.forPhoto { width: 250px; }
.tabVidCaption .title { font-size:16px; font-weight:bold; }

.chipsBox { background: #f3e7cb; padding: 0 0 44px 8px; }
.videoChip { float: left; width: 158px; height: 145px; margin: 10px 0 0 10px; background: url(/images/bg-video-chip.gif) no-repeat; color: #01406e; font-size: 10px; font-weight: bold; }
    .videoChip .chipPic img { margin: 5px 0 8px 9px; }
    .videoChip p { padding: 0; margin: -5px 10px 0 2px; }
    .videoChip.lp p{padding-left: 8px;}

.tabVidCaption ul{margin:  18px auto 0 auto; padding: 0; width: 151px;}
	.tabVidCaption li{margin-bottom: -10px;}
	.tabVidCaption li, .tabVidCaption li a{display: block; width: 151px; height: 25px;}
	.tabVidCaption li a{overflow: hidden; text-indent: -99999em; background-position: 0 0; background-repeat: no-repeat;}
	.tabVidCaption a:hover{background-position: 0 -25px;}
    .tabVidCaption #btnNextVideo a{ background-image: url(/images/btn-next-video.gif); }
    .tabVidCaption #btnShareVideo a{ background-image: url(/images/btn-share-video.gif); }
    
#mediaTabFooter { margin: 14px auto 0 auto; position:relative; }
    #mediaTabFooter a#prevSet { display:block; width:113px; height: 25px; overflow:hidden; position: absolute; top: 0; left: 13px; background: url(/images/btn-previous-set.gif) no-repeat 0 0; text-indent: -9999px;  }
        #mediaTabFooter a#prevSet:hover { background: url(/images/btn-previous-set.gif) no-repeat 0 -25px; }
    #mediaTabFooter a#nextSet { display:block; width:111px; height: 25px; overflow:hidden; position: absolute; top: 0; left: 556px; background: url(/images/btn-next-set.gif) no-repeat; text-indent: -9999px; }
        #mediaTabFooter a#nextSet:hover { background: url(/images/btn-next-set.gif) no-repeat 0 -24px; }
        
    #mediaTabFooter a#prevPhotoSet { display:block; width:113px; height: 25px; overflow:hidden; position: absolute; top: 0; left: 13px; background: url(/images/btn-previous-set.gif) no-repeat 0 0; text-indent: -9999px;  }
        #mediaTabFooter a#prevPhotoSet:hover { background: url(/images/btn-previous-set.gif) no-repeat 0 -25px; }
    #mediaTabFooter a#nextPhotoSet { display:block; width:111px; height: 25px; overflow:hidden; position: absolute; top: 0; left: 556px; background: url(/images/btn-next-set.gif) no-repeat; text-indent: -9999px; }
        #mediaTabFooter a#nextPhotoSet:hover { background: url(/images/btn-next-set.gif) no-repeat 0 -24px; }
        
    #dotsBar { text-align: center; position: absolute; top: 6px; left: 300px; width: 300px;  text-align:center; }
    #dotsBar a.mediadot { float: left; width:12px; height: 12px; margin: 0 2px; overflow:hidden; background: url(/images/media-dot.gif) no-repeat 0 0; text-indent: -9999px; }
    #dotsBar a.mediadot:hover, #dotsBar a.mediadot.selected { background: url(/images/media-dot.gif) no-repeat 0 -12px; }
    
   #galleryImage { margin: 6px 15px 15px 12px; width: 403px; float: left; }
    #galleryImage img { border: 1px solid #000; }
   #galleryRight { float: left; width: 250px; margin: 24px 0 0 15px; }
   
   .picThumbs img { cursor: pointer; width: 140px; min-height: 93px; }