﻿/*
Copyright 2009 GoldenTwine Informatics
Style Name: GTI - Form Style Web 2.0
Description: Custom design for forms at GoldenTwine Informatics
Version: 2.1 Last Updated: Aug 11, 2009
Author: Subrato Paul
Author URL: http://www.goldentwine.com/wds.htm
W3C CSS Validator - Valid CSS level 2.1 (12/8/2009)
*/
	/* reset styles for forms */
	body,div,ul,li,p,blockquote,form,fieldset,legend,input,textarea{padding:0;margin:0;}
	body{text-align:center;font-family:verdana,arial,sans-serif;}
	div,p,blockquote,form{display:block;}
	fieldset{border:0;}
	li{list-style:none;}
	form, fieldset {padding:0;margin:0;}
	fieldset {border:1px solid #000;}
	legend {color:#000;padding:0;}
	input, textarea, select {font-family:inherit;font-size:11px;}
	select {padding:0;}
	a img {border:none;}
	/* general styles */
	a:link,a:visited {color:#A3756E;text-decoration:none;}
	a:hover,a:active {color:#7D4A42;text-decoration:none;} /*#003595*/
	a.pop:link,a.pop:visited {padding-right:13px;}
	a.pop:hover,a.pop:active {padding-right:13px;background:transparent url(http://www.goldenTwine.com/btn/icnPop.gif) center right no-repeat;}
	.cbFs {color:#787878;background-color:#EFF9FA;border:1px solid #C8C8C8;}
	.cfb {color:#787878;padding:5px;border:1px solid #eee;}
	.cmnt, .msg, .inf, .hnt, .hlp, .wrn {text-indent:16px;}
	.cmnt {background:transparent url(http://www.goldenTwine.com/btn/icnCmnt.gif) no-repeat 2px 50%;}
	.msg {background:transparent url(http://www.goldenTwine.com/btn/btnMsg.gif) no-repeat 2px 50%;}
	.inf {background:transparent url(http://www.goldenTwine.com/btn/icnInf.gif) no-repeat top left;background-attachment:scroll}
	.hnt {background:#B0BDC6 url("http://www.goldenTwine.com/btn/btnHnt.gif") no-repeat 2px 50%;}
	.hlp {background:#B0BDC6 url("http://www.goldenTwine.com/btn/btnHlp.gif") no-repeat 2px 50%;}
	.wrn {background:#B0BDC6 url("http://www.goldenTwine.com/btn/btnWrn.gif") no-repeat 2px 50%;}
	img.lftImg {float:left;padding:0px;margin:0 5px 2px 0;} 
	img.rhtImg {float:right;padding:2px;margin:0 0 2px 5px;} 
.br{color:#b70000}

	.hlpC {cursor:help}
	#hlpTip {position:absolute;left:-300px;z-index:100;visibility:hidden;width:150px;text-align:left;font-family:verdana,arial,sans-serif;font-weight:bold;font-size:9px;color:#937015;background:#FFFFE1;padding:2px;border:1px solid #EABA00}
	#hlpPointer {position:absolute;left:-300px;z-index:101;visibility:hidden;}
	ul.btnNav {list-style:none;text-align:center;padding:.25em 0;border-top:1px solid #666;margin:0 2em 5px;} 
	ul.btnNav li {list-style:none;} 
	ul.btnNav li a {width:5em;display:block;text-align:center;font-weight:bold;font-size:.8em;color:#FFF;background-color:#036;padding:.15em 0;text-decoration:none;} 
	ul.btnNav li a:hover {color:#FFF;background-color:#69C;text-decoration:none;} 
	ul.btnNav .lft {float:left;width:5em;}
	ul.btnNav .rht {float:right;width:5em;}
	.clrL {clear:left;}
	p {text-align:justify;padding:0 5px;margin:0 0 1em;}
/* containers */
#frmConOu {width:600px;}
#frmCon {width:500px;}
	#frmCon2 {width:300px;float:left;}
#frmConOu, #frmCon, #frmCon2,.frmFbk {text-align:left;font-size:10px;line-height:1.25;color:#3670a7;background:#f2efeb;border:1px solid #d3d3d3;padding:5px;margin:10px auto;}

.pnlOne, .pnlTwo {background:#f8f8ff url('http://www.goldenTwine.com/asset/pnlGy.jpg') repeat-x left bottom;padding:5px 10px 10px;border-top:1px solid #ddd;border-right:1px solid #7f7f7f;border-bottom:1px solid #ddd;border-left:1px solid #ddd}
.pnlOne {border-bottom:1px solid #7f7f7f}
.pnlTwo {background-position:left top;border-top-color:#8f8b8b}
.conInf {color:#807970;background:#eee url(http://www.goldenTwine.com/btn/icnInf.gif) no-repeat 5px 28px;padding:0;border:1px solid #C8C8C8} /*color:#787878,#898378*/
.pnlOne h1 {height:20px;text-align:center;font-weight:700;font-size:14px;color:#8f8b8b;background:#d0d0d0;padding:2px;border-bottom:1px solid #999;margin:0 0 5px}
.conInf p {text-indent:22px}

form.frm {background:url(http://www.goldenTwine.com/asset/bgFrmBl1.jpg) repeat-y;padding:5px;border:1px solid #aacfe4;border-left:none;margin:0 0 5px}
form p {padding-top:0.75em}
form small, br.sml {display:block;font-weight:normal;font-size:10px}
form small {margin:5px 0 0 200px}
form.sml {padding:1px 5px;margin:0 0 5px 10px}
.asterisk {position:relative;top:-0.3em;left:-0.25em;width:7px;height:7px}

fieldset{padding:0;border:1px solid #ebf4fb;margin-bottom:5px}
fieldset.nb {border:none}
fieldset.bt {border:none;border-top:1px solid #E2ECE9}
fieldset.nl {border:1px solid #aacfe4;border-left:none}
fieldset.p5 {padding-bottom:5px}
fieldset.p10 {padding:10px}
fieldset.grp{border:none;/*margin:5px 0 0;*/}
fieldset.grp label{/*margin-left: 5px;*/text-align:left}
fieldset.grp legend{display:none} /* in case someone adds a legend */

form legend {padding:0 2px 0 5px;}
form legend {font-variant:small-caps;font-size:11px;color:#3d5686;background:inherit;margin:5px 0}
/*\*//*/ legend {display:inline-block;} /* IE Mac legend fix */

.row,.rowC{clear:left;min-height:30px;padding:5px;margin:0}
.rowC{text-align:center}
.rowSb{clear:left;min-height:20px;padding:2px 4px;margin:0}
.lbl,.lbl2,.lbl3,.lbl4,.lblSb{display:block;float:left;width:200px;min-height:20px;text-align:left;vertical-align:top;font-weight:bold;line-height:15px;padding:0;margin:5px 0 0;cursor:default}
.lbl2{width:150px}
.lbl3{width:130px}
.lbl4{width:120px}
.lblSb{width:140px}
label{cursor:pointer}
label.lrg{font-size:12px}
	/*label.act{font-weight:bold}*/
label.psv{cursor:default}

/* text inputs ? display:inline; ? */
form input[type="text"],form input[type="email"],form input[type="password"],   input.txt,    input.ph,input.sb,select.slct,select.mslct,textarea
{vertical-align:middle;font-size:11px;line-height:15px;color:#102132;background:#f2f7fb;padding:3px;border:solid 1px #d3d3d3;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;margin:5px 0 0}
form input[type="text"],form input[type="email"],form input[type="password"],   input.txt,    input.ph{width:200px;height:15px}
input.sb{width:140px;height:15px}
input.ctr {width:25px;height:12px;font-size:9px;padding:0;border:1px solid #c8c8c8;background:#f0fe6;cursor:default}
/* selects */
select.slct {width:202px;height:auto;}
/* multiple selects */
select.mslct {width:200px;height:auto;}
/*option {color:#4A4A4A;  background:#inherit;margin-left:5px;background:#f2f2e6;padding:3px 0;  font:10px; max-height:120px; overflow-y:auto; overflow-x:hidden;}*/
option {height:18px;}

/* textareas */
textarea {width:200px;height:60px;overflow:auto}
textarea.full {width:98%;height:120px;margin:5px 5px 0}
textarea.tools{width:100%;/*margin:5px 0*/}

/* hovered */
input[type="text"]:hover,input[type="email"]:hover,input[type="password"]:hover,    input.txt:hover, input.ph:hover, select.slct:hover,select.mslct:hover,textarea:hover
{background:#ebf4fb;border:solid 1px #b7ddf2;cursor:pointer}
/* focused */
input[type="text"]:focus,input[type="email"]:focus,input[type="password"]:focus,    input.txt:focus, input.ph:focus, select.slct:focus,select.mslct:focus,textarea:focus
{color:#787878;background:#f9fbfd;
border:solid 1px #fc86fc;
-webkit-box-shadow:0 1px 3px #fc86fc inset, 0 1px 0 #fc86fc;
-moz-box-shadow:0 1px 3px #fc86fc inset, 0 1px 0 #fc86fc;
box-shadow:0 1px 3px #fc86fc inset, 0 1px 0 #fc86fc;
} /*border:solid 1px #d7e5f2; f7fafd */
input[type="text"]:focus,input[type="email"]:focus,input[type="password"]:focus,    input.txt:focus, textarea:focus {cursor:text;}

/*checkbox and radio */
input[type="checkbox"],input[type="radio"]{width:12px;height:12px;border:1px solid transparent;cursor:pointer}
	.box {width:12px;height:12px;border:1px solid transparent;cursor:pointer} /*delete later*/

/* buttons */
	.btn{width:125px;height:26px;font-variant:small-caps;letter-spacing:1px;font-weight:bold;font-size:12px;line-height:26px;color:#fff;
	background:url(//www.goldenTwine.com/btn/btnFrm.png) repeat-x 0 0;padding:0;border:0;margin:0;cursor:pointer}
	.btn:hover{background-position:0 100%}
/* css3 btn8 */
input[type="submit"],input[type="reset"],  button.btn8{
width:125px;height:26px;font-variant:small-caps;letter-spacing:1px;font-weight:bold;font-size:12px;line-height:26px;color:#fff;text-shadow:0 -1px 1px #71145c;
background:-moz-linear-gradient(0% 100% 90deg, #165090 0%, #165090 50%, #005aa0 50%, #6fbbf3 100%) repeat scroll 0 0 transparent;
padding:0;border:0;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;margin:0;
-moz-box-shadow:0 0 2px 1px #73b4e5 inset, 0 1px 2px 0 #111111;
}
input[type="submit"]:hover,input[type="reset"]:hover,  button.btn8:hover{
background:-moz-linear-gradient(0% 100% 90deg, #6fbbf3 0%, #005aa0 50%, #005aa0 50%, #6fbbf3 100%) repeat scroll 0 0 transparent;
cursor:pointer;
}
/* Green Form Button
min-width:120px;letter-spacing:1px;font-weight:bold;line-height:40%;
color:#fff;background:-moz-linear-gradient(center top , #779d19, #9fc04b) repeat scroll 0 0 transparent;
padding:5px 10px;border:0;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;
margin-right:15px;cursor:pointer
 */

	.btnSubmit{float:left;position:relative;width:149px;height:35px;color:#fff;font-size:14px;font-weight:bold;text-align:center;vertical-align:middle;background:url(http://www.goldenTwine.com/btn/btnSubmit.png) no-repeat;padding:0 0 0 0;border:none;margin:0;cursor:pointer}
	.btnSubmit:hover{background-position:0 -37px}
	.btnSubmit:active{position:relative;top:1px}

.btnLft,.btnRht{width:6px;height:26px}
.btnLft{background:url(//www.goldenTwine.com/btn/btnFrmLft.png) no-repeat 0 0}
.btnRht{background:url(//www.goldenTwine.com/btn/btnFrmRht.png) no-repeat 0 0}

/* upload files */
.btnBrs {padding-bottom:0; vertical-align:bottom; cursor:pointer; background:url(http://www.goldenTwine.com/btn/btnFrmBrs) no-repeat 0 0; width:60px; height:21px;}
.NFFile {position:relative; margin-bottom:5px;}
.NFFileNew {position:absolute; top:0px; left:0px; z-index:1;}

/* Validation */
.ht5ifv-show-valid{
color:#006633 !important;background-color:#ccffcc !important;border:1px solid green !important}
.ht5ifv-show-invalid{
color:#b50001 !important;
background:#fbf4d8 url('http://www.goldenTwine.com/btn/btnWrn2.png') right 2px no-repeat !important;
border:1px solid #ff3333 !important}
.ht5ifv-show-required{
background-color: #ffcccc; 
}
.ht5ifv-show-min{
background-color: #FF9999; 
}
.ht5ifv-show-max{
background-color: #FF99CC; 
}
.ht5ifv-show-pattern{
background-color: #FFCCFF; 
}
.ht5ifv-show-type{
background-color: #FFCC99; 
}

/*Defaults Styling*/
/*
.NFh {background-position:0 100%;}
.NFhr {background-position:100% 100%;}
input.btn {text-align:center;vertical-align:middle;font-weight:bolder;font-size:12px;color:#FFF;background-image:url(http://www.goldenTwine.com/btn/btnFrm.gif);padding:1px;border:solid 1px #f66;cursor:pointer;}
input.btn:active {background-image:url(http://www.goldenTwine.com/btn/btnFrm.gif);}
	body {font:12px/17px Arial, Helvetica, sans-serif; color:#333; background:#ccc; padding:40px 20px 20px 20px;}
	fieldset {background:#f2f2e6; padding:10px; border:1px solid #fff; border-color:#fff #666661 #666661 #fff; margin-bottom:36px; width:600px;}
	input, textarea, select {font:12px/12px Arial, Helvetica, sans-serif; padding:0;}
	fieldset.action {background:#9da2a6; border-color:#e5e5e5 #797c80 #797c80 #e5e5e5; margin-top:-20px;}
	legend {background:#bfbf30; color:#fff; font:17px/21px Calibri, Arial, Helvetica, sans-serif; padding:0 10px; margin:-26px 0 0 -11px; font-weight:bold; border:1px solid #fff; border-color:#e5e5c3 #505014 #505014 #e5e5c3;}
	label {font-size:11px; font-weight:bold; color:#666;}
	label.opt {font-weight:normal;}
	dl {clear:both;}
	dt {float:left; text-align:right; width:90px; line-height:25px; margin:0 10px 10px 0;}
	dd {float:left; width:475px; line-height:25px; margin:0 0 10px 0;}
	#footer {font-size:11px;}
	#container {width:700px; margin:0 auto;}	fieldset {background:#f2f2e6; padding:10px; border:1px solid #fff; border-color:#fff #666661 #666661 #fff; margin-bottom:36px; width:600px;}
*/

/* Safari */
select,input,textarea button{outline:none}
/*.px3fix class below: Targets IE6 ONLY. Adds 3 pixel indent for multi-line form contents, to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html */
* html .px3fix{margin-left:3px;}
/* end of CSS */
