/* Structure */
html {}
body {min-height: 700px; font-family: Arial, sans-serif; background: url(../images/normal-bg.png) top center no-repeat;}
body.homepage {background: url(../images/homepage-bg.png) top center no-repeat;}



#wrapper {margin: 0px auto; position: relative;}
#accountNav {}

#header {height: 130px; position: relative; margin-bottom: 28px;}
.homepage #header {height: 130px; position: relative; margin-bottom: 18px;}


#mainNav {}
#page-wrapper {}
#footer { clear: both; border-top: 2px solid #efefef; padding-top: 10px; margin-top: 15px;}


/* Logo */
#logo {text-indent: -999em; width: 326px; height: 111px; position: absolute; top: 20px; left: 0px;}
#logo a {display: block; width: 326px; height: 111px; background: url(../images/luft-and-co-logo.jpg) 0px 0px no-repeat;}


/* General Styles */
em {font-style: italic;}
strong {font-weight: bold;}
h1, h2, h3, h4, h5, h6 {margin-bottom: 13px; font-weight: bold; line-height: 140%;}
a {color: #1e77e3;}
a:visited {color: #1e77e3;}
a:hover {color: #005aff;}
.content h1 {font-size: 24px; margin-bottom: 13px;}
.content h2 {font-size: 20px; margin-bottom: 12px;}
.content h3 {font-size: 18px; margin-bottom: 9px;}
.content h4 {font-size: 16px; margin-bottom: 8px;}
.content h5 {font-size: 14px; margin-bottom: 5px;}
.content h6 {font-size: 12px; margin-bottom: 3px;}
p {font-size: 14px; margin-bottom: 16px; font-family: Georgia, sans-serif; color: #666; line-height: 150%;}
.big {font-size: 18px;}
.content ul {font-size: 14px; font-family: Georgia, sans-serif; color: #666; line-height: 150%; margin-bottom: 20px; padding-left: 20px; list-style: disc;}
.content ol {font-size: 14px; font-family: Georgia, sans-serif; color: #666; line-height: 150%; margin-bottom: 20px; padding-left: 20px;}
.content li {margin-bottom: 5px;}
.content .principles {padding-left: 10px;}
.content .principles li {padding-left: 26px; background: url(../images/checkmark.png) 0px 0px no-repeat; font-weight: bold; list-style: none;}

.content ul.details {font-family: Arial, sans-serif; font-size: 11px; background: #efefef; border: 1px dashed #ccc; padding: 5px 0 2px 10px; list-style: none;}

.headlineImage {margin-bottom: 20px;}
.content .center {margin-bottom: 15px;}
.grid_img_3 {padding: 5px; background: #efefef;}
.grid_img_4 {padding: 5px; background: #efefef;}

#footer p {font-size: 10px; text-align: right; color: #ccc;}
#footer p a {color: #ccc;}

/* Main Navigation */
#nav {position: absolute; height: 52px; right: 0px; bottom: -1px;}
#nav li {display: block; height: 52px; float: left; line-height: 75px; background: url(../images/nav-divider.png) 100% 0% no-repeat;}
#nav li.last {background: transparent;}
#nav li a {font-family: Georgia, serif; text-decoration: none; display: block; height: 52px; padding: 0 12px; font-size: 12px; font-weight: bold; text-transform: uppercase;}

#nav li.home a {color: #046da4;}
#nav li.home a:visited {color: #046da4;}
#nav li.home a:hover {color: #046da4;}

#nav li.philosophy a {color: #3dc6f2;}
#nav li.philosophy a:visited {color: #3dc6f2;}
#nav li.philosophy a:hover {color: #3dc6f2;}

#nav li.bulkorders a {color: #89c53f;}
#nav li.bulkorders a:visited {color: #89c53f;}
#nav li.bulkorders a:hover {color: #89c53f;}

#nav li.portfolio a {color: #f33838;}
#nav li.portfolio a:visited {color: #f33838;}
#nav li.portfolio a:hover {color: #f33838;}

#nav li.ourbags a {color: #e7ca01;}
#nav li.ourbags a:visited {color: #e7ca01;}
#nav li.ourbags a:hover {color: #e7ca01;}

#nav li.contact a {color: #f6871b;}
#nav li.contact a:visited {color: #f6871b;}
#nav li.contact a:hover {color: #f6871b;}


/* Account Navigation */
#accountNav ul {width: 215px; height: 29px; position: absolute; right: 0px; top: 10px; display: none;}
#accountNav ul li {display: inline; line-height: 29px; margin-right: 10px; position: relative;}
#accountNav ul li a {text-decoration: none; text-transform: lowercase; font-size: 12px; color: #333;}


/* CUBE */
#cube {height: 340px; margin-bottom: 30px; position: relative; left: 10px;}

/* Homepage Banner */
.green-benefits {width: 300px; height: 120px; background: url(../images/green-benefits.jpg) 0px 0px no-repeat;}
.green-benefits a {display: block; width: 300px; height: 120px; text-indent: -999em;}

/* Product Catelog View */
.productBox h3 {text-align: center;}

.productFeatureImage {background: #efefef; position: relative; padding: 5px 0;}
.productFeatureImage a {display: block; width: 290px; height: 360px; margin: 0 auto;}


/* Product Gallery */
.mainImage {display: block; width: 290px; height: 360px; background: url(../images/ajax-loader.gif) 50% 50% no-repeat; border: 3px solid #efefef;}
.thumbs a {display: block; width: 73px; height: 90px; margin-bottom: 15px; padding: 3px; background: #efefef; position: relative; left: 25px;}

/* Image Gallery */
#galleryLeft {width: 375px; height: 500px; float: left; padding: 0 45px 0 0;}
#galleryRight {width: 540px; float: left;}
#assetShow {width: 375px; height: 500px; padding: 5px; margin-bottom: 15px; background: #efefef;}
.gallerySelect {background: #d0e1f5; border: 1px solid #aabed4; padding: 8px 20px; margin-bottom: 15px;}
.gallerySelect label {font-weight: bold; font-size: 12px; color: #47586c; margin-right: 5px;}
.gallerySelect select {width: 200px;}
#assetIndex a {display: block; width: 110px; height: 90px; float: left; display: inline; margin: 0 10px 10px 0; padding: 3px; background: #efefef;}
#assetIndex {margin-bottom: 20px;}
.galleryDescription {border-bottom: 1px dotted #cccccc; margin-bottom: 15px;}

/* Form Stuff */
#new_user_session label {display: block; font-size: 12px;}
#new_user_session input[type="text"], #new_user_session input[type="password"] {margin-bottom: 15px;}

/* Errors, Notices, and Form Explanations */
.errorExplanation {padding: 15px 15px 5px 15px; margin-bottom: 20px; background: #ffeded; border: 1px solid #d0a2a2; font-family: Arial;}
.errorExplanation li {font-weight: bold; color: #000000; font-size: 12px; font-family: Arial;}
.fieldWithErrors input {background: #fff url(../images/input-field-error.png) 96% 50% no-repeat;}
.fieldWithErrors textarea {background: url(../images/input-field-error.png) 99% 4px no-repeat;}
.errorExplanation p {font-size: 12px; color: #000000; font-family: Arial;}
p.notice {background: #cbf7ca url(../images/notice.png) 10px 50% no-repeat; border: 1px solid #71b170; color: #274c26; padding: 11px 0 11px 50px; margin-bottom: 20px; font-weight: bold;}
p.error, p.alert {background: #f4d3d3 url(../images/error.png) 10px 50% no-repeat; border: 1px solid #834949; color: #3b1e1e; padding: 11px 0 11px 50px; margin-bottom: 20px; font-weight: bold;