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,  tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}
body {
	line-height: 1;
}
h1, h2, h3, h4, h5, h6 {
	clear: both;
	font-weight: normal;
}
ol, ul {
}
blockquote {
	quotes: none;
}
blockquote:before, blockquote:after {
	content: '';
	content: none;
}
del {
	text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a img {
	border: none;
}

hr {
	position: absolute;
	top: -9000px;
}

html {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	font-family: Helvetica, Arial, sans-serif;
	min-height: 100%;
	height: 100%;
}

body {
	margin: 0;
	padding: 0;
	height: 100%;
	min-height: 100%;
	font-size: 62.5%;
	background: #f9f5f1;
}

@font-face {
	font-family: 'OSPDIN';
	src: url('OSP-DIN-webfont.eot');
	src: url('OSP-DIN-webfont.eot?#iefix') format('embedded-opentype'),
		 url('OSP-DIN-webfont.woff') format('woff'),
		 url('OSP-DIN-webfont.ttf') format('truetype'),
		 url('OSP-DIN-webfont.svg#OSPDIN') format('svg');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'EnriquetaBold';
	src: url('enriqueta/enriqueta-bold-webfont.eot');
	src: url('enriqueta/enriqueta-bold-webfont.eot?#iefix') format('embedded-opentype'),
		 url('enriqueta/enriqueta-bold-webfont.woff') format('woff'),
		 url('enriqueta/enriqueta-bold-webfont.ttf') format('truetype'),
		 url('enriqueta/enriqueta-bold-webfont.svg#EnriquetaBold') format('svg');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'NovecentowideLightRegular';
	src: url('novecento/Novecentowide-Light-webfont.eot');
	src: url('novecento/Novecentowide-Light-webfont.eot?#iefix') format('embedded-opentype'),
		 url('novecento/Novecentowide-Light-webfont.woff') format('woff'),
		 url('novecento/Novecentowide-Light-webfont.ttf') format('truetype'),
		 url('novecento/Novecentowide-Light-webfont.svg#NovecentowideLightRegular') format('svg');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'NovecentowideBookBold';
	src: url('novecento/Novecentowide-Bold-webfont.eot');
	src: url('novecento/Novecentowide-Bold-webfont.eot?#iefix') format('embedded-opentype'),
		 url('novecento/Novecentowide-Bold-webfont.woff') format('woff'),
		 url('novecento/Novecentowide-Bold-webfont.ttf') format('truetype'),
		 url('novecento/Novecentowide-Bold-webfont.svg#NovecentowideBookBold') format('svg');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'AdobeGaramondProItalic';
	src: url('agaramondpro-italic-webfont.eot');
	src: url('agaramondpro-italic-webfont.eot?#iefix') format('embedded-opentype'),
		 url('agaramondpro-italic-webfont.woff') format('woff'),
		 url('agaramondpro-italic-webfont.ttf') format('truetype'),
		 url('agaramondpro-italic-webfont.svg#AdobeGaramondProItalic') format('svg');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'adobe_garamond_proregular';
	src: url('agaramondpro-regular-webfont.eot');
	src: url('agaramondpro-regular-webfont.eot?#iefix') format('embedded-opentype'),
		 url('agaramondpro-regular-webfont.woff') format('woff'),
		 url('agaramondpro-regular-webfont.ttf') format('truetype'),
		 url('agaramondpro-regular-webfont.svg#adobe_garamond_proregular') format('svg');
	font-weight: normal;
	font-style: normal;

}

#too-small-screen-message {
	display: none;
}

#container {
	margin: 0 auto;
	padding: 0px 73px 0 0;
	position: relative;
	overflow-x: hidden;
	display: none;
}

.content {
	margin: 0 auto;
	padding: 0px 0 0 0;
	width: 960px;
	position: relative;
}

#container #logo {
	margin: 0px 0 0 0;
	padding: 0;
	width: 200px;
}

#intro {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 600px;
	position: relative;
	z-index: 2;
	color: #787774;
	font: 1.6em/1.2em 'EnriquetaRegular', sans-serif;
	text-align: center;
	background: #99c551 url(../img/triangleintro.gif) repeat-x bottom;
	/*background: -webkit-radial-gradient(center, ellipse cover, #b4d578 0%,#99c551 100%);
	background: -moz-radial-gradient(center, ellipse cover, #b4d578 0%, #99c551 100%);*/
}

#intro-video {
	margin: -305px 0 0 -364px;
	padding: 0;
	width: 728px;
	height: 391px;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	color: #787774;
	font: 1.6em/1.2em 'EnriquetaRegular', sans-serif;
	text-align: center;
	/*background: #99c551 url(../img/videointro.png) no-repeat;*/
}

#video-embed-wrap {
	margin: -370px 0 0 -480px;
	padding: 0;
	width: 960px;
	max-width: 100%;
	height: 540px;
	position: absolute;
	top: 50%;
	left: 50%;	
}

#video-embed {
	position: relative;
	padding-bottom: 53.25%;
	padding-top: 25px;
	height: 0;
	overflow: hidden;
}

#video-embed iframe,  
#video-embed object,  
#video-embed embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



#intro-skip {
	margin: 0 0 0 -44px;
	padding: 0;
	width: 91px;
	height: 84px;
	position: absolute;
	left: 50%;
	bottom: 200px;
	z-index: 2;
	color: #787774;
	font: 1.6em/1.3em 'EnriquetaRegular', sans-serif;
	text-align: center;
	z-index: 100;
	cursor: pointer;
}

#intro .content {
	margin: 0;
	padding: 40px 30px 30px 30px;
	width: 100%;
	height: 74px;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 2;
	color: #787774;
	text-align: center;
	background: #f1ece6 url(../img/contentback.gif) repeat-x top;
}

#intro p {
	margin: 0 auto 10px auto;
	padding: 0px 0 0 0;
	width: 960px;
	position: relative;
	clear: both;
	z-index: 2;
	color: #787774;
}

#scroll-icon {
	margin: 0 auto;
	width: 9px;
	height: 30px;
	position: fixed;
	top: 20px;
	right: 73px;
	z-index: 100;
	background:  url(../img/scroller.png) no-repeat;
	display: none;
}

#intro-fb {
	margin: 10px auto 0 auto;
}

/*#intro-fb .fb_edge_widget_with_comment iframe {
    width: 49px !important;
}

 #intro-fb span.fb_edge_comment_widget.fb_iframe_widget iframe {
    width: 401px !important;
}
*/

#menu-wrap {
	margin: 0 auto;
	width: 74px;
	height: 100%;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 100;
	background: #fff;
	-moz-box-shadow: 0px 1px 5px #888;
	-webkit-box-shadow: 0px 1px 5px #888;
	box-shadow: 0px 1px 5px #888;
}

#menu-wrap h1 {
	margin: 0px 0 0 0;
	padding: 15px 0 17px 10px;
	border-bottom: 1px solid #e5e5e5;
	font: 1.7em/1em 'NovecentowideLightBold', sans-serif;
	letter-spacing: 0px;
	color: #bfbfbf;
}

#menu-wrap h1 a {
	text-decoration: none;
	color: #bfbfbf;
}

#menu-wrap h1 span {
	margin: 0px 0 0 0;
	padding: 0;	
	font: 0.8em/1em 'AdobeGaramondProBold', sans-serif;
	letter-spacing: 0px;
	color: #484848;
	text-transform: uppercase;
}

nav#menu {
	margin: 0px auto 0 auto;
	width: 100px;
}

nav#menu.fixed {
	margin:  0 0 0 0px;
	position: fixed;
	width: 100%;
	top: 0;
	z-index: 100;
}

nav#menu ul {
	margin: 0px auto;
	padding: 25px 0 0 0;
	width: 80px;
	position: relative;
	list-style: none;
}

nav#menu ul li {
	margin: 0;
	padding: 0 0 0 0px;
	float: left;
	clear: both;
	height: 25%;
}

nav#menu ul li a {
	margin: -5px 0 0 0;
	padding: 0 0 0 0px;
	float: left;
	position: absolute;
	left: 100px;
	display: inline;
	width: 90px;
	color: #575757;
	text-decoration: none;
	text-transform: uppercase;
	font: 1.3em/3.9em 'NovecentowideUltraLightBold', sans-serif;
	text-align: center;
	background: #fff;
	box-shadow: -4px 0px 2px #ddd;
	z-index: 2;
 }

nav#menu ul li span {
	float: left;
	display: block;
	width: 74px;
	height: 50px;
	position: relative;
	background: #fff;
	z-index: 3;
}

#container nav#menu ul li#sharesite div {
	margin: -10px 0 0 0px;
	padding: 15px 0 0 20px;
	width: 300px;
	height: 45px;
	text-align: left;
	font: 1.3em/1.2em 'NovecentowideUltraLightBold', sans-serif;
	background: #fff  url(../img/sharenav.png) no-repeat 90px 10px;
	z-index: 1;
}

#container nav#menu ul li#sharesite #sharesite-s  {
	 background: transparent;
	 z-index: 4;
 }

.content h2 {
	margin: 0px;
	padding: 0px 0 0 0;
	display: block;
	position: relative;
	color: #e5575a;
	font: 1.9em/1em 'NovecentowideLightBold', sans-serif;
	text-align: center;
	text-transform: uppercase;
	z-index: 1;
}

.content h2:before {
	border-top: 2px solid #f6c1c0;
	content:"";
	margin: 0 auto; 
	position: absolute; 
	top: 50%;
	left: 0;
	width: 100%;
	z-index: -1;
}

.content h2 span {
	margin: 0 auto;
	background: #f0efe9; 
	padding: 0 15px;
	display: block;
	width: 113px;
	height: 80px;
}


#loader {
	margin: -111px 0 0 -67px;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 135px;
	height: 222px;
}

#loader .content {
	margin: 0px auto;
}

#loader img {
	margin: 0px 0 0 0px;
	position: relative;
	float: left;
	clear: both;
	width: 135px;
	height: 222px;
}

#people {
	margin: 30px 0 0 0;
	padding: 20px 0 0 0;
	width: 100%;
}

#people h2 {
	margin: 0 0 0px 0;
	color: #8bb450;
	height: 140px;
	line-height: 1em;
}

#people h2  span {
	margin: 0px auto;
	padding: 0 15px;
	display: block;
	width: 90px;
	height: 100px;
	background: #f9f5f1;
}

#people  h2:before {
	border-top: 2px solid #d6e1c1;
}


#people-one {
	margin: 0;
	padding: 0;
	float: left;
	clear: both;
	width: 310px;
  }

.people-icontitle-wrap {
	margin: 0;
	padding: 0px 0 0 0;
	float: left;
	clear: both;
	width: 310px;
	height: 372px;
 }

.people-icontitle {
	margin: 0;
	padding: 0px 0 0 0;
	float: left;
	clear: both;
	width: 310px;
	height: 343px;
	background: #f9f5f1;

}

.people-icontitle.fixed {
	margin: 0;
	padding: 30px 0 0 0;
	position: fixed;
	top: 0px;
	z-index: 12220;
	background: #f9f5f1;
}

.people-icontitle.abs {
	position: absolute;
	top: 648px;
	z-index: 10;
	background: #f9f5f1;
}

#people-controls-wrap {
	margin: 100px 0 0 0;
	padding: 0;
	float: left;
	width: 330px;
	height: 700px;	
}

#people-controls {
	margin: 0;
	padding: 0;
	float: left;
	width: 330px;
	height: 550px;
	position: relative;	
	z-index: 4000;
}

#people-controls #people-social {
	position: absolute;
	top: 378px;
	left: 52px;
	z-index: 10;
 	width: 240px;
	height: 50px;
	z-index: 11400;
}

#people-controls #people-social h3 {
	margin: 0 0 5px 0;
	padding: 0;
	color: #787774;
	font: 1.2em/1.5em "NovecentowideLightBold", sans-serif;
	text-transform: uppercase;
	text-align: center;
}

#people-controls #people-like {
	margin: 0 0px 0 50px;
	float: left;
	width: 70px;
}

#people-controls #people-tweet {
	margin: 10px 0 0 90px;
	position: relative;
	float: left;
	clear: both;
	width: 70px;
}

#people-controls.fixed {
	position: fixed;
	width: 330px;
	top: 130px;
	z-index: 4000;
}

#people-controls.abs {
	position: absolute;
	top: 783px;
	z-index: 4000;
}

#people-controls-s {
	margin: 0px 0 0 75px;
	padding: 0;
	float: left;
	list-style: none;
	width: 190px;
	/*height: 550px; */
	height: 350px; 

}

#people #viewsource {
	margin: 0 0 0 -172px;
	padding: 0;
	position: absolute;
	top: 790px;
	left: 50%;
	z-index: 400;
	text-indent: -9000px;
}

#people #viewsource a {
	display: block; 
	width: 345px;
	height: 74px;
	background: transparent url(../img/placeholder/viewsource.png) no-repeat 0px 0px;
	z-index: 400;
	text-indent: -9000px;
}

#people-two {
	margin: 0;
	padding: 0;
	float: left;
	width: 310px;
}

.people-data-wrap {
	width: 310px;	
	position: relative;
	float: left;
	clear: both;
}

#people .people-data-wrap.fixed {
	position: fixed;
	top: 400px;
	z-index: 99;
}

#people .people-data-wrap.abs {
	position: absolute;
	top: 1050px;
	z-index: 99;
}

.people-data {
	width: 310px;	
	position: relative;
	float: left;
 }

#people .people-data.abs {
	position: absolute;
	top: 1253px;
	z-index: 99;
}

#people .archetype-names {
	margin: 20px 0 0 0;
	padding: 25px 0 20px 0;
	float: left;
	width: 310px;
	height: auto;
	min-height: 65px;
	border: 2px solid #c0bfba;
	border-width: 2px 0;
	color: #30302f;
	text-align: left;
	background: #f9f5f1;
}

#people #people-one h3, #people  #people-two h3 {
	margin:  10px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 310px;
	height: auto;
	color: #30302f;
	text-align: left;
	font: 4.2em/1em 'NovecentowideLightBold', sans-serif;
	background: #f9f5f1;
}

#people .archetype-names h4, #people .archetype-names h4 {
	margin:  0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 310px;
	height: auto;
	color: #666;
	text-align: left;
	font: 1.8em/0.5em 'EnriquetaRegular', sans-serif;
	text-transform: uppercase;
	background: #f9f5f1;
}

#people .customize-list {
	margin: -30px 0 0 -3000px;
	width: 310px;
	height: 400px;
	position: absolute;
	top: 560px;
	z-index: 400;
}

#people .customize-list.fixed {
	position: fixed;
	top: 450px;
	z-index: 99;
}

#people .customize-list.abs {
	position: absolute;
	top: 1100px;
	z-index: 99;
}

#people-two .customize-list {
	margin: -30px 0 0 3000px;
}

#people .customize-list ol {
	margin: 0 0px 0 0;
	padding: 0;
	float: left;
	clear: none;
	list-style: none;
	display: none;
}

#people .customize-list ol li {
	margin: 0 0 20px 0;
	padding: 5px 2px 4px 2px;
	float: left;
	clear: both;
	position: relative;
	width: 140px;
	list-style: none;
	color: #111;
	font: 1.2em/1.4em 'NovecentowideUltraLightBold', sans-serif;
	-webkit-tap-highlight-color: #f9f5f1;
}

#people .customize-list ol li:hover {
	background: #ccc;
	border-radius: 30px;
	color: #111;
}

#people .customize-list ol li:hover a {
	color: #111;
}

#people .customize-list ol li.selected {
	background: #67902b;
	color: #fff;
	border-radius: 30px;
 }

#people .customize-list ol li.selected a {
	color: #fff;
}

#people .customize-list ol li:hover span {
	color: #fff;
}

#people .customize-list ol li a {
	color: #111;
	text-decoration: none;
}

#people .customize-list ol li a:hover {
	background: #ccc; 
}

#people .customize-list ol li small {
	margin: -10px 10px 0 0;
	padding: 0;
	clear: both;
	float: left;
	position: absolute;
	top: 50%;
	left: 4px;
	width: 20px;
	height: 20px;
	list-style: none;
	color: #fff;
	background: #c0bfba;
	font: 0.8em/2.1em 'NovecentowideLightBold', sans-serif;
	border-radius: 30em;
	text-align: center;
}

#people .customize-list ol li span {
	margin: 0 10px 0 30px;
	padding: 0;
	display: block;
	float: left;
	width: 98px;
	border-bottom: 1px solid #d3d2cd; 
}

#people .customize-list ol li:hover span, #people .customize-list ol li.selected span {
	border-bottom: 1px solid transparent; 
}

#people .tabs ul {
	margin: 0 0px 0 0;
	padding: 0;
	float: left;
	clear: none;
	list-style: none;
}

#people .tabs ul li {
	margin: 0 17px 0 0;
	padding: 0;
	float: left;
	clear: none;
	width: 60px;
	height: 81px;
	list-style: none;
	position: relative;
}

#people .tabs ul li a {
	margin: 0 0px 0px 0;
	padding: 0px;
	float: left;
	width: 63px;
	height: 81px;
	list-style: none;
	color: #111;
	font: 1.2em/1.7em 'NovecentowideUltraLightBold', sans-serif;
	cursor: pointer;
	background: transparent url(../img/placeholder/tabs.png) no-repeat 0px 0px;
	text-indent: 110%;
	white-space: nowrap;
	overflow: hidden;
}

#people .tabs ul li span {
	margin: 0 0px 0px 0;
	padding: 0px;
 	width: 70px;
	height: 15px;
	list-style: none;
	color: #787774;
	font: 1.1em/1em 'EnriquetaRegular', sans-serif;
	cursor: pointer;
 	position: absolute; 
 	top: -10px;
 	left: 0;
 	text-transform: uppercase;
  	overflow: hidden;
 	text-align: center;
 	text-indent: 80px;
}

#people .tabs ul li.appeartab span {
	font: 1.1em/1em 'EnriquetaRegular', sans-serif;
}

#people .tabs ul li a:hover {
	margin: 0 10px 20px 0;
	padding: 0px;
	float: left;
	width: 63px;
	height: 81px;
	list-style: none;
	color: #111;
	font: 1.2em/1.7em 'NovecentowideUltraLightBold', sans-serif;
	cursor: pointer;
	text-indent: -9000px;
}


#people .tabs ul li a.selected {
	background: #67902b;
	color: #fff;
	border-radius: 30px;
}


#container #people .tabs ul li a:hover {
	border-radius: 0px;
}

#container #people .tabs ul li.lifetab a {
	border-radius: 0px;
	background-position: -70px 4px;
}

#container #people .tabs ul li.appeartab a {
	border-radius: 0px;
	background-position: -70px -240px;
}

#container #people .tabs ul li.locationtab a {
	border-radius: 0px;
	background-position: -70px -160px;
}

#container #people .tabs ul li.fanstab a {
	border-radius: 0px;
	background-position: -70px -80px;
}

#container #people .tabs ul li.lifetab a:hover,#container #people .tabs ul li.lifetab.selected a {
	border-radius: 0px;
	background-position: 0px 3px;
}

#container #people .tabs ul li.appeartab a:hover,#container #people .tabs ul li.appeartab.selected a {
	border-radius: 0px;
	background-position: 0px -240px;
}

#container #people .tabs ul li.locationtab a:hover,#container #people .tabs ul li.locationtab.selected a {
	border-radius: 0px;
	background-position: 0px -160px;
}

#container #people .tabs ul li.fanstab a:hover ,#container #people .tabs ul li.fanstab.selected a {
	border-radius: 0px;
	background-position: 0px -80px;
} 

#people .currtab {
	margin: 20px 0 20px 0;
	padding: 0 0 10px 0;
	float: left;
	width: 310px;
	border-bottom: 2px solid #c0bfba;
	text-align: center;
	text-transform: uppercase;
	color: #787774;
	font: 1.8em/0.5em 'EnriquetaRegular', sans-serif;
}

#people .customize-list-wrap {
	margin: 0;
	padding: 0;
	width: 310px;
	height: 270px;
	overflow: auto;
}

.icon-people-wrap {
	margin: 0;
	padding: 0;
	position: relative;
	width: 310px;
	height: 210px;
	overflow: hidden;
}

.icon-people {
	float: left;
	position: absolute;
	left: 0px;
	top: -1840px;
	width: 310px;
	height: 2127px;

}

#icon-people-one-s, #icon-people-two-s {
	top: 200px;
}

.bottles-people {
	margin: 25px 0 0 0px;
	padding: 0;
	float: left;
	clear: both;
	width: 310px;
	height: 66px;
}

.bottles-people-filled {
	position: absolute;
	top: 25px;
	left: 0;
	z-index: 3;
}

.perc-number {
	margin: 0 0 0 -6px;
	padding: 0;
	float: left;
	width: 150px;
	font: 15em/1em 'BebasRegular', sans-serif;
	letter-spacing: -3px;
	color: #30302f;
}

.perc-number span {
	margin: 0 0 0 -6px;
	padding: 0;
	float: left;
	width: 150px;
	font: 0.75em/1em 'BebasRegular', sans-serif;
	letter-spacing: -3px;
	color: #30302f;
}

.perc-char {
	margin: 12px 0 0 0;
	padding: 0;
	float: left;
	width: 40px;
	font: 3.5em/1em 'BebasRegular', sans-serif;
	letter-spacing: 1px;
	color: #111;
}

.people-honest-logo {
	margin: 0px 0 0 0;
	padding: 0;
	float: left;
	font: 4em/1em 'AdobeGaramondProBold', sans-serif;
	letter-spacing: 0px;
	color: #848382;
}

.addcont {
	margin: 50px 0 0 0;
	padding: 30px 0 20px 0;
	float: left;
	clear: both;
	border: 2px solid #c0bfba;
	border-width: 2px 0;
	font: 2.3em/1.2em 'NovecentowideLightBold', sans-serif;
	letter-spacing: 0px;
	color: #8bb450;
}

.addcont-icon {
	margin: 0px 10px 0 0;
	padding: 0;
	float: left;
	width: 76px;
	height: 90px;
	letter-spacing: 0px;
	color: #8bb450;
	background:  url(../img/placeholder/addcont-icon.png) no-repeat 0px 2px;
}

.addcont p {
	margin: 0px 0px 0 0;
	padding: 0;
	float: left;
	clear: none;
	width: 210px;
}

.sources {
	margin: 60px 0 0 0;
	padding: 0;
	width: 310px;
	height: 550px;
	float: left;
	position: relative;
	clear: both;
	color: #192a2e;
	font: 1.4em/1em 'NovecentowideLightBold', sans-serif;
	display: none;
}

#people-one .sources-switch, #people-one .sources-location,  #people-one .sources-addinfo,  #people-one .sources-video {
	left: 0px;
}

#people-two .sources-switch, #people-two .sources-location,  #people-two .sources-addinfo,  #people-two .sources-video {
	right: 0px;
}

.sources-switch {
	margin: 0px 0 0 0;
	padding: 0;
	position: relative;
	clear: both;
	height: 36px;
	text-align: center;
	position: relative;
	font: 1.4em/1.8em 'NovecentowideNormalRegular', sans-serif;
}


.sources-switch strong {
	margin: 140px 0 0 0;
	padding: 0;
	clear: both;
	font-weight: normal;
	font: 1em/1em 'NovecentowideLightBold', sans-serif;
}

.sources-switch .prev {
	position: absolute;
	top: 0;
	left: 0;
	width: 30px;
	height: 36px;
	background:  url(../img/prevnext-big.gif) no-repeat 0px 2px;
}

.sources-switch .next {
	position: absolute;
	top: 0;
	right: 0;
	width: 30px;
	height: 36px;
	background:  url(../img/prevnext-big.gif) no-repeat -29px 2px;
}


#people-sources-slide {
	overflow:hidden;
	/* fix ie overflow issue */
	position:relative;
	width: 310px;
	height: 500px;
}

#people-sources-slide ul {
	position:relative;
	left:0;
	top:0;
	list-style:none;
	margin:0;
	padding:0;	
	width: 1112880px;			
}

#people-sources-slide ul li {
	width: 310px;
	float:left;
	clear: none;
	height: 340px;
}
#people-sources-slide  ul li h4, .possc {
	position: absolute;
	top: -9000px;
}

.sources-location {
	margin: 20px 0 0 0;
	padding: 20px 0 0px 0;
	float: left;
	width: 310px;
	border-top: 2px solid #787774;
	clear: both;
	font-weight: normal;
	font: 1em/1em 'NovecentowideLightBold', sans-serif;
}

.sources-location-img {
	margin: 0px 15px 0 0;
	padding: 0;
	float: left;
	width: 24px;
	height: 94px;

}

#people .sources-location-place {
	margin: 0px 0 0px 0;
	padding: 0;
	float: left;
	clear: none;
	width: 165px;
	height: auto;
	font: 2.5em/0.9em 'NovecentowideLightBold', sans-serif;
	text-transform: uppercase;
	text-align: left;
}

#cities h3.sources-location-place {
	margin: 0px 0 0 0;
	padding: 0;
	width: 690px;
	height: auto;
	font: 3.5em/0.9em 'NovecentowideLightBold', sans-serif;
	text-transform: uppercase;
	text-align: left;
}

.sources-location-city {
	margin: 10px 0 0 0;
	padding: 0px 0 0px 0;
	font: 1.5em/0.9em 'EnriquetaRegular', sans-serif;
	color: #787774;
	float: left;
	text-transform: uppercase;
}

.sources-addinfo {
	margin: 20px 0 0 0;
	padding: 15px 0 0px 0;
	border-top: 2px solid #c0bfba;
	float: left;
	clear: both;
	width: 310px;
}

.addinfo-icon {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 94px;
	height: 90px;
}

.addinfo-date {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 94px;
	height: 170px;
	font: 1.7em/0.9em 'EnriquetaRegular', sans-serif;
	color: #a1a0a0;
	text-transform: uppercase;
}

.addinfo-date .addinfo-icon {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 94px;
	height: 90px;
	background:  url(../img/placeholder/icondate.png) no-repeat 0px 2px;
}


.addinfo-date span {
	margin: 0px 0 0 -3px;
	padding: 0px 0 0px 0;
	font: 2.2em/0.9em 'BebasRegular', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

.addinfo-date sup  {
	margin: -40px 0 0 42px;
	padding: 0px 0 0px 0;
	display: block;
	font: 0.8em/0.1em 'NovecentowideLightBold', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

.addinfo-temp {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 94px;
	height: 70px;
	font: 4.1em/1em 'BebasRegular', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

.addinfo-temp .addinfo-icon {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 94px;
	height: 90px;
	background:  url(../img/placeholder/icontemp.png) no-repeat 0px 0px;
}

.addinfo-temp span {
	margin: 20px 0 0 0;
	padding: 0px 0 0px 0;
	display: block;
	font: 0.3em/3.5em 'EnriquetaRegular', sans-serif;
	color: #a1a0a0;
	text-transform: uppercase;
}

.addinfo-temp sup {
	margin: -40px 0 0 62px;
	padding: 0px 0 0px 0;
	display: block;
	font: 0.4em/0.1em 'NovecentowideLightBold', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

.addinfo-time {
	margin: 5px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 80px;
	font: 2.5em/0.9em 'BebasRegular', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

.addinfo-time .datefromto {
	margin: 0px 0 10px 0;
	width: auto;
	font: 0.7em/0.9em 'BebasRegular', sans-serif;
}

.addinfo-time .datefromto span {
	margin: 15px 0 0 0;
	font-size: 0.7em;
	float: right;
}


.addinfo-time .addinfo-icon {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 94px;
	height: 90px;
	background:  url(../img/placeholder/icontime.png) no-repeat 0px 0px;
}

.addinfo-time span {
	margin: 20px 0 7px 0;
	padding: 0px 0 0px 0;
	display: block;
	font: 0.35em/0.2em 'EnriquetaRegular', sans-serif;
	color: #a1a0a0;
	text-transform: uppercase;
}

.sources-total {
	margin: 20px 0 0 0;
	padding: 20px 0 0px 0;
	clear: both;
	border-top: 2px solid #787774;
	display: block;
	font: 0.9em/0.2em 'EnriquetaRegular', sans-serif;
	color: #a1a0a0;
	text-transform: uppercase;

}

.sources-total h4 {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	clear: both;
	display: block;
	font: 1.9em/1em 'EnriquetaRegular', sans-serif;
	color: #c0bfba;
	text-transform: uppercase;
} 


.sources-video {
	margin: 20px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	color: #ff9561;
	text-transform: uppercase;
	right: 400px;
}

#cities {
	margin: 40px 0 0 0;
	padding: 20px 0 0 0;
	float: left;
	width: 100%;
	clear: both;
}

#cities.fixed {
	position: fixed;
	top: 450px;
	z-index: 99;
}

#cities.abs {
	position: absolute;
	top: 1100px;
	z-index: 99;
}

#cities #usamap {
	margin: 50px 0 0 0; 
	width: 642px;
	height: 420px;
}

#cities h2 {
	color: #f46576;
	height: 160px;
	line-height: 1em;
	z-index: 10;
}

#cities  h2:before {
	border-top: 2px solid #f3d3d3;
}

#cities h2  span {
	margin: 0 auto;
	padding: 0 15px;
	display: block;
	width: 90px;
	height: 100px;
	background: #f9f5f1;
}

#cities h3 {
	margin: 20px auto 0px auto;
	color: #787774;
	width: 667px;
	height: 80px;
	text-align: center;
	font: 1.8em/1.2em 'EnriquetaRegular', sans-serif;
}

#cities h4 {
	margin: 10px auto; 
	color: #3a3a3a;
	font: 2em/1.5em 'EnriquetaRegular', sans-serif;
	text-align: center;
}

#cities-data {
	margin: 70px 10px 0 0;
	float: left;
	clear: both;
	width: 270px;
 }

#cities-selected {
	margin: 0px 0px 0 0;
	padding: 15px 0 3px 0;
	border: 2px solid #787774;
	border-width: 2px 0;
	font: 2em/1em 'EnriquetaRegular', sans-serif;
	color: #a1a0a0;
	text-transform: uppercase;
}

#cities-selected h3 {
	margin: 0px 0px 0 0;
	padding: 0px 0 0 0;
	display: block;
	text-align: left;
	font: 1.5em/1.5em 'NovecentowideLightBold', sans-serif;
	color: #30302f;
	height: auto;
	text-transform: uppercase;
	display: none;
}

#cities-selected #selectacity {
	margin: 0px 0px 0 0;
	padding: 0px 0 0 0;
	display: block;
	text-align: left;
	font: 0.9em/2em 'NovecentowideUltraLightBold', sans-serif;
	text-transform: uppercase;
	color: #333;
}

#cities-selected #selectacity h4 {
	margin: 10px 0px 0 0;
	padding: 0px 0 0 0;
	display: block;
	text-align: left;
	font: 1.4em/0.8em 'NovecentowideLightBold', sans-serif;
	text-transform: uppercase;
	color: #f4646f;
}

#cities-selected span {
	margin: 0px 0px 0 0;
	padding: 0px 0 0 0;
	display: block;
	text-align: left;
	font: 1.5em/0.5em 'AdobeGaramondProBold', sans-serif;
	text-transform: uppercase;
	color: #333;
}

#cities .perc-number {
	margin: 0 0 0 -6px;
	padding: 0;
	float: left;
	width: 125px;
	font: 15em/1em 'BebasRegular', sans-serif;
	letter-spacing: -3px;
	color: #30302f;
}

#cities .perc-number span {
	margin: 0 0 0 -6px;
	padding: 0;
	float: left;
	width: 125px;
	font: 0.75em/1em 'BebasRegular', sans-serif;
	letter-spacing: -3px;
	color: #30302f;
}

#cities .perc-char {
	margin: 12px 0px 15px -40px;
	padding: 0;
	width: 90px;
	float: left;
	clear: none;
	font: 4.35em/1em 'BebasRegular', sans-serif;
	text-align: right;
	letter-spacing: 1px;
	color: #111;
}

#cities #cities-data-wrap {
	position: relative;
	display: block;
}

#cities .bottles-cities {
	margin: 15px 0 0 0px;
	padding: 0;
	float: left;
	clear: both;
	width: 250px;
	height: 66px;
}

#cities .bottles-cities-filled {
	position: absolute;
	top: 15px;
	height: 66px;
	left: 0;
	z-index: 3;
 }

#cities #share-infographics {
	position: absolute;
	top: 625px;
	right: 140px;
	width: 140px;
	height: 100px;
}

#cities #cities-social {
	position: absolute;
	top: 595px;
	right: 95px;
	width: 230px;
	height: 50px;
	z-index: 11400;
}

#cities #cities-social h3 {
	margin: 0 0 5px 0;
	padding: 0;
	width: auto;
	height: auto;
	color: #787774;
	font: 1.2em/1.5em "NovecentowideLightBold", sans-serif;
	text-transform: uppercase;
	text-align: center;
}

#cities #cities-like {
	margin: 0 10px 0 0;
	float: left;
	width: 140px;	
}


#cities .people-honest-logo {
	margin: 0;
	padding: 0;
	float: right;
	clear: none;
	font: 2.7em/0.5em 'AdobeGaramondProBold', sans-serif;
	text-align: right;
	color: #787774;
}


#cities .sources-location {
	margin: 20px 0 0 0;
	padding: 0px 0 20px 0;
	float: left;
	width: 960px;
	border: none;
	position: static;
	left: auto;
	top: auto;
	border-width: 2px 0;
	clear: both;
	font-weight: normal;
	font: 1em/1em 'NovecentowideLightBold', sans-serif;
 }

#cities .sources-location-img {
	margin: 0px 60px 0 0;
	padding: 0;
	float: left;
	position: static;
	left: auto;
	top: auto;
	width: 302px;
	height: 140px;
}

#cities .sources-location h4 {
	margin: 0;
	padding: 0;
	float: left;
	clear: both;
	width: 266px;
	border: none;
	position: static;
	font-weight: normal;
	color: #a1a0a0;
	font: 1.8em/1em 'EnriquetaRegular', sans-serif;
	text-align: left;
	text-transform: uppercase;
}

#cities .sources-location-placeswitch {
	margin: 5px 0 0 0;
	padding: 20px 0 20px 0;
	border: 2px solid #c0bfba;
	border-width: 2px 0;
	width: 960px;
	float: left;
	clear: none;
	color: #30302f;
	text-transform: uppercase;
}

#cities .sources-location-place {
	margin: 2px 0 0 0;
	padding: 0;
	width: 400px;
	float: left;
	clear: none;
	font: 3.7em/0.9em 'NovecentowideLightBold', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

#cities #cities-sources-custom {
	margin: -120px 0 0 0;
	padding: 0;
	overflow:hidden;
	float: left;
	clear: both;
	position:relative;
	width: 355px;
	height: 221px;
	color: #f56376;
	font: 1.7em/1.2em 'NovecentowideLightBold', sans-serif;
}


#cities .sources-custom-switch {
	top: 140px;
	position: absolute;
	float: left;
	width: 344px;
	position: relative;
	text-align: center;
	font: 1.7em/1em 'NovecentowideNormalRegular', sans-serif;
	color: #30302f;
	text-transform: uppercase;
	z-index: 400;
}

#cities-funfact-icon{
	position: absolute;
	left: 20px;
	top: 0;
}

#cities .sources-custom-switch .prev {
	position: absolute;
	top: 0;
	left: 0;
	width: 25px;
	height: 30px;
	background:  url(../img/prevnext-small2.gif) no-repeat 0px 2px;
}

#cities .sources-custom-switch  .next {
	position: absolute;
	top: 0;
	right: 0;
	width: 27px;
	height: 30px;
	background:  url(../img/prevnext-small2.gif) no-repeat -25px 2px;
}

#cities #cities-sources-custom-wrap {
	margin:  0px 0 0 40px;
	padding: 0;
	overflow:hidden;
	float: left;
	clear: both;
	position:relative;
	width: 270px;
	height: 221px;
}

#cities-sources-custom-wrap ul {
	position:relative;
	left:0;
	top: 104px;
	list-style:none;
	margin:0;
	padding:0;	
	width: 2880px;			
}

#cities-sources-custom-wrap ul li {
	padding: 30px 20px 0 0px;
	width: 270px;
	float:left;
	clear: none;
	height: 100px;
}

#cities-sources-custom-wrap  ul li h4, .possc {
	position: absolute;
	top: -9000px;
}


#cities .sources-location-switch {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: right;
	width: 262px;
	position: relative;
	text-align: center;
	font: 1.7em/1.8em 'NovecentowideNormalRegular', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

#cities-sources-slide {
	overflow:hidden;
	/* fix ie overflow issue */
	position:relative;
	width:960px;
	height: 200px;
}

#cities-sources-slide ul {
	position:relative;
	left:0;
	top:0;
	list-style:none;
	margin:0;
	padding:0;	
	width: 1112880px;			
}

#cities-sources-slide ul li {
	width: 960px;
	float:left;
	clear: none;
	height: 140px;
}
#cities-sources-slide  ul li h4, .possc {
	position: absolute;
	top: -9000px;
}

#cities  strong {
	margin: 140px 0 0 0;
	padding: 0;
	clear: both;
	font-weight: normal;
	font: 1em/1em 'NovecentowideLightBold', sans-serif;
}

#cities  .prev {
	position: absolute;
	top: 0;
	left: 0;
	width: 25px;
	height: 30px;
	background:  url(../img/prevnext-small2.gif) no-repeat 0px 2px;
}

#cities  .next {
	position: absolute;
	top: 0;
	right: 0;
	width: 27px;
	height: 30px;
	background:  url(../img/prevnext-small2.gif) no-repeat -25px 2px;
}




#cities .sources-addinfo {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	border: none;
	float: left;
	clear: none;
	position: static;
	left: auto;
	top: auto;
	width: 960px;
	background: none;
}

#cities .addinfo-wrap {
	margin: 0px 30px 0 0px;
	padding: 0px 0 0px 0;
	 display: block;
	 float: left;
}

#cities .addinfo-icon {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 77px;
	height: 80px;
	background:  url(../img/placeholder/iconcities.png) no-repeat 0px 0px;
}

#cities .addinfo-date {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 77px;
	height: 170px;
	font: 1.7em/0.9em 'EnriquetaRegular', sans-serif;
	color: #a1a0a0;
	text-transform: uppercase;
}

#cities .addinfo-date .addinfo-icon {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 77px;
	height: 80px;
	background-position: -10px 0px;
}

#cities .addinfo-date small {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	font: 1.3em/0.9em 'EnriquetaRegular', sans-serif;
	float: left;
	clear: both;
	text-transform: uppercase;
}

#cities .addinfo-date span {
	display: block;
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	font: 2.4em/0.9em 'BebasRegular', sans-serif;
	color: #30302f;
	clear: both;
	text-transform: uppercase;
}

#cities .addinfo-date sup  {
	margin: -27px 0 0 42px;
	padding: 0px 0 0px 0;
	display: block;
	font: 0.9em/0.1em 'NovecentowideLightBold', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

#cities .addinfo-temp {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 80px;
	font: 4.4em/0.7em 'BebasRegular', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

#cities .addinfo-temp .addinfo-icon {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 80px;
	height: 90px;
	background-position: -90px 0px;
}

#cities .addinfo-temp span {
	margin: 15px 0 0 0;
	padding: 0px 0 0px 0;
	display: block;
	font: 0.35em/4.1em 'EnriquetaRegular', sans-serif;
	color: #a1a0a0;
	text-transform: uppercase;
}

#cities .addinfo-temp sup {
	margin: -28px 0 0 52px;
	padding: 0px 0 0px 0;
	font: 0.4em/0.1em 'NovecentowideLightBold', sans-serif;
	color: #30302f;
	text-transform: uppercase;
} 

#cities .addinfo-time {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 94px;
	font: 1.3em/0.9em 'BebasRegular', sans-serif;
	color: #30302f;
	text-transform: uppercase;
}

#cities .addinfo-time .addinfo-icon {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	width: 94px;
	height: 90px;
	background-position: -170px 0px;
}

#cities .addinfo-time span {
	margin: 10px 0 5px 0;
	padding: 0px 0 0px 0;
	display: block;
	font: 0.9em/0.5em 'EnriquetaRegular', sans-serif;
	color: #a1a0a0;
	text-transform: uppercase;
}

#cities .addinfo-time .datefromto {
	margin: 0px 0 2px 0;
	width: 75px;
	font: 1.8em/0.9em 'BebasRegular', sans-serif;
}

#cities .addinfo-time .datefromto span {
	margin: 10px 0 0 0;
	font-size: 0.7em;
	float: right;
} 

#cities .sources-video {
	margin: 0px 0px 0 17px;
	padding: 0px 0 0px 0;
	width: 300px;
	color: #ff9561;
	text-transform: uppercase;
	position: static;
	left: auto;
	top: auto;
}

#cities  .sources-cities-description {
	margin: 0px 0 0 0;
	padding: 0px 0 0px 0;
	float: left;
	clear: none;
	width: 262px;
	height: 142px;
	font: 2.3em/1.2em 'NovecentowideLightBold', sans-serif;
	letter-spacing: 0px;
	color: #f46476;
	background:  url(../img/placeholder/placecity.png) no-repeat 0 0 ;
}

#cities #usamap {
	margin: 0px 0 0 0;
	float: left;
	width: 680px;
	height: 523px;
  }

/*hover states*/


#cities  .prev , #cities  .next, .sources-switch .prev , .sources-switch .next, #cities .sources-custom-switch .prev , #cities .sources-custom-switch .next , #rankings .prev  , #rankings .next
{
	opacity: 1;
		transition: all 0.5s;
	-moz-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-o-transition:all  0.5s;
}

#cities  .prev:hover , #cities  .next:hover, .sources-switch .prev:hover , .sources-switch .next:hover, #cities .sources-custom-switch .prev:hover , #cities .sources-custom-switch .next:hover ,#rankings .prev:hover  ,#rankings .next:hover 
{
	opacity: 0.5;
		transition: all 0.5s;
	-moz-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-o-transition:all  0.5s;
}

#rankings {
	margin: 120px 0 0 0;
	padding: 0px 0 0 0;
	float: left;
	width: 100%;
	clear: both;
	position: relative;
}

#rankings h2 {
	margin: 0 0 20px 0;
	color: #ffb06a;
	height: 100px;
	line-height: 1em;
	overflow: hidden;
}

#rankings  h2:before {
	border-top: 2px solid #fbdbbd;
}

#rankings h2  span {
	margin: 0 auto;
	padding: 0 15px;
	display: block;
	width: 110px;
	height: 140px;
	background: #f9f5f1;
}

#rankings #share-infographics-rankings {
	position: absolute;
	top: 380px;
	right: 0px;
	width: 140px;
	height: 145px;
	z-index: 4;
}

#rankings #rankings-social {
	position: absolute;
	top: 430px;
	right: 0px;
	width: 230px;
	height: 50px;
	z-index: 11400;
}

#rankings #rankings-social h3 {
	margin: 0 0 5px 0;
	padding: 0;
	width: auto;
	height: auto;
	color: #787774;
	font: 1.2em/1.5em "NovecentowideLightBold", sans-serif;
	text-transform: uppercase;
	text-align: center;
}

#rankings #rankings-like {
	margin: 0 10px 0 0;
	float: left;
	width: 140px;	
}


#rankings .rankings-switch {
	margin: 120px 0 0 0;
	width: 960px;
	position: relative;

}

#rankings .prev {
	position: absolute;
	top: 0;
	left: 0;
	width: 55px;
	height: 54px;
	background: url(../img/prevnext-huge.gif) no-repeat -5px -8px;
}

#rankings  .next {
	position: absolute;
	top: 0;
	right: 0;
	width: 55px;
	height: 55px;
	background: url(../img/prevnext-huge.gif) no-repeat -65px -8px;
}


#rankings #topfive {
	position: absolute;
	left: 100px;
	top: 120px;
	overflow:hidden;
	width: 750px;
	height: 300px;
}

#rankings #topfive ul {
	position:relative;
	left:0;
	top:0;
	list-style:none;
	margin:0;
	padding:0;	
	width: 2900px;			
}

#rankings #topfive ul li {
	width: 751px;
	height: 289px;
	float:left;
	clear: none;
} 


#rankings h3 {
	margin: 0 auto 40px auto;
	color: #787774;
	width: 667px;
	height: 80px;
	text-align: center;
	font: 1.8em/1.2em 'EnriquetaRegular', sans-serif;
}

#rankings #rankings-wrap {
	margin: 400px 0 0 0px;
	padding: 40px 0 0 120px;
	width: 860px;
	clear: both;	
	border-top: 1px solid #ccc;
}

#rankings #first-col {
	margin: 0;
	padding: 0;
	float: left;
	clear: both;
}

#rankings ol {
	margin: 0 10px 0 0;
	padding: 0;
	float: left;
	clear: none;
	list-style: none;
}

#rankings li {
	margin: 0 0 20px 0;
	padding: 0;
	float: left;
	clear: both;
	list-style: none;
	color: #111;
	font: 1.2em/1.7em 'NovecentowideUltraLightBold', sans-serif;
}

#rankings li small {
	margin: 0 10px 0 0;
	padding: 0;
	clear: both;
	float: left;
	width: 20px;
	height: 20px;
	list-style: none;
	color: #fff;
	background: #f6841f;
	font: 0.8em/2.1em 'NovecentowideLightBold', sans-serif;
	border-radius: 30em;
	text-align: center;
}

#rankings li b {
	margin: 0 10px 0 0;
	padding: 0;
	clear: both;
	float: left;
	list-style: none;
	color: #111;
	font: 1.8em/1em 'BebasRegular', sans-serif;
	border-radius: 30em;
	text-align: center;
}


#rankings li span {
	margin: 0 10px 0 0;
	padding: 0;
	display: block;
	float: left;
	width: 132px;
	border-bottom: 1px solid #d3d2cd; 
}

#rankings .match-vs {
	margin: 0px 0 0 0;
	padding: 0;
	float: left;
	width: 57px;
	font: 4.8em/2.4em 'EnriquetaRegular', sans-serif;
	text-align: center;
	color: #aaa;
}


#mosthonest  {
	margin: 0 0px 0 0;
	padding: 0;
	display: block;
	float: left;
	clear: both;
	width: 354px;
}

#mosthonest h3 {
	margin: 0 0px 0 0;
	padding: 13px 0 13px 0;
	border: 2px solid #787774;
	border-width: 2px 0;
	display: block;
	float: left;
	clear: both;
	width: 354px;
	color: #f6841f;
	text-align: left;
	font: 2.9em/1.7em 'NovecentowideLightBold', sans-serif;
}

#mosthonest #fivemost {
	margin: 0 0px 0 0;
	padding: 0px 0 0px 0;
	display: block;
	clear: both;
	color: #a1a0a0;
	text-transform: uppercase;
	font: 0.6em/0.2em 'EnriquetaRegular', sans-serif;
}

#mosthonest #inamerica {
	margin: 0 0px 0 0;
	padding: 0px 0 0px 0;
	display: block;
	clear: both;
	color: #a1a0a0;
	text-transform: uppercase;
	font: 0.6em/0.4em 'NovecentowideLightBold', sans-serif;
}


#rankings #mosthonest ol {
	margin: 20px 0 0 0;
	padding: 0;
	float: left;
	clear: both;
	list-style: none;
}

#rankings #mosthonest li {
	margin: 0 0 10px 0;
	padding: 0;
	float: left;
	clear: both;
	list-style: none;
	color: #111;
	font: 1.4em/1.3em 'NovecentowideUltraLightBold', sans-serif;
}

#rankings #mosthonest li small {
	margin: 0 10px 0 0;
	padding: 0;
	clear: both;
	float: left;
	width: 44px;
	height: 44px;
	list-style: none;
	color: #fff;
	background: #f6841f;
	font: 1.7em/1.8em 'BebasRegular', sans-serif;
	border-radius: 30em;
	text-align: center;
}

#rankings #mosthonest li span {
	margin: 10px 10px 0 0;
	padding: 0;
	display: block;
	float: left;
	width: 245px;
	border-bottom: 1px solid #d3d2cd; 
}

#rankings #mosthonest .perc-number {
	margin: 0 2px 0 0px;
	padding: 0;
	float: left;
	font: 2.3em/1em 'BebasRegular', sans-serif;
	letter-spacing: 0px;
	color: #30302f;
	float: left;
	width: auto;
	border: none; 
}

#rankings #mosthonest .perc-char {
	margin: 0px 0 0 0;
	padding: 0;
	float: left;
	font: 1em/1.6em 'BebasRegular', sans-serif;
	letter-spacing: 0px;
	color: #30302f;
	float: left;
	width: auto;
	border: none; 
}

#rankings li span {
	margin: 0 10px 0 0;
	padding: 0;
	display: block;
	float: left;
	width: 132px;
	border-bottom: 1px solid #d3d2cd; 
}


#rankings .rankings-match {
	margin: 0 10px 0 0;
	padding: 0 0 23px 0;
	display: block;
	float: left;
	width: 357px;
}

#rankings .player-one {
	margin: 0 0px 0 0;
	padding: 0 0 23px 0;
	display: block;
	float: left;
	width: 150px;
	border-bottom: 2px solid #787774;
}

#rankings .player-two {
	margin: 0 0px 0 0;
	padding: 0 0 23px 0;
	display: block;
	float: left;
	width: 150px;
	border-bottom: 2px solid #787774;
}

#rankings .player-icon {
	margin: 0 0px 10px 0;
	padding: 0 0 0px 0;
	display: block;
	float: left;
	width: 150px;
	height: 118px;
	border: 2px solid #787774;
	border-width: 2px 0;
	background: url(../img/placeholder/iconmatch.jpg) no-repeat 25px 15px;
}

#rankings .perc-number {
	margin: 0 0 0 0px;
	padding: 0;
	float: left;
	width: 56px;
	font: 5.7em/1em 'BebasRegular', sans-serif;
	letter-spacing: -1px;
	color: #30302f;
}

#rankings .perc-char {
	margin: 0px 0 0 0;
	padding: 0;
	float: left;
	width: 20px;
	font: 2em/1.6em 'BebasRegular', sans-serif;
	letter-spacing: -3px;
	color: #30302f;
}

#rankings .people-honest-logo {
	margin: 30px 0 0 0;
	padding: 0;	
	font: 1.7em/1.9em 'AdobeGaramondProBold', sans-serif;
	letter-spacing: 0px;
	color: #fcbb7f;
}

#bottles {
	margin: 120px 0 0 0;
	padding: 20px 0 0 0;
	float: left;
	width: 100%;
	clear: both;
}

#bottles h2 {
	color: #30302f;
	height: 150px;
	line-height: 1em;
}

#bottles  h2:before {
	border-top: 2px solid #cecdc8;
}

#bottles h2  span {
	margin: 0 auto;
	padding: 0 15px;
	display: block;
	width: 90px;
	height: 100px;
	background: #f9f5f1;
}

#bottles-wrap {
	clear: both;
	position: relative;
}

#bottles h3 {
	margin: 20px auto 0px auto;
	color: #787774;
	width: 667px;
	height: 80px;
	text-align: center;
	font: 1.8em/1.2em 'EnriquetaRegular', sans-serif;
}

#bottles #bottles-wrap h3 {
	margin: 0 0px 0 0;
	padding: 0;
	display: block;
	float: left;
	clear: both;
	width: 280px;
	color: #111;
	text-align: left;
	font: 4.5em/1em 'NovecentowideLightBold', sans-serif;
}

#bottles h4 {
	margin: 0 0px 0 0;
	padding: 0;
	display: block;
	float: left;
	clear: both;
	width: 280px;
	color: #787774;
	font: 1.7em/1.8em 'EnriquetaRegular', sans-serif;
	text-transform: uppercase;
}

#bottles-small {
	margin: 20px 0 0 0;
	float: left;
	clear: both;
	width: 542px;
	height: 250px;
	background: url(../img/placeholder/bottlesmall.png) no-repeat 0 0;
	overflow: hidden;
}

#bottles-small ul {
	margin: 0;
	padding: 0;
	width: 642px;
	list-style: none;
}

#bottles-small ul li {
	margin: 0;
	padding: 0;
}

#bottles-small ul li a {
	margin: 0 0px 0 0px;
	padding: 0;
	display: block;
	float: left;
	width: 105px;
	height: 230px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background-color: rgba(249,246,241,0.5);
	transition: all 0.5s;
	-moz-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-o-transition:all  0.5s;
}

#bottles-small ul li a:hover {

	background-color: rgba(249,246,241,0);
		transition: all 0.5s;
	-moz-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-o-transition:all  0.5s;
}

#bottles-small ul li a.active{
	background-color: rgba(249,246,241,0);
}

#bottles-big-cont {
	margin: -140px 0 0 -30px;
	float: left;
	width: 344px;
	height: 476px;
 }

#bottles-big {
	margin: 0 0 0 0;
	float: left;
	width: 344px;
	height: 476px;
	background: url(../img/placeholder/bottlesbig.jpg) no-repeat 27px 0px;
}

#perc-drinkers {
	margin: 0px 0 0 0;
	position: absolute;
	top: 0;
	right: 0;
	width: 250px;
	height: 190px;
}

#perc-drinkers h4 {
	margin: 0px 0 0 0;
	float: left;
	font: 1.7em/1.4em 'EnriquetaRegular', sans-serif;

}

#perc-drinkers h4 #bottles-name {
	margin: 0px 0 0 0;
	display: inline;
	font: 1.1em/1em 'NovecentowideLightBold', sans-serif;
}

#perc-drinkers .perc-number {
	margin: 0 0 0 -5px;
	padding: 0;
	float: left;
	width: 115px;
	font: 12em/1em 'BebasRegular', sans-serif;
	letter-spacing: -3px;
	color: #30302f;
}

#perc-drinkers .perc-char {
	margin: 0px 0 0 5px;
	padding: 0;
	float: left;
	width: 40px;
	font: 4em/1.6em 'BebasRegular', sans-serif;
	letter-spacing: -3px;
	color: #30302f;
}

#perc-drinkers .people-honest-logo {
	margin: 0px 0 0 5px;
	padding: 0;	
	font: 2.7em/0.6em 'AdobeGaramondProBold', sans-serif;
	letter-spacing: 0px;
	color: #787774;
}

#coupon {
	padding: 20px 0 100px 0;
	clear: both;
}

#coupon h2 {
	color: #787774;
	height: 125px;
	line-height: 1em;
}

#coupon  h2:before {
	border-top: 2px dotted #c0bfba;
}

#coupon h2  span {
	margin: 0 auto;
	padding: 0 15px;
	display: block;
	width: 90px;
	height: 110px;
	background: #f9f5f1;
}

#coupon h3 {
	margin: 20px 0 0 0;
	padding: 0px 0 0 0;
	display: block;
	clear: both;
	color: #192a2e;
	font: 1.8em/1.3em 'EnriquetaRegular', sans-serif;
	text-align: center;

}

#coupon #fblike-wrap {
	margin: 30px auto 0 auto;
	padding: 0px;
	display: block;
	width: 340px;
	height: 125px;
	background: #f9f5f1 url(../img/arrow_green.jpg) no-repeat 110px 25px;
}

#coupon #fblike {
	margin: 45px 0 0 0;
	padding: 0px;
	float: left;
	display: block;
	width: 210px;
	height: 125px;
}

#coupon-buttons {
	margin: 0px 0 0 0;
	padding: 0px 0 0 0;
	float: left;
	width: 120px;
	height: 120px;
}

#coupon #ticket {
	margin: 20px auto 0 auto;
	padding: 0px;
	display: block;
	width: 648px;
	height: 312px;
	background: #f9f5f1 url(../img/ticket.png) no-repeat 0 0;
}

#footer {
	margin: 0;
	padding: 15px 0 10px 0;
	float: left;
	clear: both;
	width: 100%;
	height: 20px;
	color: #666;
	background: #e4ded6;
}

#footer .content{
	position: relative;
}

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

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


nav#footer-menu {
	margin: 0px auto 0 auto;
	width: 100px;
}

nav#footer-menu ul {
	margin: 0px auto;
	padding: 0px 0 0 0;
	width: 90px;
	position: absolute;
	top: -8px;
	right: 0;
	list-style: none;
}

nav#footer-menu ul li {
	margin: 0;
	padding: 0 0 0 0px;
	float: left;
	width: 28px;
	height: 26px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

nav#footer-menu ul li a {
	margin: 0px 0 0 0;
	padding: 0 0 0 0px;
 	display: block;
	width: 25px;
	height: 26px;
	background: url(../img/footer-logos.png) no-repeat 0 0;
}
 
nav#footer-menu ul li#fb-footer a {
	background-position: 0px 0;
}

nav#footer-menu ul li#tw-footer a {
	background-position: -28px 0;

}

nav#footer-menu ul li#yt-footer a {
	background-position: -56px 0;
}


@media screen and (max-width: 600px),
screen and (max-device-width: 480px) {
	html {
		-ms-text-size-adjust: none;
		-webkit-text-size-adjust: none;
	}
}


@media screen and (max-width: 1024px) {
	#people {
		margin: 0 0 0px 50px;
		z-index: 40;
 		 transform: scale(0.9,0.9);
		-ms-transform: scale(0.9,0.9);  
		-webkit-transform: scale(0.9,0.9); 
		-o-transform: scale(0.9,0.9); 
		-moz-transform: scale(0.9,0.9);  
	}
	
	#menu-wrap, #coupon, #intro-skip, .customize-list, #share-infographics, #share-infographics-rankings, #intro-fb  {
		display: none;
	}
	  
	#cities {
		margin: -120px 0 0px 50px;
		z-index: 40;
 		 transform: scale(0.9,0.9);
		-ms-transform: scale(0.9,0.9);  
		-webkit-transform: scale(0.9,0.9); 
		-o-transform: scale(0.9,0.9); 
		-moz-transform: scale(0.9,0.9);  
		overflow: hidden;
	}

	.sources-location-switch {
			right: 10px;
	}


	#rankings {
		margin: -40px 0 0px 50px;
		z-index: 40;
 		 transform: scale(0.8,0.8);
		-ms-transform: scale(0.9,0.9);  
		-webkit-transform: scale(0.9,0.9); 
		-o-transform: scale(0.9,0.9); 
		-moz-transform: scale(0.9,0.9);  
	}
	
	#bottles {
		margin: -40px 0 0px 50px;
		z-index: 40;
 		transform: scale(0.8,0.8);
		-ms-transform: scale(0.9,0.9);  
		-webkit-transform: scale(0.9,0.9); 
		-o-transform: scale(0.9,0.9); 
		-moz-transform: scale(0.9,0.9);  
	}
	
	#intro {
		width: 110%;
	}
	 
	 #footer {
	 	padding-left: 20px;
		width: auto;
		 
	}
	
	#people-controls #people-social {
		transform: scale(1.11,1.11);
		-ms-transform: scale(1.11,1.11);
		-webkit-transform: scale(1.11,1.11);
		-o-transform: scale(1.11,1.11);
		-moz-transform: scale(1.11,1.11);
	}
	
	#cities #cities-social {
		transform: scale(1.11,1.11);
		-ms-transform: scale(1.11,1.11);
		-webkit-transform: scale(1.11,1.11);
		-o-transform: scale(1.11,1.11);
		-moz-transform: scale(1.11,1.11);
	}
	
	#rankings #rankings-social {
		right: 50px;
		transform: scale(1.11,1.11);
		-ms-transform:scale(1.11,1.11);
		-webkit-transform:scale(1.11,1.11);
		-o-transform: scale(1.11,1.11);
		-moz-transform: scale(1.11,1.11);
	}
	
	#people-controls #people-social h3, #cities #cities-social h3, #rankings #rankings-social h3 {
		transform: scale(0.9,0.9);
		-ms-transform: scale(0.9,0.9);
		-webkit-transform: scale(0.9,0.9);
		-o-transform: scale(0.9,0.9);
		-moz-transform: scale(0.9,0.9);
	}
}

@media screen and (max-width: 768px) {
	 #people {
		margin: 0 0 0px -130px;
		z-index: 40;
		width: 150%;
 		 transform: scale(0.7,0.7);
		-ms-transform: scale(0.7,0.7);  
		-webkit-transform: scale(0.7,0.7);  
		-o-transform: scale(0.7,0.7); 
		-moz-transform: scale(0.7,0.7); 
	}
	
	#menu-wrap, #coupon, #intro-skip  {
		display: none;
	}
	  
	
	#cities {
		margin: -400px 0 0px -130px;
		z-index: 40;
		float: left;
		width: 150%;
 		 transform: scale(0.7,0.7);
		-ms-transform: scale(0.7,0.7);  
		-webkit-transform: scale(0.7,0.7);  
		-o-transform: scale(0.7,0.7); 
		-moz-transform: scale(0.7,0.7); 
	}
	
	#rankings {
		margin: -240px 0 0px 00px;
		z-index: 40;
		width: 30%;
 		 transform: scale(0.7,0.7);
		-ms-transform: scale(0.7,0.7);  
		-webkit-transform: scale(0.7,0.7);  
		-o-transform: scale(0.7,0.7); 
		-moz-transform: scale(0.7,0.7); 
	}
	
	#bottles {
		margin: -240px 0 0px 20px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.7,0.7);
		-ms-transform: scale(0.7,0.7);  
		-webkit-transform: scale(0.7,0.7);  
		-o-transform: scale(0.7,0.7); 
		-moz-transform: scale(0.7,0.7); 
	}
	
	#video-embed-wrap {
		margin: -270px 0 0 -380px;
		padding: 0;
		width: 940px;
		max-width: 100%;
		height: 540px;
		position: absolute;
		top: 50%;
		left: 50%;	
	}
	 
	#introcontent p {
		margin: 0 0 0 -100px;
		font-size: 0.8em;
	}

	#people-controls #people-social {
		transform: scale(1.43,1.43);
		-ms-transform: scale(1.43,1.43);
		-webkit-transform:  scale(1.43,1.43);
		-o-transform: scale(1.43,1.43);
		-moz-transform: scale(1.43,1.43);
	}
	
	#cities #cities-social {
		transform: scale(1.43,1.43);
		-ms-transform: scale(1.43,1.43);
		-webkit-transform:  scale(1.43,1.43);
		-o-transform: scale(1.43,1.43);
		-moz-transform:  scale(1.43,1.43);
	}
	
	#rankings #rankings-social {
		transform:scale(1.43,1.43);
		-ms-transform:scale(1.43,1.43);
		-webkit-transform:  scale(1.43,1.43);
		-o-transform: scale(1.43,1.43);
		-moz-transform: scale(1.43,1.43);
	}
	
	#people-controls #people-social h3, #cities #cities-social h3, #rankings #rankings-social h3 {
		transform: scale(0.8,0.8);
		-ms-transform:  scale(0.8,0.8);
		-webkit-transform:  scale(0.8,0.8);
		-o-transform:  scale(0.8,0.8);
		-moz-transform:  scale(0.8,0.8);
	}

}

@media screen and (max-width: 640px) {
	 #people {
		margin: 0 0 0px -10px;
		z-index: 40;
 		 transform: scale(0.6,0.6);
		-ms-transform: scale(0.6,0.6);
		-webkit-transform: scale(0.6,0.6);
		-o-transform: scale(0.6,0.6);
		-moz-transform: scale(0.6,0.6);
		width: 30%;
	}
	
	#menu-wrap, #coupon, #intro-skip , #topfive, #share-infographics, .rankings-switch, #cities, #cities-social, #people-social, #rankings-social {
		display: none;
	}
	  
	#cities {
		margin: 50px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.6,0.6);
		-ms-transform: scale(0.6,0.6);
		-webkit-transform: scale(0.6,0.6);
		-o-transform: scale(0.6,0.6);
		-moz-transform: scale(0.6,0.6);
		overflow: scroll;
	}
	
	#rankings {
		margin: -540px 0 0px -10px;
		z-index: 40;
		width: 30%;
		  transform: scale(0.6,0.6);
		-ms-transform: scale(0.6,0.6);
		-webkit-transform: scale(0.6,0.6); 
		-o-transform: scale(0.6,0.6);
		-moz-transform: scale(0.6,0.6);
 	}
	
	#rankings #rankings-wrap {
		margin: 0px 0 0px 40px;
		top: 0;
		transform: scale(1.4,1.4);
		-ms-transform: scale(1.4,1.4);  
		-webkit-transform: scale(1.4,1.4); 
		-o-transform: scale(1.4,1.4); 
		-moz-transform: scale(1.4,1.4);
		border-top: none;

	}
	
	#bottles {
		margin: -100px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.6,0.6);
		-ms-transform: scale(0.6,0.6);
		-webkit-transform: scale(0.6,0.6);
		-o-transform: scale(0.6,0.6);
		-moz-transform: scale(0.6,0.6);
	}
	
	#intro {
		width: 130%;
		height: 470px;
	}

	#video-embed-wrap {
		margin: -220px 0 0 -310px;
		padding: 0;
		width: 540px;
		max-width: 100%;
		height: 470px;
		position: absolute;
		top: 50%;
		left: 50%;	
	}
	
	 #introcontent p {
		margin: 0px 0 0 0px;
		font-size: 0.7em;
		width: 80%;
 	}

} 

@media screen and (max-width: 480px) {
	 #people {
		margin: 0 0 0px -10px;
		z-index: 40;
 		 transform: scale(0.4,0.4);
		-ms-transform: scale(0.4,0.4);  
		-webkit-transform: scale(0.4,0.4);  
		-o-transform: scale(0.4,0.4); 
		-moz-transform: scale(0.4,0.4); 
		width: 30%;
	}
	
	#menu-wrap, #coupon, #intro-skip , #topfive, #share-infographics, .rankings-switch, #cities, #cities-social, #people-social, #rankings-social {
		display: none;
	}
	  
 
	
	#cities {
		margin: -1350px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.4,0.4);
		-ms-transform: scale(0.4,0.4);  
		-webkit-transform: scale(0.4,0.4);  
		-o-transform: scale(0.4,0.4); 
		-moz-transform: scale(0.4,0.4); 
		overflow: scroll;
	}
	
	#rankings {
		margin: -840px 0 0px -10px;
		z-index: 40;
		width: 30%;
		  transform: scale(0.4,0.4);
		-ms-transform: scale(0.4,0.4);  
		-webkit-transform: scale(0.4,0.4);  
		-o-transform: scale(0.4,0.4); 
		-moz-transform: scale(0.4,0.4); 
 	}
	
	#rankings #rankings-wrap {
		margin: 0px 0 0px 40px;
		top: 0;
		transform: scale(1.4,1.4);
		-ms-transform: scale(1.4,1.4);  
		-webkit-transform: scale(1.4,1.4); 
		-o-transform: scale(1.4,1.4); 
		-moz-transform: scale(1.4,1.4);
		border-top: none;

	}
	
	#bottles {
		margin: -300px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.4,0.4);
		-ms-transform: scale(0.4,0.4);  
		-webkit-transform: scale(0.4,0.4);  
		-o-transform: scale(0.4,0.4); 
		-moz-transform: scale(0.4,0.4); 
	}
	
	#intro {
		width: 130%;
		height: 470px;
	}
	
	 #video-embed-wrap {
		margin: -170px 0 0 -250px;
		padding: 0;
		width: 940px;
		max-width: 100%;
		height: 470px;
		position: absolute;
		top: 50%;
		left: 50%;	
	}
	
	 #introcontent p {
		margin: -30px 0 0 0px;
		font-size: 0.7em;
		width: 80%;
 	}

}


@media screen and (max-width: 360px) {
	 #people {
		margin: 0 0 0px -10px;
		z-index: 40;
 		 transform: scale(0.34,0.34);
		-ms-transform: scale(0.34,0.34);
		-webkit-transform: scale(0.34,0.34);
		-o-transform: scale(0.34,0.34);
		-moz-transform: scale(0.34,0.34);
	}
	
	#menu-wrap, #coupon, #intro-skip , #topfive, #share-infographics, .rankings-switch {
		display: none;
	}
	  
    #container {
    	overflow: hidden;
    }
	
	#cities {
		margin: -1350px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.3,0.3);
		-ms-transform: scale(0.3,0.3);  
		-webkit-transform: scale(0.3,0.3);  
		-o-transform: scale(0.3,0.3); 
		-moz-transform: scale(0.3,0.3); 
	}
	
	#rankings {
		margin: -940px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.34,0.34);
		-ms-transform: scale(0.34,0.34);  
		-webkit-transform: scale(0.34,0.34);  
		-o-transform: scale(0.34,0.34); 
		-moz-transform: scale(0.34,0.34); 
 	}
	
	#rankings #rankings-wrap {
		margin: 0px 0 0px 20px;
		top: 0;
		transform: scale(1.4,1.4);
		-ms-transform: scale(1.4,1.4);  
		-webkit-transform: scale(1.4,1.4); 
		-o-transform: scale(1.4,1.4); 
		-moz-transform: scale(1.4,1.4); 
 	}
	
	#bottles {
		margin: -400px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.34,0.34);
		-ms-transform: scale(0.34,0.34);  
		-webkit-transform: scale(0.34,0.34);  
		-o-transform: scale(0.34,0.34); 
		-moz-transform: scale(0.34,0.34); 
	}
	
	#intro {
		width: 130%;
		height: 450px;
		overflow: hidden;
	}
	
	 #video-embed-wrap {
		margin: -170px 0 0 -190px;
		padding: 0;
		width: 940px;
		max-width: 100%;
		height: 540px;
		position: absolute;
		top: 50%;
		left: 50%;	
	}
	
	 #introcontent p {
		margin: -30px 0 0 0px;
		font-size: 0.7em;
		width: 80%;
 	}
 	
 	#footer {
 		font-size: 0.7em;
 	}

}

@media screen and (max-width: 320px) {
	 #people {
		margin: 0 0 0px -10px;
		z-index: 40;
 		 transform: scale(0.3,0.3);
		-ms-transform: scale(0.3,0.3);  
		-webkit-transform: scale(0.3,0.3);  
		-o-transform: scale(0.3,0.3); 
		-moz-transform: scale(0.3,0.3); 
	}
	
	#menu-wrap, #coupon, #intro-skip , #topfive, #share-infographics, .rankings-switch {
		display: none;
	}
	  
    #container {
    	overflow: hidden;
    }
	
	#cities {
		margin: -1350px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.3,0.3);
		-ms-transform: scale(0.3,0.3);  
		-webkit-transform: scale(0.3,0.3);  
		-o-transform: scale(0.3,0.3); 
		-moz-transform: scale(0.3,0.3); 
	}
	
	#rankings {
		margin: -940px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.3,0.3);
		-ms-transform: scale(0.3,0.3);  
		-webkit-transform: scale(0.3,0.3);  
		-o-transform: scale(0.3,0.3); 
		-moz-transform: scale(0.3,0.3); 
 	}
	
	#rankings #rankings-wrap {
		margin: 0px 0 0px -10px;
		top: 0;
		transform: scale(1.4,1.4);
		-ms-transform: scale(1.4,1.4);  
		-webkit-transform: scale(1.4,1.4); 
		-o-transform: scale(1.4,1.4); 
		-moz-transform: scale(1.4,1.4); 
 	}
	
	#bottles {
		margin: -400px 0 0px -10px;
		z-index: 40;
		width: 30%;
		 transform: scale(0.3,0.3);
		-ms-transform: scale(0.3,0.3);  
		-webkit-transform: scale(0.3,0.3);  
		-o-transform: scale(0.3,0.3); 
		-moz-transform: scale(0.3,0.3); 
	}
	
	#intro {
		width: 130%;
		height: 450px;
		overflow: hidden;
	}
	
	 #video-embed-wrap {
		margin: -170px 0 0 -170px;
		padding: 0;
		width: 940px;
		max-width: 100%;
		height: 540px;
		position: absolute;
		top: 50%;
		left: 50%;	
	}
	
	 #introcontent p {
		margin: -30px 0 0 0px;
		font-size: 0.7em;
		width: 80%;
 	}
 	
 	#footer {
 		font-size: 0.7em;
 	}

}