
/* - - - - - - - - - - - - - - - - - - - - - - -

Title :    Innovate Retail
URL :      http://innovateretail.com/

Created :  05.25.2010
Modified : 05.27.2010

- - - - - - - - - - - - - - - - - - - - - - - */

/* -----------------------------------------
Global Reset
v1.0 | 20080212 
http://meyerweb.com/eric/tools/css/reset/
-------------------------------------------- */
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,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; background: #ffc; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }

/* remember to define focus styles! */
:focus { outline: none; }

/* Font Reset */
body { font-family: Arial, Verdana, sans-serif; font-size: 62.5%; line-height: 1em; }
html>body { font-size: 10px; }

/* Navigation Reset */
.nav, .nav li, .nav ul, .nav ul li { margin: 0; padding: 0; list-style: none; font-size: 1em; }

/* ----------------------------------------- 
Clearfix Hack [slightly enhanced]
http://perishablepress.com/press/2008/02/05/
-------------------------------------------- */
.clearfix:after, #section:after { 
	visibility: hidden; 
	display: block; 
	font-size: 0; 
	content: " "; 
	clear: both; 
	height: 0;
}
.clearfix, #section { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix, * html #section { height: 1%; }
.clearfix, #section { display: block; }
/* close commented backslash hack */

/* - - - - - - - - - - - - - - - - - - - - - - -
	HTML ELEMENTS
- - - - - - - - - - - - - - - - - - - - - - - */

/* Anchor Links  -------------------------------------------------------------- */

a:link { color: #5F6062; text-decoration: underline; }
a:visited { color: #5F6062; text-decoration: underline; }
a:hover {  color: #5F6062; text-decoration: none; }
a:active {  color: #5F6062; text-decoration: none; }

a:focus { outline: none; }

/* Headings  -------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 { font-weight: bold; }

h1 { 
	margin: 0 0 .5em; 
	font-size: 3em; 
	line-height: 1em; 
	color: #B30839;
}

h2 { margin: 0 0 .75em; font-size: 2.2em; color: #B30839; }
h3 { margin: 0 0 0.5em; font-size: 1.8em; line-height: 1em; }
h4 { margin: 0 0 1.25em; font-size: 1.4em; font-weight: bold; line-height: 1.25em; }
h5, h6 { margin: 0 0 1.5em; font-weight: bold; font-size: 1.2em; }
h6 { margin: 0; }

/* Text Elements  -------------------------------------------------------------- */

p, ul, ol, dl, blockquote, pre { margin: 0 0 1em; font-size: 1.4em; line-height: 1.4em; }

blockquote { 
	margin: 1.5em;
	padding: 0 0 0 1.5em;
	border-left : 1px solid #666;
	font-size: 1.2em;
	font-family: Georgia, "Times New Roman", Times, serif; 
	font-style: italic;
}

small, cite { font-size: .9em; }
strong, b, dt, th, dfn { font-weight: bold; }
address, cite, em, i, caption, dfn, var { font-style: italic; }

ul, ol { margin: 0 1.5em 1.5em; }
ul ul, ol ol, ul ol, ol ul { font-size: 1em; margin: 0 0 1em 2em; }

ul p, ol p { font-size: 1em; }

ul { list-style-type: disc; }
ul ul { list-style-type: circle; }
ul ul ul { list-style-type: square; }
ul ul ul ul { list-style-type: disc; }

ol { list-style-type: decimal; }
ol ol { list-style-type: upper-roman; }
ol ol ol { list-style-type: lower-roman; }
ol ol ol ol { list-style-type: upper-alpha; }

dl { margin: 0 0 1.5em; padding-top: 1.5em; border-top : 1px solid #ccc; }
dt { font-weight: bold; margin: 0; font-size : 1.2em; line-height : 1.25; }
dd { margin: 0 0 1.5em; padding: 0 0 1.5em; border-bottom : 1px solid #ccc; }

del { text-decoration: line-through; }
abbr, acronym { font-style: normal; }
acronym, abbr { border-bottom: 1px dotted #333; cursor: help; }
acronym { text-transform: uppercase; }
pre, kbd, code, samp, tt, var { font-family: 'andale mono', 'lucida console', monospace; }

pre { white-space: pre; }
code { display: block; }

sub { font-size: 0.9em; line-height: 1em; vertical-align: sub; }
sup { font-size: 0.9em; line-height: 1em; vertical-align: super; }

/* Tables  -------------------------------------------------------------- */

table {	margin: 0 0 1.5em; font-size: 1.2em; }
caption { text-align: left; }
th, td { padding: 0.25em 0.5em; vertical-align: top; }
tbody td, tbody th { border: 1px solid #999; }
tfoot { font-size: .9em; font-style: italic; }

/* Images  -------------------------------------------------------------- */

img { vertical-align: top; }

/* - - - - - - - - - - - - - - - - - - - - - - -
	PRIMARY LAYOUT
- - - - - - - - - - - - - - - - - - - - - - - */

/* Global Styles  -------------------------------------------------------------- */

body {
	color: #555;
	background-color: #fff;
	background-image: url(../images/body_bg.png);
	background-repeat: repeat-x;
}

#wrapper {
	margin: 0 auto;
	width: 960px;
	text-align: left;
}

/* Global Classes */
.hidden { display: none; }

/* Header  -------------------------------------------------------------- */

#header {
	position: relative;
	height: 186px;
}

#header #branding img {
	position: absolute;
	top: 36px;
	left: 10px;
}

#header #branding p {
	position: absolute;
	top: 108px;
	right: 0;
	width: 410px;
	height: 25px;
	text-indent: -9999em;
	overflow: hidden;
	background: url(../images/branding_slogan.gif) no-repeat 0 0;
}

/* Utility Navigation */
ul#utility-nav { position: absolute; top: 36px; right: 0; display: block; margin: 0; list-style: none; overflow: hidden; }
ul#utility-nav li { display: inline; margin: 0 0 0 -0.25em; list-style: none; border-left: 1px solid #5F6062; }
ul#utility-nav li:first-child { display: none; }
ul#utility-nav li a { color: #5F6062; text-decoration: none; padding: 0 0.5em; }
ul#utility-nav li a:hover { text-decoration: underline; }

/* Header Navigation */
#header .nav {
	position: absolute;
	right: 0;
	bottom: 0;
	display: block;
	margin: 0;
	overflow: hidden;
	list-style: none;
	background: #B30839;

	/* Border Radius */
	-moz-border-radius-topleft: 8px;
	-webkit-border-top-left-radius: 8px;
	
	-moz-border-radius-topright: 8px;
	-webkit-border-top-right-radius: 8px;
}

#header .nav li {
	display: inline;
	margin: 0 0 0 -0.5em;
	list-style: none;
	border-left: 1px solid #fff;
}

#header .nav li a {
	display: inline-block;
	font-size: 1.2em;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	padding: 0.7em 1.9em;
	color: #fff;
}

#header .nav li a:hover, 
#header .nav li a:focus { text-decoration: underline; outline: none; }

body#consumer #header .nav li#gn-consumer a, 
body#projects #header .nav li#gn-projects a, 
body#research #header .nav li#gn-research a, 
body#company #header .nav li#gn-company a, 
body#contact #header .nav li#gn-contact a { color: #F6BC3A; }

/* Section  -------------------------------------------------------------- */

#section {
	clear: both;
	padding: 20px 20px 120px;
	border: 1px solid #AFAFB0;
	border-top-width: 14px;
	background: url(../images/footer_icons.gif) no-repeat center bottom;
	
	/* Border Radius */
	-moz-border-radius-bottomleft: 8px;
	-webkit-border-bottom-left-radius: 8px;
	
	-moz-border-radius-bottomright: 8px;
	-webkit-border-bottom-right-radius: 8px;
}

/* Footer  -------------------------------------------------------------- */

#footer {
	clear: both;
	padding: 1em 0;
	text-align: right;
	color: #5F6062;
	background: url(../images/body_bg.png) repeat-x 0 -34px;
	
	/* Border Radius */
	-moz-border-radius-topleft: 8px;
	-webkit-border-top-left-radius: 8px;
	
	-moz-border-radius-topright: 8px;
	-webkit-border-top-right-radius: 8px;
}

#footer p { font-size: 1.3em; }

#footer a { text-decoration: none; }
#footer a:hover { text-decoration: underline; }

/* - - - - - - - - - - - - - - - - - - - - - - -
	SECONDARY LAYOUT
- - - - - - - - - - - - - - - - - - - - - - - */

/* TELEPHONE PAGES  -------------------------------------------------------------- */

body.telephone-page #section .article {
	zoom: 1;
	padding: 20px 0 0 250px;
	background: url(../images/icon_telephone.jpg) no-repeat 35px 10px;
}

.telephone { margin: 0 0 20px; }

/* VIDEO PAGES  -------------------------------------------------------------- */

body.video-page #section .article {
	zoom: 1;
	padding: 20px 0 0 250px;
	background: url(../images/icon_video.jpg) no-repeat 35px 10px;
}

.video { margin: 0 0 20px; }

/* REPORT PAGES  -------------------------------------------------------------- */

body.report-page #section .article {
	zoom: 1;
	padding: 20px 0 0 250px;
	background: url(../images/icon_reports.jpg) no-repeat 57px 10px;
}

/* SHOP PAGES  -------------------------------------------------------------- */

body.shop-page #section .article {
	zoom: 1;
	padding: 20px 0 0 250px;
	background: url(../images/icon_building.jpg) no-repeat 35px 10px;
}

/* LOGIN PAGE  -------------------------------------------------------------- */

body#login-page #header .nav, 
body#login-page #utility-nav { display: none; }


#login-form {
	width: 440px;
	margin: 18px auto 0 auto;
	padding: 4px;
	background-color: #fff;
	border: 1px solid #B30838;
}

#login-form fieldset {
	padding: 4px;
	text-align: center;
	background-color: #F2F2F2;
}

#login-form h2 {
	padding: 10px;
	font-size: 1.8em;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	background-color: #B30838;
}

#login-form .field {
	width: 400px;
	text-align: left;
}

#login-form label {

	/* Cross-Browser Inline-Block */
	display: -moz-inline-stack; /* FF2 inline-block */
	display: inline-block; 
	vertical-align: top;
	zoom: 1;
	*display: inline; /* IE7 inline-block */

	width: 120px;
	padding: 6px 10px;
	font-size: 1.4em;
	font-weight: bold;
	text-align: right;
}

#login-form input {
	width: 250px;
	height: 20px;
	margin: 0 0 10px;
	background: #fff;
	border: 1px solid #9A9A9C;
}

#login-form input:focus {	border: 1px solid #5F6062; outline: 1px solid #9A9A9C; }

#login-form button {
	margin: 0 auto;
	padding: 3px 12px;
	border: none;
	font-size: 1.3em;
	font-weight: bold;
	background: #B30839;
	color: #fff;
	cursor: pointer;
}

/* LOGIN LANDING  -------------------------------------------------------------- */

#logout-nav {
	text-align: right;
	font-size: 1.4em;
	font-weight: bold;
}

#icon-nav {
	width: 700px;
	margin: 0 auto;
	padding: 40px 0 0;
}

#icon-nav li a {
	float: left;
	display: block;
	width: 350px;
	padding: 155px 0 18px;
	font-size: 1.8em;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
}

#icon-nav li#access-shops a { background: url(../images/icon_shops.jpg) no-repeat center top; }
#icon-nav li#access-videos a { background: url(../images/icon_video.jpg) no-repeat center top; }

#icon-nav li a:hover { text-decoration: underline; }

/* HOME PAGE  -------------------------------------------------------------- */

body#homepage #section {
	padding: 0;
	border-right: none;
	border-left: none;
	border-bottom: none;
	background: none;
	
	/* Border Radius */
	-moz-border-radius-bottomleft: 0;
	-webkit-border-bottom-left-radius: 0;
	
	-moz-border-radius-bottomright: 0;
	-webkit-border-bottom-right-radius: 0;
}

body#homepage #banner-img {
	margin: -19px 0 0;
	border-bottom: 14px solid #AFAFB0;
}

body#homepage .article {
	float: right;
	position: relative;
	width: 675px;
	height: 290px;
	padding: 20px;
	overflow: hidden;
	color: #fff;
	background: url(../images/home_article_bg.gif) no-repeat 0 0;
}

body#homepage .column-1 { float: left; width: 430px; }
body#homepage .column-2 { float: right; width: 218px; }

body#homepage .column-1  h1 {
	display: block;
	margin: 0 0 14px;
	text-indent: -9999em;
	overflow: hidden;
}

body#homepage .column-1 p { font-size: 1.6em; line-height: 1.5em; }
body#homepage .column-2 p { font-size: 1.8em; line-height: 1.4em; }

/* Client Login */
p#client-login { margin: 0 0 18px; }

p#client-login a {
	display: block;
	height: 56px;
	text-indent: -9999em;
	overflow: hidden;
}

/* Click Here Link */
p#click-here {
	clear: both;
	position: absolute;
	bottom: 20px;
	left: 20px;
	right: 20px;
	
}

p#click-here a {
	display: block;
	height: 90px;
	text-indent: -9999em;
	overflow: hidden;
}

/* Sidebar Callouts */
body#homepage .aside {
	float: left;
	width: 221px;
	height: 318px;
	padding: 12px 0 0 10px;
	background: url(../images/home_callouts.gif) no-repeat 10px 12px;
}

body#homepage .aside a {
	display: block;
	height: 54px;
	margin: 0 0 5px;
	text-indent: -9999em;
	overflow: hidden;
}

body#homepage #footer { position: relative; padding: 0; background-image: none; }
body#homepage #footer p { position: absolute; top: -18px; right: 0; padding: 0 0 28px; }

/* CONSUMER INSIGHT LANDING  -------------------------------------------------------------- */

ul#consumer-map {
	position: relative;
	display: block;
	width: 686px;
	height: 587px;
	margin: 0 auto;
	padding: 0;
	overflow: hidden;
	background: url(../images/consumer_insight_map.png) no-repeat 0 0;
}

ul#consumer-map li a {
	position: absolute;
	display: block;
	width: 240px;
	height: 210px;
	text-indent: -9999em;
	overflow: hidden;
}

ul#consumer-map li#cm-telephone a { top: 0; left: 0; }
ul#consumer-map li#cm-web-surveys a { top: 240px; left: 0; }
ul#consumer-map li#cm-shops a { top: 410px; left: 210px; }
ul#consumer-map li#cm-video a { top: 280px; right: 0; }
ul#consumer-map li#cm-phone-surveys a { top: 0; right: 0; }

ul#consumer-map li#cm-pricing a { top: 220px; left: 260px; width: 200px; height: 60px; }

/* CONTENT COLUMNS  -------------------------------------------------------------- */

body.columns #section {
	padding: 20px 0 120px 60px;
}

body.columns #section p {
	max-width: 820px;
}

body.columns .article h3 {
	padding: 8px 2px 8px 6px;
	color: #fff;
}

body.columns ul p { color: #555; }

body.columns .first ul,
body.columns .first strong { color: #FD7A0B; }

body.columns .second ul,
body.columns .second strong { color: #8CC53E; }

body.columns .third ul,
body.columns .third strong { color: #7754A3; }

body.columns .fourth ul,
body.columns .fourth strong { color: #2063A4; }

body.columns .first h3 { background: #FD7A0B; }
body.columns .second h3 { background: #8CC53E; }
body.columns .third h3 { background: #7754A3; }
body.columns .fourth h3 { background: #2063A4; }

/* Tri-Column Layout */
body.tri-columns .article {
	float: left;
	width: 250px;
	margin: 30px 40px 0 0;
}

/* Quad-Column Layout */
body.quad-columns .article {
	float: left;
	width: 210px;
	margin: 10px 10px 0 0;
}




