/* ==================================== */
/* == ELEMENT ATTRIBUTES FOR SCREENS == */
/* ==================================== */

/* General Elements */
		
body {
	margin-bottom: 70px;
	color: #3d4972;
	background-image: url(../../images/diamond.gif);
	}
	h3 {
		color: #7A1F80;
		width: 390px;	
		/* REM height: .6em; */
		}	
	/* Share */
	a:hover, a.share {
		text-decoration: none;
		}
		a.share img {
			position: relative;
			top: 3px;
			}				
	a.share:hover {
		text-decoration: underline;
		}	
	span.reg {
		position: relative;
		top: -3px;
		font-size: 70%;
		}
	small {
		font-size: 11px;
		}	
	fieldset.header {
		margin: 0 0 15px 0;
		padding: 0 0 15px 0;
		border-left: 0;
		border-right: 0;
		border-top: 0;
		color: #3d4972;
		}		
	legend.header { /* EDITED IN IE7 CSS */
		margin-bottom: 10px;
		font-size: 1.2em;
		font-weight: bold;
		color: #3d4972;
		}			
	fieldset.single {
		display: inline;			
		width: 195px;
		margin-right: 15px;
		margin-bottom: 5px;
		padding: 0;		
		border: none;
		color: #3d4972;
		}		
		fieldset.single input {
			width: 195px;				
			}
		fieldset.single select {
			width: 199px;
			}
	fieldset.double {
		clear: both;
		width: 410px;
		margin-bottom: 5px;			
		padding: 0;
		border: none;
		color: #3d4972;
		}
		fieldset.double input {
			width: 408px;
			}			 
		fieldset.double textarea {
			width: 410px;
			height: 80px;
			}
	fieldset.multiple {			
		clear: both;
		width: 390px;
		margin-top: 10px;					
		padding: 10px;
		border: 1px solid #ccc;
		color: #3d4972;
		}
	fieldset fieldset {
		width: auto !important;
		}	
	.required {
		clear: both;
		/* REM margin-top: 15px; */
		}
	.submit {				
		clear: both;
		margin-top: 15px;
		margin-bottom: 15px;
		}	
	label.error {
		display: block !important;
		float: none !important;		
		width: auto !important;
		margin: 0 !important;
		color: red;
		}
	label small {
		text-decoration: underline;
		}
	label small:hover {
		text-decoration: none;
		}
	#error_output {
		/* display: none; Set on page - required by third-party tool - shown via JavaScript */
		margin: 2px 0;
		padding: 10px;
		background: #df8080;
		border: 1px solid #ffffff;		
		}
	/* Pseudo pop-ups */	
	.popup {		
		display: none; /* Hide be default */
		position: absolute;
		width: 200px;
		height: 200px;
		padding: 20px;			
		background-color: white;				
		border: 1px solid #666;
		}
	.popup.active {
		display: block;
		}
	/* Guest judges (bloggers) */
	div.judge-profile {		
		padding: 15px;
		margin-bottom: 15px;
		border: 1px solid #eee;
		}
		div.judge-profile h4 {
			margin-bottom: 5px;
			}
		div.judge-profile p {
			margin-bottom: 0;
			}
		div.judge-profile a {
			display: block;
			margin-bottom: 5px;
			}
		
/* Specific Elements */

div#main {
	position: relative;	
	top: -1px; /* Bug fix for Firefox and Opera that prevents content from moving to top of its container */
	width: 800px;
	min-height: 500px;
	margin: 0 auto 20px auto;	
	background-image: url(../../images/shadow.png); /* EDITED IN IE 6 CSS */
	background-repeat: repeat-y;
	border-top: 1px solid transparent; /* Bug fix for Firefox and Opera that prevents content from moving to top of its container */
	}
	/* Content */
	div#content {
		position: relative;
		top: -1px; /* Bug fix for Firefox and Opera that prevents content from moving to top of its container */
		width: 780px;
		height: auto;		
		margin-left: 16px;
		background: #60d0e4 url(../../images/bg_vertical-tile.jpg) repeat-y;	
		border-top: 1px solid transparent; /* Bug fix for Firefox and Opera that prevents content from moving to top of its container */
		}
		#rowNext, #rowPrevious {
			margin-bottom: 20px;
			}
		/* Header graphic */
		div#content h1.logo {
			position: relative;
			top: -1px; /* Bug fix for Firefox and Opera that prevents content from moving to top of its container */
			width: 781px;
			height: 201px;
			margin: 0;
			padding: 0;
			background: transparent url(../../images/header.jpg) no-repeat;
			border-top: 1px solid transparent; /* Bug fix for Firefox and Opera that prevents content from moving to top of its container */
			}
			/* Put a Face on Fun logo */
			div#content h1.logo a {
				display: block;
				margin: 0 0 0 21px;
				width: 350px;
				height: 147px;
				text-indent: -100000px; /* Hide backup text */
				text-decoration: none;
				background: transparent url(../../images/logo-put-a-face-on-fun.jpg) no-repeat;				
				}			
		/* Balloon Time logo */
		div#content h2.logo {
			position: absolute;
			top: 0px;
			left: 660px;			
			}
			div#content h2.logo a {		
				display: block;		
				width: 191px;
				height: 151px;	
				text-indent: -10000px;		
				background: transparent url(../../images/logo-balloontime.gif) no-repeat; 
				}	
		/* Feature */
		div#feature {
			position: absolute; 
			top: 86px; 
			left: 294px;
			}
				
		/* Main content */
		div#principle {
			position: relative;
			top: -22px;	/* HOME PAGE ONLY - EDITED DYNAMICALLY SERVER-SIDE top: 45px; */	
			left: 12px;			
			z-index: 4; /* Use (with position) so that this element appears above edge of footer */
			line-height: 150%;
			/* HOME PAGE ONLY - EDITED DYNAMICALLY SERVER-SIDE width: 500px; */
			width: 419px;
			height: auto; /* EDITED IN IE 6 CSS */	
			min-height: 560px; /* Set to approximate height of images that float right - this is due to navigation being absolutely positioned - IE 6 EDIT */
			margin: 10px 0 0 270px;
			}			
			div#principle a {
				color: #3d4972;
				}
			
			/* ~~~~~~~~~~~~~~ */
			/* Home Page ONLY */
			/* ~~~~~~~~~~~~~~ */
			div#principle div.home {
				position: relative;
				z-index: 2;
				margin-bottom: 0;
				}					
				/* Spacers for Miranda photo - emulates wrapping text */	
				div#principle div.spacer {
					clear: right;
					float: right;	
					}
				div#principle div#spacer-1 {						
					width: 1px;
					/* REM GML height: 120px; */
					height: 1px;
					}
				div#principle div#spacer-2 {
					width: 80px;
					height: 140px;
					}
				div#principle div#spacer-3 {
					width: 110px;
					height: 100px;
					}
				div#principle div#spacer-4 {
					width: 165px;
					height: 170px;
					}
				/* Photo shoot button */
				div#button-photo-shoot {
					position: relative;
					top: 15px;
					width: 200px;
					overflow: visible;
					}
					div#button-photo-shoot a {
						display: block;
						width: 248px;
						height: 79px;						
						text-indent: -10000px;
						background: transparent url(../../images/button-mirando-photo-shoot.gif) no-repeat;
						}
				/* Miranda photo (home page) */
				div#miranda {
					position: absolute;
					z-index: 1;
					bottom: -65px;
					left: 253px;
					width: 350px;
					height: 537px;
					background: transparent url(../../images/photo-miranda-w-box.gif) no-repeat; 
					}		
			/* ~~~~~~~~~~~~~~ */
			/* ~~~~~~~~~~~~~~ */
			
			/* Dates on Tour Schedule page */
			p.date {
				width: 180px;
				min-height: 90px; /* EDITED IN IE 6 CSS */
				float: left;
				margin: 0 20px 10px 0;		
				}
			/* Thumbnail images for galleries */
			span.thumbnail {
				position: relative;
				display: block;
				float: left;
				width: 190px;
				height: 143px;
				margin: 0 10px 35px 0;
				background-repeat: no-repeat;
				border: 1px solid #FFF;				
				}
				span.thumbnail input.vote {
					position: absolute;
					right: 0px;
					top: 149px;
					}			
			div#thumbNavigation {
				clear: both;
				}
				div#rowNext {
					float: right;
					margin-right: 25px;
					}
				div#rowPrevious {
					float: left;
					}
			/* Detail gallery images */
			div.photo_detail {
				position: relative;
				margin-bottom: 30px;
				border: 1px solid #FFF;
				}
				div.photo_detail img {
					display: block;
					}
				div.photo_detail p {
					position: absolute;
					left: 0px;
					bottom: 0px;	
					margin-bottom: -30px;
					}
				div.photo_detail input.vote {
					position: absolute;
					right: 0px;
					bottom: 0px;	
					margin-bottom: -30px;								 
					}
			/* Upload form */
			label {				
				float: left;
				margin: 0 10px 10px 0;
				color: #3d4972;
				}
				label input {
					width: 195px;
					}
			label.wbutton, label.checkbox {
				display: block;
				float: none;
				clear: left;
				margin-bottom: 10px;
				}
			label.radio {						
				}			
				label.wbutton input, label.checkbox input, label.radio input {
					width: auto;
					}
				label.checkbox input {
					float: left;
					margin: 0 5px 5px 0;
					}
			fieldset {
				clear: left;				
				}
				legend {			
					color: #3d4972;					
					}			
			div.submit {
				clear: both;
				margin-top: 10px;
				}
				
			/* Administration approval page photos ONLY */
			h5.approvecontent {
				padding: 3px;
				color: #000;
				background-color: #FFF;
				}
			div.approvecontent {
				border: 1px solid #FFF;
				margin-bottom: 20px;
				padding: 20px;
				}
				div.approvecontent img {
					width: 190px;
					height: 143px;					
					border: 1px solid #FFF;
					}
				fieldset.approvecontent { /* EDITED IN IE 7 CSS */
					float: right;				
					}
				p.jump {
					float: right;
					}	
							
		/* Footer */
		div#footer {	
			position: relative;
			z-index: 3;							
			width: 780px;
			height: 159px;
			margin-top: -65px;				
			}
			div#footer div.left {
				position: absolute;		
				top: 0px;	
				left: -50px;
				width: 315px;
				height: 159px;
				background-image: url(../../images/balloons_left.gif);
				}
			div#footer div.right {
				position: absolute;
				top: 18px;
				left: 480px;
				width: 419px;
				height: 141px;
				background: transparent url(../../images/photo-balloons-7.png) no-repeat; /* EDITED IN IE 6 CSS */			
				}			
	/* Navigation */
	div#navigation {
		/* REM
		font-size: .9em;
		font-weight: bold;
		*/
		}
		ul.primary, ul.footer {				
			margin: 0;
			padding: 0;
			list-style-type: none;
			}
			ul.primary li, ul.footer li {			
				margin: 0;
				padding: 0;
				}
				ul.primary li a, ul.footer a {
					color: #FFF;
					text-decoration: none;
					}		
		/* Primary navigation */
		div#mainnav /* formerly ul.primary */ {
			position: absolute;
			top: 201px;
			left: 16px;
			width: 250px;
			height: 409px;
			overflow: visible; /* Allows "Get Started" button to overflow */
			margin: 0;
			padding: 0;
			background: #60d0e4 url(../../images/sidebar.jpg) no-repeat; /* EDITED IN IE 6 CSS */
			}
			a.homelink {
				margin-left: -15px;
				}
			
			/* Spring code - Alex */
			/* <ul> */
			div#mainnav ul {
				width: 200px;
				margin: 0;
				padding: 0;
				padding-left:20px;
				padding-top:20px;
				text-indent: 12px;
				list-style-type: none;				
				}	
				/* <li> */
				div#mainnav ul li {
					display: block;
					margin: 0;
					padding: 0 0 10px 0;
					}			
				/* <li class="active"> */
				#mainnav ul li.active {
					font-weight: bold;
					}			
					/* <li><a> */
					#mainnav ul li a {
						display: block;
						width: auto;
						height: 21px; /* 21px height + 5px padding-top = 26px total height - EDITED IN IE 5.5 CSS */
						overflow: hidden;
						padding: 6px 12px 0px 12px;
						color: #fff;
						font-size: 12px;
						line-height: 17px;					
						background-repeat: no-repeat;
						background-image: url(../../images/navigation/btn_purple_normal.gif);
						}
						
						/* ~~~~~~~~~~~~~~~~~~~~~~~~~ */
						/* CUSTOM NAVIGATION BUTTONS */
						/* ~~~~~~~~~~~~~~~~~~~~~~~~~ */
						#mainnav ul li#button-balloontime a {	
							width: auto;						
							height: 64px;
							margin-top: 12px;							
							text-indent: -100000px;
							background-image: url(../../images/navigation/btn_balloontime_com.gif);
							}
						#mainnav ul li#button-upload a {								
							display: none; /* HIDE TEMPORARILY */
							position: relative;
							left: -5px;
							width: 265px;						
							height: 141px;
							margin-top: 28px;
							text-indent: -100000px;
							background-image: url(../../images/navigation/btn_green_upload.gif);
							}
						#mainnav ul li#button-share a {
							position: absolute;
							top: -177px;
							left: 578px;
							width: auto;
							height: auto;
							padding: 0;
							background-image: none;
							text-indent: 0;
							}
						#mainnav ul li#button-email a {	
							display: none; /* Replaced with Facebook share 8/30/10, GML per KT */
							position: absolute;
							top: -181px;
							left: 505px;
							width: 135px;						
							height: 26px;
							text-indent: -100000px;
							background-image: url(../../images/navigation/btn_email_this_page.gif);
							}
						li#button-email {
							display: none; /* Hidden by default - requires JavaScript to function so shown via JavaScript */
							}
						/* ~~~~~~~~~~~~~~~~~~~~~~~~~ */
						/* ~~~~~~~~~~~~~~~~~~~~~~~~~ */
						
					#mainnav ul li a:hover { 
						color: #faa6fa; 
						background-image: url(../../images/navigation/btn_purple_normal_over.gif);
						}	
					#mainnav ul li.orange a:hover { 
						color: #faa6fa; 
						background-image: url(../../images/navigation/btn_orange_normal_over.gif);
						}	
						#mainnav ul li.balloontime a:hover{
							background-image: url(../../images/navigation/btn_balloontime_com.gif);
							height:64px;
						}						
					/* <li class="active"><a> */
					#mainnav li.active a {
						color: #fff;
						background-repeat: no-repeat;
						background-image: url(../../images/navigation/btn_purple_normal_over.gif);
						}
					#mainnav li.active a:hover { 
						color: #faa6fa; 
						}									
						/* Subnavigation */						
						/* <ul> */
						#mainnav .subnav ul {
							width: 180px; /* EDITED IN IE 5.5 CSS */
							padding: 0 0 0 10px;
							background-repeat: repeat-y;
							background-image: url(../../images/navigation/sub_nav_bg_middle.gif);
							background-position: 10px 0;
							}						
							/* <li> */
							#mainnav .subnav ul li {
								display: block;
								font-weight: normal;
								margin: 0;
								padding: 0;								
								background-image: none;
								}
							#mainnav .subnav ul li.last {
								padding-bottom: 10px;								
								background-image: url(../../images/navigation/sub_nav_bg_bottom.gif);
								background-repeat: no-repeat;
								background-position: 0px bottom;
								}						
							/* <li class="active"> */
							#mainnav .subnav ul li.active {
								font-weight: bold;
								}						
								/* <li><a> */
								#mainnav .subnav ul li a {
									color: #ac7d1a;
									display: block;
									height: 100%;
									margin: 0 1px;
									padding: 5px 8px 5px 8px;
									background-image: none !important;
									border-bottom: 1px #c89f11 dotted;
									}
								#mainnav .subnav ul li a:hover { 
									color: #614200; 
									}					
								/* <li class="active"><a> */
								#mainnav .subnav li.active a {
									color: #55ad35;
									background-image: none;
									}
								#mainnav .subnav li.active a:hover { 
									color: #2a5a18; 
									}
								.hideoverflow {
									overflow: hidden;
									margin: 0px;
									}								
			
		/* Footer navigation */
		ul.footer {			
			margin: -50px auto 30px 11%;
			padding-bottom: 20px; /* IE 7 edit */			
			}
			ul.footer li {
				position: relative;
				top: 60px;
				float: left;
				padding: 0 10px 0 10px;
				text-transform: uppercase;
				border-right: 1px solid #FFF;
				}
			ul.footer li.last {
				border-right: none;
				white-space: nowrap;
				}
				ul.footer a {
					font-size: 12px;
					}	
				ul.footer a:hover {
					text-decoration: underline;					
					}
			
/* Email This Page box */
div#email-this-page {
	display: none; /* Hidden by default */
	position: fixed; /* EDITED IN IE 6 CSS */
	z-index: 1000000;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-image: url(../../images/send-this-page/screen.png);
	}
	div#email-this-page form {
		position: relative;
		top: 100px;
		width: 482px; /* 517 */
		height: 173px; /* 273 */
		margin: 0 auto;
		padding: 100px 0 0 35px;
		background: transparent url(../../images/send-this-page/background-send-this-page.png) no-repeat;
		}
		div#email-this-page fieldset {
			display: block;
			float: none;
			color: #fff;
			}
		div#email-this-page fieldset input {
			width: 270px;
			}
		div#email-this-page p {
			position: absolute;
			top: 220px;
			left: 223px;			
			}
		div#email-this-page form a {
			position: absolute;
			top: 19px;
			left: 407px;
			width: 88px;
			height: 28px;
			background: transparent url(../../images/send-this-page/button-close.png) no-repeat;
			}