body {
	font-size: 12px;
	font-family: Helvetica, Verdana, Arial, sans-serif;
    background: #231f20 url(http://www.shadesoptical.com/images/backgroundGradient.jpg) no-repeat center top;
    padding: 0px;
    margin: 0px;
}



/* ----------------------------------- Site Structure */

.fullWrap{
	overflow: hidden;
	width: 800px;
	margin: 32px auto 16px auto;
}

.logoTag {
	float: left;
}

.sideInfo {
	margin: 16px 8px;
	width: 96px;
	font-size: 12px;
}

.hours {
	color: silver;
	font-size: 12px;
}

#mapBox {

}

.shadesVideo{
	width: 640px;
	background: white;
	padding: 8px 0;
	margin: 16px 0;
	border-top: 1px solid silver;
	
}

.vimeoBanner{
	display: block;
	height: 128px;
	width: 624px;
	margin: 0 auto;
	cursor: pointer;
	background:white url(../images/processVideoBanner.jpg);
	position: relative;
}

.vimeoBanner:hover{
	background: url(../images/processVideoBanner_hover.jpg);
}

.sideInfo a{
	color: silver;
	text-decoration: none;
}

.sideInfo a:hover{
	color: red;	
}

.wrapper {
	width: 640px;
	margin: 0;
	box-shadow: #231f20 0px 2px 20px;
	float: right;
}

.headerPanel {
	display: none;
}

.header {
	width: 624px;
	height: 148px;
	padding: 8px;
	background-color: white;
	border-color: #E6E7E8;
	border-right-width: 0px;
	border-style: solid;
	border-left-width: 0px;
	border-bottom-width: 1px;
	border-top-width: 0px;
	overflow: hidden;
}

.header .logo {
	height: 148px;
	width: 112px;
	float: left;
	background: white;
}



.inputBlock {
	float: right;
	width: 494px;
	height: 88px;
	overflow: hidden;
	position: relative;
}

#topTweet{
	margin: 16px 0;
	padding: 8px;
	background: white;
	overflow: hidden;
}

.topTweet {
	float: left;
	padding:0 0 0 16px;
	overflow: hidden;
	position: relative;
	width: 472px;
	font-size: 14px;
	font-style: italic;
	color: #444;
	top: 2px;
	margin: 0 0 2px 0;
}

.tweetBlock {
	overflow: hidden;
	margin: 0 0px 0px 0px;
}

.tweetBlock .tweet {
	text-align: left;
	overflow: hidden;
	position: relative;
	top: 0;
	color: #D7D9D9;
	font-style: italic;
	font-size: 12px;
	height: 145px;
	
}

.tweet_list{
}

ul{
	margin: 0;
}

li{
	text-align: left;
	margin: 0;
}

.tweetBubble{
	float: left;
	width: 36px;
	height: 24px;
	position: relative;
	margin: auto 0;
}

.tweetBubble a{
	width: 36px;
	height: 24px;
	background: url(../images/tweet.gif) no-repeat;
	display: block;
}

.tweetBubble a:hover {
	background: url(../images/tweet_hover.gif) no-repeat;
}

.tweetBlock .icon a{
	width: 48px;
	height: 32px;
	opacity: 0;
}


/* ----------------------------------- Menu Panel */

.menuPanel{
	width: 624px;
	height: 112px;
	padding: 8px 8px;
	background-color: white;
	
	border-color: #E6E7E8;
	border-right-width: 0px;
	border-style: solid;
	border-left-width: 0px;
	border-bottom-width: 1px;
	border-top-width: 0px;
}

.menuPanel .menu{
	float: left;
	margin: 0px;
}




/* ----------------------------------- Content Panel */

.contentPanel {
	width: 624px;
	padding: 8px;	
	background-color: white;
}





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

.footerPanel {
	border-color: #E6E7E8;
	border-right-width: 0px;
	border-style: solid;
	border-left-width: 0px;
	border-bottom-width: 0px;
	border-top-width: 1px;
	width: 624px;
	padding: 8px;
	margin: 16px 0;
	background-color: white;
}

.footer {
	width: 624px;
	position: relative;
	overflow: hidden;
	color: #D7D9D9;
}

.footer25{
	width: 150px;
	min-height: 180px;
	background-color: #242021;
	position: relative;
	float: left;
}

.footer50 {
	width: 308px;
	min-height: 180px;
	background-color: #242021;
	position: relative;
	float: left;
}

.footerContent {
	padding: 8px;
	font-size: 10px;
}

.footerContentSection {
	margin: 0 0 16px 0;
	position: relative;
	overflow: hidden;
}

.footerContent a {
	color: #D7D9D9;
	text-decoration: none;
}

.footerContent a:hover {
	color: white;
	text-decoration: underline;
}


.contact {
	margin: 4px 0 0 0;

}

.contact a{
	color: #CCC;
}

.contactLeft{
	margin: 4px 0 0 0;
	color: #888;
}

.contactLeft a{
	color: #888;
}

.navigation {
}

#newsletterStatement{
	bottom: 0;
	height: 56px;
}

.newsletter {
}

.newsletter .footerContentSection{
	font-size: 12px;
}

.emailSignupBlock {
	width: 292px;
	height: 125px;
	max-height: 32px;
	background: url(http://www.shadesoptical.com/images/emailSignupBackground.gif) no-repeat;
	position: absolute;
	bottom: 16px;
	overflow: hidden;
	overflow: hidden;
}

.emailSignupBlock input[type="text"] {
	color: #4C4A4A;
	font-size: 14px;
	border: 0;
	height: 32px;
	margin: 0 0 0 8px;
	padding: 0;
	width: 196px;
	background: none;
	float: left;
}


.buttonSignUp {
	background: url(http://www.shadesoptical.com/images/buttonSignUp_up.png) no-repeat;
	float: right;
	position: relative;
	top: 4px;
	right: 4px;
	width: 64px;
	height: 24px;
}
.emailSignupBlock input[type="button"] {
	width: 64px;
	height: 24px;
	float: right;
	border: 0;
	cursor: pointer;
}

.buttonSignUp:hover {
	background: url(http://www.shadesoptical.com/images/buttonSignUp_hover.png) no-repeat;
}


#signupAlertSuccess {
	width: 30px;
	height: 92px;
	background: white;
}

#modals {
	display: none;
}

#signupAlertFail {
	width: 324px;
	height: 92px;
	background: white;
}

#yelp{
	position: relative;
	height: 90px;
}

.YelpText{
	float: left;
}

.YelpButton {
	display: block;
	float: left;
	width: 74px;
	height: 34px;
	margin: 32px 0 0 0;
	background-image: url(../images/buttonYelp_up.gif);
	position: absolute;
	bottom: 0;
	left: 0;
}

.YelpButton:hover{
	background-image: url(../images/buttonYelp_hover.gif);
}



/* ----------------------------------- Sub Panel */

.subPanel {
	width: 640px;
	margin: 0 auto 32px auto;
}

.copyright {
	margin: 16px 0 0 0;
	color: silver;
	font-size: 10px;
	text-align: center;
}

.subPanel a{
	color: #666;
	text-decoration: none;
}

.subPanel a:hover{
	color: #ED212B;
}









/* ----------------------------------- Common Elements */

a {
	color: #ED212B;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

a:visited{

}

a img {
	border: none;
	outline: none;
}

p {
	padding: 0 16px 0 0;
}

address {
	font-style: normal;
	width: 96px;
}


h2{
	color: #4C4A4A;
	font-size: 18px;
	font-weight: 300;
	margin: 8px 0;	
}

h3{
	color: #ED212B;
	font-size: 24px;
	font-weight: 300;
	margin: 0 0 16px 0;	
	line-height: 1.2em;
}

h4{
	color: #4C4A4A;
	font-size: 14px;
	
	padding: 0 8px 0 8px;
	margin: 0 0 0 0;
}

h5{
	margin: 0 0 2px 0;
	color: #ED212B;
	font-size: 9px;
	text-transform: uppercase;
	font-weight: normal;
}

ul{
	list-style-type: none;
	padding: 0;
}

li {
}

.preload {
	position: absolute;
	top: -1000px;	
}

.hrule150{
	border-color: #E6E7E8;
	border-right-width: 0px;
	border-style: solid;
	border-left-width: 0px;
	border-bottom-width: 1px;
	border-top-width: 0px;
	width: 134px;
	margin: 8px 8px;
}








/* ----------------------------------- Page Block Structure */

.content {
	position: relative;
	overflow: hidden;
	color: #4C4A4A;
}

.page {
	position: relative;
	overflow: hidden;
	margin: 0 0 0 0;
}

.menu25{
	width: 150px;
	height: 32px;
	float: left;
	margin: 0px;
	background-color: #ED212B;
}

.menu25:hover{
	background-color: #242021;
}

.activePage {
	background-color: #242021;
}

.menu50{
	width: 464px;
	height: 110px;
	overflow: hidden;
	float: right;
	
	border-color: #E6E7E8;
	border-style: solid;
	border-width: 1px
}


.content25{
	width: 150px;
	position: relative;
	float: left;
	height: 206px;
}

.content50 {
	width: 308px;
	position: relative;
	float: left;
	

}

.content75 {
	text-align: justify;
	width: 434px;
	position: relative;
	padding: 0 32px 0 0;
	float: left;
	line-height: 18px;
	font-size: 12px;
	line-height: 1.6em;
	
}

.content100 {
	width: 624px;
	margin: 0 0 0 0;
	position: relative;
	float: left;
	height: 206px;
}

.header25 {
	width: 150px;
	height:32px;
	background-color: #ED212B;
}

.header50 {
	width: 308px;
	height:32px;
	background-color: #242021;
}

.body50{
	padding: 8px;
	font-size: 11px;
	line-height: 1.4em;
}

.body50 h4{
	margin: 8px 0 8px 0;
	font-size: 12px;
	font-weight: normal;
	color: #ED212B;
}

.sitTop {
	margin: 0 0 8px 0;
}

.sitBottom {
	margin: 8px 0 0 0;
}

.sitLeft {
	margin: 0 8px 0 0;
}

.sitRight {
	margin: 0 0 0 0;
}


.landingShortDetail{
	height:88px;
	padding: 0 0px 0 0px;
}





/* ----------------------------------- Sub-Menu Structure */


.SubMenuItem {
	word-spacing: -1px;
	font-size: 9px;
	font-weight: bold;

	position: relative;
	bottom: 0;
	text-transform: uppercase;
	height: 8px;
	
	cursor: pointer;
	color: #666666;	
}

.SubMenuItem a{
	text-decoration: none;
	color: #666666;	
}

.SubMenuItem:hover {
	color: #231f20;
	
}

.SubMenuItem:hover a{
	color: #231f20;
	
}

/*
.SubMenuItem .linkBox {
	width: 8px;
	height: 8px;
	background-color: #ED212B;
	float: left;
	margin: 0 4px 0 0 ;
	position: relative;
	bottom: 0;
}
*/

.linkBox {
	width: 8px;
	height: 8px;
	float: left;
	margin: 0 4px 0 0 ;
	position: relative;
	bottom: 0;
}

.red {
	background-color: #ED212B;
}

.black {
	background-color: #231f20;
}

.downloadMenu {
	width: 136px;
	margin: 0 0 0 8px;
	padding: 0; 
}

.expertiseMenu{
	margin: 0 0 8px 8px;
}

.addToCalendar{
	width: 150px;
	padding: 8px 0 0 8px;
	float: left;
}

.viewEvent{
	width: 142px;
	padding: 8px 0 0 8px;
	float: left;
}






/* ----------------------------------- Pages */


/* Event */

.event {
	background: white;
	padding: 8px;
	margin: 16px 0;
	overflow: hidden;
}

.eventDetails {
	overflow: hidden;
}

.eventPostcard{
	margin: 0 0 16px 0;
}

.eventDetails .calendarView {
	width: 150px;
	height: 157px;
	float: left;
	color: #231f20;
}

.eventDetails .calendarView .top{
	padding: 8px;
	
	border-color: #E6E7E8;
	border-right-width: 0px;
	border-style: solid;
	border-left-width: 0px;
	border-bottom-width: 1px;
	border-top-width: 0px;
	
	overflow: hidden;
}

.eventDetails .calendarView .bottom {
	padding: 0 8px 0 0;
}

.eventDetails .calendarView .day {
	text-transform: uppercase;
	font-size: 9px;
}

.eventDetails .calendarView .month {
	text-transform: uppercase;
	font-size: 12px;
	font-weight: bold;
	float: left;
}

.eventDetails .calendarView .time {
	font-size: 10px;
	font-weight: bold;
	float: right;
	position: relative;
	top: 0px;
}

.eventDetails .calendarView .date {
	letter-spacing: -10px;
	text-transform: uppercase;
	font-size: 96px;
	font-weight: bold;
	text-align: center;
}

.eventDetails .eventDescription {
	width: 150px;
	height: 157px;
	float: right;
}


.eventDetails .eventDescription .name {
	color: #ED212B;
	padding: 18px 0 0 8px;
	font-weight: bold;
}

.eventDetails .eventDescription .copy {
	padding: 8px;
	font-size: 11px;
}

.eventDetails .eventDescription .copy p{
	margin: 4px 0 0 0;
}

.eventDetails .calendarSubMenu {
	float: left;
	width: 308px;
	height: 16px;
	border-color: #E6E7E8;
	border-style: solid;
	border-width: 1px 0 0 0;
	position: relative;

}

.eventDetails .calendarSubMenu .calendarSubMenuItem {
	word-spacing: -1px;
	float: left;
	font-size: 9px;
	font-weight: bold;
	padding: 8px 0 0 8px;
	position: relative;
	bottom: 0;
	text-transform: uppercase;
	height: 8px;
}

.eventDetails .calendarSubMenu .calendarSubMenuItem a{
	color: #231f20;
}

.eventDetails .calendarSubMenu .calendarSubMenuItem a:hover{
	color: #666666;
}

.addToCalendar{
	width: 150px;
}

.viewEvent{
	width: 142px;
}

.eventDetails .calendarSubMenu .calendarSubMenuItem .linkBox {
	width: 8px;
	height: 8px;
	background-color: #ED212B;
	float: left;
	margin: 0 4px 0 0 ;
	position: relative;
	bottom: 0;
	
}

.eventPostcard {
}


/* Blog */

.blogShort{
	width: 624px;
	background: white;
	padding: 8px;
	margin: 16px 0;
}

.blogShortDetails {
}

a.moreButton {
	width: 32px;
	background: red;
	float: right;
	color: white;
	text-align: center;
	text-transform: uppercase;
	font-size: 10px;
	padding:  0 8px;
	margin: 8px 0 0 0;
	letter-spacing: 1px;
	
}

a.moreButton:hover {
	background: #444;
	text-decoration: none;	
}

.blog{
	background: white;
	padding: 8px;
	margin: 16px 0;
}

.blogMainImage{}

.blogEntry{
	margin: 16px 16px;
}

.blogEntry p {
	font-size: 11px !important;
	line-height: 1.6em;
}

.blogEntry h2{
	margin: 24px 0 16px 0;
	font-size: 24px;
}

.blogArchives{
	margin: 32px 16px;	
}

.blogArchives h2{
	padding: 0 0 4px 0;
	border-bottom: 1px solid silver;
	margin: 0 0 4px 0;
}

.blogArchives h5{
	font-size: 14px;
	margin: 8px 0;
	font-weight: normal;
	text-transform: none;
}

.blogArchives h5 a{
	text-decoration: none;
	color: #444;
}

.blogArchives h5 a:hover{
	text-decoration: underline;
	color: #ED212B;
}

.box {
	width: 4px;
	height: 4px;
	background: red;
	float: left;
	position: relative;
	top: 6px;
	margin: 0 8px 0 0;
	display: block;
}

#nav {
	overflow: hidden;
	margin: 8px 0 0 0;
	float: right;
}

#nav a{
	width: 12px;
	height: 12px;
	background-color: #ED212B;
	overflow: hidden;
	font-size: 0;
	line-height: 0;
	color: #ED212B;
	display: block;
	margin: 0 0 0 8px;
	float:left;
}

#nav a:hover {
	background-color: #444;
	color: #444;
}

#nav a.activeSlide{
	background-color: silver;
	color: silver;
}

/* Exams */

.exams {
	background: white;
	padding: 32px 8px;
	margin: 16px 0;
}

.examsSidebar {
}

.examsContent {
}






/* Eyewear */

.eyewear{
	background: white;
	padding: 32px 8px;
	margin: 16px 0;
}

.eyewearSidebar {
}

.eyewearBrands{
	padding: 0 8px;
}

.brand a{
	
	text-transform: uppercase;
	font-weight: bold;
	background-repeat: no-repeat;
	background-image: url(http://www.shadesoptical.com/images/externalLink.gif);
	text-decoration: none;
	color: #231f20;
	font-size: 9px;
	padding: 0 0 0 12px;
}

.brand a:hover{
	color: #666666;
}

.eywearGallery{
}

#gridGallery{
	width: 450px;

}

#gridGallery ul {
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}

#gridGallery ul li {
	float: left;
	width: 66px;
	height: 66px;
	overflow: hidden;
	margin: 0 8px 8px 0;
	background-color: #ED212B;
}

#gridGallery ul img{
	width: 66px;
	height: 66px;
}

#gridGallery ul img:hover {
	opacity: .25;
}


/* Campaign */

.videoBlock {
	width: 624px;
	height: 400px;
	
}

.campaign {

}

.campaignDetails {
}

#postcards{
	width: 306px;
	height: 204px;
	border-color: #E6E7E8;
	border-width: 1px;
	border-style: solid;
}

#postcards img{
	width: 306px;
	height: 204px;
}

.campaignPostcard {
	
}

.campaignPostcard img{
	width: 306px;
	height: 204px;
}




/* Expertise */

.expertise {
	background: white;
	padding: 32px 8px;
	margin: 16px 0;
}

.expertiseSidebar {
}

.expertiseContent {
}


#overview {
	display: block;
}

#progressives {
	display: none;
}

#computereyes {
	display: none;
}

#iterminal {
	display: none;
}

#updateBrowser{
	display: none;
}


/* Admin Page */




/* Newsletter Subscribe */

#mc-embedded-subscribe {
	width: 64px; 
	height: 24px; 
	clear: both; 
	display: block; 
	border:none; 
	margin: 4px 0 0 0; 
	background: url(http://www.shadesoptical.com/images/buttonSignUp_up.png) no-repeat; 
	color: white;
	cursor: pointer;
}

#mc-embedded-subscribe:hover {
	background: url(http://www.shadesoptical.com/images/buttonSignUp_hover.png) no-repeat; 

}

/* No ie6 */

.updatePanel{
	width: 624px;
	height: 152px;
	padding: 8px 8px;
	background-color: white;
	font-size: 18px;
}

.browserIE6 #mainWebsite{
	display: none;
}

.browserIE6 #updateBrowser{
	display: block;
}




/* Browser Adjustments */

.browserIE7 #mainWebsite{
	position: relative;
	top: 32px;
}

.browserIE7 .buttonSignUp{
}

.browserIE7 #emailInput{
	padding: 8px 0 0 0;
}

.browserIE8 #emailInput{
	margin: 8px 0 0 0;
	padding:  0 0 0 8px;
}

.browserIE8 .footer25, .ie8 .footer50 {
	height: 196px;
}


.mac.ff3  #emailInput{
	margin: 8px 0 0 0;
	padding:  0 0 0 8px;
}

.win.ff3 .footer25, .win.opera10 .footer50  {
	height: 196px;
}

.win.opera10 .footer25, .win.ff3 .footer50  {
	height: 196px;
}

.opera10 .newsletter .footerContentSection {
	font-size: 10px;
}

.opera10 address{
	font-size: 10px;
}

.chrome .tweetBlock .tweet {
	font-family: "Helvetica";
}

.win.chrome .footer25, .win.chrome .footer50  {
	height: 196px;
}