/*************************************************** LIGHTS 4 FUN POPUPS **********************************************/

/*** RESET STYLES ***/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, input, select, textarea, 
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	font-family: Tahoma, Verdana, Arial, "sans serif";
}
:focus {outline: 0;}
ol, ul {list-style: none;}
a {text-decoration:none;}
a:hover {text-decoration:underline;}
p {font-weight:normal;}
strong, h1, h2, h3, h4, h5, h6 {font-weight:bold;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal; vertical-align: middle;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
hr {display:none;}
div.hr {height:1px; clear:both; background-position:0 0; background-repeat:repeat-x;}
legend {display:none;}

/************************************ SITE SETTINGS *****************************************/

body {width: 100%; height: 100%; background-color: #000; line-height: 1; color: #fff;}

.clear {clear:both;} 
.clear0 {height:0px; line-height:0px; clear:both;}
.clear5 {height:5px; line-height:5px; clear:both;}
.clear10 {height:10px; line-height:10px; clear:both;}

.irt10px {padding: 10px 0 0 0; overflow: hidden; height: 0px !important; height /**/:10px;} 

/****************************************** CONSTRUCTION ***************************************/

#popContainer {width:600px; height: auto; margin:0; padding:0;}
#popContainer480 {width:480px; height: auto; margin:0; padding:0;}
#popContainer440 {width:440px; height: auto; margin:0; padding:0;}
#popContainer550 {width:550px; height: auto; margin:0; padding:0;}
#popContainer716 {width:716px; height: auto; margin:0; padding:0;}

#headerContainer {position: relative; width: 100%; height: 195px; background: url(../img/popups/headerSlice.gif) repeat-x left top;}
#header {position: relative; width: 488px; height: 81px; margin: 0 auto;}
#popContainer480 #header {width: 429px;}
#popContainer440 #header {width: 429px;}
#popContainer550 #header {width: 540px;}
#popContainer716 #header {width: 706px;}
#header .logo {position:absolute; top:15px; left:18px; width:225px; height:50px;}

#mainContainer {position: relative; width: 488px; background: url(../img/popups/containerBg488.gif) repeat-y left top; margin:-123px auto 0 auto; z-index:100;}
#mainContainer .top {width: 488px; background: url(../img/popups/containerTop488.gif) no-repeat left top;}
#mainContainer .bottom {width: 488px; background: url(../img/popups/containerBottom488.gif) no-repeat left bottom; padding:19px 0 10px 0;}
#popContainer480 #mainContainer, #popContainer440 #mainContainer {width: 429px; background: url(../img/popups/containerBg429.gif) repeat-y left top;}
#popContainer480 #mainContainer .top, #popContainer440 #mainContainer .top {width: 429px; background: url(../img/popups/containerTop429.gif) no-repeat left top;}
#popContainer480 #mainContainer .bottom, #popContainer440 #mainContainer .bottom {width: 429px; background: url(../img/popups/containerBottom429.gif) no-repeat left bottom;}
#popContainer550 #mainContainer {width: 540px; background: url(../img/popups/containerBg540.gif) repeat-y left top;}
#popContainer550 #mainContainer .top {width: 540px; background: url(../img/popups/containerTop540.gif) no-repeat left top;}
#popContainer550 #mainContainer .bottom {width: 540px; background: url(../img/popups/containerBottom540.gif) no-repeat left bottom;}
#popContainer716 #mainContainer {width: 706px; background: url(../img/popups/containerBg706.gif) repeat-y left top;}
#popContainer716 #mainContainer .top {width: 706px; background: url(../img/popups/containerTop706.gif) no-repeat left top;}
#popContainer716 #mainContainer .bottom {width: 706px; background: url(../img/popups/containerBottom706.gif) no-repeat left bottom;}

#footerContainer {position: relative; width: 100%; background: #000 url(../img/popups/footerSlice.gif) repeat-x left top; margin-top:-38px;}
#popContainer480 #footerContainer, #popContainer440 #footerContainer {margin-top:-47px;}
#footer {position: relative; width: 488px; height:85px; margin: 0 auto; padding-top:50px;}
#popContainer480 #footer {width: 429px; height:20px;}
#popContainer440 #footer {width: 429px; height:5px;}
#popContainer550 #footer {width: 540px; height:5px;}
#popContainer716 #footer {width: 706px; height:5px;}
#footer ul {position: relative; font-size: 11px; width: 100%; text-align: center; margin: 0;}
#footer ul li {list-style: none; color: #fff; display: inline; line-height: 16px;}
#footer ul li a {color: #fff; font-weight: normal; text-decoration: none; margin: 0 5px;}
#footer ul li a:hover {text-decoration: underline;}
#footer ul li.type a {font-size:10px;}

/********* COMMON STYLES *********/

.headerBar {position: relative; width: 450px; height: 28px; background: url(../img/headerBarSprite.gif) no-repeat left -84px; margin:0 auto 10px auto; z-index:10;}
#popContainer480 .headerBar, #popContainer440 .headerBar {width: 391px; background-position: left -112px;}
#popContainer550 .headerBar {width: 502px; background-position: left -140px;}
#popContainer716 .headerBar {width: 668px; background-position: left -168px;}
.headerBar h1 {color: #00c3c3; font-size: 14px; text-indent: 13px; line-height:25px;} 

.greyBox {position: relative; width: 373px; background: #edeeee url(../img/popups/greyBoxTop.gif) no-repeat left top; margin:0 auto 10px auto;}
.greyBox .background {width:351px; padding:10px 12px 12px 12px; background: url(../img/popups/greyBoxBottom.gif) no-repeat left bottom;}
.greyBox .background p {color: #2b2e38; font-size: 11px; margin: 0; line-height: 14px;}

fieldset {margin: 0; padding-top: 10px; position: relative;}
.popupField {clear:both; float:left; display:inline; position:relative; width:373px; padding:0; margin:0 0 4px 0; color:#2b2e38; font-size:11px;}
.popupField label {display:block; float:left; display:inline; font-size:11px; color:#2b2e38; font-weight: bold; text-align:right; width:90px; padding-top:4px;}
.popupField input {display:block; float:left; display:inline; width:179px; margin:0 10px; border:1px solid #a4a4a4; padding:2px 0 2px 4px; color: #3e3e3e; background-color: #dde1e5;}
.popupField textarea {display:block; float:left; display:inline; width:179px; height: 70px; margin:0 10px; border:1px solid #a4a4a4; padding:2px 0 2px 4px; color: #3e3e3e; background-color: #dde1e5;}

.errorMsg {position: relative; clear: both; top: 0px; background: url(../img/icons/errorIconTrans.gif) no-repeat left top; color:#ff0000; font-weight: normal; font-size: 11px; margin: 0; width: 200px; height: 16px; line-height: 15px; text-indent: 20px; padding: 0;}
.fieldError label {color: #ff0000;}
.fieldError input {border: 1px solid #ff0000;}

/*** PRODUCT POPUP ***/
.productContainer {position: relative; width: 450px; background: url(../img/popups/productContainer.jpg) no-repeat; margin:-14px auto 0 auto; padding:15px 0 1px 0;}
.productContainer .placeholder {position: relative; width: 422px; height: 422px; margin:0 auto 15px auto;}
.productContainer .description {position:relative; width:410px; margin:0 auto; padding: 18px 0 5px 0;}
.productContainer .description h2.header {margin-bottom:5px; color: #019296; font-size: 12px;}
.productContainer .description h2 {margin-bottom:5px; color: #000; font-size: 11px;}
.productContainer .description p {margin-bottom:10px; color: #000; font-size: 11px; line-height: 14px;}

/*** PRODUCT SYMBOLS POPUP ***/
.symbolsContainer {position: relative; width: 367px; margin:0 auto; padding:10px 0 20px 0;}
.symbolsContainer .symbol {position: relative; width: 367px;}
.symbolsContainer .symbol .image {float:left; display:inline; width:69px; height:49px; background: url(../img/popups/symbolsSprite.gif) no-repeat 0 0;}
.symbolsContainer .symbol.outdoor .image{background-position: 0 5px;}
.symbolsContainer .symbol.indoor .image {background-position: -69px 5px;}
.symbolsContainer .symbol.fuse .image {background-position: -138px 5px;}
.symbolsContainer .symbol.mains .image {background-position: -207px 5px;}
.symbolsContainer .symbol.battery .image {background-position: -276px 5px;}
.symbolsContainer .symbol.lowVoltage .image {background-position: -345px 5px;}
.symbolsContainer .symbol.plugYes .image {background-position: -414px 5px;}
.symbolsContainer .symbol.plugYes .description {padding-bottom:20px;}
.symbolsContainer .symbol.plugNo .image {background-position: -483px 5px;}
.symbolsContainer .symbol.connectable .image {background-position: -552px 5px;}
.symbolsContainer .symbol.tealight .image {background-position: -621px 4px;}
.symbolsContainer .symbol.led .image {background-position: -690px 5px;}
.symbolsContainer .symbol.traditional .image {background-position: -759px 0;}
.symbolsContainer .symbol.static .image {background-position: -828px 0;}
.symbolsContainer .symbol.multi .image {background-position: -897px 5px;}
.symbolsContainer .symbol .description {float:left; display:inline; width: 293px; padding:0 5px 1px 0;}
.symbolsContainer .symbol .description h2 {color:#2b2e38; font-size:11px; line-height:14px;}
.symbolsContainer .symbol .description p {color:#2b2e38; font-size:11px; line-height:14px; margin-bottom:15px;}

/*** SECURITY CODE ***/
.securityCodeContainer {position: relative; width:373px; padding: 10px 0 30px 0; margin:0 auto;}
.securityCodeContainer img {position: relative; width:207px; height: 118px; margin: 0 0 5px 30px; padding:0;}
.securityCodeContainer p.securityCodeNum {position: absolute; top: 116px; left: 242px; color: #be0027; width: 100px; font-size:11px; line-height:14px;}

/*** FORGOTTEN PASSWORD ***/
.forgotPassContainer {position:relative; width:373px; height: 100px; padding:10px 0 20px 0; margin:0 auto;}
.forgotPassContainer .popupField label {width:95px;}
.forgotPassContainer .errorMsg {margin-left: 105px;}
.forgotPassResponse {position:relative; width:373px; height: 70px; padding:30px 0; margin:0 auto; text-align: center;}
.forgotPassResponse h3.thankyouHeader {background: url(../img/thankyouHeader.png) no-repeat; display:block; margin: 0 auto 10px auto; padding-top: 23px; overflow: hidden; height: 0px !important; height /**/:23px; width:111px;}
.forgotPassResponse p {margin: 0; color: #2b2e38; font-size: 11px;}

/*** EMAIL A FRIEND ***/
.emailFriendContainer {position:relative; width:373px; padding: 10px 0 30px 0; margin:0 auto;}
.emailFriendContainer .popupField {margin:0 0 9px 0;}
.emailFriendContainer .popupField label {width:130px;}
.emailFriendContainer .popupField span.star {color: #ff0000; font-weight: normal;}
.emailFriendContainer p.required {color: #ff0000; font-size: 9px; font-weight: normal; margin: 0 0 0 140px; width: 100px;}
.emailFriendContainer .errorMsg {top: 5px; margin: 0 0 0 140px;}
.emailFriendResponse {position:relative; width:373px; height: 253px; padding: 75px 0 0 0; text-align: center; margin:0 auto;}
.emailFriendResponse h3.thankyouHeader {background: url(../img/thankyouHeader.png) no-repeat; display:block; margin: 0 auto 10px auto; padding-top: 23px; overflow: hidden; height: 0px !important; height /**/:23px; width:111px;}
.emailFriendResponse p {margin: 0; color: #2b2e38; font-size: 11px; margin-bottom: 15px; line-height: 16px;}

/*** TERMS & CONDITIONS ***/
.termsContainer {position: relative; width:502px; padding-bottom:1px; margin:0 auto;}
.termsContainer h2 {color: #2b2e38; font-size: 11px; margin: 0 10px 5px 10px;}
.termsContainer p {color: #2b2e38; font-size: 11px; margin: 0 10px 12px 10px; line-height: 14px;}
.termsContainer p a {color:#25A8AC; font-size:11px; font-weight:normal; text-decoration:underline;}
.termsContainer p a:hover {text-decoration:none;}

/*** GALLERY IMAGE ***/
.galleryContainer {position: relative; width:668px; height:531px; background: url(../img/popups/galleryContainer.jpg) no-repeat; margin:-14px auto 0 auto; padding-top:15px;}
.galleryContainer .placeholder {position: relative; width: 640px; height: 480px; margin:0 auto 15px auto; text-align:center;}

/*** PAYPAL ***/
.paypalContainer {position:relative; width:373px; padding:60px 0 30px 0; margin:0 auto; background: url(../img/popups/paypalImg.gif) no-repeat left 5px;}
.paypalContainer p {color:#019296; font-size:11px; margin-bottom:12px; line-height:14px;}