body,html { height: 100%; margin: 0; padding: 0; }
body { background:#FFF; color: #333; }
/*6ED010 (green) CDCBC3 (gray), 6ED010 (yellow), E5E5E5 (light gray), 9C9585 (gray)*/
h1 {color: #000; font-size: 18px; margin: 0 0 20px 0; line-height: normal;}
h2 {color: #000; font-size: 16px; margin: 0 0 10px 0; }
h3 {color: #FFF; margin: 0 0 10px 0; padding: 0; line-height: normal; font-size: 14px; }
h4 { font-size: 14px; font-style: italic; color: #000000; margin: 0;}
h5 { color: #000000; font-size: 14px; font-weight: bold; margin: 0 0 0 0; padding: 0; width: 600px; padding-bottom: 1px;}
h6 { font-size: 18px; margin: 0 0 20px 0; font-weight: normal;}
body, p, ol, ul, td { font-family: arial, helvetica, sans-serif; font-size: 13px; line-height: 18px; }
p { margin: 0 0 10px 0; line-height: 160%;}
u { text-decoration: none; border-bottom: 2px solid #333333 }
pre { background-color: #eee; padding: 10px; font-size: 11px; }
a { color: #333333; border-bottom: 1px solid #333333; text-decoration: none; -moz-outline: none; line-height: normal; }
a:hover { color: #CCC; background: #6ED010; border-color: #6ED010; }
img {border: none;}
br { clear: both; float: none; }
.h1gray { color: #cccccc; font-weight: normal;}
ul,ol { margin: 0; padding: 0; list-style-type: none;}
li { margin: 0; padding: 0; }
a img { border: none; background: 0;}
div	{ -moz-border-radius: 0; -webkit-border-radius: 0; }

.marked_text { background: #B6EC09;}
.marked_text_blue { background: #A9D4FF;}
.marked_text_orange { background: #FFD8B1;}
/*opacity:0.8;filter:alpha(opacity=80)*/

/*main layout*/
#main { width:auto; position:relative; top:0; left:0px; margin: 0; right: 0; padding: 0; background: transparent; min-width: 950px;  }
#mainintern {  border: none; text-align: left; position:relative; top:0; right: 0; left:0; margin: 0; padding: 0; background: #FFF; height: auto; }
#top { position: relative; left: 0; padding: 0; border-bottom: 1px solid #FFF; width: auto; margin: 0px 0 0px 0; padding: 0; right: 0; height: 380px; background: transparent; }

#page_gradient { position: absolute; top: 0; left: 0; margin: 0; width: 100%; height: 300px; background:#333 ; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#191919), to(#333)); display: block; z-index: 0; background: -moz-linear-gradient(bottom, #333, #191919);  }


/*-webkit-gradient(linear, 0% 0%, 0% 100%, from(#111313), to(#333))*/
/*from(#498610), to(#6ED010))*/
/*#404036*/

#topspacer { position: relative; height: 0px; width: 100px; background: #333; }

#topfamily { background: url(../images/logo_family.png) no-repeat 10px 34px; position: relative; top: 0; left: 0; width: 913px; height: 160px ; margin: 0 0 30px 15px; padding: 0; border: 0px solid;}
#topintern { position: relative; top: 0; left: 0; width: 846px; height: 20px ; margin: 0 0 50px 0; padding: 0; border-bottom: 0px solid #333; overflow:hidden; }
#toplab { position: relative; top: 0; left: 0; right: 0; height: 300px; background: transparent; margin: 0; overflow: hidden; }
/*url(../images/bkg_top.png) repeat-x */
#bodycontent {position: relative; width: 100%; margin: 0 0 0 15px; padding: 0; border-left: 0px solid #999999; border-right: 0px solid #999999; }
#textcontent { position: relative; width: 770px; margin: 0px 0 0 80px; border: 0px solid; float: none;}
#textcontentintern { position: relative; top: 0px; margin: 0 30px 0 30px; border: 0px solid; overflow:hidden; width: 1010px; }
#textcontentintern h1 { font-size: 30px; position: relative; top: 12px; left: 0px; line-height: normal; padding: 0; font-weight: normal;}
.textcolumn { position: relative; width: 350px; float: left; margin: 0;}
#bodyintern { background: transparent; min-width: 1080px; }
#bodyresult { background: transparent;}
#bodylab { background: #FFF; min-width: 950px; }
#topbkgintern { position: relative; top: 0; left: 0; right: 0; height: 70px; width: 100%; background: url(../images/bkg_top.png) repeat-x #CCC; margin: 0; }
#topbkgadmin { position: relative; top: 0; left: 0; right: 0; height: 70px; width: 100%; background: url(../images/bkg_top_adm.png) repeat-x #CCC; margin: 0; }
#footer { position: relative; width: 100%; height: 148px; padding: 0; margin-top: 100px; background: url(../images/footer_bkg.png) repeat-x #000; border: none; z-index: 0; overflow: hidden; display: none;}
#footer a, a:hover { border: none; background: none;}
html>body #main { height: auto }
html>body #mainintern { height: auto }

#logo { position: absolute; left: 74px; top: 110px; }
#logo a { border: none; }
#logo img { border: none; }

#appinfo { position: absolute; right: 10px; top: 5px; color: #BCBCBC; font-size: 12px; z-index: 100; width: auto; height: 20px; border: 0px solid }

#startlinks { color: #FFF;}
#startlinks a { color: #FFF; border-color: #FFF;}

#myintrotext { position:absolute; top: 260px; left: 420px; font-size: 24px; width: 500px; line-height: 130%; }

#introblock { position: absolute; top: 380px; left: 80px; width: 450px; height: auto; padding: 0 0 40px 0; border: 0px solid }
#introblock a { font-weight: bold; color: #333; font-size: 16px; border-color: #333;}

#gotosignup { position: absolute; right: 140px; top: 17px; width: 273px; border: 0px solid; display: none }

/*mycolors*/
#mycolorshow { position: absolute;  }
#mycolorshow div { position: absolute; top: 0; left: 0; width: 100%; height: 99%; z-index: 0; }

/*mykeywords*/
#mykeywordshow { position: absolute; top: 50px; left: 30px; width: 100%; padding: 10px; z-index: 1; border: 0px solid; }
#mykeywordshow div { position: relative; text-align: left; top: 0; left: 0; margin:0; padding: 0; line-height: normal; width: auto; height: auto; background: transparent; font-size: 34px; color: #FFF; opacity:0.5;filter:alpha(opacity=50); z-index: 1;  }


/*slideshow*/
#slideshow { position:absolute; top: 44px; left: 250px; border: 0px solid #FFF; background:url('../images/frontimg/front_description_blank.png') }
#slideshow img { position: absolute; }

/*imageshow*/
#fadebkg { position: fixed; z-index: 1000; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity:0.8;filter:alpha(opacity=80) }
#imageshowwrap { position: fixed; width: auto; height: auto; left: 50%; top: 50%; margin: -260px 0 0 -260px;z-index: 1001; padding: 20px 20px 40px 20px; background: #FFF; }
#imageshowwrap a { font-size: 20px;}
#imageshowwrap img { display: none;}

/*not in use?*/
#screenshots { position: absolute; left: 600px; top: 425px; width: 300px; height: 280px; border: 0px solid }
#screenshots img { position: absolute; }
#screenshotsmenu { position: absolute; top: 250px; left: 4px; }
#screenshotsmenu div { border: 1px solid #999; overflow: hidden; margin: 0 8px 8px 0; float: left; width: 20px; text-align: center;}
#screenshotsmenu div a { color: #999; border: none; display: block; padding: 2px 0px 2px 0px; }
#screenshotsmenu div a:hover { color: #FFF; background: #CCC;}

#screenshots2 { position: relative; width: auto; height: auto; border: 0px solid }
#screenshots2 img { margin: 0 20px 20px 0; float: left;}
#screenshots2 a { border: none;}

/*MAIN WRAP FOR INTERN*/
#internarea { position:relative; width: 1240px; margin: 20px 0 0 0; }

#instructions { position: absolute; top: 0; color: #FFFFFF; }
#instructions img { vertical-align: bottom; }

#startquestions { }
#startgoto a, a:hover { border: none; background: none;}
#startquestions h5, #startgoto h5 { font-size: 25px; color: #333; background: none; border: 0px solid #999; width: auto; padding: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px;}

.imglink a, a:hover { border: none; background: none;}

#startintrotext { position: absolute; top: 228px; left: 180px; width: 550px; height: auto; border: 0px solid; color: #FFF; font-size: 20px }
#startintrotext a { color: #FFF; border-color: #FFF;}

#arealinkstart { margin: 0 0 0 0; border: 0px solid;}
#arealinkstart div { position: relative; margin: 0 0 12px 0; border: 0px solid; height: 20px; }
#arealinkstart img { vertical-align: middle; }
#arealinkstart a { font-size: 16px; color: #333; border: none; margin: 0; padding: 0; background: none; top: 0; display: inline; line-height: normal;}
#arealinkstart a:hover { background: none; color: #333; }
#arealinkstart .areame a, #arealinkstart .areawe a { color: #333; font-size: 16px; }
#arealinkstart .areame a:hover { color: #CCC; }

.arealink { position: absolute; left: 60px; top: 60px;}
.arealink div { display: block; margin: 0 0 20px 0; }
.arealink img { vertical-align: top; }
.arealink a { color: #333333; border: none; margin: 0 0 20px 0;}
.arealink a:hover { background: none; color: #999999; }

.areaarrow { position: relative; left: 0; top: -5px; z-index: 2;}
.toolsymbolsmall { position: relative; border: 0px solid; vertical-align: bottom; display: none;}

.labset { position: absolute; left: 0; top: 0; background: url('../../images/area_arrow.png') no-repeat 2px 2px; width: 35px; height: 35px; z-index: 100; }

/*menu*/
#menu { position: absolute; top: 0px; right: 0px; width: 100%; padding: 0; margin: 0 0 0 0px; z-index: 2; background: transparent; display: block; border-bottom: 0px solid #333;}
#menu ul { position: relative; margin: 0 0 0 0px; padding: 0 0 0 75px; list-style: none; }
#menu ul li { float: left; display: inline; width: auto; overflow: hidden;}
#menu ul li a { display: block; text-decoration: none; color: #CCC; padding: 6px 10px 6px 10px; text-align: center; background:transparent; border: none; line-height: normal; border-bottom: 0px solid #000;}
#menu ul li a:hover { /*background:url("../images/menubkg3.png") repeat-x #333;*/ color: #FFFFFF; margin: 0; padding: 6px 10px 6px 10px; margin: 0; left: 0; float: left; text-align: left; border: 0; line-height: normal; border: none; border-bottom: 1px solid #FFF; }
#menu a.active { color: #FFFFFF; margin: 0; padding: 6px 10px 6px 10px; border-bottom: 1px solid #FFF; }

/*menu family*/
#menufamily { position: absolute; top: 160px; left: 15px; width: 913px; padding: 0; margin: 0; background:#000000; z-index: 20; }
#menufamily ul { margin: 0 0 0 10px; padding: 0; list-style: none; }
#menufamily ul li { float: left; display: inline; width: auto; overflow: hidden;}
#menufamily ul li a { display: block; text-decoration: none; color: #CCC; padding: 5px 10px 5px 10px; text-align: center; background:#000000; border: none; line-height: normal;}
#menufamily ul li a:hover { background:url("../images/menubkg3.png") repeat-x #333; color: #FFFFFF; margin: 0; padding: 5px 10px 5px 10px; margin: 0; left: 0; float: left; text-align: left; border: 0; line-height: normal }
#menufamily a.active { background-image:url("../images/menubkg_active.png"); background-repeat: repeat-x; color: #FFFFFF; background-color: #FFFFFF;	 }

/*menu intern*/
#menuintern_wrap { position: absolute; left: 0; bottom: 0; margin: 0; width: 1040px; border: 0px solid;}
#menuintern { position: absolute; bottom: 0px; right: 0; width: auto; padding: 0; margin: 0; z-index: 2; }
#menuintern ul { margin: 0; padding: 0; list-style: none; }
#menuintern ul li { float: left; display: inline; width: auto; border: 0px solid;}
#menuintern ul li a { display: block; text-decoration: none; background: #333; color: #FFF; padding: 10px; text-align: center; border: none; line-height: normal; font-size: 15px;}
#menuintern ul li a:hover { background: #E5E5E5; color: #666666; border: none; margin: 0; left: 0; padding: 10px; width: auto; float: left;}
#menuintern a.active { background: #6ED010; color: #FFF;}
#menuintern img { margin: 0 4px 0 0; padding: 0; border: none;}

/*submenus*/
#submenu { width: 120px; border: 1px solid; background: #333;}
#submenu ul { margin: 0; padding: 0;}
#submenu ul li { text-align: left; overflow: hidden; margin: 0 10px 5px 0; border: 0px solid; background: transparent; text-align: right;}
#submenu ul li a { color: #CCC; font-size: 13px; font-weight: normal; text-decoration: none; margin: 0; height: auto; padding: 0; border: none}
#submenu ul li a:hover { color: #6ED010; }

/*surveycontent ul list*/
#surveycontent { position: relative; top: 0px; margin: 0px 10px 0 10px; border: 0px solid; overflow:visible; background: transparent; }
#surveycontent ul { position: relative; margin: 0; padding: 0; list-style: none; color: black; width: 100%; overflow: hidden;}
#surveycontent li { position: relative; padding: 0; background: transparent; margin: 0; border: 0px solid; overflow:hidden;}
#surveycontent h1 { position: relative; color: #333333; top: 0px; left: 0px; margin: 0 0 10px 0; height: 0px; line-height: normal;}
#surveycontent h1 img { padding: 0; margin: 0; vertical-align: middle; }
#surveycontent h1 a { border: none}
#surveycontent h1 a:hover { border: none; background: none; display: inline; overflow: hidden;}
#surveycontent li p { font-size: 13px;}
#surveycontent a { }

/*labmenu*/
#labmenu { position: absolute; top: 426px; left: 60px; width: 120px; padding: 0; margin: 0 0 0 0px; z-index: 2; background: transparent; display: block; border-bottom: 0px solid #333;}
#labmenu ul { position: relative; margin: 0 0 0 0px; padding: 0; list-style: none; }
#labmenu ul li { overflow: hidden;}
#labmenu ul li a { display: block; text-decoration: none; color: #000; padding: 2px 0 2px 0; text-align: right; background:transparent; border: none; line-height: normal; border-bottom: 0px solid #000;}
#labmenu ul li a:hover { color: #999; }
#labmenu a.active { color: #FFFFFF; margin: 0; padding: 6px 10px 6px 10px; border-bottom: 1px solid #FFF; }

/*personality page*/
#overview { position: relative; top: 0px; margin: 0px 10px 0 20px; border: 0px solid; overflow:hidden; width: 660px; }
#overview ul { position: relative; margin: 0; padding: 0; list-style: none; color: black; width: 100%; overflow: hidden; }
#overview li { position: relative; padding: 0; background: transparent; margin: 0; border: 0px solid #FF6600; overflow:hidden;}
#overview h1 { position: relative; color: #333333; top: 0px; left: 0px; margin: 0 0 20px 0; height: 0px; line-height: normal;}
#overview h1 img { padding: 0; margin: 0; vertical-align: middle; }
#overview h1 a { border: none; }
#overview h1 a:hover { border: none; background: none; display: inline; overflow: hidden;}
#overview h5 { font-size: 18px; color: #333; left: 0; top: 0; margin: 0; border: 0px solid; line-height: normal;}
#overview p { margin: 0;}
#overview li p { font-size: 13px; color: #333333;}
#overview a { font-size: 13px; }

.introhead { font-weight: bold; margin: 0 0 50px 0;}

/*labcontent*/
#labcontent { position: absolute; left: 200px; right: 20px; top: 380px; border: 0px solid;}
#labcontent h5 { font-size: 20px; color: #000; margin: 0 0 20px 0; line-height: 150%; width: 800px;}
#labcontent a { }


#labsearchresults { font-size: 20px; line-height: 150%;}



/*form object public survey*/
.objcon { position: relative; left: 0; top: 0; width: 800px; height: 160px; border-bottom: 0px solid #CCCCCC; margin: 20px 0; }
.objleft { position: absolute; top: 0; background: #FFF; }
.objselect { position: absolute; left: 200px; top: 0px; border: 0px solid;}

#publiclist {}
#publiclist2 { margin: 20px 0 0 40px; }
.frame { position: relative; width: 160px; height: 160px; float:left; border: 1px solid #CCCCCC; background: #FFF; margin: 0 10px 10px 0; padding: 0; text-align: center; }



.frame:hover { border-color: #666666; }
.brandname { font-size: 20px; padding-top: 42%;}

#wordwrap { padding: 10px 0px 0px 0px; border-top: 0px solid #6ED010; border-right: 2px solid #6ED010; width: 120px;}
#wordwrap select { width: 100px;}
.threewords { border-bottom: 2px solid #6ED010; }

#ecosystemlink { position: absolute; right: 8px; bottom: 10px; z-index: 10; border: 0px solid #F60; }
#ecosystemlink a { border: none;}

#publiclist a { position: relative; display: inline; color: #333333; border: none;}
#publiclist a:hover { color: #CCC; }
#publiclist img { float:left; border: 0px solid #CCCCCC; margin: 0 10px 10px 0;}
#publiclist img:hover { border: 0px solid #333; }
#publiclist2 a { position: relative; display: inline; color: #333333; }
#publiclist2 img { float:left; border: none; margin: 0 10px 10px 0;}
#publiclist2 img:hover { border: none; }

#publiclist .colorname a { padding-top: 42%; padding-bottom: 46%; display: block; height: 100%; color: transparent; }

#publiclist .labsymbolname a { padding-top: 42%; padding-bottom: 46%; display: block; height: 100%; color: transparent;) }

.myid_wrap { position: relative; width: 1010px; height: auto; padding: 0; border: 0px solid #333; }
.myid_box { position: relative; border: 0px solid #999; color: #000; width: auto; top: 0px; padding: 45px 10px 10px 20px; background: #F5F5EB; -moz-border-radius: 2px; -webkit-border-radius: 2px; }

.myid_title { position: absolute; border: 0px solid #999; color: #333; width: 120px; height: auto; top: 1px; left: 1px; padding: 5px 20px 5px 10px; background: #6ED010; z-index: 2; -moz-border-radius: 2px; -webkit-border-radius: 2px; display: block; font-size: 15px; font-size: 15px }

.change { position: absolute; top: 8px; right: 100px; width: 150px; height: 20px; border: 0px solid; text-align: right; }
.change img { margin: 0; vertical-align: bottom;}
.change a { color: #000000; font-weight: bold; border: none; margin-right: 10px;}
.change a:hover { background: none;}

#myid_nav { position:absolute; right: 10px; bottom: 5px; font-size: 13px; }
#myid_nav a { border: none; }

.back { position: fixed; top: 100px; left: 30px; width: 40px; height: 40px; border: 0px solid; z-index: 20; background: #6ED010; -moz-border-radius: 20px; -webkit-border-radius: 20px; }
.back img { position: absolute; top: 5px; left: 3px; margin: 0; vertical-align: bottom;}
.back a { color: #000000; font-weight: bold; border: none; margin-right: 10px; left: 0; padding: 0;}
.back a:hover { color: #FFFFFF; display: block;}

.backmain { position: absolute; top: 340px; left: 78px; width: auto; height: 30px; border: 0px solid; z-index: 20;}
.backmain img { margin: 0; vertical-align: bottom;}
.backmain a { color: #000000; font-weight: bold; border: none; margin-right: 10px; left: 0; padding: 0;}
.backmain a:hover { color: #FFFFFF; display: block;}

.up { position: relative; width: 50px; height: auto; border: 0px solid; z-index: 20; margin: 0 0 100px 30px; -moz-border-radius: 20px; -webkit-border-radius: 20px; }
.up img { margin: 0; vertical-align: bottom;}
.up a { color: #000000; font-weight: bold; border: none; margin-right: 10px; left: 0; padding: 0;}
.up a:hover { color: #FFFFFF; display: block;}

.enter { position: absolute; right: 0; top: 0; width: 80px; height: 40px; padding: 0; text-align: right; border: 0px solid; -moz-border-radius: 2px; -webkit-border-radius: 2px;}
.enter a { color: #333333; font-weight: bold; border: none; margin: 0; position: absolute; top: 10px; left: 12px;}
.enter a:hover { color: #FFFFFF; background: none;}

#diary { position: relative; width: 500px; top: 0; border: 0px solid; margin: 0 0 0 20px; float: left; overflow: hidden; }
#diary ul { margin: 0; padding: 0; list-style: none; color: black; width: 100%; overflow: hidden; }
#diary li { position: relative; padding: 0px; margin: 0 0 2px 0;-moz-border-radius: 2px; -webkit-border-radius: 2px;}
#diary h1 { position: relative; font-size: 20px; color: #333333; left: 0px; margin: 0 0 20px 0; height: 30px; line-height: normal; float: none;}
#diary h1 img { padding: 0; margin: 0; vertical-align: middle; }
#diary h1 a { border: none; }
#diary h1 a:hover { border: none; background: none;}
#diary p { }


#frontlinks a, a:hover { border: none; background: none; margin: 0; display: block; height: 100%; width: 100%;}


#gotodiary a { border: none; background: none;}
#gotodiary a:hover { border: none; background: none;}

#trytarot a { border: none; background: none;}
#trytarot a:hover { border: none; background: none;}


#timeloop { position: absolute; z-index: 30; border: 0px solid; width: 80px; height: 40px; background: transparent}
.timeloop_intern { left: 20px; top:134px; }

#timeloopintern { position: absolute; z-index: 30; display:none; left: 20px; top:134px; border: 0px solid; width: 80px; height: 40px; background: transparent }
#maintimeloop { position: absolute; z-index: 30; width: 20px; height: 20px; top: 360px; left: 26px; border: 0px solid;}


/*tarot*/
#tarotcards a { border: none;}
#tarotresult .tarotcards { float: left;}

/*surveycontentlist*/
.surveycontentlist { border: 0px solid #FF6600; -moz-border-radius: 0; -webkit-border-radius: 0;}
.surveycontentlist label {}
.surveycontentlist a {}
.surveycontentlist img {}
.surveycontentlist h5 { position: relative; font-size: 13px; margin: 0 0 0px 0px; height: auto; color: #000000;}
.surveycontentlist h6 { position: relative; font-size: 13px; margin: 0 0 10px 0; display: block; height: 20px;}
.liall { }
.liall h3 { line-height: normal; height: auto; margin: 0; padding: 0;}
.liall h3 a { border: none; background }
.liall h3 img { vertical-align: middle; }
.who {}
.mainimg { position: relative; border: 0px solid; float: left; display: block;}

/*result areas listed*/
.wrap { margin: 0 0 0 0px; border: 0px solid #F60; padding: 10px; background: #F5F5EB; -moz-border-radius: 2px; -webkit-border-radius: 2px; overflow: hidden; }
.resultwrap {position: relative; right: 0px; left: 84px; top: 30px; margin: 0 0 80px 0; padding: 0; width: 470px; height: auto; border: 0px solid #FFFFFF }
.explain { display: none;}
#result_description p { margin: 0 0 20px 0;}
#result_description a { color: #FFF; border-bottom: 1px solid; }
.header { height: 80px; border: 1px solid; }
.header h1 { font-size: 30px; line-height: normal; color: #FF6600; padding: 0; margin: 10px 0 0 0;}

#formpistresult { margin: 40px 0 0 0; padding: 40px 0 40px 0 ; border-top: 0px solid #FFF; border-bottom: 0px solid #FFF; }
#formpistresult h2 { color: #333; margin: 0;}
#formpistresult p { color: #333; }
#wordresult { border: 1px dotted #CCC; padding: 30px; margin: 20px 0 40px 0;}

.htitle { font-size: 20px; color: #333; position: relative; top: 0px; line-height: normal; padding: 10px 10px 10px 10px; background: #333; margin: 0 20px 0px 20px; width: 990px; display: none;}
.htitle_result { font-size: 20px; color: #FFF; position: relative; top: 12px; line-height: normal; padding: 10px 10px 10px 10px; background: #333; -moz-border-radius: 2px; -webkit-border-radius: 2px; margin: 0 0px 22px 20px; width: 990px;}

#yellow_title { position: relative; top: 0px; margin: 0 0 10px 20px; width: 990px; height: auto; border: 0px solid; padding: 20px 0 20px 20px; background: url('../images/bkg_yellow.png') top right #FC0 no-repeat; font-size: 20px; line-height: 120%; text-align: center }

#green_title { position: relative; top: 0px; margin: 0 0 10px 20px; width: 990px; height: auto; border: 0px solid; padding: 40px 0 40px 20px; background: #6ED010; font-size: 20px; line-height: 120%; text-align: center; color: #FFF; }
#green_title a { color: #FFF; border-color: #FFF;}
#green_title u { border-bottom: 2px solid #FFF; }

#brown_title { position: relative; top: 0px; margin: 0 0 10px 20px; width: 990px; height: auto; border: 0px solid; padding: 40px 0 40px 20px; background: #524738; font-size: 20px; line-height: 120%; text-align: center; color: #FFF; }
#brown_title a { color: #FFF; border-color: #FFF;}
#brown_title u { border-bottom: 2px solid #FFF; }

.ibox { position: relative; float:left; margin: 0 4px 4px 0; border: 1px solid #ccc; width: 100px; height: 100px; background: #FFF; -moz-border-radius: 0px; -webkit-border-radius: 0px; overflow:hidden;}
.ibox img { width: 100px; border: none; margin-top: 0px;}
.iboxtext { font-size: 13px; margin: 8px 0 0 8px; color: #CCC;}
.iboxtop { position:absolute; background: transparent; width: 100%; color: #CCC; font-weight: normal; height: 20px; display: none;}
.iboxcount { position: absolute; right: 0px; padding: 0 5px 0 2px; margin: 0; top: 0; border: none; background: #FFF; white-space: nowrap; font-size: 10px; color: #333; width: auto; min-width: 10px ;height: 16px; z-index: 2; text-align: right;}
.iboxbrand { position: absolute; top: 30px; left: 10px; font-size: 16px;}



.small_note { font-style:italic; color: #333; font-size: 11px }

.behaviorcube { position: absolute; width: 100px; height: 100px; background: url("../images/cube_behavioratt.png") no-repeat; z-index: 0; display: none;}


#persdetails { position: absolute; top: -15px; left: 315px; width: 500px; height: 30px; border: 0px solid; }
#persdetails a { color: #999; font-weight: bold; border: none; margin-right: 10px; font-size: 11px; }
#persdetails a:hover { color: #FFFFFF;}




/*form basic*/
form { margin: 0; padding: 0;}
input { display: block; float: left; clear: both; margin: 0 0 10px 0; }
select { margin: 0; margin-bottom: 10px; width: 200px; font-size: 14px; }
textarea { display: block; padding: 1px 0 1px 0; border-style: solid; border-width: 1px; border-color: #333 #ccc #ccc #999 ; margin: 0 0 10px 0; width: 300px; height: 80px; font-size: 14px; font-family: arial, helvetica, sans-serif;}
fieldset { padding: 0; border: none; height: auto; margin: 0 0 10px 0; border: none; width: auto; height: auto;}
legend {position: relative; margin: 0; padding: 0 0 5px 0; font-weight: bold; font-size: 13px; color: #333333;}
label { color: #333333; display: block; clear: both; font-size: 12px;}
input[type="submit"], input[type="button"] { display: block; width: auto; font-size: 13px; margin: 10px 10px 0 0; padding: 3px 10px 3px 10px; background: url("../images/menubkg.png") 0px 0px repeat-x #CCCCCC; color: #FFFFFF; border: none; float: left; clear: left; -moz-border-radius: 10px; -webkit-border-radius: 10px; z-index: 100;}
input[type="reset"] {  display: block; width: auto; font-size: 13px; margin: 20px 10px 0 0; padding: 3px 10px 3px 10px; background: url("../images/menubkg.png") 0px 0px repeat-x #CCCCCC; color: #FFFFFF; border: none; float: left; clear: none; -moz-border-radius: 10px; -webkit-border-radius: 10px;}
input[type="text"] { padding-top: 3px; padding-bottom: 3px; border-style: solid; border-width: 1px; border-color: #333 #ccc #ccc #999 ; margin: 0; margin-bottom: 10px; width: 200px; font-size: 14px; }
input[type="password"] { padding-top: 3px; padding-bottom: 3px; border-style: solid; border-width: 1px; border-color: #333 #ccc #ccc #999 ; margin: 0; margin-bottom: 10px; width: 200px; font-size: 14px; }
input[type="file"] { padding-top: 3px; padding-bottom: 3px; border-style: solid; border-width: 1px; border-color: #333 #ccc #ccc #999 ; margin: 0; margin-bottom: 10px; width: 200px; font-size: 14px; }
input[type="checkbox"] { margin: 0 8px 0 0; padding: 0; float: left; clear: none; display: inline;}
input[type="radio"] { margin: 0 8px 0 0; padding: 0; float: left; clear: none; display: inline;}
input[type="hidden"] { margin: 0; padding: 0;}

/*for radio and checkboxes general*/
.surveyboxwraph { }
.surveyboxh { position: relative; display: inline; width: auto; height: 15px; margin: 0 10px 5px 0;}
.surveyboxh input { position: relative; display: inline; width: auto; margin: 0 5px 0 0; border: none; background-color: transparent; height: auto; float: none;}
.surveyboxh label { position: relative; margin: 0; display: inline; border: 0px solid; clear: none; }

.surveyboxwrapv { }
.surveyboxv { position: relative; display: inline; width: auto; display: block; height: 15px; clear: both; margin: 0 0 5px 0;}
.surveyboxv input { position: relative; display: inline; width: auto; margin: 2px 5px 0 0; border: none; background-color: transparent; float: left; clear: none; height: auto;}
.surveyboxv label { position: relative; margin: 0; display: inline; float: left; border: 0px solid; clear: none;}

/*radio container*/
.radiocontainer { position: relative; left: 0px; top: 0; width: 600px; height: 20px; border: 1px solid transparent; margin: 0 0 30px 0;}
.radioholdernormal { position: absolute; left: 50px; top: 0px; border: 0px solid; height: 20px; width: 330px;}
.leftword { position: absolute; top: 0; }
.rightword { position: absolute; left: 380px; top: 0 }

#quecontent { position: relative; top: 0px; margin: 20px 0 100px 200px;}
.questionwrap { position: relative; height: 100px; margin: 0 0 20px 0; border: 0px solid #ff6600;}
#qwewrap { padding: 40px; background: #333333; width: 40%; }


/*form pist*/
.pistcontainer { position: relative; left: 0px; top: 0; width: 700px; height: 200px;  border: 0px solid; color: #FFF;}
.leftsymbol { position: absolute; top: 0; }
.rightsymbol { position: absolute; left: 540px; top: 0 }

/*radiobut 15, formpist*/
.radiowrap { position: absolute; left: 150px; top: 75px; width: 400px; height: 20px; margin: 0; padding: 0; border: 0px solid; text-align: center}
.radiowrap input { position: relative; display: inline; margin: 0 5px 0 0; padding: 0; border: normal; height: auto; float: none; }
.radioreset { position: absolute; top: 30px; left: 50px; width: 100%; text-align: left; white-space: nowrap; }
.radioreset input { margin-right: 1px; vertical-align: middle;}
.radioreset label { display: inline; font-size: 12px; color: #666666;}

/*radiobut 15, solo*/
.radiowrap2 { position: absolute; left: 50px; top: 3px; width: 330px; height: 20px; margin: 0; padding: 0; border: 0px solid;}
.radiowrap2 input { position: relative; display: inline; margin: 0 1% 0 0; padding: 0; border: none; height: auto; float: none; }
.radioreset2 { position: absolute; top: 25px; left: 50px; width: 100%; text-align: left; white-space: nowrap; }
.radioreset2 input { margin-right: 1px; vertical-align: middle;}
.radioreset2 label { display: inline; font-size: 12px; color: #666666;}
.big { font-size: 20px;}

.dateselect select { width:auto;}

/*end form basic*/

/*form result*/
label { }
.barholder_old { position: relative; width: 199px; height: 27px; border: 1px solid #CCC; border-right: 1px solid #999; border-left: 1px solid #999; background: url("../images/bar_bkg.png") #FFFFFF; margin: 0 0 10px 0; -moz-border-radius: 0px; -webkit-border-radius: 0px;}
.barholder { position: relative; width: 199px; height: 27px; border: 0px; background: transparent; margin: 0 0 10px 0; border-right: 1px solid #999}
.bar_ol { width: 0; height: 100%; background:url("../images/bar_yellow.png") right top; border: 0px solid;  }
.bar { width: 0; height: 100%; background:#333; border: 0px solid;  }
.bar_red { width: 0; height: 100%; background: #B33000; border: 0px solid;  }
.bar_mark { position: relative; width: 0; height: 100%; background:transparent; border: 0px solid;  }
.bar_vertical { position: absolute; width: 20px; height: 100%; bottom: 0; border: 1px solid #666666; background: url("../images/bar_vertical.png") #FFFFFF}
.dgbarholder { position: absolute; width: 300px; height: 7px; top: 3px; left: 100px; border: 1px solid #CCC; border-right: 1px solid #999; border-left: 1px solid #999; background: url('../images/bar_bkg_green.png') }

.eyeholder { position: relative; width: 200px; height: 60px; border: 0px solid;}
.eyedesc { position: absolute; left: 90px; top: 20px; color: #999; font-style: italic;}

/*end form result*/

/*table*/
.tablelist { width: auto; margin: 0 20px 0 20px; border: 0px solid; padding: 0 10px 0 10px;}
table { display: table; margin: 0; padding: 0; border-collapse: collapse; width: 100%; overflow: hidden }
thead { display: table-header-group; }
tr { display: table-row; border-bottom: 0px solid #FFFFFF;  }
th { display: table-cell; margin: 0; border-bottom: 1px solid #ccc; vertical-align: middle; padding: 5px 5px 8px 0; color: #9C9585; font-weight: bold; text-align: left; text-transform: uppercase; font-size: 80%; font-style:normal; }
td { border-right: 0px solid #FFFFFF; border-bottom: 1px solid #ccc; padding: 8px 5px 8px 0; margin: 0; color: #333; margin: 0 20px 0 0; }
table a { color: #333333; background-color: transparent; border-bottom: 0px solid;}
table a:hover { color: #cccccc; background-color: transparent; border: none;}
table img { border: none;}
.even { }
.odd { }
.tdcenter { text-align: center;}
.even:hover,.odd:hover { background: #FCFEDB;}


#historytable {}
#historytable th { width: auto; text-align: center; padding-right: 0; margin: 0;}
#historytable td { border-right: 1px solid #CCC; width: 30px; height: 40px; text-align: center;}
#historytable .areaarrow { position: relative; left: 0; top: -2px; z-index: 2;}
#historytable a { border-bottom: 1px solid;}

#historytabledesc {}
#historytabledesc td { font-size: 12px; border: none; height: 20px; margin: 0; padding: 0;  }

.activesurvey { background: #FFF; }

#synch_wrap { background: #333; }
#synch_wrap h2 { color:#FFF; }
#synch_wrap .resultwrap p { color: #FFF; }

#synch_wrap_you { background: #333; }
#synch_wrap_you h2 { color:#333; }
#synch_wrap_you .resultwrap p { color: #333; }

/*url('../images/bkg_yellow.png') top right #FFCC00 no-repeat*/

#editarea { position: relative; height: auto; margin: 0px 0px 10px 20px; width: 580px; background: #EFEBD4 ; padding: 40px; -moz-border-radius: 2px; -webkit-border-radius: 2px;}
#editarea h1 { margin: 0 0 10px 0; padding: 0; line-height: normal; height: auto;}
.closeeditarea { position:absolute; top: 20px; right: 20px }
.closeeditarea a, a:hover { border: none; background: none; }
#closelargeview { position:absolute; top: 20px; right: 20px }
#closelargeview a, a:hover { border: none; }

#editarea2 { position: relative; height: auto; margin: 0px 0px 10px 0px; width: 930px; background: #EFEBD4; padding: 40px; -moz-border-radius: 2px; -webkit-border-radius: 2px;}
#editarea2 h1 { margin: 0 0 10px 0; padding: 0; line-height: normal; height: auto;}

.idimagewrap { position: relative; display: inline; margin: 0 10px 10px 0; float: left;}

#user { position: absolute; top: 18px; left: 90px; height: auto; color: #FFFFFF; line-height: normal; padding: 0; font-size: 30px; border: 0px solid; }
#userimage { position: absolute; top: 10px; left: 30px; width: 40px; height: 40px; border: 5px solid #FFF;}
#useradmin { position: absolute; left: 500px; top: 180px;}
#surveynr { position: absolute; right: 0; text-align: right; color: #FFFFFF; top: 0px; font-size: 50%;}
#largeview { position: absolute; z-index: 70; border: 1px solid; width: auto; height: auto; padding: 40px; background: #FFFFFF; top: 0px; left: 0px;}
#largeview img { border: 1px solid #E5E5E5;}
#largeinfo { position: absolute; top: 12px; left: 40px; white-space: nowrap; font-size: 12px; font-style: italic; color: #666666;}


#introblockswrap { position: absolute; left: 20px; background:#F1F1E9; width: 660px; height: 500px; border: 0px solid; }
#introblockswrap div { position: relative; width: 100%; height: 100%; margin: 0 0px 0 0; background:transparent; float: left; border-right: 1px solid #FFF; border-bottom: 1px solid #FFF; overflow:hidden; }
#introblockswrap h2 { position:absolute; top: 10px; left: 10px; z-index: 100; white-space: nowrap; }
#introblockswrap a { position: absolute; border: none; }
#introblocktext { position:absolute; top: 10%; left: 10%; height: 80%; width: 80%; border: 0px solid #333; overflow: hidden; font-size: 16px; line-height: 150%; background: transparent; color: #FFF }
#introblockswrap h5 { position: absolute; left: 10px; top: 10px; font-size: 18px; height: auto; color: #333; }

#introtext { line-height: 150%; }

/*F1F1E9*/

/*colorlist*/
.colorlist { width: 100%; position: relative; height: auto; border: 0px solid;}
.colorlist div  { position: relative; float:left; display: inline; padding: 0; cursor: pointer; border: 4px solid #FFFFFF; margin: 0 5px 5px 0; cursor: pointer; width: 100px; height: 100px; }
.colorlist div:hover { border-color: #666666;}
.colorlist .activecolor { border-color: #000000;}
.colorlist div div { border: none; margin: 5px 0 0 5px; width: 4px; height: 4px; background: #FFFFFF;}
.colorlist .colortop { background: #FFFFFF; width: 100%; left: 0; top: 0; height: 20px; margin: 0; color: #CCCCCC; font-size: 13px; }

.ovcolorlist { width: 100%; position: relative; height: auto; border: 0px solid;}
.ovcolorlist div  { position: relative; float:left; display: inline; padding: 0; cursor: pointer; border: 4px solid #333; margin: 0 4px 5px 0; cursor: pointer; width: 100px; height: 100px; }
.ovcolorlist div:hover { cursor: default;}
.ovcolorlist div div { border: none; margin: 5px 0 0 5px; width: 4px; height: 4px; background: #FFFFFF;}
.ovcolorlist .colortop { background: #333333; width: 100%; left: 0; top: 0; height: 20px; margin: 0; color: #CCCCCC; font-size: 13px; }

/*mycolorlist*/
.mycolorlist { width: 100%; position: relative; height: auto; border: 0px solid;}
.mycolorlist div  { position: relative; float:left; display: inline; padding: 0; cursor: pointer; border: 0px solid #FFFFFF; margin: 0 5px 5px 0; cursor: pointer; width: 100px; height: 100px; }
.mycolorlist div .closeeditarea { position:absolute; top: 20px; right: 20px; background: transparent; padding: 0; margin: 0; border: 0px solid; width: 20px; }
.mycolorlist div:hover { border-color: #666666;}
.mycolorlist .activecolor { border-color: #000000;}
.mycolorlist div div { border: none; margin: 5px 0 0 5px; width: 4px; height: 4px; background: #FFFFFF;}
.mycolorlist .colortop { background: #FFFFFF; width: 100%; left: 0; top: 0; height: 20px; margin: 0; color: #CCCCCC; font-size: 13px; }

.ratingwrap { position: relative; background:url('../images/rating_0.png') no-repeat; border: 0px solid; width: 110px; height: 18px; overflow: hidden;}
.ratingwrap .rating { position: absolute; width: 100%; height: 100%; border: 0px solid; float:left; display: inline; z-index: 1;}
.ratingwrap a { color: transparent; display: block; border: none; background: none; cursor: pointer;}
#ratingswitch { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 0;}

/*symbollist img*/
/*weakness*/
#symbollistw { position: relative; height: auto; margin: 20px 0 0 0; clear: both; width: 100%; }
#symbollistw a { position: relative; display: inline; color: #333333; }
#symbollistw div { position: relative; float:left; border: 4px solid #FFF; margin: 0 10px 10px 0; cursor: pointer; width: 160px; height: 160px; background: #FFF; overflow:hidden; }
#symbollistw img {}
#symbollistw div:hover { border: 4px solid #CCC; cursor: pointer;}
#symbollistw div.activew { border: 4px solid #6ED010; -moz-border-radius: 2px; -webkit-border-radius: 2px;}
#symbollistw .symbolsname { position: absolute; color: #ccc; top: 10px; left: 10px; z-index: 20; background: transparent; font-size: 12px;}

/*strength*/
#symbollists { position: relative; height: auto; margin: 20px 0 0 0; clear: both; width: 100%; }
#symbollists a { position: relative; display: inline; color: #333333; }
#symbollists div { position: relative; float:left; border: 4px solid #FFF; margin: 0 10px 10px 0; cursor: pointer; width: 160px; height: 160px; background: #FFF; overflow:hidden; }
#symbollists img {}
#symbollists div:hover { border: 4px solid #CCC; cursor: pointer;}
#symbollists div.actives { border: 4px solid #6ED010; -moz-border-radius: 2px; -webkit-border-radius: 2px;}
#symbollists .symbolsname { position: absolute; color: #ccc; top: 10px; left: 10px; z-index: 20; background: transparent; font-size: 12px;}

/*brand*/
#brandlists { position: relative; height: auto; margin: 20px 0 0 0; clear: both; width: 100%; }
#brandlists a { position: relative; display: inline; color: #333333; }
#brandlists div { position: relative; float:left; border: 4px solid #FFF; margin: 0 10px 10px 0; cursor: pointer; width: 160px; height: 160px; background: #FFF; overflow:hidden; }
#brandlists div:hover { border: 4px solid #CCC; cursor: pointer;}
#brandlists div.activebrand { border: 4px solid #6ED010; -moz-border-radius: 2px; -webkit-border-radius: 2px;}
#brandlists .thebrandname { position: absolute; color: #333; top: 10px; left: 10px; z-index: 20; background: transparent; font-size: 20px; line-height:120%;}


/*objects*/
#objlist { position: relative; height: auto; margin: 20px 0 0 0; clear: both; width: 100%; border: 0px solid #333;}
#objlist a { position: relative; display: inline; color: #333333; }
#objlist div { position: relative; float:left; border: 4px solid #FFF; margin: 0 10px 10px 0; cursor: pointer; width: 160px; height: 160px; background: #FFF; overflow:hidden; }
#objlist div:hover { border: 4px solid #CCC; cursor: pointer;}
#objlist div.activeobj { border: 4px solid #6ED010; -moz-border-radius: 2px; -webkit-border-radius: 2px;}
#objlist .theobjname { position: absolute; color: #333; top: 10px; left: 10px; z-index: 20; background: transparent; font-size: 20px; line-height:120%;}

#designimg a, a:hover { border: none; }
#designimg img { border: 1px solid #ccc;}

/*intructions*/
#instructions {}
#instructions h5 { color: #FFFFFF;}

#settingsdiv { position: absolute; left: 300px; top: 30px; width: 400px; display: block }
#settingsdiv p { color: #000; }
#settingsdiv h5 { margin: 0 0 10px 0;}

.adm_login_note { position: absolute; top: 60px; left: 320px; width: 250px; padding: 20px; border: 1px solid #FFF; color: #333;}

#settingspaypal p {color: #000;}

#viewwrap a { border: none; background: none; margin: 0 10px 0 0; color: #9C9585;}

#starthelp {}
#starthelp img { border: 0px solid;}
#starthelp .screenshot { border: 1px solid; }

#selectlink { border: 0px solid; overflow: hidden; margin: 0; padding: 0; }
#selectlink div { }
#selectlink a, a:hover { line-height: normal; padding: 0; margin: 0; float: none; border: none; }

.resultnav { position: absolute; top: 0px; right: 0px; color: #333; height: 34px; padding: 5px 12px 0 30px; border: 0px solid; width: auto; background: url('../images/top_corner_result.png') bottom left no-repeat;}
.resultnav a, a:hover { border: none; padding: 0; margin: 0; left: 0; float: none; display: inline;}
.resultnav img { vertical-align: bottom; }

.myresultnav { position: absolute; top: 0px; right: 0px; color: #FFF; height: 28px; padding: 10px 12px 0 30px; border: 0px solid; width: auto; background: url('../images/top_corner_result.png') bottom left no-repeat; text-transform: uppercase;}
.myresultnav a, a:hover { border: none; padding: 0; margin: 0; left: 0; float: none; display: inline;}
.myresultnav img { vertical-align: bottom; }

.navigate { margin: 10px 0 0 0; padding: 0; border: 0px solid;}
div.pagination { margin: 0; padding: 0;}
div.pagination a { margin: 0; padding: 0; display: inline; }
div.pagination span.current  { border: none; width: auto; margin: 0; padding: 0;}

.dateinfo { position: absolute; bottom: 8px; right: 10px; color: #999; border: 0px solid; width: auto; }

/*side bar holder - position*/
#sidewrap { position: absolute; left: 690px; top: 139px; border: 0px solid; height: auto; }

#sidebar { position: absolute; left: 690px; top: 114px; border: 0px solid #999999; margin: 0 0 10px 0; width: 300px; height: auto; overflow: hidden; padding: 20px; background: url('../images/bkg_yellow.png') top right #FC0 no-repeat; -moz-border-radius: 2px; -webkit-border-radius: 2px; z-index: 10; }
#sidebar { background: #6ED010; top: 104px; -moz-border-radius: 0px; -webkit-border-radius: 0px;}
#sidebar ul { margin: 0;}
#sidebar li { margin-bottom: 4px;}
#sidebar a { border-bottom: 1px solid; background: none; }
#sidebar a:hover { border-bottom: 1px solid; color: #FFF; background: none;}
#sidebar h1 { margin: 0 0 10px 0; border: 0px solid; line-height: normal; font-size: 20px; padding: 0 0 2px 0; height: auto; color: #000;}
#surveydate { position: relative; top: 0; border: 1px solid transparent; width: 100%;}

#first_info { position: relative; margin-left: 20px; padding: 0; width: 1010px; font-size: 20px; line-height: 150%; background: #EFEBD4; color: #333; }
#first_info a { color: #333; border-color: #333;}
#first_info a:hover { color: #FFF; border-color: #FFF;}

#adminstartmenu { position: absolute; top: 115px; left: 20px; padding: 20px; width: 610px; font-size: 16px; line-height: 150%; background: #F5F5EB; color: #000; height: auto; }
#adminstartmenu a { color: #333;  font-size: 16px; border-bottom: 1px solid; }
#adminstartmenu li { border: 0px solid; margin: 0 0 10px 0; padding: 1px 0 1px 0;}

#wizard { position: absolute; top: 115px; left: 20px; padding: 20px; width: 610px; font-size: 16px; line-height: 150%; background: url('../images/bkg_yellow.png') top right #FFCC00 no-repeat; color: #000; height: auto; }
#wizard a { color: #FFF; border-color: #FFF;}

#frontdiary { position: relative; margin: 0;}
#frontdiary .tablelist { margin: 0; width: auto; border: 0px solid; padding: 0; }
#frontdiary table { margin: 0; padding: 0; }
#frontdiary ul,li { margin: 0;}
#frontdiary th { margin: 0; padding: 0; display: none; border: none; color: #000;}
#frontdiary td { margin: 0; border: none; padding-top: 3px; padding-bottom: 3px; vertical-align: top; color: #000;}

#history a:hover { color: #FFF;}

div.otherdots { opacity: 0.5; filter: alpha(opacity=50);}

#idtable { }
#idtable a { border: none;}

#kbwrap { position: relative; border: 0px solid #999; margin: 0 0 10px 20px; color: #000; width: 930px; top: 0px; padding: 45px 40px 10px 40px; background: #F1F1E9; -moz-border-radius: 2px; -webkit-border-radius: 2px; height: auto; }
#kbwrap h1 { margin: 0 0 30px 0; line-height: normal; padding: 0;}
#kbwrap img { position: relative; }
#kbwrap p { margin-bottom: 20px;}

/*side menu*/
#side_menu_wrap { position: fixed; width: 20px; height: auto; left: 10px; top: 240px; border:0px solid; background: #6ED010; -moz-border-radius: 2px; -webkit-border-radius: 2px; text-align:center; padding: 8px 0 8px 0; z-index: 40;  opacity:0.8;filter:alpha(opacity=80) }
#side_menu_wrap a { border: none; background: none;}
#side_menu { position: absolute; left: 20px; width: auto; margin: 0; height: auto; top: 0px; background: #6ED010; border: 0px solid #999; padding: 20px; -moz-border-radius: 2px; -webkit-border-radius: 2px; z-index: 10; white-space: nowrap; text-align: left;  opacity:0.8;filter:alpha(opacity=80) }
#side_menu p { line-height: normal; margin: 0 0 5px 0;}
#side_menu a { color: #FFF; border-bottom: 0px solid #FFF;}
#side_menu a:hover { color: #CCC; border-color: #CCC;}

/*extra menu*/
#extra_menu { position: relative; left: 0px; top: 0px; border: 0px solid; width: auto; height: 90px; margin: 0 0 40px 0; z-index: 10; }
#extra_menu a { border: none; background: none; margin: 0 10px 0 0; color: #9C9585;}
#extra_menu a:hover { color: #FFFFFF;  border: none;}
#extra_menu img { border: 0px solid #CCCCCC;}

#extra_explain { border: 1px solid #FFF; background: #333; color: #FFF; margin: 0 0 40px 0; padding: 20px; font-size: 20px; line-height: normal; font-style: italic; font-family: Times; -moz-border-radius: 2px; -webkit-border-radius: 2px;}

/*url('../images/bkg_yellow.png') top right #FC0 no-repeat*/

#perspmenu { position: absolute; z-index:50; background: #333; border: 0px solid #FFF; -moz-border-radius: 3px; -webkit-border-radius: 3px; padding: 4px 4px 4px 4px; top: 0; left: 0; width: auto; opacity:0.8;filter:alpha(opacity=80)}
#perspmenu a { border: none; background: none;}

#mystartmenu { font-size: 16px; }
#mystartmenu li { margin-bottom: 16px; }
#mystartmenu a { font-size: 16px; }

/*accounts*/
#accounts { position: relative; margin: 0px 0 20px 0px; border: 0px solid; text-align: left; width: 100%;}
#accounts .accountwrap { position: relative; width: 30%; height: auto; border: 1px solid #CCCCCC; margin: 0 31px 0px 0; text-align: center; float:left;}
#accounts .accounttop { background: #333; height: auto; font-size: 40px; color: #FFF; padding: 50px 0 50px 0; border-bottom: 1px solid #FFF;}
#accounts .accountbody { text-align: center; padding: 40px 0 0px 0; border: 0px solid #333; border-top: none; height: 300px;}
#accounts p { font-size: 22px; width: auto; margin: 0 0 10px 0; font-weight: bold;}
#accounts .price { position: relative; font-size: 20px; }
#accounts .price br { line-height: 0; margin: 0;}
#accounts .signup { position: relative; font-size: 20px; }
#accounts a { color: #333333; border-color: #333333; }
#accounts a:hover { color: #FFFFFF; background: #333333;; }

#colorarea { position:relative; padding: 0px; background: transparent; }
#colorarea fieldset { float: left; margin-right: 20px;}

#faqmenu { position: relative; padding: 20px;}
#faqmenu ul { }
#faqmenu li { margin: 0 0 5px 0;}

/*login*/
#loginwrap { position: absolute; width: 510px; height: 370px; top: 50%; left: 50%; margin: -185px auto auto -255px; background: #FFFFFF; padding: 0; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
#logincontent { position: absolute; left: 240px; top: 30px;}

#loginlink { position: absolute; right: 15px; top: 15px; z-index: 20; }
#loginlink a, a:hover { border: none; margin: 0; padding: 0;}
#loginlink img { border: 0;}

#notice { position: absolute; left: 30px; top: 70px; z-index: 50; background: #000; color: #FFF; padding: 2px 10px 2px 10px;}

.noanswer { margin: 30px 0 30px 290px; font-size: 50px; font-weight: bold; color: #FFF;}
.noanswer_start { position: absolute; top: 160px; left: 130px; font-size: 80px; font-weight: bold; color: #FFF; border: 0px solid;}
.noanswer_start { position: absolute; top: 160px; left: 130px; font-size: 80px; font-weight: bold; color: #333; border: 0px solid;}
.noanswer_left { margin: 30px 0 30px 30px; font-size: 50px; font-weight: bold; color: #FFF;}

#featurelist { margin: 0; background: #FFF; padding: 0px;}
#featurelist ul { }
#featurelist li { margin: 0 20px 10px 0px; padding: 0 0 0 20px; font-style: italic; font-weight: normal; color: #333;list-style-type: none; background:url("../images/heart_xsmall.png") no-repeat 0px 3px;}
#featurelist a { }

.result_per_detail { padding: 30px; background: #847052; }

#setareamenu li { margin-bottom: 10px; border: 0px solid;}
#setareamenu img { vertical-align: bottom;}

#friendmenu { position: relative;}
#friendmenu li { margin-bottom: 10px; border: 0px solid;}
#friendmenu img { vertical-align: bottom;}

#conclusionstatement { position: relative; border: 0px solid #FFF; padding: 0px; margin-top: 20px;}
#result_description #conclusionstatement p { color: #FFF; font-size: 20px; margin: 0 0 10px 0; }

#conclusionstatement_you { position: relative; border: 0px solid #FFF; padding: 0px; margin-top: 20px;}
#result_description #conclusionstatement_you p { color: #333; font-size: 20px; margin: 0 0 10px 0; }

.ovdiary_personal { padding: 0px; font-style: italic; color: #333;}
.diary_date { color: #333; font-weight: bold;}

#feelnavigation a { border: none;}

#feelingsdiary {  }
#feelingsdiary .fdwrap { border-bottom: 1px solid; }




/*dgwordsize*/
.dgwordsize_1 { font-size: 20px;}


/*rails basic*/
.fieldWithErrors { display: inline; }
.fieldWithErrors input {  }
.fieldWithErrors select {  }
.fieldWithErrors input[type="checkbox"] { }
#errorExplanation { width: 400px; padding: 7px; padding-bottom: 12px; margin-bottom: 20px; background-color: #FFF; }
#errorExplanation h2 { text-align: left; font-weight: bold; padding: 5px 5px 5px 15px; font-size: 12px; margin: -7px; background-color: #000000; color: #FFFFFF; display: none;}
#errorExplanation p { margin: 10px 0 0 5px; padding: 5px; }
#errorExplanation ul li { font-size: 12px; list-style: none; margin: 0 0 0 10px;}
div.uploadStatus { margin: 5px; }
div.progressBar { margin: 5px; }
div.progressBar div.border { background-color: #fff; border: 0px solid #666666; width: 100%; }
div.progressBar div.background { background-color: #333;}
/*--rails basic*/


/*will_paginate*/
.pagination {
    padding: 2px;
    margin: 2px;
  }
  .pagination a {
    padding: 2px 2px 2px 2px;
    margin: 2px;
    border: 0px solid #aaaadd;
    text-decoration: none;
    color: #333333;
  }
  .pagination a:hover, .pagination a:active {
    border: 0px solid #000099;
    color: #666666;
	background: none;
  }
  .pagination span.current {
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border-bottom: 1px solid;
    font-weight: bold;
    color: #333333;
  }
  .pagination span.disabled {
    padding: 2px 5px 2px 5px;
    margin: 2px;
   
    color: #ddd;
  }