/* ********** Alert Popups ********** */
#popup {
	width: 512px;
	text-align: left;
	padding: 0;
	margin: 0;
	border: none;
}

/* ****** Add your friend popup  ****** */
#popup .header h3,
#homePage #popup .header h3 {
	text-transform: none;
	size: 100%;   
}

#popup .header .widgets {
	overflow: hidden;
	float: none;
	position: absolute;
	top: 5px;
	right: 6px;
}

#popup div.content {
	border: none !important;
	margin-bottom: 0;
	padding-bottom: 0;
}

#popup p {
	clear: left;
}

#popup fieldset {
	clear: both;
	overflow: auto;
	height: 1%;
}
	
#popup fieldset p.item {
	margin-bottom: 6px;
}

#popup label {
	width: 60px;
	display: block;
	float: left;
	margin-right: 10px;
	text-align: right;
}

#popup p.submit {
	margin: 0 0 10px 70px;
	padding-top: 10px;
	text-align: left;
}	

#popup p.submit input {
	margin-right: 5px;
}

p.submit input.auto {
	width: auto;
	_width: 9.4em; /* ie 6 too big - set a width - this for invite popup */
}



/* ********** simple message popups - loading/loaded *********** */
#popup .loading,
#popup .loaded {
	margin: 30px 30px 30px 80px;
}

#popup .loading h4 {
	padding-left: 60px;
	background: url(http://static.soyhincha.com/img/icon_loading_1f1f1f.gif) no-repeat 0 50%;
	padding-top: 22px;
	height: 40px;
	font-size: 110%;
}

#popup .loaded h4 {
	padding-left: 60px;
	padding-top: 12px;
	margin-bottom: 10px;
	font-size: 110%;
}

#popup .loaded p.instructions {
	padding-left: 60px;
}

/* another exception - Invite popup has been redesigned properly but not yet implemented. 
below is some temp interim version */
#popup.form.invitePopup .section div.header {
	background: transparent;
	margin: 10px 0;
}

#popup.form.invitePopup div.section {
	margin-bottom: 0;
	background: #1f1f1f;
}

#popup ul.add_friend {
	overflow: auto;
	height: 1%;
	width: 100%;
	margin-bottom: 10px;
	margin-top: -20px; /* hack... */
}

#popup ul.add_friend li.icon {
	float: left;
	margin-right: 10px;
	width: 60px;
}

#popup ul.add_friend li.description {
	float: left;
}

#popup ul.add_friend p.bottom {
	margin-top: 30px;
	color: #ABCCDA;
}

#popup ul.add_friend p.bottom a {
	color: #ABCCDA;
}


/* ********** Registration Step2 ********** */
#popup.registrationPopup {
	width: 620px;
}

#popup.registrationPopup .settingsForm {
	padding: 0;
	margin: 0;
}

#popup.registrationPopup .settingsForm fieldset {
	background: #1f1f1f;
	margin: 0;
	padding-left: 10px;
}

#popup.registrationPopup .errorMessage {
	display: none;
}

#popup.registrationPopup  span.instructions {
	padding-left: 10px;
}

#popup.registrationPopup label {
	float: none;
	width: auto;
	text-align: left;
}

#popup.registrationPopup p.inline {
	float: left;
	width: 23em;
	clear: none;
	margin-right: 5px;
}

#popup.registrationPopup p.inline.gradYear {
	width: 26em;
}

#popup.registrationPopup p.inline.state,
#popup.registrationPopup p.inline.zip {
	width: 14em;
}

#popup.registrationPopup .settingsForm p.submit {
	text-align: left;
}

#popup.registrationPopup p.submit {
	margin-left: 0;
}

#registrationPopup p#schoolField.loading {
	background-image: url(http://static.soyhincha.com/img/icon_loading_1f1f1f.gif);
}


/* ********** Battle Waiver Popup ************* */
/* is this obsolete? no more battles? */

/* will be called by popup script */
/*
#popup.battleWaiver {
	width: 950px;
	position: absolute;
	top: 180px;
	left: 80px;
}

#popup.battleWaiver .content {
	margin: 10px 18px 10px 10px;
}

#popup.battleWaiver div.header  {
	margin-left: 0;
}

#popup.battleWaiver div.header h3 {
	width: 100%;
	margin: 0 0 10px 0;
	padding-bottom: 10px;
	background: url(http://static.soyhincha.com/img/border_horiz_blackGrey.gif) repeat-x 0 100%;
	font-size: 200%;
}

#popup.battleWaiver form {
	width: 600px;
}

#popup.battleWaiver h4 {
	color: #ABCCDA;
	font-size: 130%;
}

#popup.battleWaiver fieldset {
	margin-bottom: 20px;
}

#popup.battleWaiver p.submit {
	text-align: right;
}

#popup.battleWaiver p.item.accept input {
	display: inline;
}

#popup.battleWaiver p.item.accept label {
	display: inline;
	text-align: left;
	width: auto;
	float: none;
}

#popup.battleWaiver #battleTerms_area {
	overflow: auto;
	height: 290px;
	background: #fff;
	color: #333;
	padding: 10px;
}

#popup.battleWaiver #battleTerms_area a {
	color: #333;
}

#popup.battleWaiver p.instructions {
	color: #fff;
}
*/

/* ********** invite form popup ********** */
/* towards a generic form popup ... oct 17 2007 
#popup.form 
use id in form, or additional class on wrapper for exceptions
need to set popup width in js - see explanation below ... */

/* cannot override popup properties set above with #popup 
by setting additional classes in ie
ie: div#popup.form or div#popup.invitePopup 
should allow to set width/padding of popup, but doesnt work in IE6
the class does get assigned - but ie6 doesnt get it - mootools? 

This is why earlier popups use an outer div -
Only work around is to inject inline width in the js 
*/

#popup.form .section {
	padding: 10px;
}

#popup.form .formWrapper {
	padding: 10px; /* redundant? */
}

/* **** invite a friend ***** */
/* injecting text field w/o p tag  */
#popup form#invite input.text {
	display: block;
	margin-bottom: 10px;
}

#popup.form form p.actions {
	margin-bottom: 16px;
}

/* redo generic */
#popup.form a.button {
	text-decoration: none;
	font-weight: bold;
	border: solid 1px #262626;
	color: #5dccff;
	width: 6.5em;
	text-align: center;
	padding: 2px 3px;
	background: #000 url(http://static.soyhincha.com/img/btn_black.jpg) no-repeat 50% 50%;
}

#popup.form p.submit {
	text-align: right;
	margin: 0 0 10px 0;
	padding-top: 10px;
}

/* **** report and report bug popups **** */
#reportForm,
#formResult {
	padding: 10px;
	clear: both;
}

#reportPopup {
	width: 512px;
	background: #1F1F1F;
	border: solid 1px #0c2b4a;
}

#reportPopup .section {
	border: none;
	margin-bottom: 0;
}

#reportPopup .content {
	border: none !important;
	margin-bottom: 0;
	padding-bottom: 0;
}

#reportPopup .section .content p {
	margin-bottom: 4px;
}

#homePage #reportPopup .section .header h3, 
#reportPopup .section .header h3 {
	text-transform: none;
	font-size: 130%;
}

#reportPopup .section .header .widgets {
	overflow: hidden;
	position: absolute;
	top: 6px;
	right: 10px;
}

#reportPopup h4 {
	color: #fff;
	font-size: 120%;
	margin-bottom: 4px;
	padding-left: 70px;
	background: url(http://static.soyhincha.com/img/icon_report_popup.png) no-repeat 0 50%;
	padding-top: 15px;
	height: 46px;
}

#reportPopup fieldset {
	clear: both;
	overflow: auto;
	height: 1%;
}

#reportPopup fieldset select {
	float: left;
	margin: 0px 0px 15px 0px;
	width: 200px;
}

#reportPopup p {
	clear: left;
}

#reportPopup p.instructions {
	color: #ABCCDA;
	margin: 0 0 2px 70px;
	padding-top: 10px; 
	clear: both;
}

#reportPopup label {
	width: 60px;
	display: block;
	float: left;
	margin-right: 10px;
	text-align: right;
}

#reportPopup textarea {
	float: left;
}

#reportPopup p.submit {
	margin: 0 0 10px 70px;
	padding-top: 10px;
}



/* ****** SI Nomination Popup **** */
#siNominationPopup {
	width: 628px;
	text-align: left;
}

#siNominationPopup .section {
	padding: 0;
	margin: 0;
}

#siNominationPopup .settingsForm {
	background: #000;
}

#siNominationPopup h3 {
	background: url(http://static.soyhincha.com/img/logo_si_72x43.gif) no-repeat 0 0; 
	margin: 0;
	padding: 25px 0 0  66px;
}

#siNominationPopup .settingsForm fieldset {
	padding: 10px 0;
	margin:0;
}

#siNominationPopup .settingsForm p.inline {
	margin-right: 20px;
	width: 23em;
}

#siNominationPopup .settingsForm p.email {
	width: 50%;
}

#siNominationPopup .settingsForm p.email input.text,
#siNominationPopup .settingsForm p.inline input.text {
	width: 100%;
}

#siNominationPopup p.submit {
	text-align: left;
}

#siNominationPopup p.submit span.buttonWrapper {
	float: left;
}

#siNominationPopup p.footer{
	margin: 20px 0 6px;
}

#siNominationPopup p.footer.instructions a {
	color: #fff;
}

/* ******* Generic popup classes ***** */
/* based on rankings and home page interstitial popups - Nov 2007 */
/* popups will use class= popup
add unique id or additional classes for exceptions */
/* should replace all the junk before */
.popup {
	/*width: 676px;*/ /* override width w param or in the popup itself */
	text-align: left;
	font-size: 105%; 
}

.popup .section {
	background: #191919;
}

#popup.popup div.section div.header,
.popup div.section div.header {
	padding: 10px 10px 6px;
}

#popup.popup div.content {
	padding: 10px 0;
}

.popup a.close  {
	display: block;
	width: 73px; 
	background: url(http://static.soyhincha.com/img/btn_popupCloseNew.gif) no-repeat 0 0;
	margin-bottom: 4px;
	*cursor: hand;
	overflow: hidden;
}

.popup a:hover.close  {
	background-position: 0 100%;
}

.popup a.close span {
	display: block;
	text-indent: -5000em;
	width: 22px;
	height: 22px;
}



/* ********** interstitial popup - big image w top bar - no header  ********** */
.popup div.topBar {
	background: url(http://static.soyhincha.com/img/popup_top_34.gif) repeat-x 0 100%;
	overflow: auto;
	height: 34px;
}

.section .topBar .widgets {
	position: relative;
	float: right;
	top: 5px;
	right: 6px;
}


#popup.popup div.header h3 {
	font-size: 130%;
}



/* ******** Expired Battle Overlay popup ****** */
html > body #overlayPopup.coverMe {
	background: transparent url(http://static.soyhincha.com/img/bg_transparentBig.png) repeat 0 100%;
}

#overlayPopup.coverMe {
	position: absolute;
	border: 1px solid #0C2B4A;
	top: -1px;
	left: -1px;
	_background-image: none;
}

/* workaround for transparency in ie6 defeating links... */
/* move to ie6 css */
#overlayPopup.coverMe .transparency {
	_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/bg/bg_transparentBig.png', sizingMethod='crop');
	_position: absolute;
	_top: 0;
	_left: 0;
	_width: 100%;
	_height: 411px; /* unique to expired throwdown */
	_z-index: -100;
}

#overlayPopup.coverMe .section {
	background: transparent;
	margin: 0;
	border: none;
}

#overlayPopup.coverMe .section .content {
	background: transparent;
	padding: 0;
}

#overlayPopup.coverMe .header {
	height: 24px;
}

#overlayPopup.coverMe .header .widgets {
	overflow: hidden;
	float: none;
	position: absolute;
	top: 5px;
	right: 6px;
}

#overlayPopup.coverMe a.close  {
	display: block;
	width: 73px; 
	background: url(http://static.soyhincha.com/img/btn_popupCloseNew.gif) no-repeat 0 0;
	*cursor: hand;
	overflow: hidden;
}

#overlayPopup.coverMe a:hover.close  {
	background-position: 0 100%;
}

#overlayPopup.coverMe a.close span {
	display: block;
	text-indent: -5000em;
	width: 22px;
	height: 22px;
}

#overlayPopup.coverMe .expirationMessage {
	background: #000;
	border-top: solid 1px #2E2D2C;
	border-bottom: solid 1px #2E2D2C;
	position: absolute; /* or relative? */
	top: 160px;
	left: 0;
	padding: 10px 0 15px;
	width: 100%;
}

#overlayPopup.coverMe .expirationMessage h3,
#overlayPopup.coverMe .expirationMessage h4 {
	text-align: center; 
	margin: 0 auto 2px; 
	text-transform: uppercase; 
	font-size: 130%;
}

#overlayPopup.coverMe .expirationMessage h3 {
	font-size: 160%;
	color: #fff;
}

#overlayPopup.coverMe .expirationMessage h4 a {
	color: #ABCCDA;
}

#overlayPopup.coverMe .expirationMessage h4 a:hover {
	color: #fff;
}