.subPanelCloseButton
{
	box-sizing: content-box;
}

#designCenterContainer select {
	-webkit-appearance: menulist-button;
	-moz-appearance: menulist;
	appearance: menulist-button;
	height: 24px;
	font-size: 14px;
}

#designCenterContainer label {
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
	font-weight: bold;
}
#designCenterContainer .grid-container {
	padding-left: 10px;
	padding-right: 10px;
}
#designCenterContainer .red-button {
	display: inline-block;
	line-height: 24px;
	height: 24px;
	min-width: 24px;
	margin: 0;
	padding: 0 15px;
	vertical-align: top;
	font-size: 12px;
	cursor: pointer;
	text-align: center;
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
	font-weight: normal;

	background-color: #d9555b;
	color: white;
	background-position: 0 0;
	border: none;
	border-radius: 4px;
	-webkit-border-radius: 4px;
}

#designCenterContainer table {
	border-collapse: separate;
	border-spacing: 2px;
}

#designCenterContainer .finishChoice div{
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
	font-weight: normal;
	font-size: 11px;
	line-height: 12px;
}

#designCenterContainer .floatLeft{
	float: left;
}

#designCenterContainer .floatRight{
	float: right;
}


.bubbletipContent input{
	width: auto;
}

.bubbletipContent {
	font-size: 12px;
	line-height: 1;
}

#designCenterContainer {
	position: relative;
	margin: 0;
	padding: 0;
}
#designCenter {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 1144px;
	height: 563px;
	font-size: 12px;
}

#designCenterLoadingPage {
	position: absolute;
	margin: 0 auto;
	padding: 0;
	top: 0;
	left: 0;
	width: 1144px;
	height: 583px;
	background: #ffffff;
	z-index: 2020;
}

#designCenterLoadingPage img {
	margin-top: 337px;
	margin-left: 592px;
}

#headerArea {
	width: 1144px;
	height: 80px;
	float: left;
	color: #666666;
}


#headerArea div.leftSideHeader {
	float: left;
	text-align:left;
	margin: 0;
	padding-top: 49px;
	width: 345px;
	height: 31px;
	font-size: 1.0em;
	font-weight: bold;
	background: url(/images/elfa/designCenter/elfaDesignCenter.png) no-repeat;
	line-height: 16px;
}

#headerArea div.leftSideHeader a {
	color: #666666;
}

#headerArea div.rightSideHeaderFront {
    background: url(https://images.containerstore.com/medialibrary/images/gww2012/elfa_DS/ElfaDesignCenter-GWW_Banner.gif) no-repeat;
    width: 615px;
   	padding-top: 60px;
}

#headerArea span {
	color: white;
}

#headerArea .liveChat span {
	color: #0061AA;
}

#headerArea div.rightSideHeaderFront .liveChat {
    display:none;
}

#controlsArea {
	margin-top: 0;
	position: relative;
	text-align: left;
	border: none;
	z-index: 320;
	background-color: #737373;
	width: 169px;
	height: 501px;
	float: left;
}

#controlsArea img {
	margin-left: 2px;
}

#leftBar {
	width: 169px;
	height: 503px;
	float: left;
}

/********** View Area ******************/

#viewArea {
	margin: 0;
	position: relative;
	width: 972px;
	height: 501px;
	float: left;
	overflow: hidden;
	border: 1px solid #cccccc;
}

#viewArea.sale {
    background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/design_center_pattern_solid.png');
}

#viewArea.non-sale {
    background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/design_center_pattern_solid_nonsale.png');
}

#viewArea #view {
	left: 0;
	position: relative;
	width: 972px;
	height: 543px;
}

#view h3 {
	color: #cf2727;
	font-size: 28px;
	font-weight: normal;
	margin-top: 30px;
	margin-left: 262px;
}

#view ul {
	margin-left: 242px;
	font-size: 18px;
	font-weight: normal;
	color: #cf2727;
	width: 460px;
	margin-bottom: 40px;
}

#view ul li {
	margin-bottom: 20px;
}

#view ul li span {
	color: #666666;
}

#view ul li span a {
	color: #666666;
	text-decoration: underline;
}

#view a.startNowButton {
	margin-left: 372px;
}

#viewArea #titleScreen {
	left: 0;
	overflow: hidden;
	position: relative;
	width: 972px;
	height: 543px;
}

#viewArea img.viewLogo {
	margin-top: 200px;
	margin-left: 387px;
	z-index: 100;
}

#viewArea img.ajaxLoader {
	margin-top: 0;
	margin-left: 423px;
	z-index: 101;
}

#spaceDrawingArea {
	position: relative;
	width: 970px;
	height: 501px;
	-webkit-print-color-adjust: exact;
}
#spaceDrawingArea div {
	position: absolute;
}
#spaceDrawingArea div.rollover {
    z-index: 105;
}
#spaceDrawingArea>img {
}

#pricingArea {
	float: right;
	width: 430px;
	height: 42px;
	display:none;
	text-align: center;

}
#pricingArea div {
	line-height: 14px;
}

#pricingArea #myPriceTab {
	font-size: 12px;
	color: #666666;
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
	font-weight: normal;
	height: 29px;
	padding: 0px;
}
#pricingArea #installedPriceTab {
	font-size: 1.0em;
	color: #666666;
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
	font-weight: normal;
	height: 29px;
	padding: 0px;
}
#pricingArea div.priceTab span {
	color: #666666;
}
#pricingArea div.priceTab span.price.onSale {
	color: #666666;
	text-decoration: line-through;
	font-weight: normal;
	font-size: 0.8em;
}
#pricingArea div.priceTab span.salePrice.onSale {
	color: #cf2727;
	text-decoration: none;
}

#pricingArea div.priceTab img {
	margin-left: 6px;
	vertical-align: bottom;
}

#headerArea #buyItButtonArea {
	float: right;
	width: 100px;
	height: 42px;
	padding: 0px;
	margin-left: 6px;
}

#headerArea #buyItButtonArea #eodcAddToCartButton {
	width: 100px;
	height: 42px;
	padding: 0px;
}

#mySpacesArea {
	height: 30px;
	float: left;
	color: white;
	font-size: 1.1em;
	padding-top: 10px;
	text-align: left;
	vertical-align: middle;
	background-color: #ffffff;
	color: #999999;
	line-height: 22px;
}

#mySpacesArea a {
	color: #999999;
}

#mySpacesArea img {
	margin-left: 3px;
	margin-right: 3px;
	vertical-align: middle;
}

#infoBox {
	font-size: 0.9em;
	color: white;
	padding: 2px 2px 2px 2px;
	background-color: #666666;
	border: none;
	position: absolute;
	display: none;
	text-align: center;
}

#infoBox a {
	color: white;
	text-decoration: none;
}

#infoBox a:hover {
	text-decoration: underline;
}

#infoBox img.buttonOverlay {
	position: absolute;
	top: 40px;
	left: 35px;
}

.videoBox {
	font-size: 0.9em;
	color: white;
	padding: 2px 2px 2px 2px;
	background-color: #666666;
	border: none;
	position: absolute;
	display: none;
	left: 150px;
	top: 100px;
	width: 300px;
	height: 224px;
	text-align: center;
}
.videoBox a {
	color: white;
	text-decoration: none;
}

.videoBox a:hover {
	text-decoration: underline;
}

div.templateStrip {
	top: 0px;
	left: 0px;
	height: 130px;
	position: absolute;
}

div.templateChoice {
	float:left;
	padding: 5px 0;
	text-align: center;
	width: 140px;
	height: 150px;
	background: url("https://images.containerstore.com/medialibrary/images/elfa/designCenter/ajax-loader_circle.gif") center no-repeat;
	cursor: pointer;
	cursor: hand;
}

div.templateChoice:hover {
	background-color: #cf2727;
}

div.templateDescription {
	display: none;
	font-size: 0.9em;
	position: absolute;
	top: 160px;
	height: 40px;
	width: 560px;
	background-color: #cf2727;
	color: white;
	align: center;
}
div.templateCount {
	float:right;
	padding-right: 33px;
}

div.templateChoice:hover div.templateDescription {
	display: block;
}

.templatesControl {
	position:absolute;
	top: 60px;
	width: 21px;
	height: 26px;
	display: none;
}

.templatesControl a:hover {
	text-decoration: none;
}

div.lessTemplates {

	left: 0px;
}

div.moreTemplates {
	left: 585px;
}

#bottomBar {
	background-color: #ffffff;
	width: 1144px;
	height: 40px;
	border: none;
}


/************ FooterImplIm ***************/

#footerArea {
	padding-top: 10px;
}


/************** Controls ***************/
#buttonsArea {
	z-index: 320;
}
div.button {
    line-height: 21px;
    text-align: left;
	width: auto;
	margin: 0;
	padding-left: 6px;
	background: url("https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_InactiveDarkGrey.gif") no-repeat;
	text-transform: none;
	font-size: 12px;
	color: #cccccc;
	padding-top: 3px;
	height: 29px;
	font-weight: normal;
	cursor: pointer;
	cursor: hand;
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
}

div.subPanel {
	left:-340px;
	display: block;
	margin-left: 0;
	width: 300px;
	background-color: #666666;
	border: none;
	color: white;
	position:absolute;
	font-size: 11px;
	text-align: left;
}

div.subPanel div.textChoice {
	padding-left: 6px;
	padding-top: 6px;
	height: 29px;
	font-size: 12px;
	cursor: pointer;
	cursor: hand;
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
	font-weight: normal;
}

div.subPanel div.imageChoice {
	width: 110px;
	height: 180px;
	float: left;
	border: 2px #666666 solid;
	text-align: center;
	margin: 1px;
	cursor: pointer;
	cursor: hand;
}

div.subPanel div.imageChoice img {
	margin: 0;
	float:left;
}

div.subPanel td {
	margin: 1px;
}

div.subPanel h3 {
    padding: 4px 20px 4px 4px;
    background: #000000;
    color: #FFFFFF;
    font-size: 16px;
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
	font-weight: normal;
	margin-bottom: 12px;
}

/* Save Space SubPanel */
#subPanel_saveSpace {
	left:-401px;
	width: 400px;
}
#subPanel_saveSpace>div {
	padding: 6px 20px 20px 20px;
	line-height: 30px;
}

#subPanel_saveSpace input {
	width: 200px;
	border: none;
}

#subPanel_saveSpace a img {
	vertical-align: middle;
}
#saveSpaceErrorMessage {
	color: #cf2727;
	display: none;
}


/* Dimensions SubPanel */
#subPanel_dimensions {
	left:0px;
	width: 500px;
	/*padding-top:5px;*/
	/*padding-left:5px;*/
}

#subPanel_dimensions span {
    line-height: 1;
}

#subPanel_dimensions input {
	width: 24px;
	border: 1px #000000 solid;
	font-size: 10px !important;
	height: 20px;
	background: #ffffff;
	color: #000000;
    border-radius: 0;
    -webkit-border-radius: 0px;
    padding: 0;
}

#subPanel_dimensions input.disabled {
	background: #999999;
	color: #cccccc;
}

#subPanel_dimensions .constraint {
    padding-left: 5px;
    padding-bottom: 5px;
}

/* DrawerStyle SubPanel */
#subPanel_drawerStyle {
	left: -240px;
	width: 232px;
}


/* DoorType SubPanel */
#subPanel_doorType div.textChoice {
	width: 294px;
	height: 65px;
}

#subPanel_doorType div.textChoice img {
	float: right;
	margin-right: 30px;
}

#subPanel_doorType.openWall a.reachInOnly {
	display: none;
}

/* WallColor SubPanel */
#subPanel_wallColor {
	left:-506px;
	width: 506px;
}

/* Finishes SubPanel */
#subPanel_finishes {
	left:-608px;
	width: 608px;
	padding: 1px;
	margin-top: -145px;
}

.finishChoice div {
	padding-top: 125px;
}

/* Gender SubPanel */
#subPanel_gender {
	left:-192px;
	width: 192px;
}

/* SpaceType SubPanel */
#subPanel_spaceType {
	left:-192px;
	width: 192px;
}

/* Alternate Views Subpanel */
#subPanel_alternateViews {
	left:-200px;
	width: 200px;
}

div.button.right {
    padding-left: 30px;
}
div.button.complete {
	color: #000000;
	text-transform: none;
}
div.button.complete.left {
	background: url("https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_CompleteEdit_Left.gif") no-repeat;
}
div.button.complete.right {
	background: url("https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_CompleteEdit_Right.gif") no-repeat;
}
div.button.active {
	color: #ffffff;
}
div.button.active.left {
	background: url("https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_ActiveRed_Left.gif") no-repeat;
}
div.button.active.right {
	background: url("https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_ActiveRed_Right.gif") no-repeat;
}
div.button:hover {
	color: #ffffff;
}
div.button.active:hover {
	color: #ffffff;
}
div.complete:hover {
	color: #ffffff;
}
div.button.nextSectionButton {
	margin-top: 20px;
}

div.button.disabled {
	color: #000000;
}
div.button.disabled:hover {
	color: #000000;
}



#subPanel_dimensions #closetDimensions {
	width:500px;
	height: 250px;
	position:relative;
	margin:0;
	padding:0;
}

#closetDimensions div {
	color: black;
	font-size: 10px;
	text-align: center;
	font-family: "Proxima N W01 Bold", "Helvetica Neue", Arial, sans-serif;
}

#doneButton {
    float: right;
    height: 20px;
    padding-right: 5px;
}

#wallConstruction {
    height: 20px;
}

#extraDimensions {
    height: 30px;
	display:none;
}

#extraDimensions label {
	display: inline-block;
}

a.panelLink {
	text-decoration: none;
}

a.panelLink:hover {
	text-decoration: none;
}
a.panelLink:visited {
	text-decoration: none;
}

a.choiceLink:visited {
	color: white;
}
a.choiceLink {
	text-decoration: none;
	color: white;
}

a.choiceLink:hover {
	text-decoration: none;
}

.colorSwatch {
	width: 24px;
	height: 24px;
}

.debug {
	color: red;
	font-weight: bold;
	display: none;
}

#waitScreen img.viewLogo {
	margin-top: 10px;
}

#waitScreen h3 {
	color: #cf2727;
	font-size: 28px;
	font-weight: normal;
	margin-top: 120px;
	margin-left: 10px;
	margin-bottom: 40px;
	text-align: center;
}

#revealSpaceSection {
	width: 100%;
	text-align: center;
}

#revealSpace a {
	font-size: 24px;
	color: #cf2727;
	text-decoration: none;
}
#revealSpace a:hover {
	color: #cf2727;
	text-decoration: none;
}

#revealSpace a:visited {
	color: #cf2727;
	text-decoration: none;
}

#birdsEyeView {
	display:none;
	position: absolute;
	top: 0;
	left: 0;
}

#schematicView {
	display:none;
	position: absolute;
	top: 0;
	left: 0;
}

#noPropsView {
	display:none;
	position: absolute;
	top: 0;
	left: 0;
	width: 974px;
	height: 503px;
}

.finishesSectionHeader {
	text-align:center;
	font-size: 1.0em;
	float:left;
	width:200px;
	border-top:1px #ffffff solid;
	border-left:1px #ffffff solid;
	height:20px;
}

#verticalTemplates {
	left: 972px;
	top: 0px;
	height: 503px;
	width: 169px;
	display: none;
	background-color: #737373;
	border: none;
	color: white;
	position:absolute;
	font-size: 1.0em;
	text-align: left;
    z-index: 300;
}

.verticalTemplatesPanel {
	display: none;
	height: 357px;
	background-color: #666666;
	overflow: auto;
	position: relative
}

.verticalTemplatesStrip {
	width: 149px;
	position: relative;
	float: right;
}

.verticalTemplateChoice {
	width: 129px;
	height: 120px;
	clear: both;
	text-align: center;
	margin-bottom: 10px;
	background: url("https://images.containerstore.com/medialibrary/images/elfa/designCenter/ajax-loader_circle.gif") center no-repeat;
	cursor: pointer;
	cursor: hand;
}

.verticalTemplateChoice:hover {
	background-color: #cf2727;
}

.upButton {
	position: absolute;
	top: 20px;
	left: 130px;
}

.downButton {
	position: absolute;
	top: 300px;
	left: 130px;
}

.vtcTip {
	display: none;
}

#vtcBubbletip {
	display: none;
}

#vtcBubbletipContent {
	width: 400px;
	height: 80px;
}

.bubbletipContent {
	width: 200px;
}

.ui-state-default {
    background: #666666;
    border: 1px solid #CCCCCC;
}

.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {
    background-color: #cf2727;
    background-image: url(/styles/themes/smoothness/images/ui-icons_e0fdff_256x240.png);
}


#topMenuBar {
	position: absolute;
	left: 292px;
	padding-top: 4px;
	top: 0px;
}

#topMenuBar div {
	border: none;
	color: #ffffff;
	float:left;
	margin-left: 5px;
	width: 88px;
	height: 20px;
	cursor: pointer;
	cursor: hand;
}

#topMenuBar a:hover {
	text-decoration: none;
}

#viewDesignButton div {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_Design_Up.gif') no-repeat;
}

#viewPlanButton div {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_BirdsEye_Up.gif') no-repeat;
}

#viewSchematicButton div {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_TechnicalView_Up.gif') no-repeat;
}

#viewDesignButton div.down {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_Design_Down.gif') no-repeat;
}

#viewPlanButton div.down {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_BirdsEye_Down.gif') no-repeat;
}

#viewSchematicButton div.down {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_TechnicalView_Down.gif') no-repeat;
}

#viewDesignButton div.inactive {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_Design_Inactive.gif') no-repeat;
}

#viewPlanButton div.inactive {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_BirdsEye_Inactive.gif') no-repeat;
}

#viewSchematicButton div.inactive {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_TechnicalView_Inactive.gif') no-repeat;
}

#propToggle div {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_Clothing_Up.gif') no-repeat;
}

#propToggle div.down {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_Clothing_down.gif') no-repeat;
}

#propToggle div.inactive {
	background: url('https://images.containerstore.com/medialibrary/images/elfa/designCenter/Button_Clothing_Inactive.gif') no-repeat;
	cursor: default;
}

table.bubbletip {
	z-index: 999;
}

div.unavailable#walkInChoice, div.unavailable#childChoice {
    opacity: 0.2;
    cursor: not-allowed;
}

#renderHistory {
	overflow: auto;
	height: 200px;
	width: 169px;
}

#renderHistory div {
	float: left;
	width: 150px;
	height: 66px;
	vertical-align: middle;
	color: white;
}

#renderHistory div img {
	vertical-align: middle;
}

#renderHistory div.currentlyRendered {
	font-weight: bold;
	color: black;
}

#addThisSection a {
	color: white;
}

#wallConstructionSelection {
    width: 100%;
}