/* Cascading Style Sheet      */
/* http://gregagogo.com general styles*/
/* 5 October 2013 [td]             */
/* Greg MacLaurin                */

/* General Styles */


*		{
		padding: 0;
		margin: 0;
}

p		{margin: 1em 0;}
img		{border-style: none;}
li 		{list-style-type: none;}

/* End General Styles */

/* Shell Styles */

body		{
		background-color:  #ffffff;
		color:  #000000;
		font-family: Verdana, Arial, sans-serif;
		height: 100%;
}

#container	{
		position: relative;
		height: 100%;
}

/* End Shell Styles*/

/* Content Styles */

#content-main	{
		position: relative;
		float: left;
		clear: both;
		width: 100%;
		border-top: 1px solid transparent;
}

/* End Content Styles */

/* "Home" page Styles*/

#ggg #content-main	{
		height: 480px;
}

#ggg #chocolate-box	{
		position: relative;
		clear: left;
		margin: 60px auto 20px auto;
		width: 720px;
		height: 460px;
		font-size: medium;
		list-style-type: none;
		color: #cccccc;
		border: #c0c0ff none 1px ;
}

#ggg #chocolate-box li {
		position: absolute;
		width: 110px;
		height: 110px;
}

#ggg #chocolate-box #cb3	{top: -30px; left: 280px; height: 330px; width: 180px; background: #ffffff url(gggtextj.png) no-repeat; }

#ggg #chocolate-box #cb1	{top: 0px; left: 10px;    background: url(ggb11na.png) no-repeat;} /* Fall */
#ggg #chocolate-box #cb2	{top: 0px; left: 160px;   background: url(ggb12na.png) no-repeat;} /* Storytelling */
#ggg #chocolate-box #cb4	{top: 0px; left: 480px;   background: url(ggb14a.png) no-repeat;} /**/
#ggg #chocolate-box #cb5	{top: 0px; left: 620px;   background: url(ggb15a.png) no-repeat;} /**/
#ggg #chocolate-box #cb6	{top: 150px; left: 10px;  background: url(ggb21a.png) no-repeat;} /**/
#ggg #chocolate-box #cb7	{top: 150px; left: 160px; background: url(ggb22a.png) no-repeat;} /* Dark Rides */
#ggg #chocolate-box #cb9	{top: 150px; left: 480px; background: url(ggb24a.png) no-repeat;} /* Blog of Wonders*/
#ggg #chocolate-box #cb10	{top: 150px; left: 620px; background: url(ggb25a.png) no-repeat;} /**/
#ggg #chocolate-box #cb11	{top: 300px; left: 10px;  background: url(ggb31a.png) no-repeat;} /**/
#ggg #chocolate-box #cb12	{top: 300px; left: 160px; background: url(ggb32a.png) no-repeat;} /* Halloween */
#ggg #chocolate-box #cb13	{top: 300px; left: 320px; background: url(ggb33na.png) no-repeat;} /* Who */
#ggg #chocolate-box #cb14	{top: 300px; left: 480px; background: url(ggb34na.png) no-repeat;} /* Art */
#ggg #chocolate-box #cb15	{top: 300px; left: 620px; background: url(ggb35a.png) no-repeat;} /**/
#ggg #chocolate-box #cb16	{top: 450px; left: 10px;  background: url(ggb41a.png) no-repeat;} /**/
#ggg #chocolate-box #cb17	{top: 450px; left: 160px; background: url(ggb42a.png) no-repeat;} /**/
#ggg #chocolate-box #cb18	{top: 450px; left: 320px; background: url(ggb43a.png) no-repeat;} /**/
#ggg #chocolate-box #cb19	{top: 450px; left: 480px; background: url(ggb44a.png) no-repeat;} /**/
#ggg #chocolate-box #cb20	{top: 450px; left: 620px; background: url(ggb45a.png) no-repeat;} /**/

#ggg #chocolate-box a {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		color: #000000;
		text-indent: -10000px;
}

#ggg #chocolate-box a:hover {text-indent: 0px;}

/* End "Home" page Styles */

/* "Who?" Page Styles */

#gggwho {
		background-color:  #272727;
		color:  #9999DD;
}

#gggwho #gergintro	{
		text-align: left;
		font-size: large;
		width: 30em;
		margin: 7em 0 0 2em;
}

#gggwho #gergintro *	{
		display: block;
		position: relative;
		line-height: 1.2em;
		width: 10em;
}

#gggwho #gergintro #biggerg	{
		font-size: 500%;
		width: 5em;
		margin-top: -.2em;
}

#gggwho #gergintro #biggerg *	{
		display: inline;
		font-size: x-large;
}

#gggwho #gergintro #mail {margin-top: 1em;}
#gggwho #gergintro #as {left: 1em;}
#gggwho #gergintro #gerg {left: 2em;}
#gggwho #gergintro #or {left: 4em;}
#gggwho #gergintro #greg {left: 4.5em;}
#gggwho #gergintro #at {left: 7em;}

#sitenotes	{
		float: left;
		clear: left;
		width: 40em;
		height: 30em;
		margin: 5em 0 0 2em;
}

#sitenotes #copyright	{
		width: 30em;
		height: 11em;
		margin-bottom: 4em;

}
#sitenotes #copyright a	{text-decoration: none;}
#sitenotes #copyright #ccgreg * {display: block; margin-left: 1em;}
#sitenotes #copyright #cclic {
 		font-size: x-small;
		width: 28em;
		color:  #9999DD;
		padding: 0;
}
#sitenotes #copyright #cclic a{	color:  #9999dd;}
#sitenotes #copyright #cclic a:hover {	color:  #ccccff;}
#sitenotes #copyright img {
		float: left;
		margin: 0 .5em 0 0;
		padding: 0;
		width: 	88px;
		height: 31px;
}
#sitenotes #copyright #ncar {}

#sitenotes #timcredit	{
		width: 30em;
		font-size: small;
}

#sitenotes #colorcredit	{
		margin-top: .5em;
		width: 30em;
		font-size: small;
}
#sitenotes #colorcredit	span {display: block; margin-left: 1em;}
#sitenotes #colorcredit a{color:  #9999dd; text-decoration: none;}
#sitenotes #colorcredit a:hover {color:  #ccccff; font-weight: bold;}

/* End "Who?" page Styles */

/* "Storytelling" Pages Styles */
.storypage {
		height: 100%;
		color: #442200;
		background-color: #64b9fa;
}

.storypage #content-main	{
		position: absolute;
		left: 50%;
		width: 32em;
		margin-left: -16em;
		height: 100%;
		background-color: #ffffff;
		color: #442200;
}

.storypage #gradl {
		position: absolute;
		top: 0;
		left: -36px;
		height: 100%;
		width: 36px;
		background: url(gradl.jpg) repeat-y;
}

.storypage #gradr {
		position: absolute;
		top: 0;
		right: -36px;
		height: 100%;
		width: 36px;
		background: url(gradr.jpg) repeat-y;

}

.storypage #story {
		position: relative;
		width:30em;
		margin: 9em auto 2em;
}

.storypage #story h1 {
		width: 100%; 
		text-align: center;
		margin-bottom: 1em;
}

.storypage #story h1 span {white-space: nowrap;}

.storypage #storynav {
		position: absolute;
		width: 100%;
		margin: 10px auto;
		bottom: 2em;

}

.storypage #storynav li {
		position: absolute;
		font-size: large;
}

.storypage #storynav #snh { width: 5em; left: 1em; text-align: left;}
.storypage #storynav #sns { width: 8em; left: 10em; text-align: center;}
.storypage #storynav #snn { width: 11em; right: 1em; text-align: right;}

.storypage #storynav a {text-decoration: none; 	color: #442200;}
.storypage #storynav a:hover {font-weight: bold;}

#gggstories #content-main	{
		font-size: xx-large;
		width: 16em;
		margin-left: -8em;
}

#gggstories #content-main #st {
		visibility:hidden;
		position: relative;
		font-size: 180%;
		width: 7.3em;
		height: 2.2em;
		margin: 2em auto 0 auto;
}

#gggstories #s {
		position: absolute;
		top: .8em;
		left: .8em;
}

#gggstories #storyboard {
		position: relative;
		list-style-type: none;
		font-size: xx-large;
		z-index: 2;
}

#gggstories #storyboard a {text-decoration: none; color: #442200;}	
#gggstories #storyboard a:hover {font-weight: bold;}

#gggstories #storyboard	li {position: absolute;}

#gggstories #storyboard	#sb-ball {top: 1em; left: .5em;} 
#gggstories #storyboard #sb-tuesday {top: 3em; right: .5em;}

#gggstories #storyboard #sb-pretzel {display: none;}
#gggstories #storyboard	#sb-heaven {display: none;}
#gggstories #storyboard #sb-santa {display: none;}
#gggstories #storyboard	#sb-holywater {display: none;}
#gggstories #storyboard	#sb-sweater {display: none;}
#gggstories #storyboard	#sb-saltwater {display: none;}
#gggstories #storyboard	#sb-happiness {display: none;}
#gggstories #storyboard	#sb-newyork {display: none;}

.storypage #content-main	{
		height: 40em;
}

/* End "Storytelling" pages Styles */

/* "Art" Page Styles */

.artpage {
		background-color: #aa0000;
		color:#ffffff;
}

.artpage #artwork {
		position: relative;
		width: 50em;
		margin: 10px auto;
		padding: 4em 5%;
}

.artpage #artwork a {color:#ffffff;}
.artpage #artwork a:hover {color:#ffdddd;}

.artpage #artnav {
		position: absolute;
		font-size: large;
		height: 1em;
		width: 18em;
		left: 50%;
		margin-left: -9em;
		bottom: 1em;
}

.artpage #artnav li {
		position: absolute;
}

.artpage #artnav #anh { width: 5em; left: 0; text-align: left;}
.artpage #artnav #ans { width: 4em; left: 50%; margin-left: -2em; text-align: center;}
.artpage #artnav #ann { width: 7em; right: 0; text-align: right;}

.artpage #artnav a {text-decoration: none; color:#ffffff;}
.artpage #artnav a:hover {font-weight: bold;}

.artpage .sidebar {
		position:relative;
		padding: .5em;
		margin: 1em;
		background-color: #880000; 
		border: solid 2px #cc0000;
}

.artpage .sidebar p {margin: .5em;}

#gggart #content-main	{
		position: relative;
		font-size: 220%;
		height: 100%;
		width: 100%;
/*		background: url(surface-of-the-soup-e-w.jpg) no-repeat 50%; */
 		font-family: "lucida console", Verdana, Arial, sans-serif;
}

#gggart #content-main img	{
		position: relative;
		width: 100%;
}

#gggart #content-main h1 {
		position: absolute;
		width: 3.8em;
		top: 20%;
		left: 30%;
		font-size: 200%;
		line-height: 1em;
		text-align: left;
}

#gggart #al-phones	{
		position: absolute;
		bottom: 35%;
		right: 18%;
		width: 9em;
		padding: .1em;
		text-align: center;
}

#gggart #al-phones a {text-decoration: none; color:#ffffff;}
#gggart #al-phones a:hover {font-weight: bold;}

#gggphones #mpintro {
		position: relative;
		height: 388px;
		margin-bottom: 2.5em;
}


#gggphones #mpintro h1	{
		position: absolute;
		font-weight: normal;
		font-size: 300%;
		width: 10em;
		left: 320px;
		top: 0;
		margin-left: 0em;
}

#gggphones #mpintro img {
		position: absolute;
		left: 0;
		bottom: 0;
}

#gggphones #mpintro div {
		position: absolute;
		top: 3em;
		left: 320px;
		right: 0;
}

#gggphones #mpintro div p {
		margin-bottom: 0;
		margin-top: 2em;
}

#gggphones #description	{
		position: relative;
		width: 100%;
}

#gggphones #description h2	{
		font-size: x-large;
		margin-top: 1em;
}

#gggphones #jpt {
		float: right;
		margin: .5em 0 10px .5em;
}

#gggphones #jp1 {
		float: left;
}

#gggphones #jpb {
		float: right;
		clear: right;
		margin-left: 10px;
}

#gggphones #epilog {
		clear: left;
}

#gggphones .sidebar	{ 
		font-size: small;
		text-align: justify;
		padding: 0.8em;
}

#gggphones #boing	{
		width: 30%;
		margin-top: 3em;
}

#gggphones #maker	{
		float: left;
		width: 30%;
		margin-left: 7em;
}

#gggphones #make	{
		float: left;
		width: 26em;
		margin-left: 30%;
		margin-top: .25em;
		margin-bottom: 3em;
}

#gggphoneshow h1	{
		font-weight: normal;
		font-size: 250%;
		text-align: left;
}

#gggphoneshow #draftnotice {
		font-size: small;
		margin-top: .5em;
}
#gggphoneshow #draftnotice p {margin: 0;}
#gggphoneshow #intro {margin-top: 2em;}
#gggphoneshow #intro img {
		float: left;
		margin: 0 .75em 0em 0;
}
#gggphoneshow #intro strong {
		display: block;
		font-size: x-large;
		margin: 0 1em 2em 0;
}

#gggphoneshow .sidebar a {display:block}
#gggphoneshow .introlink {padding-left: 3em;}

#gggphoneshow #intro #jpt2 img {float: none;}

#gggphoneshow #intro #jpt2 span {
		display: block;
		float: left;
		width: 7em;
		margin: 0 0 1em 0;
}

#gggphoneshow #intro #jpt2 strong {
		position: relative;
		display: block;
		font-size: large;
		margin-top: 1em;
}

#gggphoneshow #materials {
		clear: both;
}
#gggphoneshow #materials ul {margin: .25em 0 1em 1em;}
#gggphoneshow #materials ol li {
		margin-left: 3.5em;
		list-style-type: decimal;
}

#gggphoneshow #procedure li {margin: 2em 0 .5em 0;}
#gggphoneshow #procedure li li {margin: .5em 0 .5em 1em;}

#gggphoneshow #step1 img{
		float: left;
		margin: 1em 1em .5em 0;
}


#gggphoneshow #step1 .sidebar {
		float: right;
		width: 20em;
		margin: 1em;
}

#gggphoneshow #step1 .sidebar ul li{
		list-style: square inside;
}

#gggphoneshow #mp3a {
		display: block;
		clear: left;
}

#gggphoneshow #step2 {clear: both;}
#gggphoneshow #step2 .sidebar {
		width: 90%;
		margin-left: 10%;
}

#gggphoneshow #step2c {
		position: relative;
		height: 350px;
}

#gggphoneshow #step2 #img6040s {
		float: right;
		margin-left: .5em;
}

#gggphoneshow #step2 #s2p1 {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		margin: 0;
		z-index: 4;
}
#gggphoneshow #step2 #s2p2 {
		position: absolute;
		left: 0;
		top: 250px;
		width: 200px;
		margin: 0;
		z-index: 4;
}
#gggphoneshow #step2 #img6043s {
		position: absolute;
		left: 0em;
		top: 2.5em;
		margin-left: 0;
		z-index: 3;
		border: solid 2px #aa0000; 
}
#gggphoneshow #step2 #img6054s {
		position: absolute;
		left: 210px;
		top: 2.5em;
		z-index: 2;
		border: solid 2px #aa0000; 
}
#gggphoneshow #step3 #img6020s {
		position: relative;
		left: 25em;
		margin-left: -200px
}
#gggphoneshow #step3 #s3p2 {
		position: relative;
		width: 400px;
		left: 25em;
		margin-left: -200px
}

#gggphoneshow #step3 .sidebar {
		width: 90%;
		margin-left: 10%;
}

#gggphoneshow #step3 #img6033s {
		float: right;
		margin: .5em 0 2em .5em;
}

#gggphoneshow #finish {
		clear: both;
}

#gggphoneshow #finish p {
		clear: both;
}

#gggphoneshow #finishsect2 p {
		padding-top: 1em;
}
#gggphoneshow #finish #img6079s {
		float: left;
		margin: 0 1em 2em 0;
}
#gggphoneshow #finish #img6088s, #img5984s {
		float: right;
		margin: 0 0 2em .5em;
}

#gggphoneshow #epilog {	
		clear: both;
		padding-top: .5em;

}

/* End "Art" page Styles */

/* "Ideas" Page Styles */

/* End "Ideas" page Styles */

/* "Rides" Page Styles */

.ridespage {
		background-color: #330044;
		color:#ffff00;
}

#gggrides #hpmap {	
		display: block;
		margin: 1em auto; 
}

/* End "Rides" page Styles */

/* "Blog of Wonders" Page Styles */

/* End "Blog of Wonders" page Styles */

/* "Events" Page Styles */

/* End "Events" page Styles */

/* "Halloween" Page Styles */
#ggghalloween {
		background-color:  #272727;
		color:  #ffffff;
}

#ggghalloween #content-main {
		width:90%;
		margin:2em 5%;
}

#ggghalloween #content-main h1 {
		clear: both;
		font-size:2.5em;
		color:#ff8f00;
}
#ggghalloween #content-main h2{
		clear: both;
		margin:2em 0 0.5em 0;
		color:#9999dd;
}
#ggghalloween #content-main #index a{
		margin:2em 0 0.5em 0;
		font-size:1.5em;
		font-weight: bold;
		color:#9999dd;
		text-decoration: none;
}
#ggghalloween #content-main h2 img{
		vertical-align:middle;
		margin-right:15px;
}
#ggghalloween #content-main  h3{
		clear: both;
		margin:2em 0 0.25em -1em;
		color:#ff8f00;
}
#ggghalloween #content-main #index{
		position:relative;
		display: block;
		height:250px;
		margin:1em 20px;
}
#ggghalloween #content-main #index li{
		position:absolute;
		display: block;
		height:72px;
		width: 30em;
}
#ggghalloween #content-main #index *{
		vertical-align:middle;
		color:#9999dd;
}
#ggghalloween #content-main #index  .li1{
		top:0px;
		left:0px;
} /*house*/
#ggghalloween #content-main #index .li2{
		top:60px;
		left:80px;
}/*jack*/
#ggghalloween #content-main #index .li2 img{
		margin-top:11px;
		margin-bottom:11px;
}/*jack*/
#ggghalloween #content-main #index .li3{
		top:120px;
		left:160px;
}/*skull*/
#ggghalloween #content-main #index .li4{
		top:180px;
		left:240px;
}/*sprite*/
#ggghalloween #content-main #index a{
		margin-left:15px;
}
#ggghalloween #content-main .intro{
		margin-bottom:70px;
}
#ggghalloween #content-main .listing{
		margin-left:50px;
}
#ggghalloween #content-main .listing p {
		margin:0.5em 0 0 0;
}
#ggghalloween #content-main .listing .schedule, 
#ggghalloween #content-main .listing .location {
		margin: 0.3em 0 0 0;
}
#ggghalloween #content-main .listing .schedule p,
#ggghalloween #content-main .listing .location p, 
#ggghalloween #content-main .listing .info p{
		margin:0.2em 0;
}
#ggghalloween #content-main  a {color:#ff8f00; background-color: transparent;}
/* End "Halloween" page Styles */



/* "Fall of the Pumpkin People" Page Styles */
.fpppage  {
/*		background-color: #1e82fe; */
		background-color: #4e4e4e;
		color: #ffffff;
}

.fpppage  #content-main {
		width:90%;
		margin:2em 5%;
		padding-bottom: 2em;
		font-family: Cambria, Georgia, Serif;
}
.fpppage  #content-main  a {color: #ffffff; background-color: transparent;}

#gggfpp  #content-main .masthead {
		position: relative;
		width: 550px;
		margin: auto;
}

#gggfpp #logo  {
	height: 900px; 
	width: 550px;
}

/*
#gggfpp #content-main  #column-right {
		position: relative;
		margin-left: 400px;
}
*/

#gggfpp #content-main  #info {
		position: relative;
		clear: both;
		padding-bottom: 2em;
}

.fpppage .intro  {
		color: black;
		font-size: 1.4em;
		margin-bottom:2em;
}
#gggfpp .intro {
		text-align: center;
}

#gggfpp #info li {
		list-style-type:circle;
		margin: 1em 0.5em;
}

#gggfpp #address  {
		display: block;
		margin:0 0 2em 0;
		padding-left: 2em;
}


#gggfppvisit #logo  {
		height:300px; 
		width:185px;
}

#gggfppvisit .intro {
		text-align: left;
}
#gggfppvisit #content-main {
		min-width: 500px;
}
#gggfppvisit #content-main  #column-right {
		position: relative;
		margin-left: 200px;
	    min-height: 300px;
		display: table-cell;
		vertical-align: middle;
		padding-left: 1em;
}

#gggfppvisit  #content-main .masthead {
		float: left;
		width: 185px;
}
#gggfppvisit #lower-area {
		clear:both;
		padding-top:1em;
}
#gggfppvisit #lower-area h3 {
		margin-top: 0.8em;
}

#gggfppvisit #content-main li {
		list-style-type:circle;
		margin: 0.2em 0 0.2em 2em;
}
#gggfppvisit #entry span{
		display: block;
		margin-left: 1em;
}

/* End "Fall of the Pumpkin People" page Styles */





