html, body, div, span, p, a, del, em, img, ol, ul, li, fieldset, form, label {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
/*    -webkit-transform: translate3d(0,0,1px);
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;*/
    
/*    overflow-x:hidden;
    width:100%;*/
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html, body {
	line-height: 1;
	min-height:100%;
    font-family: "azo-sans-web",Helvetica, sans-serif;
    font-style: normal;
    font-weight: 300;
}

body {
/*    background: #eeeeee;
    background: -webkit-linear-gradient(top, #eeeeee, #cccccc 100%);
    background: -moz-linear-gradient(top, #eeeeee, #cccccc 100%);
    background: -o-linear-gradient(top, #eeeeee, #cccccc 100%);
    background: -ms-linear-gradient(top, #eeeeee, #cccccc 100%);
    background: linear-gradient(top, #eeeeee, #cccccc 100%);
    background-attachment:fixed;*/
}

iframe {
    border:0;
    height:100%;
    width:100%;
}

ol, ul {
	list-style: none;
}

p {
	margin:1em 0;
	line-height:1.1em;
}

q {
	font-style:italic;
	color:#333;
}

h1 {
	font-size:2.91em;
	margin:0;
}

h1 > small {
	text-align:right;
	display:inline-block;
	font-size:.71em;
	text-indent:15em;
	color:#444;
}

h2 {
	color:inherit;
	font-size:1.91em;
	margin:2em 0 1em 0;
}

h2:first-child {margin-top:0;}

h3 {
	color:#333;
	font-size:1.41em;
	margin:1em 0;
}

h4 {
	color:#444;
	font-size:1.11em;
	margin:1em 0;
}

#progress {
	height:2%;
	background:#444;
	bottom:0;
	z-index:200;
}

#scrollbar {
	position:fixed;
	right:2px;
	height:50px;
	width:6px;
	background:#444;
	background:rgba(0,0,0,0.6);
	border:1px solid rgba(255,255,255,0.6);
	z-index:300;
	border-radius:3px;
}

.skrollr-desktop #scrollbar {display:none;}

#building-bkgnd {
    background:#8F98B2 url(../images/building-bkgnd.png) no-repeat;
    background-size:100% auto;
    height:4000px;
    width:100%;
    z-index:55555;
}

#building-cloud-1, #building-cloud-2, #building-cloud-3 {
    z-index:888888;
}

#building-cloud-1 img {
    height:235px;
    width:852px;
}

#building-cloud-2 img {
    height:239px;
    width:852px;
}

#building-cloud-3 img {
    height:146px;
    width:440px;
}

#building-facade {
    background:url(../images/building-facade-brick.jpg);
    background-size:100%;
    height:100%;
    left:40%;
    width:60%;
    z-index:666666;
}

#building-facade img {
    position:absolute;
}

#building-sparkle-1 {
    left:19%;
    top:30%;
    width:15%;
}

#building-sparkle-2 {
    left:25%;
    top:40%;
    width:10%;
}

#building-white-overlay {
    background:#fff;
    height:100%;
    width:100%;
    z-index:777777;
}

#container {
    overflow:hidden;
    height:100%;
    position:relative;
    width:100%;
}

#intro {
	width:80%;
	left:50%;
	top:1em;
	margin-left:-40%;
	padding:2em;
	background:#fff;
	text-align:center;
	border-radius:1em;

	-webkit-transform-origin:0 0;
	-moz-transform-origin:0 0;
	-ms-transform-origin:0 0;
	-o-transform-origin:0 0;
	transform-origin:0 0;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#intro .arrows {
	font-size:2em;
	color:#09f;
}

#transform {
	width:70%;
	left:50%;
	top:20%;
	margin-left:-35%;
	text-align:center;
	font-size:150%;

	.transform-origin(50%, 50%);
}

#properties {
	width:100%;
	height:100%;
	padding-top:10%;
	text-align:center;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#easing_wrapper {
	width:100%;
	height:100%;
}

#easing {
	top:10%;
	width:50%;
	z-index:101;
}

.drop {
	background:#09f;
	font-weight:bold;
	padding:1em;
}

#download {
	width:80%;
	left:10%;
	height:80%;
	padding:3em;
	border:0 solid #222;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.twitter-share-button, .twitter-follow-button {
	vertical-align:middle;
}



/*div {
    position:fixed;
}*/

#city-cloud1 {
    position:absolute;
    top:80px;
}

#city-cloud2 {
    position:absolute;
    top:15px;
}

#city-cloud3 {
    position:absolute;
    top:125px;
}

#city-fade {
    background:#fff;
    height:100%;
    position:absolute;
    top:0;
    width:100%;
}

#city-hill {
    position:absolute;
    margin-left:-5%;
    top:50%;
    width:110%;
}

#city-hill img {
    width:100%;
}

#city-hill_bottom {
    background:url("../images/city-hill_bkgnd.png") repeat top center;
    height:1000%;
    margin-top:-3px;
    position:absolute;
    width:100%;
}

#city-noise {
    background:url("../images/city-noise.png") repeat top center;
    height:110%;
    overflow:hidden;
    width:100%;
    z-index:1;
}

#city-skyline {
    background:url("../images/city-skyline.svg") no-repeat top center;
    background-size:150% auto;
    height:100%;
}

#city-tumbleweed {
    bottom:0;
    position:absolute;
    width:30%;
}

#city-tumbleweed img {
    width:100%;
}

#end-billboard-1 {
    margin-left:19.375%; /* The background is 800 px. The left edge is 155 px. 155/800 = 19.375% */
    position:absolute;
    bottom:50%;
    width:18.75%; /* The background is 800 px. The billboard is 150 px. 150/800 = 18.75% */
}

#end-billboard-1 img {
    width:100%;
}

#end-billboard-2 {
    margin-left:76.5%; /* The background is 800 px. The left edge is 612 px. 612/800 = 76.5% */
    position:absolute;
    bottom:50%;
    width:18.75%; /* The background is 800 px. The billboard is 150 px. 150/800 = 18.75% */
}

#end-billboard-2 img {
    width:100%;
}

#end-birds {
    position:absolute;
    top:5%;
    width:100%;
}

#end-birds a {
    display:block;
    float:left;
    margin:0;
    padding:0;
}

#end-birds-1 {
    width:23.5%; /* The background is 800 px. The birds are 188 px. 188/800 = 23.5 */
}

#end-birds-1 img {
    width:100%;
}

#end-birds-2 {
    left:-1px;
    position:relative;
    width:23.5%; /* The background is 800 px. The birds are 188 px. 188/800 = 23.5 */
}

#end-birds-2 img {
    width:100%;
}

#end-boat {
    position:absolute;
    bottom:0%;
    width:40.625%; /* The background is 800 px. The truck is 325 px. 325/800 = 40.625% */
}

#end-city {
    background:#bbe4f8 url("../images/end-city.png") no-repeat center center;
    background-size:100% auto;
    height:100%;
    width:100%;
    z-index:777776;
}

#end-grocery-1 {
    margin-left:39.5%; /* The background is 800 px. The left edge is 316 px. 316/800 = 39.5% */
    position:absolute;
    bottom:50%;
    width:52.5%; /* The background is 800 px. The grocery stores are 420 px. 420/800 = 52.5% */
}

#end-grocery-1 img {
    width:100%;
}

#end-grocery-2 {
    margin-left:39.5%; /* The background is 800 px. The left edge is 316 px. 316/800 = 39.5% */
    position:absolute;
    top:50%;
    width:52.5%; /* The background is 800 px. The grocery stores are 420 px. 420/800 = 52.5% */
}

#end-grocery-2 img {
    width:100%;
}

#end-news {
    margin-left:18.75%; /* The background is 800 px. The left edge is 150 px. 150/800 = 18.75% */
    position:absolute;
    bottom:50%;
    width:3.5%; /* The background is 800 px. The news sign is 28 px. 28/800 = 3.5% */
}

#end-news img {
    width:100%;
}

#end-truck {
    position:absolute;
    top:50%;
    width:12.5%; /* The background is 800 px. The truck is 100 px. 100/800 = 12.5% */
}

#end-truck img {
    width:100%;
}

#end-uo {
    margin-left:9.75%; /* The background is 800 px. The left edge is 78 px. 78/800 = 9.75% */
    position:absolute;
    bottom:50%;
    width:6.5%;  /* The background is 800 px. The link is 52 px. 52/800 = 6.5% */
}

#end-uo img {
    width:100%;
}

#fish-green {
/*    height:75px;
    width:125px;*/
    width:12%;
}

#fish-jerry {
/*    height:100px;
    width:160px;*/
    width:17%;
}

#fish-purple {
/*    height:65px;
    width:100px;*/
    width:9.5%;
}

#fish-purple_long {
/*    height:70px;
    width:130px;*/
    width:13.25%;
}

#fish-red {
/*    height:90px;
    width:150px;*/
    width:15.75%;
}

#fish-teal {
/*    height:110px;
    width:195px;*/
    width:21.375%;
}

#icon-photo-a, #icon-photo-b, #icon-photo-c, #icon-photo-d {
    left:20px;
    top:20px;
}

#info-bubble-2 {
    margin-left:10%;
}

#info-bubble-2 p {
    margin-top:60px;
}

#info-bubble-3 {
    margin-left:-30%;
}

#info-bubble-3 p {
    margin-top:60px;
    width:80%;
}

#info-bubble-4 {
    left:10%;
}

#info-bubble-4 p {
    padding-left:2px;
    padding-top:15px;
}

#info-bubble-4-5 {
    left:30%;
}

#info-bubble-4-5 p {
    padding-left:2px;
    padding-top:30px;
}

#info-bubble-5 {
    left:70%;
}

#info-bubble-6 {
    left:30%;
}

#info-bubble-6 p {
    font-size:16px;
    line-height:22px;
    margin-top:25px;
    width:80%;
}

#info-bubble-7 {
    left:40%;
}

#info-bubble-7 p {
    font-size:16px;
    line-height:22px;
    margin:40px 0 0 10px;
    width:80%;
}

#info-bubble-8 p {
    margin-top:30px;
}

#info-bubble-9 {
    left:auto;
    right:10%;
}

#info-bubble-10 {
}

#info-bubble-10 p {
    font-size:35px;
    margin-top:90px;
}

#info-bubble-11 {
}

#info-bubble-11 p {
    margin-top:22px;
}

#info-bubble-12 {
}

#info-bubble-12 p {
    margin-top:60px;
}

#info-bubble-13 {
}

#info-bubble-13 p {
/*    font-size:7px;
    line-height:9px;
    margin-top:30px;*/
}

#info-bubble-14 {
}

#info-bubble-14 p {
    margin-top:24px;
    width:80%;
}

#info-bubble-15 {
    left:30%;
}

#info-bubble-16 {
    right:15%;
}

#info-bubble-16 p {
    margin:60px 0 0 20px;
}

#info-bubble-18 {
    left:13%;
}

#info-bubble-18 p {
    margin:50px 0 0 20px;
}

#info-bubble-19 {
    left:40%;
}

#info-bubble-19 p {
    margin:40px 0 0 20px;
}

#info-bubble-20 {
    left:13%;
}

#info-bubble-20 p {
    margin:50px 0 0 20px;
}

#info-bubble-21 {
    left:75%;
}

/*
#intro-text {
    color:#71645B;
    font-size:21px;
    margin:0 20%;
    text-align:center;
    width:60%;
}

#intro-text p {
    line-height:32px;
}
*/

#intro-text {
    text-align:center;
    width:100%;
}

#intro-text img {
    max-width:600px;
    width:80%;
}

#logo {
    margin:20px;
    max-width:200px;
    width:40%;
    z-index:1;
}

#logo img {
    height:auto;
    width:70%;
}

#mark-o-sm, #mark-o-plate-sm {
    display:none;
}

#mark-leaf, #mark-o-lg, #mark-o-plate-lg img, #mark-u {
    text-align:center;
    width:100%;
    z-index:4;
}

#mark-leaf img, #mark-o-lg img, #mark-o-plate-lg img, #mark-u img {
    display:block;
    margin:0 auto;
    max-width:600px;
    width:50%;
}

#nav {
    background:#3e342e;
    bottom:0;
    position:fixed;
    left:0;
    width:100%;
    z-index:999999999;
}

#nav #nav-menu {
    width:20%;
}

#nav #nav-menu a.active {
    background:#2c221c;
}

#nav #nav-next, #nav #nav-prev {
    border-left:1px solid #fff;
    width:39%;
}

#nav .nav-item {
    display:block;
    float:left;
}

#nav .nav-item a {
    color:#fff;
    display:block;
    text-align:center;
    text-decoration:none;
}

#nav .nav-item img {
    height:100%;
    max-height:40px;
    max-width:40px;
    width:100%;
}

#plants-back_plants {
    left:0;
    position:absolute;
    top:0;
    width:100%;
    z-index:888;
}

#plants-back_plants img {
    width:100%;
}

#plants-ground {
    height:100%;
    width:100%;
}

#plants-soil_bottom {
    background:url("../images/plants-dirt.jpg");
/*    height:100%;*/
    position:relative;
    z-index:999;
}

#plants-soil_bottom img {
    margin-bottom:-2px;
    margin-top:-2px;
    width:100%;
}

#plants-soil_top {
    position:absolute;
}

#plants-stems {
    background:url("../images/plants-soil_top.png") no-repeat center bottom;
    background-size:100% auto;
    position:relative;
    width:100%;
    z-index:999;
}

#plants-stems img {
    width:100%;
}

#scene-table {
    background:#98AFB5;
    height:100%;
    width:100%;
    z-index:0;
}

#skip {
    cursor:pointer;
    height:25px;
    margin:25px 20px 0 0;
    right:0;
    width:25px;
    z-index:999999;
}

#subnav {
    background:#2c221c;
    bottom:42px;
    display:none;
    position:fixed;
    left:0;
    width:20%;
    z-index:999999999;
}

#subnav li a {
    border-bottom:1px solid #fff;
    color:#fff;
    display:block;
    padding:10px;
    text-align:center;
    text-decoration:none;
}

#subnav li.sep a {
    background:#3e342e;
}

#table-floor {
    background:#BFC9CA;
    height:40%;
    width:100%;
    z-index:1;
}

#table-fork, #table-knife {
    text-align:center;
    width:100%;
    z-index:5;
}

#table-fork img, #table-knife img {
    width:80%;
}

#table-photo-left {
    top:8%;
    width:8%;
}

#table-photo-left img {
    width:100%;
}

#table-photo-right {
    top:8%;
    width:8%;
}

#table-photo-right img {
    width:100%;
}

#table-table {
    text-align:center;
    width:100%;
    z-index:3;
}

#table-table img {
    width:80%;
}

#table-tablemat {
    text-align:center;
    width:100%;
    z-index:3;
}

#table-tablemat img {
    width:80%;
}

#table-window {
    text-align:center;
    width:100%;
    z-index:2;
}

#table-window img {
    width:50%;
}

#table-window-mask {
    background:url("../images/table-window-mask.svg") no-repeat center top;
    background-size:200%;
    height:100%;
    width:100%;
    z-index:2;
}

#tank-bkgnd-left {
    background:url("../images/tank-bkgnd-left.png") repeat-y center top;
    background-size:100%;
    height:1000%;
    width:100%;
    z-index:888;
}

#tank-bkgnd-right {
    background:url("../images/tank-bkgnd-right.svg") repeat-y center top;
    background-size:100%;
    height:500%;
    width:100%;
    z-index:888;
}

#tank-drop_1 {
    width:100%;
    z-index:888;
}

#tank-drop_2 {
    width:100%;
    z-index:1111;
}

#tank-drop_3 {
    width:100%;
    z-index:2222;
}

#tank-plants {
    width:100%;
    z-index:3333;
}

#tank-plants img {
    width:100%;
}

#tank-plants-bkgnd {
    background:#71665C;
    height:2000px;
    width:100%;
    margin-top:-10px;
    z-index:3333;
}

#tank-plants-drops {
    left:0;
    position:absolute;
    top:0;
}

#tank-plants-greens-1, #tank-plants-greens-2, #tank-plants-greens-3,
#tank-plants-greens-4, #tank-plants-greens-5, #tank-plants-greens-6 {
    left:0;
    position:absolute;
    top:0;
}

#tank-side_pipe {
    height:1000%;
    width:100%;
    z-index:999;
}

#tank-side_pipe img {
    position:absolute;
    top:-1px;
    width:100%;
    z-index:999;
}

#tank-tank {
    height:1000%;
    width:100%;
    z-index:777;
}

#tank-tank img {
    position:absolute;
    width:100%;
    z-index:999;
}

#tank-tank_cover {
    width:100%;
    z-index:1111;
}

#tank-tank_cover img {
    position:absolute;
    width:100%;
}

#usda_organic {
    height:50px;
    margin:10px 10px 0 0;
    right:0px;
    width:50px;
    z-index:999999;
}

.fish-bkgnd {
/*    height:75px;
    width:125px;*/
    width:12%;
}

.fish-bkgnd img {
    width:100%;
}

.fish-fgnd img {
    width:100%;
}

.hidden {
    display:none;
}

.icon-photo {
    cursor:pointer;
    position:fixed;
    width:62px;
    z-index:999999;
}

.icon-photo img {
    width:100%;
}

.modal {
    background:#aab242;
    margin:80px auto;
    position:relative;
    height:500px;
    width:70%;
}

.modal iframe {
    position:relative;
    z-index:1;
}

.modal #modal-close {
    cursor:pointer;
    height:40px;
    position:absolute;
    right:5px;
    top:5px;
    width:40px;
    z-index:2;
}

.modal-content {
    height:350px;
    overflow:auto;
    padding:50px;
}

.modal-content a {
    color:#fff;
}

.modal-content h1 {
    font-size:200%;
    margin-bottom:15px;
}

.modal-content img {
    display:block;
    margin-bottom:15px;
    max-width:800px;
    width:100%;
}

.modal-content p {
    font-size:24px;
    line-height:28px;
    margin:0 0 8px 0;
    padding:0;
}

.modal-content ul {
    font-size:20px;
    list-style-type:disc;
    margin:0 0 8px 0;
    padding:0 0 0 24px;
}

.modal-content li {
    margin-bottom:5px;
}

.modal-wrapper {
    background:rgba(0, 0, 0, 0.6);
    color:#fff;
    display:none;
    height:100%;
    position:fixed;
    width:100%;
    z-index:9999999;
}

.ib-e {
    background:url("../images/info-bubble-e.svg") no-repeat;
    height:217px;
    margin-left:0;
    margin-top:0;
    right:50%;
    width:245px;
}

.ib-nw {
    background:url("../images/info-bubble-nw.svg") no-repeat;
    height:217px;
    margin-left:0;
    margin-top:0;
    left:50%;
    width:217px;
}

.ib-s {
    background:url("../images/info-bubble-s.svg") no-repeat;
    height:245px;
    margin-left:-108px;
    margin-top:-245px;
    left:50%;
    width:217px;
}

.ib-s2 {
    background:url("../images/info-bubble-s2.svg") no-repeat;
    height:315px;
    margin-left:-140px;
    margin-top:-315px;
    left:50%;
    width:280px;
}

.ib-w {
    background:url("../images/info-bubble-w.svg") no-repeat;
    height:217px;
    margin-left:0;
    margin-top:0;
    left:50%;
    width:245px;
}

.info-bubble {
/*    transform:scale(1.75);
    -moz-transform:scale(1.75);
    -webkit-transform:scale(1.75);*/
    z-index:999999;
}

.info-bubble p {
    color:#fff;
    font-size:17px;
    font-weight:400;
    height:60%;
    line-height:24px;
    margin:43px auto;
    text-align:center;
    width:70%;
}

.info-bubble.ib-e p {
    margin:43px auto 0 17px;
}

.link {
    border:1px solid red;
    display:block;
}

.plants-leaves {
    position:absolute;
    top:0;
    width:100%;
}

.txt-sm {
    font-size:75%;
    line-height:75%;
}

/*@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
    
#table-window {
    background-image:url("../images/table-window@2x.png");
}
    
}*/

@media only screen and (max-width: 768px) and (orientation:portrait) {

#info-bubble-2 {
    margin-top:-100px;
    margin-left:-10%;
}

#info-bubble-4-5 {
    left:10%;
}

#info-bubble-6 {
    margin-bottom:-20%;
}

#info-bubble-7 {
    left:20%;
}

#info-bubble-8 {
    left:20%;
}

/*
#intro-text {
    font-size:15px;
    margin:0 10%;
    width:80%;
}
    
#intro-text p {
    line-height:17px;
}
*/

#intro-text img {
    margin:0 5%;
    width:90%;
}

#logo {
    display:none;
}

#mark-o-lg, #mark-o-plate-lg {
    display:none;
}

#mark-leaf, #mark-o-sm, #mark-o-plate-sm, #mark-u {
    display:block;
    text-align:center;
    width:100%;
    z-index:4;
}

/*#mark-o-sm {
    padding-top:14.5%;
}*/

#mark-leaf img, #mark-o-sm img, #mark-o-plate-sm img, #mark-u img {
    margin-top:30px;
    width:80%;
}

/*#skip {
    display:none;
}*/

#subnav {
    width:100%;
}

#table-fork img, #table-knife img {
    width:100%;
}

#table-photo-left, #table-photo-right {
    display:none;
}

#table-table img {
    width:100%;
}

#table-tablemat img {
    width:100%;
}

#table-window img {
    width:80%;
}

/*#usda_organic {
    margin-right:10px;
    right:0;
}*/

}