@charset "utf-8";

* { margin: 0; padding: 0}
img { border: none;}

body,td,th {
	font-family: Arial, Helvetica, sans-serif;
	color: #636467;
	font-size:12px;
}

h1 { font-size: 12px;}
h2 { font-size: 18px; padding-bottom: 16px;}
h3 { font-size: 12px;}

p { padding-bottom: 12px; line-height:18px;}
a { color: #636467; text-decoration: none;}
a:focus { outline: none;}
a:hover { text-decoration: underline;}

/*------------framework-----------*/

#preload { display: none; height: 0px;}

#container {
	width: 900px;
	margin: 0 auto;
	padding-top: 15px;
	}

#main { width: 900px;}
	#main h1 { text-indent: -3000px;  background-repeat:no-repeat; background-position: top left; padding-bottom:7px;}
		#header-connections { background:url(../images/header/header-connections.gif); width: 146px; height: 50px;}
		#header-contact { background:url(../images/header/header-contact.gif); width: 112px; height: 50px;}
		#header-dolls { background:url(../images/header/header-dolls.gif); width: 114px; height: 50px;}
		#header-events { background-image:url(../images/header/header-events.gif); width: 199px; height:50px;}
		#header-portfolio { background-image:url(../images/header/header-portfolio.gif); width: 110px; height:50px;}
		#header-resume { background:url(../images/header/header-resume.gif); width: 87px; height:50px;}
		#header-workshops { background:url(../images/header/header-workshops.gif); width: 121px; height: 50px;}
	#photo { width: 350px; height: 490px; float:left; }
    #info {
		height: 480px;
		width: 515px; 
		float: right;
		padding: 10px 10px 0 0;
		position: relative;
		}
	#info-scroll {
		height: 400px;
		width: 515px;
		overflow: auto;
		}
    #info-thumbsrow {
        clear: both;
		bottom: 15px;
		right: 0px;
		padding-top: 10px;
		position: absolute;
		}
        #info-thumbsrow ul { list-style: none;}
        #info-thumbsrow li { float: left; padding: 2px 8px 8px 2px; background:url(../images/subthumb-drop.gif) no-repeat left top;}
        #info-thumbsrow a, #info-thumbsrow img {
            width: 50px;
            height: 50px;
            display: block;
            }
#maincol { width: 688px; float: left;}
	#maincol h1 { text-indent: -3000px;  background-repeat:no-repeat; background-position: top left; padding-bottom:7px;}
		#header-phoenix { background:url(/images/dolls/header-phoenix.gif); width: 150px; height: 50px;}
		#header-elora { background:url(/images/dolls/header-elora.gif); width: 150px; height: 50px;}
		#header-jade { background:url(/images/dolls/header-jade.gif); width: 150px; height: 50px;}
		#header-celeste { background:url(/images/dolls/header-celeste.gif); width: 150px; height: 50px;}
		#header-bettie { background:url(/images/dolls/header-bettie.gif); width: 150px; height: 50px;}
		#header-pogoda { background:url(/images/dolls/header-pogoda.gif); width: 150px; height: 50px;}
		#header-zoey { background:url(/images/dolls/header-zoey.gif); width: 150px; height: 50px;}
		#header-joy { background:url(/images/dolls/header-joy.gif); width: 150px; height: 50px;}
		#header-abriel { background:url(/images/dolls/header-abriel.gif); width: 150px; height: 50px;}
		#header-rena { background:url(/images/dolls/header-rena.gif); width: 150px; height: 50px;}
	#photocol { width: 300px; height: 400px; float:left; }
	#infocol {
		width: 335px;
		height: 400px;
		float:right;
		padding: 0 25px;
		position: relative;
		}
		p.bold {font-weight:bold;}
		p.gallery {font-weight:bold; font-size: 18px;}
		.btn-danceclip {
			position: absolute;
			bottom: 15px;
			right: 20px;
			display: block;
			height: 15px;
			width: 110px;
			background:url(../images/nav-clip.gif) no-repeat;
			text-indent: -3000px;
			}
	#thumbsrow {
        clear: both;
        padding-top: 15px;
        }
        #thumbsrow ul { list-style: none;}
        #thumbsrow li { float: left; padding: 2px 8px 8px 2px; background:url(../images/subthumb-drop.gif) no-repeat left top;}
        #thumbsrow a, #thumbsrow img {
            width: 50px;
            height: 50px;
            display: block;
            }
    #thumbsrow-large {
        clear: both;
        padding-top: 8px;
        }
        #thumbsrow-large ul { list-style: none; float:right;}
        #thumbsrow-large li { float: left; padding: 5px 9px 7px 3px; background:url(../images/thumbs-drop.gif) no-repeat left top;}
        #thumbsrow-large a, thumbsrow-large img {
            width: 65px;
            height: 65px;
            display: block;
            }           
    #sub-thumbsrow { height: 58px; position: absolute; bottom: 15px;}
        #sub-thumbsrow ul { list-style: none;}
        #sub-thumbsrow li { float: left; padding: 2px 8px 8px 2px; background:url(../images/subthumb-drop.gif) no-repeat left top;}
        #sub-thumbsrow a {
            display: block;
            width: 50px;
            height: 50px;
            }
	
	.thumb-stack { padding-bottom: 5px;}		
	.thumb-left {
		float: left;
		width: 50px;
		height: 50px;
		padding: 2px 8px 8px 2px;
		background:url(/images/subthumb-drop.gif) no-repeat left top;
		}
	.info-right {
		float:right;
		width:276px; 
		/*width: 261px; /*used when scrollbar is active*/ 
		}		
#sidebar {
	width: 162px;
	height: 470px;
	padding: 20px 28px 0 22px;
	float: right;
	background:url(/images/dolls/sidebar.gif) no-repeat top left;
	}
	p.four {padding-bottom: 30px;}
#sidebar h2, #sidebar h3 { text-transform:uppercase;}
#sidebar h2 { font-size: 14px; color: #971b1e; padding-bottom: 0px; border-bottom: 2px solid #9ea0a2; margin-bottom: 12px;}
#sidebar h3 { font-size: 12px; padding-bottom: 5px;}

/*	#videocol { width: 445px; float: left;}
	#video-infocol {
		width: 201px;
		float:right;
		padding: 41px 25px 0 25px;
		}
	#video-infocol-scroll {
		width: 201px;
		height: 400px;
		overflow: auto;
		}*/		

/*------------ red bar -----------*/

#redbar {
	clear: both;
	width: 100%;
	height: 90px;
    background-image: url(../images/redbar-gradient.gif);
    background-repeat:repeat-x;
	}
	#bar-content {
		width: 900px;
		margin: 0 auto;
		height: 90px;
		}

#logo { width: 139px; float: left;}		
#logo a {
	display: block;
	background:url(../images/redbar-logo.gif);
	height: 90px;
	width: 139px;
	text-indent: -3000px;
	}
/*	#logo:hover { background:url(../images/redbar-logo-over.gif) top left; }
*/	

#nav {
	float:right;
	height: 70px;
	width: 750px;
	padding: 20px 10px 0 0;
	}
#nav ul { list-style: none; float:right;}
#nav li { float: left; padding-left: 25px;}
#nav li.first { padding-left: 0px;}
#nav a {
	display:block;
	/*text-indent: -3000px;*/
	color: #FFFFFF;
	height: 25px;
	}
	#nav-connections { background:url(../images/nav/nav-connections.gif) no-repeat; width: 100px;}
	#nav-contact { background: url(../images/nav/nav-contact.gif) no-repeat; width: 67px;}
	#nav-dolls { background:url(../images/nav/nav-dolls.gif) no-repeat; width: 68px;}
	#nav-events { background:url(../images/nav/nav-events.gif) no-repeat; width: 107px;}
	#nav-portfolio { background:url(../images/nav/nav-portfolio.gif) no-repeat; width: 64px;}
	#nav-resume { background:url(../images/nav/nav-resume.gif) no-repeat; width: 63px;}
	#nav-workshops { background:url(../images/nav/nav-workshops.gif) no-repeat; width: 84px;}
	
	#nav-connections:hover  { background:url(../images/nav/nav-connections-over.gif) no-repeat;}
	#nav-contact:hover  { background: url(../images/nav/nav-contact-over.gif) no-repeat;}
	#nav-dolls:hover { background:url(../images/nav/nav-dolls-over.gif) no-repeat; }
	#nav-events:hover { background:url(../images/nav/nav-events-over.gif) no-repeat; }
	#nav-portfolio:hover  { background:url(../images/nav/nav-portfolio-over.gif) no-repeat;}
	#nav-resume:hover  { background:url(../images/nav/nav-resume-over.gif) no-repeat;}
	#nav-workshops:hover  { background:url(../images/nav/nav-workshops-over.gif) no-repeat;}
#nav a:hover { color: #FFFFFF; text-decoration: underline;} 


/* forms */
.text-input:focus,.text-input2:focus, .textarea-input:focus { border: 1px solid #971b1e;}
.text-input, .textarea-input { border: 1px solid #bcbec0; padding: 2px 3px; width: 175px;}
.text-input2 { border: 1px solid #bcbec0; padding: 2px 3px;}

.table-form td { padding:2px;}

/*------------universal classes-----------*/

.right { float: right;}
.left { float: left;}
.clear { clear:both;}

.required { color: #971b1e;}


img.display-center {
	display:block;
	margin: 0 auto;
	}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */