﻿/* START Settings for 100% Height */
* {
padding: 0;
margin: 0;
}
html, body {
height: 100%;
}

/* END Settings for 100% Height */

p {
	padding:10px 0 10px 0;
}


/* START Body Properties */
body {
font-family: "lucida sans", verdana, arial, helvetica, sans-serif;
font-size: 75%;
background-image:url('heart-background.png');
}

img {
	border:0px;
}

/* START container and footer
   container is the center column with the heart border it is 100% the height of the page.
   Footer Sits below this contaner so it is always off the page it is a seperate element
   and needs to have the same background and postion propterties so it lines up.*/
#container, #footer {
min-height: 100%;
background-image:url('center-back.png');
width: 1000px;
margin: 0 auto;
}


/* START Footer min height property has to be reset so it won't be 100% like the container */
#footer{
	min-height:340px;
}




/* START Header the header is 900px wide and hass background image of the model and banner title text
	the tabs live in the header in there own box.
*/
#header{
	background-image:url('header-back.jpg');
}


#memberheader{
	background-image:url('member-header-back.jpg');
}



#header, #memberheader{
	height:240px;
	background-position:left top;
	background-repeat:no-repeat;
	overflow:hidden;
}




/* START content and copyright, content holds the main body of the page and floats in the center of the container div
	'copy right does the same thing but floats in the middle of the fotter container */
#content, #copyright, #header{
width: 900px;
margin: 0 auto;

}



/* START copyright specific formatting for fonts and color */
#copyright{

	font-size:95%;
	color:gray;
	font-style:italic;
	text-align:center;
}

#copyright p {
	margin-top:8px;
}


/* START Horizontal Line used to divide sections*/
#line{
		background:url("line-back.png");
		background-position:center center;
		background-repeat:repeat-x;
		clear: both;
		width:100%;
		margin:auto;
		height:30px;
	}


#linenoback{
		clear: both;
		width:100%;
		margin:auto;
		height:30px;
	}
	

/* =========== START Horizontal Header Tabs =========== */	

  /*HORIZONTAL TABS*/
	
/* Tabs is the box that holds the UL LI list of links */
	.tabs {
	  font-size:100%;
	  line-height:normal;
	  font-weight:400;
  	  letter-spacing:100%;
  	  text-transform:uppercase;  	  
  	  margin:auto;
  	  height:25px;
  	  overflow:hidden;
  	  margin-top:193px;
	 }

	.tabs .active{
		background-image:url("left-tab-on.gif");
	}

	.tabs .active a{
		background-image:url("right-tab-on.gif");
		color:blue;
	}
		
		
	.tabs ul {
	  margin:0px;
	  padding:0px;
	  list-style:none;
	  }
	  
	
	.tabs li {
	  float:left;
	  background:url("left-tab.gif") no-repeat left top;
	  margin:0;
	  padding:0 0 0 9px;
	  }
	  
	
	.tabs li a {
	  float:left;
	  display:block;
	  background:url("right-tab.gif") no-repeat right top;
	  padding:5px 15px 14px 6px;
	  color:red;
	  text-decoration:none;
	  }
	
	
	/* Commented Backslash Hack
	   hides rule from IE5-Mac \*/
	.tabs a {float:none;}
	/* End IE5-Mac hack */


#subtabs, .model-menu{
	position:relative;
	margin-top:auto;
    border-bottom:5px #ccccff solid;
}

.model-menu{
	margin:auto;
	height:500px;
	width:900px;
	overflow:hidden;	
}

.model-menu .tabs{
	margin:0px;
	position:relative;
	height:300px;
	top:475px;

}

/* =========== START Horizontal Header Tabs =========== */




/* === ######################## CSS BOX === START === ######################## */

	/* set the image to use and establish the lower-right position */ 
	.cssbox_head h2,.cssbox_head, .cssbox_body, .cssbox, .cssbox, .cssbox_medium, .cssbox_small_head h2, .cssbox_small_head, .cssbox_small_body, .cssbox_small, .cssbox_medium {
	    background: transparent url("demobox.png") no-repeat bottom right; 
	} 
	

	.cssbox { 
	    width: 800px !important; /* intended total box width - padding-right(next) */
	    width: 815px; /* IE Win = width - padding */
	    padding-right: 15px; /* the gap on the right edge of the image (not content padding) */
	    margin: 15px auto; /* use to position the box */ 
	} 
	
	
	/* set the top-right image */ 
	.cssbox_head { 
	    background-position: top right; margin-right: -15px; /* pull the right image over on top of border */
	    padding-right: 40px; /* right-image-gap + right-inside padding */ 
	} 
	
	
	
	/* set the top-left image */ 
	.cssbox_head h2 {
		background-position: top left;
		margin: 0;/* reset main site styles*/	border: 0;/* ditto */	
		padding: 25px 0 15px 40px;/* padding-left = image gap + interior padding ... no padding-right */	
		height: auto !important;
		height: 1%; /* IE Holly Hack */;
		clear: both;
	    font-size:200%;
	    font-weight:bold;
	    text-align:center;
	    text-transform:capitalize;
	    letter-spacing:-.005em;
	    color:white;
	} 
	
	
	
	
	/* set the lower-left corner image */ 
	.cssbox_body { 
	    background-position: bottom left; 
	    margin-right: 25px; /* interior-padding right */ 
	    padding: 15px 0 30px 40px; /* mirror .cssbox_head right/left */ 		
	    text-align:left;
		font-size:1.2em;
		line-height:1.25em;

	}
	
	
	ul.hearts{
	 list-style-image: url("listheart.png");
	 margin-left:15px;
	 padding-left:5px;
	 list-style-position:outside;
	 }
	 
	ul.hearts li{
	margin:5px 0 10px 0;
}
	
	.cssbox_body h3 {
	   font: 1.5em verdana, arial, sans-serif;
	   margin:0px 0px 5px 0px;
	   width:75%;
	   color:#ff3333;
	   border-bottom:2px #99bee5 solid;
	   text-transform:capitalize;
	   font-weight:normal;
	   margin-top:15px;
	   letter-spacing:.05em;
	}
	
	
	#new .cssbox_head h2 {background: transparent url("demobox_new.png")}

/* === ######################## CSS BOX === END === ######################## */










/* === ######################## CSS BOX SMALL === START === ######################## */


		.cssbox_small { 
	    width: 450px !important; /* intended total box width - padding-right(next) */
	    width: 465px; /* IE Win = width - padding */
	    padding-right: 15px; /* the gap on the right edge of the image (not content padding) */
	    margin: 15px auto; /* use to position the box */ 
	    margin-bottom:70px;
	} 
	
	
	/* set the top-right image */ 
	.cssbox_small_head { 
	    background-position: top right; margin-right: -15px; /* pull the right image over on top of border */
	    padding-right: 40px; /* right-image-gap + right-inside padding */ 
	} 
	
	
	
	/* set the top-left image */ 
	.cssbox_small_head h2 {
		background-position: top left;
		margin: 0;/* reset main site styles*/	border: 0;/* ditto */	
		padding: 15px 0 10px 40px;/* padding-left = image gap + interior padding ... no padding-right */	
		height: auto !important;
		height: 1%; /* IE Holly Hack */;
		clear: both;
	    font-size:1.4em;
	    font-weight:bold;
	    text-align:center;
	    text-transform:capitalize;
	    letter-spacing:-.005em;
	    color:black;
	} 
	
	
	
	
	/* set the lower-left corner image */ 
	.cssbox_small_body { 
	    background-position: bottom left; 
	    margin-right: 25px; /* interior-padding right */ 
	    padding: 15px 0 30px 40px; /* mirror .cssbox_small_head right/left */ 		
	    text-align:center;
		font-size:105%;
		line-height:1.5em;

	}
	
	
	.cssbox_small_body p{

	
}
	
	
	.cssbox_small_body h3 {
	   font: 1.5em verdana, arial, sans-serif;
	   margin:0px 0px 5px 0px;
	   width:75%;
	   color:#ff3333;
	   border-bottom:2px #99bee5 solid;
	   text-transform:capitalize;
	   font-weight:normal;
	   margin-top:15px;
	   letter-spacing:.05em;
	}
	
	
	#new .cssbox_small_head h2 {background: transparent url("demobox_new.png")}



/* === ######################## CSS BOX SMALL === END === ######################## */





/*-------------tables----------------------------------*/

.site{
	border:1px black solid;
	border-collapse:collapse;
}
.site th{
	text-align:center;
	font-size:1.3em;
	color:white;
	background:url('table-header.png');
	padding:5px;
}

.site td{
	padding:3px;
}

tr.even {

  background-color: #edf3fb;

}

tr.odd {

  background-color: #fbedf2;

}



/*-------------tables----------------------------------*/




.rollover{
	background:url('exit-off.png');
	background:url('enter-off.png');	
	background:url('btn-top-off.png');
	background:url('ccblogo3-on.gif');
	background:url('ajax-loader.gif');
	background:url('btn-epoch-off.png');
	background:url('btn-money-on.png');
	background:transparent;
}





.menu { 
	width: 295px;
	text-align:left;
	font-weight:normal; 
	}
	
	
.menu dl, .menu dd {
 margin:0;
}

.menu dd {
 background:white;
 border:1px black solid;
 width:280px;
margin-left:5px;
}
	


.menu dt { background:url('menus.png');
background-position:left top;
background-repeat:no-repeat;
font-size: 1.25em; padding: 5px; margin: 2px;letter-spacing:.04em; font-weight:300;color:white}
.menu a, .menu a:visited, .menu a:active, .menu a:link, .menu a:hover {font-weight:normal;}
.menu dt a {color:#FFF;width:100%}
.menu dd a {color:#000;width:100%}
.menu ul { list-style: none; padding: 10px;padding-top:0px;;padding-bottom:5px;}

	
	
	
#set{
	width:355px !important;
	width:370px;
	float:left;
	margin-left:250px;
	margin-bottom:50px;
}


#set h2{
	font-size:1em;
	font-weight:bold;
}

#setheight{
   text-align:center;
}	
	
	
	
	
	
	
		
#micro, #medium {	
	margin-top:5px; 
	margin-bottom:0px;
	}
	

#micro 	.cssbox_small_body, #medium .cssbox_small_body {	
		padding-left:20px;
	}
	

	
	
#micro{
	width:150px !important;
	width:165px;
	}

#micro .updates{
	width:75px;
	margin:auto;
}


#micro .updates td{
	font-size:1em;
	width:50%;
}	


#micro .updates .statname{
  text-align:left;
}	

#micro .updates .statvalue{
	text-align:right;
}	
#model-photo{
	 width: 270px; overflow: hidden;
	 float:left;
}	

	
	#medium{
	width:350px !important;
	width:375px;
	}

#medium{
	font-size:1.1em;
}
	
	
	
	
	
	
