﻿
/*

	FORM STYLES
	Contains styles for form builder page (form.aspx) and for all other forms site-wide.

*/

ul.radiolist-vertical,
ul.radiolist-vertical li {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.radiolist-vertical li {
	display: inline;
}

ul.radiolist-vertical li input {
	margin-right: 5px;
}

ul.radiolist-vertical li label {
	margin-right: 10px;
}

ul.radiolist-vertical {
	margin-bottom: 10px;
}

/* Lists of checkboxes */
ul.checklist,
ul.checklist li {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.checklist li {
	margin-bottom: 5px;
}

ul.checklist li input {
	margin-right: 5px;
}

.required {
	color:#F00;
}

/* validation errors */
.validation_error {
	background:#FFF url(/images/validartion_error.png) no-repeat 0 0;
	width:17px;
	height:17px;
	text-indent:-9999px;
	position:absolute;
	top:2px;
	right:2px;
}

/* front end dual list control */
.duallist_control .duallist_wrap ul li {
	float:left;
}

.duallist_control .duallist_wrap ul li.id_02 {
	margin:0 10px;
}

.duallist_control .duallist_wrap ul li.id_02 input {
	float:left;
	clear:left;
	margin:0 0 2px;
	width:40px;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:11px;
}

.duallist_control .duallist_wrap ul li select {
	width:200px;
	padding:5px;
	font-family:Arial, Helvetica, sans-serif;
}

.rednote {
	color:#F00;
	font-size:11px;
}

.form_wrap fieldset ul.duallist_control {
	margin:0 0 7px;
}

.form_wrap fieldset ul.duallist_control li {
	margin:0 0 5px;
}

.form_wrap fieldset ul.duallist_control li ul li {
	margin:0;
}

/* image/avatar upload */
.image_upload ul {
	float:right;
	width:305px;
}

.image_upload ul li img {
	display:block;
	margin:0 0 10px;
}

/* multi date selectors */
.form_wrap fieldset .multi_date_selector ul li {
	margin:0 0 5px;
}

.form_wrap fieldset .multi_date_selector ul li label {
	display:block;
	margin:0;
}

.form_wrap fieldset .multi_date_selector ul li select {
	width:180px;
}

.form_wrap hr {
	margin:20px 0;
	background-color:#CCC;
	border:none;
	color:green;
	height:1px;
}

/* pagetool popup forms */


.dialog .form_wrap fieldset.user_input label {
	width:100px;
}

.dialog .form_wrap fieldset.user_input input.input_type_text,
.dialog .form_wrap fieldset.user_input textarea {
	width:250px;
}

.form_captcha fieldset {
	border:none;
}

.form_captcha fieldset input {
	border:solid 1px #CCC;
	width:80px;
	padding:2px;
}

.subnote {
	margin:5px 0 0;
}

.subnote p {
	font-size:11px;
}




/* [FORMS BUILT WITH DIV BASED MARKUP, TO BE USED ONLY FOR FORM BUILDER] */


.form_wrap .form_group {
	margin:0 0 10px;
	overflow:hidden;
	zoom:1;
}

.form_wrap .form_group .form_group_label {
	width:120px;
	margin:0 20px 0 0;
	float:left;
}

.form_wrap .form_group .form_group_label label {
	font-weight:bold;
}

.form_wrap .form_group .form_group_content {
	overflow:hidden;
	zoom:1;
}

.form_wrap .select .form_group_content input,
.form_wrap .select .form_group_content label {
	vertical-align:middle;
}

.form_wrap .select .form_group_content input {
	margin:0 7px 0 0;
}

.form_wrap .form_group .form_group_content ul {
	list-style:none;
}

.form_wrap .form_group .desc {
	font-size:11px;
	color:#333;
	line-height:1.3;
}

.form_wrap .form_group_wrap {
	overflow:hidden;
	zoom:1;
	margin:0 0 10px;
}

.form_wrap .form_group_wrap .form_group {
	float:left;
	margin:0 20px 0 0;
}








/**********************************

[WEBSITE FORM STANDARDS] 


/* the markup for forms across the site is the following:
<ul>
  <li> 
     <label> 
	 <input> 
  </li>
  <li>
    <ul class="double_column">    // this split the content of the list element in two floating sub lists
		<li>
		   <label> 
		   <input> 
		</li>
		<li>
		   <label> 
		   <input> 
		</li>
    </ul>
  </li>
  <li>  
     <label> 
	 <div class="inline_label">  // this is usedto display inline checkboxes and radioboxes
		   <checkbox> 
		   <label> 
		   <checkbox> 
		   <label> 
		   <checkbox> 
		   <label> 
	 </div>
  </li>

</ul>


***********************************/



.form_wrap ul {
	overflow:hidden;
	zoom:1;
	list-style:none;
	padding:0;
	margin:0;
	list-style-position:outside;
}
.form_wrap ul li {
	margin:0 0 5px;
	overflow:hidden;
	zoom:1;
	min-height:30px;
}

.form_wrap ul li label
 {
    float: left;
    font-weight: bold;
    margin: 0 20px 0 0;
    width: 120px;
}


.form_wrap ul li ul li label {
    margin: 0 20px 0 0;
    width: 215px;
}



.form_wrap .select{
    margin: 0 0 30px;
    overflow: hidden;
}



.form_wrap .select .form_group_content ul li {
	float:none;
	min-height:20px;
	_height:20px;
	margin-bottom:5px;
}


.form_wrap .select .form_group_content ul li label {
    color: #333333;
    float: left;
    font-size: 12px;
    margin: 0 10px 3px 0;
    width: 526px;
	line-height:1.2em;
}



.form_wrap fieldset {
	border:none;
	margin:0;
    padding: 0;
}

.form_wrap legend {
	display:none
}

.form_wrap .head {
	margin:0 0 20px;
}

.form_wrap .input_type_text,
.form_wrap .input_type_password,
.form_wrap  input[type=text],
.form_wrap  input[type=password],
.form_wrap select,
.form_wrap textarea {
	border:solid 1px #CCC;
	width:250px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	 box-shadow:inset 0px 1px 1px #CCC;
    -moz-box-shadow:inset 0px 1px 1px #CCC;
    -webkit-box-shadow:inset 0px 1px 1px #CCC;
	color: #444444;


}

.form_wrap .input_type_text:focus,
.form_wrap .input_type_password:focus,
.form_wrap  input[type=text]:focus,
.form_wrap  input[type=password]:focus,
.form_wrap select:focus,
.form_wrap textarea:focus {
	border:solid 1px #999;
}

.form_wrap .input_type_text,
.form_wrap .input_type_password,
.form_wrap  input[type=text],
.form_wrap  input[type=password],
.form_wrap textarea{
	padding: 5px 3px;
}


.form_wrap .input_type_text.labeler
{
    color: #999999;
}



.form_wrap select {
	padding:5px 1px;
	width:258px;
}


.form_wrap input_type_checkbox,
.form_wrap input_type_radio,
.form_wrap  input[type=checkbox],
.form_wrap  input[type=radio]
 {
	display:inline;
	width:15px;
	float:left;
	margin-left:0;	
}


/* default double column markup */

.double_column,
ul.double_column {
	overflow:hidden;
	zoom:1;
	padding:0;
	margin:0;
}
.double_column li,
ul.double_column li {
	float:left;
	margin:0 20px 10px 0;
	width: 224px;
} 
.double_column li.id_02,
ul.double_column li.id_02 {
	margin:0;
} 
.double_column li ul li,
ul.double_column li ul li {
	float:none;
	width:auto;
}

.form_wrap ul.double_column li textarea, 
.form_wrap ul.double_column li .input_type_text, 
.form_wrap ul.double_column li select {
    width: 100px;
}



/* default inline form elements*/


.form_wrap ul li .inline_list label {
    float: left;
    font-weight: normal !important;
    margin: 0 20px 0 0;
    width: auto !important;
}




/* forms inside of lead panels on pages such as news.aspx and jobs.aspx, news_list.aspx, events_list.aspx */

.treble_column .search_panel .form_wrap,
.search_panel .right  .form_wrap {
	width:510px;
}

.treble_column .search_panel .form_wrap ul,
.search_panel .right .form_wrap ul {
	width:530px;
}

.treble_column .search_panel .form_wrap ul li label,
.search_panel .right .form_wrap ul li label {
	width:75px;
}


.treble_column  .input_type_text,
.search_panel .input_type_text,
.treble_column  .input_type_password,
.search_panel .input_type_password,
.treble_column  input[type=text],
.search_panel input[type=text],
.treble_column  input[type=password],
.search_panel input[type=password],
.treble_column  textarea
.search_panel textarea
{
	width: 364px;
}

.treble_column .search_panel .form_wrap ul li select,
.search_panel .right .form_wrap ul li select {
	width:373px;
}

.treble_column .search_panel .form_wrap ul li ul li input,
.search_panel .right .form_wrap ul li ul li input {
  width: 121px;
}

.treble_column .search_panel .form_wrap ul li ul li select,
.search_panel .right  .form_wrap ul li ul li select{
	width:129px;
}





/* forms as part of secondary lead elements */


.sublead.panel .form_wrap  .input_type_text,
.sublead.panel .form_wrap  .input_type_text,
.sublead.panel .form_wrap  input[type="text"], 
.sublead.panel .form_wrap  input[type="text"] {
    width: 165px;
}

.sublead.panel .form_wrap  select {
    width: 173px;
}
.sublead.panel .form_wrap  label {
    width: 85px;
}




.sublead.panel ul.double_column  {
	width:300px;
} 


.sublead.panel .double_column li,
.sublead.panel ul.double_column li {
	float:left;
	margin:0 20px 10px 0;
	width:126px;
} 


.sublead.panel .double_column li,
.sublead.panel ul.double_column li {
	float:left;
	margin:0 20px 0 0;
	width:160px;
} 


.sublead.panel .form_wrap ul.double_column label {
    width: 65px;
	margin-right:10px;
}



.sublead.panel .form_wrap ul.double_column input {
    width: 60px;
}




/* forms on right hand side column */

.sideright .panel ul.double_column  {
	width:300px;
} 


.sideright .panel .double_column li,
.sideright .panel ul.double_column li {
	float:left;
	margin:0 20px 10px 0;
	width:89px;
} 


.sideright .panel .double_column li,
.sideright .panel ul.double_column li {
	float:left;
	margin:0 20px 0 0;
	width:89px;
} 

.treble_column_equal .sideright .form_wrap ul.double_column input, 
.treble_column .sideright .form_wrap ul.double_column input {
    width: 81px;
}

/* advanced search form */
.page_advanced_site_search .main .form_wrap  {
	width:680px;
}

.page_advanced_site_search .main .form_wrap ul{
	width:680px;
}

.page_advanced_site_search .main .form_wrap ul li label {
	width:110px;
}

.page_advanced_site_search .main .form_wrap ul li input {
	width:522px;
}

.page_advanced_site_search .main .form_wrap ul li ul li {
	width:320px;
}
.page_advanced_site_search .main .form_wrap ul li ul li input {
	width:182px;
}

.page_advanced_site_search .main .form_wrap ul li ul li select {
	width:190px;
}

.page_advanced_site_search .main .form_wrap ul li ul li.small select {
	width:60px;
}

/* Course search form */

.page_search_course .main .form_wrap  {
	width:auto;
}

.page_search_course .main .form_wrap ul{
	width:750px;
}

.page_search_course .main .form_wrap ul li label {
	width:75px;
}

.page_search_course .main .form_wrap ul li input {

}

.page_search_course .main .form_wrap ul li ul li {
	width:310px;
}
.page_search_course .main .form_wrap ul li ul li input {
	width:191px;
}

.page_search_course .main .form_wrap ul li ul li input[type=submit] {
	width:auto;
}

.page_search_course .main .form_wrap ul li ul li select {
	width:200px;
}

.page_search_course .main .form_wrap ul li ul li.small select {
	width:60px;
}

/* side forms on pages such as blogs.aspx */
.treble_column_equal .sideright .form_wrap ul label,
.treble_column .sideright .form_wrap ul label {
	float:none;
	width:auto;
	margin:0 0 3px;
}

.treble_column_equal .sideright .form_wrap ul input,
.treble_column .sideright .form_wrap  ul input {
	width:170px;
}

.treble_column_equal .sideright .form_wrap ul select,
.treble_column .sideright .form_wrap select {
	width:178px;
}

.treble_column_equal .sideright .form_wrap .user_submit,
.treble_column .sideright .form_wrap .user_submit {
	margin:10px 0 0;
}




/* captcha */


.id_captcha .input_type_text,
.id_captcha  input[type=text]
{
	width:115px;
}



/***************************************************

	SITE-WIDE BUTTON REPLACEMENT.
	Default button class should be applied to all buttons which you wish to apply image replacement to. 
	Default class contains the common height of all common buttons on the given website, for example; 32px.
	Width of any given button should be defined inside of its individual button class, inside of the 'button array' below.
	
******************************************************/

/* default button style */
.body .input_type_submit,
.body  input[type=submit],
.body  .btn,
.dialog .input_type_submit,
.dialog  input[type=submit],
.dialog  .btn
 {
	background-color:#C0C0C0;
	border:none;
	background:url(/images/buttonGrad.png) repeat-x 0 50%;
	border:solid 1px #fff;
	color:#666;
	text-shadow:0 1px 0 #FFF;
	font-weight:bold;
	padding:3px 12px;
	cursor:pointer;
	// font-family:Verdana, Geneva, sans-serif;
	font-size:13px;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	overflow:visible;
	display:inline-block;
	// font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	-moz-box-shadow:0 1px 0 #999999;
	/* -webkit-box-shadow:0 1px 0 #999999; */
	/* box-shadow:0 1px 0 #999999; */
	margin-bottom: 1px;
}

a.btn {
	text-decoration:none;
}

.input_type_submit:hover,
input[type=submit]:hover,
.btn:hover {
	color:#333;
}

.btn_site_search,
input[type=submit].btn_site_search
 {
	background: url(/images/search_lens.png) no-repeat 0 0 #FFF;
	width:31px;
	height:30px;
	text-indent:-9999px;
	font-size:0;
	line-height:0;
	border:none;
	padding:0;
	-moz-border-radius:0;
	-webkit-border-radius:0;
	border-radius:0;
	-moz-box-shadow:0 0 0 #fff;
	-webkit-box-shadow:0 0 0 #fff;
	box-shadow:0 0 0 #fff;
}

