#mainframe{
position:relative;
margin:0px auto;
width:500px;
height:1000px;
background-color:#FFFFFF;
border:1px solid #000000;
padding:15px;
}

#bottompart {
position:relative;
text-align:left;

}


#right_side {
z-index:2;
position:absolute;
width:225px; 
height:140px; 
background-color:#FFFFFF; 
top:55px;
right:0px;

}

#div1 {
z-index:2;
position:relative;
width:225px; 
height:120px; 
background-color:#FFFFFF; 
top:0px;
left:0px;
}



#div5 {
z-index:2;
position:relative;
width: 170px; 
height:170px; 
background-color:#FFFFFF;
}

#user_box_title {
	width:120px;
	height:16px;
	/*background-color: #ff6600;*/
	background-color: #ff6600;
	background-position: top;
	background-repeat: repeat;
	padding-top: 2px;
	padding-left: 5px;
	text-align: left;
	color: #ffffff;	
	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-size: 11px;
	color: white;

}

#user_box {
	width:120px;
	background-color: #d5d5d3;
	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-size: 11px;
	text-align: center;
	color:#ffffff;
	padding-left:0px;
	padding-right:0px;

}


.user_input  {
font-size: 11px;
font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
font-weight: bold;
	margin: 0 0 1em 0;
	border: 1px solid  #eeeeee;
}



.user_input_btn {
position:relative;

	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-weight: bold;
	font-size : 10px; 
	color : #ffffff; 
	height: 17px;
	background: #ff6600;
	border: #d63400;
	border-style: solid; 
	border-top-width: 1px; 
	border-right-width: 1px; 
	border-bottom-width: 1px; 
	border-left-width: 1px;
	margin:0px;

	
}                                                                                                                                                      

.user_a, .user_a:hover, .user_a:visited {
	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-weight: bold;
	font-size : 10px; 
	color : #ffffff; 
	text-decoration: none;
}













.user_box_title {
	width:120px;
	height:16px;
	background-color: #ff6600;
	padding-top: 2px;
	padding-left: 5px;
	text-align: left;
	color: #ffffff;	
	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-size: 11px;
	color: white;

}

.user_box {
	width:120px;
	background-color: #d5d5d3;
	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-size: 11px;
	text-align: center;
	color:#ffffff;
	padding-left:0px;
	padding-right:0px;

}

.user_input {
	font-size: 11px;
	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	color:#000000;
	font-weight: bold;
	border: 1px solid #eeeeee;
	background: #ffffff url(images/bg.jpg);
}


.user_input_btn {
	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-weight: bold;
	font-size : 10px; 
	color : #ffffff; 
	height: 17px;
	background: #ff6600;
	border: #d63400;
	border-style: solid; 
	border-top-width: 1px; 
	border-right-width: 1px; 
	border-bottom-width: 1px; 
	border-left-width: 1px;
	margin:0px
	
}                                                                                                                                                      

.user_a, .user_a:hover, .user_a:visited {
	font-family: "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-weight: bold;
	font-size : 10px; 
	color : #ffffff; 
	text-decoration: none;
}




/*=====start 72 color squares:====*/
.cb {
position:absolute;
top: 0px;
left: 0px;
width: 14px;
height: 14px;
background-color:#000000;
border:2px solid #FFFFFF;
}

.cb2 {
position:absolute;
top: 0px;
left: 16px;
width: 14px;
height: 14px;
background-color:#AC4311;
border:2px solid #FFFFFF;
}

.cb3 {
position:absolute;
top: 0px;
left: 32px;
width: 14px;
height: 14px;
background-color:#E3AD00;
border:2px solid #FFFFFF;
}

.cb4 {
position:absolute;
top: 0px;
left: 48px;
width: 14px;
height: 14px;
background-color:#006E29;
border:2px solid #FFFFFF;
}

.cb5 {
position:absolute;
top: 0px;
left: 64px;
width: 14px;
height: 14px;
background-color:#00593F;
border:2px solid #FFFFFF;
}

.cb6 {
position:absolute;
top: 0px;
left: 80px;
width: 14px;
height: 14px;
background-color:#00484D;
border:2px solid #FFFFFF;
}

.cb7 {
position:absolute;
top: 0px;
left: 96px;
width: 14px;
height: 14px;
background-color:#00316E;
border:2px solid #FFFFFF;
}

.cb8 {
position:absolute;
top: 0px;
left: 112px;
width: 14px;
height: 14px;
background-color:#1D0A55;
border:2px solid #FFFFFF;
}

.cb9 {
position:absolute;
top: 0px;
left: 128px;
width: 14px;
height: 14px;
background-color:#6A0056;
border:2px solid #FFFFFF;
}

.cb10 {
position:absolute;
top: 0px;
left: 144px;
width: 14px;
height: 14px;
background-color:#9C0F56;
border:2px solid #FFFFFF;
}

.cb11 {
position:absolute;
top: 0px;
left: 160px;
width: 14px;
height: 14px;
background-color:#9C0F0F;
border:2px solid #FFFFFF;
}

.cb12 {
position:absolute;
top: 0px;
left: 176px;
width: 14px;
height: 14px;
background-color:#382509;
border:2px solid #FFFFFF;
}


/*---------row 2 colors:----------*/


.cb13 {
position:absolute;
top: 16px;
left: 0px;
width: 14px;
height: 14px;
background-color:#555753;
border:2px solid #FFFFFF;
}

.cb14 {
position:absolute;
top: 16px;
left: 16px;
width: 14px;
height: 14px;
background-color:#CF4913;
border:2px solid #FFFFFF;
}

.cb15 {
position:absolute;
top: 16px;
left: 32px;
width: 14px;
height: 14px;
background-color:#F3C300;
border:2px solid #FFFFFF;
}

.cb16 {
position:absolute;
top: 16px;
left: 48px;
width: 14px;
height: 14px;
background-color:#00892C;
border:2px solid #FFFFFF;
}

.cb17 {
position:absolute;
top: 16px;
left: 64px;
width: 14px;
height: 14px;
background-color:#00734D;
border:2px solid #FFFFFF;
}

.cb18 {
position:absolute;
top: 16px;
left: 80px;
width: 14px;
height: 14px;
background-color:#006066;
border:2px solid #FFFFFF;
}

.cb19 {
position:absolute;
top: 16px;
left: 96px;
width: 14px;
height: 14px;
background-color:#00438A;
border:2px solid #FFFFFF;
}

.cb20 {
position:absolute;
top: 16px;
left: 112px;
width: 14px;
height: 14px;
background-color:#34176E;
border:2px solid #FFFFFF;
}

.cb21 {
position:absolute;
top: 16px;
left: 128px;
width: 14px;
height: 14px;
background-color:#85026C;
border:2px solid #FFFFFF;
}

.cb22 {
position:absolute;
top: 16px;
left: 144px;
width: 14px;
height: 14px;
background-color:#BF0361;
border:2px solid #FFFFFF;
}

.cb23 {
position:absolute;
top: 16px;
left: 160px;
width: 14px;
height: 14px;
background-color:#BF0303;
border:2px solid #FFFFFF;
}

.cb24 {
position:absolute;
top: 16px;
left: 176px;
width: 14px;
height: 14px;
background-color:#57401E;
border:2px solid #FFFFFF;
}


/*---------row 3 colors:----------*/


.cb25 {
position:absolute;
top: 32px;
left: 0px;
width: 14px;
height: 14px;
background-color:#888A85;
border:2px solid #FFFFFF;
}

.cb26 {
position:absolute;
top: 32px;
left: 16px;
width: 14px;
height: 14px;
background-color:#EC7331;
border:2px solid #FFFFFF;
}

.cb27 {
position:absolute;
top: 32px;
left: 32px;
width: 14px;
height: 14px;
background-color:#FFDD00;
border:2px solid #FFFFFF;
}

.cb28 {
position:absolute;
top: 32px;
left: 48px;
width: 14px;
height: 14px;
background-color:#37A42C;
border:2px solid #FFFFFF;
}

.cb29 {
position:absolute;
top: 32px;
left: 64px;
width: 14px;
height: 14px;
background-color:#009966;
border:2px solid #FFFFFF;
}

.cb30 {
position:absolute;
top: 32px;
left: 80px;
width: 14px;
height: 14px;
background-color:#007880;
border:2px solid #FFFFFF;
}

.cb31 {
position:absolute;
top: 32px;
left: 96px;
width: 14px;
height: 14px;
background-color:#0057AE;
border:2px solid #FFFFFF;
}

.cb32 {
position:absolute;
top: 32px;
left: 112px;
width: 14px;
height: 14px;
background-color:#462886;
border:2px solid #FFFFFF;
}

.cb33 {
position:absolute;
top: 32px;
left: 128px;
width: 14px;
height: 14px;
background-color:#A02786;
border:2px solid #FFFFFF;
}

.cb34 {
position:absolute;
top: 32px;
left: 144px;
width: 14px;
height: 14px;
background-color:#E20071;
border:2px solid #FFFFFF;
}

.cb35 {
position:absolute;
top: 32px;
left: 160px;
width: 14px;
height: 14px;
background-color:#E20800;
border:2px solid #FFFFFF;
}

.cb36 {
position:absolute;
top: 32px;
left: 176px;
width: 14px;
height: 14px;
background-color:#75511A;
border:2px solid #FFFFFF;
}



/*---------row 4 colors:----------*/


.cb37 {
position:absolute;
top: 48px;
left: 0px;
width: 14px;
height: 14px;
background-color:#BABDB6;
border:2px solid #FFFFFF;
}

.cb38 {
position:absolute;
top: 48px;
left: 16px;
width: 14px;
height: 14px;
background-color:#F29B68;
border:2px solid #FFFFFF;
}

.cb39 {
position:absolute;
top: 48px;
left: 32px;
width: 14px;
height: 14px;
background-color:#FFEB55;
border:2px solid #FFFFFF;
}

.cb40 {
position:absolute;
top: 48px;
left: 48px;
width: 14px;
height: 14px;
background-color:#77B753;
border:2px solid #FFFFFF;
}

.cb41 {
position:absolute;
top: 48px;
left: 64px;
width: 14px;
height: 14px;
background-color:#00B377;
border:2px solid #FFFFFF;
}

.cb42 {
position:absolute;
top: 48px;
left: 80px;
width: 14px;
height: 14px;
background-color:#00A7B3;
border:2px solid #FFFFFF;
}

.cb43 {
position:absolute;
top: 48px;
left: 96px;
width: 14px;
height: 14px;
background-color:#2C72C7;
border:2px solid #FFFFFF;
}

.cb44 {
position:absolute;
top: 48px;
left: 112px;
width: 14px;
height: 14px;
background-color:#644A9B;
border:2px solid #FFFFFF;
}

.cb45 {
position:absolute;
top: 48px;
left: 128px;
width: 14px;
height: 14px;
background-color:#B14F9A;
border:2px solid #FFFFFF;
}

.cb46 {
position:absolute;
top: 48px;
left: 144px;
width: 14px;
height: 14px;
background-color:#E85290;
border:2px solid #FFFFFF;
}

.cb47 {
position:absolute;
top: 48px;
left: 160px;
width: 14px;
height: 14px;
background-color:#E85752;
border:2px solid #FFFFFF;
}

.cb48 {
position:absolute;
top: 48px;
left: 176px;
width: 14px;
height: 14px;
background-color:#8F6B32;
border:2px solid #FFFFFF;
}

/*---------row 5 colors:----------*/


.cb49 {
position:absolute;
top: 64px;
left: 0px;
width: 14px;
height: 14px;
background-color:#D3D7CF;
border:2px solid #FFFFFF;
}

.cb50 {
position:absolute;
top: 64px;
left: 16px;
width: 14px;
height: 14px;
background-color:#F2BB88;
border:2px solid #FFFFFF;
}

.cb51 {
position:absolute;
top: 64px;
left: 32px;
width: 14px;
height: 14px;
background-color:#FFF299;
border:2px solid #FFFFFF;
}

.cb52 {
position:absolute;
top: 64px;
left: 48px;
width: 14px;
height: 14px;
background-color:#B1D28F;
border:2px solid #FFFFFF;
}

.cb53 {
position:absolute;
top: 64px;
left: 64px;
width: 14px;
height: 14px;
background-color:#00CC88;
border:2px solid #FFFFFF;
}

.cb54 {
position:absolute;
top: 64px;
left: 80px;
width: 14px;
height: 14px;
background-color:#00C4CC;
border:2px solid #FFFFFF;
}

.cb55 {
position:absolute;
top: 64px;
left: 96px;
width: 14px;
height: 14px;
background-color:#6193CF;
border:2px solid #FFFFFF;
}

.cb56 {
position:absolute;
top: 64px;
left: 112px;
width: 14px;
height: 14px;
background-color:#8E79B9;
border:2px solid #FFFFFF;
}

.cb57 {
position:absolute;
top: 64px;
left: 128px;
width: 14px;
height: 14px;
background-color:#C173B0;
border:2px solid #FFFFFF;
}

.cb58 {
position:absolute;
top: 64px;
left: 144px;
width: 14px;
height: 14px;
background-color:#F082B0;
border:2px solid #FFFFFF;
}

.cb59 {
position:absolute;
top: 64px;
left: 160px;
width: 14px;
height: 14px;
background-color:#F08682;
border:2px solid #FFFFFF;
}

.cb60 {
position:absolute;
top: 64px;
left: 176px;
width: 14px;
height: 14px;
background-color:#B3925D;
border:2px solid #FFFFFF;
}



/*---------row 6 colors:----------*/


.cb61 {
position:absolute;
top: 80px;
left: 0px;
width: 14px;
height: 14px;
background-color:#FFFFFF;
border:2px solid #FFFFFF;
}

.cb62 {
position:absolute;
top: 80px;
left: 16px;
width: 14px;
height: 14px;
background-color:#FCD9B0;
border:2px solid #FFFFFF;
}

.cb63 {
position:absolute;
top: 80px;
left: 32px;
width: 14px;
height: 14px;
background-color:#FFF6C8;
border:2px solid #FFFFFF;
}

.cb64 {
position:absolute;
top: 80px;
left: 48px;
width: 14px;
height: 14px;
background-color:#D8E8C2;
border:2px solid #FFFFFF;
}

.cb65 {
position:absolute;
top: 80px;
left: 64px;
width: 14px;
height: 14px;
background-color:#99DCC6;
border:2px solid #FFFFFF;
}

.cb66 {
position:absolute;
top: 80px;
left: 80px;
width: 14px;
height: 14px;
background-color:#A8DDE0;
border:2px solid #FFFFFF;
}

.cb67 {
position:absolute;
top: 80px;
left: 96px;
width: 14px;
height: 14px;
background-color:#A4C0E4;
border:2px solid #FFFFFF;
}

.cb68 {
position:absolute;
top: 80px;
left: 112px;
width: 14px;
height: 14px;
background-color:#C3B4DA;
border:2px solid #FFFFFF;
}

.cb69 {
position:absolute;
top: 80px;
left: 128px;
width: 14px;
height: 14px;
background-color:#E8B7D7;
border:2px solid #FFFFFF;
}

.cb70 {
position:absolute;
top: 80px;
left: 144px;
width: 14px;
height: 14px;
background-color:#F9CADE;
border:2px solid #FFFFFF;
}

.cb71 {
position:absolute;
top: 80px;
left: 160px;
width: 14px;
height: 14px;
background-color:#F9CCCA;
border:2px solid #FFFFFF;
}

.cb72 {
position:absolute;
top: 80px;
left: 176px;
width: 14px;
height: 14px;
background-color:#DEBC85;
border:2px solid #FFFFFF;
}

/*-----------end col boxes:--------------*/