/* STYLES SHARED IN ZONE3 & ZONE1 */
/* This file must be the same in both apps. Please copy all the changes */

/* HTML ELEMENTS */
body,div,form,label,fieldset,legend,img,p,h1,h2,h3,h4,h5,ul,ol,li,table,td,tr,th,input {
border:0;
color:#555;
font-family:Arial, Helvetica;
margin:0;
padding:0;
}

body {
font-size:0.8em;
min-width:918px;
text-align:center;
background:url(/media/images/bg/grad.jpg) repeat-y;
background-position: center center;
}

a {
color: #47177a;
text-decoration:none;
}

a:hover {
text-decoration:underline;
}

h1
{
	color: #333;
	font-family: Arial, Helvetica;
	font-size: 1.6em;
	font-weight: normal;
	line-height: 26px;
	padding-left:0px;
}

h2
{
	color: #333;
	font-family: Arial, Helvetica;
	font-size: 1.6em;
	font-weight: normal;
	margin-left: 10px;
}

h1.homeTitle {
font-size:1.6em;
color: #47177a;
font-weight: normal;
}

h2.homeSubtitle {
font-size:1.6em;
color: #47177a;
font-weight: normal;
}

h3 {
font-size:1.3em;
color: #47177a;
}

h4 {
clear:both;
font-size:1.1em;
color: #47177a;
}

h5 {
clear:both;
font-size:1em;
font-weight:400;
color: #47177a;
}

input, select, textarea {
font-size:1em;
border: 1px solid #9c9b9a;
padding: 1px;
color:#000;
font-family:Arial, Arial, Helvetica;
}

input.img-btn{
   border-width:0px;
}

hr {
background-color: #e5e5e5;
border: 1px solid #e5e5e5;
height:0;
}

p {
margin-bottom:10px;
}



/***************************************************************************************
 TEMPLATE ELEMENTS */

.container {
margin:0 auto;
text-align:left;
width:918px;
background-color: #fff;
}

.menu { 
height: 30px;
background-color: #70bb3b;
display: block;
margin: 0;
padding: 0;
}

.content {
clear:both;
}

.headlines {
clear:both;
}

.home {
width:642px;
}

.main {
float:left;
padding:10px 10px 10px 0;
}

.main h2, .main h1 {
margin-bottom: 10px;
}

.main h3 {
margin-bottom: 20px;
}

.home h2 {
}

.sidebar {
float:right;
width:262px;
padding:10px 0;
margin-top:5px;
}

.footer {
clear:both;
padding:15px 10px 20px;
border-top: 1px solid #CCC;
background-color: #fff;
height: 50px;
}

.footer p {
margin:0;
font-size: 11px;
}

* html .footer {
height:1px;
}

/***************************************************************************************/
/* COMMON ELEMENTS */

.white {
color:#fff;
}

.black {
color:#000;
}

.dark-grey {
color:#555 !important;
}

.purple {
color: #47177a;
}

.left {
float: left;
}

.right {
float: right;
}

.bottom{
position:absolute;
bottom:0px;
right:5px;
}

.clear {
clear: both;
}

.italics {
font-style: italic;
}

.italicTitle{
   color: #333;
   font-style: italic;
   font-size:1.1em;
   font-weight:normal;
   margin-bottom:10px;
}

.no-border {
border: 0;
}

.hidden {
display: none;
}

.top20 {
margin-top: 20px;
}

.left10 {
margin-left: 10px;
}

.ddlSmall{
   width:200px;
}

.txtSmall{
   width:200px;
}

.txtLarge{
   width:400px;
   height:200px;
}

.txtMed{
   width: 400px;
   height:100px;   
}

.txtLong{
   width: 400px;
}

.chk, .chk input{
   border:none !important;
   vertical-align:middle;
   margin-right:3px;
}

.rbl, .rbl input{
   border:none !important;
   vertical-align:middle;
   margin-right:3px;
}

.lnkBtn, .lnkPurple{
   text-decoration:underline;
}

.btn{
   color:#fff;
   border:none !important;
   cursor:hand;
   cursor:pointer;
   text-align:left;
	height: 24px;
	min-width: 80px;
	font-style: normal;
	font-weight: bold;
	font-size: 12px;
	padding: 3px;
	padding-top:0px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
}

input.btn:hover, .btn:hover{
   background-color:#70bb3b;
}

.purple{
   background-color:#47177a;
}

.blue{
   background-color:#0099ff;
}

.tmb{
   width:40px;
}

.smallestGap{
   height:5px;
}

.smallerGap{
   height:10px;
}

.smallGap{
   height:20px;
}

.mediumGap{
   height:30px;
}

.largeGap{
   height:40px;
}

/***************************************************************************************/
/* FROMS */

.form{
   padding-left:30px;
}

.formRow{
   display:block;
   margin-top:10px;
   margin-bottom:10px;
   clear:both;
}

.formRow .value{
   margin-left:160px;   
   display:block;
}

.formCaption{
   float:left;
   font-weight:bold;
   color:#681888;
   width:150px;
   padding-right:10px;
   display:block;
}

.formButtons{
   text-align:right;
   padding-right:30px;
   margin-top:20px;
   margin-bottom:20px;
   color:red;
}


.formItem{
   min-width:410px;
}

.formItem .tmb{
   vertical-align:top;
}

.formItem input.fileUpload{
   width:200px;
}

/***************************************************************************************/
/** begin calendar **/
.calendar .ajax__calendar_header,
.calendar .ajax__calendar_today {
   color: blue;
   text-decoration: underline;
}
.calendar .ajax__calendar_container {
   background: white;
   border: 1px solid black;
   z-index: 999;
}
.calendar .ajax__calendar_dayname {
   font-weight: bold;
}
/** end calendar **/

/***************************************************************************************/
/** BEGIN RESULTS **/

.tblResults{   
   border: solid 1px #ccc;
   width:98%;
}

.comments{
   border:none;
}

.resultsRow{
}

.resultTmbContainer{
   vertical-align:top;
   width:75px;
   padding-left:5px;
   padding-bottom:10px;
   padding-top:5px;
   border-bottom:solid 1px #ccc;
}

.resultsTmb{
   vertical-align:top;
   width:60px;
}

.reslultInfoContainer{
   vertical-align:top;
   padding-bottom:10px;
   padding-right:5px;
   padding-top:5px;
   border-bottom:solid 1px #ccc;
}

.resultsInfo{
   font-size:0.7em;
}

h4.resultsTitle{
   font-size:0.8em;
   margin-bottom:5px;
}


/** END RESULTS **/

/***************************************************************************************/

/** START NAVIGATION **/

.navigation {
   float: none;
   clear: left;
   margin: 0;
   padding: 0;
	border-bottom: solid 2px #47177a!important;
	height:27px;
	width:100%;
}

.navigation ul {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}

.navigation li {
	float: left;
	list-style-type: none;
	margin: 0 2px 0 0;
	text-align: center;
	font-size:1em;
	text-align:left;
}

.navigation a {
	background-color: #fff;
	color: #47177a;
	font-weight: bold;
	padding-left: 0px;
	text-decoration: none;
	height:20px;
	width:145px;
}

.navigation a span {
	background-color: #fff;
	color: #47177a;
   position: relative;
   right: -6px;
	cursor: hand;
	cursor: pointer;
	font-weight: bold;
	height: 10px;
	padding: 5px 7px 2px 5px;
   margin: 0 0 0 -6px;
}

.navigation a,
.navigation a span {
	display: block;
	float: left;
}

.navigation a.selected {
	background-color: #47177a;
	color: #fff;	
	padding-left: 0px;
	text-decoration: none;
}

.navigation a.selected span {
	background-color: #47177a;
	color: #fff;
}

.navigation a:hover {
	padding-left: 0px;
	background-color: #cccccc;
	color: #fff;	
}

.navigation a:hover span {
	padding-right: 7px;
	background-color: #cccccc;
	color: #fff;	
}

/** END NAVIGATION **/

/***************************************************************************************/

.menu ul {
padding:0 !important;
margin:0 !important;
padding-left:10px !important;
}

.menu .left {
width:645px !important;
position:relative;
}

.menu .right {
width:262px !important;
background-color: #47177a;
height:30px;
}

.menu li { 
display: block;
float: left;
list-style-type: none;
}

.menu a { 
float: left;
display: block;
height: 23px;
padding: 7px 7px 0 7px;
color: #FFF;
text-decoration: none;
letter-spacing: 0.4px;
font-size: 12px;
}

.menu .highlighted {
font-weight:bold;
}

.menu a:hover { 
color: #47177a;
}

.menu .right a:hover{
   color:#70bb3b;

}

.menu a.open-menu { 
color: #FFF;
}

.pulldown-outer { 
   width: 150px;
   padding: 0 0 9px 0;
   position: absolute;
   display: none;
   filter: alpha(opacity=95);
   khtml-opacity: 0.95;
   moz-opacity: 0.95;
   opacity: 0.95;
}

.pulldown-inner { 
   display: block;
   margin: 0;
   overflow: hidden;
   background-color: #FFFFFF;
}

.pulldown-inner a{
   width: 150px;
   height:22px;
   padding: 5px 5px 5px 5px;   
   color:#47177a;   
   font-weight:bold;
}

.pulldown-inner a:hover{
   color:#47177a;   
   text-decoration:none;
   background-color:#E8E5E5;
}

.pulldown-inner li { 
   display: block;
   padding: 0;
   margin: -1px 0 0 0;
   list-style-type: none;
}

.pulldown-inner a { 
   display: block;
   padding: 1px 15px;
   background-color: #FFFFFF;
   color: #47177a;
   text-decoration: none;
   filter: alpha(opacity=95);
   khtml-opacity: 0.95;
   moz-opacity: 0.95;
   opacity: 0.95;
}

.quick-search {
padding-top:5px;
font-weight:bold;
}

.quick-search input {
float:left;
position:absolute;
right:31px;
border:none;
height: 19px;
width: 150px;
font-style: italic;
font-weight: normal;
font-size:12px;
color: #666;
padding: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
}

.quick-search a {
float:left;
position:absolute;
right:0;
top:0;
}


.banner img {
width: 918px;
height: 141px;
margin-bottom:5px;
}

.main-360 {
background-color:#E8E5E5;
padding: 15px 10px 10px 10px;
margin-top:25px;
margin-bottom:10px;
overflow: hidden;
height:280px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
}

.main-360 h2 {
padding-bottom:5px;
margin-left: 0px;
}

.main-360 p {
padding-top:0px;
margin-bottom:5px;
color: #444;
}

.main-4col {
clear:both;
}

.main-4col .panel {
-moz-box-sizing:border-box;
box-sizing:border-box;
width:153px !important; /*moz width*/
width:151px; /*IE width*/ 
height:260px;
padding:12px 10px 5px 10px; 
overflow: hidden;
margin-right: 10px;
margin-bottom: 10px;
float: left;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
}

.main-4col .last {
margin-right: 0;
}

.main-4col h4 {
padding-bottom: 5px;
border-bottom: 1px dotted #bbb;
}

.main-4col p {
font-size: 13px;
padding-top: 10px;
}

.main-4col a {
font-size: 13px;
}

.main-4col .purple {
background-color: #47177a;
position:relative;
}

.main-4col .purple h4 {
color: #fff;
}

.main-4col .purple p {
color: #fff;
}

.main-4col .purple a {
color: #fff;
}

.main-4col .grey {
background-color: #777;
position:relative;
}

.main-4col .grey h4 {
color: #fff;
}

.main-4col .grey p {
color: #fff;
}

.main-4col .grey a {
color: #fff;
}

.main-4col .green {
background-color: #70bb3b;
position:relative;
}

.main-4col .green h4 {
color: #fff;
}

.main-4col .green p {
color: #fff;
}

.main-4col .green a {
color: #fff;
}

.main-4col .blue {
background-color: #0099ff;
position:relative;
}

.main-4col .blue h4 {
color: #fff;
}

.main-4col .blue p {
color: #fff;
}

.main-4col .blue a {
color: #fff;
}

.site-tour {
height: 94px;
background-color: #4a4849;
background-image:url(../media/Images/site_tour.gif);
background-repeat:no-repeat;
background-position-x:305px;
padding: 10px;
clear:both;
}

.site-tour h4 {
padding-bottom: 15px;
color: #fff;
}

.site-tour p {
color: #fff;
}

.sidebar .box {
background-color: #E8E5E5;
border-top: 2px solid #47177a;
margin-bottom: 10px;
padding-bottom:10px;
}

.sidebar .welcome {
height: 63px;
overflow: hidden;
margin-bottom: 10px;
background-color: #E8E5E5;
}

.sidebar .welcome .text {
padding:10px;
float: left;
}

.sidebar li {
list-style-type: none;
color: #6d6665;
float: left;
}

.sidebar li a {
display: block;
float: left;
padding: 0 5px;
}

.sidebar li.last {
border-right: 0;
}

.sidebar .welcome .text h4 {
margin-bottom:10px;
}

.sidebar h3 {
padding-bottom: 15px;
font-size:1em;
}

.login {
padding: 10px 10px;
}

.field {
display: block;
padding-bottom: 5px;
}

.field .name {
float: left;
display: block;
width: 60px;
margin-top:5px;
margin-right:4px;
font-size:12px;
}

.login-btn {
clear: both;
}

.login-btn span {
display:block;
}

.sidebar .panel {
clear: both;
}

.sidebar .panel h3 {
padding-top: 5px;
padding-left: 10px;
padding-bottom:8px;
}

.panel .body {
padding: 10px;
clear:both;
}

.img-btn {
margin-bottom: 10px;
border-width: 0px;
}

.no-border input, .no-border select, .no-border textarea {
border: 0;
}

.groups {
width: 415px;
}

.group-tour {
float: right;
padding:10px;
}

.paricipant-area {
margin-bottom: 10px;
}

.my-assesment {
padding:10px;
background-color: #47177a;
margin-bottom: 10px;
}

.my-assesment a {
color: #fff;
font-size: 1.2em;
}

.accordionHeader {
padding: 7px;
border-top: 2px solid #47177a;
cursor:pointer;
}

.accordionOffHeader {
padding: 7px;
border-top: 1px solid #47177a;
cursor:pointer;
}

.accordionOffHeader h4 {
font-weight: normal;
}

.accordionContent {
background-color: #E8E5E5;
border: 1px #7b1877;
padding: 10px;
}

.search {
margin-bottom: 10px;
clear:both;
}

.search input {
margin-bottom: 5px;
}

.options {
clear: both;
}

.options .panel {
float:left;
width: 209px;
height:87px;
border-bottom: 1px solid #CCC;
padding:15px 10px;
overflow: hidden;
}

.panel .blurb {
margin-left: 10px;
width:160px;
float: left;
}

.panel .blurb h4 {
margin-bottom: 10px;
}

.news-ticker {
background-color: #e4e2e1;
padding: 10px;
margin-bottom:10px;
}

.news-ticker div {
color: #47177a;
}

.360-team {
clear: both;
height: 141px;
overflow: hidden;
}

.profile-info {
clear: both;
position: relative;
margin-top: 20px;
width: 640px;
}

.profile-info ul {
height:24px;
border-bottom: 3px solid #47177a;
}

.profile-info li {
float: left;
list-style-type: none;
}

.profile-info li span, .profile-info li a {
display:block;
padding:5px;
}

.profile-info li span {
background-color: #47177a;
color: #fff;
}

.profile-info li a {
background-color: #fff;
color: #47177a;
}

.profile-info li a:hover {
background-color: #dbd9d7;
color: #47177a;
text-decoration:underline;
}

.profile-info edit {
position: absolute;
right: 0;
}

.profile-field {
clear: left;
}

.profile-field .name {
display: block;
float: left;
width: 150px;
font-weight: bold;
padding-top: 20px;
}

.profile-field .value {
float: left;
width: 485px;
padding-top: 20px;
}

.recently-updated {
clear: both;
margin-top: 10px;
}

.recently-updated .panel {
width:138px;
height:214px;
padding:5px;
overflow: hidden;
margin-right: 15px;
margin-bottom: 10px;
float: left;
border-top: 1px solid #AAA;
}

.recently-updated .last {
margin-right: 0;
}

.recently-updated h4 {
padding-bottom: 15px;
}

.recently-updated p {
font-size: 0.9em;
}

.white-hr {
background-color: #fff;
border: 1px solid #fff;
height:0;
}

.footer a {
color: #47177a;
font-size: 11px;
margin:0;
}

.footer li {
border-right: 1px solid #ccc;
color: #70bb3b;
display: inline;
list-style-type: none;
padding-left: 10px;
padding-right: 10px;
}

.footer li.last {
border-right: 0;
}

.copyright {
padding:10px 0;
}

.homePic{
   width:303px; 
   height:203px; 
   float: right; 
   padding-left: 10px;
}

.loginRegister{
   height:30px;
   font-size:1em;
   font-weight:bold;
}

.loginTab{
   float:left;
   width:50%;
   color:#fff !important;
   border-bottom:solid 2px #4a4646;
}

.registerTab{
    background:url(../media/Images/grey_head.gif) repeat-x;
	float:left;
	width:50%;
	color:#fff !important;
	border-bottom:solid 2px #4a4646;
	cursor: pointer;
	cursor: hand;
}


.myProfileTab{
   float:left;
   width:100%;
   color:#fff !important;
   border-bottom:solid 2px #4a4646;
}

.error{
   color:Red;
}

.viewPic{
     max-width:400px;
  width: expression(this.width > 400 ? 400: true);
}

.twtr-hd, .twtr-ft{
   display:none;
   height:0px;
}

.twtr-bd{
   font-size:0.9em;
}

.twtr-widget .twtr-tweet-wrap{
   padding:0 !important;
   margin:0;
}

.twtr-widget p{
   line-height:1em !important;
}

.twtr-widget a{
   text-decoration:none !important;
}

/** JO added styles **/

.transparent {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 1em;
}

/** End JO added styles **/

.red {

   color:Red;
}

.bottomLinks{
   padding-left:0px;
   margin-left:0px;
}

.loginTmb{
   vertical-align:top;
   float:right;
   display:inline;
}

span.searchLable{
   width:85px;
   display:block;
   padding-right:5px;
   float:left;
}

.search .formRow{
   margin-top:5px;
   margin-bottom:5px;
}

.search .formRow select{
   font-size:0.9em;
   width:152px;
}

hr.searchSeparator{
   display:block;
   color:#555555;
   background-color:#555555;
   height:1px;
   margin:10px 0 10px 0;
}

.formRow input, .details-field input{
   border: 1px solid #ccc;
	font-style: italic;
	font-weight: normal;
	font-size: 12px;
	padding: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
}

.formRow select, .sidebar select, .details-field select, .custom-pager select{
   border: 1px solid #ccc;
	height: 24px;
	font-style: italic;
	font-weight: normal;
	font-size: 12px;
	padding: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
}

.search .buttons{
   text-align:right;
   margin-top:10px;
}

.datePicker .ajax__calendar_dayname, 
.datePicker .ajax__calendar_today
{
    color:#681888;
    border-bottom:1px solid #E2DCE6;
}
.datePicker .ajax__calendar_day,
.datePicker .ajax__calendar_month,
.datePicker .ajax__calendar_year 
{
    border:1px solid #E2DCE6;
    color:Black;
}

.datePicker .ajax__calendar_container 
{
   background: #E2DCE6;
   border: 1px solid #CCCCCC;
   color:Black;
}
.datePicker .ajax__calendar_other .ajax__calendar_day,
.datePicker .ajax__calendar_other .ajax__calendar_month,
.datePicker .ajax__calendar_other .ajax__calendar_year 
{
    color: #666;
}
.datePicker .ajax__calendar_hover .ajax__calendar_day,
.datePicker .ajax__calendar_hover .ajax__calendar_month,
.datePicker .ajax__calendar_hover .ajax__calendar_year 
{
    color: black;
    border-color:#666;
}
.datePicker .ajax__calendar_active .ajax__calendar_day,
.datePicker .ajax__calendar_active .ajax__calendar_month,
.datePicker .ajax__calendar_active .ajax__calendar_year 
{
    color: #681888;
    font-weight:bold;
    background-color:#efefef;
    border-color:#cccccc;
}
.datePicker .ajax__calendar_title 
{
    color:#681888;
}