/***** Palette *****/
.orange {color:#dd8143}
.gold {color:#e2af49}
.blue {color:#006d93}
.darkblue {color:#003f4d}
.gray {color:#ccd9d2}
.cream {color:#f7ecd6}

/***** Typography *****/
a {
    color:#999;
    text-decoration:none;
}

a:hover {text-decoration: underline;}

body {
    font-family: helvetica;
    color:#002E35;
}

h1 {
    font-size:72px;
    font-family: "aw-conqueror-carved";
    font-weight: normal;
}

h2 {
    font-family: "ff-providence-web-pro", helvetica;
    font-size:24px;
    margin-top:20px;
    font-weight: normal;
    letter-spacing: -2px;
}

p {   
    font-family: "ff-providence-web-pro", helvetica;
    font-size:20px;
    font-weight: normal;
    letter-spacing: -2px;
}

/***** Animation *****/
.anim {
    -webkit-transform:translate(450px,0px);
}

/***** Reset *****/
section, h1, p {
    padding:0; 
    margin:0;
}

/***** Helper *****/
.full {width:100%;}
.front {
    position:relative; 
    z-index:100;
}

/***** Structure *****/
body {
    display:block;
    margin:0 auto;
/*    max-width:1500px;*/
    min-width:1060px;
    background-color: #002E35;
    position:relative;
}

#sky {
    display:block;
    background: url(../img/sky.jpg) no-repeat;
    background-size:cover;
    width:100%;
    height:800px;
    position:relative;
}

#stars {
    width:100%;
    position: absolute;
}

#character-wrap {
    position:relative;
    display:block;
    margin: 0 auto;
    width:50%;
    height:200px;
    padding-top:5%;
    min-width: 360px;
}

#moon {
    display:block;
    width:90%;
    max-width: 1200px;
    margin:0 auto;
    margin-top:460px;
    position:absolute;
    -webkit-transition: -webkit-transform 3s ease-in-out;
    z-index:10;
}

#water {
    width:100%;
    display:block;
    margin-top:-300px;
    position:relative;
    z-index:40;
}

#water-wrapper {
    position:relative;
}

#water-b {
    width:100%;
    position:relative;
    z-index:50;
    display:block;
    margin-top:-5px;
}

#ship {
    width:350px;
    display:block;
    margin:0 auto;
    -webkit-transition: -webkit-transform 5s ease-in-out;
    position:absolute;
    z-index: 30;
    margin:-170px 0 0 -230px;
}

#pirate, #shark, #fishyfish {
    position: absolute;
    z-index: 500;
}

#shark {
    width:600px;
    top:1600px;
    right:60px;
}

#fishyfish {
    width:450px;
    top:420px;
    left:80px;
}

#pirate {
    width:400px;
    top:800px;
    left:30px;
}

#results-text {
    position:absolute;
    z-index:1000;
    width:700px;
    top:1000px;
    right:60px;
}

#results-text h1 {color:#f7eed7;}

#results-text p {
    display:block; 
    color:#f7eed7;
    margin-left:10px;
    margin-top:30px;
}

#results-here {
    max-height:2100px;
    overflow:scroll;
}

#menu {
    position:fixed;
    background:url(../img/menu-sm.png) top right repeat-x;
    right:0;
    top:0;
    z-index: 500;
    height: 145px;
    margin:-20px 0 -80px 0;
    width:100%;  
    min-width:1500px;
}

#ipsum-form {
    height:100px;
    position:relative;
    z-index: 1000;
    padding-top:40px;
    margin-left:160px;
    float:right;
}

#ipsum-form input {
    font-size:16px;
    color: #666;
    width:140px;
    display:inline-block;
    border-radius: 5px;
    outline-color: #002E35;
    height:20px;
    margin-right:10px;
    background-color:#f3EAD5;
    padding:7px;
}

#ipsum-form #submit {
    background:url(../img/button.png);
    width:179px;
    height:54px;
    display:inline-block;
    float:right;
    margin-top:-10px;
    margin-right:60px;
}

#ipsum-form #submit:hover {
    background:url(../img/button.png) 0 -54px;
}

#ipsum-form #submit:active {
    background:url(../img/button.png) 0 -108px;
}

#mashable {
    position:fixed;
    top:0;
    left:0;
    z-index:1000;
}

#about {
    position:absolute;
    z-index:500;
    top:50px;
    left:50px;
    width:680px;
}

#retail {
    background-color:#e2af49;
    height:450px;
    color:#fff;
    padding:60px;
    padding-top:25px;
    min-width:1100px;
    position: relative;
    z-index: 1100;
}

#floor img {
    width:100%;
    margin-top:-200px;
    display:block;
    position:relative;
    z-index:100;
}

#bottom {
    height:60px;
    color:#666;
    background-color:#333;
    text-align: center;
    padding-top:35px;
    font-size:16px;
    position: relative;
    z-index: 1200;
}

.retail-item {
    display:inline-block;
    margin-left:40px;
}

a#clipboard {
    display:block;
    padding:5px;
    background-color:#003f4d;
    border:1px solid #003f4d;
    border-radius: 8px;
    color:#666;
    position:absolute;
    top:980px;
    right:650px;
    z-index: 1000;
    text-decoration: none;
    font-size:11px;
}

a#clipboard:hover {
    border:1px solid #888;
    color:#f7eed7;
}

#scrollstop {
    position:absolute;
    top:780px;
}


/* Buy Now Button */

input.buy-now {
	background: url(../img/buynow.png) no-repeat;
	height: 40px;
	background-position: 0 0;
	color: transparent ;  /* #e2af49 */
	margin-top: 20px;
	width: 123px;
	border: 0;
	outline: 0;
	display: block;
}

input.buy-now:hover {
	background-position: 0 -40px;
	height: 40px;
	
}

input.buy-now:active {
	background-position: 0 -80px;
	height: 40px;
}

.retail-item {
	width: 20%;
}

input [type="image"]{
	border: 0;
	outline: 0;
}

.pay-form {
	height: 40px;
}

/* End Buy Now Button */


@media (min-width:1000px) {
    #ipsum-form {margin-left:200px;}
    #results-here{max-height:1400px;}
}

@media (max-width:1000px) {
    #ipsum-form {margin-left:545px;}
}

@media (min-width:1500px) {
    #ship {margin-top:-140px;}
    #sky {height:950px;}
    #results-text{width:1100px;}
    #about {width:900px;}
    a#clipboard {right:1050px}
}

@media (min-width:1600px) {
    #ship {margin-top:-140px;}
}

@media (min-width:1700px) {
    #ship {margin-top:-130px;}
}

@media (min-width:1800px) {
    #ship {margin-top:-120px;}
}

@media (min-width:2000px) {
    #ship {margin-top:-90px;}
}