﻿#fbLftWidget{display:none;}

#divMsg{display:none !important;}

#divFenceBuilder
{
    float:left;
}

#divFenceBuilder h3
{
    clear:both;
}

#fencebuilerSub{margin-left:300px; padding-right:10px; padding-bottom: 10px;float:left; display:block;}
#fencebuilderBasketBtns .metal_button_add_to{display:inline;}

.welcomeTo
{
    background-image:url(/images/fence-builder/welcomeTo.gif);
    background-repeat:no-repeat;
    background-position:0px 0px;
    width:577px;
    display:block;
    float:left;
    padding-top:60px;
}

.welcomeTo span
{
    width:375px;
    margin:0 0 0 0;
    display:block;
}
.welcomeTo p
{
	display:block;
	float:left;
	clear:both;
	width:100%;
	margin-bottom:10px;
}
 
.stepOne h3, .stepTwo h3, .stepThree h3, .stepFour h3, .stepFive h3
{
    background-repeat:no-repeat;
    height:0px;
    padding-top:45px;
    overflow:hidden;
    width:450px;
    float:left;
}

.stepOne h3
{
    background-image:url(/images/fence-builder/stepOne.gif);
}
.stepTwo h3
{
    background-image:url(/images/fence-builder/stepTwo.gif);
}
.stepThree h3
{
    background-image:url(/images/fence-builder/stepThree.gif);
}
.stepFour h3
{
    background-image:url(/images/fence-builder/stepFour.gif);
}
.stepFive h3
{
    background-image:url(/images/fence-builder/stepFive.gif);
}
.divStepOne, .divStepTwo, .divStepThree, .divStepFour, .divStepFive
{
    display:block;
    float:left;
    margin: 0 0 25px 0;
}

.divStepOne{min-height:270px; height:auto !important; height:260px; margin-bottom:0px; background-image:url(/images/fence-builder/ajax-loader.gif);
background-position:center center; background-repeat:no-repeat;}
.divStepTwo{position:relative;}

#fenceLoad{background-color:#fff; float:left; visibility:hidden;}

.stepOne, .stepTwo, .stepThree, .stepFour, .stepFive
{
    display:block;
    width:577px;
    float:left;
}
.threeColMargin
{
    margin: 0 42px;
}
.divPanelOpt 
{
    background-image:url(/images/fence-builder/box_top.jpg);
    background-position:left top;
    padding:0;
    /*height:161px;
    width:161px;*/
    float:left;
    /*color:White;*/
}
/*.divPanelOptGreen
{
    background-color:transparent;
    background-image:url(/images/fence-builder/box_bottom.jpg);
    background-position: left bottom;
    background-repeat:no-repeat;
    width:155px;
    height:100%;
    padding:3px;
}*/
.divPanelOpt label
{
    display:block;
    width:137px;
}
.active label
{
    width:164px;
    }
.divPanelOpt label img 
{
    width:155px;
    height:101px;
    padding-bottom:4px;
    display:block;
    clear:both;
}
.divPanelOpt .stepOneName
{
}
.divPanelOpt .stepOnePrice
{
    width:100px;
}
.divPanelOpt span.stepOneButton
{
    margin-top:5px;
    display:block;
}
.divPanelOpt span.stepOneButton span 
{
    margin-left:23px;
}

.chooseHeight
{
    width:276px;
    float:left;
    position:relative;
}

.chooseHeight .glower
{
    width:276px;
    position:absolute;
    height:105px;
    background-image:url(/images/fence-builder/glower.png);
    background-position:right 5px;
    background-repeat:no-repeat;
    z-index:0;
    display:none;
}

#fenceCalc
{
    background-image:url(/images/fence-builder/calc.jpg);
    background-position:left top;
    background-repeat:no-repeat;
    padding-left:34px;
    color:#666;
    cursor: pointer;
    padding-bottom:10px;
    margin-bottom:0;
}

#fenceCalc a{font-weight:bold; cursor:pointer;}

#calcApp
{
    background-image:url(/images/fence-builder/fenceCalc.png);
    background-position:left top;
    background-repeat:no-repeat;
    width:162px;
    height:150px; 
    position:absolute;
    left:192px;
    padding:27px 20px 10px 14px;
    bottom:16px;
    display:none;
    z-index:3;
}

#calcApp p{margin:0; padding:5px 0; float:left;}
#calcApp input{width:96px; float:left;}
#calcApp label{width:50px; float:left; display:block;}

#calcApp .calcBtn{float:left; display:block; height:0; overflow:hidden; padding-top:24px;background-position:0 0; cursor:pointer;}
#calcApp .calcBtn:hover{background-position:0 -24px;}

#calcApp #calcBtn{ background-image:url(/images/fence-builder/calcBtn.png); width:91px;}
#calcApp #cancelBtn{background-image:url(/images/fence-builder/cancelBtn.png); width:65px; margin-left:5px;}

.chooseQuantity 
{
    width:280px;
    float:left;
    position:relative;
}
.chooseHeight .title, .chooseQuantity .title 
{
    background-repeat:no-repeat;
    height:2px;
    padding-top:16px;
    overflow:hidden;
    width:170px;
    margin-bottom:7px;
}
.chooseHeight select, .chooseQuantity input
{
    border:1px solid #8E8E8E;
    display:block;
    padding:1px;
    width:208px;
}
.chooseHeight .title
{
    background-image:url(/images/fence-builder/chooseYourHeight.gif);
}
.chooseQuantity .title
{
    background-image:url(/images/fence-builder/numberOfPanels.gif);
}

.postSelectOuter 
{
    background-color:white;
    background-image:url(/images/fence-builder/box_top.jpg);
    background-position: left top;
    padding:0px;
    height:173px;
    width:161px;
    float:left;
    color:White;
}
.postSelectInner
{
    background-color:transparent;
    background-image: url(/images/fence-builder/box_bottom.jpg);
    background-position: left bottom;
    background-repeat:no-repeat;
    width:155px;
    height:169px;
    padding:3px;
}
.postSelectInner input
{
    border:1px solid #8E8E8E;
    float:left;
    height:18px;
    margin:0px 0px 0px 2px;  
    padding:0pt 0pt 0pt 48px;
    width:59px;
}
.postSelectInner div img
{
    float:left;
    margin:0;
    padding:0;
}
.postSelectInner p
{
    margin:5px 0 10px 0;
    text-align:center;
}
img.postsImage
{
    width:155px;
    height:101px;
}
.postsCheckbox
{
    display:block;
    float:left;
    margin: 6px 0px 0px 20px;
}

.stepFourContainer
{
    float:left;
    display:block;
}
.capBox 
{
    display:block;
    float:left;
    text-align:center;
    width:110px;
}
.capBox label 
{
    display:block;
}
div.stepFiveCappingRail,
div.stepFiveCutandTreat,
div.stepFivePostcrete,
div.stepFiveGravelBoard,
div.stepFiveScrews
{
    width:283px;
    height:130px;
    float:left;
    display:block;
    margin-bottom:44px;
}
 

div.stepFiveCappingRail p.desc,
div.stepFiveCutandTreat p.desc,
div.stepFivePostcrete p.desc,
div.stepFiveGravelBoard p.desc,
div.stepFiveScrews p.desc
{
    padding-left:3px;
    width:265px;
    margin:5px 0 0 0;
    min-height: 5em;
}
div.stepFiveGravelBoard p.desc,
div.stepFiveCappingRail p.desc,
div.stepFiveCutandTreat p.desc
{
    border-right:1px dashed #66686A;
    padding-right:7px;
	min-height: 5em;
}
div.divStepFive span.stepFivePrice
{
    width:95%;
    clear:both;
    text-align:right;
    float:left;
    display:block;
    margin: 4px 0 0 0;
}
div.divStepFive span.stepFiveCheckbox
{
    width:95%;
    display:Block;
    float:left;
    clear:both;
    margin: 5px 0 0 4px;
}
div.divStepFive span.stepFiveCheckbox input
{
    margin: 0 4px 0 0;
}

hr.stepFiveDivider
{
    background-color:transparent;
    border-left:1px dashed grey;
    border-right:0px solid white;
    display:block;
    float:left;
    height:208px;
    margin-right:8px;
    margin-top:24px;
    width:1px;
}
.fbSubmitButton
{
    background-image:url(/images/fence-builder/buttonBkg.jpg);
    background-repeat:repeat-x;
    border:1px solid #8E8E8E;
    font-weight:bold;
    font-size:0.8em;
    color:#303030;
}
.middle_column h3.subTotal
{
    background-repeat:no-repeat;
    background-image:url(/images/fence-builder/subTotal.gif);
    height:0px;
    padding-top:20px;
    overflow:hidden;
    width:179px;
    float:left;
    margin:0px 2px 2px 0px;
}
.middle_column h3.subTotalBasket
{
    background-image:url(/images/fence-builder/basket_total.gif);
}
.middle_column h3.subTotalDiscount
{
    background-image:url(/images/fence-builder/total_discount.gif);
}
.floatLeft
{
    float:left;
}

.floatRight
{
    float:right;
}

.subTotalText
{	
    font-size: 1.2em;
    font-weight: bold;
    padding-left: 10px;
    padding-right: 10px;	
}

#subTotal
{
	margin-top:25px
}

.clear
{
    clear:both;
}
.stepFiveTitle
{
	width:200px;
	background-repeat:no-repeat;
	padding-top:20px;
	height:0;
	overflow:hidden;
	display:block;
}
.stepFiveGravelBoard .stepFiveTitle
{
	background-image:url(/images/fence-builder/gravelboard.gif);
}
.stepFiveCappingRail .stepFiveTitle
{
	background-image:url(/images/fence-builder/cappingrail.gif);
}
.stepFiveCutandTreat .stepFiveTitle
{
	background-image:url(/images/fence-builder/cutandtreat.gif);
}
.stepFivePostcrete .stepFiveTitle
{
	background-image:url(/images/fence-builder/postcrete.gif);
}
.stepFiveScrews .stepFiveTitle
{
	background-image:url(/images/fence-builder/screws.gif);
}
.metal_button_add_to
{
	width:110px;
	height:21px;
	background-image:url(/images/fence-builder/add_to_basket.gif);
	border:0;
	display:block;
	float:left;
	clear:both;
	margin:0;
	margin-left:300px;
	margin-right:10px;
	cursor:pointer;	
}
.metal_button_clear 
{
	width:56px;
	height:21px;
	background-image:url(/images/fence-builder/clear.gif);
	border:0;
	display:block;
	float:left;
	margin:0;
	cursor:pointer;
}
	

/******************** HELP BUTTON TOOL TIP's *********************/

.helpButton
{
    float:right;
    width:32px;
    height:32px;
    display:block;
    background-image:url(/images/fence-builder/helpButton.jpg);
    background-repeat:no-repeat;
}
.helpButton:hover
{
    background-image:url(/images/fence-builder/helpButtonOvr.jpg);
}

/* This is where you can customize the appearance of the tooltip */
div#tipDiv
{
    /*function CSS*/
    position: absolute;
    visibility: hidden;
    left: 0px;
    top: 0;
    z-index: 10000;
    font-size: 11px;
    line-height: 1.2;
    -moz-opacity: .9;
    opacity: 0.9;
    filter: alpha(opacity=90);
    /*custom design/display css */
    background-color:white;
    border: dashed 1px #75666D;
    padding:1px;
    float:left;
    color:White;
}
.divTipInner
{
    background-color:#0039A6;
    width:210px;
    padding:5px 10px 10px 10px;
}
.divTipInner p
{
    margin: 5px 0;
}

.stepFiveScrews .textboxContainer
{
    margin-top: 5px;
}

.stepFiveScrews .textboxContainer .textbox
{
    margin-bottom:2px;
    display:block;
    float:left;
    margin-right:5px;
}

#viewingStyle
{
	font-weight:bold;
	text-align:center;
	margin-bottom:15px;
	position:relative;
	width:577px; float:left;
}

#viewingStyle .nextBtn{position:absolute; right:0; margin:0;}
#viewingStyle .prevBtn{position:absolute; left:0; margin:0;}

#viewingStyle a{cursor:pointer;}

.divStepFive { height: auto; margin: 0; }
