* {
  margin: 0;
  padding: 0;
}

html, body {
	margin:0; 
	padding:0; 
	background-position: center center;
	background-repeat:  no-repeat;
	background-attachment: fixed;
	background-size:  cover;
	/*overflow: hidden;*/
}

.visible{
	display: block;
}

.invisible{
	display: none;
}

.pointer{
	cursor: pointer;
}

.fancybox-inner {
	overflow: hidden !important;
}

#headerLogo{
	width: 90%;
	margin: 0 auto;
	background-image: url("../images/spongeLogo.png");
	background-repeat: no-repeat;
	background-size: 100%;
	margin-top: 15px;
	max-width: 639px;
	height: 161px;
}

#restrictedMarket{
	width: 100%;
	margin: 0 auto;
	background-image: url("../images/sponge_sorry_int_desk.png");
	background-repeat: no-repeat;
	background-size: 100%;
	margin-top: 15px;
	max-width: 786px;
	height: 300px;
}

#mainContent{
	position: relative;
	max-width:1100px;
	width: 100%;
	height:100%;
	margin:0 auto;
}

.startJelly{
	background-image: url(../images/spongeJellyfish.png);
    background-repeat: no-repeat;
    float: right;
    background-size: 100%;
    margin-top: -45%;
    margin-right: 4%;
    height: 285px;
    width: 129px;
}

.uploadJelly{
	background-image: url(../images/spongeJellyfish.png);
    background-repeat: no-repeat;
    float: right;
    background-size: 100%;
    margin-top: -65%;
    margin-right: 5%;
    height: 285px;
    width: 129px;
}

.startSponge{
	background-image: url(../images/spongeBob.png);
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 250px;
    width: 250px;
    height: 360px;
    margin-left: -5%;
    margin-top: -20%;
}

.uploadSponge{
	background-image: url(../images/spongeBob.png);
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 250px;
    width: 250px;
    height: 360px;
    margin-left: 5%;
    margin-top: -30%;
}

.ageGateParentSponge{
	margin-left: 10%;
    margin-top: -30%;
}

.ageGateParentJelly{
	margin-top: -48%;
    margin-right: 15%;
}

.ageGateThanksSponge{
	margin-top: -15%;
}

.ageGateThanksJelly{
}


@media (max-width:1100px)  {
	.startSponge{		
	    margin-left: 25%;
	    margin-top: 0px;
	}
	.startJelly{
	    margin-top: -350px;
    	margin-right: 30%
	}
	.uploadSponge{
		margin-left: 20%;
    	margin-top: -645px;
	}

}

@media (max-width: 970px){
	.ageGateParentSponge{
		margin-left: 10%;
    	margin-top: -615px;
	}
	.ageGateThanksSponge{
    	margin-top: -399px;
	}
}


@media (max-width:720px)  {
	.startSponge{		
		width:200px;
		margin-left: 15%;
	}

	.startJelly{
		margin-right: 20%;
	}

	#restrictedMarket{
	    width: 100%;
	    margin: 0 auto;
	    background-image: url(../images/sponge_sorry_int_mobile.png);
	    background-repeat: no-repeat;
	    margin-top: -30px;
	    max-width: 405px;
	    height: 460px;
	    background-size: 100%;
	}
}

@media(max-width: 640px){
	#headerLogo{

	}

	.uploadSponge{		
		margin-left: 5%;
		margin-top: -675px;
    	width: 200px;
	}

	#spongePics{
		margin-right: 5%;
	}
}

@media (max-width:500px)  {
	.startSponge{		
		width: 150px;
    	margin-left: 5%;
	}

	.startJelly{
		margin-right: 15%;
		width:85px;
	}

	.ageGateParentSponge{
    	margin-top: -550px;
	}
	.ageGateThanksSponge{
    	margin-top: -311px;
	}
}

@media (max-width:520px)  {
	.uploadSponge{		
    	margin-left: 5%;
    	margin-top: -550px;
    	width: 150px;
	}
	#spongePics{
		margin-right: 5%;
    	width: 175px;
	}
}

@media (max-width:400px)  {

	#headerLogo{
		height:100px;
	}

	.uploadSponge{		
    	width:120px;
    	margin-top: -475px;
	}
	#spongePics{
		width:150px;
	}
	.ageGateParentSponge{
    	/*margin-top: -520px;*/
	}
}

/*------------------LANDING------------------------------------*/
#landingDiv{
	/*position: absolute;*/
	width:100%;
	margin-top: 3%;
	margin-bottom: 5%;
	color:#3f215d;
	display: none;
}
#landingStart{
	font-family: P22NudgewinkBold;
	letter-spacing: 1.5px;
	max-width:82vw;
	font-size: 26px;
	margin: 0 auto;
	margin-bottom:20px;
}
#landingPrompt{
	max-width:77vw;
	margin: 0 auto;
	font-family: FranklinGothicCondensed;
	font-size: 18px;
	text-align: center;
	-moz-text-align-last: center;
    text-align-last: center;
    margin-bottom:40px;
}
#landingButtons{
	margin: 0 auto;
	max-width:400px;
	text-align: center;
}
#landingButtonsPrompt{
	font-family: P22NudgewinkBold;
	letter-spacing: 1.5px;
	max-width:630px;
	font-size: 32px;
	margin: 0 auto;
	margin-bottom:20px;
}

#landingBtnList li{
	list-style-type: none;
	padding-bottom: 5px;
}

#landingButton{
	-moz-user-select: -moz-none;
	user-select: none;
	padding-top: 30px;
	padding-bottom: 30px;
	font-size: 24px;
	width:300px;
	margin: 0 auto;
}

#landingShare{
	margin: 0 auto;
	max-width:400px;
	text-align: center;
}

#landingSharePrompt{
	font-family: P22NudgewinkBold;
	letter-spacing: 1.5px;
	max-width:630px;
	font-size: 32px;
	margin: 0 auto;
	margin-bottom:20px;
}

#landingShareButtonsPrompt{
	font-family: P22NudgewinkBold;
	letter-spacing: 1.5px;
	color:#727cc7;
	max-width:200px;
	font-size: 20px;
	margin: 0 auto;
	margin-top:20px;
	margin-bottom:20px;
}

#landingShareFB, #landingShareTwitter, #landingShareInsta{
	background-repeat: no-repeat;
	background-size: 100%;
	width: 42px;
	height: 42px;
	display:inline-block;
	cursor: pointer;
	user-select: none;
}

#landingShareFB{
	background-image: url("../images/spongeShareFB.png");
}

#landingShareTwitter{
	margin-left: 5px;
	background-image: url("../images/spongeShareTwitter.png");
}

#landingShareInsta{
	background-image: url("../images/spongeShareInsta.png");
}

@media (max-width:1100px)  {
	#landingButtons{		
		margin-top: 400px;
	}
}


@media (min-width:620px)  {
	#landingStart, #landingPrompt{		
		max-width:600px;
	}
}

@media (max-width:640px)  {
	#landingStart{
		width:90vw;
		font-size:4.55vw; 
	}
}

@media (max-width: 520px){
	#landingButtons{
		margin-top: 300px;
	}
}

@media (max-width:400px)  {
	#landingPrompt{
		max-width:86vw;
	}

	#landingButtons{		
		margin-top: 225px;
	}
}

/*------------------AGE GATE------------------------------------*/
#ageGate{
    /*position: absolute;*/
    font-family: P22NudgewinkBold;
    letter-spacing: 1.5px;
    width: 100%;
    margin-top: 10%;
    display: inline-block;
    margin-bottom: 5%;
    /* display: none; */
}

#ageGatePrompt{
	max-width:361px;
	margin: 0 auto;
	font-size: 9vw;
}

#ageGateButtons{
	margin: 0 auto;
	max-width:400px;
	text-align: center;
}

#ageGateYes, #ageGateNo{
	-moz-user-select: -moz-none;
	user-select: none;
	display: inline;
	width:121px;
	padding: 10px 50px;
}

#ageGateBtnList li
{
	display: inline;
	list-style-type: none;
	padding-right: 20px;
}

@media(min-width: 1110px){
	
}

@media (min-width:440px)  {
	#ageGate{

	}
	#ageGatePrompt{
		font-size: 41px;
	}
}

/*------------------AGE GATE PARENT INFO------------------------------------*/

#ageGateParentInfo{
	/*position: absolute;*/
	font-family: FranklinGothicCondensed;
	width:100%;
	color: #3f215d;
	margin-top: -7%;
	margin-bottom: 5%;
	display: none;
}

#ageGateParentPrompt{
	max-width:82vw;
	margin: 0 auto;
	font-size: 18px;
	text-align: justify;
	-moz-text-align-last: center;
    text-align-last: center;
}

#ageGateParentInputs{
	margin: 0 auto;
	max-width:400px;
	text-align: center;
}

#ageGateParentName{
	margin-bottom: 30px;
}

#ageGateParentEmail{
	margin-bottom: 40px;
}

#ageGateChildNameValue, #ageGateParentEmailValue{
	margin-top: 10px;
	height:45px;
	padding:0 40px;
}

#ageGateParentSubmit{
	-moz-user-select: -moz-none;
	user-select: none;
	display: inline;
	width:121px;
	padding: 20px 50px;
}

@media (min-width:440px)  {
	#ageGateParentInfo{
		margin-top: 7%;
	}

	#ageGateParentPrompt{
		max-width:360px;
	}
}

@media (max-width:969px)  {
	#ageGateParentInputs{
		margin: 310px auto 0 auto;
	}
}

@media (max-width:400px)  {
	#ageGateParentPrompt{
		margin-top: 40px;
		max-width: 92vw;
		margin-bottom: -40px;
	}

	#ageGateParentInputs{
		margin-top: 260px;
		padding-bottom: 50px;
	}
}
/*------------------AGE GATE THANKS------------------------------------*/

#ageGateThanks{
	/*position: absolute;*/
	font-family: FranklinGothicCondensed;
	width:100%;
	color: #3f215d;
	margin-top: 7%;
	margin-bottom: 5%;
	text-align: center;
	display: none;
}

#ageGateThanksStart{
	font-family: P22NudgewinkBold;
	letter-spacing: 1.5px;
	max-width:360px;
	font-size: 41px;
	margin: 0 auto;
	margin-bottom:20px;
}

#ageGateThanksPrompt{
	max-width:84vw;
	margin: 0 auto;
	font-family: FranklinGothicCondensed;
	font-size: 19px;
	text-align: justify;
	-moz-text-align-last: center;
    text-align-last: center;
    margin-bottom:40px;
}

#ageGateThanksEnd{
	font-family: P22NudgewinkBold;
	letter-spacing: 1.5px;
	max-width:400px;
	font-size: 32px;
	margin: 0 auto;
}

@media (min-width:440px)  {
	#ageGateThanksPrompt{
		max-width:370px;
	}
}

@media (max-width: 1100px) {
	#ageGateThanksEnd {
		margin-top: 333px;
	}
}

@media (max-width:969px)  {
	#ageGateThanksStart{
		margin-top: -40px;
	}

	#ageGateThanksEnd{
		margin-top: 345px;
	}
}

@media (max-width: 500px) {
	#ageGateThanksEnd{
		margin-top: 250px;
	}
}
/*------------------INPUT THANKS------------------------------------*/

#inputThanks{
	/*position: absolute;*/
	width:100%;
	margin-top: -12%;
	margin-bottom: 5%;
	color:#3f215d;
	display: none;
}

#inputThanksSpongeHeart{
	width:100%;
	margin: 0 auto;
	background-image: url("../images/spongeHeart.png");
	background-repeat: no-repeat;
	background-size: 100%;
	max-width: 261px;
	height: 195px;
}

#inputThanksStart{
	font-family: P22NudgewinkBold;
	letter-spacing: 1.5px;
	color:#727cc7;
	max-width:620px;
	font-size: 11vw;
	margin: 0 auto;
	margin-bottom:20px;
	margin-top: 15px;
}

#inputThanksPrompt{
	max-width:82vw;
	margin: 0 auto;
	font-family: FranklinGothicCondensed;
	font-size: 19px;
	text-align: justify;
	-moz-text-align-last: center;
    text-align-last: center;
    margin-bottom:40px;
}

#inputThanksShare{
	margin: 0 auto;
	max-width:630px;
	text-align: center;
}

#inputThanksAd{
	font-family: P22NudgewinkBold;
	letter-spacing: 1.5px;
	color:#fb5e21;
	width:100%;
	font-size: 32px;
	margin: 0 auto;
	margin-bottom:20px;
	margin-top: 125px;
}

@media (min-width:440px)  {
	#inputThanks{
		margin-top: 3%;
	}

	#inputThanksStart{
		font-size: 50px;
	}

	#inputThanksPrompt{
		max-width: 432px;
	}

	#inputThanksAd{
		max-width: 680px
	}
}

@media (max-width:440px){
	#inputThanksSpongeHeart{
		margin-top: 45px;
	}

	#inputThanksAd{
		margin-top: 40px;
	}

	#inputThanksPrompt{
		max-width: 92vw;
	}
}
/*------------------GENERAL/RESPONSIVE CLASSES------------------------------------*/

.spongeBtn {
  	-webkit-border-radius: 5;
  	-moz-border-radius: 5;
  	font-family: P22NudgewinkBold;
  	letter-spacing: 1.5px;
  	letter-spacing: 1.5px;
  	border-radius: 5px;
  	color: #ffffff;
  	font-size: 18px;
  	background: #727cc7;
  	padding: 10px 20px 10px 20px;
  	text-decoration: none;
  	text-align: center;
  	user-select: none;
}

.spongeBtn:hover {
	background: #3f215d;
	text-decoration: none;
	cursor: pointer;
}

.spongeInput {
     padding: 5px;
     font-size: 16px;
     border-width: 2px;
     border-color: #521675;
     background-color: #FFFFFF;
     color: #521675;
     border-style: solid;
     border-radius: 5px;
     box-shadow: 0px 0px 5px rgba(66,66,66,.75);
     text-shadow: undefined 0px 0px 5px px rgba(66,66,66,.75);
}
 .spongeInput:focus {
     outline:none;
}

.yellowFont{
	color: #b69034;
}

/*------------------i hate sand it's coarse and rough and gets everywhere.------------------------------------*/
#spongeSand{
	width: 100%;
	margin: 0 auto;
	background-image: url("../images/spongeSand.png");
	background-position: center top ;
	background-repeat:  no-repeat;
	background-size:  cover;
	max-width: 100%;
	height: 654px;
	position: absolute;
	
	z-index:-999999999999999;
}

/*------------------FONTS------------------------------------*/
/*@font-face {
	font-family: P22NudgewinkBold;
	src: url("../fonts/P22 Nudgewink Pro/otf/P22Nudgewink-Bold.otf");
}*/
@font-face {
  font-family: 'P22NudgewinkBold';
  src: url('../fonts/P22Nudgewink-Bold.eot'); /* IE9 Compat Modes */
  src: url('../fonts/P22Nudgewink-Bold.eot??#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/P22Nudgewink-Bold.woff') format('woff'), /* Modern Browsers */
       url('../fonts/P22Nudgewink-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/P22Nudgewink-Bold.svg#P22Nudgewink-Bold') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  normal;
}
/*
@font-face {
	font-family: FranklinGothicCondensed;
	src: url("../fonts/Franklin Gothic Std Condensed.otf");
}*/

@font-face {
    font-family: 'FranklinGothicCondensed';
    src: url('../fonts/FranklinGothicStd-Condensed.eot');
    src: url('../fonts/FranklinGothicStd-Condensed.eot?#iefix') format('embedded-opentype'),
         url('../fonts/FranklinGothicStd-Condensed.woff') format('woff'),
         url('../fonts/FranklinGothicStd-Condensed.ttf') format('truetype'),
         url('../fonts/FranklinGothicStd-Condensed.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}