body{			

    font-family: Arial;

    font-size: 14px;

    background-color: #cc74bf;

    margin: 0px;

    padding: 0px;

    color: #222222;

    background-image: url(../img/diagonal.png);

}





.clear{clear: both;}			

			

#headerwrap{			

    height: 120px;

    background-color: black;

    color: #ffffff;

    width: 100%;

    background-image: url(../img/new_blackbar.png);

    background-repeat: repeat-x;

}

#headerwrap .logo, #headerwrap .girl, #headerwrap .slogan, #contentwrap, .menu{width: 900px; cursor: pointer;}		

#headerwrap .logo{

    height: 120px;

    margin: 0px auto 0px auto;

    padding: 12px 0px 0px 0px;

}



#headerwrap .girl{margin: -131px auto 0px auto;}

#headerwrap .girl img{margin-left:  700px;}



#headerwrap .slogan{margin: -60px auto 0px auto;}

#headerwrap .slogan img{margin-left: 375px;}

			

#contentwrap{

    margin: 0px auto 0px auto;

    cursor: default;

    overflow: hidden;			

}

			

.menu{

    margin: 0px auto 0px auto;

    padding: 10px 0px 10px 0px;

    list-style-type: none;

    position: relative;				

}

			

.menu li{

    padding: 10px 15px 10px 15px;

    display: inline;

    border-left: 1px solid #cc74bf;

    border-right: 1px solid #cc74bf;

    font-weight: bold;			 

}

			

.menu li:hover{color: #ffffff; cursor: pointer;}

			

.menu .selected{

    background-color: #e49edd;

    padding: 10px 14px 10px 14px;

    border-left: 1px solid #000000;

    border-right: 1px solid #000000;

    padding-bottom: 11px;

    position: relative;

}

						

.menu .selected:hover {color: #222222; cursor: default; }

			

#maincontent{

    width: 648px;

    background-color: #e49edd;

    min-height: 500px;

    margin: 0px 5px 0px 0px;

    float: left;

    border-left: 1px solid #000000;

    border-top: 1px solid #000000;

    border-bottom: 1px solid #000000;

    padding:  15px 0px 0px 0px;

    #padding-top: 30px;

    padding-bottom:  1050px;

    margin-bottom: -1000px;

}

   

   

.block{

 margin: 15px 10px 15px 10px;

 position: relative;

 color: #ffffff;

 font-size: 17px;     

}   

            



.prequote, .postquote{color: #cccccc; font-size: 14px; margin: 10px 0px 10px 0px; padding: 0px 20px 0px 15px;}

.currentquote{font-size: 18px;}



.headshot{font-weight: bold;}

.headshot img{float: left; border: 1px solid #ffffff; margin: 0px 20px 20px 0px;}

.headshot .name{font-size: 20px; display: block; margin: 0px 0px 12px 0px; padding-top: 35px;}

.headshot .occupation{font-size: 14px;}



.quoteBox, .resultbox{

    background-color: #340034;

    border: 1px solid #000000;

    width: 455px;

    min-height: 125px;

    padding: 10px;

    background-image: url(../img/quote_box_bg.jpg);

    background-repeat: repeat-x;

    background-position: top;

    box-shadow: 5px 5px 5px #000000;

    -moz-box-shadow: 5px 5px 5px #000000;

    -webkit-box-shadow: 5px 5px 5px #000000;

}



.resultbox{width: 550px; margin-bottom: 30px;}

.resultbox h3{margin-top:  0px; padding-top: 0px;}

.resultbox h3, .resultbox a{color: #eeeeee; text-decoration: none;}

.resultbox a:hover{border-bottom: 1px dotted #bbbbbb;}



.quotegroup{width: 410px; clear: left; padding: 0px 0px 0px 25px;}
.quotegroup a{color: #66ccff;}



/* comment display */

.commentary, .signin{border: 1px solid #333333; width: 455px; margin: 15px 0px 0px 10px; padding: 10px;}

.commentary img{border: 1px solid #333333; float: left; margin: 0px 10px 10px 0px;}

.commentary p{clear: left;}





/* sign in display */

.signin{background-color: #cd8ec6;}

.signin fieldset{border: 1px dotted #333333;}

.signin label{display: block; font-weight: bold;}

.signin input{margin: 0px 0px 10px 0px;}

.signin input{width: 70%}

.signin textarea{width: 99%; height: 150px; margin: 0px 0px 15px 0px;}

.signin .submit{width: auto;}



/* Quiz Styles */

.quiz_options{

    width: 100px;

    min-height: 120px;

    color: #ffffff;

    text-align: center;

    float: left;

    margin: 15px 30px 0px 10px; 

    cursor: pointer;

}



.quiz_options:hover{border-color: #ffffff;}     



        	

.dashboard{

    margin: 0px;

    padding: 0px;

    list-style-type: none;

    font-size: 12px;

    position: absolute;

    margin-left: 495px;

    top: 5px;

}

			

.dashboard li{margin: 0px 0px 5px 0px; color: #000000; clear: left;}

.dashboard li a{text-decoration: none; color: #000000; cursor: pointer;}

.dashboard li a:hover{text-decoration: underline;}







.pageMenuWrap{text-align: center; margin: 20px 0px 10px 0px;}

#page_menu{width: 150px;}

			

#subcontent{

    width: 243px;

    min-height: 500px;

    background-color: #e49edd;

    float: right;

    border: 1px solid #000000;

    padding:  10px 0px 0px 0px;

}



.scbox{padding: 10px;}



/* form validation classes */

.valid{border: 2px solid #66cc66;}

.invalid{border: 2px solid  #cc0033;}



#subcontent form{margin: 10px;}

#subcontent select{margin: 0px 10px 10px 10px; width: 223px;}

#subcontent h3{font-family: Arial Black; background-color: #750A96; color: #cccccc; font-weight: normal;  margin: 5px 10px 5px 10px; padding: 4px 0px 4px 5px; background-image: url(../img/headerbgpurple.png); background-repeat: repeat-x;}

#subcontent h3{#padding: 4px 0px 2px 5px}

#subcontent h3 a{text-decoration: none; color: #cccccc;}

#subcontent h3 img{position: absolute;}

#subcontent h3 img.search{margin: -20px 0px 0px 105px;}

#subcontent h3 img.search{#margin-left: 93px;}

#subcontent h3 img.twitter{margin: -10px 0px 0px  65px;}

#subcontent h3 img.twitter{#margin-left: 45px;}

#subcontent h3 img.gender{margin:  -8px 0px 0px 3px;}

#subcontent h3 img.gender{#margin-left: -5px}

#subcontent h3 img.note{margin:  -10px 0px 0px 80px;}

#subcontent h3 img.note{#margin-left:  62px;}

#subcontent h3 img.mail{margin: -5px 0px 0px 65px;}

#subcontent h3 img.mail{#margin-left: 45px;}

.twitterposts{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

.twitterposts .tweet{
	font-size: 12px;
	border-bottom: 1px dotted #ffc5fe;
	margin: 0 0 10px 0;
	padding: 0 0 10px 0;
}


#suggestions{
    position: absolute;
    background-color: #c26eb5;
    border: 1px solid #000000;
    width: 250px; 
    margin: -10px 0px 0px 10px;
    z-index: 10100;
    box-shadow: 5px 5px 5px #000000;
    -moz-box-shadow: 5px 5px 5px #000000;
    -webkit-box-shadow: 5px 5px 5px #000000; 
    display: none;
}

#suggestions ul{margin: 0px; padding: 0px}
#suggestions ul a{text-decoration: none; position: relative; top: -10px; margin: 0px 0px 0px 10px;}

#suggestions li{
    list-style-type: none;
    margin: 0px;
    padding: 0px 3px;
    vertical-align:  middle !important;
}

#suggestions li.over, #suggestions li:hover{
    background-color: #dcadd5;
    
}



.graphwrap{margin: 10px; font-size: 12px; font-weight: bold;}

.graph{border: 1px solid #000000; height: 30px; background-color: #ff0066; background-image: url(../img/female.png); background-repeat: no-repeat; background-position: right;}

.graphbar{height: 30px; background-color: #6666ff; background-image: url(../img/male.png); background-repeat: no-repeat; background-position: left;}



.men, .women{padding: 10px; margin: 10px; color: #ffffff;}

.men{border: 1px solid #6666ff; background-color: #9f9fff;}

.women{border: 1px solid #ff0066; background-color: #ff77ad; margin-bottom: 20px;}





.ratingList{

    margin: 0px;

    padding: 0px;

    list-style-type: none;            

}

        

        

.ratingList li{

    float: left;

    width: 20px;

    height: 20px;

    background-image: url(../img/widgets/off.gif);

    background-repeat: no-repeat;

    background-position: 0px -2px;

    padding: 0px;

    margin: 0px; 

    clear: none;       

}



.ratingList li input{

    cursor: pointer;

    

}

        

        

.starRating{

    width: 20px;

    height: 20px;

    opacity: 0;

    filter:alpha(opacity=0)            

}



.rating,

.rating1,

.rating2,

.rating3,

.rating4,

.rating5{

    background-image:  url(../img/widgets/on.gif) !important;

    

}



.ratingClicked{

    background-image: url(../img/widgets/clicked.gif) !important;

    

}



        

.starOn{

    background-image: url(../img/widgets/hover.gif) !important;             

}