/* CSS stylesheet for TheDawnSpot.com*/
/* Author: Heidi Harrier */

body {
		background: rgb(21,1,133) url("bigspot.png") no-repeat fixed 60% 20%;
		margin-top: 0px;
		color: white; 
		font-family: "franklin gothic medium","trebuchet ms",  "arial rounded", 
						"microsoft sans serif","lucida sans unicode", "century gothic", sans-serif;
		font-size: 12pt;
		font-weight: bold;
		margin-right: 0px;
		text-align: justify;
		}

h1, h2, h3, h4, h5, h6 {
		color: rgb(0,255,0);
		margin-bottom: 6px;
		} 

h4, h5, h6 {
		font-size: 1em;
		color: rgb(250,0,129);
		}

h4		{
		text-transform: uppercase;
		}

a, a:active, a:visited, #pics a, #pics a:active, #pics a:visited {
		color: rgb(250,0,129);
		text-decoration: none;
		font-size: 1.08em;
		}

a:hover, #pics a:hover {
		color: rgb(0,255,0);
		text-decoration: underline;
		}

li		{
		list-style-image: url(bullet.png);
		}

span a, span a:active, span a:visited {
		color: yellow;
		font-size: 1.08em;
		}

span a:hover {
		color: rgb(0,255,0);
		text-decoration: underline;
		}

iframe {
		border: none;
		}


/* All IDs */

#bookletset {
		float: left;
		display: inline;
		border: 1px solid rgb(250,0,129);
		width: 237px;
		padding: 10px;
		margin-bottom: 12px;
		margin-right: 10px;
		line-height: 12pt;
		}

#booksetnote {
		width: 350px;
		line-height: 12pt;
		margin-bottom: 8px;
		}

#emailform {
		width: 315px;
		min-height: 350px;
		float: right;
		}

#face {
		float: left;
		display: inline;
		margin-right: 8px;
		}

#fashion_top {
		margin-top: 0px;
		}

#footer {
		font: small-caps 0.7em "arial-rounded" sans-serif;
		text-align: center;
		clear: both;
		}

#fun	{
		position: absolute;
		left: 40px;
		top: 200px;
		width: 12px;
		height: 400px;
		z-index: 0;
		}

#hair_chart {
		width: 90%;
		max-height: 360px;
		overflow: auto;
		scrollbar-base-color: rgb(21,1,133);
		scrollbar-track-color: black;
		scrollbar-arrow-color: yellow;
		}

#hairchart {
		border: 3px solid black;
		}

#hairchart tr, #hairchart td {
		border: 1px solid black; 
		}

#hairkit {
		border-top: 2px solid black;
		margin-top: 25px;
		padding-top: 15px;
		}

#hair4sale {
		background-color: transparent;
		width: 90%;
		}

#leftside {
		float: left;
		width: 80%;
		border-right: 4px dotted yellow;
		min-height: 750px;
		}

#logo {
		padding-left: 8px;
		}

/*#maintext {
		float: left;
		margin: 240px 20px 0px 12px;
		width: auto;
		}*/

#menu {
		text-align: center;
		font-family: hobo, "arial rounded", "century gothic", sans-serif;
		}

#menu a {
		font-size: 14pt;
		padding: 4px;
		font-weight: bold;
		letter-spacing: .04em;
		text-decoration: none;
		}

#menu img {
		vertical-align: middle;
		}

#pagebody {
		font-family: "arial rounded", "century gothic", sans-serif; 
		font-size: 10pt; 
		color: white;
		margin: 35px 22px 12px 35px;
		line-height: 18pt;
		}

#pagetitle {
		margin-top: 20px;
		padding-bottom: 10px;
		}

#pics {
		width: 90%;
		max-height: 270px;
		overflow: auto;
		scrollbar-base-color: rgb(21,1,133);
		scrollbar-track-color: black;
		scrollbar-arrow-color: yellow;
		text-align: left;
		border: 1px solid rgb(250,0,129);
		padding: 3px;
		}

#pics a img {
		border: none;
		}

#pics td {
		border-bottom: 1px solid blue;
		width: auto;
		margin-left: 6px;
		padding: 4px;
		}

#pics li {
		list-style-image: none;
		list-style-type: none;
		}

#reroot_inst {
		border-top: 2px dashed rgb(250,0,129);
		border-bottom: 2px dashed rgb(250,0,129);
		display: none;
		}

#rightside {
		float: right; 
		padding-left:15px;
		padding-top: 35px;
		color: white; 
		width: 17%; 
		} 

#sites1 {
		float: left;
		width: 48%;
		min-height: 400px;
		}

#sites2 {
		float: right;
		width: 48%;
		min-height: 400px;
		}

#th	{
		border-bottom: 3px solid black;
		}

/* ID's for the funstuff page */

#wpP {
		position: absolute;
		left: 20px;
		top: 225px;
		z-index: 1;
		}

#iconP {
		position: absolute;
		left: 30px;
		top: 365px;
		z-index: 2;
		}
		
#themeP {
		position: absolute;
		left: 18px;
		top: 495px;
		z-index: 3;
		}

#theiframe {
		position: absolute;
		left: 220px;
		top: 225px;
		width: 50%;
		height: 400px;
		float: left;
		border: none;
		}


/* All classes */

.bluerule {
		 border: 2px solid rgb(21,1,133);
		 }

.booklet_view {
		width: 100px;
		height: 352px;
		overflow: auto;
		}

.booklets {
		text-align: center;
		}

.booklets a {
		margin-bottom: 6px;
		}

.booklets img {
		margin-top: 3px;
		border: none;
		}

.booktitle {
		font-size: 1.08em;
		}

.buttons {
		background-color: black;
		border: 2px solid yellow;
		padding: 6px;
		}

.capitals {
		text-transform: uppercase;
		}

.colhead {
		background-color: rgb(250,0,129);
		color: black;
		}

.comment {
		font-size: .8em;
		font-variant: small-caps;
		}

.doll {
		float: right;
		border: 0px;
		}

.doll-list {
		clear: left;
		}

.dotted {
		border-bottom: 4px dotted yellow;
		margin: 0px;
		}

.dottedtop {
		border-top: 4px dotted yellow;
		padding-top: 7px;
		}

.emphasis {
		color: yellow;
		font-style: italic;
		}

.enclosed {
		border: 2px solid yellow;
		background: url(transpgreen.png);
		display: inline;
		margin: 8px;
		padding: 12px;
		}

.h3underline	{
		border-bottom: 2px dotted yellow;
		color: rgb(0,255,0);
		font-size: 1.2em;
		text-transform: capitalize;
		}

.inline {
		display: inline;
		}

.inst, .green {
		color: rgb(0,255,0);
		}

.larger {
		font-size: 1.6em;
		color: rgb(139,224,252);
		}

.left {
		display: inline;
		float: left;
		margin-top: 6px;
		margin-right: 12px;
		color: rgb(0,255,0);
		font-style: italic;
		font-size: 1.1em;
		}

.link_lists {
		padding-right: 10px;
		}

.lrgcap {
		font-size: 1.6em;
		color: rgb(139,224,252);
		}

.noshow {
		visibility: hidden;
		font-size: smaller;
		}

.paragraph-pic {
		float: left;
		display: inline;
		margin: 2px 14px 12px 0px;
		border: 1px dotted white;
		padding: 2px;
		text-align: center;
		}

.piclink {
		border: none;
		}

.pgpic {
		float: left;
		display: inline;
		margin: 0px 12px 12px 0px;
		}

.pgtitle {
		text-align: right;
		padding-right: 115px;
		vertical-align: bottom;
		padding-bottom: 0px;
		margin-bottom: 0px;
		}

.popUp {
		font-size: 12px;
		color: black;
		background-color: rgb(139,224,252);
		visibility: hidden;
		margin: 0 10px;
		padding: 5px;
		position: absolute;
		width: 125px;
		border: solid 1px black;
		}

.pullQuote {
		font-style: italic;
		font-size: 1.1em;
		padding: 1em;
		margin: 10px 0px 5px 10px;
		position: relative;
		width: 190px;
		float: right;
		border: 1px solid white;
		text-align: center;
		color: rgb(0,255,0);
		}

.pullQuoteL {
		font-style: italic;
		font-size: 1.1em;
		padding: 1em;
		margin: 0px 10px 10px 0px;
		position: relative;
		width: 190px;
		float: left;
		border: none;
		text-align: center;
		color: rgb(0,255,0);
		}

.right {
		display: inline;
		float: right;
		}

.showpic {
		visibility: hidden;
		padding: 5px;
		position: absolute;
		top: 200px;
		left: 200px;
		border: solid 2px white;
		}

.tablehead {
		background-color: white;
		color: rgb(21,1,133);
		font-size: larger;
		font-variant: small-caps;
		border-bottom: 3px solid black;
		}

.uppercase {
		text-transform: uppercase;
		}

.yellow {
		color: yellow;
		}