@charset "utf-8";
/*
CSS Document created for Web 2.0 and modern browsers

Theme Name: Erotic Engagements 
Theme URL: http://www.eroticengagements.com
Version: 2.0
*/

/*Enter Page*/
#wrap {background:url(../../images/ee_enter.png) no-repeat; width:800px; height:600px; margin:auto;}
#wrap {text-align:center;}
.msg {width:550px; margin-left:auto; margin-right:auto; color: #5a5c63; border:1px dashed #333333;}
#hd1 {height:250px;}

/* overlay popup page - disclaimer, 2257 statement, etc */ 
#overlay { background-image:url(../../includes/java/overlaywindow/img/transparent.png); color:#efefef; } 
div.wrap { height:441px; overflow-y:auto; }

/* Global Settings
------------------------------------------------------------ */
body {background:#000; margin:0; color:#f0f0f0; font-family:Arial, Helvetica, sans-serif; font-size:0.75em;}
a {outline:none; color:#5a5c63; text-decoration:none;}
a:hover {color:#777a81;}
img {border:none;}
.clearit {clear:both;}

/* Typography
------------------------------------------------------------ */
h1 {font-family:"Times New Roman", Times, serif; color:#75777e; font-size:1.5em;}

/* Page Layout (Divisions, Content, Navigations, Footer)
------------------------------------------------------------ */
#container {margin:0px auto; width:974px;}

/*Header*/
#hd {height:120px; background:#18191d no-repeat;}
#hd b {color:#eaeaea; font-weight:bold;}
#hd a {color:#eaeaea;}

/* Intro Page */
#intro {text-align:left; margin-left:auto; margin-right:auto; width:550px;}
#intro h1 {font-size:1.5em; color:#75777e;}
#intro h2 {font-size:.9em; color:#BACACD;}

/*Navigation*/
#navBar {height:30px; background:#000 url(../../images/navigation/nav_bg.png) repeat-x; margin:0;}
#navBar ul {margin:0 0 0 5px;; float:left; padding:8px 0;/*Use padding-bottom for IE7*/}
#mainNav li {display:inline; list-style-type:none;}
#mainNav a {color:#b6b6b6; text-decoration:none; padding:6px 8px;}
#mainNav a:hover {background:#4b515e url(../../images/navigation/nav_over.png) repeat-x; color:#fff; padding:6px 8px;}
#breadcrumb {background:#4b515e url(../../images/navigation/nav_over.png) repeat-x; padding:6px 8px;}
a#breadcrumb {color:#fff;}
.acc-in-out {float:right; margin-top:2px; margin-right:2px; margin-bottom: 5px; padding:6px 8px; color:#fff; border: 1px transparent solid;}
.signout, .signin {margin-right:5px;}
.signin {background:#48566a url(../../images/navigation/navlogin-over.png) repeat-x; border: 1px transparent solid;}
.acc-in-out:hover {background:#48566a url(../../images/navigation/navlogin-over.png) repeat-x; color:#fff; border: 1px #CCC solid;}
#memNav {float:right; margin-right:10px; margin-top:5px; text-align: right; padding-right: 5px; font-size: 13px; color:#848ca2;}
.nav_extender{ background: url('../../images/nav_gradient.jpg'); height: 232px; width: 230px; position: absolute; background-repeat: repeat-x; }
.warning {background-color:#f00; color:#000; font-weight:bold; padding:1px 3px; margin-right:2px;}
.scriptDisabled {color:#f00; text-align:center;}
.scriptDisabled a {font-weight:normal; color:#f00; border-bottom:1px solid #600;}

/*Show - Hide Login*/
#login {width:974px; background:#1c242f; overflow:hidden; position:relative; z-index:3; height:0; border-bottom:1px #000 solid;}
#login .loginContent {min-height: 100px; width:300px; float:right; padding-top:10px; margin-right:10px;}
#login .loginContent .right {float:right; text-align:center; width: 250px; margin-right: 15px; margin-top: 5px; font-size: 0.8em;}
#login a {color:#999; text-decoration: none;}
#login a:hover {color:#CCC; text-decoration:underline;}
#login b {color: #CCC;}
#login .loginContent form {margin: 0 0 10px 0; height:50px;}
#login .loginContent input.field {border: 1px #CCC solid; background: #464646; margin-right: 5px; margin-top: 4px; color: #FFF;}
#login .loginContent input.button_login {width: 47px; height: 20px; cursor: pointer; border:none; background: url(../../images/login/button_login.jpg) no-repeat; margin-top:5px; float:right; margin-right: 55px;}
#login label {display:block; width:80px; float:left; padding-top:5px; color:#FFF;}
#loginAd {float:left; margin:5px; height:100px; width:640px;}

/*Body*/
#bd {background:url(../../images/bd_bg.png) repeat-x; min-height:600px; padding:10px;}
#select {background:#0e0e0e; min-height: 80px; width: 100%; overflow: auto; padding-top: 8px; padding-bottom: 8px;}
#sideBar {width:240px; float:left;}
#content {width:714px; float:left;}
#linkRow {margin-top:10px; height:85px; background:#000; border:1px dotted #1a1a1a;}
#contentLeft {float:left; width:208px; min-height:350px; background:#000; margin-right:10px; border:1px dotted #1a1a1a;}
#contentMiddle {float:left; width:512px; min-height:350px; background:#000; margin-right:10px; border:1px dotted #1a1a1a;}
#contentRight {float:left; width:208px; min-height:350px; background:#000; border:1px dotted #1a1a1a;}
#subContentLeft {float:left; width:470px; height:175px; margin: 10px 10px 10px 0; border:1px dotted #1a1a1a;}
#subContentRight {float:left; margin:10px 0; height:175px; width:470px; border:1px dotted #1a1a1a;}
#baseContent {height:100px; border:1px dotted #1a1a1a;}

/* Side Bar */
#navigation {margin:0; padding:0; background:#1c242f; list-style-type:none; margin-right:10px;}
#navigation a.head {cursor:pointer; background:#252323 url(../../images/accordion.png) repeat-x; color:#b5b5b5; display:block; padding:9px 14px 6px 14px;}
#navigation a.head:hover {color:#fff;}
#navigation a.selected {color:#fff;}
#navigation ul {list-style-type:square; padding-left:24px; margin:0;}
#navigation li li a {color:#999; display:block;}
#navigation li li a:hover {color:#ccc;}

/*Footer*/
#ft ul {padding:10px 0 10px 0; margin:0; text-align:center;}
#ft li, #ft span {display:inline; list-style-type:none; color:#503e13;}
#ft li a {outline:none; text-decoration:none; color:#463e3a;}

/* Featured Profiles
------------------------------------------------------------ */
#featured {}
#featured h2 {font-family:"Times New Roman", Times, serif; color:#BACACD; font-size:1.2em;}
#featured h3 {font-size:1em; margin:5px 0 0 0;}
#featuredholder {min-height: 265px; overflow:auto; border: 1px solid #394a59;padding-bottom:10px;margin-top:20px;background:#1a2732;}
#featuredspot a {float:left;width:162px;color:#999;text-decoration:none;text-align:center;cursor:pointer;margin-left:13px;}
#featuredspot a:hover {color: #FFF;}
#featuredspot a.active {color: #FFF;}
#featuredspot a img {filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);-moz-opacity: 0.8;border: 1px transparent solid;}
#featuredspot a:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;border: 1px #fff solid;cursor: pointer;color: #1c242f;}
/* Articles & Comments
------------------------------------------------------------ */
#article h2 {font-family:"Times New Roman", Times, serif; color:#BACACD; font-size:2em;}
#article span.views {font-family:"Times New Roman", Times, serif; color:#99C; font-size:1em;}
#article span.written {font-family:"Times New Roman", Times, serif; color:#99C; font-size:1em;}
#readercomments h1 {text-decoration:underline;}
#articlecontainer {width:450px;}
#articlecommentbox {width:450px; background:#000; border: 1px dashed #333333;}
#articlecommentHead {height:15px; background:#333;}
#articlecommentLeft {float:left; width:225px;}
#articlecommentRight {float:right; width:225px; text-align:right;}
#articlePagination {text-align:center; font-size:1.2em;}

/* Form (Form Styles, Buttons, Boxes)
---------------------------------------------------------- */


/* Member Profile Management
------------------------------------------------------------ */
#memberPhoto {background-color:#000; overflow:hidden;}
#memberMenu {padding-top:20px; background:url(../../images/members/menu_bg.png) repeat-x; min-height:190px; margin-top:2px; font-size:90%;}
.memberSide {padding:0 10px 0 10px; width:200px;}
#memberMenu p {display:block; list-style-type:none; text-indent:20px; background:#201c12; margin:2px 0 2px 0;}
#memberMenu p a {display:block; color:#b6b6b6; text-decoration:none; padding:2px 0 2px 0;}
#memberMenu p a:hover {background:#3d3010; color:#fefefe; padding:2px 0 2px 0;}
.logout a {color:#b6b6b6; text-decoration:none;}
.logout a:hover {color:#fefefe;}
#memberContent {width:680px; margin-left:10px; float:left;}

/*Activity Menu*/
#activityMenu {padding:0 10px 10px 10px; color:#53504c; font-size:80%;}
#welcome {float:left;}
#statusBar {width:465px; height:15px; float:right; background:url(../../images/members/activityBar.png) no-repeat; background-position:70px; margin-right:5px;}
b {color:#545966; font-weight:normal; padding-left:17px;}
b a {color:#545966; font-weight:normal; text-decoration:none;}
#rating {width:175px; float:right; vertical-align:top;}

/* Member Home Page */
.advertisingColumn {min-height:350px; margin:0 0 10px 20px;}
.siteNewsColumn {min-height:150px; background:#0e0e0e; margin-bottom:5px;}
.additionalInfoColumn {min-height:150px; background:#0e0e0e;}
.bottomHomeNews {min-height:75px; background:#171A20; margin-top:20px;}
.profilecontactColumn {width:250px; float:left;}
.profilecontactElement {margin-bottom:5px;}
.profilecontactElement label {display:block; width:60px; float:left;}
.profileSpacer {margin-bottom:13px;} /* VERTICAL ALIGNMENT ISSUE (PLEASE FIX) IE vs FF */
.profileColumn {width:330px; float:left;}
#dashColumnWide {width:400px; float:left;}
#dashColumnNarrow {width:260px; float:left;}
.profileElement {margin-bottom:5px;}
.profileElement label, #newClubForm label {display:block; width:100px; float:left;}
/*Site News*/
#news {width:400px; float:left;}
.newsinfo {color:#CCC; font-weight:normal;}
.newstitle {color:#CC9; font-weight:normal;}
.newsmessage {color:#999; font-weight:normal;}
/* Gallery */
#memGallery h2, #sectionHeader h2 {margin:0;}
#memGallery p, #sectionHeader p {margin:0 0 10px 0;}
#artBoard {width:375px; background:#FFF; float:left;}
#editingSide {width:323px; float:left; background:#fff;}
#editingBar {width:52px; background:#dedede; float:right; padding-top:10px;}
#editingBar p {margin:10px 0 10px 0; padding:0;}
.photo {float:left;}
.photo img {border:1px solid #ccc; margin:35px;}
#thumbSide {width:270px; float:right; padding-right:10px;}
.thumb {padding:0 10px 10px 0; width:80px; float:left; text-align:center;}
.thumb p {margin:0;}
#animatedSide {width:270px;}
#imguperror { border: 1px #C00 solid; color:#C00; padding: 5px;}
#galleryinstr {width:300px; padding:10px; float:left; color:#333;}
.galleryprompt {text-align:center; color:#660; padding-bottom: 10px;}
.gallerydefault {text-align:center; color:#369;}
/* Advertisements */
#stats {height:100px; background:#000;}
#ads-banners {min-height:350px;}
#ad-packages {width:300px; padding:5px; float:left;}
#ad-banner-select {width:350px; padding:5px; float:left;}
#upload {text-align:center;}
/* Member Profiles
------------------------------------------------------------ */
#memberID {width:423px; float:left;}
.clearBar {background:url(../../images/members/clearBar.png); padding:1px 1px 1px 5px; margin:0 3px 2px 0; width:133px; float:left;}
.photoBar, .photoBar1, .photoBar2, .photoBar3 {background:url(../../images/members/clearBar.png); padding:1px 1px 1px 5px; margin:0 3px 2px 0; width:100px; float:left;} /* Photographers Tab Menu */
.clearBar2, .clearBar3 {background:url(../../images/members/clearBar.png); padding:1px 1px 1px 5px; margin:0 3px 2px 0; width:204px; float:left;}
.contactInfo a.email {color:#000; text-decoration:none; border-bottom:1px dotted #000;}
#profileMenu {position:absolute; left:351px; width:75px; text-align:center; top:0; z-index:1; list-style-type:none; padding:2px 7px; margin:0; cursor:pointer;}
#menuLink ul {display:none; position:absolute; left:0; top:17px; list-style-type:none; text-align:left; background:#fff; margin:0; padding:0; min-width:150px;}
#menuLink:hover ul {display:block; padding:3px 0;}
#menuLink ul a {padding:0 10px; margin-bottom:2px; display:block;}
#menuLink ul a:hover {background:#eaeaea; color:#333;}
/* Banners
------------------------------------------------------------ */
#banner425_85 {width:425px; height:85px; background:#000; float: right; margin-right: 60px; margin-top: 10px; }
.logo{ width: 443px; height: 117px; background: url('../../images/er_logo.jpg'); float: left; }
#ad240_85 {width:230px; height:85px; background:#1a1a1a; margin-top:20px;}
#ad600_90 {width:600px; height:90px; background:#1a1a1a; margin-top:20px;}
#ad500_120 {width:500px; height:300px; background:#1a1a1a; margin:auto;}
#ad630_120 {margin:20px auto; width:630px; height:120px; background:#1a1a1a;}
/* Advertisement SPRY 
------------------------------------------------------------ */
/* SpryTabbedPanels.css - version 0.4 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/* Horizontal Tabbed Panels
 *
 * The default style for a TabbedPanels widget places all tab buttons
 * (left aligned) above the content panel.
 */
/* This is the selector for the main TabbedPanels container. For our
 * default style, this container does not contribute anything visually,
 * but it is floated left to make sure that any floating or clearing done
 * with any of its child elements are contained completely within the
 * TabbedPanels container, to minimize any impact or undesireable
 * interaction with other floated elements on the page that may be used
 * for layout.
 *
 * If you want to constrain the width of the TabbedPanels widget, set a
 * width on the TabbedPanels container. By default, the TabbedPanels widget
 * expands horizontally to fill up available space.
 *
 * The name of the class ("TabbedPanels") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabbedPanels container.
 */
.TabbedPanels {
	margin: 0px;
	padding: 0px;
	float: left;
	clear: none;
	width: 100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
}
/* This is the selector for the TabGroup. The TabGroup container houses
 * all of the tab buttons for each tabbed panel in the widget. This container
 * does not contribute anything visually to the look of the widget for our
 * default style.
 *
 * The name of the class ("TabbedPanelsTabGroup") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabGroup container.
 */
.TabbedPanelsTabGroup {
	margin: 0px;
	padding: 0px;
}
/* This is the selector for the TabbedPanelsTab. This container houses
 * the title for the panel. This is also the tab "button" that the user clicks
 * on to activate the corresponding content panel so that it appears on top
 * of the other tabbed panels contained in the widget.
 *
 * For our default style, each tab is positioned relatively 1 pixel down from
 * where it wold normally render. This allows each tab to overlap the content
 * panel that renders below it. Each tab is rendered with a 1 pixel bottom
 * border that has a color that matches the top border of the current content
 * panel. This gives the appearance that the tab is being drawn behind the
 * content panel.
 *
 * The name of the class ("TabbedPanelsTab") used in this selector is not
 * necessary to make the widget function. You can use any class name you want
 * to style this tab container.
 */
.TabbedPanelsTab {
	position: relative;
	top: 1px;
	float: left;
	padding: 4px 10px;
	margin: 0px 1px 0px 0px;
	list-style: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	outline:none;
	cursor:pointer;
}
/* This selector is an example of how to change the appearnce of a tab button
 * container as the mouse enters it. The class "TabbedPanelsTabHover" is
 * programatically added and removed from the tab element as the mouse enters
 * and exits the container.
 */
.TabbedPanelsTabHover {
}
/* This selector is an example of how to change the appearance of a tab button
 * container after the user has clicked on it to activate a content panel.
 * The class "TabbedPanelsTabSelected" is programatically added and removed
 * from the tab element as the user clicks on the tab button containers in
 * the widget.
 *
 * As mentioned above, for our default style, tab buttons are positioned
 * 1 pixel down from where it would normally render. When the tab button is
 * selected, we change its bottom border to match the background color of the
 * content panel so that it looks like the tab is part of the content panel.
 */
.TabbedPanelsTabSelected {
}
/* This selector is an example of how to make a link inside of a tab button
 * look like normal text. Users may want to use links inside of a tab button
 * so that when it gets focus, the text *inside* the tab button gets a focus
 * ring around it, instead of the focus ring around the entire tab.
 */
.TabbedPanelsTab a {
	color:#000;
	text-decoration: none;
}
/* This is the selector for the ContentGroup. The ContentGroup container houses
 * all of the content panels for each tabbed panel in the widget. For our
 * default style, this container provides the background color and borders that
 * surround the content.
 *
 * The name of the class ("TabbedPanelsContentGroup") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the ContentGroup container.
 */
.TabbedPanelsContentGroup {
	clear: both;
}
/* This is the selector for the Content panel. The Content panel holds the
 * content for a single tabbed panel. For our default style, this container
 * provides some padding, so that the content is not pushed up against the
 * widget borders.
 *
 * The name of the class ("TabbedPanelsContent") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the Content container.
 */
.TabbedPanelsContent {
	overflow:hidden;
	padding:8px 0 8px 6px;
	background:url(../../images/members/tabGradient.png) repeat-x bottom;
}
/* This selector is an example of how to change the appearnce of the currently
 * active container panel. The class "TabbedPanelsContentVisible" is
 * programatically added and removed from the content element as the panel
 * is activated/deactivated.
 */
.TabbedPanelsContentVisible {
}
/* Vertical Tabbed Panels
 *
 * The following rules override some of the default rules above so that the
 * TabbedPanels widget renders with its tab buttons along the left side of
 * the currently active content panel.
 *
 * With the rules defined below, the only change that will have to be made
 * to switch a horizontal tabbed panels widget to a vertical tabbed panels
 * widget, is to use the "VTabbedPanels" class on the top-level widget
 * container element, instead of "TabbedPanels".
 */
/* This selector floats the TabGroup so that the tab buttons it contains
 * render to the left of the active content panel. A border is drawn around
 * the group container to make it look like a list container.
 */
.VTabbedPanels .TabbedPanelsTabGroup {
	float: left;
	width: 10em;
	height: 20em;
	position: relative;
}
/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTab {
	float: none;
	margin: 0px;
}
/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTabSelected {
}
/* This selector floats the content panels for the widget so that they
 * render to the right of the tabbed buttons.
 */
.VTabbedPanels .TabbedPanelsContentGroup {
	clear: none;
	float: left;
	padding: 0px;
	width: 30em;
	height: 20em;
}
/* SpryCollapsiblePanel.css - version 0.5 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/* This is the selector for the main CollapsiblePanel container. For our
 * default style, the CollapsiblePanel is responsible for drawing the borders
 * around the widget.
 *
 * If you want to constrain the width of the CollapsiblePanel widget, set a width on
 * the CollapsiblePanel container. By default, our CollapsiblePanel expands horizontally to fill
 * up available space.
 *
 * The name of the class ("CollapsiblePanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * CollapsiblePanel container.
 */
.CollapsiblePanel {
	margin: 0px;
	padding: 0px;
	border-left: solid 1px #CCC;
	border-right: solid 1px #999;
	border-top: solid 1px #999;
	border-bottom: solid 1px #CCC;
}
/* This is the selector for the CollapsiblePanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open or close the panel.
 *
 * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * CollapsiblePanel panel tab container.
 */
.CollapsiblePanelTab {
	font: bold 0.7em sans-serif;
	background-color: #DDD;
	border-bottom: solid 1px #CCC;
	margin: 0px;
	padding: 2px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
}
/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
 * you should never put any padding on the content area element if you plan to
 * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
 * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
 *
 * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style a
 * CollapsiblePanel content container.
 */
.CollapsiblePanelContent {
	margin: 0px;
	padding: 0px;
}
/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
 * keyboard focus ring appears *inside* the tab instead of around the tab.
 * This is an example of how to make the text within the anchor tag look
 * like non-anchor (normal) text.
 */
.CollapsiblePanelTab a {
	color: black;
	text-decoration: none;
}
/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "CollapsiblePanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the CollapsiblePanel.
 */
.CollapsiblePanelOpen .CollapsiblePanelTab {
	background-color: #EEE;
}
/* This is an example of how to change the appearance of the panel tab when the
 * CollapsiblePanel is closed. The "CollapsiblePanelClosed" class is programatically added and removed
 * whenever the CollapsiblePanel is closed.
 */

.CollapsiblePanelClosed .CollapsiblePanelTab {
 /* background-color: #EFEFEF */
}
/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
	background-color: #CCC;
}
/* This is an example of how to change the appearance of all the panel tabs when the
 * CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed
 * whenever the CollapsiblePanel gains or loses keyboard focus.
 */
.CollapsiblePanelFocused .CollapsiblePanelTab {
	background-color: #3399FF;
}